tweaking the slideshow mode...

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

ui/keybindings.js

@@ -46,8 +46,9 @@ var KEYBOARD_CONFIG = {
 	// 		their bindings priority...
 	'.help-mode': {
 		title: 'Help',
-		doc: 'NOTE: In this mode all other key bindings are disabled, except '+
-			'the ones explicitly defined here.',
+		doc: 'To enter this mode press <b>H</b> or <b>?</b>.<br>'+
+			'NOTE: In this mode all other key bindings are disabled, '+
+			'except the ones explicitly defined here.',
 		ignore: '*',
 
 		Esc: doc('Close help',
@@ -65,11 +66,20 @@ var KEYBOARD_CONFIG = {
 	//
 	'.slideshow-mode': {
 		title: 'Slideshow mode',
+		doc: 'To enter this mode press <b>S</b>.',
 
+		// XXX think about what else to disable here...
 		ignore: [
-			'Up', 'Down', 'Enter',
+			'Up', 'Down', 'Enter', 'R', 'L',
 			],
 
+		L: doc('Toggle slideshow looping',
+				function(){
+					SLIDESHOW_LOOP = SLIDESHOW_LOOP ? false : true
+					showStatus('Slideshow: looping', SLIDESHOW_LOOP ? 'enabled...' : 'disabled...')
+					return false
+				}),
+
 		Esc: doc('Exit/stop slideshow', 
 				function(){ 
 					toggleSlideShowMode('off') 
@@ -84,6 +94,7 @@ var KEYBOARD_CONFIG = {
 	//
 	'.single-image-mode': {
 		title: 'Single image mode',
+		doc: 'To toggle between this and ribbon modes press <b>Enter</b>.',
 
 		// XXX this should only work on single image mode...
 		F: doc('Toggle view proportions', 
@@ -104,6 +115,7 @@ var KEYBOARD_CONFIG = {
 	//
 	'.marked-only-view:not(.single-image-mode)': {
 		title: 'Marked only view',
+		doc: 'To toggle this mode press <b>shift-F2</b>.',
 
 		Esc: doc('Exit marked only view', 
 				function(){ 

ui/lib/jli.js

@@ -162,6 +162,7 @@ function createCSSClassToggler(elem, class_list, callback_a, callback_b){
 		// pre callback...
 		if(callback_pre != null){
 			if(callback_pre.call(this, action) === false){
+				// XXX should we return action here???
 				return
 			}
 		}

ui/modes.js

@@ -12,6 +12,12 @@
 // XXX make this save and restore settings...
 var toggleSingleImageMode = createCSSClassToggler('.viewer', 
 		'single-image-mode',
+		function(action){
+			// prevent reiniting...
+			if(action == toggleSingleImageMode('?')){
+				return false
+			}
+		},
 		function(action){
 			var w = getScreenWidthInImages()
 
@@ -59,10 +65,10 @@ var SLIDESHOW_INTERVAL = 3000
 var SLIDESHOW_LOOP = true
 var SLIDESHOW_DIRECTION = 'next'
 
-// TODO account for ribbon start/end (loop or stop slideshow)
 // TODO transitions...
 // TODO a real setup UI (instead of prompt)
-var toggleSlideShowMode = createCSSClassToggler('.viewer', '.slideshow-mode',
+var toggleSlideShowMode = createCSSClassToggler('.viewer', 
+		'.slideshow-mode',
 		function(action){
 			if(action == 'on'){
 				updateStatus('Slideshow...').show()
@@ -80,7 +86,7 @@ var toggleSlideShowMode = createCSSClassToggler('.viewer', '.slideshow-mode',
 
 				SLIDESHOW_INTERVAL = isNaN(interval) ? 3000 : interval*1000
 
-				showStatus('Slideshow: starting...')
+				showStatus('Slideshow: starting', SLIDESHOW_LOOP ? 'looped...' : 'unlooped...')
 
 				toggleSingleImageMode('on')
 				_slideshow_timer = setInterval(function(){