Fixing touch/mouse issues with TapEventPlugin

On ios device, browser simulates mouse events, but does that with
a delay, because of double tap gesture. The problem is that
TapEventPlugins listens to both types of events, so it fires twice

Everytime there is a touch event, we should ignore mouse events that
follow it.  This way, we still respond to both mouse and touch events,
just ignore the device generated ones.
This commit is contained in:
Tienchai Wirojsaksaree
2014-10-27 17:02:03 -07:00
committed by Paul O’Shannessy
parent 1c241b3ebc
commit ff12423d63
+23 -6
View File
@@ -62,13 +62,15 @@ var dependencies = [
topLevelTypes.topMouseUp
];
var touchDependencies = [
topLevelTypes.topTouchStart,
topLevelTypes.topTouchCancel,
topLevelTypes.topTouchEnd,
topLevelTypes.topTouchMove
];
if (EventPluginUtils.useTouchEvents) {
dependencies.push(
topLevelTypes.topTouchCancel,
topLevelTypes.topTouchEnd,
topLevelTypes.topTouchStart,
topLevelTypes.topTouchMove
);
dependencies = dependencies.concat(touchDependencies);
}
var eventTypes = {
@@ -81,6 +83,10 @@ var eventTypes = {
}
};
var usedTouch = false;
var usedTouchTime = 0;
var TOUCH_DELAY = 500;
var TapEventPlugin = {
tapMoveThreshold: tapMoveThreshold,
@@ -103,6 +109,17 @@ var TapEventPlugin = {
if (!isStartish(topLevelType) && !isEndish(topLevelType)) {
return null;
}
// on ios, there is a delay after touch event and synthetic
// mouse events, so that user can perform double tap
// solution: ignore mouse events following touchevent within small timeframe
if (touchDependencies.indexOf(topLevelType) !== -1) {
usedTouch = true;
usedTouchTime = Date.now();
} else {
if (usedTouch && (Date.now() - usedTouchTime < TOUCH_DELAY)) {
return;
}
}
var event = null;
var distance = getDistance(startCoords, nativeEvent);
if (isEndish(topLevelType) && distance < tapMoveThreshold) {