UI and design tweaks

This commit is contained in:
Dan Sosedoff 2017-10-13 23:04:19 -05:00
parent fc01b1db81
commit 046022221e
4 changed files with 68 additions and 24 deletions

File diff suppressed because one or more lines are too long

View File

@ -114,16 +114,29 @@
#sidebar input.typeahead {
display: none;
width: 160px;
background: #79589f;
width: 200px;
height: 22px;
color: black;
color: #fff;
font-weight: normal;
outline: none;
border: 0px none;
}
#sidebar input.typeahead::-webkit-input-placeholder {
color: #d6cce2;
}
#sidebar ul.typeahead {
margin-left: 30px;
overflow-y: auto;
max-height: 300px;
z-index: 999;
}
#sidebar ul.typeahead a {
font-size: 13px;
padding: 3px 10px;
}
#sidebar div.tables-list {
@ -692,4 +705,4 @@
.ace_active-line {
background: none !important;
}
}

View File

@ -41,7 +41,7 @@
<div class="wrap">
<div class="title main">
<i class="fa fa-database"></i> <span class="current-database" id="current_database"></span>
<input class="typeahead current_database" id="database_search" type="text" placeholder="Search...">
<input class="typeahead current_database" id="database_search" type="text" placeholder="Search database">
<span class="refresh" id="refresh_tables" title="Refresh tables list"><i class="fa fa-refresh"></i></span>
</div>
<div id="objects"></div>

View File

@ -857,6 +857,27 @@ function toggleDatabaseSearch() {
$("#database_search").toggle();
}
function enableDatabaseSearch(data) {
var input = $("#database_search");
input.typeahead("destroy");
input.typeahead({
source: data,
minLength: 0,
items: "all",
autoSelect: false,
fitToElement: true
});
input.typeahead("lookup").focus();
input.on("focusout", function(e){
toggleDatabaseSearch();
input.off("focusout");
});
}
$(document).ready(function() {
$("#table_content").on("click", function() { showTableContent(); });
$("#table_structure").on("click", function() { showTableStructure(); });
@ -1051,20 +1072,7 @@ $(document).ready(function() {
$("#current_database").on("click", function(e) {
apiCall("get", "/databases", {}, function(resp) {
toggleDatabaseSearch();
var input = $("#database_search");
input.typeahead("destroy");
input.typeahead({
source: resp,
minLength: 0,
items: "all",
autoSelect: false,
fitToElement: true
});
input.typeahead("lookup").focus();
input.on("focusout", function(e){
toggleDatabaseSearch();
input.off("focusout");
});
enableDatabaseSearch(resp);
});
});