Add a new table to display connection information

static/index.html

@@ -20,6 +20,7 @@
       <li id="table_indexes">Indexes</li>
       <li id="table_query" class="selected">SQL Query</li>
       <li id="table_history">History</li>
+      <li id="table_connection">Connection</li>
     </ul>
   </div>
   <div id="sidebar">

static/js/app.js

@@ -182,6 +182,26 @@ function showQueryPanel() {
   $("#output").removeClass("full");
 }
 
+function showConnectionPanel() {
+  setCurrentTab("table_connection");
+
+  apiCall("get", "/info", {}, function(data) {
+    var rows = [];
+
+    for(key in data) {
+      rows.push([key, data[key]]);
+    }
+
+    buildTable({
+      columns: ["attribute", "value"],
+      rows: rows
+    });
+
+    $("#input").hide();
+    $("#output").addClass("full");
+  });
+}
+
 function runQuery() {
   setCurrentTab("table_query");
 
@@ -294,6 +314,7 @@ $(document).ready(function() {
   $("#table_indexes").on("click",    function() { showTableIndexes();    });
   $("#table_history").on("click",    function() { showQueryHistory();    });
   $("#table_query").on("click",      function() { showQueryPanel();      });
+  $("#table_connection").on("click", function() { showConnectionPanel(); });
 
   $("#run").on("click", function() {
     runQuery();