Skip to content

Commit

Permalink
Added support for onTouchTap events, eliminating 300ms delay on iOS.
Browse files Browse the repository at this point in the history
Basically, this is merge-in of https://github.com/zilverline/react-tap-event-plugin
project, with incorporated @s0meone's fix for duplicate tap events.
See also facebook#436
  • Loading branch information
ashtuchkin committed Nov 15, 2014
1 parent ed1ca69 commit 3401a77
Show file tree
Hide file tree
Showing 3 changed files with 28 additions and 1 deletion.
23 changes: 23 additions & 0 deletions src/browser/eventPlugins/TapEventPlugin.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,12 +25,24 @@ var topLevelTypes = EventConstants.topLevelTypes;
var isStartish = EventPluginUtils.isStartish;
var isEndish = EventPluginUtils.isEndish;

var isTouch = function(topLevelType) {
var touchTypes = [
topLevelTypes.topTouchCancel,
topLevelTypes.topTouchEnd,
topLevelTypes.topTouchStart,
topLevelTypes.topTouchMove
];
return touchTypes.indexOf(topLevelType) >= 0;
}

/**
* Number of pixels that are tolerated in between a `touchStart` and `touchEnd`
* in order to still be considered a 'tap' event.
*/
var tapMoveThreshold = 10;
var ignoreMouseThreshold = 750;
var startCoords = {x: null, y: null};
var lastTouchEvent = null;

var Axis = {
x: {page: 'pageX', client: 'clientX', envScroll: 'currentPageScrollLeft'},
Expand Down Expand Up @@ -85,6 +97,8 @@ var TapEventPlugin = {

tapMoveThreshold: tapMoveThreshold,

ignoreMouseThreshold: ignoreMouseThreshold,

eventTypes: eventTypes,

/**
Expand All @@ -100,6 +114,15 @@ var TapEventPlugin = {
topLevelTarget,
topLevelTargetID,
nativeEvent) {

if (isTouch(topLevelType)) {
lastTouchEvent = nativeEvent.timeStamp;
} else {
if (lastTouchEvent && (nativeEvent.timeStamp - lastTouchEvent) < ignoreMouseThreshold) {
return null;
}
}

if (!isStartish(topLevelType) && !isEndish(topLevelType)) {
return null;
}
Expand Down
4 changes: 4 additions & 0 deletions src/browser/ui/ReactDefaultInjection.js
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,8 @@ var ReactInjection = require('ReactInjection');
var ReactInstanceHandles = require('ReactInstanceHandles');
var ReactMount = require('ReactMount');
var SelectEventPlugin = require('SelectEventPlugin');
var TapEventPlugin = require('TapEventPlugin');
var ResponderEventPlugin = require('ResponderEventPlugin');
var ServerReactRootIndex = require('ServerReactRootIndex');
var SimpleEventPlugin = require('SimpleEventPlugin');
var SVGDOMPropertyConfig = require('SVGDOMPropertyConfig');
Expand Down Expand Up @@ -66,6 +68,8 @@ function inject() {
CompositionEventPlugin: CompositionEventPlugin,
MobileSafariClickEventPlugin: MobileSafariClickEventPlugin,
SelectEventPlugin: SelectEventPlugin,
ResponderEventPlugin: ResponderEventPlugin,
TapEventPlugin: TapEventPlugin,
BeforeInputEventPlugin: BeforeInputEventPlugin
});

Expand Down
2 changes: 1 addition & 1 deletion src/event/EventPluginUtils.js
Original file line number Diff line number Diff line change
Expand Up @@ -211,7 +211,7 @@ var EventPluginUtils = {
executeDispatchesInOrderStopAtTrue: executeDispatchesInOrderStopAtTrue,
hasDispatches: hasDispatches,
injection: injection,
useTouchEvents: false
useTouchEvents: true
};

module.exports = EventPluginUtils;

0 comments on commit 3401a77

Please sign in to comment.