From d30849f387f04eb22dd4626c3bf1b68c46f19140 Mon Sep 17 00:00:00 2001 From: "Alex A. Naanou" Date: Sat, 21 Sep 2013 03:09:19 +0400 Subject: [PATCH] reworked the crop modes, now can be nested (still need some work) + some minor tweaks... Signed-off-by: Alex A. Naanou --- ui/data.js | 20 +++++++++++--------- ui/keybindings.js | 28 +++++++++++++++++----------- ui/layout.css | 8 ++++++++ ui/layout.less | 6 ++++++ ui/marks.js | 12 ++++++++---- ui/modes.js | 31 +++++++++++++++++++++++++++---- ui/ui.js | 8 ++++++-- 7 files changed, 83 insertions(+), 30 deletions(-) diff --git a/ui/data.js b/ui/data.js index 940d8069..809e7543 100755 --- a/ui/data.js +++ b/ui/data.js @@ -1613,17 +1613,19 @@ function showAllData(){ var prev_state = DATA var cur = DATA.current - DATA = getAllData() - CROP_STACK = [] + if(CROP_STACK.length != 0){ + DATA = getAllData() + CROP_STACK = [] - // XXX do we need to check if this exists??? - // ...in theory, as long as there are no global destructive - // operations, no. - // keep the current position... - DATA.current = cur + // XXX do we need to check if this exists??? + // ...in theory, as long as there are no global destructive + // operations, no. + // keep the current position... + DATA.current = cur - reloadViewer() - updateImages() + reloadViewer() + updateImages() + } return prev_state } diff --git a/ui/keybindings.js b/ui/keybindings.js index 88ffc3c6..46ebea1e 100755 --- a/ui/keybindings.js +++ b/ui/keybindings.js @@ -184,13 +184,19 @@ var KEYBOARD_CONFIG = { title: 'Marked only and single ribbon views', doc: 'To show marked-only images press shift-F2 and for single ribbon mode press F3.', - Esc: doc('Exit mode', - function(){ - // add something like uncrop here... - toggleMarkedOnlyView('off') - toggleSingleRibbonMode('off') - return false - }), + Esc: { + default: doc('Uncrop to last state', + function(){ + uncropLastState() + return false + }), + shift: doc('Exit crop mode', + function(){ + toggleMarkedOnlyView('off') + toggleSingleRibbonMode('off') + return false + }), + }, Q: 'Esc', }, @@ -588,16 +594,16 @@ var KEYBOARD_CONFIG = { F2: { default: doc('Toggle mark visibility', function(){ toggleMarkesView() }), - shift: doc('Toggle marked only images view', + shift: doc('Crop marked only images', function(){ - toggleMarkedOnlyView() + toggleMarkedOnlyView('on') }), }, - F3: doc('Toggle single ribbon view (EXPERIMENTAL)', + F3: doc('Crop single ribbon', function(){ event.preventDefault() - toggleSingleRibbonMode() + toggleSingleRibbonMode('on') }), E: doc('Open image in external software', openImage), diff --git a/ui/layout.css b/ui/layout.css index 39a84007..bf11de12 100644 --- a/ui/layout.css +++ b/ui/layout.css @@ -1140,6 +1140,14 @@ button:hover { display: inline-block; min-height: 50px; min-width: 300px; + /* XXX for some reason this is not sized correctly... */ + + max-height: 90%; + max-width: 90%; + /* XXX this needs to be lower priority than max-height... */ + + /*overflow-y: auto;*/ + color: white; border: solid silver 1px; border-radius: 3px; diff --git a/ui/layout.less b/ui/layout.less index d0a404db..e44f1dea 100755 --- a/ui/layout.less +++ b/ui/layout.less @@ -1182,6 +1182,12 @@ button:hover { min-height: 50px; min-width: 300px; + /* XXX for some reason this is not sized correctly... */ + max-height: 90%; + max-width: 90%; + + /* XXX this needs to be lower priority than max-height... */ + /*overflow-y: auto;*/ color: white; border: solid silver 1px; diff --git a/ui/marks.js b/ui/marks.js index dc4f7646..818f0cd4 100755 --- a/ui/marks.js +++ b/ui/marks.js @@ -50,17 +50,21 @@ var toggleMarkedOnlyView = createCSSClassToggler( '.viewer', 'marked-only-view cropped-mode', function(action){ - // prevent reentering... - if(action == 'on' && $('.viewer').hasClass('cropped-mode') - || action == toggleMarkedOnlyView('?')){ + //// prevent reentering... + //if(action == 'on' && $('.viewer').hasClass('cropped-mode') + // || action == toggleMarkedOnlyView('?')){ + if(action == 'on' && toggleSingleImageMode('?') == 'on'){ return false } }, function(action){ if(action == 'on'){ + // XXX do nothing if there is no change... + // XXX cropMarkedImages() } else { - uncropData() + //uncropData() + showAllData() } }) diff --git a/ui/modes.js b/ui/modes.js index 0115bfcc..070dbfc4 100755 --- a/ui/modes.js +++ b/ui/modes.js @@ -177,21 +177,44 @@ var toggleSingleRibbonMode = createCSSClassToggler( '.viewer', 'single-ribbon-mode cropped-mode', function(action){ - // prevent reentering... - if(action == 'on' && $('.viewer').hasClass('cropped-mode') - || action == toggleSingleRibbonMode('?')){ + //// prevent reentering... + //if(action == 'on' && $('.viewer').hasClass('cropped-mode') + // || action == toggleSingleRibbonMode('?')){ + // prevent mixing marked-only and single-ribbon modes... + if(action == 'on' && toggleMarkedOnlyView('?') == 'on'){ return false } }, function(action){ if(action == 'on'){ + // XXX do nothing if there is no change... + // XXX cropDataTo(DATA.ribbons[getRibbonIndex()].slice()) } else { - uncropData() + //uncropData() + showAllData() } }) +function uncropLastState(){ + if(toggleSingleRibbonMode('?') == 'off' + && toggleMarkedOnlyView('?') == 'off'){ + return + } + + // exit cropped mode... + if(CROP_STACK.length == 1){ + toggleSingleRibbonMode('off') + toggleMarkedOnlyView('off') + + // ucrop one state... + } else { + uncropData() + } +} + + // TODO transitions... // TODO a real setup UI (instead of prompt) var toggleSlideShowMode = createCSSClassToggler( diff --git a/ui/ui.js b/ui/ui.js index 4f19e46e..4b7b71c6 100755 --- a/ui/ui.js +++ b/ui/ui.js @@ -150,9 +150,13 @@ function flashRibbonIndicator(){ } return flashing_indicator +// .stop() +// .show() +// .delay(200) +// .fadeOut(500) .show() - .delay(200) - .fadeOut(500) + .delay(100) + .fadeOut(300) }