added a sort dialog...

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

ui (gen4)/features/base.js

@@ -785,18 +785,23 @@ module.SortActions = actions.Actions({
 	// XXX should this be a dialog with ability to edit modes???
 	// 		- toggle reverse sort
 	// XXX currently this will not toggle past 'none'
-	toggleImageSort: ['Edit|Sort/Toggle image sort method',
+	toggleImageSort: ['- Edit|Sort/Toggle image sort method',
 		toggler.Toggler(null,
 			function(){ return this.data.sort_method || 'none' },
 			function(){ 
 				return Object.keys(this.config['sort-methods'])
-					.concat(this.data.manual_order ? ['Manual'] : [])},
+					.concat((this.data.manual_order 
+						|| this.data.sort_method == 'Manual') ? ['Manual'] : [])},
 			// prevent setting 'none' as mode...
 			function(mode){ 
 				return !!this.images 
 					&& (mode != 'none' 
 						|| (mode == 'Manual' && this.data.manual_order)) },
-			function(mode){ 
+			// XXX need to refactor the toggler a bit to make the 
+			// 		signature simpler...
+			function(mode, _, reverse){ 
+				reverse = reverse == 'reverse' || reverse
+
 				// save manual order...
 				if(this.data.sort_method == 'Manual'){
 					this.data.manual_order = this.data.order.slice()
@@ -806,10 +811,10 @@ module.SortActions = actions.Actions({
 				// XXX this does not use .sortImages(..) thus this does not update...
 				if(mode == 'Manual'){
 					this.data.order = this.data.manual_order.slice()
-					this.sortImages('update')
+					this.sortImages('update' + (reverse ? ' reverse' : ''))
 
 				} else {
-					this.sortImages(mode) 
+					this.sortImages(mode + (reverse ? ' reverse' : ''))
 				}
 
 				this.data.sort_method = mode

ui (gen4)/features/keyboard.js

@@ -24,6 +24,7 @@ var drawer = require('lib/widget/drawer')
 
 /*********************************************************************/
 
+// XXX might be a good idea to be able ignore actions rather than keys...
 // XXX add this to the global doc...
 var GLOBAL_KEYBOARD =
 module.GLOBAL_KEYBOARD = {
@@ -55,6 +56,8 @@ module.GLOBAL_KEYBOARD = {
 		L: 'toggleSlideshowLooping',
 	},
 
+	// XXX do we need to prevent up/down navigation here, it may get confusing?
+	// XXX do we need to disable fast sorting here???
 	'Single Image': {
 		pattern: '.single-image-mode',
 		ignore: [
@@ -63,9 +66,6 @@ module.GLOBAL_KEYBOARD = {
 			// do not crop in single image mode...
 			'C', 'F2',
 
-			// XXX not sure about this...
-			//'Up', 'Down',
-
 			// zooming...
 			'#0', '#1', '#2', '#3', '#4', '#5', '#6', '#7', '#8', '#9',
 		],
@@ -79,6 +79,7 @@ module.GLOBAL_KEYBOARD = {
 		Esc: 'toggleSingleImage: "off" -- Exit single image view',
 
 		// ignore sorting and reversing...
+		// XXX not sure about these yet, especially reversing...
 		R: {
 			shift: 'IGNORE',
 		},
@@ -284,7 +285,8 @@ module.GLOBAL_KEYBOARD = {
 			default: 'slideshowDialog',
 			//shift: 'sortImages: "Date" -- Sort images by date',
 			shift: 'sortImages -- Sort images',
-			alt: 'browseActions: "/Sort/"',
+			//alt: 'browseActions: "/Sort/"',
+			alt: 'sortDialog',
 			// XXX need to make this save to base_path if it exists and
 			// 		ask the user if it does not... now it always asks.
 			ctrl: 'saveIndexHere',

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

@@ -132,7 +132,9 @@ var SlideshowActions = actions.Actions({
 							// update slideshow menu...
 							oo.client.open(function(){
 								o.client.update()
-								o.client.select(txt)
+									.then(function(){
+										o.client.select(txt)
+									})
 							})
 						})
 

ui (gen4)/features/ui.js

@@ -19,6 +19,9 @@ var ribbons = require('ribbons')
 var core = require('features/core')
 var base = require('features/base')
 
+var overlay = require('lib/widget/overlay')
+var browse = require('lib/widget/browse')
+
 
 
 /*********************************************************************/
@@ -737,6 +740,10 @@ module.Viewer = core.ImageGridFeatures.Feature({
 		'base',
 		'workspace',
 	],
+	suggested: [
+		'ui-sort',
+		// XXX add base ui features here...
+	],
 
 	actions: ViewerActions,
 
@@ -797,6 +804,99 @@ module.Viewer = core.ImageGridFeatures.Feature({
 
 
 
+/*********************************************************************/
+// User interfaces for different base features...
+
+var SortUIActions = actions.Actions({
+	config: {
+		'default-sort-order': 'default',
+	},
+
+	toggleDefaultSortOrder: ['- Edit|Sort/Default sort order',
+		core.makeConfigToggler('default-sort-order', ['default', 'reverse'])],
+	sortDialog: ['Edit|Sort/Sort images...',
+		function(){
+			var that = this
+
+			// XXX might be a good idea to make this generic...
+			var _makeTogglHandler = function(toggler){
+				return function(){
+					var txt = $(this).find('.text').first().text()
+					that[toggler]()
+					o.client.update()
+						.then(function(){ o.client.select(txt) })
+					that.toggleSlideshow('?') == 'on' 
+						&& o.close()
+				}
+			}
+
+			var o = overlay.Overlay(this.ribbons.viewer, 
+				browse.makeLister(null, function(path, make){
+					var cur = that.toggleImageSort('?')
+
+					that.toggleImageSort('??').forEach(function(mode){
+						// skip 'none'...
+						if(mode == 'none'){
+							return
+						}
+						make(mode + (cur == mode ? ' *' : ''))
+							.on('open', function(){
+								that.toggleImageSort(null, mode, 
+									that.config['default-sort-order'] == 'reverse')
+								o.close()
+							})
+					})	
+
+					// Commands...
+					make('---')
+
+					make('Reverse images')
+						.on('open', function(){
+							that.reverseImages()
+							o.close()
+						})
+					/*
+					make('Reverse ribbons')
+						.on('open', function(){
+							that.reverseRibbons()
+							o.close()
+						})
+					*/
+
+					// Settings...
+					make('---')
+
+					make(['Default order: ', that.config['default-sort-order'] || 'ascending'])
+						.on('open', _makeTogglHandler('toggleDefaultSortOrder'))
+						.addClass('item-value-view')
+				}))
+
+			// select the current order...
+			o.client.select('"' + this.toggleImageSort('?') + ' *"')
+
+			return o
+		}]	
+})
+
+var SortUI = 
+module.SortUI = core.ImageGridFeatures.Feature({
+	title: '',
+	doc: '',
+
+	tag: 'ui-sort',
+	depends: [
+		'ui',
+	],
+
+	actions: SortUIActions,
+})
+
+
+// XXX tag dialogs...
+// XXX
+
+
+
 /*********************************************************************/
 // Utilities and Services...
 

ui (gen4)/index.html

@@ -130,10 +130,12 @@ body {
 
 
 /* Metadata viewer */
+.item-value-view .text:first-child,
 .browse-widget.metadata-view .list>div .text:first-child {
 	width: 50%;
 	font-weight: bold;
 }
+.item-value-view .text:nth-child(2),
 .browse-widget.metadata-view .list>div .text:nth-child(2) {
 	font-style: italic;