added more control and persistance to status bar index...

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

ui (gen4)/features/ui-slideshow.js

@@ -20,6 +20,14 @@ var overlay = require('lib/widget/overlay')
 
 
 
+/*********************************************************************/
+
+var _cmpTimes = function(a, b){
+	return Date.str2ms(a) - Date.str2ms(b)
+}
+
+
+
 /*********************************************************************/
 
 // XXX would be a good idea to add provision for a timer to indicate 
@@ -65,6 +73,7 @@ var SlideshowActions = actions.Actions({
 				browse.makeList(
 					null,
 					[
+						// XXX make this editable...
 						['Interval: ', 
 							function(){ return that.config['slideshow-interval'] }],
 						['Direction: ', 
@@ -90,7 +99,12 @@ var SlideshowActions = actions.Actions({
 							var to_remove = []
 							var oo = overlay.Overlay(that.ribbons.viewer, 
 								browse.makeList( null, 
-									that.config['slideshow-intervals'], 
+									that.config['slideshow-intervals']
+										.concat([
+											// XXX do we add a new item here???
+											//'---', 
+											//'New'
+										]), 
 									{itemButtons: [
 										// mark for removal...
 										['×', 
@@ -111,12 +125,18 @@ var SlideshowActions = actions.Actions({
 											}],
 									]})
 									.open(function(evt, time){
-										that.config['slideshow-interval'] = time
+										if(/new/i.test(time)){
+											// XXX edit...
+											// XXX
 
-										// XXX this is ugly...
+										} else {
-										oo.close()
+											that.config['slideshow-interval'] = time
-										o.client.update()
+
-										o.client.select(path.split(':')[0])
+											// XXX this is ugly...
+											oo.close()
+											o.client.update()
+											o.client.select(path.split(':')[0])
+										}
 									}))
 								.close(function(){
 									// remove striked items...
@@ -127,6 +147,17 @@ var SlideshowActions = actions.Actions({
 										that.config['slideshow-intervals'] = lst
 									})
 
+									// XXX add new items...
+									// XXX
+
+									// sort the times...
+									that.config['slideshow-intervals'] =
+										that.config['slideshow-intervals']
+											.sort(function(a, b){
+												return Date.str2ms(a) - Date.str2ms(b)
+											})
+
+
 									// XXX this is ugly...
 									o.focus()
 
@@ -282,7 +313,6 @@ module.Slideshow = core.ImageGridFeatures.Feature({
 
 	tag: 'ui-slideshow',
 	depends: [
-		'workspace',
 		'ui',
 		'ui-single-image-view',
 	],

ui (gen4)/features/ui-status.js

@@ -45,7 +45,6 @@ var makeStateIndicatorItem = function(container, type, text){
 // XXX revise how/where info is displayed...
 var StatusBarActions = actions.Actions({
 	config: {
-		// XXX for some reason this does not load as default...
 		'status-bar-mode': 'minimal',
 		'status-bar-modes': [
 			'none',
@@ -71,6 +70,8 @@ var StatusBarActions = actions.Actions({
 		],
 
 		'status-bar-index': {
+			'mode': 'normal',
+
 			// NOTE: this would need to reconstruct the status bar for 
 			// 		changes to take effect, i.e. call .resetStatusBar()
 			// XXX might be a good idea to run an editor on click on
@@ -79,6 +80,7 @@ var StatusBarActions = actions.Actions({
 
 			'live-update-on-edit': false,
 		},
+
 	},
 
 	__statusbar_elements__: {
@@ -98,8 +100,7 @@ var StatusBarActions = actions.Actions({
 							.attr('info', 'Image position (click to toggle ribbon/global)')
 							// toggle index state...
 							.click(function(){
-								$(this).parent()
+								that.toggleStatusBarIndexMode()
-									.toggleClass('global')
 								that.updateStatusBar()
 							})
 						// editable...
@@ -141,7 +142,7 @@ var StatusBarActions = actions.Actions({
 							.keyup(function(){
 								event.stopPropagation()
 
-								that.config['status-bar-index']['live-update-on-edit']
+								(that.config['status-bar-index'] || {})['live-update-on-edit']
 									&& that.focusImage(i,
 										item.hasClass('global') ? 'global' : undefined)
 							})
@@ -160,8 +161,7 @@ var StatusBarActions = actions.Actions({
 						.attr('info', 'Image position (click to toggle ribbon/global)')
 						// toggle index state...
 						.click(function(){
-							$(this).parent()
+							that.toggleStatusBarIndexMode()
-								.toggleClass('global')
 							that.updateStatusBar()
 						}))
 
@@ -170,8 +170,15 @@ var StatusBarActions = actions.Actions({
 			}
 
 			// update...
+			// NOTE: using .toggleStatusBarIndexMode(..) here will fall
+			// 		into an infinite recursion...
+			var cls = (that.config['status-bar-index'] || {})['mode'] || 'normal'
+			item
+				.addClass(cls)
+				.removeClass(cls != 'normal' ? 'normal' : 'global')
+
 			// global index...
-			if(item.hasClass('global')){
+			if(cls == 'global'){
 				item.find('.position:not(:focus)')
 					.text(this.data.getImageOrder(gid)+1)
 				item.find('.length')
@@ -410,6 +417,29 @@ var StatusBarActions = actions.Actions({
 			this.toggleStatusBar('none')
 			this.toggleStatusBar(mode)
 		}],
+
+	// XXX should these be here???
+	// XXX should this show a dialog???
+	editStatusBarIndex: ['- Interface/',
+		function(){
+			this.toggleStatusBar('?') == 'none' && this.toggleStatusBar()
+
+			// XXX do this better...
+			this.ribbons.viewer.find('.global-info .index .position').focus().click()
+		}],
+	toggleStatusBarIndexMode: ['Interface/Status bar index mode',
+		toggler.CSSClassToggler(
+			function(){ return this.ribbons.viewer.find('.global-info .index') },
+			['normal', 'global'],
+			function(state){
+				this.toggleStatusBar('?') == 'none' && this.toggleStatusBar()
+
+				this.config['status-bar-index'] = 
+					JSON.parse(JSON.stringify(this.config['status-bar-index']))
+				this.config['status-bar-index']['mode'] = state
+
+				this.updateStatusBar()
+			})],
 })
 
 var StatusBar = 
@@ -419,7 +449,6 @@ module.StatusBar = core.ImageGridFeatures.Feature({
 
 	tag: 'ui-status-bar',
 	depends: [
-		'workspace',
 		'ui',
 
 		// XXX this is here to enable context menu 

ui (gen4)/features/ui.js

@@ -711,6 +711,7 @@ module.Viewer = core.ImageGridFeatures.Feature({
 	depends: [
 		'lifecycle',
 		'base',
+		'workspace',
 	],
 
 	actions: ViewerActions,
@@ -1381,6 +1382,7 @@ module.ConfigLocalStorage = core.ImageGridFeatures.Feature({
 	depends: [
 		'ui',
 	],
+	priority: 80,
 
 	isApplicable: function(){ 
 		return typeof(localStorage) != 'undefined' 

ui (gen4)/ui.js

@@ -71,6 +71,7 @@ module.GLOBAL_KEYBOARD = {
 		pattern: '.slideshow-running',
 		ignore: [
 			'Up', 'Down', 'Enter',
+			'R', 'L',
 		],
 
 		Esc: 'toggleSlideshow: "off"',
@@ -80,6 +81,9 @@ module.GLOBAL_KEYBOARD = {
 		Right: 'resetSlideshowTimer',
 		Home: 'resetSlideshowTimer',
 		End: 'resetSlideshowTimer',
+
+		R: 'toggleSlideshowDirection',
+		L: 'toggleSlideshowLooping',
 	},
 
 	'Global': {
@@ -273,7 +277,11 @@ module.GLOBAL_KEYBOARD = {
 		},
 
 		// XXX for debug...
-		G: function(){ $('.viewer').toggleClass('visible-gid') },
+		G: {
+			default: 'editStatusBarIndex!',
+			shift: 'toggleStatusBarIndexMode!',
+			ctrl: function(){ $('.viewer').toggleClass('visible-gid') },
+		},
 	},
 }