more work on animationFrame-based animation...

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

lib/jli.js

@@ -528,35 +528,33 @@ function makeScrollHandler(root, config){
 
 	// local data...
 	var ignoring = false
-	var cancelThreshold
-	var scrolled
 	// XXX this and scroller.state are redundent...
 	var scrolling = false
 	var touch = false
 	var touches = 0
-	var start_x
-	var start_y
-	var start_t
-	var prev_x
-	var prev_y
-	var prev_t
-	var bounds
-	var shift
-	var scale
-	var x
-	var y
-	var t
-	var dx
-	var dy
-	var dt
 	var max_dx = 0
 	var max_dy = 0
 
+	var cancelThreshold, scrolled
+		// initial state...
+		, start_x, start_y, start_t
+		// previous state...
+		, prev_x, prev_y, prev_t
+		// current state...
+		, x, y, t
+		// state delta...
+		, dx, dy, dt
+
+		, shift
+		, scale
+		//, bounds
+
 	function startMoveHandler(evt){
 		var options = scroller.options
 		// ignore...
 		if(options.ignoreElements 
-				&& $(evt.target).closest(options.ignoreElements).length > 0){
+				&& $(evt.target).closest(options.ignoreElements).length > 0
+				|| scroller.state == 'paused'){
 			ignoring = true
 			return
 		} else {
@@ -574,6 +572,7 @@ function makeScrollHandler(root, config){
 		}
 		prev_t = event.timeStamp || Date.now();
 		start_t = prev_t
+		/*
 		if(options.autoCancelEvents){
 			bounds = {
 				left: options.eventBounds,
@@ -582,6 +581,7 @@ function makeScrollHandler(root, config){
 				bottom: root.height() - options.eventBounds 
 			}
 		}
+		*/
 		//togglePageDragging('on')
 		scrolled = $(root.children()[0])
 		setTransitionDuration(scrolled, 0)
@@ -620,6 +620,7 @@ function makeScrollHandler(root, config){
 		y = touch ? event.touches[0].pageY : evt.clientY
 		touches = touch ? event.touches.length : 1
 
+		/*
 		// XXX needs testing...
 		// XXX do we need to account for scrollDisabled here???
 		// check scroll bounds...
@@ -630,6 +631,7 @@ function makeScrollHandler(root, config){
 				return endMoveHandler(evt)
 			}
 		}
+		*/
 
 		// do the actual scroll...
 		if(!options.scrollDisabled && scrolling){
@@ -711,7 +713,7 @@ function makeScrollHandler(root, config){
 			scrolling = false
 			scroller.state = 'waiting'
 			scrolled = null 
-			bounds = null
+			//bounds = null
 			max_dx = 0
 			max_dy = 0
 		}
@@ -756,12 +758,15 @@ function makeScrollHandler(root, config){
 			enableUserScrollEvent: false,
 			enableEndEvent: false,
 
+			/*
 			// XXX padding within the target element moving out of which 
 			// 		will cancell the action...
 			// XXX needs testing...
 			autoCancelEvents: false,
 			eventBounds: 5,
+			*/
 
+			// callback to be called when the user first touches the screen...
 			preCallback: null,
 			// callback to be called when the user lifts a finger/mouse.
 			// NOTE: this may happen before the scroll is done, for instance
@@ -790,27 +795,36 @@ function makeScrollHandler(root, config){
 		root: root,
 
 		start: function(){
-			this.state = 'waiting'
+			if(this.state == 'paused'){
-			// XXX STUB: this makes starting the scroll a bit sluggish, 
+				this.state = 'waiting'
-			//		find a faster way...
-			//togglePageDragging('on')
-
-			// NOTE: if we bind both touch and mouse events, on touch devices they 
-			//		might start interfering with each other...
-			if('ontouchmove' in window){
-				root
-					.on('touchstart', startMoveHandler)
-					.on('touchmove', moveHandler) 
-					.on('touchend', endMoveHandler)
-					.on('touchcancel', endMoveHandler)
 			} else {
-				root
+				this.state = 'waiting'
-					.on('mousedown', startMoveHandler) 
+				// XXX STUB: this makes starting the scroll a bit sluggish, 
-					.on('mousemove', moveHandler) 
+				//		find a faster way...
-					.on('mouseup', endMoveHandler) 
+				//togglePageDragging('on')
+
+				// NOTE: if we bind both touch and mouse events, on touch devices they 
+				//		might start interfering with each other...
+				if('ontouchmove' in window){
+					root
+						.on('touchstart', startMoveHandler)
+						.on('touchmove', moveHandler) 
+						.on('touchend', endMoveHandler)
+						.on('touchcancel', endMoveHandler)
+				} else {
+					root
+						.on('mousedown', startMoveHandler) 
+						.on('mousemove', moveHandler) 
+						.on('mouseup', endMoveHandler) 
+				}
 			}
 			return this
 		},
+		// XXX test...
+		pause: function(){
+			this.state = 'paused'
+			return this
+		},
 		stop: function(){
 			if('ontouchmove' in window){
 				root