sosedoff/pgweb
1
1
Fork 0
mirror of https://github.com/sosedoff/pgweb.git synced 2024-12-14 19:21:46 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add explain button to query view

Browse Source
This commit is contained in:
Dan Sosedoff 2014-10-14 21:32:46 -05:00
parent 1e40b12bfe
commit 1e4ecd5ba1
3 changed files with 51 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
static/css/app.css
View File

@ -129,12 +129,16 @@
box-shadow: none;
background: #7eb54e;
float: left;
margin-right: 10px;
}
#input .actions .btn-default {
background: #aaa;
}
#input .actions #query_progress {
display: none;
float: left;
margin-left: 12px;
line-height: 30px;
height: 30px;
color: #aaa;
@ -144,10 +148,15 @@
outline: 0 none;
box-shadow: 0;
}
#input .actions .btn:hover {
background: #7eb154;
}
#input .actions .btn-default:hover {
background: #bbb;
}
#output {
position: absolute;
left: 0px;

2
static/index.html
View File

@ -31,6 +31,8 @@
<div id="custom_query"></div>
<div class="actions">
<input type="button" id="run" value="Run Query" class="btn btn-sm btn-primary" />
<input type="button" id="explain" value="Explain Query" class="btn btn-sm btn-default" />
<div id="query_progress">Please wait, query is executing...</div>
</div>
</div>

40
static/js/app.js
View File

@ -144,12 +144,46 @@ function runQuery() {
setCurrentTab("table_query");
$("#run").attr("disabled", "disabled");
$("#explain").attr("disabled", "disabled");
$("#query_progress").show();
executeQuery(editor.getValue(), function(data) {
var query = $.trim(editor.getValue());
if (query.length == 0) {
return;
}
executeQuery(query, function(data) {
buildTable(data);
$("#run").removeAttr("disabled");
$("#explain").removeAttr("disabled");
$("#query_progress").hide();
$("#input").show();
$("#output").removeClass("full");
});
}
function runExplain() {
setCurrentTab("table_query");
$("#run").attr("disabled", "disabled");
$("#explain").attr("disabled", "disabled");
$("#query_progress").show();
var query = $.trim(editor.getValue());
if (query.length == 0) {
return;
}
query = "EXPLAIN " + query;
executeQuery(query, function(data) {
buildTable(data);
$("#run").removeAttr("disabled");
$("#explain").removeAttr("disabled");
$("#query_progress").hide();
$("#input").show();
$("#output").removeClass("full");
@ -190,6 +224,10 @@ $(document).ready(function() {
runQuery();
});
$("#explain").on("click", function() {
runExplain();
});
$("#results").on("click", "tr", function() {
$("#results tr.selected").removeClass();
$(this).addClass("selected");