added action handler tags (siplifies removal) + minor tweaking...

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

ui (gen4)/index.html

@@ -33,9 +33,9 @@
 	height: auto;
 	background: black;
 
-	-webkit-transition: all 0.2s ease-in;
-	-moz-transition: all 0.2s ease-in;
-	transition: all 0.2s ease-in;
+	-webkit-transition: all 0.1s ease-in;
+	-moz-transition: all 0.1s ease-in;
+	transition: all 0.1s ease-in;
 }
 .image.moving {
 	visibility: hidden;

ui (gen4)/lib/actions.js

@@ -334,12 +334,12 @@ module.MetaActions = {
 	// Register an action callback...
 	//
 	//	Register a post action callback
-	// 	.on('action', <function>)
-	// 	.on('action.post', <function>)
+	// 	.on('action', [<tag>, ]<function>)
+	// 	.on('action.post', [<tag>, ]<function>)
 	// 		-> <action-set>
 	//
 	// 	Register a pre action callback
-	// 	.on('action.pre', <function>)
+	// 	.on('action.pre', [<tag>, ]<function>)
 	// 		-> <action-set>
 	//
 	// Modes:
@@ -350,8 +350,17 @@ module.MetaActions = {
 	// 	'post'		- the handler is fired after the action is finished.
 	// 					this is the default.
 	//
+	// The optional tag marks the handler to enable group removal via 
+	// .off(..)
+	//
 	// NOTE: 'post' mode is the default.
-	on: function(action, handler){
+	//
+	// XXX add something like text tags to events (extra arg) to enable
+	// 		simple and fast handler removal...
+	on: function(action, b, c){
+		var handler = typeof(c) == 'function' ? c : b
+		var tag = typeof(c) == 'function' ? b : c
+
 		// prepare the handler...
 		var mode = action.split('.')
 		action = mode[0]
@@ -367,9 +376,12 @@ module.MetaActions = {
 
 		// mot pre mode...
 		} else if(mode != 'pre') {
+			// XXX
 			throw 'Unknown action mode: '+action+'.'+mode
 		}
 
+		handler.tag = tag
+
 		// register handlers locally only...
 		if(!this.hasOwnProperty('_action_handlers')){
 			this._action_handlers = {}
@@ -387,34 +399,53 @@ module.MetaActions = {
 
 	// Remove an action callback...
 	//
-	// XXX this will not work for explicit <action>.post...
+	// XXX needs more testing...
 	off: function(action, handler){
 		if(this.hasOwnProperty('_action_handlers')){
-			var mode = action.split('.')
-			action = mode[0]
-			mode = mode[1]
+			if(action == '*'){
+				var actions = Object.keys(this._action_handlers)
+			} else {
+				var actions = [action]
+			}
+			var that = this
+			actions.forEach(function(action){
+				var mode = action.split('.')
+				action = mode[0]
+				mode = mode[1]
 
-			// get the handlers...
-			var h = this._action_handlers[action]
+				// get the handlers...
+				var h = that._action_handlers[action]
 
-			var i = -1
-			if(mode == null || mode == 'post'){
-				// XXX find via e.orig_handler == handler && e.mode == 'post'
-				h.forEach(function(e, j){
-					// NOTE: we will only get the first match...
-					if(e.orig_handler == handler && i == -1){
-						i = j
+				// remove explicit handler...
+				if(typeof(handler) == 'function'){
+					var i = -1
+					if(mode == null || mode == 'post'){
+						// XXX find via e.orig_handler == handler && e.mode == 'post'
+						h.forEach(function(e, j){
+							// NOTE: we will only get the first match...
+							if(e.orig_handler === handler && i == -1){
+								i = j
+							}
+						})
+
+					} else if(mode == 'pre'){
+						i = h.indexOf(handler)
 					}
-				})
 
-			} else if(mode == 'pre'){
-				i = h.indexOf(handler)
-			}
+					// NOTE: unknown modes are skipped...
+					if(i >= 0){
+						h.splice(i, 1)
+					}
 
-			// NOTE: unknown modes are skipped...
-			if(i >= 0){
-				h.splice(i, 1)
-			}
+				// remove handlers by tag...
+				} else {
+					// filter out everything that mathches a tag in-place...
+					h.splice.apply(h, 
+							[0, h.length]
+								.concat(h.filter(function(e){ 
+									return e.tag != handler })))
+				}
+			})
 		}
 		return this
 	},

ui (gen4)/ribbons.js

@@ -278,6 +278,8 @@ module.RibbonsPrototype = {
 		return this
 	},
 
+	// XXX make this work for multiple targets...
+	// XXX avoid ardcoded delays...
 	makeShadow: function(target, animate){
 		var img = this.getImage(target)
 		var gid = this.getElemGID(img)

ui (gen4)/ui.js

@@ -163,7 +163,7 @@ $(function(){
 
 	window.a = testing.setupActions()
 
-	viewer.setupAnimation(a)
+	viewer.Animation.setup(a)
 })
 
 

ui (gen4)/viewer.js

@@ -549,25 +549,38 @@ actions.Actions(Client, {
 
 
 
-var setupAnimation =
-module.setupAnimation =
-function setupAnimation(actions){
-	var animate = function(target){
-			var s = this.ribbons.makeShadow(target, true)
-			return function(){ s() }
-		}
-	var noanimate = function(target){
-			var s = this.ribbons.makeShadow(target)
-			return function(){ s() }
-		}
-	return actions
-		.on('shiftImageUp.pre', animate)
-		.on('shiftImageDown.pre', animate)
-		.on('shiftImageLeft.pre', noanimate)
-		.on('shiftImageRight.pre', noanimate)
+/*********************************************************************/
+// XXX do a simple feature framework...
+// 		...need something like:
+// 			Features(['feature_a', 'feature_b'], action).setup()
+
+var Animation =
+module.Animation = {
+	tag: 'animation_handler',
+
+	setup: function(actions){
+		var animate = function(target){
+				var s = this.ribbons.makeShadow(target, true)
+				return function(){ s() }
+			}
+		var noanimate = function(target){
+				var s = this.ribbons.makeShadow(target)
+				return function(){ s() }
+			}
+		var tag = this.tag
+		return actions
+			.on('shiftImageUp.pre', tag, animate)
+			.on('shiftImageDown.pre', tag, animate)
+			.on('shiftImageLeft.pre', tag, noanimate)
+			.on('shiftImageRight.pre', tag, noanimate)
+	},
+	remove: function(actions){
+		return actions.off('*', this.tag)
+	}
 }
 
 
+
 /**********************************************************************
 * vim:set ts=4 sw=4 :                                                */
 return module })