GPQAPP
1;(function () {2'use strict';3
4/**5* @preserve FastClick: polyfill to remove click delays on browsers with touch UIs.
6*
7* @codingstandard ftlabs-jsv2
8* @copyright The Financial Times Limited [All Rights Reserved]
9* @license MIT License (see LICENSE.txt)
10*/
11
12/*jslint browser:true, node:true*/13/*global define, Event, Node*/14
15
16/**17* Instantiate fast-clicking listeners on the specified layer.
18*
19* @constructor
20* @param {Element} layer The layer to listen on
21* @param {Object} [options={}] The options to override the defaults
22*/
23function FastClick(layer, options) {24var oldOnClick;25
26options = options || {};27
28/**29* Whether a click is currently being tracked.
30*
31* @type boolean
32*/
33this.trackingClick = false;34
35
36/**37* Timestamp for when click tracking started.
38*
39* @type number
40*/
41this.trackingClickStart = 0;42
43
44/**45* The element being tracked for a click.
46*
47* @type EventTarget
48*/
49this.targetElement = null;50
51
52/**53* X-coordinate of touch start event.
54*
55* @type number
56*/
57this.touchStartX = 0;58
59
60/**61* Y-coordinate of touch start event.
62*
63* @type number
64*/
65this.touchStartY = 0;66
67
68/**69* ID of the last touch, retrieved from Touch.identifier.
70*
71* @type number
72*/
73this.lastTouchIdentifier = 0;74
75
76/**77* Touchmove boundary, beyond which a click will be cancelled.
78*
79* @type number
80*/
81this.touchBoundary = options.touchBoundary || 10;82
83
84/**85* The FastClick layer.
86*
87* @type Element
88*/
89this.layer = layer;90
91/**92* The minimum time between tap(touchstart and touchend) events
93*
94* @type number
95*/
96this.tapDelay = options.tapDelay || 200;97
98/**99* The maximum time for a tap
100*
101* @type number
102*/
103this.tapTimeout = options.tapTimeout || 700;104
105if (FastClick.notNeeded(layer)) {106return;107}108
109// Some old versions of Android don't have Function.prototype.bind110function bind(method, context) {111return function() { return method.apply(context, arguments); };112}113
114
115var methods = ['onMouse', 'onClick', 'onTouchStart', 'onTouchMove', 'onTouchEnd', 'onTouchCancel'];116var context = this;117for (var i = 0, l = methods.length; i < l; i++) {118context[methods[i]] = bind(context[methods[i]], context);119}120
121// Set up event handlers as required122if (deviceIsAndroid) {123layer.addEventListener('mouseover', this.onMouse, true);124layer.addEventListener('mousedown', this.onMouse, true);125layer.addEventListener('mouseup', this.onMouse, true);126}127
128layer.addEventListener('click', this.onClick, true);129layer.addEventListener('touchstart', this.onTouchStart, false);130layer.addEventListener('touchmove', this.onTouchMove, false);131layer.addEventListener('touchend', this.onTouchEnd, false);132layer.addEventListener('touchcancel', this.onTouchCancel, false);133
134// Hack is required for browsers that don't support Event#stopImmediatePropagation (e.g. Android 2)135// which is how FastClick normally stops click events bubbling to callbacks registered on the FastClick136// layer when they are cancelled.137if (!Event.prototype.stopImmediatePropagation) {138layer.removeEventListener = function(type, callback, capture) {139var rmv = Node.prototype.removeEventListener;140if (type === 'click') {141rmv.call(layer, type, callback.hijacked || callback, capture);142} else {143rmv.call(layer, type, callback, capture);144}145};146
147layer.addEventListener = function(type, callback, capture) {148var adv = Node.prototype.addEventListener;149if (type === 'click') {150adv.call(layer, type, callback.hijacked || (callback.hijacked = function(event) {151if (!event.propagationStopped) {152callback(event);153}154}), capture);155} else {156adv.call(layer, type, callback, capture);157}158};159}160
161// If a handler is already declared in the element's onclick attribute, it will be fired before162// FastClick's onClick handler. Fix this by pulling out the user-defined handler function and163// adding it as listener.164if (typeof layer.onclick === 'function') {165
166// Android browser on at least 3.2 requires a new reference to the function in layer.onclick167// - the old one won't work if passed to addEventListener directly.168oldOnClick = layer.onclick;169layer.addEventListener('click', function(event) {170oldOnClick(event);171}, false);172layer.onclick = null;173}174}175
176/**177* Windows Phone 8.1 fakes user agent string to look like Android and iPhone.
178*
179* @type boolean
180*/
181var deviceIsWindowsPhone = navigator.userAgent.indexOf("Windows Phone") >= 0;182
183/**184* Android requires exceptions.
185*
186* @type boolean
187*/
188var deviceIsAndroid = navigator.userAgent.indexOf('Android') > 0 && !deviceIsWindowsPhone;189
190
191/**192* iOS requires exceptions.
193*
194* @type boolean
195*/
196var deviceIsIOS = /iP(ad|hone|od)/.test(navigator.userAgent) && !deviceIsWindowsPhone;197
198
199/**200* iOS 4 requires an exception for select elements.
201*
202* @type boolean
203*/
204var deviceIsIOS4 = deviceIsIOS && (/OS 4_\d(_\d)?/).test(navigator.userAgent);205
206
207/**208* iOS 6.0-7.* requires the target element to be manually derived
209*
210* @type boolean
211*/
212var deviceIsIOSWithBadTarget = deviceIsIOS && (/OS [6-7]_\d/).test(navigator.userAgent);213
214/**215* BlackBerry requires exceptions.
216*
217* @type boolean
218*/
219var deviceIsBlackBerry10 = navigator.userAgent.indexOf('BB10') > 0;220
221/**222* Determine whether a given element requires a native click.
223*
224* @param {EventTarget|Element} target Target DOM element
225* @returns {boolean} Returns true if the element needs a native click
226*/
227FastClick.prototype.needsClick = function(target) {228switch (target.nodeName.toLowerCase()) {229
230// Don't send a synthetic click to disabled inputs (issue #62)231case 'button':232case 'select':233case 'textarea':234if (target.disabled) {235return true;236}237
238break;239case 'input':240
241// File inputs need real clicks on iOS 6 due to a browser bug (issue #68)242if ((deviceIsIOS && target.type === 'file') || target.disabled) {243return true;244}245
246break;247case 'label':248case 'iframe': // iOS8 homescreen apps can prevent events bubbling into frames249case 'video':250return true;251}252
253return (/\bneedsclick\b/).test(target.className);254};255
256
257/**258* Determine whether a given element requires a call to focus to simulate click into element.
259*
260* @param {EventTarget|Element} target Target DOM element
261* @returns {boolean} Returns true if the element requires a call to focus to simulate native click.
262*/
263FastClick.prototype.needsFocus = function(target) {264switch (target.nodeName.toLowerCase()) {265case 'textarea':266return true;267case 'select':268return !deviceIsAndroid;269case 'input':270switch (target.type) {271case 'button':272case 'checkbox':273case 'file':274case 'image':275case 'radio':276case 'submit':277return false;278}279
280// No point in attempting to focus disabled inputs281return !target.disabled && !target.readOnly;282default:283return (/\bneedsfocus\b/).test(target.className);284}285};286
287
288/**289* Send a click event to the specified element.
290*
291* @param {EventTarget|Element} targetElement
292* @param {Event} event
293*/
294FastClick.prototype.sendClick = function(targetElement, event) {295var clickEvent, touch;296
297// On some Android devices activeElement needs to be blurred otherwise the synthetic click will have no effect (#24)298if (document.activeElement && document.activeElement !== targetElement) {299document.activeElement.blur();300}301
302touch = event.changedTouches[0];303
304// Synthesise a click event, with an extra attribute so it can be tracked305clickEvent = document.createEvent('MouseEvents');306clickEvent.initMouseEvent(this.determineEventType(targetElement), true, true, window, 1, touch.screenX, touch.screenY, touch.clientX, touch.clientY, false, false, false, false, 0, null);307clickEvent.forwardedTouchEvent = true;308targetElement.dispatchEvent(clickEvent);309};310
311FastClick.prototype.determineEventType = function(targetElement) {312
313//Issue #159: Android Chrome Select Box does not open with a synthetic click event314if (deviceIsAndroid && targetElement.tagName.toLowerCase() === 'select') {315return 'mousedown';316}317
318return 'click';319};320
321
322/**323* @param {EventTarget|Element} targetElement
324*/
325FastClick.prototype.focus = function(targetElement) {326var length;327
328// Issue #160: on iOS 7, some input elements (e.g. date datetime month) 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.329if (deviceIsIOS && targetElement.setSelectionRange && targetElement.type.indexOf('date') !== 0 && targetElement.type !== 'time' && targetElement.type !== 'month') {330length = targetElement.value.length;331targetElement.setSelectionRange(length, length);332} else {333targetElement.focus();334}335};336
337
338/**339* Check whether the given target element is a child of a scrollable layer and if so, set a flag on it.
340*
341* @param {EventTarget|Element} targetElement
342*/
343FastClick.prototype.updateScrollParent = function(targetElement) {344var scrollParent, parentElement;345
346scrollParent = targetElement.fastClickScrollParent;347
348// Attempt to discover whether the target element is contained within a scrollable layer. Re-check if the349// target element was moved to another parent.350if (!scrollParent || !scrollParent.contains(targetElement)) {351parentElement = targetElement;352do {353if (parentElement.scrollHeight > parentElement.offsetHeight) {354scrollParent = parentElement;355targetElement.fastClickScrollParent = parentElement;356break;357}358
359parentElement = parentElement.parentElement;360} while (parentElement);361}362
363// Always update the scroll top tracker if possible.364if (scrollParent) {365scrollParent.fastClickLastScrollTop = scrollParent.scrollTop;366}367};368
369
370/**371* @param {EventTarget} targetElement
372* @returns {Element|EventTarget}
373*/
374FastClick.prototype.getTargetElementFromEventTarget = function(eventTarget) {375
376// On some older browsers (notably Safari on iOS 4.1 - see issue #56) the event target may be a text node.377if (eventTarget.nodeType === Node.TEXT_NODE) {378return eventTarget.parentNode;379}380
381return eventTarget;382};383
384
385/**386* On touch start, record the position and scroll offset.
387*
388* @param {Event} event
389* @returns {boolean}
390*/
391FastClick.prototype.onTouchStart = function(event) {392var targetElement, touch, selection;393
394// Ignore multiple touches, otherwise pinch-to-zoom is prevented if both fingers are on the FastClick element (issue #111).395if (event.targetTouches.length > 1) {396return true;397}398
399targetElement = this.getTargetElementFromEventTarget(event.target);400touch = event.targetTouches[0];401
402if (deviceIsIOS) {403
404// Only trusted events will deselect text on iOS (issue #49)405selection = window.getSelection();406if (selection.rangeCount && !selection.isCollapsed) {407return true;408}409
410if (!deviceIsIOS4) {411
412// Weird things happen on iOS when an alert or confirm dialog is opened from a click event callback (issue #23):413// when the user next taps anywhere else on the page, new touchstart and touchend events are dispatched414// with the same identifier as the touch event that previously triggered the click that triggered the alert.415// Sadly, there is an issue on iOS 4 that causes some normal touch events to have the same identifier as an416// immediately preceeding touch event (issue #52), so this fix is unavailable on that platform.417// Issue 120: touch.identifier is 0 when Chrome dev tools 'Emulate touch events' is set with an iOS device UA string,418// which causes all touch events to be ignored. As this block only applies to iOS, and iOS identifiers are always long,419// random integers, it's safe to to continue if the identifier is 0 here.420if (touch.identifier && touch.identifier === this.lastTouchIdentifier) {421event.preventDefault();422return false;423}424
425this.lastTouchIdentifier = touch.identifier;426
427// If the target element is a child of a scrollable layer (using -webkit-overflow-scrolling: touch) and:428// 1) the user does a fling scroll on the scrollable layer429// 2) the user stops the fling scroll with another tap430// then the event.target of the last 'touchend' event will be the element that was under the user's finger431// when the fling scroll was started, causing FastClick to send a click event to that layer - unless a check432// is made to ensure that a parent layer was not scrolled before sending a synthetic click (issue #42).433this.updateScrollParent(targetElement);434}435}436
437this.trackingClick = true;438this.trackingClickStart = event.timeStamp;439this.targetElement = targetElement;440
441this.touchStartX = touch.pageX;442this.touchStartY = touch.pageY;443
444// Prevent phantom clicks on fast double-tap (issue #36)445if ((event.timeStamp - this.lastClickTime) < this.tapDelay) {446event.preventDefault();447}448
449return true;450};451
452
453/**454* Based on a touchmove event object, check whether the touch has moved past a boundary since it started.
455*
456* @param {Event} event
457* @returns {boolean}
458*/
459FastClick.prototype.touchHasMoved = function(event) {460var touch = event.changedTouches[0], boundary = this.touchBoundary;461
462if (Math.abs(touch.pageX - this.touchStartX) > boundary || Math.abs(touch.pageY - this.touchStartY) > boundary) {463return true;464}465
466return false;467};468
469
470/**471* Update the last position.
472*
473* @param {Event} event
474* @returns {boolean}
475*/
476FastClick.prototype.onTouchMove = function(event) {477if (!this.trackingClick) {478return true;479}480
481// If the touch has moved, cancel the click tracking482if (this.targetElement !== this.getTargetElementFromEventTarget(event.target) || this.touchHasMoved(event)) {483this.trackingClick = false;484this.targetElement = null;485}486
487return true;488};489
490
491/**492* Attempt to find the labelled control for the given label element.
493*
494* @param {EventTarget|HTMLLabelElement} labelElement
495* @returns {Element|null}
496*/
497FastClick.prototype.findControl = function(labelElement) {498
499// Fast path for newer browsers supporting the HTML5 control attribute500if (labelElement.control !== undefined) {501return labelElement.control;502}503
504// All browsers under test that support touch events also support the HTML5 htmlFor attribute505if (labelElement.htmlFor) {506return document.getElementById(labelElement.htmlFor);507}508
509// If no for attribute exists, attempt to retrieve the first labellable descendant element510// the list of which is defined here: http://www.w3.org/TR/html5/forms.html#category-label511return labelElement.querySelector('button, input:not([type=hidden]), keygen, meter, output, progress, select, textarea');512};513
514
515/**516* On touch end, determine whether to send a click event at once.
517*
518* @param {Event} event
519* @returns {boolean}
520*/
521FastClick.prototype.onTouchEnd = function(event) {522var forElement, trackingClickStart, targetTagName, scrollParent, touch, targetElement = this.targetElement;523
524if (!this.trackingClick) {525return true;526}527
528// Prevent phantom clicks on fast double-tap (issue #36)529if ((event.timeStamp - this.lastClickTime) < this.tapDelay) {530this.cancelNextClick = true;531return true;532}533
534if ((event.timeStamp - this.trackingClickStart) > this.tapTimeout) {535return true;536}537
538// Reset to prevent wrong click cancel on input (issue #156).539this.cancelNextClick = false;540
541this.lastClickTime = event.timeStamp;542
543trackingClickStart = this.trackingClickStart;544this.trackingClick = false;545this.trackingClickStart = 0;546
547// On some iOS devices, the targetElement supplied with the event is invalid if the layer548// is performing a transition or scroll, and has to be re-detected manually. Note that549// for this to function correctly, it must be called *after* the event target is checked!550// See issue #57; also filed as rdar://13048589 .551if (deviceIsIOSWithBadTarget) {552touch = event.changedTouches[0];553
554// In certain cases arguments of elementFromPoint can be negative, so prevent setting targetElement to null555targetElement = document.elementFromPoint(touch.pageX - window.pageXOffset, touch.pageY - window.pageYOffset) || targetElement;556targetElement.fastClickScrollParent = this.targetElement.fastClickScrollParent;557}558
559targetTagName = targetElement.tagName.toLowerCase();560if (targetTagName === 'label') {561forElement = this.findControl(targetElement);562if (forElement) {563this.focus(targetElement);564if (deviceIsAndroid) {565return false;566}567
568targetElement = forElement;569}570} else if (this.needsFocus(targetElement)) {571
572// 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.573// 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).574if ((event.timeStamp - trackingClickStart) > 100 || (deviceIsIOS && window.top !== window && targetTagName === 'input')) {575this.targetElement = null;576return false;577}578
579this.focus(targetElement);580this.sendClick(targetElement, event);581
582// Select elements need the event to go through on iOS 4, otherwise the selector menu won't open.583// Also this breaks opening selects when VoiceOver is active on iOS6, iOS7 (and possibly others)584if (!deviceIsIOS || targetTagName !== 'select') {585this.targetElement = null;586event.preventDefault();587}588
589return false;590}591
592if (deviceIsIOS && !deviceIsIOS4) {593
594// Don't send a synthetic click event if the target element is contained within a parent layer that was scrolled595// and this tap is being used to stop the scrolling (usually initiated by a fling - issue #42).596scrollParent = targetElement.fastClickScrollParent;597if (scrollParent && scrollParent.fastClickLastScrollTop !== scrollParent.scrollTop) {598return true;599}600}601
602// Prevent the actual click from going though - unless the target node is marked as requiring603// real clicks or if it is in the whitelist in which case only non-programmatic clicks are permitted.604if (!this.needsClick(targetElement)) {605event.preventDefault();606this.sendClick(targetElement, event);607}608
609return false;610};611
612
613/**614* On touch cancel, stop tracking the click.
615*
616* @returns {void}
617*/
618FastClick.prototype.onTouchCancel = function() {619this.trackingClick = false;620this.targetElement = null;621};622
623
624/**625* Determine mouse events which should be permitted.
626*
627* @param {Event} event
628* @returns {boolean}
629*/
630FastClick.prototype.onMouse = function(event) {631
632// If a target element was never set (because a touch event was never fired) allow the event633if (!this.targetElement) {634return true;635}636
637if (event.forwardedTouchEvent) {638return true;639}640
641// Programmatically generated events targeting a specific element should be permitted642if (!event.cancelable) {643return true;644}645
646// Derive and check the target element to see whether the mouse event needs to be permitted;647// unless explicitly enabled, prevent non-touch click events from triggering actions,648// to prevent ghost/doubleclicks.649if (!this.needsClick(this.targetElement) || this.cancelNextClick) {650
651// Prevent any user-added listeners declared on FastClick element from being fired.652if (event.stopImmediatePropagation) {653event.stopImmediatePropagation();654} else {655
656// Part of the hack for browsers that don't support Event#stopImmediatePropagation (e.g. Android 2)657event.propagationStopped = true;658}659
660// Cancel the event661event.stopPropagation();662event.preventDefault();663
664return false;665}666
667// If the mouse event is permitted, return true for the action to go through.668return true;669};670
671
672/**673* On actual clicks, determine whether this is a touch-generated click, a click action occurring
674* naturally after a delay after a touch (which needs to be cancelled to avoid duplication), or
675* an actual click which should be permitted.
676*
677* @param {Event} event
678* @returns {boolean}
679*/
680FastClick.prototype.onClick = function(event) {681var permitted;682
683// 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.684if (this.trackingClick) {685this.targetElement = null;686this.trackingClick = false;687return true;688}689
690// 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.691if (event.target.type === 'submit' && event.detail === 0) {692return true;693}694
695permitted = this.onMouse(event);696
697// 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.698if (!permitted) {699this.targetElement = null;700}701
702// If clicks are permitted, return true for the action to go through.703return permitted;704};705
706
707/**708* Remove all FastClick's event listeners.
709*
710* @returns {void}
711*/
712FastClick.prototype.destroy = function() {713var layer = this.layer;714
715if (deviceIsAndroid) {716layer.removeEventListener('mouseover', this.onMouse, true);717layer.removeEventListener('mousedown', this.onMouse, true);718layer.removeEventListener('mouseup', this.onMouse, true);719}720
721layer.removeEventListener('click', this.onClick, true);722layer.removeEventListener('touchstart', this.onTouchStart, false);723layer.removeEventListener('touchmove', this.onTouchMove, false);724layer.removeEventListener('touchend', this.onTouchEnd, false);725layer.removeEventListener('touchcancel', this.onTouchCancel, false);726};727
728
729/**730* Check whether FastClick is needed.
731*
732* @param {Element} layer The layer to listen on
733*/
734FastClick.notNeeded = function(layer) {735var metaViewport;736var chromeVersion;737var blackberryVersion;738var firefoxVersion;739
740// Devices that don't support touch don't need FastClick741if (typeof window.ontouchstart === 'undefined') {742return true;743}744
745// Chrome version - zero for other browsers746chromeVersion = +(/Chrome\/([0-9]+)/.exec(navigator.userAgent) || [,0])[1];747
748if (chromeVersion) {749
750if (deviceIsAndroid) {751metaViewport = document.querySelector('meta[name=viewport]');752
753if (metaViewport) {754// Chrome on Android with user-scalable="no" doesn't need FastClick (issue #89)755if (metaViewport.content.indexOf('user-scalable=no') !== -1) {756return true;757}758// Chrome 32 and above with width=device-width or less don't need FastClick759if (chromeVersion > 31 && document.documentElement.scrollWidth <= window.outerWidth) {760return true;761}762}763
764// Chrome desktop doesn't need FastClick (issue #15)765} else {766return true;767}768}769
770if (deviceIsBlackBerry10) {771blackberryVersion = navigator.userAgent.match(/Version\/([0-9]*)\.([0-9]*)/);772
773// BlackBerry 10.3+ does not require Fastclick library.774// https://github.com/ftlabs/fastclick/issues/251775if (blackberryVersion[1] >= 10 && blackberryVersion[2] >= 3) {776metaViewport = document.querySelector('meta[name=viewport]');777
778if (metaViewport) {779// user-scalable=no eliminates click delay.780if (metaViewport.content.indexOf('user-scalable=no') !== -1) {781return true;782}783// width=device-width (or less than device-width) eliminates click delay.784if (document.documentElement.scrollWidth <= window.outerWidth) {785return true;786}787}788}789}790
791// IE10 with -ms-touch-action: none or manipulation, which disables double-tap-to-zoom (issue #97)792if (layer.style.msTouchAction === 'none' || layer.style.touchAction === 'manipulation') {793return true;794}795
796// Firefox version - zero for other browsers797firefoxVersion = +(/Firefox\/([0-9]+)/.exec(navigator.userAgent) || [,0])[1];798
799if (firefoxVersion >= 27) {800// Firefox 27+ does not have tap delay if the content is not zoomable - https://bugzilla.mozilla.org/show_bug.cgi?id=922896801
802metaViewport = document.querySelector('meta[name=viewport]');803if (metaViewport && (metaViewport.content.indexOf('user-scalable=no') !== -1 || document.documentElement.scrollWidth <= window.outerWidth)) {804return true;805}806}807
808// IE11: prefixed -ms-touch-action is no longer supported and it's recomended to use non-prefixed version809// http://msdn.microsoft.com/en-us/library/windows/apps/Hh767313.aspx810if (layer.style.touchAction === 'none' || layer.style.touchAction === 'manipulation') {811return true;812}813
814return false;815};816
817
818/**819* Factory method for creating a FastClick object
820*
821* @param {Element} layer The layer to listen on
822* @param {Object} [options={}] The options to override the defaults
823*/
824FastClick.attach = function(layer, options) {825return new FastClick(layer, options);826};827
828
829if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {830
831// AMD. Register as an anonymous module.832define(function() {833return FastClick;834});835} else if (typeof module !== 'undefined' && module.exports) {836module.exports = FastClick.attach;837module.exports.FastClick = FastClick;838} else {839window.FastClick = FastClick;840}841}());842