History

Update FastClick

Thibaut committed 12 years ago

Commit 97bfa431 parent 7cc95dd1 file · +531 −547Browse files

Unified · Split

assets/javascripts/vendor/fastclick.js+531−547
@@ -1,7 +1,7 @@
11 /**
22 * @preserve FastClick: polyfill to remove click delays on browsers with touch UIs.
33 *
4− * @version 0.6.11
4+ * @version 1.0.0
55 * @codingstandard ftlabs-jsv2
66 * @copyright The Financial Times Limited [All Rights Reserved]
77 * @license MIT License (see LICENSE.txt)
@@ -18,152 +18,135 @@ · 10 unmodified lines
1818 * @param {Element} layer The layer to listen on
1919 */
2020 function FastClick(layer) {
21− 'use strict';
22− var oldOnClick, self = this;
23−
24−
25− /**
26− * Whether a click is currently being tracked.
27− *
28− * @type boolean
29− */
30− this.trackingClick = false;
31−
32−
33− /**
34− * Timestamp for when when click tracking started.
35− *
36− * @type number
37− */
38− this.trackingClickStart = 0;
39−
40−
41− /**
42− * The element being tracked for a click.
43− *
44− * @type EventTarget
45− */
46− this.targetElement = null;
47−
48−
49− /**
50− * X-coordinate of touch start event.
51− *
52− * @type number
53− */
54− this.touchStartX = 0;
55−
56−
57− /**
58− * Y-coordinate of touch start event.
59− *
60− * @type number
61− */
62− this.touchStartY = 0;
63−
64−
65− /**
66− * ID of the last touch, retrieved from Touch.identifier.
67− *
68− * @type number
69− */
70− this.lastTouchIdentifier = 0;
71−
72−
73− /**
74− * Touchmove boundary, beyond which a click will be cancelled.
75− *
76− * @type number
77− */
78− this.touchBoundary = 10;
79−
80−
81− /**
82− * The FastClick layer.
83− *
84− * @type Element
85− */
86− this.layer = layer;
87−
88− if (!layer || !layer.nodeType) {
89− throw new TypeError('Layer must be a document node');
90− }
91−
92− /** @type function() */
93− this.onClick = function() { return FastClick.prototype.onClick.apply(self, arguments); };
94−
95− /** @type function() */
96− this.onMouse = function() { return FastClick.prototype.onMouse.apply(self, arguments); };
97−
98− /** @type function() */
99− this.onTouchStart = function() { return FastClick.prototype.onTouchStart.apply(self, arguments); };
100−
101− /** @type function() */
102− this.onTouchMove = function() { return FastClick.prototype.onTouchMove.apply(self, arguments); };
103−
104− /** @type function() */
105− this.onTouchEnd = function() { return FastClick.prototype.onTouchEnd.apply(self, arguments); };
106−
107− /** @type function() */
108− this.onTouchCancel = function() { return FastClick.prototype.onTouchCancel.apply(self, arguments); };
109−
110− if (FastClick.notNeeded(layer)) {
111− return;
112− }
113−
114− // Set up event handlers as required
115− if (this.deviceIsAndroid) {
116− layer.addEventListener('mouseover', this.onMouse, true);
117− layer.addEventListener('mousedown', this.onMouse, true);
118− layer.addEventListener('mouseup', this.onMouse, true);
119− }
120−
121− layer.addEventListener('click', this.onClick, true);
122− layer.addEventListener('touchstart', this.onTouchStart, false);
123− layer.addEventListener('touchmove', this.onTouchMove, false);
124− layer.addEventListener('touchend', this.onTouchEnd, false);
125− layer.addEventListener('touchcancel', this.onTouchCancel, false);
126−
127− // Hack is required for browsers that don't support Event#stopImmediatePropagation (e.g. Android 2)
128− // which is how FastClick normally stops click events bubbling to callbacks registered on the FastClick
129− // layer when they are cancelled.
130− if (!Event.prototype.stopImmediatePropagation) {
131− layer.removeEventListener = function(type, callback, capture) {
132− var rmv = Node.prototype.removeEventListener;
133− if (type === 'click') {
134− rmv.call(layer, type, callback.hijacked || callback, capture);
135− } else {
136− rmv.call(layer, type, callback, capture);
137− }
138− };
139−
140− layer.addEventListener = function(type, callback, capture) {
141− var adv = Node.prototype.addEventListener;
142− if (type === 'click') {
143− adv.call(layer, type, callback.hijacked || (callback.hijacked = function(event) {
144− if (!event.propagationStopped) {
145− callback(event);
146− }
147− }), capture);
148− } else {
149− adv.call(layer, type, callback, capture);
150− }
151− };
152− }
153−
154− // If a handler is already declared in the element's onclick attribute, it will be fired before
155− // FastClick's onClick handler. Fix this by pulling out the user-defined handler function and
156− // adding it as listener.
157− if (typeof layer.onclick === 'function') {
158−
159− // Android browser on at least 3.2 requires a new reference to the function in layer.onclick
160− // - the old one won't work if passed to addEventListener directly.
161− oldOnClick = layer.onclick;
162− layer.addEventListener('click', function(event) {
163− oldOnClick(event);
164− }, false);
165− layer.onclick = null;
166− }
21+ 'use strict';
22+ var oldOnClick;
23+
24+
25+ /**
26+ * Whether a click is currently being tracked.
27+ *
28+ * @type boolean
29+ */
30+ this.trackingClick = false;
31+
32+
33+ /**
34+ * Timestamp for when when click tracking started.
35+ *
36+ * @type number
37+ */
38+ this.trackingClickStart = 0;
39+
40+
41+ /**
42+ * The element being tracked for a click.
43+ *
44+ * @type EventTarget
45+ */
46+ this.targetElement = null;
47+
48+
49+ /**
50+ * X-coordinate of touch start event.
51+ *
52+ * @type number
53+ */
54+ this.touchStartX = 0;
55+
56+
57+ /**
58+ * Y-coordinate of touch start event.
59+ *
60+ * @type number
61+ */
62+ this.touchStartY = 0;
63+
64+
65+ /**
66+ * ID of the last touch, retrieved from Touch.identifier.
67+ *
68+ * @type number
69+ */
70+ this.lastTouchIdentifier = 0;
71+
72+
73+ /**
74+ * Touchmove boundary, beyond which a click will be cancelled.
75+ *
76+ * @type number
77+ */
78+ this.touchBoundary = 10;
79+
80+
81+ /**
82+ * The FastClick layer.
83+ *
84+ * @type Element
85+ */
86+ this.layer = layer;
87+
88+ if (FastClick.notNeeded(layer)) {
89+ return;
90+ }
91+
92+ // Some old versions of Android don't have Function.prototype.bind
93+ function bind(method, context) {
94+ return function() { return method.apply(context, arguments); };
95+ }
96+
97+ // Set up event handlers as required
98+ if (deviceIsAndroid) {
99+ layer.addEventListener('mouseover', bind(this.onMouse, this), true);
100+ layer.addEventListener('mousedown', bind(this.onMouse, this), true);
101+ layer.addEventListener('mouseup', bind(this.onMouse, this), true);
102+ }
103+
104+ layer.addEventListener('click', bind(this.onClick, this), true);
105+ layer.addEventListener('touchstart', bind(this.onTouchStart, this), false);
106+ layer.addEventListener('touchmove', bind(this.onTouchMove, this), false);
107+ layer.addEventListener('touchend', bind(this.onTouchEnd, this), false);
108+ layer.addEventListener('touchcancel', bind(this.onTouchCancel, this), false);
109+
110+ // Hack is required for browsers that don't support Event#stopImmediatePropagation (e.g. Android 2)
111+ // which is how FastClick normally stops click events bubbling to callbacks registered on the FastClick
112+ // layer when they are cancelled.
113+ if (!Event.prototype.stopImmediatePropagation) {
114+ layer.removeEventListener = function(type, callback, capture) {
115+ var rmv = Node.prototype.removeEventListener;
116+ if (type === 'click') {
117+ rmv.call(layer, type, callback.hijacked || callback, capture);
118+ } else {
119+ rmv.call(layer, type, callback, capture);
120+ }
121+ };
122+
123+ layer.addEventListener = function(type, callback, capture) {
124+ var adv = Node.prototype.addEventListener;
125+ if (type === 'click') {
126+ adv.call(layer, type, callback.hijacked || (callback.hijacked = function(event) {
127+ if (!event.propagationStopped) {
128+ callback(event);
129+ }
130+ }), capture);
131+ } else {
132+ adv.call(layer, type, callback, capture);
133+ }
134+ };
135+ }
136+
137+ // If a handler is already declared in the element's onclick attribute, it will be fired before
138+ // FastClick's onClick handler. Fix this by pulling out the user-defined handler function and
139+ // adding it as listener.
140+ if (typeof layer.onclick === 'function') {
141+
142+ // Android browser on at least 3.2 requires a new reference to the function in layer.onclick
143+ // - the old one won't work if passed to addEventListener directly.
144+ oldOnClick = layer.onclick;
145+ layer.addEventListener('click', function(event) {
146+ oldOnClick(event);
147+ }, false);
148+ layer.onclick = null;
149+ }
167150 }
168151
169152
@@ -172,7 +155,7 @@ function FastClick(layer) { · 2 unmodified lines
172155 *
173156 * @type boolean
174157 */
175−FastClick.prototype.deviceIsAndroid = navigator.userAgent.indexOf('Android') > 0;
158+var deviceIsAndroid = navigator.userAgent.indexOf('Android') > 0;
176159
177160
178161 /**
@@ -180,7 +163,7 @@ FastClick.prototype.deviceIsAndroid = navigator.userAgent.indexOf('Android') > 0 · 1 unmodified line
180163 *
181164 * @type boolean
182165 */
183−FastClick.prototype.deviceIsIOS = /iP(ad|hone|od)/.test(navigator.userAgent);
166+var deviceIsIOS = /iP(ad|hone|od)/.test(navigator.userAgent);
184167
185168
186169 /**
@@ -188,7 +171,7 @@ FastClick.prototype.deviceIsIOS = /iP(ad|hone|od)/.test(navigator.userAgent); · 1 unmodified line
188171 *
189172 * @type boolean
190173 */
191−FastClick.prototype.deviceIsIOS4 = FastClick.prototype.deviceIsIOS && (/OS 4_\d(_\d)?/).test(navigator.userAgent);
174+var deviceIsIOS4 = deviceIsIOS && (/OS 4_\d(_\d)?/).test(navigator.userAgent);
192175
193176
194177 /**
@@ -196,7 +179,7 @@ FastClick.prototype.deviceIsIOS4 = FastClick.prototype.deviceIsIOS && (/OS 4_\d( · 1 unmodified line
196179 *
197180 * @type boolean
198181 */
199−FastClick.prototype.deviceIsIOSWithBadTarget = FastClick.prototype.deviceIsIOS && (/OS ([6-9]|\d{2})_\d/).test(navigator.userAgent);
182+var deviceIsIOSWithBadTarget = deviceIsIOS && (/OS ([6-9]|\d{2})_\d/).test(navigator.userAgent);
200183
201184
202185 /**
@@ -206,32 +189,32 @@ FastClick.prototype.deviceIsIOSWithBadTarget = FastClick.prototype.deviceIsIOS & · 3 unmodified lines
206189 * @returns {boolean} Returns true if the element needs a native click
207190 */
208191 FastClick.prototype.needsClick = function(target) {
209− 'use strict';
210− switch (target.nodeName.toLowerCase()) {
211−
212− // Don't send a synthetic click to disabled inputs (issue #62)
213− case 'button':
214− case 'select':
215− case 'textarea':
216− if (target.disabled) {
217− return true;
218− }
219−
220− break;
221− case 'input':
222−
223− // File inputs need real clicks on iOS 6 due to a browser bug (issue #68)
224− if ((this.deviceIsIOS && target.type === 'file') || target.disabled) {
225− return true;
226− }
227−
228− break;
229− case 'label':
230− case 'video':
231− return true;
232− }
233−
234− return (/\bneedsclick\b/).test(target.className);
192+ 'use strict';
193+ switch (target.nodeName.toLowerCase()) {
194+
195+ // Don't send a synthetic click to disabled inputs (issue #62)
196+ case 'button':
197+ case 'select':
198+ case 'textarea':
199+ if (target.disabled) {
200+ return true;
201+ }
202+
203+ break;
204+ case 'input':
205+
206+ // File inputs need real clicks on iOS 6 due to a browser bug (issue #68)
207+ if ((deviceIsIOS && target.type === 'file') || target.disabled) {
208+ return true;
209+ }
210+
211+ break;
212+ case 'label':
213+ case 'video':
214+ return true;
215+ }
216+
217+ return (/\bneedsclick\b/).test(target.className);
235218 };
236219
237220
@@ -242,28 +225,28 @@ FastClick.prototype.needsClick = function(target) { · 4 unmodified lines
242225 * @returns {boolean} Returns true if the element requires a call to focus to simulate native click.
243226 */
244227 FastClick.prototype.needsFocus = function(target) {
245− 'use strict';
246− switch (target.nodeName.toLowerCase()) {
247− case 'textarea':
248− return true;
249− case 'select':
250− return !this.deviceIsAndroid;
251− case 'input':
252− switch (target.type) {
253− case 'button':
254− case 'checkbox':
255− case 'file':
256− case 'image':
257− case 'radio':
258− case 'submit':
259− return false;
260− }
261−
262− // No point in attempting to focus disabled inputs
263− return !target.disabled && !target.readOnly;
264− default:
265− return (/\bneedsfocus\b/).test(target.className);
266− }
228+ 'use strict';
229+ switch (target.nodeName.toLowerCase()) {
230+ case 'textarea':
231+ return true;
232+ case 'select':
233+ return !deviceIsAndroid;
234+ case 'input':
235+ switch (target.type) {
236+ case 'button':
237+ case 'checkbox':
238+ case 'file':
239+ case 'image':
240+ case 'radio':
241+ case 'submit':
242+ return false;
243+ }
244+
245+ // No point in attempting to focus disabled inputs
246+ return !target.disabled && !target.readOnly;
247+ default:
248+ return (/\bneedsfocus\b/).test(target.className);
249+ }
267250 };
268251
269252
@@ -274,32 +257,32 @@ FastClick.prototype.needsFocus = function(target) { · 4 unmodified lines
274257 * @param {Event} event
275258 */
276259 FastClick.prototype.sendClick = function(targetElement, event) {
277− 'use strict';
278− var clickEvent, touch;
260+ 'use strict';
261+ var clickEvent, touch;
279262
280− // On some Android devices activeElement needs to be blurred otherwise the synthetic click will have no effect (#24)
281− if (document.activeElement && document.activeElement !== targetElement) {
282− document.activeElement.blur();
283− }
263+ // On some Android devices activeElement needs to be blurred otherwise the synthetic click will have no effect (#24)
264+ if (document.activeElement && document.activeElement !== targetElement) {
265+ document.activeElement.blur();
266+ }
284267
285− touch = event.changedTouches[0];
268+ touch = event.changedTouches[0];
286269
287− // Synthesise a click event, with an extra attribute so it can be tracked
288− clickEvent = document.createEvent('MouseEvents');
289− clickEvent.initMouseEvent(this.determineEventType(targetElement), true, true, window, 1, touch.screenX, touch.screenY, touch.clientX, touch.clientY, false, false, false, false, 0, null);
290− clickEvent.forwardedTouchEvent = true;
291− targetElement.dispatchEvent(clickEvent);
270+ // Synthesise a click event, with an extra attribute so it can be tracked
271+ clickEvent = document.createEvent('MouseEvents');
272+ clickEvent.initMouseEvent(this.determineEventType(targetElement), true, true, window, 1, touch.screenX, touch.screenY, touch.clientX, touch.clientY, false, false, false, false, 0, null);
273+ clickEvent.forwardedTouchEvent = true;
274+ targetElement.dispatchEvent(clickEvent);
292275 };
293276
294277 FastClick.prototype.determineEventType = function(targetElement) {
295− 'use strict';
278+ 'use strict';
296279
297− //Issue #159: Android Chrome Select Box does not open with a synthetic click event
298− if (this.deviceIsAndroid && targetElement.tagName.toLowerCase() === 'select') {
299− return 'mousedown';
300− }
280+ //Issue #159: Android Chrome Select Box does not open with a synthetic click event
281+ if (deviceIsAndroid && targetElement.tagName.toLowerCase() === 'select') {
282+ return 'mousedown';
283+ }
301284
302− return 'click';
285+ return 'click';
303286 };
304287
305288
@@ -307,16 +290,16 @@ FastClick.prototype.determineEventType = function(targetElement) { · 1 unmodified line
307290 * @param {EventTarget|Element} targetElement
308291 */
309292 FastClick.prototype.focus = function(targetElement) {
310− 'use strict';
311− var length;
312−
313− // Issue #160: on iOS 7, some input elements (e.g. date datetime) throw a vague TypeError on setSelectionRange. These elements don't have an integer value for the selectionStart and selectionEnd properties, but unfortunately that can't be used for detection because accessing the properties also throws a TypeError. Just check the type instead. Filed as Apple bug #15122724.
314− if (this.deviceIsIOS && targetElement.setSelectionRange && targetElement.type.indexOf('date') !== 0 && targetElement.type !== 'time') {
315− length = targetElement.value.length;
316− targetElement.setSelectionRange(length, length);
317− } else {
318− targetElement.focus();
319− }
293+ 'use strict';
294+ var length;
295+
296+ // Issue #160: on iOS 7, some input elements (e.g. date datetime) throw a vague TypeError on setSelectionRange. These elements don't have an integer value for the selectionStart and selectionEnd properties, but unfortunately that can't be used for detection because accessing the properties also throws a TypeError. Just check the type instead. Filed as Apple bug #15122724.
297+ if (deviceIsIOS && targetElement.setSelectionRange && targetElement.type.indexOf('date') !== 0 && targetElement.type !== 'time') {
298+ length = targetElement.value.length;
299+ targetElement.setSelectionRange(length, length);
300+ } else {
301+ targetElement.focus();
302+ }
320303 };
321304
322305
@@ -326,30 +309,30 @@ FastClick.prototype.focus = function(targetElement) { · 3 unmodified lines
326309 * @param {EventTarget|Element} targetElement
327310 */
328311 FastClick.prototype.updateScrollParent = function(targetElement) {
329− 'use strict';
330− var scrollParent, parentElement;
331−
332− scrollParent = targetElement.fastClickScrollParent;
333−
334− // Attempt to discover whether the target element is contained within a scrollable layer. Re-check if the
335− // target element was moved to another parent.
336− if (!scrollParent || !scrollParent.contains(targetElement)) {
337− parentElement = targetElement;
338− do {
339− if (parentElement.scrollHeight > parentElement.offsetHeight) {
340− scrollParent = parentElement;
341− targetElement.fastClickScrollParent = parentElement;
342− break;
343− }
344−
345− parentElement = parentElement.parentElement;
346− } while (parentElement);
347− }
348−
349− // Always update the scroll top tracker if possible.
350− if (scrollParent) {
351− scrollParent.fastClickLastScrollTop = scrollParent.scrollTop;
352− }
312+ 'use strict';
313+ var scrollParent, parentElement;
314+
315+ scrollParent = targetElement.fastClickScrollParent;
316+
317+ // Attempt to discover whether the target element is contained within a scrollable layer. Re-check if the
318+ // target element was moved to another parent.
319+ if (!scrollParent || !scrollParent.contains(targetElement)) {
320+ parentElement = targetElement;
321+ do {
322+ if (parentElement.scrollHeight > parentElement.offsetHeight) {
323+ scrollParent = parentElement;
324+ targetElement.fastClickScrollParent = parentElement;
325+ break;
326+ }
327+
328+ parentElement = parentElement.parentElement;
329+ } while (parentElement);
330+ }
331+
332+ // Always update the scroll top tracker if possible.
333+ if (scrollParent) {
334+ scrollParent.fastClickLastScrollTop = scrollParent.scrollTop;
335+ }
353336 };
354337
355338
@@ -358,14 +341,14 @@ FastClick.prototype.updateScrollParent = function(targetElement) { · 2 unmodified lines
358341 * @returns {Element|EventTarget}
359342 */
360343 FastClick.prototype.getTargetElementFromEventTarget = function(eventTarget) {
361− 'use strict';
344+ 'use strict';
362345
363− // On some older browsers (notably Safari on iOS 4.1 - see issue #56) the event target may be a text node.
364− if (eventTarget.nodeType === Node.TEXT_NODE) {
365− return eventTarget.parentNode;
366− }
346+ // On some older browsers (notably Safari on iOS 4.1 - see issue #56) the event target may be a text node.
347+ if (eventTarget.nodeType === Node.TEXT_NODE) {
348+ return eventTarget.parentNode;
349+ }
367350
368− return eventTarget;
351+ return eventTarget;
369352 };
370353
371354
@@ -376,62 +359,62 @@ FastClick.prototype.getTargetElementFromEventTarget = function(eventTarget) { · 4 unmodified lines
376359 * @returns {boolean}
377360 */
378361 FastClick.prototype.onTouchStart = function(event) {
379− 'use strict';
380− var targetElement, touch, selection;
381−
382− // Ignore multiple touches, otherwise pinch-to-zoom is prevented if both fingers are on the FastClick element (issue #111).
383− if (event.targetTouches.length > 1) {
384− return true;
385− }
386−
387− targetElement = this.getTargetElementFromEventTarget(event.target);
388− touch = event.targetTouches[0];
389−
390− if (this.deviceIsIOS) {
391−
392− // Only trusted events will deselect text on iOS (issue #49)
393− selection = window.getSelection();
394− if (selection.rangeCount && !selection.isCollapsed) {
395− return true;
396− }
397−
398− if (!this.deviceIsIOS4) {
399−
400− // Weird things happen on iOS when an alert or confirm dialog is opened from a click event callback (issue #23):
401− // when the user next taps anywhere else on the page, new touchstart and touchend events are dispatched
402− // with the same identifier as the touch event that previously triggered the click that triggered the alert.
403− // Sadly, there is an issue on iOS 4 that causes some normal touch events to have the same identifier as an
404− // immediately preceeding touch event (issue #52), so this fix is unavailable on that platform.
405− if (touch.identifier === this.lastTouchIdentifier) {
406− event.preventDefault();
407− return false;
408− }
409−
410− this.lastTouchIdentifier = touch.identifier;
411−
412− // If the target element is a child of a scrollable layer (using -webkit-overflow-scrolling: touch) and:
413− // 1) the user does a fling scroll on the scrollable layer
414− // 2) the user stops the fling scroll with another tap
415− // then the event.target of the last 'touchend' event will be the element that was under the user's finger
416− // when the fling scroll was started, causing FastClick to send a click event to that layer - unless a check
417− // is made to ensure that a parent layer was not scrolled before sending a synthetic click (issue #42).
418− this.updateScrollParent(targetElement);
419− }
420− }
421−
422− this.trackingClick = true;
423− this.trackingClickStart = event.timeStamp;
424− this.targetElement = targetElement;
425−
426− this.touchStartX = touch.pageX;
427− this.touchStartY = touch.pageY;
428−
429− // Prevent phantom clicks on fast double-tap (issue #36)
430− if ((event.timeStamp - this.lastClickTime) < 200) {
431− event.preventDefault();
432− }
433−
434− return true;
362+ 'use strict';
363+ var targetElement, touch, selection;
364+
365+ // Ignore multiple touches, otherwise pinch-to-zoom is prevented if both fingers are on the FastClick element (issue #111).
366+ if (event.targetTouches.length > 1) {
367+ return true;
368+ }
369+
370+ targetElement = this.getTargetElementFromEventTarget(event.target);
371+ touch = event.targetTouches[0];
372+
373+ if (deviceIsIOS) {
374+
375+ // Only trusted events will deselect text on iOS (issue #49)
376+ selection = window.getSelection();
377+ if (selection.rangeCount && !selection.isCollapsed) {
378+ return true;
379+ }
380+
381+ if (!deviceIsIOS4) {
382+
383+ // Weird things happen on iOS when an alert or confirm dialog is opened from a click event callback (issue #23):
384+ // when the user next taps anywhere else on the page, new touchstart and touchend events are dispatched
385+ // with the same identifier as the touch event that previously triggered the click that triggered the alert.
386+ // Sadly, there is an issue on iOS 4 that causes some normal touch events to have the same identifier as an
387+ // immediately preceeding touch event (issue #52), so this fix is unavailable on that platform.
388+ if (touch.identifier === this.lastTouchIdentifier) {
389+ event.preventDefault();
390+ return false;
391+ }
392+
393+ this.lastTouchIdentifier = touch.identifier;
394+
395+ // If the target element is a child of a scrollable layer (using -webkit-overflow-scrolling: touch) and:
396+ // 1) the user does a fling scroll on the scrollable layer
397+ // 2) the user stops the fling scroll with another tap
398+ // then the event.target of the last 'touchend' event will be the element that was under the user's finger
399+ // when the fling scroll was started, causing FastClick to send a click event to that layer - unless a check
400+ // is made to ensure that a parent layer was not scrolled before sending a synthetic click (issue #42).
401+ this.updateScrollParent(targetElement);
402+ }
403+ }
404+
405+ this.trackingClick = true;
406+ this.trackingClickStart = event.timeStamp;
407+ this.targetElement = targetElement;
408+
409+ this.touchStartX = touch.pageX;
410+ this.touchStartY = touch.pageY;
411+
412+ // Prevent phantom clicks on fast double-tap (issue #36)
413+ if ((event.timeStamp - this.lastClickTime) < 200) {
414+ event.preventDefault();
415+ }
416+
417+ return true;
435418 };
436419
437420
@@ -442,14 +425,14 @@ FastClick.prototype.onTouchStart = function(event) { · 4 unmodified lines
442425 * @returns {boolean}
443426 */
444427 FastClick.prototype.touchHasMoved = function(event) {
445− 'use strict';
446− var touch = event.changedTouches[0], boundary = this.touchBoundary;
428+ 'use strict';
429+ var touch = event.changedTouches[0], boundary = this.touchBoundary;
447430
448− if (Math.abs(touch.pageX - this.touchStartX) > boundary || Math.abs(touch.pageY - this.touchStartY) > boundary) {
449− return true;
450− }
431+ if (Math.abs(touch.pageX - this.touchStartX) > boundary || Math.abs(touch.pageY - this.touchStartY) > boundary) {
432+ return true;
433+ }
451434
452− return false;
435+ return false;
453436 };
454437
455438
@@ -460,18 +443,18 @@ FastClick.prototype.touchHasMoved = function(event) { · 4 unmodified lines
460443 * @returns {boolean}
461444 */
462445 FastClick.prototype.onTouchMove = function(event) {
463− 'use strict';
464− if (!this.trackingClick) {
465− return true;
466− }
467−
468− // If the touch has moved, cancel the click tracking
469− if (this.targetElement !== this.getTargetElementFromEventTarget(event.target) || this.touchHasMoved(event)) {
470− this.trackingClick = false;
471− this.targetElement = null;
472− }
473−
474− return true;
446+ 'use strict';
447+ if (!this.trackingClick) {
448+ return true;
449+ }
450+
451+ // If the touch has moved, cancel the click tracking
452+ if (this.targetElement !== this.getTargetElementFromEventTarget(event.target) || this.touchHasMoved(event)) {
453+ this.trackingClick = false;
454+ this.targetElement = null;
455+ }
456+
457+ return true;
475458 };
476459
477460
@@ -482,21 +465,21 @@ FastClick.prototype.onTouchMove = function(event) { · 4 unmodified lines
482465 * @returns {Element|null}
483466 */
484467 FastClick.prototype.findControl = function(labelElement) {
485− 'use strict';
468+ 'use strict';
486469
487− // Fast path for newer browsers supporting the HTML5 control attribute
488− if (labelElement.control !== undefined) {
489− return labelElement.control;
490− }
470+ // Fast path for newer browsers supporting the HTML5 control attribute
471+ if (labelElement.control !== undefined) {
472+ return labelElement.control;
473+ }
491474
492− // All browsers under test that support touch events also support the HTML5 htmlFor attribute
493− if (labelElement.htmlFor) {
494− return document.getElementById(labelElement.htmlFor);
495− }
475+ // All browsers under test that support touch events also support the HTML5 htmlFor attribute
476+ if (labelElement.htmlFor) {
477+ return document.getElementById(labelElement.htmlFor);
478+ }
496479
497− // If no for attribute exists, attempt to retrieve the first labellable descendant element
498− // the list of which is defined here: http://www.w3.org/TR/html5/forms.html#category-label
499− return labelElement.querySelector('button, input:not([type=hidden]), keygen, meter, output, progress, select, textarea');
480+ // If no for attribute exists, attempt to retrieve the first labellable descendant element
481+ // the list of which is defined here: http://www.w3.org/TR/html5/forms.html#category-label
482+ return labelElement.querySelector('button, input:not([type=hidden]), keygen, meter, output, progress, select, textarea');
500483 };
501484
502485
@@ -507,89 +490,90 @@ FastClick.prototype.findControl = function(labelElement) { · 4 unmodified lines
507490 * @returns {boolean}
508491 */
509492 FastClick.prototype.onTouchEnd = function(event) {
510− 'use strict';
511− var forElement, trackingClickStart, targetTagName, scrollParent, touch, targetElement = this.targetElement;
512−
513− if (!this.trackingClick) {
514− return true;
515− }
516−
517− // Prevent phantom clicks on fast double-tap (issue #36)
518− if ((event.timeStamp - this.lastClickTime) < 200) {
519− this.cancelNextClick = true;
520− return true;
521− }
522−
523− // Reset to prevent wrong click cancel on input (issue #156).
524− this.cancelNextClick = false;
525−
526− this.lastClickTime = event.timeStamp;
527−
528− trackingClickStart = this.trackingClickStart;
529− this.trackingClick = false;
530− this.trackingClickStart = 0;
531−
532− // On some iOS devices, the targetElement supplied with the event is invalid if the layer
533− // is performing a transition or scroll, and has to be re-detected manually. Note that
534− // for this to function correctly, it must be called *after* the event target is checked!
535− // See issue #57; also filed as rdar://13048589 .
536− if (this.deviceIsIOSWithBadTarget) {
537− touch = event.changedTouches[0];
538−
539− // In certain cases arguments of elementFromPoint can be negative, so prevent setting targetElement to null
540− targetElement = document.elementFromPoint(touch.pageX - window.pageXOffset, touch.pageY - window.pageYOffset) || targetElement;
541− targetElement.fastClickScrollParent = this.targetElement.fastClickScrollParent;
542− }
543−
544− targetTagName = targetElement.tagName.toLowerCase();
545− if (targetTagName === 'label') {
546− forElement = this.findControl(targetElement);
547− if (forElement) {
548− this.focus(targetElement);
549− if (this.deviceIsAndroid) {
550− return false;
551− }
552−
553− targetElement = forElement;
554− }
555− } else if (this.needsFocus(targetElement)) {
556−
557− // Case 1: If the touch started a while ago (best guess is 100ms based on tests for issue #36) then focus will be triggered anyway. Return early and unset the target element reference so that the subsequent click will be allowed through.
558− // Case 2: Without this exception for input elements tapped when the document is contained in an iframe, then any inputted text won't be visible even though the value attribute is updated as the user types (issue #37).
559− if ((event.timeStamp - trackingClickStart) > 100 || (this.deviceIsIOS && window.top !== window && targetTagName === 'input')) {
560− this.targetElement = null;
561− return false;
562− }
563−
564− this.focus(targetElement);
565−
566− // Select elements need the event to go through on iOS 4, otherwise the selector menu won't open.
567− if (!this.deviceIsIOS4 || targetTagName !== 'select') {
568− this.targetElement = null;
569− event.preventDefault();
570− }
571−
572− return false;
573− }
574−
575− if (this.deviceIsIOS && !this.deviceIsIOS4) {
576−
577− // Don't send a synthetic click event if the target element is contained within a parent layer that was scrolled
578− // and this tap is being used to stop the scrolling (usually initiated by a fling - issue #42).
579− scrollParent = targetElement.fastClickScrollParent;
580− if (scrollParent && scrollParent.fastClickLastScrollTop !== scrollParent.scrollTop) {
581− return true;
582− }
583− }
584−
585− // Prevent the actual click from going though - unless the target node is marked as requiring
586− // real clicks or if it is in the whitelist in which case only non-programmatic clicks are permitted.
587− if (!this.needsClick(targetElement)) {
588− event.preventDefault();
589− this.sendClick(targetElement, event);
590− }
591−
592− return false;
493+ 'use strict';
494+ var forElement, trackingClickStart, targetTagName, scrollParent, touch, targetElement = this.targetElement;
495+
496+ if (!this.trackingClick) {
497+ return true;
498+ }
499+
500+ // Prevent phantom clicks on fast double-tap (issue #36)
501+ if ((event.timeStamp - this.lastClickTime) < 200) {
502+ this.cancelNextClick = true;
503+ return true;
504+ }
505+
506+ // Reset to prevent wrong click cancel on input (issue #156).
507+ this.cancelNextClick = false;
508+
509+ this.lastClickTime = event.timeStamp;
510+
511+ trackingClickStart = this.trackingClickStart;
512+ this.trackingClick = false;
513+ this.trackingClickStart = 0;
514+
515+ // On some iOS devices, the targetElement supplied with the event is invalid if the layer
516+ // is performing a transition or scroll, and has to be re-detected manually. Note that
517+ // for this to function correctly, it must be called *after* the event target is checked!
518+ // See issue #57; also filed as rdar://13048589 .
519+ if (deviceIsIOSWithBadTarget) {
520+ touch = event.changedTouches[0];
521+
522+ // In certain cases arguments of elementFromPoint can be negative, so prevent setting targetElement to null
523+ targetElement = document.elementFromPoint(touch.pageX - window.pageXOffset, touch.pageY - window.pageYOffset) || targetElement;
524+ targetElement.fastClickScrollParent = this.targetElement.fastClickScrollParent;
525+ }
526+
527+ targetTagName = targetElement.tagName.toLowerCase();
528+ if (targetTagName === 'label') {
529+ forElement = this.findControl(targetElement);
530+ if (forElement) {
531+ this.focus(targetElement);
532+ if (deviceIsAndroid) {
533+ return false;
534+ }
535+
536+ targetElement = forElement;
537+ }
538+ } else if (this.needsFocus(targetElement)) {
539+
540+ // Case 1: If the touch started a while ago (best guess is 100ms based on tests for issue #36) then focus will be triggered anyway. Return early and unset the target element reference so that the subsequent click will be allowed through.
541+ // Case 2: Without this exception for input elements tapped when the document is contained in an iframe, then any inputted text won't be visible even though the value attribute is updated as the user types (issue #37).
542+ if ((event.timeStamp - trackingClickStart) > 100 || (deviceIsIOS && window.top !== window && targetTagName === 'input')) {
543+ this.targetElement = null;
544+ return false;
545+ }
546+
547+ this.focus(targetElement);
548+ this.sendClick(targetElement, event);
549+
550+ // Select elements need the event to go through on iOS 4, otherwise the selector menu won't open.
551+ if (!deviceIsIOS4 || targetTagName !== 'select') {
552+ this.targetElement = null;
553+ event.preventDefault();
554+ }
555+
556+ return false;
557+ }
558+
559+ if (deviceIsIOS && !deviceIsIOS4) {
560+
561+ // Don't send a synthetic click event if the target element is contained within a parent layer that was scrolled
562+ // and this tap is being used to stop the scrolling (usually initiated by a fling - issue #42).
563+ scrollParent = targetElement.fastClickScrollParent;
564+ if (scrollParent && scrollParent.fastClickLastScrollTop !== scrollParent.scrollTop) {
565+ return true;
566+ }
567+ }
568+
569+ // Prevent the actual click from going though - unless the target node is marked as requiring
570+ // real clicks or if it is in the whitelist in which case only non-programmatic clicks are permitted.
571+ if (!this.needsClick(targetElement)) {
572+ event.preventDefault();
573+ this.sendClick(targetElement, event);
574+ }
575+
576+ return false;
593577 };
594578
595579
@@ -599,9 +583,9 @@ FastClick.prototype.onTouchEnd = function(event) { · 3 unmodified lines
599583 * @returns {void}
600584 */
601585 FastClick.prototype.onTouchCancel = function() {
602− 'use strict';
603− this.trackingClick = false;
604− this.targetElement = null;
586+ 'use strict';
587+ this.trackingClick = false;
588+ this.targetElement = null;
605589 };
606590
607591
@@ -612,45 +596,45 @@ FastClick.prototype.onTouchCancel = function() { · 4 unmodified lines
612596 * @returns {boolean}
613597 */
614598 FastClick.prototype.onMouse = function(event) {
615− 'use strict';
599+ 'use strict';
616600
617− // If a target element was never set (because a touch event was never fired) allow the event
618− if (!this.targetElement) {
619− return true;
620− }
601+ // If a target element was never set (because a touch event was never fired) allow the event
602+ if (!this.targetElement) {
603+ return true;
604+ }
621605
622− if (event.forwardedTouchEvent) {
623− return true;
624− }
606+ if (event.forwardedTouchEvent) {
607+ return true;
608+ }
625609
626− // Programmatically generated events targeting a specific element should be permitted
627− if (!event.cancelable) {
628− return true;
629− }
610+ // Programmatically generated events targeting a specific element should be permitted
611+ if (!event.cancelable) {
612+ return true;
613+ }
630614
631− // Derive and check the target element to see whether the mouse event needs to be permitted;
632− // unless explicitly enabled, prevent non-touch click events from triggering actions,
633− // to prevent ghost/doubleclicks.
634− if (!this.needsClick(this.targetElement) || this.cancelNextClick) {
615+ // Derive and check the target element to see whether the mouse event needs to be permitted;
616+ // unless explicitly enabled, prevent non-touch click events from triggering actions,
617+ // to prevent ghost/doubleclicks.
618+ if (!this.needsClick(this.targetElement) || this.cancelNextClick) {
635619
636− // Prevent any user-added listeners declared on FastClick element from being fired.
637− if (event.stopImmediatePropagation) {
638− event.stopImmediatePropagation();
639− } else {
620+ // Prevent any user-added listeners declared on FastClick element from being fired.
621+ if (event.stopImmediatePropagation) {
622+ event.stopImmediatePropagation();
623+ } else {
640624
641− // Part of the hack for browsers that don't support Event#stopImmediatePropagation (e.g. Android 2)
642− event.propagationStopped = true;
643− }
625+ // Part of the hack for browsers that don't support Event#stopImmediatePropagation (e.g. Android 2)
626+ event.propagationStopped = true;
627+ }
644628
645− // Cancel the event
646− event.stopPropagation();
647− event.preventDefault();
629+ // Cancel the event
630+ event.stopPropagation();
631+ event.preventDefault();
648632
649− return false;
650− }
633+ return false;
634+ }
651635
652− // If the mouse event is permitted, return true for the action to go through.
653− return true;
636+ // If the mouse event is permitted, return true for the action to go through.
637+ return true;
654638 };
655639
656640
@@ -663,30 +647,30 @@ FastClick.prototype.onMouse = function(event) { · 6 unmodified lines
663647 * @returns {boolean}
664648 */
665649 FastClick.prototype.onClick = function(event) {
666− 'use strict';
667− var permitted;
668−
669− // It's possible for another FastClick-like library delivered with third-party code to fire a click event before FastClick does (issue #44). In that case, set the click-tracking flag back to false and return early. This will cause onTouchEnd to return early.
670− if (this.trackingClick) {
671− this.targetElement = null;
672− this.trackingClick = false;
673− return true;
674− }
675−
676− // Very odd behaviour on iOS (issue #18): if a submit element is present inside a form and the user hits enter in the iOS simulator or clicks the Go button on the pop-up OS keyboard the a kind of 'fake' click event will be triggered with the submit-type input element as the target.
677− if (event.target.type === 'submit' && event.detail === 0) {
678− return true;
679− }
680−
681− permitted = this.onMouse(event);
682−
683− // Only unset targetElement if the click is not permitted. This will ensure that the check for !targetElement in onMouse fails and the browser's click doesn't go through.
684− if (!permitted) {
685− this.targetElement = null;
686− }
687−
688− // If clicks are permitted, return true for the action to go through.
689− return permitted;
650+ 'use strict';
651+ var permitted;
652+
653+ // It's possible for another FastClick-like library delivered with third-party code to fire a click event before FastClick does (issue #44). In that case, set the click-tracking flag back to false and return early. This will cause onTouchEnd to return early.
654+ if (this.trackingClick) {
655+ this.targetElement = null;
656+ this.trackingClick = false;
657+ return true;
658+ }
659+
660+ // Very odd behaviour on iOS (issue #18): if a submit element is present inside a form and the user hits enter in the iOS simulator or clicks the Go button on the pop-up OS keyboard the a kind of 'fake' click event will be triggered with the submit-type input element as the target.
661+ if (event.target.type === 'submit' && event.detail === 0) {
662+ return true;
663+ }
664+
665+ permitted = this.onMouse(event);
666+
667+ // Only unset targetElement if the click is not permitted. This will ensure that the check for !targetElement in onMouse fails and the browser's click doesn't go through.
668+ if (!permitted) {
669+ this.targetElement = null;
670+ }
671+
672+ // If clicks are permitted, return true for the action to go through.
673+ return permitted;
690674 };
691675
692676
@@ -696,20 +680,20 @@ FastClick.prototype.onClick = function(event) { · 3 unmodified lines
696680 * @returns {void}
697681 */
698682 FastClick.prototype.destroy = function() {
699− 'use strict';
700− var layer = this.layer;
701−
702− if (this.deviceIsAndroid) {
703− layer.removeEventListener('mouseover', this.onMouse, true);
704− layer.removeEventListener('mousedown', this.onMouse, true);
705− layer.removeEventListener('mouseup', this.onMouse, true);
706− }
707−
708− layer.removeEventListener('click', this.onClick, true);
709− layer.removeEventListener('touchstart', this.onTouchStart, false);
710− layer.removeEventListener('touchmove', this.onTouchMove, false);
711− layer.removeEventListener('touchend', this.onTouchEnd, false);
712− layer.removeEventListener('touchcancel', this.onTouchCancel, false);
683+ 'use strict';
684+ var layer = this.layer;
685+
686+ if (deviceIsAndroid) {
687+ layer.removeEventListener('mouseover', this.onMouse, true);
688+ layer.removeEventListener('mousedown', this.onMouse, true);
689+ layer.removeEventListener('mouseup', this.onMouse, true);
690+ }
691+
692+ layer.removeEventListener('click', this.onClick, true);
693+ layer.removeEventListener('touchstart', this.onTouchStart, false);
694+ layer.removeEventListener('touchmove', this.onTouchMove, false);
695+ layer.removeEventListener('touchend', this.onTouchEnd, false);
696+ layer.removeEventListener('touchcancel', this.onTouchCancel, false);
713697 };
714698
715699
@@ -719,46 +703,46 @@ FastClick.prototype.destroy = function() { · 3 unmodified lines
719703 * @param {Element} layer The layer to listen on
720704 */
721705 FastClick.notNeeded = function(layer) {
722− 'use strict';
723− var metaViewport;
724− var chromeVersion;
725−
726− // Devices that don't support touch don't need FastClick
727− if (typeof window.ontouchstart === 'undefined') {
728− return true;
729− }
730−
731− // Chrome version - zero for other browsers
732− chromeVersion = +(/Chrome\/([0-9]+)/.exec(navigator.userAgent) || [,0])[1];
733−
734− if (chromeVersion) {
735−
736− if (FastClick.prototype.deviceIsAndroid) {
737− metaViewport = document.querySelector('meta[name=viewport]');
738−
739− if (metaViewport) {
740− // Chrome on Android with user-scalable="no" doesn't need FastClick (issue #89)
741− if (metaViewport.content.indexOf('user-scalable=no') !== -1) {
742− return true;
743− }
744− // Chrome 32 and above with width=device-width or less don't need FastClick
745− if (chromeVersion > 31 && window.innerWidth <= window.screen.width) {
746− return true;
747− }
748− }
749−
750− // Chrome desktop doesn't need FastClick (issue #15)
751− } else {
752− return true;
753− }
754− }
755−
756− // IE10 with -ms-touch-action: none, which disables double-tap-to-zoom (issue #97)
757− if (layer.style.msTouchAction === 'none') {
758− return true;
759− }
760−
761− return false;
706+ 'use strict';
707+ var metaViewport;
708+ var chromeVersion;
709+
710+ // Devices that don't support touch don't need FastClick
711+ if (typeof window.ontouchstart === 'undefined') {
712+ return true;
713+ }
714+
715+ // Chrome version - zero for other browsers
716+ chromeVersion = +(/Chrome\/([0-9]+)/.exec(navigator.userAgent) || [,0])[1];
717+
718+ if (chromeVersion) {
719+
720+ if (deviceIsAndroid) {
721+ metaViewport = document.querySelector('meta[name=viewport]');
722+
723+ if (metaViewport) {
724+ // Chrome on Android with user-scalable="no" doesn't need FastClick (issue #89)
725+ if (metaViewport.content.indexOf('user-scalable=no') !== -1) {
726+ return true;
727+ }
728+ // Chrome 32 and above with width=device-width or less don't need FastClick
729+ if (chromeVersion > 31 && window.innerWidth <= window.screen.width) {
730+ return true;
731+ }
732+ }
733+
734+ // Chrome desktop doesn't need FastClick (issue #15)
735+ } else {
736+ return true;
737+ }
738+ }
739+
740+ // IE10 with -ms-touch-action: none, which disables double-tap-to-zoom (issue #97)
741+ if (layer.style.msTouchAction === 'none') {
742+ return true;
743+ }
744+
745+ return false;
762746 };
763747
764748
@@ -768,21 +752,21 @@ FastClick.notNeeded = function(layer) { · 3 unmodified lines
768752 * @param {Element} layer The layer to listen on
769753 */
770754 FastClick.attach = function(layer) {
771− 'use strict';
772− return new FastClick(layer);
755+ 'use strict';
756+ return new FastClick(layer);
773757 };
774758
775759
776760 if (typeof define !== 'undefined' && define.amd) {
777761
778− // AMD. Register as an anonymous module.
779− define(function() {
780− 'use strict';
781− return FastClick;
782− });
762+ // AMD. Register as an anonymous module.
763+ define(function() {
764+ 'use strict';
765+ return FastClick;
766+ });
783767 } else if (typeof module !== 'undefined' && module.exports) {
784− module.exports = FastClick.attach;
785− module.exports.FastClick = FastClick;
768+ module.exports = FastClick.attach;
769+ module.exports.FastClick = FastClick;
786770 } else {
787− window.FastClick = FastClick;
771+ window.FastClick = FastClick;
788772 }