reworked the crop modes, now can be nested (still need some work) + some minor tweaks...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>

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
 }

ui/keybindings.js

@@ -184,13 +184,19 @@ var KEYBOARD_CONFIG = {
 		title: 'Marked only and single ribbon views',
 		doc: 'To show marked-only images press <b>shift-F2</b> and for single ribbon mode press <b>F3</b>.',
 
-		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),

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;

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;

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()
 			}
 		})
 

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(

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)
 }