Permalink
Browse files

Few keyboard shortcuts and tweak to language

  • Loading branch information...
remy committed Mar 27, 2012
1 parent b3ddc04 commit 98bf3f54a15045400b0b1d278501c80731a447d6
Showing with 64 additions and 19 deletions.
  1. +10 −3 css/style.css
  2. +2 −2 index.php
  3. +0 −1 js/chrome/app.js
  4. +3 −3 js/chrome/navigation.js
  5. +9 −0 js/editors/editors.js
  6. +28 −1 js/editors/keycontrol.js
  7. +4 −3 js/editors/libraries.js
  8. +8 −6 js/editors/panel.js
View
@@ -2009,17 +2009,24 @@ div.CodeMirror-selected { background: #d9d9d9; }
.label {
/*overflow: hidden;*/
+ /*min-height: 34px;*/
+ /*line-height: 34px;*/
+ padding: 10px;
+}
+
+.label label {
+ margin: 0;
}
.label .options {
float: right;
display: block;
- height: 35px;
- margin-right: 10px;
+ /*height: 35px;*/
+ /*margin-right: 10px;*/
}
.label .options label {
- height: 35px;
+ /*height: 35px;*/
display: inline-block;
cursor: pointer;
}
View
@@ -129,8 +129,8 @@
<div class="label">
<strong>Live Preview</strong>
<span class="options">
- <button id="runwithalerts">Run with alerts</button>
- <label>Disable JS<input type="checkbox" id="disablejs" checked></label>
+ <button id="runwithalerts">Run JS with alerts</button>
+ <label>Include JS<input type="checkbox" id="enablejs"></label>
</span>
</div>
</div>
View
@@ -61,7 +61,6 @@ $document.one('jsbinReady', function () {
// $sp1.filter(':visible').trigger('init', (splitterSettings[0] || {x:null}).x);
// $sp2.filter(':visible').trigger('init', (splitterSettings[1] || {x:null}).x);
- console.log('>>>>>>>> ready');
$bin.removeAttr('style').addClass('ready');
});
View
@@ -181,7 +181,7 @@ $('#runwithalerts').click(function () {
// TODO memorise
editors.live.disablejs = jsbin.settings.disablejs;
-$('#disablejs').change(function () {
- jsbin.settings.disablejs = editors.live.disablejs = this.checked;
+$('#enablejs').change(function () {
+ jsbin.settings.disablejs = editors.live.disablejs = !this.checked;
editors.live.render();
-}).attr('checked', jsbin.settings.disablejs ? true : false);
+}).attr('checked', jsbin.settings.disablejs ? false : true);
View
@@ -120,6 +120,15 @@ panels.distribute = function () {
}
};
+panels.show = function (panelId) {
+ this.panels[panelId].show();
+ if (this.panels[panelId].editor) {
+ this.panels[panelId].editor.focus();
+ }
+}
+
+panels.focused = null;
+
// dirty, but simple
Panel.prototype.distribute = function () {
panels.distribute();
View
@@ -3,9 +3,21 @@
var keyboardHelpVisible = false;
-function keycontrol(panel, event) {
+$body.keydown(keycontrol);
+
+var panelShortcuts = {
+ 49: 'javascript',
+ 50: 'css',
+ 51: 'html',
+ 52: 'console',
+ 53: 'live'
+};
+
+function keycontrol(event) {
event = normalise(event);
+ var panel = jsbin.panels.focused ? jsbin.panels.focused.editor : {};
+
// these should fire when the key goes down
if (event.type == 'keydown') {
if (panel.id == 'javascript') {
@@ -15,6 +27,21 @@ function keycontrol(panel, event) {
}
}
+ // shortcut for showing a panel
+ if (panelShortcuts[event.which] !== undefined && event.altKey && event.metaKey) {
+ jsbin.panels.show(panelShortcuts[event.which]);
+ event.stop();
+ } else if (event.which === 27 && event.altKey) {
+ jsbin.panels.focused.hide();
+ var visible = jsbin.panels.getVisible();
+ if (visible.length) {
+ jsbin.panels.focused = visible[0];
+ if (visible[0].editor) {
+ visible[0].editor.focus();
+ }
+ }
+ }
+
if (event.which == 191 && event.shiftKey && event.metaKey) {
// show help
$body.toggleClass('keyboardHelp');
View
@@ -59,10 +59,11 @@ Libraries.prototype.init = function () {
jquerymobile : {
text: 'jQuery Mobile',
requires: 'http://code.jquery.com/jquery-1.6.4.min.js',
- style: 'http://code.jquery.com/mobile/1.0b3/jquery.mobile-1.0.min.css',
+ style: 'http://code.jquery.com/mobile/latest/jquery.mobile.css',
scripts: [
- { text: 'jQuery Mobile 1.0', url: 'http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js' },
- { text: 'jQuery Mobile 1.0b3', url: 'http://code.jquery.com/mobile/1.0b3/jquery.mobile-1.0b3.min.js' }
+ { text: 'jQuery Mobile Latest', url: 'http://code.jquery.com/mobile/latest/jquery.mobile.js' },
+ { text: 'jQuery Mobile 1.0.1', url: 'http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.1.min.js' },
+ { text: 'jQuery Mobile 1.1.0rc1', url: 'http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.js' }
]
},
others: {
View
@@ -9,7 +9,7 @@ var editorModes = {
var Panel = function (name, settings) {
var panel = this;
panel.settings = settings = settings || {};
- panel.name = name;
+ panel.id = panel.name = name;
panel.$el = $('.panel.' + name);
panel.el = document.getElementById(name);
panel.order = Panel.order++;
@@ -66,9 +66,9 @@ var Panel = function (name, settings) {
});
this.controlButton.appendTo('#panels');
- this.$el.find('.label').prepend('<a href="#close" class="close"></a>').find('.close').click(function () {
- panel.hide();
- });
+ // this.$el.find('.label').prepend('<a href="#close" class="close"></a>').find('.close').click(function () {
+ // panel.hide();
+ // });
panel.hide();
}
@@ -162,8 +162,10 @@ Panel.prototype = {
return pos.line;
};
- editor.setOption('onKeyEvent', keycontrol);
- this.settings.focus && editor.setOption('onFocus', $.proxy(this.settings.focus, this));
+ // editor.setOption('onKeyEvent', keycontrol);
+ editor.setOption('onFocus', function () {
+ jsbin.panels.focused = panel;
+ });
editor.id = panel.name;

0 comments on commit 98bf3f5

Please sign in to comment.