Initial support for multiple schemas
This commit is contained in:
Dan Sosedoff
@@ -125,7 +125,7 @@
|
||||
display: none;
|
||||
}
|
||||
|
||||
#sidebar div.tables-list #tables, #sequences {
|
||||
#sidebar div.tables-list #tables, #sequences, #objects {
|
||||
padding: 50px 0 0;
|
||||
font-size: 12px;
|
||||
}
|
||||
@@ -170,7 +170,7 @@
|
||||
padding-left: 0px;
|
||||
}
|
||||
|
||||
#sidebar ul {
|
||||
/*#sidebar ul {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
@@ -205,7 +205,7 @@
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
min-width: 100%;
|
||||
}
|
||||
}*/
|
||||
|
||||
#body {
|
||||
position: fixed;
|
||||
@@ -288,6 +288,9 @@
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
#objects {
|
||||
}
|
||||
|
||||
#output {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
@@ -565,6 +568,90 @@
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
/* -------------------------------------------------------------------------- */
|
||||
/* Sidebar Schema Objects */
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
.schema {}
|
||||
.schema i { display: inline-block; margin-right: 4px; }
|
||||
.schema i.fa-folder-o { display: inline-block; }
|
||||
.schema i.fa-folder-open-o { display: none; }
|
||||
.schema.expanded i.fa-folder-open-o { display: inline-block; }
|
||||
.schema.expanded i.fa-folder-o { display: none; }
|
||||
|
||||
.schema .schema-name {
|
||||
font-weight: bold;
|
||||
font-size: 13px;
|
||||
display: block;
|
||||
line-height: 30px;
|
||||
height: 30px;
|
||||
padding: 0px 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.schema .schema-container {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.schema.expanded .schema-container {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.schema .schema-container .schema-group .fa-chevron-down {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.schema .schema-container .schema-group .schema-group-title {
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
line-height: 30px;
|
||||
height: 30px;
|
||||
padding: 0px 8px;
|
||||
}
|
||||
|
||||
.schema .schema-container .schema-group ul {
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.schema .schema-container .schema-group ul li {
|
||||
list-style: none;
|
||||
list-style-type: none;
|
||||
margin: 0px;
|
||||
line-height: 30px;
|
||||
height: 30px;
|
||||
cursor: pointer;
|
||||
padding: 0px 8px;
|
||||
padding-left: 16px;
|
||||
}
|
||||
|
||||
.schema .schema-container .schema-group ul li i {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.schema .schema-container .schema-group ul li.active {
|
||||
background: #dedede !important;
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.schema .schema-container .schema-group ul li:hover {
|
||||
background: #f1f1f1;
|
||||
}
|
||||
|
||||
.schema .schema-container .schema-group.expanded .fa-chevron-down {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.schema .schema-container .schema-group.expanded .fa-chevron-right {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.schema .schema-container .schema-group.expanded ul {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* -------------------------------------------------------------------------- */
|
||||
/* Ace Customizations */
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
@@ -38,8 +38,7 @@
|
||||
<i class="fa fa-database"></i> <span class="current-database" id="current_database"></span>
|
||||
<span class="refresh" id="refresh_tables" title="Refresh tables list"><i class="fa fa-refresh"></i></span>
|
||||
</div>
|
||||
<ul id="tables"></ul>
|
||||
<ul id="sequences"></ul>
|
||||
<div id="objects"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-information">
|
||||
|
||||
168
static/js/app.js
168
static/js/app.js
@@ -1,7 +1,8 @@
|
||||
var editor;
|
||||
var connected = false;
|
||||
var bookmarks = {};
|
||||
var editor = null;
|
||||
var connected = false;
|
||||
var bookmarks = {};
|
||||
var default_rows_limit = 100;
|
||||
var currentTable = null;
|
||||
|
||||
var filterOptions = {
|
||||
"equal": "= 'DATA'",
|
||||
@@ -75,6 +76,7 @@ function apiCall(method, path, params, cb) {
|
||||
});
|
||||
}
|
||||
|
||||
function getObjects(cb) { apiCall("get", "/objects", {}, cb); }
|
||||
function getTables(cb) { apiCall("get", "/tables", {}, cb); }
|
||||
function getTableRows(table, opts, cb) { apiCall("get", "/tables/" + table + "/rows", opts, cb); }
|
||||
function getTableStructure(table, cb) { apiCall("get", "/tables/" + table, {}, cb); }
|
||||
@@ -83,36 +85,70 @@ function getTableConstraints(table, cb) { apiCall("get", "/tables/" + table + "/
|
||||
function getHistory(cb) { apiCall("get", "/history", {}, cb); }
|
||||
function getBookmarks(cb) { apiCall("get", "/bookmarks", {}, cb); }
|
||||
function getSequences(cb) { apiCall("get", "/sequences", {}, cb); }
|
||||
function executeQuery(query, cb) { apiCall("post", "/query", { query: query }, cb); }
|
||||
function explainQuery(query, cb) { apiCall("post", "/explain", { query: query }, cb); }
|
||||
|
||||
function encodeQuery(query) {
|
||||
return window.btoa(query);
|
||||
}
|
||||
|
||||
function executeQuery(query, cb) {
|
||||
apiCall("post", "/query", { query: query }, cb);
|
||||
function buildSchemaSection(name, objects) {
|
||||
var section = "";
|
||||
|
||||
var titles = {
|
||||
"tables": "Tables",
|
||||
"views": "Views",
|
||||
"sequences": "Sequences"
|
||||
};
|
||||
|
||||
var icons = {
|
||||
"tables": '<i class="fa fa-table"></i>',
|
||||
"views": '<i class="fa fa-table"></i>',
|
||||
"sequences": '<i class="fa fa-circle-o"></i>'
|
||||
};
|
||||
|
||||
var klass = "";
|
||||
if (name == "public") klass = "expanded";
|
||||
|
||||
section += "<div class='schema " + klass + "'>";
|
||||
section += "<div class='schema-name'><i class='fa fa-folder-o'></i><i class='fa fa-folder-open-o'></i> " + name + "</div>";
|
||||
section += "<div class='schema-container'>";
|
||||
|
||||
for (group of ["tables", "views", "sequences"]) {
|
||||
if (objects[group].length == 0) continue;
|
||||
|
||||
group_klass = "";
|
||||
if (name == "public" && group == "tables") group_klass = "expanded";
|
||||
|
||||
section += "<div class='schema-group " + group_klass + "'>";
|
||||
section += "<div class='schema-group-title'><i class='fa fa-chevron-right'></i><i class='fa fa-chevron-down'></i> " + titles[group] + " (" + objects[group].length + ")</div>";
|
||||
section += "<ul>"
|
||||
|
||||
for (item of objects[group]) {
|
||||
var id = name + "." + item;
|
||||
section += "<li class='schema-" + group + "' data-type='" + group + "' data-id='" + id + "'>" + icons[group] + " " + item + "</li>";
|
||||
}
|
||||
section += "</ul></div>";
|
||||
}
|
||||
|
||||
section += "</div></div>";
|
||||
|
||||
return section;
|
||||
}
|
||||
|
||||
function explainQuery(query, cb) {
|
||||
apiCall("post", "/explain", { query: query }, cb);
|
||||
}
|
||||
function loadSchemas() {
|
||||
$("#objects").html("");
|
||||
|
||||
function loadTables() {
|
||||
$("#tables li").remove();
|
||||
getObjects(function(data) {
|
||||
for (schema in data) {
|
||||
$(buildSchemaSection(schema, data[schema])).appendTo("#objects");
|
||||
}
|
||||
|
||||
getTables(function(data) {
|
||||
data.forEach(function(item) {
|
||||
$("<li><span><i class='fa fa-table'></i> " + item + " </span></li>").appendTo("#tables");
|
||||
});
|
||||
});
|
||||
}
|
||||
if (Object.keys(data).length == 1) {
|
||||
$(".schema").addClass("expanded");
|
||||
}
|
||||
|
||||
function loadSequences() {
|
||||
$("#sequences li").remove();
|
||||
|
||||
getSequences(function(data) {
|
||||
data.forEach(function(item) {
|
||||
$("<li><span><i class='fa fa-circle-o'></i> " + item + " </span></li>").appendTo("#sequences");
|
||||
});
|
||||
bindContextMenus();
|
||||
});
|
||||
}
|
||||
|
||||
@@ -131,7 +167,7 @@ function unescapeHtml(str){
|
||||
}
|
||||
|
||||
function getCurrentTable() {
|
||||
return $("#tables").attr("data-current") || "";
|
||||
return currentTable;
|
||||
}
|
||||
|
||||
function resetTable() {
|
||||
@@ -158,8 +194,7 @@ function performTableAction(table, action, el) {
|
||||
case "delete":
|
||||
executeQuery("DROP TABLE " + table, function(data) {
|
||||
if (data.error) alert(data.error);
|
||||
loadTables();
|
||||
loadSequences();
|
||||
loadSchemas();
|
||||
resetTable();
|
||||
});
|
||||
break;
|
||||
@@ -459,8 +494,7 @@ function runQuery() {
|
||||
|
||||
// Refresh tables list if table was added or removed
|
||||
if (query.match(re)) {
|
||||
loadTables();
|
||||
loadSequences();
|
||||
loadSchemas();
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -639,6 +673,21 @@ function getConnectionString() {
|
||||
return url;
|
||||
}
|
||||
|
||||
function bindContextMenus() {
|
||||
$(".schema-group ul").each(function(id, el) {
|
||||
$(el).contextmenu({
|
||||
target: "#tables_context_menu",
|
||||
scopes: "li.schema-tables",
|
||||
onItem: function(context, e) {
|
||||
var el = $(e.target);
|
||||
var table = $(context[0]).data("id");
|
||||
var action = el.data("action");
|
||||
performTableAction(table, action, el);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
$("#table_content").on("click", function() { showTableContent(); });
|
||||
$("#table_structure").on("click", function() { showTableStructure(); });
|
||||
@@ -674,6 +723,26 @@ $(document).ready(function() {
|
||||
$(this).addClass("selected");
|
||||
});
|
||||
|
||||
$("#objects").on("click", ".schema-group-title", function(e) {
|
||||
$(this).parent().toggleClass("expanded");
|
||||
});
|
||||
|
||||
$("#objects").on("click", ".schema-name", function(e) {
|
||||
$(this).parent().toggleClass("expanded");
|
||||
});
|
||||
|
||||
$("#objects").on("click", "li", function(e) {
|
||||
currentTable = $(this).data("id");
|
||||
|
||||
$("#objects li").removeClass("active");
|
||||
$(this).addClass("active");
|
||||
$(".current-page").data("page", 1);
|
||||
$(".filters select, .filters input").val("");
|
||||
|
||||
showTableInfo();
|
||||
showTableContent();
|
||||
});
|
||||
|
||||
$("#results").on("click", "th", function(e) {
|
||||
var sortColumn = this.attributes['data'].value;
|
||||
var contentTab = $('#table_content').hasClass('selected');
|
||||
@@ -712,43 +781,8 @@ $(document).ready(function() {
|
||||
$(this).html(textarea).css("max-height", "200px");
|
||||
});
|
||||
|
||||
$("#tables").on("click", "li", function() {
|
||||
$("#tables li.selected").removeClass("selected");
|
||||
$("#sequences li.selected").removeClass("selected");
|
||||
$(this).addClass("selected");
|
||||
$("#tables").attr("data-current", $.trim($(this).text()));
|
||||
$(".current-page").data("page", 1);
|
||||
$(".filters select, .filters input").val("");
|
||||
|
||||
showTableContent();
|
||||
showTableInfo();
|
||||
});
|
||||
|
||||
$("#tables").contextmenu({
|
||||
target: "#tables_context_menu",
|
||||
scopes: "li",
|
||||
onItem: function(context, e) {
|
||||
var el = $(e.target);
|
||||
var table = $.trim($(context[0]).text());
|
||||
var action = el.data("action");
|
||||
performTableAction(table, action, el);
|
||||
}
|
||||
});
|
||||
|
||||
$("#sequences").on("click", "li", function() {
|
||||
$("#tables li.selected").removeClass("selected");
|
||||
$("#sequences li.selected").removeClass("selected");
|
||||
|
||||
$(this).addClass("selected");
|
||||
$("#tables").attr("data-current", $.trim($(this).text()));
|
||||
|
||||
showTableContent();
|
||||
$(".table-information ul").hide();
|
||||
});
|
||||
|
||||
$("#refresh_tables").on("click", function() {
|
||||
loadTables();
|
||||
loadSequences();
|
||||
loadSchemas();
|
||||
});
|
||||
|
||||
$("#rows_filter").on("submit", function(e) {
|
||||
@@ -920,8 +954,7 @@ $(document).ready(function() {
|
||||
}
|
||||
else {
|
||||
connected = true;
|
||||
loadTables();
|
||||
loadSequences();
|
||||
loadSchemas();
|
||||
|
||||
$("#connection_window").hide();
|
||||
$("#current_database").text(resp.current_database);
|
||||
@@ -940,8 +973,7 @@ $(document).ready(function() {
|
||||
}
|
||||
else {
|
||||
connected = true;
|
||||
loadTables();
|
||||
loadSequences();
|
||||
loadSchemas();
|
||||
|
||||
$("#current_database").text(resp.current_database);
|
||||
$("#main").show();
|
||||
|
||||
Reference in New Issue
Block a user