Permalink
Browse files

fixed removeEventListener to false to enable event bubbling

  • Loading branch information...
1 parent 88149ce commit c83810151ec79fcff269884e3b7335e6510ef3b6 @greg-turbulenz greg-turbulenz committed Oct 1, 2011
Showing with 167 additions and 150 deletions.
  1. +7 −1 History.md
  2. +111 −100 hoverable and touchable.js
  3. +49 −49 touchable.js
View
8 History.md
@@ -16,7 +16,13 @@
0.0.4 / 2010-01-21
------------------
-* reengineered the anchor link fix, cause I didn't like the approach taken in 0.0.3. The approach in 0.0.3 fixed the problem not at it's source, namely the browser inconsistency on mobile devices, which seem to mis-interpretate preventDefault as a stopPropagation, thus not fireing any other events bound to that object. This was not affectin only Anchor Elements, so I decided to let touchstart again prevent default, and included instead a special fix for mobile browsers in that I fire a click event on touchend manually. Don't know if this is a better fix, but it seems a bit more elegant to me right now.
+* reengineered the anchor link fix, cause I didn't like the approach taken in 0.0.3. The approach in 0.0.3 fixed the problem not at it's source, namely the browser inconsistency on mobile devices, which seem to mis-interpretate preventDefault as a stopPropagation, thus not fireing any other events bound to that object. This was not affectin only Anchor Elements, so I decided to let touchstart again prevent default, and included instead a special fix for mobile browsers in that I fire a click event on touchend manually. Don't know if this is a better fix, but it seems a bit more elegant to me right now.
* added hittarget to touch event: as mobile browsers results on event targets differ from desktop, I added a 3rd target which is evaluated by using document.elementFromPoint and especially oin mobile Safari gives the right touch target (whereas currentTarget and Target won't
* fixed the logging function
* pass the options passed to Hoverable to the internal Touchable object too
+
+0.0.5 / 2011-10-01
+------------------
+
+* changed removeEventListener to false (event bubbling) [blog article]:http://www.quirksmode.org/js/events_order.html
+thanks to @bjort for signalling this to me
View
211 hoverable and touchable.js
@@ -5,14 +5,14 @@
* @author Gregor Schwab
* @copyright (c) 2010 Gregor Schwab
* Usage: $(elem).Touchable() (@see Readme.md)
- * @version 0.0.3
+ * @version 0.0.4
* @requires jQuery Touchable
*/
(function($) {
var Touchable=$.Touchable;
$.fn.Hoverable = function(conf) {
- return this.each(function() {
+ return this.each(function() {
var t= $(this).data['Hoverable']=new Hoverable(this, conf);
return t;
});
@@ -21,99 +21,100 @@
return this.each(function() {
$(this).bind('newHoverIn', fn1).bind('newHoverOut', fn2);
});
- }
+ }
$.fn.newHover2 = function(fn1, fn2) {
return this.each(function() {
$(this).bind('newHoverIn2', fn1).bind('newHoverOut2', fn2);
});
- }
+ }
/**
* @constructor
- */
+ */
function Hoverable(elem, conf)
{
-
- var self=this;
+
+ var self=this;
this.logging=false; //set to false to disabele logging default false gets overwritten by conf see below
- var log=function(a){if(self.logging){console.log(arguments);}} ;//private logging function
-
+ var log=function(a){if(self.logging && (typeof console !== 'undefined')){
+ console.log(Array.prototype.slice.call(arguments));}
+ }; //private logging function
- this.elem=elem;
+ this.elem=elem;
//test for touchable
if(!$(elem).Touchable) throw new Error('Hoverable depends on Touchable! Please be sure to include Touchable in your project.')
- this.$elem=$(elem).Touchable();
+ this.$elem=$(elem).Touchable(conf);
this.inHover=false;
this.target=null;
-
+
if (typeof conf!=='undefined'){
if(typeof conf.disableHover!=='undefined'){this.disableHover=conf.disableHover;}
else{this.disableHover=false;}
- if(typeof conf.logging!=='undefined'){this.logging=conf.logging;}
- }
-
-
+ if(typeof conf.logging!=='undefined'){this.logging=conf.logging;}
+ }
+
+
//longTap is the new Hover ;)
if (!this.disableHover){
this.$elem.mouseenter(genericHover);
- this.$elem.bind('mouseleave', genericHover);
+ this.$elem.bind('mouseleave', genericHover);
}
-
- this.$elem.bind('longTap', genericHover);
- this.$elem.bind('touchableend', genericHover);
-
+
+ this.$elem.bind('longTap', genericHover);
+ this.$elem.bind('touchableend', genericHover);
+
function genericHover(e, touch){
if(e.type==='touchableend' ||e.type==='mouseleave'){
- log('Touchable newHoverOut');
+ log('Touchable newHoverOut');
//this.$elem.unbind('touchend', genericHover);//don't have to unbind mouseleave .unbind('mouseleave', genericHover);
return self.$elem.trigger('newHoverOut', self);
}
- log('Touchable newHoverIn');
- self.$elem.trigger('newHoverIn', self); //trigger a genericHover see Readme
- }
-
+ log('Touchable newHoverIn');
+ self.$elem.trigger('newHoverIn', self); //trigger a genericHover see Readme
+ }
+
//mousemove is the new Hover ;)
if (!this.disableHover){
this.$elem.bind('mouseenter', genericHover2);
- this.$elem.bind('mouseleave', genericHover2);
+ this.$elem.bind('mouseleave', genericHover2);
}
self.$elem.bind('touchablestart', function(e, touch){
- self.$elem.bind('touchablemove', genericHover2);
- }, false);
+ self.$elem.bind('touchablemove', genericHover2);
+ }, false);
self.$elem.bind('touchableend', function(e, touch){
self.$elem.unbind('touchablemove', genericHover2);
- genericHover2(e, touch);
- }, false);
+ genericHover2(e, touch);
+ }, false);
-
- //this.$elem.bind('touchend', genericHover2);
+
+ //this.$elem.bind('touchend', genericHover2);
function genericHover2(e, touch){
if(e.type==='touchableend'||e.type==='touchend'){
log('Touchable newHoverOut2');
- self.inHover=false;
+ self.inHover=false;
return self.$elem.trigger('newHoverOut2', self);
}else if(e.type==='mouseenter'){
log('Touchable newHoverIn2');
return self.$elem.trigger('newHoverIn2', self);
}else if(e.type==='mouseleave'){
- log('Touchable newHoverOut2');
- return self.$elem.trigger('newHoverOut2', self);
- }
+ log('Touchable newHoverOut2');
+ return self.$elem.trigger('newHoverOut2', self);
+ }
if (e.type == 'touchablemove'){
if(touch instanceof Touchable){
- var x=touch.currentTouch.x; var y=touch.currentTouch.y;
- var hitTarget = document.elementFromPoint(x, y);
+ //var x=touch.currentTouch.x; var y=touch.currentTouch.y;
+ var hitTarget = self.hitTarget; //document.elementFromPoint(x, y);
/* if(typeof hitTarget==='undefined'||hitTarget===null&&self.target!==null) {var target=self.target;var currentTarget=self.target}//just if the browser looses memory
else{var target=hittarget}//first the hittarget
- if(self.logging){console.log('target '+target+' x, y:'+x,+' ' +y);}
+ if(self.logging){console.log('target '+target+' x, y:'+x,+' ' +y);}
}else{
var target = e.target;
}*/
log('Touchable target ID/node'+ ' hitTarget'+ ' ' +
hitTarget+'e.target'+e.target + ' e.currentTarget'+e.currentTarget+
- ' self in hover'+self.inHover);
+ ' self in hover'+self.inHover);
//lets see if we can macth our element...still playing with the right settings here cause browsers seem to have differenes in what they pass as an event.target
var pass=false;
//not good cause it goes on paragraphs but can be used to test for being outside the view element
@@ -124,42 +125,43 @@
//relates to the this pointer the touchmove event was bound to (normally document)
//else if (typeof self.currentTarget !== 'undefined' && self.currentTarget === self.$elem.get(0)){pass=true;}//iPad has it in currentTarget
//e.target might work too
- //else if (typeof e.target !== 'undefined' && e.target === self.$elem.get(0)){pass=true;}
- //the winner is:
- if (typeof e.currentTarget !== 'undefined' && e.currentTarget === self.$elem.get(0)){pass=true;}
+ //else if (typeof e.target !== 'undefined' && e.target === self.$elem.get(0)){pass=true;}
+ //the winner is:
+ if (typeof e.currentTarget !== 'undefined' && e.currentTarget === self.$elem.get(0)){pass=true;}
if(pass&& !self.inHover){
self.inHover=true;
- log('Touchable newHoverIn2');
+ log('Touchable newHoverIn2');
self.$elem.trigger('newHoverIn2', self);
- //e.stopPropagation();//we are talking about touchablemove event here
+ //e.stopPropagation();//we are talking about touchablemove event here
}
else if (pass===false && self.inHover){
self.inHover=false;
- log('Touchable newHoverOut2');
- self.$elem.trigger('newHoverOut2', self);
- //e.stopPropagation(); //we are talking about touchablemove event here
- }
+ log('Touchable newHoverOut2');
+ self.$elem.trigger('newHoverOut2', self);
+ //e.stopPropagation(); //we are talking about touchablemove event here
+ }
}
- }
- }
+ }
+ }
}
})(jQuery);//end closure
+
/*
* jQuery Touchable
*
* Simplified BSD License (@see License)
* @author Gregor Schwab
* @copyright (c) 2010 Gregor Schwab
* Usage Command Line: $(elem).Touchable() (@see Readme.md)
- * @version 0.0.3
+ * @version 0.0.5
* @requires jQuery
*/
(function($) {
$.fn.Touchable = function(conf) {
- return this.each(function() {
+ return this.each(function() {
var t= $(this).data['Touchable']=new Touchable(this, conf);
return t;
});
@@ -168,59 +170,61 @@
return this.each(function() {
$(this).bind('newHoverIn', fn1).bind('newHoverOut', fn2);
});
- }
+ }
$.fn.newHover2 = function(fn1, fn2) {
return this.each(function() {
$(this).bind('newHoverIn2', fn1).bind('newHoverOut2', fn2);
});
- }
+ }
+
+ $.Touchable=Touchable;
- $.Touchable=Touchable;
-
/**
* @constructor
- */
+ */
function Touchable(elem, conf)
{
-
+
this.logging=false; //set to false to disabele logging gets overwritten by conf see below
- var log=function(a){if(self.logging){console.log(arguments);}} ;//private logging function
-
- this.elem=elem;
+ var log=function(a){if(self.logging && (typeof console !== 'undefined')){
+ console.log(Array.prototype.slice.call(arguments));}
+ }; //private logging function
+
+ this.elem=elem;
this.$elem=$(elem);
this.is_doubleTap=false;
this.is_currentlyTouching=false;
this.isOneFingerGesture = false;
this.startTouch={x:0,y:0};
- this.currentTouch={x:0,y:0};
+ this.currentTouch={x:0,y:0};
this.previousTouch={x:0,y:0};
this.currentDelta={x:0,y:0};//measured from previous move event
- this.currentStartDelta={x:0,y:0}; //measured from start
+ this.currentStartDelta={x:0,y:0}; //measured from start
this.currentPosition={x:0,y:0};
this.doubleTapTimer=null, this.longTapTimer=null;
var self=this;
if (typeof conf!=='undefined'){
- if(typeof conf.logging!=='undefined'){this.logging=conf.logging;}
- }
+ if(typeof conf.logging!=='undefined'){this.logging=conf.logging;}
+ }
//make IE happy
var addEventListener=elem.addEventListener||elem.attachEvent
- var removeEventListener = elem.removeEventListener||elem.detachEvent
- //add touchstart eventlistener
- addEventListener.call(elem, 'touchstart', function(){self.$elem.trigger('touchstart')}, false);
+ var removeEventListener = elem.removeEventListener||elem.detachEvent
+ //add touchstart eventlistener
+ addEventListener.call(elem, 'touchstart', function(){self.$elem.trigger('touchstart')}, true);
addEventListener.call(elem, 'touchend', function(){self.$elem.trigger('touchend')}, false);
- addEventListener.call(elem, 'touchmove', function(){self.$elem.trigger('touchmove')}, false);
+ addEventListener.call(elem, 'touchmove', function(){self.$elem.trigger('touchmove')}, false);
- addEventListener.call(elem, 'touchstart', touchstart, false);
+ addEventListener.call(elem, 'touchstart', touchstart, false);
this.$elem.mousedown(touchstart);
function touchstart (e) {
if(typeof e.touches!== "undefined")
{
- log('Touchable Touchstart touches length ' + e.touches.length);
+ log('Touchable Touchstart touches length ' + e.touches.length);
//only handle 1 or 2 touches
if (e.touches.length !== 1 && e.touches.length !== 2) {
return false;
@@ -243,27 +247,29 @@
self.startTouch.y = self.previousTouch.y = e.touches[0].clientY;
} else {
self.startTouch.x = self.previousTouch.x = self.touches[1].clientX;
- self.startTouch.y = self.previousTouch.y = self.touches[1].clientY;
+ self.startTouch.y = self.previousTouch.y = self.touches[1].clientY;
}
- }
+ }
addEventListener.call(document, 'touchmove', touchmove, false);
- addEventListener.call(document, 'touchend', touchend, false);
+ addEventListener.call(document, 'touchend', touchend, false);
}else{
- log('Touchable Touchstart touches length ' + e.pageX + ' ' + e.pageY);
+ log('Touchable Touchstart touches length ' + e.pageX + ' ' + e.pageY);
self.startTouch.x = self.previousTouch.x = e.pageX;
- self.startTouch.y = self.previousTouch.y = e.pageY;
+ self.startTouch.y = self.previousTouch.y = e.pageY;
$(document).mousemove(touchmove);
- $(document).mouseup(touchend);
+ $(document).mouseup(touchend);
}
//don't shallow links, but all the rest
- var x=self.startTouch.x; var y=self.startTouch.y;
- var hitTarget = ( document.elementFromPoint ) ? (document.elementFromPoint(x, y)):'';
- if (hitTarget && !(hitTarget instanceof HTMLAnchorElement) &&!(e.currentTarget instanceof HTMLAnchorElement))
+ self.target=e.target;//some browser loose the info here
+ self.currentTarget=e.currentTarget;//some browser loose the info here so save it for later
+ var x=self.startTouch.x; var y=self.startTouch.y;
+ self.hitTarget = ( document.elementFromPoint ) ? (document.elementFromPoint(x, y)):'';
+ //if (self.hitTarget && !(self.hitTarget instanceof HTMLAnchorElement) &&!(e.currentTarget instanceof HTMLAnchorElement))
e.preventDefault()
- //setup double tapping
+ //setup double tapping
if (!self.inDoubleTap) {
self.inDoubleTap = true;
//setup a timer
@@ -276,18 +282,18 @@
self.$elem.trigger('doubleTap', self); //trigger a doubleTap
//reset doubleTap state
clearTimeout(self.doubleTapTimer);
- self.inDoubleTap = false;
- }
+ self.inDoubleTap = false;
+ }
//setup long tapping and long mousedown
//setup a timer
self.longTapTimer = setTimeout(function() {
- log('Touchable longTap');
+ log('Touchable longTap'/*, self.hitTarget, self.target, self.currentTarget, self.elem*/);
$(self.elem).trigger('longTap', self); //trigger a longTap
}, 1000);
- log('Touchable Tap');
+ log('Touchable Tap');
$(self.elem).trigger('tap', self); //trigger a tap
- $(self.elem).trigger('touchablestart', self); //trigger a tap
+ $(self.elem).trigger('touchablestart', self); //trigger a tap
}
@@ -297,7 +303,7 @@
function touchmove(e) {
if (typeof e.touches !== 'undefined'){
- log('Touchable Touchsmove touches length ' + e.touches.length);
+ log('Touchable Touchsmove touches length ' + e.touches.length);
if (e.touches.length !== 1 && e.touches.length !== 2) //use touches to track all fingers on the screen currently (also the ones not in the pane) if there are more than 2 its a gesture
return false;
@@ -317,7 +323,7 @@
}
}else{
self.currentTouch.x = e.pageX;
- self.currentTouch.y = e.pageY;
+ self.currentTouch.y = e.pageY;
}
//if we are moving stop any css animations currently running
$(self.elem).removeClass('webkitAnimate');
@@ -333,34 +339,39 @@
//reset the start position for the next delta
self.previousTouch.x = self.currentTouch.x;
self.previousTouch.y = self.currentTouch.y;
- log('Touchable Touchablemove self e.target' + e.target + 'e.currentTarget '+ e.currentTarget +' x:'+ self.currentStartDelta.x);
+ log('Touchable Touchablemove self e.target' + e.target + 'e.currentTarget '+ e.currentTarget +' x:'+ self.currentStartDelta.x);
+ //Target handling
self.target=e.target;//some browser loose the info here
- self.currentTarget=e.currentTarget;//some browser loose the info here
+ self.currentTarget=e.currentTarget;//some browser loose the info here so save it for later
+ var x=self.currentTouch.x; var y=self.currentTouch.y;
+ self.hitTarget = ( document.elementFromPoint ) ? (document.elementFromPoint(x, y)):'';
$(self.elem).trigger('touchablemove', self);
//clear the long tap timer on mousemove
if (self.longTapTimer) clearTimeout(self.longTapTimer);
- }
+ }
function touchend(e) {
if (typeof e.touches !== 'undefined'){
if (e.targetTouches.length > 0)
return false;
- removeEventListener.call(self.elem, 'touchmove', touchmove, true);
- removeEventListener.call(self.elem, 'touchend', touchend, true);
+ removeEventListener.call(self.elem, 'touchmove', touchmove, false);
+ removeEventListener.call(self.elem, 'touchend', touchend, false);
}else{
$(document).unbind('mousemove',touchmove);
- $(document).unbind('mouseup',touchend);
+ $(document).unbind('mouseup',touchend);
}
//e.preventDefault();
self.isCurrentlyTouching = false;
//clear the long tap timer on mouseup
- if (self.longTapTimer) clearTimeout(self.longTapTimer);
- log('Touchable Touchend self ' + self.currentStartDelta.x);
+ if (self.longTapTimer) clearTimeout(self.longTapTimer);
+ log('Touchable Touchend self ' + self.currentStartDelta.x);
$(self.elem).trigger('touchableend', self);
- log('Touchable: touchableend');
+ log('Touchable: touchableend');
+ $(self.hitTarget).trigger('click', self);//trigger a click on the hittarget cause on iPad/Mobile Safari preventdefault seems to shallow click events
+ log('Touchable: Hittarget click');
- }
+ }
}
})(jQuery);//end closure
View
98 touchable.js
@@ -5,15 +5,15 @@
* @author Gregor Schwab
* @copyright (c) 2010 Gregor Schwab
* Usage Command Line: $(elem).Touchable() (@see Readme.md)
- * @version 0.0.4
+ * @version 0.0.5
* @requires jQuery
*/
(function($) {
$.fn.Touchable = function(conf) {
- return this.each(function() {
+ return this.each(function() {
var t= $(this).data['Touchable']=new Touchable(this, conf);
return t;
});
@@ -22,61 +22,61 @@
return this.each(function() {
$(this).bind('newHoverIn', fn1).bind('newHoverOut', fn2);
});
- }
+ }
$.fn.newHover2 = function(fn1, fn2) {
return this.each(function() {
$(this).bind('newHoverIn2', fn1).bind('newHoverOut2', fn2);
});
- }
+ }
+
+ $.Touchable=Touchable;
- $.Touchable=Touchable;
-
/**
* @constructor
- */
+ */
function Touchable(elem, conf)
{
-
+
this.logging=false; //set to false to disabele logging gets overwritten by conf see below
var log=function(a){if(self.logging && (typeof console !== 'undefined')){
console.log(Array.prototype.slice.call(arguments));}
}; //private logging function
-
- this.elem=elem;
+
+ this.elem=elem;
this.$elem=$(elem);
this.is_doubleTap=false;
this.is_currentlyTouching=false;
this.isOneFingerGesture = false;
this.startTouch={x:0,y:0};
- this.currentTouch={x:0,y:0};
+ this.currentTouch={x:0,y:0};
this.previousTouch={x:0,y:0};
this.currentDelta={x:0,y:0};//measured from previous move event
- this.currentStartDelta={x:0,y:0}; //measured from start
+ this.currentStartDelta={x:0,y:0}; //measured from start
this.currentPosition={x:0,y:0};
this.doubleTapTimer=null, this.longTapTimer=null;
var self=this;
if (typeof conf!=='undefined'){
- if(typeof conf.logging!=='undefined'){this.logging=conf.logging;}
- }
+ if(typeof conf.logging!=='undefined'){this.logging=conf.logging;}
+ }
//make IE happy
var addEventListener=elem.addEventListener||elem.attachEvent
- var removeEventListener = elem.removeEventListener||elem.detachEvent
- //add touchstart eventlistener
- addEventListener.call(elem, 'touchstart', function(){self.$elem.trigger('touchstart')}, true);
+ var removeEventListener = elem.removeEventListener||elem.detachEvent
+ //add touchstart eventlistener
+ addEventListener.call(elem, 'touchstart', function(){self.$elem.trigger('touchstart')}, true);
addEventListener.call(elem, 'touchend', function(){self.$elem.trigger('touchend')}, false);
- addEventListener.call(elem, 'touchmove', function(){self.$elem.trigger('touchmove')}, false);
+ addEventListener.call(elem, 'touchmove', function(){self.$elem.trigger('touchmove')}, false);
- addEventListener.call(elem, 'touchstart', touchstart, false);
+ addEventListener.call(elem, 'touchstart', touchstart, false);
this.$elem.mousedown(touchstart);
function touchstart (e) {
if(typeof e.touches!== "undefined")
{
- log('Touchable Touchstart touches length ' + e.touches.length);
+ log('Touchable Touchstart touches length ' + e.touches.length);
//only handle 1 or 2 touches
if (e.touches.length !== 1 && e.touches.length !== 2) {
return false;
@@ -99,29 +99,29 @@
self.startTouch.y = self.previousTouch.y = e.touches[0].clientY;
} else {
self.startTouch.x = self.previousTouch.x = self.touches[1].clientX;
- self.startTouch.y = self.previousTouch.y = self.touches[1].clientY;
+ self.startTouch.y = self.previousTouch.y = self.touches[1].clientY;
}
- }
+ }
addEventListener.call(document, 'touchmove', touchmove, false);
- addEventListener.call(document, 'touchend', touchend, false);
+ addEventListener.call(document, 'touchend', touchend, false);
}else{
- log('Touchable Touchstart touches length ' + e.pageX + ' ' + e.pageY);
+ log('Touchable Touchstart touches length ' + e.pageX + ' ' + e.pageY);
self.startTouch.x = self.previousTouch.x = e.pageX;
- self.startTouch.y = self.previousTouch.y = e.pageY;
+ self.startTouch.y = self.previousTouch.y = e.pageY;
$(document).mousemove(touchmove);
- $(document).mouseup(touchend);
+ $(document).mouseup(touchend);
}
//don't shallow links, but all the rest
self.target=e.target;//some browser loose the info here
self.currentTarget=e.currentTarget;//some browser loose the info here so save it for later
- var x=self.startTouch.x; var y=self.startTouch.y;
- self.hitTarget = ( document.elementFromPoint ) ? (document.elementFromPoint(x, y)):'';
- //if (self.hitTarget && !(self.hitTarget instanceof HTMLAnchorElement) &&!(e.currentTarget instanceof HTMLAnchorElement))
+ var x=self.startTouch.x; var y=self.startTouch.y;
+ self.hitTarget = ( document.elementFromPoint ) ? (document.elementFromPoint(x, y)):'';
+ //if (self.hitTarget && !(self.hitTarget instanceof HTMLAnchorElement) &&!(e.currentTarget instanceof HTMLAnchorElement))
e.preventDefault()
- //setup double tapping
+ //setup double tapping
if (!self.inDoubleTap) {
self.inDoubleTap = true;
//setup a timer
@@ -134,18 +134,18 @@
self.$elem.trigger('doubleTap', self); //trigger a doubleTap
//reset doubleTap state
clearTimeout(self.doubleTapTimer);
- self.inDoubleTap = false;
- }
+ self.inDoubleTap = false;
+ }
//setup long tapping and long mousedown
//setup a timer
self.longTapTimer = setTimeout(function() {
log('Touchable longTap'/*, self.hitTarget, self.target, self.currentTarget, self.elem*/);
$(self.elem).trigger('longTap', self); //trigger a longTap
}, 1000);
- log('Touchable Tap');
+ log('Touchable Tap');
$(self.elem).trigger('tap', self); //trigger a tap
- $(self.elem).trigger('touchablestart', self); //trigger a tap
+ $(self.elem).trigger('touchablestart', self); //trigger a tap
}
@@ -155,7 +155,7 @@
function touchmove(e) {
if (typeof e.touches !== 'undefined'){
- log('Touchable Touchsmove touches length ' + e.touches.length);
+ log('Touchable Touchsmove touches length ' + e.touches.length);
if (e.touches.length !== 1 && e.touches.length !== 2) //use touches to track all fingers on the screen currently (also the ones not in the pane) if there are more than 2 its a gesture
return false;
@@ -175,7 +175,7 @@
}
}else{
self.currentTouch.x = e.pageX;
- self.currentTouch.y = e.pageY;
+ self.currentTouch.y = e.pageY;
}
//if we are moving stop any css animations currently running
$(self.elem).removeClass('webkitAnimate');
@@ -191,38 +191,38 @@
//reset the start position for the next delta
self.previousTouch.x = self.currentTouch.x;
self.previousTouch.y = self.currentTouch.y;
- log('Touchable Touchablemove self e.target' + e.target + 'e.currentTarget '+ e.currentTarget +' x:'+ self.currentStartDelta.x);
- //Target handling
+ log('Touchable Touchablemove self e.target' + e.target + 'e.currentTarget '+ e.currentTarget +' x:'+ self.currentStartDelta.x);
+ //Target handling
self.target=e.target;//some browser loose the info here
self.currentTarget=e.currentTarget;//some browser loose the info here so save it for later
- var x=self.currentTouch.x; var y=self.currentTouch.y;
- self.hitTarget = ( document.elementFromPoint ) ? (document.elementFromPoint(x, y)):'';
+ var x=self.currentTouch.x; var y=self.currentTouch.y;
+ self.hitTarget = ( document.elementFromPoint ) ? (document.elementFromPoint(x, y)):'';
$(self.elem).trigger('touchablemove', self);
//clear the long tap timer on mousemove
if (self.longTapTimer) clearTimeout(self.longTapTimer);
- }
+ }
function touchend(e) {
if (typeof e.touches !== 'undefined'){
if (e.targetTouches.length > 0)
return false;
- removeEventListener.call(self.elem, 'touchmove', touchmove, true);
- removeEventListener.call(self.elem, 'touchend', touchend, true);
+ removeEventListener.call(self.elem, 'touchmove', touchmove, false);
+ removeEventListener.call(self.elem, 'touchend', touchend, false);
}else{
$(document).unbind('mousemove',touchmove);
- $(document).unbind('mouseup',touchend);
+ $(document).unbind('mouseup',touchend);
}
//e.preventDefault();
self.isCurrentlyTouching = false;
//clear the long tap timer on mouseup
- if (self.longTapTimer) clearTimeout(self.longTapTimer);
- log('Touchable Touchend self ' + self.currentStartDelta.x);
+ if (self.longTapTimer) clearTimeout(self.longTapTimer);
+ log('Touchable Touchend self ' + self.currentStartDelta.x);
$(self.elem).trigger('touchableend', self);
log('Touchable: touchableend');
- $(self.hitTarget).trigger('click', self);//trigger a click on the hittarget cause on iPad/Mobile Safari preventdefault seems to shallow click events
- log('Touchable: Hittarget click');
+ $(self.hitTarget).trigger('click', self);//trigger a click on the hittarget cause on iPad/Mobile Safari preventdefault seems to shallow click events
+ log('Touchable: Hittarget click');
- }
+ }
}
})(jQuery);//end closure

0 comments on commit c838101

Please sign in to comment.