Allow keyboard shortcuts to be disabled by the user. Fixes #247, #244, …

…#154, #88, #201
jsbin · Jul 23, 2012 · 6b085ab · 6b085ab
1 parent a5ee37d
commit 6b085ab
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 10 deletions.
diff --git a/public/css/style.css b/public/css/style.css
@@ -27,8 +27,9 @@ p {
 }
 
 td small {
-  display: block;
-  line-height: 14px;
+  /*display: block;*/
+  /*line-height: 14px;*/
+  font-size: 10px;
 }
 
 input {
@@ -306,7 +307,7 @@ iframe.javascript {
 }
 
 #sharemenu .disabled strong:after {
-  content: ' requires ownership of bin';
+  content: ' click to activate';
   font-size: 10px;
   color: #999;
 }
@@ -1767,6 +1768,38 @@ a.active:hover {
 
 #jsconsole-sandbox { display: none;}
 
+/* input style - note: moz-shadow purposely omitted because it affects layout */
+#console form { padding: 5px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
+#exec, .fakeInput { 
+  resize: none; position: absolute; left: 0; right: 0; border: 0; /*padding: 5px; */outline: 0; color: #000; height: 24px; line-height: 24px; overflow: hidden; 
+}
+
+#exec:before, .fakeInput:before { 
+  font-family: monospace; 
+  font-size: 13px; 
+  line-height: 14px;
+  content: '❯ '; 
+  color: #3583FC; 
+  font-weight: bold; 
+  margin-left: 5px; 
+}
+
+
+/* code complete visual tweaks */
+#cursor { display: inline-block; height: 24px; min-width: 1px; outline: 0; top: 0; left: 0; z-index: 999;}
+
+/* HACK */
+#console form { position: relative; top: 0; width: 100%; z-index: 20; }
+#console { padding-top: 35px; }
+#exec, .fakeInput { position: relative; height: auto; }
+
+#cursor { height: auto; white-space: pre-wrap; }
+
+#exec, .fakeInput { cursor: text; }
+#exec .suggest { color: #999; }
+
+
+
 /* font size control */
 /*#console { top: 35px; bottom: 35px; }*/
 #output li, #exec, .fakeInput { min-height: 20px; font-size: 13px; font-family: MesloLGMDZ, "Menlo", consolas, monospace; }

diff --git a/public/js/editors/keycontrol.js b/public/js/editors/keycontrol.js
@@ -3,7 +3,16 @@
 
 var keyboardHelpVisible = false;
 
-$body.keydown(keycontrol);
+var customKeys = objectValue('jsbin.settings.keys') || {};
+
+$('#disablekeys').attr('checked', customKeys.disabled).change(function () {
+  if (!jsbin.settings.keys) {
+    jsbin.settings.keys = {};
+  }
+  jsbin.settings.keys.disabled = this.checked;
+});
+
+if (!customKeys.disabled) $body.keydown(keycontrol);
 
 var panelShortcuts = {}
 //   49: 'javascript', // 1
@@ -28,14 +37,13 @@ if (/macintosh|mac os x/.test(ua)) {
 
 // var closekey = $.browser.platform == 'mac' ? 167 : 192;
 
-$document.keydown(function (event) {
-  if (event.ctrlKey) event.metaKey = true;
-
-  var customKeys = objectValue('jsbin.settings.keys') || {},
-      includeAltKey = event.altKey, //customKeys.useAlt ? event.altKey : true,
+if (!customKeys.disabled) $document.keydown(function (event) {
+  var includeAltKey = event.altKey, //customKeys.useAlt ? event.altKey : true,
       closekey = customKeys.closePanel ? customKeys.closePanel : 192
       $history = $('#history');
 
+  if (event.ctrlKey) event.metaKey = true;
+
   if (event.metaKey && event.which == 79) {
     $('.homebtn').click();
     event.preventDefault();

diff --git a/views/index.html b/views/index.html
@@ -322,7 +322,7 @@ <h2>Keyboard Shortcuts</h2>
         <td>cmd + ] (or shift + tab)</td>
         <td>Unindents selected lines</td>
       </tr>
-      <!-- <tr><td colspan="2"><br><small>Note that Mac users can use cmd in place of ctrl</small></td></tr> -->
+      <tr><td colspan="2"><br><input type="checkbox" id="disablekeys"> Disable all keyboard shortcuts <small>(refresh required)</small></td></tr>
     </tbody>
   </table>
 </div>