rewritten the keyboard handler, now it is configurable in runtime...

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

ui/fullscreen.html

@@ -34,10 +34,13 @@ body {
 <!-- XXX STUB -->
 <script src="images.js"></script>
 <script src="gallery-prototype.js"></script>
-
 <script src="ui.js"></script>
 <script src="markers.js"></script>
 
+<!-- keep this after anything it uses -->
+<script src="keybindings.js"></script>
+
+
 <!--script src="gallery.js"></script-->
 
 <script>

ui/gallery-prototype.js

@@ -1,55 +1,6 @@
 // XXX need a uniform way to address images (filename?)
 /******************************************* Setup Data and Globals **/
 
-// key configuration...
-// XXX need to make this handle modifiers gracefully...
-var keys = {
-	toggleHelp: [72],							//	???
-	toggleSingleImageMode: [70, 13],			//	f, Enter
-	toggleSingleImageModeTransitions: [84],		//	t
-	toggleTransitions: [65],					//	a
-	toggleBackgroundModes: [66],				//	b
-	toggleControls: [9],						// tab
-	close: [27, 88, 67],						//	???
-
-	// zooming...
-	zoomIn: [187],								//	+
-	zoomOut: [189],								//	-
-	// zoom presets...
-	fitOne: [49],								//	1
-	fitThree: [51],								//	3
-	// XXX is this relivant?
-	zoomOriginal: [48],							//	0
-
-	first: [36],								//	Home
-	last: [35],									//	End
-	previous: [37, 80, 188, 8],					//	Left, BkSp, p, <
-	next: [39, 78, 190, 32],					//	Right, Space, n, >
-	// these work with ctrl and shift modifiers...
-	down: [40],									//	Down
-	up: [38],									//	Up
-	// these work with ctrl modifier...
-	promote: [45],								//	???
-	demote: [46],								//	???
-
-	// XXX should these be s-up, s-down, ... ??
-	moveViewUp: [75],							//	k
-	moveViewDown: [74],							//	j
-	moveViewLeft: [72],							//	h
-	moveViewRight: [76],						//	l
-	
-	centerCurrentImage: [79],					//	o
-
-	toggleMarkers: [77],						//	m
-
-	// keys to be ignored...
-	ignore: [16, 17, 18],						//	???, ???, ???
-
-	// print unhandled keys...
-	helpShowOnUnknownKey: true
-}
-
-
 // the list of style modes...
 // these are swithched through in order by toggleBackgroundModes()
 var BACKGROUND_MODES = [
@@ -243,7 +194,8 @@ function setupEvents(){
 	})
 	// keyboard...
 	$(document)
-		.keydown(handleKeys)
+		.keydown(makeKeyboardHandler(keybindings, function(k){alert(k)}))
+		//.keydown(handleKeys)
 	// swipe...
 	$('.viewer')
 		.swipe({
@@ -353,77 +305,67 @@ function alignRibbons(){
 
 
 
-// XXX revise...
+// XXX we essentially need three things:
-function handleKeys(event){
+// 		- keycodes, including modifier keys
-	var code = event.keyCode, fn = $.inArray;
+// 		- function
-	var _ = (fn(code, keys.close) >= 0) ? function(){}()
+// 		- meta information...
-		: (fn(code, keys.first) >= 0) ? firstImage()
+/*
-		: (fn(code, keys.next) >= 0) ? nextImage()
+ * Basic key format:
-		: (fn(code, keys.previous) >= 0) ? prevImage()
+ * 		<key-code> : <callback>,
-		: (fn(code, keys.last) >= 0) ? lastImage()
+ * 		<key-code> : {
-		: (fn(code, keys.promote) >= 0) ? function(){
+ * 			default: [<callback>, <doc>],
-			if(event.ctrlKey){
+ *			// a modifier can be any single modifier, like shift or a 
-				createRibbon('next')
+ *			// combination of modifers like 'ctrl+shift', given in order 
+ *			// of priority.
+ *			// supported modifiers are (in order of priority):
+ *			//	- ctrl
+ *			//	- alt
+ *			//	- shift
+ * 			<modifer>: [...]
+ * 		},
+ *		// alias...
+ * 		<key-code-a> : <key-code-b>,
+ */
+
+function makeKeyboardHandler(keybindings, unhandled){
+	if(unhandled == null){
+		unhandled = function(){return false}
 	}
-			shiftImageDown()
+	console.log(keybindings)
-		}()
+	return function(evt){
-		: (fn(code, keys.demote) >= 0) ? function(){
+		var key = evt.keyCode
-			if(event.ctrlKey){
+		// XXX ugly...
-				createRibbon('prev')
+		var modifers = evt.ctrlKey ? 'ctrl' : ''
+		modifers += evt.altKey ? (modifers != '' ? '+alt' : 'alt') : ''
+		modifers += evt.shiftKey ? (modifers != '' ? '+shift' : 'shift') : ''
+
+		var handler = keybindings[key]
+
+		// alias...
+		while (typeof(handler) == typeof(123)) {
+			handler = keybindings[handler]
 		}
-			shiftImageUp()
+		// no handler...
-		}()
+		if(handler == null){
-		: (fn(code, keys.down) >= 0) ? function(){
+			return unhandled(key)
-			if(event.shiftKey){
+		}
-				if(event.ctrlKey){
+		// complex handler...
-					createRibbon('next')
+		if(typeof(handler) == typeof({})){
+			var callback = handler[modifers]
+			if(callback == null){
+				callback = handler['default']
+			}
+			if(callback != null){
+				callback()
+				return false
 			}
-				shiftImageDown()
 		} else {
-				focusBelowRibbon()
+			// callback...
+			handler() 
+			return false
 		}
-		}()
+		return unhandled(key)
-		: (fn(code, keys.up) >= 0) ? function(){
-			if(event.shiftKey){
-				if(event.ctrlKey){
-					createRibbon('prev')
 	}
-				shiftImageUp()
-			} else {
-				focusAboveRibbon()
-			}
-		}()
-		// zooming...
-		: (fn(code, keys.zoomIn) >= 0) ? scaleContainerBy(ZOOM_FACTOR)
-		: (fn(code, keys.zoomOut) >= 0) ? scaleContainerBy(1/ZOOM_FACTOR)
-		// zoom presets...
-		: (fn(code, keys.zoomOriginal) >= 0) ? setContainerScale(1)
-		: (fn(code, keys.fitOne) >= 0) ? fitImage()
-		: (fn(code, keys.fitThree) >= 0) ? fitThreeImages()
-
-		// moving view...
-		: (fn(code, keys.moveViewUp) >= 0) ? moveViewUp()
-		: (fn(code, keys.moveViewDown) >= 0) ? moveViewDown()
-		: (fn(code, keys.moveViewLeft) >= 0) ? moveViewLeft()
-		: (fn(code, keys.moveViewRight) >= 0) ? moveViewRight()
-		: (fn(code, keys.centerCurrentImage) >= 0) ? centerCurrentImage()
-
-		: (fn(code, keys.toggleSingleImageMode) >= 0) ? toggleSingleImageMode()
-		: (fn(code, keys.toggleSingleImageModeTransitions) >= 0) ? toggleSingleImageModeTransitions()
-		: (fn(code, keys.toggleTransitions) >= 0) ? toggleTransitions()
-
-		: (fn(code, keys.toggleBackgroundModes) >= 0) ? toggleBackgroundModes()
-		: (fn(code, keys.toggleControls) >= 0) ? toggleControls()
-
-		// debug...
-		: (fn(code, keys.toggleMarkers) >= 0) ? toggleMarkers()
-
-		: (fn(code, keys.ignore) >= 0) ? false
-
-
-		: (keys.helpShowOnUnknownKey) ? function(){alert(code)}()
-		: false;
-	return false;
 }
 
 
@@ -444,6 +386,7 @@ var ORIGINAL_FIELD_SCALE = 1
 var NORMAL_MODE_BG = null 
 var SINGLE_IMAGE_MODE_BG = BACKGROUND_MODES[BACKGROUND_MODES.length-1]
 
+
 var toggleSingleImageMode = createCSSClassToggler('.viewer', 'single-image-mode', 
 		// pre...
 		function(action){

ui/gallery.html

@@ -31,10 +31,12 @@ body {
 <!-- XXX STUB -->
 <script src="images.js"></script>
 <script src="gallery-prototype.js"></script>
-
 <script src="ui.js"></script>
 <script src="markers.js"></script>
 
+<!-- keep this after anything it uses -->
+<script src="keybindings.js"></script>
+
 <!--script src="gallery.js"></script-->
 
 <script>

ui/keybindings.js

@@ -0,0 +1,77 @@
+var keybindings = {
+	//72: 	toggleHelp,										//	???
+	70:		toggleSingleImageMode,							//	f
+	13:		70,												//	Enter
+	84:		toggleSingleImageModeTransitions,				//	t
+	65:		toggleTransitions,								//	a
+	66:		toggleBackgroundModes,							//	b
+	9:		toggleControls,									//	tab
+	77:		toggleMarkers,									//	m
+
+	// zooming...
+	187:	function(){scaleContainerBy(ZOOM_FACTOR)},		//	+
+	189:	function(){scaleContainerBy(1/ZOOM_FACTOR)},	//	-
+	// zoom presets...
+	48:	{
+		'default':	fitImage,								// 	0
+		'ctrl':		function(){setContainerScale(1)},		//	ctrl+0
+	},
+	51:		fitThreeImages,									//	3
+
+	36:		firstImage,										//	Home
+	35:		lastImage,										//	End
+
+	37: 	prevImage,										// 	Left
+	80: 	37, 											// 	BkSp
+	188:	37, 											//	p
+	8:		37,												//	<
+	39:		nextImage,										//	Right
+	32:		39,												//	Space
+	190:	39,												//	m
+	78: 	39,												//	>
+
+	// these work with ctrl and shift modifiers...
+	40:	{
+		'default': focusBelowRibbon,						//	Down
+		'shift': shiftImageDown,							//	shift-Down
+		'ctrl+shift': function(){							//	ctrl-shift-Down
+			createRibbon('next')
+			shiftImageDown()
+		}
+	}, //	Down
+	38: {
+		'default': focusAboveRibbon,						//	Up
+		'shift': shiftImageUp,								//	shift-Up
+		'ctrl+shift': function(){							//	ctrl-shift-Up
+			createRibbon('prev')
+			shiftImageUp()
+		}
+	},
+
+	// XXX should these be s-up, s-down, ... ??
+	75:		moveViewUp,										//	k
+	74:		moveViewDown,									//	j
+	72:		moveViewLeft,									//	h
+	76:		moveViewRight,									//	l
+
+	79:		centerCurrentImage,								//	o
+
+	
+	// ignore the modifiers...
+	16:		function(){},
+	17:		16,
+	18:		16,
+}
+/*
+	close: [27, 88, 67],						//	???
+
+	// these work with ctrl modifier...
+	promote: [45],								//	???
+	demote: [46],								//	???
+
+
+	// print unhandled keys...
+	helpShowOnUnknownKey: true
+*/
+
+// vim:set ts=4 sw=4 nowrap :