balki/pgweb
1
0
Fork 0
Code Pull Requests Activity

Add connection settings form (host, user, port, etc)

Browse Source
This commit is contained in:
Dan Sosedoff
2014-11-06 11:25:53 -06:00
parent ff5a3eea33
commit 1a47e7325a
3 changed files with 434 additions and 338 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
static/index.html
View File

@@ -71,25 +71,73 @@
<div class="connection-settings">
<h1>pgweb</h1>
<form role="form" id="connection_form">
<form role="form" class="form-horizontal" id="connection_form">
<div class="form-group">
<label>Enter server URL scheme</label>
<input type="text" class="form-control" id="connection_url" name="url">
<p class="help-block">URL format: postgres://user:password@host:port/db</p>
<div class="col-sm-12">
<label>Enter server URL scheme</label>
<input type="text" class="form-control" id="connection_url" name="url">
<p class="help-block">URL format: postgres://user:password@host:port/db</p>
</div>
</div>
<hr/>
<div class="form-group">
<label class="col-sm-2 control-label">Host</label>
<div class="col-sm-10">
<input type="text" id="pg_host" class="form-control" />
</div>
</div>
<div class="form-group">
<label>SSL Mode</label>
<select class="form-control" id="connection_ssl">
<option value="disable">disable</option>
<option value="require" selected="selected">require</option>
<option value="verify-full">verify-full</option>
</select>
<label class="col-sm-2">Username</label>
<div class="col-sm-10">
<input type="text" id="pg_user" class="form-control" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2">Password</label>
<div class="col-sm-10">
<input type="text" id="pg_password" class="form-control" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2">Database</label>
<div class="col-sm-10">
<input type="text" id="pg_db" class="form-control" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2">Port</label>
<div class="col-sm-10">
<input type="text" id="pg_port" class="form-control" placeholder="5432" />
</div>
</div>
<div class="form-group">
<label class="col-sm-2">SSL</label>
<div class="col-sm-10">
<select class="form-control" id="connection_ssl">
<option value="disable">disable</option>
<option value="require" selected="selected">require</option>
<option value="verify-full">verify-full</option>
</select>
</div>
</div>
<hr/>
<div id="connection_error" class="alert alert-danger"></div>
<button type="submit" class="btn btn-primary">Connect</button>
<a href="#" id="close_connection_window" class="btn btn-default">Cancel</a>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-primary">Connect</button>
<a href="#" id="close_connection_window" class="btn btn-default">Cancel</a>
</div>
</div>
</form>
</div>
</div>

42
static/js/app.js
View File

@@ -323,6 +323,31 @@ function showConnectionSettings() {
$("#connection_window").show();
}
function getConnectionString() {
var url = $.trim($("#connection_url").val());
var ssl = $("#connection_ssl").val();
if (url.length == 0) {
var host = $("#pg_host").val();
var port = $("#pg_port").val();
var user = $("#pg_user").val();
var pass = $("#pg_password").val();
var db = $("#pg_db").val();
if (port.length == 0) {
port = "5432";
}
url = "postgres://" + user + ":" + pass + "@" + host + ":" + port + "/" + db;
}
if (url.indexOf("sslmode") == -1) {
url += "?sslmode=" + ssl;
}
return url;
}
$(document).ready(function() {
$("#table_content").on("click", function() { showTableContent(); });
$("#table_structure").on("click", function() { showTableStructure(); });
@@ -388,9 +413,13 @@ $(document).ready(function() {
});
$("#connection_url").on("change", function() {
var url = $(this).val();
if ($(this).val().indexOf("localhost") != -1) {
$("#connection_ssl").val("disable");
}
});
if (url.indexOf("localhost") != -1) {
$("#pg_host").on("change", function() {
if ($(this).val().indexOf("localhost") != -1) {
$("#connection_ssl").val("disable");
}
});
@@ -399,17 +428,12 @@ $(document).ready(function() {
e.preventDefault();
var button = $(this).children("button");
var url = $.trim($("#connection_url").val());
var ssl = $("#connection_ssl").val();
var url = getConnectionString();
if (url.length == 0) {
return;
}
if (url.indexOf("sslmode") == -1) {
url += "?sslmode=" + ssl;
}
$("#connection_error").hide();
button.prop("disabled", true).text("Please wait...");