diff --git a/ui/editor.js b/ui/editor.js index 95b30019..4097afcd 100755 --- a/ui/editor.js +++ b/ui/editor.js @@ -9,39 +9,41 @@ /*********************************************************************/ -// ImageGrid-specific editor setup... -function setupEditor(){ - // build the editor... - if($('.panel').length == 0){ - $('.viewer') - .append(makeEditorControls('.current.image') - .addClass('noScroll')) +var toggleEditor = createCSSClassToggler('.viewer', '.editor-visible', + function(action){ + var ed = $('.panel') - // setup the event to update the editor... - .on('focusingImage', function(){ - if($('.panel').css('display') != 'none'){ - reloadControls('.current.image') + if(action == 'on'){ + // create the editor if this is first init... + if(ed.length == 0){ + $('.viewer') + .append(makeEditorControls('.current.image') + .addClass('noScroll') + // make clicks on unfocusable elements remove focus... + .click(function(){ + if(event.target != $('.panel :focus')[0]){ + $('.panel :focus').blur() + } + })) + + // setup the event to update the editor... + .on('focusingImage', function(){ + if(toggleEditor('?') == 'on'){ + reloadControls('.current.image') + } + }) + // show the editor... + } else { + ed.show() } - }) + // update the state... + reloadControls('.current.image') - reloadControls('.current.image') - - // toggle the editor... - // XXX do we need a real mode for this? - } else { - var ed = $('.panel') - - // show... - if(ed.css('display') == 'none'){ - reloadControls('.current.image') - ed.show() - - // hide... - } else { - ed.hide() - } - } -} + // hide... + } else { + ed.hide() + } + }) diff --git a/ui/keybindings.js b/ui/keybindings.js index ec2a55d9..15bea3b7 100755 --- a/ui/keybindings.js +++ b/ui/keybindings.js @@ -118,7 +118,7 @@ var KEYBOARD_CONFIG = { // dialogs... // - '.viewer.overlay .overlay-block.dialog': { + '.viewer.overlay .overlay-block.dialog, .panel :focus': { title: 'Dialog', doc: 'NOTE: to close a dialog, in addition to the keyaboard '+ 'shortcuts, one can also click anywhere outside the dialog.', @@ -128,18 +128,26 @@ var KEYBOARD_CONFIG = { 'insert-return': doc('Insert return'), Enter: { - default: doc('Accept dialog', + default: doc('Accept dialog / input', function(){ var f = $(':focus') // trigger the default button action... if(f.length > 0 - && (/button/i.test(f[0].tagName) - || f.attr('type') == 'button')){ - return true + && (/button|summary/i.test(f[0].tagName) + || /button|checkbox/i.test(f.attr('type')))){ + f.click() + // prevent the key from propagating to the viewer... + return false + + // accept the input... + } else if(toggleEditor('?') == 'on'){ + f.blur() + // prevent the key from propagating to the viewer... + return false // accept the dialog... - } else { + } else if(isOverlayVisible('.viewer')) { getOverlay($('.viewer')).trigger('accept') hideOverlay($('.viewer')) } @@ -149,9 +157,19 @@ var KEYBOARD_CONFIG = { }, Esc: doc('Close dialog', function(){ - //getOverlay($('.viewer')).trigger('close') - hideOverlay($('.viewer')) - return false + if(isOverlayVisible('.viewer')){ + //getOverlay($('.viewer')).trigger('close') + hideOverlay($('.viewer')) + return false + + } else if(toggleEditor('?') == 'on'){ + var f = $(':focus') + if(f.length > 0){ + f.blur() + } else { + toggleEditor('off') + } + } }), }, @@ -703,7 +721,8 @@ var KEYBOARD_CONFIG = { E: { default: doc('Open image in external software', openImage), // XXX Experimental - ctrl: doc('Open preview editor panel (Experimental)', setupEditor), + ctrl: doc('Open preview editor panel (Experimental)', + function(){ toggleEditor() }), }, // XXX make F4 a default editor and E a default viewer... F4: 'E', diff --git a/ui/ui.js b/ui/ui.js index d22a8eab..1721b79d 100755 --- a/ui/ui.js +++ b/ui/ui.js @@ -457,6 +457,10 @@ function hideOverlay(root){ .remove() } +function isOverlayVisible(root){ + return getOverlay(root).css('display') != 'none' +} + var FIELD_TYPES = { // format: