more work on the keyboard + some bugs found and fixed...

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

ui/ImageGrid.js

@@ -23,7 +23,12 @@
 */
 
 function flashIndicator(direction){
-	$(direction == 'prev' ? '.up-indicator' : '.down-indicator').fadeIn(200).fadeOut(200)
+	$(direction == 'prev' ? '.up-indicator' : '.down-indicator')
+		// NOTE: this needs to be visible in all cases and key press 
+		// 		rhythms... 
+		.show()
+		.delay(20)
+		.fadeOut(200)
 }
 
 
@@ -38,20 +43,23 @@ function getRelativeVisualPosition(outer, inner){
 }
 
 
-// NOTE: if this returns null, it means that the element is smallest in 
+// NOTE: if this can't find an image if an order less, it will return 
-//		target ribbon -- first position.
+// 		the first image in ribbon...
+// NOTE: this might return an empty target if the ribbon is empty...
+// XXX need tp make this loadable ribbon compatible -- the target may 
+// 		not be loaded...
 function getImageBefore(image, ribbon, mode){
 	if(mode == null){
 		mode = NAV_DEFAULT
 	}
-	image = $(image)
+	image = image == null ? $('.current.image') : $(image)
 	if(ribbon == null){
 		ribbon = image.closest('.ribbon')
 	}
 	var images = $(ribbon).find('.image').filter(mode)
 	// XXX need to process/format this correctly...
 	var order = JSON.parse(image.attr('order'))
-	var prev = null
+	var prev = images.first()
 
 	images.each(function(){
 		if(order < $(this).attr('order')){
@@ -395,15 +403,11 @@ function lastImage(mode){
 // NOTE: if moving is 'next' these will chose the image after the current's order.
 // NOTE: if an image with the same order is found, moving argument has no effect.
 // XXX get move direction...
-// XXX this (getImageBefore?) does not appear to work for up when the 
-// 		first image is > than current position...
 function prevRibbon(moving, mode){
 	if(mode == null){
 		mode = NAV_DEFAULT
 	}
 	var cur = $('.current.image')
-	// pre marked-only mode...
-	//var target = getImageBefore(cur, cur.closest('.ribbon').prev('.ribbon'))
 	var target = getImageBefore(cur, cur.closest('.ribbon').prevAll('.ribbon:visible').first())
 	if(moving == 'next' && cur.attr('order') != target.attr('order')){
 		var next = target.nextAll('.image' + mode).first()
@@ -412,15 +416,11 @@ function prevRibbon(moving, mode){
 	return centerImage(focusImage(target))
 }
 // XXX get move direction...
-// XXX this (getImageBefore?) does not appear to work for up when the 
-// 		first image is > than current position...
 function nextRibbon(moving, mode){
 	if(mode == null){
 		mode = NAV_DEFAULT
 	}
 	var cur = $('.current.image')
-	// pre marked-only mode...
-	//var target = getImageBefore(cur, cur.closest('.ribbon').next('.ribbon'))
 	var target = getImageBefore(cur, cur.closest('.ribbon').nextAll('.ribbon:visible').first())
 	if(moving == 'next' && cur.attr('order') != target.attr('order')){
 		var next = target.nextAll('.image' + mode).first()

ui/index.html

@@ -204,44 +204,77 @@
 * XXX move this out to a separate file...
 */
 
+var STEPS_TO_CHANGE_DIRECTION = 2
+var _STEPS_LEFT_TO_CHANGE_DIRECTION = STEPS_TO_CHANGE_DIRECTION
+// XXX code related to this needs testing...
+var DIRECTION = 'next'
+
 var KEYBOARD_CONFIG = {
 	// general setup...
 	'.viewer': {
 		Up: {
-				default: function(){ prevRibbon() },
+				default: function(){ prevRibbon(DIRECTION) },
 				shift: function(){ shiftImageUp() },
 			},
 		Down: {
-				default: function(){ nextRibbon() },
+				default: function(){ nextRibbon(DIRECTION) },
 				shift: function(){ shiftImageDown() },
 			},
 
 		// XXX need to cancel the animation of the prev action...
 		Left: {
-				default: function(){ prevImage() },
+				default: function(){ 
+					if(DIRECTION != 'prev'){
+						_STEPS_LEFT_TO_CHANGE_DIRECTION--
+						if(_STEPS_LEFT_TO_CHANGE_DIRECTION == 0){
+							DIRECTION = 'prev'
+							_STEPS_LEFT_TO_CHANGE_DIRECTION = 2
+						}
+					} else {
+							_STEPS_LEFT_TO_CHANGE_DIRECTION = 2
+					}
+					prevImage() 
+				},
 				// XXX prevScreenImages...
 				ctrl: function(){ 
 					console.log('NotImplemented: screen images back.')
 				},
+				// XXX need to keep shift explicitly clear for editor...
+				/*
 				shift: function(){
 					toggleImageMark()
 					prevImage()
 				},
+				*/
 				// XXX mark screen images...
 				'ctrl+shift': function(){
 					console.log('NotImplemented: mark screen images back.')
 				}
 			},
 		Right: {
-				default: function(){ nextImage() },
+				default: function(){ 
+					if(DIRECTION != 'next'){
+						_STEPS_LEFT_TO_CHANGE_DIRECTION--
+						if(_STEPS_LEFT_TO_CHANGE_DIRECTION == 0){
+							DIRECTION = 'next'
+							_STEPS_LEFT_TO_CHANGE_DIRECTION = 2
+						}
+					} else {
+							_STEPS_LEFT_TO_CHANGE_DIRECTION = 2
+					}
+					nextImage() 
+				},
 				// XXX nextScreenImages...
 				ctrl: function(){ 
 					console.log('NotImplemented: screen images forward.')
 				},
+				// XXX need to keep shift explicitly clear for editor...
+				/*
 				shift: function(){
 					toggleImageMark()
 					nextImage()
 				},
+				*/
 				// XXX mark screen images...
 				'ctrl+shift': function(){
 					console.log('NotImplemented: mark screen images forward.')