Commits

Kirill Simonov  committed 1e52982

Added buttons and control keys for shrinking and expanding the text area.

  • Participants
  • Parent commits b0fe7e7

Comments (0)

Files changed (3)

File src/htsql_tweak/shell/static/index.html

       <div class="input-area">
         <div class="editor-box">
           <textarea id="editor"></textarea>
+          <div class="expansion-control">
+            <ul>
+              <li><button id="shrink">&#x25B3;</button></li>
+              <li><button id="expand">&#x25BD;</button></li>
+            </ul>
+          </div>
         </div>
         <div class="button-box">
           <ul>

File src/htsql_tweak/shell/static/shell.css

 .input-area .editor-box .CodeMirror {
   width: 100%;
   height: 100%;
+  line-height: 1.4;
 }
 
 .input-area .editor-box .CodeMirror-scroll {
   border-width: 0 0 1px 0;
 }
 
+.input-area .editor-box .expansion-control {
+  position: absolute;
+  left: 1px;
+  top: 1px;
+  font-size: 70%;
+  line-height: 1;
+  color: #999999;
+}
+
+.input-area .editor-box .expansion-control button:hover {
+  color: #1a1a1a;
+}
+
 .input-area .button-box {
   position: absolute;
   right: 0;
   top: 0;
   font-size: 110%;
   font-weight: bold;
+  color: #999999;
 }
 
 .output-area .notification {

File src/htsql_tweak/shell/static/shell.js

             lastQuery: null,
             lastAction: null,
             table: null,
-            marker: null
+            marker: null,
+            expansion: 0
         }
     }
 
         var editor = CodeMirror.fromTextArea($editor[0], {
             mode: 'htsql',
             onKeyEvent: function(i, e) {
+                // Ctrl-Enter
                 if (e.ctrlKey && e.keyCode == 13) {
                     if (e.type == 'keyup') {
                         $('#run').click();
                     }
                     return true;
                 }
+                // Ctrl-Up
+                if (e.ctrlKey && e.keyCode == 38) {
+                    if (e.type == 'keyup') {
+                        $('#shrink').click();
+                    }
+                    return true;
+                }
+                // Ctrl-Down
+                if (e.ctrlKey && e.keyCode == 40) {
+                    if (e.type == 'keyup') {
+                        $('#expand').click();
+                    }
+                    return true;
+                }
             }
         });
         return editor;
         run(query);
     }
 
+    function clickExpand(dir) {
+        var expansion = state.expansion+dir;
+        if (expansion < -1 || expansion > 3)
+            return;
+        if (state.expansion == -1)
+            $shrink.css({ visibility: 'visible' });
+        if (expansion == -1)
+            $shrink.css({ visibility: 'hidden' });
+        if (state.expansion == 3)
+            $expand.css({ visibility: 'visible' });
+        if (expansion == 3)
+            $expand.css({ visibility: 'hidden' });
+        var height = null;
+        if (expansion < 0)
+            height = 4;
+        else
+            height = 8*(expansion+1);
+        $('.input-area').css({ height: height+'em' });
+        $('.output-area').css({ top: (height+2)+'em' });
+        state.expansion += dir;
+    }
+
     function clickPopups() {
         $popups.hide();
         $popups.children('.popup').hide();
     var $sql = $('#sql');
     var $popups = $('#popups');
     var $morePopup = $('#more-popup');
+    var $shrink = $('#shrink');
+    var $expand = $('#expand');
 
     var editor = makeEditor();
     setQuery(config.queryOnStart);
     $('#close-sql').click(clickClose);
     $('#grid-body').scroll(scrollGrid);
     $('#popups').click(clickPopups);
+    $('#shrink').click(function() { return clickExpand(-1); });
+    $('#expand').click(function() { return clickExpand(+1); });
 
     $('#schema').hide();
     $('#help').hide();