Repository: hammerjs/hammer.js Branch: master Commit: ff687ea0daa3 Files: 107 Total size: 262.0 KB Directory structure: gitextract_3wvcy3sg/ ├── .bowerrc ├── .editorconfig ├── .gitignore ├── .jscsrc ├── .jshintrc ├── .travis.yml ├── CHANGELOG.md ├── CONTRIBUTING.md ├── LICENSE.md ├── README.md ├── banner.ejs ├── bower.json ├── changelog.js ├── component.json ├── hammer.js ├── package.json ├── rollup.config.js ├── src/ │ ├── .babelrc │ ├── hammer.js │ ├── input/ │ │ ├── mouse.js │ │ ├── pointerevent.js │ │ ├── singletouch.js │ │ ├── touch.js │ │ └── touchmouse.js │ ├── inputjs/ │ │ ├── compute-delta-xy.js │ │ ├── compute-input-data.js │ │ ├── compute-interval-input-data.js │ │ ├── create-input-instance.js │ │ ├── get-angle.js │ │ ├── get-center.js │ │ ├── get-direction.js │ │ ├── get-distance.js │ │ ├── get-rotation.js │ │ ├── get-scale.js │ │ ├── get-velocity.js │ │ ├── input-constructor.js │ │ ├── input-consts.js │ │ ├── input-handler.js │ │ └── simple-clone-input-data.js │ ├── main.js │ ├── manager.js │ ├── recognizerjs/ │ │ ├── direction-str.js │ │ ├── get-recognizer-by-name-if-manager.js │ │ ├── recognizer-constructor.js │ │ ├── recognizer-consts.js │ │ └── state-str.js │ ├── recognizers/ │ │ ├── attribute.js │ │ ├── pan.js │ │ ├── pinch.js │ │ ├── press.js │ │ ├── rotate.js │ │ ├── swipe.js │ │ └── tap.js │ ├── touchactionjs/ │ │ ├── clean-touch-actions.js │ │ ├── get-touchaction-props.js │ │ ├── touchaction-Consts.js │ │ └── touchaction-constructor.js │ └── utils/ │ ├── add-event-listeners.js │ ├── assign.js │ ├── bind-fn.js │ ├── bool-or-fn.js │ ├── deprecate.js │ ├── each.js │ ├── extend.js │ ├── get-window-for-element.js │ ├── has-parent.js │ ├── if-undefined.js │ ├── in-array.js │ ├── in-str.js │ ├── inherit.js │ ├── invoke-array-arg.js │ ├── merge.js │ ├── prefixed.js │ ├── remove-event-listeners.js │ ├── set-timeout-context.js │ ├── split-str.js │ ├── to-array.js │ ├── unique-array.js │ ├── unique-id.js │ └── utils-consts.js ├── string-replace.js └── tests/ ├── manual/ │ ├── assets/ │ │ └── style.css │ ├── compute_touch_action.html │ ├── input.html │ ├── log.html │ ├── multiple.html │ ├── nested.html │ ├── simulator-googlemaps.html │ ├── simulator.html │ ├── touchaction.html │ └── visual.html └── unit/ ├── assets/ │ └── utils.js ├── gestures/ │ ├── test_pan.js │ ├── test_pinch.js │ └── test_swipe.js ├── index.html ├── test_enable.js ├── test_events.js ├── test_gestures.js ├── test_hammer.js ├── test_jquery_plugin.js ├── test_multiple_taps.js ├── test_nested_gesture_recognizers.js ├── test_propagation_bubble.js ├── test_require_failure.js ├── test_simultaneous_recognition.js └── test_utils.js ================================================ FILE CONTENTS ================================================ ================================================ FILE: .bowerrc ================================================ { "json": "bower.json" } ================================================ FILE: .editorconfig ================================================ # EditorConfig helps developers define and maintain consistent # coding styles between different editors and IDEs # editorconfig.org root = true [*] end_of_line = lf charset = utf-8 trim_trailing_whitespace = true insert_final_newline = true indent_style = space indent_size = 2 [*.js] indent_style = space indent_size = 2 [*.md] trim_trailing_whitespace = false ================================================ FILE: .gitignore ================================================ # ide .idea .iml # node lib-cov *.seed *.log *.csv *.dat *.out *.pid *.gz pids logs results tests/build.js npm-debug.log node_modules ================================================ FILE: .jscsrc ================================================ { "preset": "ember-suave", "excludeFiles": [ "tests/**/assets", "node_modules/**" ], "disallowConstOutsideModuleScope": false, "requireArrowFunctions": true, "disallowEmptyBlocks": false } ================================================ FILE: .jshintrc ================================================ { "maxerr": 100, "freeze": true, "node": false, "indent": 2, "predef": [ "document", "window" ], "browser": true, "boss": true, "curly": true, "debug": false, "devel": true, "eqeqeq": true, "expr": true, "validthis": true, "evil": true, "forin": false, "immed": false, "laxbreak": false, "newcap": true, "noarg": true, "node": true, "noempty": false, "nonew": false, "nomen": false, "onevar": false, "plusplus": false, "regexp": false, "undef": true, "sub": true, "strict": false, "white": false, "eqnull": true, "esversion": 6, "unused": true, "-W116": true, "-W080": true, "-W038": true, "proto": true } ================================================ FILE: .travis.yml ================================================ language: node_js node_js: - "6.3.0" sudo: false script: - npm run test ================================================ FILE: CHANGELOG.md ================================================ # Changelog ### 2.0.8, 2016-04-22 ##### Manager - Added check to ensure that the required parameters are present ([#908](https://github.com/hammerjs/hammer.js/issues/908), [085d3a8](https://github.com/hammer.js/hammerjs/commit/085d3a87eab8674c45e9d3a14c4ca44ad7b97e26)) - Fixed restoration of Hammer.defaults.cssProps on destory ([#904theregttr5ki](https://github.com/hammerjs/hammer.js/issues/904), [7d0e60f](https://github.com/hammer.js/hammerjs/commit/7d0e60f6743517db3c05a38e966fb9fb5052fa03)) ##### Input - Fixed de-duping of mouse events on mouse touch combo devices ([#917](https://github.com/hammer.js/hammer.js/issues/917), [#863](https://github.com/hammerjs/hammer.js/issues/863), [bfeb89a](https://github.com/hammerjs/hammerjs/commit/bfeb89a77f778c527f771150d1e9687bd318ce8d)) ##### Touch-action - Added support map for specific values of touch-action ([#952](https://github.com/hammer.js/hammer.js/issues/952), [fbe9fd7](https://github.com/hammerjs/hammer.js/commit/fbe9fd775fe8cb3d43faa9428bfa56b61b16edc7)) ### 2.0.6, 2015-12-23 - Add Assign method and deprecate merge and extend ([#895](https://github.com/hammerjs/hammer.js/pull/895)[fc01eae](https://github.com/hammerjs/hammer.js/commit/fc01eaea678acc430c664eb374555fbe3d403bdd)) - Expose Hammer on window or self if either is defined to avoid issues when AMD is present but not used. ( [356f795](https://github.com/hammerjs/hammer.js/commit/356f7955b01f3679c29d6c45931679256b45036e)) - Add support for PointerEvent instead of MSPointerEvent if supported. ([#754](https://github.com/hammerjs/hammer.js/issues/754), [439c7a6](https://github.com/hammerjs/hammer.js/commit/439c7a6c46978ab387b4b8289399e904d1c49535)) - Fixed moz-prefix, prefix should be Moz not moz. ([3ea47f3](https://github.com/hammerjs/hammer.js/commit/3ea47f3aebadc9d3bb6bf52bc8402cad135ef8a9)) - Removed non-existant recognizer ([f1c2d3b](https://github.com/hammerjs/hammer.js/commit/f1c2d3bf05f530ae092ecfc2335fceeff0e9eec9)) - Fixed config leaking between instances([189098f](https://github.com/hammerjs/hammer.js/commit/189098ff7736f6ed2fce9a3d3e1f5a3afee085ba)) - Fixed gaps in gesture configs and update tests to match ([70c2902](https://github.com/hammerjs/hammer.js/commit/70c2902d773a750e92ce8c423f8a4165c07eab97)) - Fixed Manager off method ([#768](https://github.com/hammerjs/hammer.js/issues/768), [da49a27](https://github.com/hammerjs/hammer.js/commit/da49a2730779ecc3b4dd147cc418a0df7c70fad9)) - Added compatibility with requirejs optimizer namespaces ( [70075f2](https://github.com/hammerjs/hammer.js/commit/70075f2df1b855f7c6d8d3caac49b9276b88c8d6)) - Made touchaction test zoomable ( [50264a7](https://github.com/hammerjs/hammer.js/commit/50264a70251ca88bbaf7b666401e527eee616de5)) - Fixed preventing default when for `pan-x pan-y` case ( [95eaafa](https://github.com/hammerjs/hammer.js/commit/95eaafadad27bd1b25d20cf976811a451922f1c4)) - Fixed incorrect touch action pan direction ( [a81da57](https://github.com/hammerjs/hammer.js/commit/a81da57a82ebf37e695e7c443e4e2715e7f32856)) - Fixed combined pan-x pan-y to resolve to none ( [fdae07b](https://github.com/hammerjs/hammer.js/commit/fdae07bc2ba3c90aad28da6791b3d5df627bc612)) - Fixed inverted touch-action for pan recognizer ([#728](https://github.com/hammerjs/hammer.js/issues/728), [605bd3b](https://github.com/hammerjs/hammer.js/commit/605bd3beca780be91dd43f9da8b809d155a43d1a)) - Fixed dependency on non standard touch list ordering ([#610](https://github.com/hammerjs/hammer.js/issues/610), [#791](https://github.com/hammerjs/hammer.js/issues/791), [287720a](https://github.com/hammerjs/hammer.js/commit/287720a6e5067e7f28be8b8b3b266d22905361c4)) - Fixed swipe to not trigger after multitouch gesture ([#640](https://github.com/hammerjs/hammer.js/issues/640), [711d8a1](https://github.com/hammerjs/hammer.js/commit/711d8a1df1aa5057ecb536454a36257e3c0d6d91)) - Fixed swipe recognizer to use overall gesture direction and velocity ( [963fe69](https://github.com/hammerjs/hammer.js/commit/963fe697515273fee508414bc29e2656465cea55)) - Fixed getDirection returning reversed direction ( [e40dcde](https://github.com/hammerjs/hammer.js/commit/e40dcde43bdac7a74c8ce5c05a4f62121089cd91)) - Fixed detection of tap when multi touch gestures are present ( [c46cbba](https://github.com/hammerjs/hammer.js/commit/c46cbba1c2cbbf874b59913416858d9dae297e64)) - Fixed incorrect event order ([#824](https://github.com/hammerjs/hammer.js/issues/824), [92f2d76](https://github.com/hammerjs/hammer.js/commit/92f2d76188480d967e738a19cd508d0b94a31329)) - Fixed leaking options between recognizer instances ([#813](https://github.com/hammerjs/hammer.js/issues/813), [af32c9b](https://github.com/hammerjs/hammer.js/commit/af32c9bace3f04bb34bee852ff56a33cc8fc27cd)) - Fixed detection when element has no style attribute ( [5ca6d8c](https://github.com/hammerjs/hammer.js/commit/5ca6d8cbead02c71929a8073e95ddf98e11c0e06)) ### 2.0.4, 2014-09-28 - Fix IE pointer issue. [#665](https://github.com/hammerjs/hammer.js/pull/665) - Fix multi-touch at different elements. [#668](https://github.com/hammerjs/hammer.js/pull/668) - Added experimental [single-user Touch input handler](src/input/singletouch.js). This to improve performance/ux when only a single user has to be supported. Plans are to release 2.1 with this as default, and a settings to enable the multi-user handler. ### 2.0.3, 2014-09-10 - Manager.set improvements. - Fix requireFailure() call in Manager.options.recognizers. - Make DIRECTION_ALL for pan and swipe gestures less blocking. - Fix Swipe recognizer threshold option. - Expose the Input classes. - Added the option `inputClass` to set the used input handler. ### 2.0.2, 2014-07-26 - Improved mouse and pointer-events input, now able to move outside the window. - Added the export name (`Hammer`) as an argument to the wrapper. - Add the option *experimental* `inputTarget` to change the element that receives the events. - Improved performance when only one touch being active. - Fixed the jumping deltaXY bug when going from single to multi-touch. - Improved velocity calculations. ### 2.0.1, 2014-07-15 - Fix issue when no document.body is available - Added pressup event for the press recognizer - Removed alternative for Object.create ### 2.0.0, 2014-07-11 - Full rewrite of the library. ================================================ FILE: CONTRIBUTING.md ================================================ # Contributing to Hammer.js Looking to contribute something to Hammer.js? **Here's how you can help.** ## Reporting issues We only accept issues that are bug reports or feature requests. Bugs must be isolated and reproducible problems that can be fixed within the Hammer.js. Please read the following guidelines before opening any issue. 1. [**Read the documentation**](https://hammerjs.github.io) 2. **Search for existing issues.** We get a lot of duplicate issues, and you'd help us out a lot by first checking if someone else has reported the same issue. Moreover, the issue may have already been resolved with a fix available. Also take a look if your problem is explained at the Wiki. 3. **Create an isolated and reproducible test case.** Be sure the problem exists in Hammer's code with a reduced test case that should be included in each bug report. 4. **Include a live example.** Make use of jsFiddle or jsBin to share your isolated test cases. Also, a screen capture would work, with tools like LICEcap. 5. **Share as much information as possible.** Include operating system and version, browser and version, version of Hammer.js, customized or vanilla build, etc. where appropriate. Also include steps to reproduce the bug. ## Pull requests 1. Changes must be done in `/src` files, never just the compiled files. Also, don't commit the compiled files. 2. Try not to pollute your pull request with unintended changes. Keep them simple and small 3. Try to share which browsers your code has been tested in before submitting a pull request 4. Write tests for your code, these can be found in `/tests`. ================================================ FILE: LICENSE.md ================================================ The MIT License (MIT) Copyright (C) 2011-2017 by Jorik Tangelder (Eight Media) Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. ================================================ FILE: README.md ================================================ # [hammer.js][hammerjs-url] [![NPM Version][npm-image]][npm-url] [![NPM Downloads][downloads-image]][downloads-url] [![Build Status][travis-image]][travis-url] > A JavaScript library for detecting touch gestures. ## Installation ### NPM ```sh npm install --save hammerjs ``` **or** ### Yarn ```sh yarn add hammerjs ``` **or** ### CDN [https://cdnjs.com/libraries/hammer.js/](https://cdnjs.com/libraries/hammer.js/) ## Usage hammer.js has a quick start option for gestures it already recognizes. ```js // Get a reference to an element. var square = document.querySelector('.square'); // Create an instance of Hammer with the reference. var hammer = new Hammer(square); // Subscribe to a quick start event: press, tap, or doubletap. // For a full list of quick start events, read the documentation. hammer.on('press', function(e) { e.target.classList.toggle('expand'); console.log("You're pressing me!"); console.log(e); }); ``` If you want to recognize your own gestures, such as `tripletap`, then you'll have to use these steps: ```js // Get a reference to an element. var square = document.querySelector('.square'); // Create a manager to manage the element. var manager = new Hammer.Manager(square); // Create a recognizer. var TripleTap = new Hammer.Tap({ event: 'tripletap', taps: 3 }); // Add the recognizer to the manager. manager.add(TripleTap); // Subscribe to the event. manager.on('tripletap', function(e) { e.target.classList.toggle('expand'); console.log("You're triple tapping me!"); console.log(e); }); ``` ## Examples - [tap][tap] - [double tap][double-tap] - [press][press] - [swipe][swipe] ## Documentation For further information regarding hammer.js, please read our [documentation][hammerjs-url]. ## Contributions [![Github Issues][issues-image]][issues-url] [![Github PRs][pulls-image]][pulls-url] [![Slack][slack-image]][slack-url] Feel encouraged to report issues or submit pull requests. When you're ready to do either, read our [contribution guidelines][contribution-guidelines]. If you're looking for another form of contribution, we love help answering questions on our [slack channel][slack-url]. ## License [MIT][license] [hammerjs-url]: http://hammerjs.github.io [npm-image]: https://img.shields.io/npm/v/hammerjs.svg [npm-url]: https://npmjs.org/package/hammerjs [travis-image]: https://img.shields.io/travis/stream-utils/raw-body/master.svg [travis-url]: https://travis-ci.org/hammerjs/hammer.js [downloads-image]: https://img.shields.io/npm/dm/hammerjs.svg [downloads-url]: https://npmjs.org/package/hammerjs [tap]: https://codepen.io/choskim/pen/WZggmg [double-tap]: https://codepen.io/choskim/pen/vezzwZ [press]: https://codepen.io/choskim/pen/RLYebL [pan]: '' [swipe]: https://codepen.io/choskim/pen/rGZqxa [pinch]: '' [rotate]: '' [issues-image]: https://img.shields.io/github/issues/hammerjs/hammer.js.svg [issues-url]: https://github.com/hammerjs/hammer.js/issues [pulls-image]: https://img.shields.io/github/issues-pr/hammerjs/hammer.js.svg [pulls-url]: https://github.com/hammerjs/hammer.js/pulls [slack-image]: https://hammerjs.herokuapp.com/badge.svg [slack-url]: https://hammerjs.herokuapp.com/ [contribution-guidelines]: ./CONTRIBUTING.md [license]: ./LICENSE.md ================================================ FILE: banner.ejs ================================================ /*! <%= pkg.title || pkg.name %> - v<%= pkg.version %> - <%= [ date.getFullYear(), ('0' + (date.getMonth() + 1)).slice(-2), ('0' + date.getDate()).slice(-2)].join('-') %> * <%= pkg.homepage %> * * Copyright (c) <%= %> <%= pkg.author.name %>; * Licensed under the <%= pkg.license %> license */ ================================================ FILE: bower.json ================================================ { "name": "hammerjs", "license": "MIT", "main": "hammer.js", "ignore": [ "tests", "src", ".bowerrc", ".gitignore", ".jscsrc", ".jshintrc", ".travis.yml", "component.json", "package.json" ] } ================================================ FILE: changelog.js ================================================ var changelog = require( "changelogplease" ); var gittags = require( "git-tags" ).get( function( error, tags ) { if ( error ) { throw error } console.log( tags[ 2 ] + ".." + tags[ 0 ] ); var exclude = [ "Merge", "Whitespace", "Fixup", "Cleanup", "Formatting", "Ignore" ]; changelog( { ticketUrl: "https://github.com/hammerjs/hammer.js/issues/{id}", commitUrl: "https://github.com/hammerjs/hammerjs/commit/{id}", sort: false, repo: "./", committish: tags[ 2 ] + ".." + tags[ 0 ] }, function( error, log ) { if ( error ) { throw error; } log = parseLog( log ); console.log( log ); } ); function parseLog( log ) { var lines = log.split( "\n" ); var newLog = []; var log = []; var currentComponent; lines.shift(); lines.forEach( function( line ) { var newLine = parseLine( line ); if ( newLine ) { log.push( line ); } } ); var log = log.join( "\n" ); return log.replace( /\*/g, "-" ).replace( /__TICKETREF__,/g, "" ); } function parseLine( line ) { var parts = getParts( line ); if ( exclude.indexOf( parts.component ) > -1 ) { return false; } return parts; } function getParts( line ) { var parts = line.split( ":" ); var component = ""; var message; var commits = line.match( /\{\{([A-Za-z0-9 ]){0,99}\}\}/ ) if ( parts.length > 1 && parts[ 0 ].length <= 20 ) { component = parts[ 0 ]; parts.shift(); message = parts.join( ":" ); } else { parts = line.split( " " ); component = parts[ 1 ]; parts.shift(); message = parts.join( " " ); } if ( component ) { component = component.replace( /\* |,/, "" ); } return { component: component, message: message }; } } ); ================================================ FILE: component.json ================================================ { "name": "hammerjs", "version": "2.0.6", "main": "hammer.js", "scripts": [ "hammer.js" ] } ================================================ FILE: hammer.js ================================================ /*! Hammer.JS - v2.0.8 - 2016-09-30 * http://hammerjs.github.io/ * * Copyright (c) Jorik Tangelder; * Licensed under the MIT license */ (function(window, document, exportName, undefined) { 'use strict'; /** * @private * use the val2 when val1 is undefined * @param {*} val1 * @param {*} val2 * @returns {*} */ function ifUndefined(val1, val2) { return val1 === undefined ? val2 : val1; } var VENDOR_PREFIXES = ['', 'webkit', 'Moz', 'MS', 'ms', 'o']; var TEST_ELEMENT = document.createElement('div'); var TYPE_FUNCTION = 'function'; var round = Math.round; var abs = Math.abs; var now = Date.now; /** * @private * get the prefixed property * @param {Object} obj * @param {String} property * @returns {String|Undefined} prefixed */ function prefixed(obj, property) { var prefix = void 0; var prop = void 0; var camelProp = property[0].toUpperCase() + property.slice(1); var i = 0; while (i < VENDOR_PREFIXES.length) { prefix = VENDOR_PREFIXES[i]; prop = prefix ? prefix + camelProp : property; if (prop in obj) { return prop; } i++; } return undefined; } function getTouchActionProps() { if (!NATIVE_TOUCH_ACTION) { return false; } var touchMap = {}; var cssSupports = window.CSS && window.CSS.supports; ['auto', 'manipulation', 'pan-y', 'pan-x', 'pan-x pan-y', 'none'].forEach(function (val) { // If css.supports is not supported but there is native touch-action assume it supports // all values. This is the case for IE 10 and 11. return touchMap[val] = cssSupports ? window.CSS.supports('touch-action', val) : true; }); return touchMap; } var PREFIXED_TOUCH_ACTION = prefixed(TEST_ELEMENT.style, 'touchAction'); var NATIVE_TOUCH_ACTION = PREFIXED_TOUCH_ACTION !== undefined; // magical touchAction value var TOUCH_ACTION_COMPUTE = 'compute'; var TOUCH_ACTION_AUTO = 'auto'; var TOUCH_ACTION_MANIPULATION = 'manipulation'; // not implemented var TOUCH_ACTION_NONE = 'none'; var TOUCH_ACTION_PAN_X = 'pan-x'; var TOUCH_ACTION_PAN_Y = 'pan-y'; var TOUCH_ACTION_MAP = getTouchActionProps(); var MOBILE_REGEX = /mobile|tablet|ip(ad|hone|od)|android/i; var SUPPORT_TOUCH = 'ontouchstart' in window; var SUPPORT_POINTER_EVENTS = prefixed(window, 'PointerEvent') !== undefined; var SUPPORT_ONLY_TOUCH = SUPPORT_TOUCH && MOBILE_REGEX.test(navigator.userAgent); var INPUT_TYPE_TOUCH = 'touch'; var INPUT_TYPE_PEN = 'pen'; var INPUT_TYPE_MOUSE = 'mouse'; var INPUT_TYPE_KINECT = 'kinect'; var COMPUTE_INTERVAL = 25; var INPUT_START = 1; var INPUT_MOVE = 2; var INPUT_END = 4; var INPUT_CANCEL = 8; var DIRECTION_NONE = 1; var DIRECTION_LEFT = 2; var DIRECTION_RIGHT = 4; var DIRECTION_UP = 8; var DIRECTION_DOWN = 16; var DIRECTION_HORIZONTAL = DIRECTION_LEFT | DIRECTION_RIGHT; var DIRECTION_VERTICAL = DIRECTION_UP | DIRECTION_DOWN; var DIRECTION_ALL = DIRECTION_HORIZONTAL | DIRECTION_VERTICAL; var PROPS_XY = ['x', 'y']; var PROPS_CLIENT_XY = ['clientX', 'clientY']; var STATE_POSSIBLE = 1; var STATE_BEGAN = 2; var STATE_CHANGED = 4; var STATE_ENDED = 8; var STATE_RECOGNIZED = STATE_ENDED; var STATE_CANCELLED = 16; var STATE_FAILED = 32; /** * @private * extend object. * means that properties in dest will be overwritten by the ones in src. * @param {Object} target * @param {...Object} objects_to_assign * @returns {Object} target */ var assign = void 0; if (typeof Object.assign !== 'function') { assign = function assign(target) { if (target === undefined || target === null) { throw new TypeError('Cannot convert undefined or null to object'); } var output = Object(target); for (var index = 1; index < arguments.length; index++) { var source = arguments[index]; if (source !== undefined && source !== null) { for (var nextKey in source) { if (source.hasOwnProperty(nextKey)) { output[nextKey] = source[nextKey]; } } } } return output; }; } else { assign = Object.assign; } var assign$1 = assign; /** * @private * get a unique id * @returns {number} uniqueId */ var _uniqueId = 1; function uniqueId() { return _uniqueId++; } /** * @private * walk objects and arrays * @param {Object} obj * @param {Function} iterator * @param {Object} context */ function each(obj, iterator, context) { var i = void 0; if (!obj) { return; } if (obj.forEach) { obj.forEach(iterator, context); } else if (obj.length !== undefined) { i = 0; while (i < obj.length) { iterator.call(context, obj[i], i, obj); i++; } } else { for (i in obj) { obj.hasOwnProperty(i) && iterator.call(context, obj[i], i, obj); } } } /** * @private * if the argument is an array, we want to execute the fn on each entry * if it aint an array we don't want to do a thing. * this is used by all the methods that accept a single and array argument. * @param {*|Array} arg * @param {String} fn * @param {Object} [context] * @returns {Boolean} */ function invokeArrayArg(arg, fn, context) { if (Array.isArray(arg)) { each(arg, context[fn], context); return true; } return false; } /** * @private * find if a array contains the object using indexOf or a simple polyFill * @param {Array} src * @param {String} find * @param {String} [findByKey] * @return {number} -1 when not found, or the index */ function inArray(src, find, findByKey) { if (src.indexOf && !findByKey) { return src.indexOf(find); } else { var i = 0; while (i < src.length) { if (findByKey && src[i][findByKey] == find || !findByKey && src[i] === find) { // do not use === here, test fails return i; } i++; } return -1; } } var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; var asyncGenerator = function () { function AwaitValue(value) { this.value = value; } function AsyncGenerator(gen) { var front, back; function send(key, arg) { return new Promise(function (resolve, reject) { var request = { key: key, arg: arg, resolve: resolve, reject: reject, next: null }; if (back) { back = back.next = request; } else { front = back = request; resume(key, arg); } }); } function resume(key, arg) { try { var result = gen[key](arg); var value = result.value; if (value instanceof AwaitValue) { Promise.resolve(value.value).then(function (arg) { resume("next", arg); }, function (arg) { resume("throw", arg); }); } else { settle(result.done ? "return" : "normal", result.value); } } catch (err) { settle("throw", err); } } function settle(type, value) { switch (type) { case "return": front.resolve({ value: value, done: true }); break; case "throw": front.reject(value); break; default: front.resolve({ value: value, done: false }); break; } front = front.next; if (front) { resume(front.key, front.arg); } else { back = null; } } this._invoke = send; if (typeof gen.return !== "function") { this.return = undefined; } } if (typeof Symbol === "function" && Symbol.asyncIterator) { AsyncGenerator.prototype[Symbol.asyncIterator] = function () { return this; }; } AsyncGenerator.prototype.next = function (arg) { return this._invoke("next", arg); }; AsyncGenerator.prototype.throw = function (arg) { return this._invoke("throw", arg); }; AsyncGenerator.prototype.return = function (arg) { return this._invoke("return", arg); }; return { wrap: function (fn) { return function () { return new AsyncGenerator(fn.apply(this, arguments)); }; }, await: function (value) { return new AwaitValue(value); } }; }(); var classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }; var createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } }; var inherits = function (subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }; var possibleConstructorReturn = function (self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }; var slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }(); /** * @private * let a boolean value also be a function that must return a boolean * this first item in args will be used as the context * @param {Boolean|Function} val * @param {Array} [args] * @returns {Boolean} */ function boolOrFn(val, args) { if ((typeof val === 'undefined' ? 'undefined' : _typeof(val)) === TYPE_FUNCTION) { return val.apply(args ? args[0] || undefined : undefined, args); } return val; } /** * @private * get a recognizer by name if it is bound to a manager * @param {Recognizer|String} otherRecognizer * @param {Recognizer} recognizer * @returns {Recognizer} */ function getRecognizerByNameIfManager(otherRecognizer, recognizer) { var manager = recognizer.manager; if (manager) { return manager.get(otherRecognizer); } return otherRecognizer; } /** * @private * get a usable string, used as event postfix * @param {constant} state * @returns {String} state */ function stateStr(state) { if (state & STATE_CANCELLED) { return 'cancel'; } else if (state & STATE_ENDED) { return 'end'; } else if (state & STATE_CHANGED) { return 'move'; } else if (state & STATE_BEGAN) { return 'start'; } return ''; } /** * @private * Recognizer flow explained; * * All recognizers have the initial state of POSSIBLE when a input session starts. * The definition of a input session is from the first input until the last input, with all it's movement in it. * * Example session for mouse-input: mousedown -> mousemove -> mouseup * * On each recognizing cycle (see Manager.recognize) the .recognize() method is executed * which determines with state it should be. * * If the recognizer has the state FAILED, CANCELLED or RECOGNIZED (equals ENDED), it is reset to * POSSIBLE to give it another change on the next cycle. * * Possible * | * +-----+---------------+ * | | * +-----+-----+ | * | | | * Failed Cancelled | * +-------+------+ * | | * Recognized Began * | * Changed * | * Ended/Recognized */ /** * @private * Recognizer * Every recognizer needs to extend from this class. * @constructor * @param {Object} options */ var Recognizer = function () { function Recognizer(options) { classCallCheck(this, Recognizer); this.options = assign$1({}, this.defaults, options || {}); this.id = uniqueId(); this.manager = null; // default is enable true this.options.enable = ifUndefined(this.options.enable, true); this.state = STATE_POSSIBLE; this.simultaneous = {}; this.requireFail = []; } /** * @private * set options * @param {Object} options * @return {Recognizer} */ createClass(Recognizer, [{ key: 'set', value: function set(options) { assign$1(this.options, options); // also update the touchAction, in case something changed about the directions/enabled state this.manager && this.manager.touchAction.update(); return this; } /** * @private * recognize simultaneous with an other recognizer. * @param {Recognizer} otherRecognizer * @returns {Recognizer} this */ }, { key: 'recognizeWith', value: function recognizeWith(otherRecognizer) { if (invokeArrayArg(otherRecognizer, 'recognizeWith', this)) { return this; } var simultaneous = this.simultaneous; otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); if (!simultaneous[otherRecognizer.id]) { simultaneous[otherRecognizer.id] = otherRecognizer; otherRecognizer.recognizeWith(this); } return this; } /** * @private * drop the simultaneous link. it doesnt remove the link on the other recognizer. * @param {Recognizer} otherRecognizer * @returns {Recognizer} this */ }, { key: 'dropRecognizeWith', value: function dropRecognizeWith(otherRecognizer) { if (invokeArrayArg(otherRecognizer, 'dropRecognizeWith', this)) { return this; } otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); delete this.simultaneous[otherRecognizer.id]; return this; } /** * @private * recognizer can only run when an other is failing * @param {Recognizer} otherRecognizer * @returns {Recognizer} this */ }, { key: 'requireFailure', value: function requireFailure(otherRecognizer) { if (invokeArrayArg(otherRecognizer, 'requireFailure', this)) { return this; } var requireFail = this.requireFail; otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); if (inArray(requireFail, otherRecognizer) === -1) { requireFail.push(otherRecognizer); otherRecognizer.requireFailure(this); } return this; } /** * @private * drop the requireFailure link. it does not remove the link on the other recognizer. * @param {Recognizer} otherRecognizer * @returns {Recognizer} this */ }, { key: 'dropRequireFailure', value: function dropRequireFailure(otherRecognizer) { if (invokeArrayArg(otherRecognizer, 'dropRequireFailure', this)) { return this; } otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); var index = inArray(this.requireFail, otherRecognizer); if (index > -1) { this.requireFail.splice(index, 1); } return this; } /** * @private * has require failures boolean * @returns {boolean} */ }, { key: 'hasRequireFailures', value: function hasRequireFailures() { return this.requireFail.length > 0; } /** * @private * if the recognizer can recognize simultaneous with an other recognizer * @param {Recognizer} otherRecognizer * @returns {Boolean} */ }, { key: 'canRecognizeWith', value: function canRecognizeWith(otherRecognizer) { return !!this.simultaneous[otherRecognizer.id]; } /** * @private * You should use `tryEmit` instead of `emit` directly to check * that all the needed recognizers has failed before emitting. * @param {Object} input */ }, { key: 'emit', value: function emit(input) { var self = this; var state = this.state; function emit(event) { self.manager.emit(event, input); } // 'panstart' and 'panmove' if (state < STATE_ENDED) { emit(self.options.event + stateStr(state)); } emit(self.options.event); // simple 'eventName' events if (input.additionalEvent) { // additional event(panleft, panright, pinchin, pinchout...) emit(input.additionalEvent); } // panend and pancancel if (state >= STATE_ENDED) { emit(self.options.event + stateStr(state)); } } /** * @private * Check that all the require failure recognizers has failed, * if true, it emits a gesture event, * otherwise, setup the state to FAILED. * @param {Object} input */ }, { key: 'tryEmit', value: function tryEmit(input) { if (this.canEmit()) { return this.emit(input); } // it's failing anyway this.state = STATE_FAILED; } /** * @private * can we emit? * @returns {boolean} */ }, { key: 'canEmit', value: function canEmit() { var i = 0; while (i < this.requireFail.length) { if (!(this.requireFail[i].state & (STATE_FAILED | STATE_POSSIBLE))) { return false; } i++; } return true; } /** * @private * update the recognizer * @param {Object} inputData */ }, { key: 'recognize', value: function recognize(inputData) { // make a new copy of the inputData // so we can change the inputData without messing up the other recognizers var inputDataClone = assign$1({}, inputData); // is is enabled and allow recognizing? if (!boolOrFn(this.options.enable, [this, inputDataClone])) { this.reset(); this.state = STATE_FAILED; return; } // reset when we've reached the end if (this.state & (STATE_RECOGNIZED | STATE_CANCELLED | STATE_FAILED)) { this.state = STATE_POSSIBLE; } this.state = this.process(inputDataClone); // the recognizer has recognized a gesture // so trigger an event if (this.state & (STATE_BEGAN | STATE_CHANGED | STATE_ENDED | STATE_CANCELLED)) { this.tryEmit(inputDataClone); } } /** * @private * return the state of the recognizer * the actual recognizing happens in this method * @virtual * @param {Object} inputData * @returns {constant} STATE */ /* jshint ignore:start */ }, { key: 'process', value: function process(inputData) {} /* jshint ignore:end */ /** * @private * return the preferred touch-action * @virtual * @returns {Array} */ }, { key: 'getTouchAction', value: function getTouchAction() {} /** * @private * called when the gesture isn't allowed to recognize * like when another is being recognized or it is disabled * @virtual */ }, { key: 'reset', value: function reset() {} }]); return Recognizer; }(); Recognizer.prototype.defaults = {}; /** * @private * This recognizer is just used as a base for the simple attribute recognizers. * @constructor * @extends Recognizer */ var AttrRecognizer = function (_Recognizer) { inherits(AttrRecognizer, _Recognizer); function AttrRecognizer() { classCallCheck(this, AttrRecognizer); return possibleConstructorReturn(this, (AttrRecognizer.__proto__ || Object.getPrototypeOf(AttrRecognizer)).apply(this, arguments)); } /** * @private * Used to check if it the recognizer receives valid input, like input.distance > 10. * @memberof AttrRecognizer * @param {Object} input * @returns {Boolean} recognized */ createClass(AttrRecognizer, [{ key: 'attrTest', value: function attrTest(input) { var optionPointers = this.options.pointers; return optionPointers === 0 || input.pointers.length === optionPointers; } /** * @private * Process the input and return the state for the recognizer * @memberof AttrRecognizer * @param {Object} input * @returns {*} State */ }, { key: 'process', value: function process(input) { var state = this.state; var eventType = input.eventType; var isRecognized = state & (STATE_BEGAN | STATE_CHANGED); var isValid = this.attrTest(input); // on cancel input and we've recognized before, return STATE_CANCELLED if (isRecognized && (eventType & INPUT_CANCEL || !isValid)) { return state | STATE_CANCELLED; } else if (isRecognized || isValid) { if (eventType & INPUT_END) { return state | STATE_ENDED; } else if (!(state & STATE_BEGAN)) { return STATE_BEGAN; } return state | STATE_CHANGED; } return STATE_FAILED; } }]); return AttrRecognizer; }(Recognizer); AttrRecognizer.prototype.defaults = { /** * @private * @type {Number} * @default 1 */ pointers: 1 }; /** * @private * Rotate * Recognized when two or more pointer are moving in a circular motion. * @constructor * @extends AttrRecognizer */ var RotateRecognizer = function (_AttrRecognizer) { inherits(RotateRecognizer, _AttrRecognizer); function RotateRecognizer() { classCallCheck(this, RotateRecognizer); return possibleConstructorReturn(this, (RotateRecognizer.__proto__ || Object.getPrototypeOf(RotateRecognizer)).apply(this, arguments)); } createClass(RotateRecognizer, [{ key: 'getTouchAction', value: function getTouchAction() { return [TOUCH_ACTION_NONE]; } }, { key: 'attrTest', value: function attrTest(input) { return get(RotateRecognizer.prototype.__proto__ || Object.getPrototypeOf(RotateRecognizer.prototype), 'attrTest', this).call(this, input) && (Math.abs(input.rotation) > this.options.threshold || this.state & STATE_BEGAN); } }]); return RotateRecognizer; }(AttrRecognizer); RotateRecognizer.prototype.defaults = { event: 'rotate', threshold: 0, pointers: 2 }; /** * @private * Pinch * Recognized when two or more pointers are moving toward (zoom-in) or away from each other (zoom-out). * @constructor * @extends AttrRecognizer */ var PinchRecognizer = function (_AttrRecognizer) { inherits(PinchRecognizer, _AttrRecognizer); function PinchRecognizer() { classCallCheck(this, PinchRecognizer); return possibleConstructorReturn(this, (PinchRecognizer.__proto__ || Object.getPrototypeOf(PinchRecognizer)).apply(this, arguments)); } createClass(PinchRecognizer, [{ key: 'getTouchAction', value: function getTouchAction() { return [TOUCH_ACTION_NONE]; } }, { key: 'attrTest', value: function attrTest(input) { return get(PinchRecognizer.prototype.__proto__ || Object.getPrototypeOf(PinchRecognizer.prototype), 'attrTest', this).call(this, input) && (Math.abs(input.scale - 1) > this.options.threshold || this.state & STATE_BEGAN); } }, { key: 'emit', value: function emit(input) { if (input.scale !== 1) { var inOut = input.scale < 1 ? 'in' : 'out'; input.additionalEvent = this.options.event + inOut; } get(PinchRecognizer.prototype.__proto__ || Object.getPrototypeOf(PinchRecognizer.prototype), 'emit', this).call(this, input); } }]); return PinchRecognizer; }(AttrRecognizer); PinchRecognizer.prototype.defaults = { event: 'pinch', threshold: 0, pointers: 2 }; /** * @private * direction cons to string * @param {constant} direction * @returns {String} */ function directionStr(direction) { if (direction === DIRECTION_DOWN) { return 'down'; } else if (direction === DIRECTION_UP) { return 'up'; } else if (direction === DIRECTION_LEFT) { return 'left'; } else if (direction === DIRECTION_RIGHT) { return 'right'; } return ''; } /** * @private * Pan * Recognized when the pointer is down and moved in the allowed direction. * @constructor * @extends AttrRecognizer */ var PanRecognizer = function (_AttrRecognizer) { inherits(PanRecognizer, _AttrRecognizer); function PanRecognizer() { classCallCheck(this, PanRecognizer); var _this = possibleConstructorReturn(this, (PanRecognizer.__proto__ || Object.getPrototypeOf(PanRecognizer)).apply(this, arguments)); _this.pX = null; _this.pY = null; return _this; } createClass(PanRecognizer, [{ key: 'getTouchAction', value: function getTouchAction() { var direction = this.options.direction; var actions = []; if (direction & DIRECTION_HORIZONTAL) { actions.push(TOUCH_ACTION_PAN_Y); } if (direction & DIRECTION_VERTICAL) { actions.push(TOUCH_ACTION_PAN_X); } return actions; } }, { key: 'directionTest', value: function directionTest(input) { var options = this.options; var hasMoved = true; var distance = input.distance; var direction = input.direction; var x = input.deltaX; var y = input.deltaY; // lock to axis? if (!(direction & options.direction)) { if (options.direction & DIRECTION_HORIZONTAL) { direction = x === 0 ? DIRECTION_NONE : x < 0 ? DIRECTION_LEFT : DIRECTION_RIGHT; hasMoved = x !== this.pX; distance = Math.abs(input.deltaX); } else { direction = y === 0 ? DIRECTION_NONE : y < 0 ? DIRECTION_UP : DIRECTION_DOWN; hasMoved = y !== this.pY; distance = Math.abs(input.deltaY); } } input.direction = direction; return hasMoved && distance > options.threshold && direction & options.direction; } }, { key: 'attrTest', value: function attrTest(input) { return AttrRecognizer.prototype.attrTest.call(this, input) && ( // replace with a super call this.state & STATE_BEGAN || !(this.state & STATE_BEGAN) && this.directionTest(input)); } }, { key: 'emit', value: function emit(input) { this.pX = input.deltaX; this.pY = input.deltaY; var direction = directionStr(input.direction); if (direction) { input.additionalEvent = this.options.event + direction; } get(PanRecognizer.prototype.__proto__ || Object.getPrototypeOf(PanRecognizer.prototype), 'emit', this).call(this, input); } }]); return PanRecognizer; }(AttrRecognizer); PanRecognizer.prototype.defaults = { event: 'pan', threshold: 10, pointers: 1, direction: DIRECTION_ALL }; /** * @private * Swipe * Recognized when the pointer is moving fast (velocity), with enough distance in the allowed direction. * @constructor * @extends AttrRecognizer */ var SwipeRecognizer = function (_AttrRecognizer) { inherits(SwipeRecognizer, _AttrRecognizer); function SwipeRecognizer() { classCallCheck(this, SwipeRecognizer); return possibleConstructorReturn(this, (SwipeRecognizer.__proto__ || Object.getPrototypeOf(SwipeRecognizer)).apply(this, arguments)); } createClass(SwipeRecognizer, [{ key: 'getTouchAction', value: function getTouchAction() { return PanRecognizer.prototype.getTouchAction.call(this); } }, { key: 'attrTest', value: function attrTest(input) { var direction = this.options.direction; var velocity = void 0; if (direction & (DIRECTION_HORIZONTAL | DIRECTION_VERTICAL)) { velocity = input.overallVelocity; } else if (direction & DIRECTION_HORIZONTAL) { velocity = input.overallVelocityX; } else if (direction & DIRECTION_VERTICAL) { velocity = input.overallVelocityY; } return get(SwipeRecognizer.prototype.__proto__ || Object.getPrototypeOf(SwipeRecognizer.prototype), 'attrTest', this).call(this, input) && direction & input.offsetDirection && input.distance > this.options.threshold && input.maxPointers === this.options.pointers && abs(velocity) > this.options.velocity && input.eventType & INPUT_END; } }, { key: 'emit', value: function emit(input) { var direction = directionStr(input.offsetDirection); if (direction) { this.manager.emit(this.options.event + direction, input); } this.manager.emit(this.options.event, input); } }]); return SwipeRecognizer; }(AttrRecognizer); SwipeRecognizer.prototype.defaults = { event: 'swipe', threshold: 10, velocity: 0.3, direction: DIRECTION_HORIZONTAL | DIRECTION_VERTICAL, pointers: 1 }; /** * @private * simple function bind * @param {Function} fn * @param {Object} context * @returns {Function} */ function bindFn(fn, context) { return function boundFn() { return fn.apply(context, arguments); }; } /** * @private * set a timeout with a given scope * @param {Function} fn * @param {Number} timeout * @param {Object} context * @returns {number} */ function setTimeoutContext(fn, timeout, context) { return setTimeout(bindFn(fn, context), timeout); } /** * @private * calculate the absolute distance between two points * @param {Object} p1 {x, y} * @param {Object} p2 {x, y} * @param {Array} [props] containing x and y keys * @return {Number} distance */ function getDistance(p1, p2, props) { if (!props) { props = PROPS_XY; } var x = p2[props[0]] - p1[props[0]]; var y = p2[props[1]] - p1[props[1]]; return Math.sqrt(x * x + y * y); } /** * @private * A tap is recognized when the pointer is doing a small tap/click. Multiple taps are recognized if they occur * between the given interval and position. The delay option can be used to recognize multi-taps without firing * a single tap. * * The eventData from the emitted event contains the property `tapCount`, which contains the amount of * multi-taps being recognized. * @constructor * @extends Recognizer */ var TapRecognizer = function (_Recognizer) { inherits(TapRecognizer, _Recognizer); function TapRecognizer() { classCallCheck(this, TapRecognizer); // previous time and center, // used for tap counting var _this = possibleConstructorReturn(this, (TapRecognizer.__proto__ || Object.getPrototypeOf(TapRecognizer)).apply(this, arguments)); _this.pTime = false; _this.pCenter = false; _this._timer = null; _this._input = null; _this.count = 0; return _this; } createClass(TapRecognizer, [{ key: 'getTouchAction', value: function getTouchAction() { return [TOUCH_ACTION_MANIPULATION]; } }, { key: 'process', value: function process(input) { var _this2 = this; var options = this.options; var validPointers = input.pointers.length === options.pointers; var validMovement = input.distance < options.threshold; var validTouchTime = input.deltaTime < options.time; this.reset(); if (input.eventType & INPUT_START && this.count === 0) { return this.failTimeout(); } // we only allow little movement // and we've reached an end event, so a tap is possible if (validMovement && validTouchTime && validPointers) { if (input.eventType !== INPUT_END) { return this.failTimeout(); } var validInterval = this.pTime ? input.timeStamp - this.pTime < options.interval : true; var validMultiTap = !this.pCenter || getDistance(this.pCenter, input.center) < options.posThreshold; this.pTime = input.timeStamp; this.pCenter = input.center; if (!validMultiTap || !validInterval) { this.count = 1; } else { this.count += 1; } this._input = input; // if tap count matches we have recognized it, // else it has began recognizing... var tapCount = this.count % options.taps; if (tapCount === 0) { // no failing requirements, immediately trigger the tap event // or wait as long as the multitap interval to trigger if (!this.hasRequireFailures()) { return STATE_RECOGNIZED; } else { this._timer = setTimeoutContext(function () { _this2.state = STATE_RECOGNIZED; _this2.tryEmit(); }, options.interval, this); return STATE_BEGAN; } } } return STATE_FAILED; } }, { key: 'failTimeout', value: function failTimeout() { var _this3 = this; this._timer = setTimeoutContext(function () { _this3.state = STATE_FAILED; }, this.options.interval, this); return STATE_FAILED; } }, { key: 'reset', value: function reset() { clearTimeout(this._timer); } }, { key: 'emit', value: function emit() { if (this.state === STATE_RECOGNIZED) { this._input.tapCount = this.count; this.manager.emit(this.options.event, this._input); } } }]); return TapRecognizer; }(Recognizer); TapRecognizer.prototype.defaults = { event: 'tap', pointers: 1, taps: 1, interval: 300, // max time between the multi-tap taps time: 250, // max time of the pointer to be down (like finger on the screen) threshold: 9, // a minimal movement is ok, but keep it low posThreshold: 10 // a multi-tap can be a bit off the initial position }; /** * @private * Press * Recognized when the pointer is down for x ms without any movement. * @constructor * @extends Recognizer */ var PressRecognizer = function (_Recognizer) { inherits(PressRecognizer, _Recognizer); function PressRecognizer() { classCallCheck(this, PressRecognizer); var _this = possibleConstructorReturn(this, (PressRecognizer.__proto__ || Object.getPrototypeOf(PressRecognizer)).apply(this, arguments)); _this._timer = null; _this._input = null; return _this; } createClass(PressRecognizer, [{ key: 'getTouchAction', value: function getTouchAction() { return [TOUCH_ACTION_AUTO]; } }, { key: 'process', value: function process(input) { var _this2 = this; var options = this.options; var validPointers = input.pointers.length === options.pointers; var validMovement = input.distance < options.threshold; var validTime = input.deltaTime > options.time; this._input = input; // we only allow little movement // and we've reached an end event, so a tap is possible if (!validMovement || !validPointers || input.eventType & (INPUT_END | INPUT_CANCEL) && !validTime) { this.reset(); } else if (input.eventType & INPUT_START) { this.reset(); this._timer = setTimeoutContext(function () { _this2.state = STATE_RECOGNIZED; _this2.tryEmit(); }, options.time, this); } else if (input.eventType & INPUT_END) { return STATE_RECOGNIZED; } return STATE_FAILED; } }, { key: 'reset', value: function reset() { clearTimeout(this._timer); } }, { key: 'emit', value: function emit(input) { if (this.state !== STATE_RECOGNIZED) { return; } if (input && input.eventType & INPUT_END) { this.manager.emit(this.options.event + 'up', input); } else { this._input.timeStamp = now(); this.manager.emit(this.options.event, this._input); } } }]); return PressRecognizer; }(Recognizer); PressRecognizer.prototype.defaults = { event: 'press', pointers: 1, time: 251, // minimal time of the pointer to be pressed threshold: 9 // a minimal movement is ok, but keep it low }; /** * @private * small indexOf wrapper * @param {String} str * @param {String} find * @returns {Boolean} found */ function inStr(str, find) { return str.indexOf(find) > -1; } /** * @private * when the touchActions are collected they are not a valid value, so we need to clean things up. * * @param {String} actions * @returns {*} */ function cleanTouchActions(actions) { // none if (inStr(actions, TOUCH_ACTION_NONE)) { return TOUCH_ACTION_NONE; } var hasPanX = inStr(actions, TOUCH_ACTION_PAN_X); var hasPanY = inStr(actions, TOUCH_ACTION_PAN_Y); // if both pan-x and pan-y are set (different recognizers // for different directions, e.g. horizontal pan but vertical swipe?) // we need none (as otherwise with pan-x pan-y combined none of these // recognizers will work, since the browser would handle all panning if (hasPanX && hasPanY) { return TOUCH_ACTION_NONE; } // pan-x OR pan-y if (hasPanX || hasPanY) { return hasPanX ? TOUCH_ACTION_PAN_X : TOUCH_ACTION_PAN_Y; } // manipulation if (inStr(actions, TOUCH_ACTION_MANIPULATION)) { return TOUCH_ACTION_MANIPULATION; } return TOUCH_ACTION_AUTO; } /** * @private * Touch Action * sets the touchAction property or uses the js alternative * @param {Manager} manager * @param {String} value * @constructor */ var TouchAction = function () { function TouchAction(manager, value) { classCallCheck(this, TouchAction); this.manager = manager; this.set(value); } /** * @private * set the touchAction value on the element or enable the polyfill * @param {String} value */ createClass(TouchAction, [{ key: 'set', value: function set(value) { // find out the touch-action by the event handlers if (value === TOUCH_ACTION_COMPUTE) { value = this.compute(); } if (NATIVE_TOUCH_ACTION && this.manager.element.style && TOUCH_ACTION_MAP[value]) { this.manager.element.style[PREFIXED_TOUCH_ACTION] = value; } this.actions = value.toLowerCase().trim(); } /** * @private * just re-set the touchAction value */ }, { key: 'update', value: function update() { this.set(this.manager.options.touchAction); } /** * @private * compute the value for the touchAction property based on the recognizer's settings * @returns {String} value */ }, { key: 'compute', value: function compute() { var actions = []; each(this.manager.recognizers, function (recognizer) { if (boolOrFn(recognizer.options.enable, [recognizer])) { actions = actions.concat(recognizer.getTouchAction()); } }); return cleanTouchActions(actions.join(' ')); } /** * @private * this method is called on each input cycle and provides the preventing of the browser behavior * @param {Object} input */ }, { key: 'preventDefaults', value: function preventDefaults(input) { var srcEvent = input.srcEvent; var direction = input.offsetDirection; // if the touch action did prevented once this session if (this.manager.session.prevented) { srcEvent.preventDefault(); return; } var actions = this.actions; var hasNone = inStr(actions, TOUCH_ACTION_NONE) && !TOUCH_ACTION_MAP[TOUCH_ACTION_NONE]; var hasPanY = inStr(actions, TOUCH_ACTION_PAN_Y) && !TOUCH_ACTION_MAP[TOUCH_ACTION_PAN_Y]; var hasPanX = inStr(actions, TOUCH_ACTION_PAN_X) && !TOUCH_ACTION_MAP[TOUCH_ACTION_PAN_X]; if (hasNone) { // do not prevent defaults if this is a tap gesture var isTapPointer = input.pointers.length === 1; var isTapMovement = input.distance < 2; var isTapTouchTime = input.deltaTime < 250; if (isTapPointer && isTapMovement && isTapTouchTime) { return; } } if (hasPanX && hasPanY) { // `pan-x pan-y` means browser handles all scrolling/panning, do not prevent return; } if (hasNone || hasPanY && direction & DIRECTION_HORIZONTAL || hasPanX && direction & DIRECTION_VERTICAL) { return this.preventSrc(srcEvent); } } /** * @private * call preventDefault to prevent the browser's default behavior (scrolling in most cases) * @param {Object} srcEvent */ }, { key: 'preventSrc', value: function preventSrc(srcEvent) { this.manager.session.prevented = true; srcEvent.preventDefault(); } }]); return TouchAction; }(); /** * @private * find if a node is in the given parent * @method hasParent * @param {HTMLElement} node * @param {HTMLElement} parent * @return {Boolean} found */ function hasParent(node, parent) { while (node) { if (node === parent) { return true; } node = node.parentNode; } return false; } /** * @private * get the center of all the pointers * @param {Array} pointers * @return {Object} center contains `x` and `y` properties */ function getCenter(pointers) { var pointersLength = pointers.length; // no need to loop when only one touch if (pointersLength === 1) { return { x: round(pointers[0].clientX), y: round(pointers[0].clientY) }; } var x = 0; var y = 0; var i = 0; while (i < pointersLength) { x += pointers[i].clientX; y += pointers[i].clientY; i++; } return { x: round(x / pointersLength), y: round(y / pointersLength) }; } /** * @private * create a simple clone from the input used for storage of firstInput and firstMultiple * @param {Object} input * @returns {Object} clonedInputData */ function simpleCloneInputData(input) { // make a simple copy of the pointers because we will get a reference if we don't // we only need clientXY for the calculations var pointers = []; var i = 0; while (i < input.pointers.length) { pointers[i] = { clientX: round(input.pointers[i].clientX), clientY: round(input.pointers[i].clientY) }; i++; } return { timeStamp: now(), pointers: pointers, center: getCenter(pointers), deltaX: input.deltaX, deltaY: input.deltaY }; } /** * @private * calculate the angle between two coordinates * @param {Object} p1 * @param {Object} p2 * @param {Array} [props] containing x and y keys * @return {Number} angle */ function getAngle(p1, p2, props) { if (!props) { props = PROPS_XY; } var x = p2[props[0]] - p1[props[0]]; var y = p2[props[1]] - p1[props[1]]; return Math.atan2(y, x) * 180 / Math.PI; } /** * @private * get the direction between two points * @param {Number} x * @param {Number} y * @return {Number} direction */ function getDirection(x, y) { if (x === y) { return DIRECTION_NONE; } if (abs(x) >= abs(y)) { return x < 0 ? DIRECTION_LEFT : DIRECTION_RIGHT; } return y < 0 ? DIRECTION_UP : DIRECTION_DOWN; } function computeDeltaXY(session, input) { var center = input.center; // let { offsetDelta:offset = {}, prevDelta = {}, prevInput = {} } = session; // jscs throwing error on defalut destructured values and without defaults tests fail var offset = session.offsetDelta || {}; var prevDelta = session.prevDelta || {}; var prevInput = session.prevInput || {}; if (input.eventType === INPUT_START || prevInput.eventType === INPUT_END) { prevDelta = session.prevDelta = { x: prevInput.deltaX || 0, y: prevInput.deltaY || 0 }; offset = session.offsetDelta = { x: center.x, y: center.y }; } input.deltaX = prevDelta.x + (center.x - offset.x); input.deltaY = prevDelta.y + (center.y - offset.y); } /** * @private * calculate the velocity between two points. unit is in px per ms. * @param {Number} deltaTime * @param {Number} x * @param {Number} y * @return {Object} velocity `x` and `y` */ function getVelocity(deltaTime, x, y) { return { x: x / deltaTime || 0, y: y / deltaTime || 0 }; } /** * @private * calculate the scale factor between two pointersets * no scale is 1, and goes down to 0 when pinched together, and bigger when pinched out * @param {Array} start array of pointers * @param {Array} end array of pointers * @return {Number} scale */ function getScale(start, end) { return getDistance(end[0], end[1], PROPS_CLIENT_XY) / getDistance(start[0], start[1], PROPS_CLIENT_XY); } /** * @private * calculate the rotation degrees between two pointersets * @param {Array} start array of pointers * @param {Array} end array of pointers * @return {Number} rotation */ function getRotation(start, end) { return getAngle(end[1], end[0], PROPS_CLIENT_XY) + getAngle(start[1], start[0], PROPS_CLIENT_XY); } /** * @private * velocity is calculated every x ms * @param {Object} session * @param {Object} input */ function computeIntervalInputData(session, input) { var last = session.lastInterval || input; var deltaTime = input.timeStamp - last.timeStamp; var velocity = void 0; var velocityX = void 0; var velocityY = void 0; var direction = void 0; if (input.eventType !== INPUT_CANCEL && (deltaTime > COMPUTE_INTERVAL || last.velocity === undefined)) { var deltaX = input.deltaX - last.deltaX; var deltaY = input.deltaY - last.deltaY; var v = getVelocity(deltaTime, deltaX, deltaY); velocityX = v.x; velocityY = v.y; velocity = abs(v.x) > abs(v.y) ? v.x : v.y; direction = getDirection(deltaX, deltaY); session.lastInterval = input; } else { // use latest velocity info if it doesn't overtake a minimum period velocity = last.velocity; velocityX = last.velocityX; velocityY = last.velocityY; direction = last.direction; } input.velocity = velocity; input.velocityX = velocityX; input.velocityY = velocityY; input.direction = direction; } /** * @private * extend the data with some usable properties like scale, rotate, velocity etc * @param {Object} manager * @param {Object} input */ function computeInputData(manager, input) { var session = manager.session; var pointers = input.pointers; var pointersLength = pointers.length; // store the first input to calculate the distance and direction if (!session.firstInput) { session.firstInput = simpleCloneInputData(input); } // to compute scale and rotation we need to store the multiple touches if (pointersLength > 1 && !session.firstMultiple) { session.firstMultiple = simpleCloneInputData(input); } else if (pointersLength === 1) { session.firstMultiple = false; } var firstInput = session.firstInput; var firstMultiple = session.firstMultiple; var offsetCenter = firstMultiple ? firstMultiple.center : firstInput.center; var center = input.center = getCenter(pointers); input.timeStamp = now(); input.deltaTime = input.timeStamp - firstInput.timeStamp; input.angle = getAngle(offsetCenter, center); input.distance = getDistance(offsetCenter, center); computeDeltaXY(session, input); input.offsetDirection = getDirection(input.deltaX, input.deltaY); var overallVelocity = getVelocity(input.deltaTime, input.deltaX, input.deltaY); input.overallVelocityX = overallVelocity.x; input.overallVelocityY = overallVelocity.y; input.overallVelocity = abs(overallVelocity.x) > abs(overallVelocity.y) ? overallVelocity.x : overallVelocity.y; input.scale = firstMultiple ? getScale(firstMultiple.pointers, pointers) : 1; input.rotation = firstMultiple ? getRotation(firstMultiple.pointers, pointers) : 0; input.maxPointers = !session.prevInput ? input.pointers.length : input.pointers.length > session.prevInput.maxPointers ? input.pointers.length : session.prevInput.maxPointers; computeIntervalInputData(session, input); // find the correct target var target = manager.element; if (hasParent(input.srcEvent.target, target)) { target = input.srcEvent.target; } input.target = target; } /** * @private * handle input events * @param {Manager} manager * @param {String} eventType * @param {Object} input */ function inputHandler(manager, eventType, input) { var pointersLen = input.pointers.length; var changedPointersLen = input.changedPointers.length; var isFirst = eventType & INPUT_START && pointersLen - changedPointersLen === 0; var isFinal = eventType & (INPUT_END | INPUT_CANCEL) && pointersLen - changedPointersLen === 0; input.isFirst = !!isFirst; input.isFinal = !!isFinal; if (isFirst) { manager.session = {}; } // source event is the normalized value of the domEvents // like 'touchstart, mouseup, pointerdown' input.eventType = eventType; // compute scale, rotation etc computeInputData(manager, input); // emit secret event manager.emit('hammer.input', input); manager.recognize(input); manager.session.prevInput = input; } /** * @private * split string on whitespace * @param {String} str * @returns {Array} words */ function splitStr(str) { return str.trim().split(/\s+/g); } /** * @private * addEventListener with multiple events at once * @param {EventTarget} target * @param {String} types * @param {Function} handler */ function addEventListeners(target, types, handler) { each(splitStr(types), function (type) { target.addEventListener(type, handler, false); }); } /** * @private * removeEventListener with multiple events at once * @param {EventTarget} target * @param {String} types * @param {Function} handler */ function removeEventListeners(target, types, handler) { each(splitStr(types), function (type) { target.removeEventListener(type, handler, false); }); } /** * @private * get the window object of an element * @param {HTMLElement} element * @returns {DocumentView|Window} */ function getWindowForElement(element) { var doc = element.ownerDocument || element; return doc.defaultView || doc.parentWindow || window; } /** * @private * create new input type manager * @param {Manager} manager * @param {Function} callback * @returns {Input} * @constructor */ var Input = function () { function Input(manager, callback) { classCallCheck(this, Input); var self = this; this.manager = manager; this.callback = callback; this.element = manager.element; this.target = manager.options.inputTarget; // smaller wrapper around the handler, for the scope and the enabled state of the manager, // so when disabled the input events are completely bypassed. this.domHandler = function (ev) { if (boolOrFn(manager.options.enable, [manager])) { self.handler(ev); } }; this.init(); } /** * @private * should handle the inputEvent data and trigger the callback * @virtual */ createClass(Input, [{ key: 'handler', value: function handler() {} /** * @private * bind the events */ }, { key: 'init', value: function init() { this.evEl && addEventListeners(this.element, this.evEl, this.domHandler); this.evTarget && addEventListeners(this.target, this.evTarget, this.domHandler); this.evWin && addEventListeners(getWindowForElement(this.element), this.evWin, this.domHandler); } /** * @private * unbind the events */ }, { key: 'destroy', value: function destroy() { this.evEl && removeEventListeners(this.element, this.evEl, this.domHandler); this.evTarget && removeEventListeners(this.target, this.evTarget, this.domHandler); this.evWin && removeEventListeners(getWindowForElement(this.element), this.evWin, this.domHandler); } }]); return Input; }(); var POINTER_INPUT_MAP = { pointerdown: INPUT_START, pointermove: INPUT_MOVE, pointerup: INPUT_END, pointercancel: INPUT_CANCEL, pointerout: INPUT_CANCEL }; // in IE10 the pointer types is defined as an enum var IE10_POINTER_TYPE_ENUM = { 2: INPUT_TYPE_TOUCH, 3: INPUT_TYPE_PEN, 4: INPUT_TYPE_MOUSE, 5: INPUT_TYPE_KINECT // see https://twitter.com/jacobrossi/status/480596438489890816 }; var POINTER_ELEMENT_EVENTS = 'pointerdown'; var POINTER_WINDOW_EVENTS = 'pointermove pointerup pointercancel'; // IE10 has prefixed support, and case-sensitive if (window.MSPointerEvent && !window.PointerEvent) { POINTER_ELEMENT_EVENTS = 'MSPointerDown'; POINTER_WINDOW_EVENTS = 'MSPointerMove MSPointerUp MSPointerCancel'; } /** * @private * Pointer events input * @constructor * @extends Input */ var PointerEventInput = function (_Input) { inherits(PointerEventInput, _Input); function PointerEventInput() { classCallCheck(this, PointerEventInput); var _this = possibleConstructorReturn(this, (PointerEventInput.__proto__ || Object.getPrototypeOf(PointerEventInput)).apply(this, arguments)); _this.evEl = POINTER_ELEMENT_EVENTS; _this.evWin = POINTER_WINDOW_EVENTS; _this.store = _this.manager.session.pointerEvents = []; return _this; } /** * @private * handle mouse events * @param {Object} ev */ createClass(PointerEventInput, [{ key: 'handler', value: function handler(ev) { var store = this.store; var removePointer = false; var eventTypeNormalized = ev.type.toLowerCase().replace('ms', ''); var eventType = POINTER_INPUT_MAP[eventTypeNormalized]; var pointerType = IE10_POINTER_TYPE_ENUM[ev.pointerType] || ev.pointerType; var isTouch = pointerType === INPUT_TYPE_TOUCH; // get index of the event in the store var storeIndex = inArray(store, ev.pointerId, 'pointerId'); // start and mouse must be down if (eventType & INPUT_START && (ev.button === 0 || isTouch)) { if (storeIndex < 0) { store.push(ev); storeIndex = store.length - 1; } } else if (eventType & (INPUT_END | INPUT_CANCEL)) { removePointer = true; } // it not found, so the pointer hasn't been down (so it's probably a hover) if (storeIndex < 0) { return; } // update the event in the store store[storeIndex] = ev; this.callback(this.manager, eventType, { pointers: store, changedPointers: [ev], pointerType: pointerType, srcEvent: ev }); if (removePointer) { // remove from the store store.splice(storeIndex, 1); } } }]); return PointerEventInput; }(Input); /** * @private * convert array-like objects to real arrays * @param {Object} obj * @returns {Array} */ function toArray$1(obj) { return Array.prototype.slice.call(obj, 0); } /** * @private * unique array with objects based on a key (like 'id') or just by the array's value * @param {Array} src [{id:1},{id:2},{id:1}] * @param {String} [key] * @param {Boolean} [sort=False] * @returns {Array} [{id:1},{id:2}] */ function uniqueArray(src, key, sort) { var results = []; var values = []; var i = 0; while (i < src.length) { var val = key ? src[i][key] : src[i]; if (inArray(values, val) < 0) { results.push(src[i]); } values[i] = val; i++; } if (sort) { if (!key) { results = results.sort(); } else { results = results.sort(function (a, b) { return a[key] > b[key]; }); } } return results; } var TOUCH_INPUT_MAP = { touchstart: INPUT_START, touchmove: INPUT_MOVE, touchend: INPUT_END, touchcancel: INPUT_CANCEL }; var TOUCH_TARGET_EVENTS = 'touchstart touchmove touchend touchcancel'; /** * @private * Multi-user touch events input * @constructor * @extends Input */ var TouchInput = function (_Input) { inherits(TouchInput, _Input); function TouchInput() { classCallCheck(this, TouchInput); TouchInput.prototype.evTarget = TOUCH_TARGET_EVENTS; TouchInput.prototype.targetIds = {}; var _this = possibleConstructorReturn(this, (TouchInput.__proto__ || Object.getPrototypeOf(TouchInput)).apply(this, arguments)); _this.evTarget = TOUCH_TARGET_EVENTS; _this.targetIds = {}; return _this; } createClass(TouchInput, [{ key: 'handler', value: function handler(ev) { var type = TOUCH_INPUT_MAP[ev.type]; var touches = getTouches.call(this, ev, type); if (!touches) { return; } this.callback(this.manager, type, { pointers: touches[0], changedPointers: touches[1], pointerType: INPUT_TYPE_TOUCH, srcEvent: ev }); } }]); return TouchInput; }(Input); function getTouches(ev, type) { var allTouches = toArray$1(ev.touches); var targetIds = this.targetIds; // when there is only one touch, the process can be simplified if (type & (INPUT_START | INPUT_MOVE) && allTouches.length === 1) { targetIds[allTouches[0].identifier] = true; return [allTouches, allTouches]; } var i = void 0; var targetTouches = void 0; var changedTouches = toArray$1(ev.changedTouches); var changedTargetTouches = []; var target = this.target; // get target touches from touches targetTouches = allTouches.filter(function (touch) { return hasParent(touch.target, target); }); // collect touches if (type === INPUT_START) { i = 0; while (i < targetTouches.length) { targetIds[targetTouches[i].identifier] = true; i++; } } // filter changed touches to only contain touches that exist in the collected target ids i = 0; while (i < changedTouches.length) { if (targetIds[changedTouches[i].identifier]) { changedTargetTouches.push(changedTouches[i]); } // cleanup removed touches if (type & (INPUT_END | INPUT_CANCEL)) { delete targetIds[changedTouches[i].identifier]; } i++; } if (!changedTargetTouches.length) { return; } return [ // merge targetTouches with changedTargetTouches so it contains ALL touches, including 'end' and 'cancel' uniqueArray(targetTouches.concat(changedTargetTouches), 'identifier', true), changedTargetTouches]; } var MOUSE_INPUT_MAP = { mousedown: INPUT_START, mousemove: INPUT_MOVE, mouseup: INPUT_END }; var MOUSE_ELEMENT_EVENTS = 'mousedown'; var MOUSE_WINDOW_EVENTS = 'mousemove mouseup'; /** * @private * Mouse events input * @constructor * @extends Input */ var MouseInput = function (_Input) { inherits(MouseInput, _Input); function MouseInput() { classCallCheck(this, MouseInput); var _this = possibleConstructorReturn(this, (MouseInput.__proto__ || Object.getPrototypeOf(MouseInput)).apply(this, arguments)); _this.evEl = MOUSE_ELEMENT_EVENTS; _this.evWin = MOUSE_WINDOW_EVENTS; _this.pressed = false; // mousedown state return _this; } /** * @private * handle mouse events * @param {Object} ev */ createClass(MouseInput, [{ key: 'handler', value: function handler(ev) { var eventType = MOUSE_INPUT_MAP[ev.type]; // on start we want to have the left mouse button down if (eventType & INPUT_START && ev.button === 0) { this.pressed = true; } if (eventType & INPUT_MOVE && ev.which !== 1) { eventType = INPUT_END; } // mouse must be down if (!this.pressed) { return; } if (eventType & INPUT_END) { this.pressed = false; } this.callback(this.manager, eventType, { pointers: [ev], changedPointers: [ev], pointerType: INPUT_TYPE_MOUSE, srcEvent: ev }); } }]); return MouseInput; }(Input); /** * @private * Combined touch and mouse input * * Touch has a higher priority then mouse, and while touching no mouse events are allowed. * This because touch devices also emit mouse events while doing a touch. * * @constructor * @extends Input */ var DEDUP_TIMEOUT = 2500; var DEDUP_DISTANCE = 25; var TouchMouseInput = function (_Input) { inherits(TouchMouseInput, _Input); function TouchMouseInput() { classCallCheck(this, TouchMouseInput); var _this = possibleConstructorReturn(this, (TouchMouseInput.__proto__ || Object.getPrototypeOf(TouchMouseInput)).apply(this, arguments)); var handler = bindFn(_this.handler, _this); _this.touch = new TouchInput(_this.manager, handler); _this.mouse = new MouseInput(_this.manager, handler); _this.primaryTouch = null; _this.lastTouches = []; return _this; } /** * @private * handle mouse and touch events * @param {Hammer} manager * @param {String} inputEvent * @param {Object} inputData */ createClass(TouchMouseInput, [{ key: 'handler', value: function handler(manager, inputEvent, inputData) { var isTouch = inputData.pointerType === INPUT_TYPE_TOUCH; var isMouse = inputData.pointerType === INPUT_TYPE_MOUSE; if (isMouse && inputData.sourceCapabilities && inputData.sourceCapabilities.firesTouchEvents) { return; } // when we're in a touch event, record touches to de-dupe synthetic mouse event if (isTouch) { recordTouches.call(this, inputEvent, inputData); } else if (isMouse && isSyntheticEvent.call(this, inputData)) { return; } this.callback(manager, inputEvent, inputData); } /** * @private * remove the event listeners */ }, { key: 'destroy', value: function destroy() { this.touch.destroy(); this.mouse.destroy(); } }]); return TouchMouseInput; }(Input); function recordTouches(eventType, eventData) { if (eventType & INPUT_START) { this.primaryTouch = eventData.changedPointers[0].identifier; setLastTouch.call(this, eventData); } else if (eventType & (INPUT_END | INPUT_CANCEL)) { setLastTouch.call(this, eventData); } } function setLastTouch(eventData) { var _this2 = this; var _eventData$changedPoi = slicedToArray(eventData.changedPointers, 1); var touch = _eventData$changedPoi[0]; if (touch.identifier === this.primaryTouch) { (function () { var lastTouch = { x: touch.clientX, y: touch.clientY }; _this2.lastTouches.push(lastTouch); var lts = _this2.lastTouches; var removeLastTouch = function removeLastTouch() { var i = lts.indexOf(lastTouch); if (i > -1) { lts.splice(i, 1); } }; setTimeout(removeLastTouch, DEDUP_TIMEOUT); })(); } } function isSyntheticEvent(eventData) { var x = eventData.srcEvent.clientX; var y = eventData.srcEvent.clientY; for (var i = 0; i < this.lastTouches.length; i++) { var t = this.lastTouches[i]; var dx = Math.abs(x - t.x); var dy = Math.abs(y - t.y); if (dx <= DEDUP_DISTANCE && dy <= DEDUP_DISTANCE) { return true; } } return false; } /** * @private * create new input type manager * called by the Manager constructor * @param {Hammer} manager * @returns {Input} */ function createInputInstance(manager) { var Type = void 0; // let inputClass = manager.options.inputClass; var inputClass = manager.options.inputClass; if (inputClass) { Type = inputClass; } else if (SUPPORT_POINTER_EVENTS) { Type = PointerEventInput; } else if (SUPPORT_ONLY_TOUCH) { Type = TouchInput; } else if (!SUPPORT_TOUCH) { Type = MouseInput; } else { Type = TouchMouseInput; } return new Type(manager, inputHandler); } var STOP = 1; var FORCED_STOP = 2; /** * @private * Manager * @param {HTMLElement} element * @param {Object} [options] * @constructor */ var Manager = function () { function Manager(element, options) { var _this = this; classCallCheck(this, Manager); this.options = assign$1({}, Hammer.defaults, options || {}); this.options.inputTarget = this.options.inputTarget || element; this.handlers = {}; this.session = {}; this.recognizers = []; this.oldCssProps = {}; this.element = element; this.input = createInputInstance(this); this.touchAction = new TouchAction(this, this.options.touchAction); toggleCssProps(this, true); each(this.options.recognizers, function (item) { var recognizer = _this.add(new item[0](item[1])); item[2] && recognizer.recognizeWith(item[2]); item[3] && recognizer.requireFailure(item[3]); }, this); } /** * @private * set options * @param {Object} options * @returns {Manager} */ createClass(Manager, [{ key: 'set', value: function set(options) { assign$1(this.options, options); // Options that need a little more setup if (options.touchAction) { this.touchAction.update(); } if (options.inputTarget) { // Clean up existing event listeners and reinitialize this.input.destroy(); this.input.target = options.inputTarget; this.input.init(); } return this; } /** * @private * stop recognizing for this session. * This session will be discarded, when a new [input]start event is fired. * When forced, the recognizer cycle is stopped immediately. * @param {Boolean} [force] */ }, { key: 'stop', value: function stop(force) { this.session.stopped = force ? FORCED_STOP : STOP; } /** * @private * run the recognizers! * called by the inputHandler function on every movement of the pointers (touches) * it walks through all the recognizers and tries to detect the gesture that is being made * @param {Object} inputData */ }, { key: 'recognize', value: function recognize(inputData) { var session = this.session; if (session.stopped) { return; } // run the touch-action polyfill this.touchAction.preventDefaults(inputData); var recognizer = void 0; var recognizers = this.recognizers; // this holds the recognizer that is being recognized. // so the recognizer's state needs to be BEGAN, CHANGED, ENDED or RECOGNIZED // if no recognizer is detecting a thing, it is set to `null` var curRecognizer = session.curRecognizer; // reset when the last recognizer is recognized // or when we're in a new session if (!curRecognizer || curRecognizer && curRecognizer.state & STATE_RECOGNIZED) { curRecognizer = session.curRecognizer = null; } var i = 0; while (i < recognizers.length) { recognizer = recognizers[i]; // find out if we are allowed try to recognize the input for this one. // 1. allow if the session is NOT forced stopped (see the .stop() method) // 2. allow if we still haven't recognized a gesture in this session, or the this recognizer is the one // that is being recognized. // 3. allow if the recognizer is allowed to run simultaneous with the current recognized recognizer. // this can be setup with the `recognizeWith()` method on the recognizer. if (session.stopped !== FORCED_STOP && ( // 1 !curRecognizer || recognizer === curRecognizer || // 2 recognizer.canRecognizeWith(curRecognizer))) { // 3 recognizer.recognize(inputData); } else { recognizer.reset(); } // if the recognizer has been recognizing the input as a valid gesture, we want to store this one as the // current active recognizer. but only if we don't already have an active recognizer if (!curRecognizer && recognizer.state & (STATE_BEGAN | STATE_CHANGED | STATE_ENDED)) { curRecognizer = session.curRecognizer = recognizer; } i++; } } /** * @private * get a recognizer by its event name. * @param {Recognizer|String} recognizer * @returns {Recognizer|Null} */ }, { key: 'get', value: function get(recognizer) { if (recognizer instanceof Recognizer) { return recognizer; } var recognizers = this.recognizers; for (var i = 0; i < recognizers.length; i++) { if (recognizers[i].options.event === recognizer) { return recognizers[i]; } } return null; } /** * @private add a recognizer to the manager * existing recognizers with the same event name will be removed * @param {Recognizer} recognizer * @returns {Recognizer|Manager} */ }, { key: 'add', value: function add(recognizer) { if (invokeArrayArg(recognizer, 'add', this)) { return this; } // remove existing var existing = this.get(recognizer.options.event); if (existing) { this.remove(existing); } this.recognizers.push(recognizer); recognizer.manager = this; this.touchAction.update(); return recognizer; } /** * @private * remove a recognizer by name or instance * @param {Recognizer|String} recognizer * @returns {Manager} */ }, { key: 'remove', value: function remove(recognizer) { if (invokeArrayArg(recognizer, 'remove', this)) { return this; } recognizer = this.get(recognizer); // let's make sure this recognizer exists if (recognizer) { var recognizers = this.recognizers; var index = inArray(recognizers, recognizer); if (index !== -1) { recognizers.splice(index, 1); this.touchAction.update(); } } return this; } /** * @private * bind event * @param {String} events * @param {Function} handler * @returns {EventEmitter} this */ }, { key: 'on', value: function on(events, handler) { if (events === undefined) { return; } if (handler === undefined) { return; } var handlers = this.handlers; each(splitStr(events), function (event) { handlers[event] = handlers[event] || []; handlers[event].push(handler); }); return this; } /** * @private unbind event, leave emit blank to remove all handlers * @param {String} events * @param {Function} [handler] * @returns {EventEmitter} this */ }, { key: 'off', value: function off(events, handler) { if (events === undefined) { return; } var handlers = this.handlers; each(splitStr(events), function (event) { if (!handler) { delete handlers[event]; } else { handlers[event] && handlers[event].splice(inArray(handlers[event], handler), 1); } }); return this; } /** * @private emit event to the listeners * @param {String} event * @param {Object} data */ }, { key: 'emit', value: function emit(event, data) { // we also want to trigger dom events if (this.options.domEvents) { triggerDomEvent(event, data); } // no handlers, so skip it all var handlers = this.handlers[event] && this.handlers[event].slice(); if (!handlers || !handlers.length) { return; } data.type = event; data.preventDefault = function () { data.srcEvent.preventDefault(); }; var i = 0; while (i < handlers.length) { handlers[i](data); i++; } } /** * @private * destroy the manager and unbinds all events * it doesn't unbind dom events, that is the user own responsibility */ }, { key: 'destroy', value: function destroy() { this.element && toggleCssProps(this, false); this.handlers = {}; this.session = {}; this.input.destroy(); this.element = null; } }]); return Manager; }(); function toggleCssProps(manager, add) { var element = manager.element; if (!element.style) { return; } var prop = void 0; each(manager.options.cssProps, function (value, name) { prop = prefixed(element.style, name); if (add) { manager.oldCssProps[prop] = element.style[prop]; element.style[prop] = value; } else { element.style[prop] = manager.oldCssProps[prop] || ''; } }); if (!add) { manager.oldCssProps = {}; } } /** * @private * trigger dom event * @param {String} event * @param {Object} data */ function triggerDomEvent(event, data) { var gestureEvent = document.createEvent('Event'); gestureEvent.initEvent(event, true, true); gestureEvent.gesture = data; data.target.dispatchEvent(gestureEvent); } /** * @private * Simple way to create a manager with a default set of recognizers. * @param {HTMLElement} element * @param {Object} [options] * @constructor */ var Hammer = function Hammer(element, options) { classCallCheck(this, Hammer); options = options || {}; options.recognizers = ifUndefined(options.recognizers, Hammer.defaults.preset); return new Manager(element, options); }; Hammer.VERSION = '2.0.8'; /** * @private * default settings * @namespace */ Hammer.defaults = { /** * @private * set if DOM events are being triggered. * But this is slower and unused by simple implementations, so disabled by default. * @type {Boolean} * @default false */ domEvents: false, /** * @private * The value for the touchAction property/fallback. * When set to `compute` it will magically set the correct value based on the added recognizers. * @type {String} * @default compute */ touchAction: TOUCH_ACTION_COMPUTE, /** * @private * @type {Boolean} * @default true */ enable: true, /** * @private * EXPERIMENTAL FEATURE -- can be removed/changed * Change the parent input target element. * If Null, then it is being set the to main element. * @type {Null|EventTarget} * @default null */ inputTarget: null, /** * @private * force an input class * @type {Null|Function} * @default null */ inputClass: null, /** * @private * Default recognizer setup when calling `Hammer()` * When creating a new Manager these will be skipped. * @type {Array} */ preset: [ // RecognizerClass, options, [recognizeWith, ...], [requireFailure, ...] [RotateRecognizer, { enable: false }], [PinchRecognizer, { enable: false }, ['rotate']], [SwipeRecognizer, { direction: DIRECTION_HORIZONTAL }], [PanRecognizer, { direction: DIRECTION_HORIZONTAL }, ['swipe']], [TapRecognizer], [TapRecognizer, { event: 'doubletap', taps: 2 }, ['tap']], [PressRecognizer]], /** * @private * Some CSS properties can be used to improve the working of Hammer. * Add them to this method and they will be set when creating a new Manager. * @namespace */ cssProps: { /** * @private * Disables text selection to improve the dragging gesture. Mainly for desktop browsers. * @type {String} * @default 'none' */ userSelect: 'none', /** * @private * Disable the Windows Phone grippers when pressing an element. * @type {String} * @default 'none' */ touchSelect: 'none', /** * @private * Disables the default callout shown when you touch and hold a touch target. * On iOS, when you touch and hold a touch target such as a link, Safari displays * a callout containing information about the link. This property allows you to disable that callout. * @type {String} * @default 'none' */ touchCallout: 'none', /** * @private * Specifies whether zooming is enabled. Used by IE10> * @type {String} * @default 'none' */ contentZooming: 'none', /** * @private * Specifies that an entire element should be draggable instead of its contents. Mainly for desktop browsers. * @type {String} * @default 'none' */ userDrag: 'none', /** * @private * Overrides the highlight color shown when the user taps a link or a JavaScript * clickable element in iOS. This property obeys the alpha value, if specified. * @type {String} * @default 'rgba(0,0,0,0)' */ tapHighlightColor: 'rgba(0,0,0,0)' } }; var SINGLE_TOUCH_INPUT_MAP = { touchstart: INPUT_START, touchmove: INPUT_MOVE, touchend: INPUT_END, touchcancel: INPUT_CANCEL }; var SINGLE_TOUCH_TARGET_EVENTS = 'touchstart'; var SINGLE_TOUCH_WINDOW_EVENTS = 'touchstart touchmove touchend touchcancel'; /** * @private * Touch events input * @constructor * @extends Input */ var SingleTouchInput = function (_Input) { inherits(SingleTouchInput, _Input); function SingleTouchInput() { classCallCheck(this, SingleTouchInput); var _this = possibleConstructorReturn(this, (SingleTouchInput.__proto__ || Object.getPrototypeOf(SingleTouchInput)).apply(this, arguments)); _this.evTarget = SINGLE_TOUCH_TARGET_EVENTS; _this.evWin = SINGLE_TOUCH_WINDOW_EVENTS; _this.started = false; Input.apply(_this, arguments); return _this; } createClass(SingleTouchInput, [{ key: 'handler', value: function handler(ev) { var type = SINGLE_TOUCH_INPUT_MAP[ev.type]; // should we handle the touch events? if (type === INPUT_START) { this.started = true; } if (!this.started) { return; } var touches = normalizeSingleTouches.call(this, ev, type); // when done, reset the started state if (type & (INPUT_END | INPUT_CANCEL) && touches[0].length - touches[1].length === 0) { this.started = false; } this.callback(this.manager, type, { pointers: touches[0], changedPointers: touches[1], pointerType: INPUT_TYPE_TOUCH, srcEvent: ev }); } }]); return SingleTouchInput; }(Input); function normalizeSingleTouches(ev, type) { var all = toArray$1(ev.touches); var changed = toArray$1(ev.changedTouches); if (type & (INPUT_END | INPUT_CANCEL)) { all = uniqueArray(all.concat(changed), 'identifier', true); } return [all, changed]; } /** * @private * wrap a method with a deprecation warning and stack trace * @param {Function} method * @param {String} name * @param {String} message * @returns {Function} A new function wrapping the supplied method. */ function deprecate(method, name, message) { var deprecationMessage = 'DEPRECATED METHOD: ' + name + '\n' + message + ' AT \n'; return function () { var e = new Error('get-stack-trace'); var stack = e && e.stack ? e.stack.replace(/^[^\(]+?[\n$]/gm, '').replace(/^\s+at\s+/gm, '').replace(/^Object.\s*\(/gm, '{anonymous}()@') : 'Unknown Stack Trace'; var log = window.console && (window.console.warn || window.console.log); if (log) { log.call(window.console, deprecationMessage, stack); } return method.apply(this, arguments); }; } /** * @private * extend object. * means that properties in dest will be overwritten by the ones in src. * @param {Object} dest * @param {Object} src * @param {Boolean} [merge=false] * @returns {Object} dest */ var extend = deprecate(function (dest, src, merge) { var keys = Object.keys(src); var i = 0; while (i < keys.length) { if (!merge || merge && dest[keys[i]] === undefined) { dest[keys[i]] = src[keys[i]]; } i++; } return dest; }, 'extend', 'Use `assign`.'); /** * @private * merge the values from src in the dest. * means that properties that exist in dest will not be overwritten by src * @param {Object} dest * @param {Object} src * @returns {Object} dest */ var merge = deprecate(function (dest, src) { return extend(dest, src, true); }, 'merge', 'Use `assign`.'); /** * @private * simple class inheritance * @param {Function} child * @param {Function} base * @param {Object} [properties] */ function inherit(child, base, properties) { var baseP = base.prototype; var childP = void 0; childP = child.prototype = Object.create(baseP); childP.constructor = child; childP._super = baseP; if (properties) { assign$1(childP, properties); } } // this prevents errors when Hammer is loaded in the presence of an AMD // style loader but by script tag, not by the loader. assign$1(Hammer, { INPUT_START: INPUT_START, INPUT_MOVE: INPUT_MOVE, INPUT_END: INPUT_END, INPUT_CANCEL: INPUT_CANCEL, STATE_POSSIBLE: STATE_POSSIBLE, STATE_BEGAN: STATE_BEGAN, STATE_CHANGED: STATE_CHANGED, STATE_ENDED: STATE_ENDED, STATE_RECOGNIZED: STATE_RECOGNIZED, STATE_CANCELLED: STATE_CANCELLED, STATE_FAILED: STATE_FAILED, DIRECTION_NONE: DIRECTION_NONE, DIRECTION_LEFT: DIRECTION_LEFT, DIRECTION_RIGHT: DIRECTION_RIGHT, DIRECTION_UP: DIRECTION_UP, DIRECTION_DOWN: DIRECTION_DOWN, DIRECTION_HORIZONTAL: DIRECTION_HORIZONTAL, DIRECTION_VERTICAL: DIRECTION_VERTICAL, DIRECTION_ALL: DIRECTION_ALL, Manager: Manager, Input: Input, TouchAction: TouchAction, TouchInput: TouchInput, MouseInput: MouseInput, PointerEventInput: PointerEventInput, TouchMouseInput: TouchMouseInput, SingleTouchInput: SingleTouchInput, Recognizer: Recognizer, AttrRecognizer: AttrRecognizer, Tap: TapRecognizer, Pan: PanRecognizer, Swipe: SwipeRecognizer, Pinch: PinchRecognizer, Rotate: RotateRecognizer, Press: PressRecognizer, on: addEventListeners, off: removeEventListeners, each: each, merge: merge, extend: extend, assign: assign$1, inherit: inherit, bindFn: bindFn, prefixed: prefixed, toArray: toArray$1, inArray: inArray, uniqueArray: uniqueArray, splitStr: splitStr, boolOrFn: boolOrFn, hasParent: hasParent, addEventListeners: addEventListeners, removeEventListeners: removeEventListeners }); /* jshint ignore:start */ if (typeof define === 'function' && define.amd) { define(function () { return Hammer; }); } else if (typeof module !== 'undefined' && module.exports) { module.exports = Hammer; } else { window[exportName] = Hammer; } /* jshint ignore:end */ })(window, document, 'Hammer'); ================================================ FILE: package.json ================================================ { "name": "hammerjs", "title": "Hammer.JS", "description": "A javascript library for multi-touch gestures", "version": "2.0.8", "homepage": "http://hammerjs.github.io/", "license": "MIT", "keywords": [ "touch", "gestures" ], "author": { "name": "Jorik Tangelder", "email": "j.tangelder@gmail.com" }, "contributors": [ { "name": "Alexander Schmitz", "email": "arschmitz@gmail.com" }, { "name": "Chris Thoburn", "email": "" } ], "repository": { "type": "git", "url": "git://github.com/hammerjs/hammer.js.git" }, "bugs": { "url": "https://github.com/hammerjs/hammer.js/issues" }, "dependencies": {}, "devDependencies": { "babel-core": "^6.26.3", "babel-plugin-external-helpers": "^6.22.0", "babel-preset-env": "^1.7.0", "bannerize": "^1.0.2", "blanket": "^1.2.3", "changelogplease": "^1.2.0", "ember-suave": "^4.0.0", "git-tags": "^0.2.4", "hammer-simulator": "git://github.com/hammerjs/simulator#master", "jquery": "^3.1.0", "jquery-hammerjs": "2.0.x", "jscs": "^3.0.7", "jshint": "^2.9.2", "jshint-stylish": "^2.2.0", "lodash-compat": "^3.10.2", "node-qunit-phantomjs": "^1.4.0", "qunitjs": "^2.0.0", "rollup": "^0.59.4", "rollup-plugin-babel": "^3.0.4", "run-when-changed": "^2.1.0", "serve": "^1.4.0", "uglify-js": "^3.4.0" }, "main": "hammer.js", "engines": { "node": ">=0.8.0" }, "scripts": { "bannerize": "bannerize hammer.js hammer.min.js", "connect": "serve -p 8000 ./", "rollup": "rollup -c", "uglify": "uglifyjs hammer.js --source-map \"filename=hammer.min.js.map\" -o hammer.min.js --timings", "string-replace": "node string-replace.js", "jshint": "jshint src/**/*.js tests/unit/*.js tests/unit/gestures/*.js --config .jshintrc --verbose --reporter=node_modules/jshint-stylish", "jscs": " jscs src/**/*.js tests/unit/*.js tests/unit/gestures/*.js --config=./.jscsrc", "qunit": "phantomjs node_modules/qunit-phantomjs-runner/runner-list.js tests/unit/index.html 15", "watch": "run-when-changed --watch 'src/**/*.js' --watch 'tests/unit/*.js' --watch 'tests/unit/gestures/*.js' --exec 'npm run watch-tasks'", "watch-tasks": "npm run rollup && npm run string-replace && npm run uglify && npm run jshint && npm run jscs", "build": "npm run rollup && npm run string-replace && npm run uglify && npm run bannerize", "test": "npm run build && npm run jshint && npm run jscs && npm run qunit" } } ================================================ FILE: rollup.config.js ================================================ import babel from 'rollup-plugin-babel'; export default { entry: 'src/main.js', format: 'es', plugins: [ babel({ exclude: 'node_modules/**' }) ], dest: 'hammer.js', intro: " (function(window, document, exportName, undefined) { \n'use strict';", outro: "})(window, document, 'Hammer');" }; ================================================ FILE: src/.babelrc ================================================ { "presets": [ [ "env", { "modules": false } ] ], "plugins": [ "external-helpers" ] } ================================================ FILE: src/hammer.js ================================================ import ifUndefined from './utils/if-undefined'; import { TOUCH_ACTION_COMPUTE } from './touchactionjs/touchaction-Consts'; import { DIRECTION_HORIZONTAL } from './inputjs/input-consts'; import RotateRecognizer from './recognizers/rotate'; import PinchRecognizer from './recognizers/pinch'; import SwipeRecognizer from './recognizers/swipe'; import PanRecognizer from './recognizers/pan'; import TapRecognizer from './recognizers/tap'; import PressRecognizer from './recognizers/press'; import Manager from './manager'; /** * @private * Simple way to create a manager with a default set of recognizers. * @param {HTMLElement} element * @param {Object} [options] * @constructor */ export default class Hammer { constructor(element, options) { options = options || {}; options.recognizers = ifUndefined(options.recognizers, Hammer.defaults.preset); return new Manager(element, options); } } /** * @private * @const {string} */ Hammer.VERSION = '{{PKG_VERSION}}'; /** * @private * default settings * @namespace */ Hammer.defaults = { /** * @private * set if DOM events are being triggered. * But this is slower and unused by simple implementations, so disabled by default. * @type {Boolean} * @default false */ domEvents: false, /** * @private * The value for the touchAction property/fallback. * When set to `compute` it will magically set the correct value based on the added recognizers. * @type {String} * @default compute */ touchAction: TOUCH_ACTION_COMPUTE, /** * @private * @type {Boolean} * @default true */ enable: true, /** * @private * EXPERIMENTAL FEATURE -- can be removed/changed * Change the parent input target element. * If Null, then it is being set the to main element. * @type {Null|EventTarget} * @default null */ inputTarget: null, /** * @private * force an input class * @type {Null|Function} * @default null */ inputClass: null, /** * @private * Default recognizer setup when calling `Hammer()` * When creating a new Manager these will be skipped. * @type {Array} */ preset: [ // RecognizerClass, options, [recognizeWith, ...], [requireFailure, ...] [RotateRecognizer, { enable: false }], [PinchRecognizer, { enable: false }, ['rotate']], [SwipeRecognizer, { direction: DIRECTION_HORIZONTAL }], [PanRecognizer, { direction: DIRECTION_HORIZONTAL }, ['swipe']], [TapRecognizer], [TapRecognizer, { event: 'doubletap', taps: 2 }, ['tap']], [PressRecognizer] ], /** * @private * Some CSS properties can be used to improve the working of Hammer. * Add them to this method and they will be set when creating a new Manager. * @namespace */ cssProps: { /** * @private * Disables text selection to improve the dragging gesture. Mainly for desktop browsers. * @type {String} * @default 'none' */ userSelect: 'none', /** * @private * Disable the Windows Phone grippers when pressing an element. * @type {String} * @default 'none' */ touchSelect: 'none', /** * @private * Disables the default callout shown when you touch and hold a touch target. * On iOS, when you touch and hold a touch target such as a link, Safari displays * a callout containing information about the link. This property allows you to disable that callout. * @type {String} * @default 'none' */ touchCallout: 'none', /** * @private * Specifies whether zooming is enabled. Used by IE10> * @type {String} * @default 'none' */ contentZooming: 'none', /** * @private * Specifies that an entire element should be draggable instead of its contents. Mainly for desktop browsers. * @type {String} * @default 'none' */ userDrag: 'none', /** * @private * Overrides the highlight color shown when the user taps a link or a JavaScript * clickable element in iOS. This property obeys the alpha value, if specified. * @type {String} * @default 'rgba(0,0,0,0)' */ tapHighlightColor: 'rgba(0,0,0,0)' } }; ================================================ FILE: src/input/mouse.js ================================================ import { INPUT_START, INPUT_MOVE, INPUT_END, INPUT_TYPE_MOUSE } from '../inputjs/input-consts'; import Input from '../inputjs/input-constructor'; const MOUSE_INPUT_MAP = { mousedown: INPUT_START, mousemove: INPUT_MOVE, mouseup: INPUT_END }; const MOUSE_ELEMENT_EVENTS = 'mousedown'; const MOUSE_WINDOW_EVENTS = 'mousemove mouseup'; /** * @private * Mouse events input * @constructor * @extends Input */ export default class MouseInput extends Input { constructor() { super(...arguments); this.evEl = MOUSE_ELEMENT_EVENTS; this.evWin = MOUSE_WINDOW_EVENTS; this.pressed = false; // mousedown state } /** * @private * handle mouse events * @param {Object} ev */ handler(ev) { let eventType = MOUSE_INPUT_MAP[ev.type]; // on start we want to have the left mouse button down if (eventType & INPUT_START && ev.button === 0) { this.pressed = true; } if (eventType & INPUT_MOVE && ev.which !== 1) { eventType = INPUT_END; } // mouse must be down if (!this.pressed) { return; } if (eventType & INPUT_END) { this.pressed = false; } this.callback(this.manager, eventType, { pointers: [ev], changedPointers: [ev], pointerType: INPUT_TYPE_MOUSE, srcEvent: ev }); } } ================================================ FILE: src/input/pointerevent.js ================================================ import { INPUT_START, INPUT_END, INPUT_CANCEL, INPUT_MOVE, INPUT_TYPE_TOUCH, INPUT_TYPE_MOUSE, INPUT_TYPE_PEN, INPUT_TYPE_KINECT } from '../inputjs/input-consts'; import Input from '../inputjs/input-constructor'; import inArray from '../utils/in-array'; const POINTER_INPUT_MAP = { pointerdown: INPUT_START, pointermove: INPUT_MOVE, pointerup: INPUT_END, pointercancel: INPUT_CANCEL, pointerout: INPUT_CANCEL }; // in IE10 the pointer types is defined as an enum const IE10_POINTER_TYPE_ENUM = { 2: INPUT_TYPE_TOUCH, 3: INPUT_TYPE_PEN, 4: INPUT_TYPE_MOUSE, 5: INPUT_TYPE_KINECT // see https://twitter.com/jacobrossi/status/480596438489890816 }; let POINTER_ELEMENT_EVENTS = 'pointerdown'; let POINTER_WINDOW_EVENTS = 'pointermove pointerup pointercancel'; // IE10 has prefixed support, and case-sensitive if (window.MSPointerEvent && !window.PointerEvent) { POINTER_ELEMENT_EVENTS = 'MSPointerDown'; POINTER_WINDOW_EVENTS = 'MSPointerMove MSPointerUp MSPointerCancel'; } /** * @private * Pointer events input * @constructor * @extends Input */ export default class PointerEventInput extends Input { constructor() { super(...arguments); this.evEl = POINTER_ELEMENT_EVENTS; this.evWin = POINTER_WINDOW_EVENTS; this.store = (this.manager.session.pointerEvents = []); } /** * @private * handle mouse events * @param {Object} ev */ handler(ev) { let { store } = this; let removePointer = false; let eventTypeNormalized = ev.type.toLowerCase().replace('ms', ''); let eventType = POINTER_INPUT_MAP[eventTypeNormalized]; let pointerType = IE10_POINTER_TYPE_ENUM[ev.pointerType] || ev.pointerType; let isTouch = (pointerType === INPUT_TYPE_TOUCH); // get index of the event in the store let storeIndex = inArray(store, ev.pointerId, 'pointerId'); // start and mouse must be down if (eventType & INPUT_START && (ev.button === 0 || isTouch)) { if (storeIndex < 0) { store.push(ev); storeIndex = store.length - 1; } } else if (eventType & (INPUT_END | INPUT_CANCEL)) { removePointer = true; } // it not found, so the pointer hasn't been down (so it's probably a hover) if (storeIndex < 0) { return; } // update the event in the store store[storeIndex] = ev; this.callback(this.manager, eventType, { pointers: store, changedPointers: [ev], pointerType, srcEvent: ev }); if (removePointer) { // remove from the store store.splice(storeIndex, 1); } } } ================================================ FILE: src/input/singletouch.js ================================================ import { INPUT_START, INPUT_MOVE, INPUT_END, INPUT_CANCEL, INPUT_TYPE_TOUCH } from '../inputjs/input-consts'; import Input from '../inputjs/input-constructor'; import toArray from '../utils/to-array'; import uniqueArray from '../utils/unique-array'; const SINGLE_TOUCH_INPUT_MAP = { touchstart: INPUT_START, touchmove: INPUT_MOVE, touchend: INPUT_END, touchcancel: INPUT_CANCEL }; const SINGLE_TOUCH_TARGET_EVENTS = 'touchstart'; const SINGLE_TOUCH_WINDOW_EVENTS = 'touchstart touchmove touchend touchcancel'; /** * @private * Touch events input * @constructor * @extends Input */ export default class SingleTouchInput extends Input { constructor() { super(...arguments); this.evTarget = SINGLE_TOUCH_TARGET_EVENTS; this.evWin = SINGLE_TOUCH_WINDOW_EVENTS; this.started = false; Input.apply(this, arguments); } handler(ev) { let type = SINGLE_TOUCH_INPUT_MAP[ev.type]; // should we handle the touch events? if (type === INPUT_START) { this.started = true; } if (!this.started) { return; } let touches = normalizeSingleTouches.call(this, ev, type); // when done, reset the started state if (type & (INPUT_END | INPUT_CANCEL) && touches[0].length - touches[1].length === 0) { this.started = false; } this.callback(this.manager, type, { pointers: touches[0], changedPointers: touches[1], pointerType: INPUT_TYPE_TOUCH, srcEvent: ev }); } } /** * @private * @this {TouchInput} * @param {Object} ev * @param {Number} type flag * @returns {undefined|Array} [all, changed] */ function normalizeSingleTouches(ev, type) { let all = toArray(ev.touches); let changed = toArray(ev.changedTouches); if (type & (INPUT_END | INPUT_CANCEL)) { all = uniqueArray(all.concat(changed), 'identifier', true); } return [all, changed]; } ================================================ FILE: src/input/touch.js ================================================ import { INPUT_START, INPUT_MOVE, INPUT_END, INPUT_CANCEL, INPUT_TYPE_TOUCH } from '../inputjs/input-consts'; import Input from '../inputjs/input-constructor'; import toArray from '../utils/to-array'; import hasParent from '../utils/has-parent'; import uniqueArray from '../utils/unique-array'; const TOUCH_INPUT_MAP = { touchstart: INPUT_START, touchmove: INPUT_MOVE, touchend: INPUT_END, touchcancel: INPUT_CANCEL }; const TOUCH_TARGET_EVENTS = 'touchstart touchmove touchend touchcancel'; /** * @private * Multi-user touch events input * @constructor * @extends Input */ export default class TouchInput extends Input { constructor() { TouchInput.prototype.evTarget = TOUCH_TARGET_EVENTS; TouchInput.prototype.targetIds = {}; super(...arguments); this.evTarget = TOUCH_TARGET_EVENTS; this.targetIds = {}; } handler(ev) { let type = TOUCH_INPUT_MAP[ev.type]; let touches = getTouches.call(this, ev, type); if (!touches) { return; } this.callback(this.manager, type, { pointers: touches[0], changedPointers: touches[1], pointerType: INPUT_TYPE_TOUCH, srcEvent: ev }); } } /** * @private * @this {TouchInput} * @param {Object} ev * @param {Number} type flag * @returns {undefined|Array} [all, changed] */ function getTouches(ev, type) { let allTouches = toArray(ev.touches); let { targetIds } = this; // when there is only one touch, the process can be simplified if (type & (INPUT_START | INPUT_MOVE) && allTouches.length === 1) { targetIds[allTouches[0].identifier] = true; return [allTouches, allTouches]; } let i; let targetTouches; let changedTouches = toArray(ev.changedTouches); let changedTargetTouches = []; let { target } = this; // get target touches from touches targetTouches = allTouches.filter((touch) => { return hasParent(touch.target, target); }); // collect touches if (type === INPUT_START) { i = 0; while (i < targetTouches.length) { targetIds[targetTouches[i].identifier] = true; i++; } } // filter changed touches to only contain touches that exist in the collected target ids i = 0; while (i < changedTouches.length) { if (targetIds[changedTouches[i].identifier]) { changedTargetTouches.push(changedTouches[i]); } // cleanup removed touches if (type & (INPUT_END | INPUT_CANCEL)) { delete targetIds[changedTouches[i].identifier]; } i++; } if (!changedTargetTouches.length) { return; } return [ // merge targetTouches with changedTargetTouches so it contains ALL touches, including 'end' and 'cancel' uniqueArray(targetTouches.concat(changedTargetTouches), 'identifier', true), changedTargetTouches ]; } ================================================ FILE: src/input/touchmouse.js ================================================ import Input from '../inputjs/input-constructor'; import bindFn from '../utils/bind-fn'; import TouchInput from './touch'; import MouseInput from './mouse'; import { INPUT_START, INPUT_END, INPUT_CANCEL, INPUT_TYPE_TOUCH, INPUT_TYPE_MOUSE } from '../inputjs/input-consts'; /** * @private * Combined touch and mouse input * * Touch has a higher priority then mouse, and while touching no mouse events are allowed. * This because touch devices also emit mouse events while doing a touch. * * @constructor * @extends Input */ const DEDUP_TIMEOUT = 2500; const DEDUP_DISTANCE = 25; export default class TouchMouseInput extends Input { constructor() { super(...arguments); let handler = bindFn(this.handler, this); this.touch = new TouchInput(this.manager, handler); this.mouse = new MouseInput(this.manager, handler); this.primaryTouch = null; this.lastTouches = []; } /** * @private * handle mouse and touch events * @param {Hammer} manager * @param {String} inputEvent * @param {Object} inputData */ handler(manager, inputEvent, inputData) { let isTouch = (inputData.pointerType === INPUT_TYPE_TOUCH); let isMouse = (inputData.pointerType === INPUT_TYPE_MOUSE); if (isMouse && inputData.sourceCapabilities && inputData.sourceCapabilities.firesTouchEvents) { return; } // when we're in a touch event, record touches to de-dupe synthetic mouse event if (isTouch) { recordTouches.call(this, inputEvent, inputData); } else if (isMouse && isSyntheticEvent.call(this, inputData)) { return; } this.callback(manager, inputEvent, inputData); } /** * @private * remove the event listeners */ destroy() { this.touch.destroy(); this.mouse.destroy(); } } function recordTouches(eventType, eventData) { if (eventType & INPUT_START) { this.primaryTouch = eventData.changedPointers[0].identifier; setLastTouch.call(this, eventData); } else if (eventType & (INPUT_END | INPUT_CANCEL)) { setLastTouch.call(this, eventData); } } function setLastTouch(eventData) { let { changedPointers:[touch] } = eventData; if (touch.identifier === this.primaryTouch) { let lastTouch = { x: touch.clientX, y: touch.clientY }; this.lastTouches.push(lastTouch); let lts = this.lastTouches; let removeLastTouch = function() { let i = lts.indexOf(lastTouch); if (i > -1) { lts.splice(i, 1); } }; setTimeout(removeLastTouch, DEDUP_TIMEOUT); } } function isSyntheticEvent(eventData) { let x = eventData.srcEvent.clientX; let y = eventData.srcEvent.clientY; for (let i = 0; i < this.lastTouches.length; i++) { let t = this.lastTouches[i]; let dx = Math.abs(x - t.x); let dy = Math.abs(y - t.y); if (dx <= DEDUP_DISTANCE && dy <= DEDUP_DISTANCE) { return true; } } return false; } ================================================ FILE: src/inputjs/compute-delta-xy.js ================================================ import { INPUT_START, INPUT_END } from './input-consts'; export default function computeDeltaXY(session, input) { let { center } = input; // let { offsetDelta:offset = {}, prevDelta = {}, prevInput = {} } = session; // jscs throwing error on defalut destructured values and without defaults tests fail let offset = session.offsetDelta || {}; let prevDelta = session.prevDelta || {}; let prevInput = session.prevInput || {}; if (input.eventType === INPUT_START || prevInput.eventType === INPUT_END) { prevDelta = session.prevDelta = { x: prevInput.deltaX || 0, y: prevInput.deltaY || 0 }; offset = session.offsetDelta = { x: center.x, y: center.y }; } input.deltaX = prevDelta.x + (center.x - offset.x); input.deltaY = prevDelta.y + (center.y - offset.y); } ================================================ FILE: src/inputjs/compute-input-data.js ================================================ import { now } from '../utils/utils-consts'; import { abs } from '../utils/utils-consts'; import hasParent from '../utils/has-parent'; import simpleCloneInputData from './simple-clone-input-data'; import getCenter from './get-center'; import getDistance from './get-distance'; import getAngle from './get-angle'; import getDirection from './get-direction'; import computeDeltaXY from './compute-delta-xy'; import getVelocity from './get-velocity'; import getScale from './get-scale'; import getRotation from './get-rotation'; import computeIntervalInputData from './compute-interval-input-data'; /** * @private * extend the data with some usable properties like scale, rotate, velocity etc * @param {Object} manager * @param {Object} input */ export default function computeInputData(manager, input) { let { session } = manager; let { pointers } = input; let { length:pointersLength } = pointers; // store the first input to calculate the distance and direction if (!session.firstInput) { session.firstInput = simpleCloneInputData(input); } // to compute scale and rotation we need to store the multiple touches if (pointersLength > 1 && !session.firstMultiple) { session.firstMultiple = simpleCloneInputData(input); } else if (pointersLength === 1) { session.firstMultiple = false; } let { firstInput, firstMultiple } = session; let offsetCenter = firstMultiple ? firstMultiple.center : firstInput.center; let center = input.center = getCenter(pointers); input.timeStamp = now(); input.deltaTime = input.timeStamp - firstInput.timeStamp; input.angle = getAngle(offsetCenter, center); input.distance = getDistance(offsetCenter, center); computeDeltaXY(session, input); input.offsetDirection = getDirection(input.deltaX, input.deltaY); let overallVelocity = getVelocity(input.deltaTime, input.deltaX, input.deltaY); input.overallVelocityX = overallVelocity.x; input.overallVelocityY = overallVelocity.y; input.overallVelocity = (abs(overallVelocity.x) > abs(overallVelocity.y)) ? overallVelocity.x : overallVelocity.y; input.scale = firstMultiple ? getScale(firstMultiple.pointers, pointers) : 1; input.rotation = firstMultiple ? getRotation(firstMultiple.pointers, pointers) : 0; input.maxPointers = !session.prevInput ? input.pointers.length : ((input.pointers.length > session.prevInput.maxPointers) ? input.pointers.length : session.prevInput.maxPointers); computeIntervalInputData(session, input); // find the correct target let target = manager.element; if (hasParent(input.srcEvent.target, target)) { target = input.srcEvent.target; } input.target = target; } ================================================ FILE: src/inputjs/compute-interval-input-data.js ================================================ import { INPUT_CANCEL,COMPUTE_INTERVAL } from './input-consts'; import { abs } from '../utils/utils-consts'; import getVelocity from './get-velocity'; import getDirection from './get-direction'; /** * @private * velocity is calculated every x ms * @param {Object} session * @param {Object} input */ export default function computeIntervalInputData(session, input) { let last = session.lastInterval || input; let deltaTime = input.timeStamp - last.timeStamp; let velocity; let velocityX; let velocityY; let direction; if (input.eventType !== INPUT_CANCEL && (deltaTime > COMPUTE_INTERVAL || last.velocity === undefined)) { let deltaX = input.deltaX - last.deltaX; let deltaY = input.deltaY - last.deltaY; let v = getVelocity(deltaTime, deltaX, deltaY); velocityX = v.x; velocityY = v.y; velocity = (abs(v.x) > abs(v.y)) ? v.x : v.y; direction = getDirection(deltaX, deltaY); session.lastInterval = input; } else { // use latest velocity info if it doesn't overtake a minimum period velocity = last.velocity; velocityX = last.velocityX; velocityY = last.velocityY; direction = last.direction; } input.velocity = velocity; input.velocityX = velocityX; input.velocityY = velocityY; input.direction = direction; } ================================================ FILE: src/inputjs/create-input-instance.js ================================================ import { SUPPORT_POINTER_EVENTS,SUPPORT_ONLY_TOUCH,SUPPORT_TOUCH } from './input-consts'; import inputHandler from './input-handler'; import PointerEventInput from '../input/pointerevent'; import TouchInput from '../input/touch'; import MouseInput from '../input/mouse'; import TouchMouseInput from '../input/touchmouse'; /** * @private * create new input type manager * called by the Manager constructor * @param {Hammer} manager * @returns {Input} */ export default function createInputInstance(manager) { let Type; // let inputClass = manager.options.inputClass; let { options:{ inputClass } } = manager; if (inputClass) { Type = inputClass; } else if (SUPPORT_POINTER_EVENTS) { Type = PointerEventInput; } else if (SUPPORT_ONLY_TOUCH) { Type = TouchInput; } else if (!SUPPORT_TOUCH) { Type = MouseInput; } else { Type = TouchMouseInput; } return new (Type)(manager, inputHandler); } ================================================ FILE: src/inputjs/get-angle.js ================================================ import { PROPS_XY } from './input-consts'; /** * @private * calculate the angle between two coordinates * @param {Object} p1 * @param {Object} p2 * @param {Array} [props] containing x and y keys * @return {Number} angle */ export default function getAngle(p1, p2, props) { if (!props) { props = PROPS_XY; } let x = p2[props[0]] - p1[props[0]]; let y = p2[props[1]] - p1[props[1]]; return Math.atan2(y, x) * 180 / Math.PI; } ================================================ FILE: src/inputjs/get-center.js ================================================ import { round } from '../utils/utils-consts'; /** * @private * get the center of all the pointers * @param {Array} pointers * @return {Object} center contains `x` and `y` properties */ export default function getCenter(pointers) { let pointersLength = pointers.length; // no need to loop when only one touch if (pointersLength === 1) { return { x: round(pointers[0].clientX), y: round(pointers[0].clientY) }; } let x = 0; let y = 0; let i = 0; while (i < pointersLength) { x += pointers[i].clientX; y += pointers[i].clientY; i++; } return { x: round(x / pointersLength), y: round(y / pointersLength) }; } ================================================ FILE: src/inputjs/get-direction.js ================================================ import { abs } from '../utils/utils-consts'; import { DIRECTION_NONE,DIRECTION_LEFT,DIRECTION_RIGHT,DIRECTION_UP,DIRECTION_DOWN } from './input-consts'; /** * @private * get the direction between two points * @param {Number} x * @param {Number} y * @return {Number} direction */ export default function getDirection(x, y) { if (x === y) { return DIRECTION_NONE; } if (abs(x) >= abs(y)) { return x < 0 ? DIRECTION_LEFT : DIRECTION_RIGHT; } return y < 0 ? DIRECTION_UP : DIRECTION_DOWN; } ================================================ FILE: src/inputjs/get-distance.js ================================================ import { PROPS_XY } from './input-consts'; /** * @private * calculate the absolute distance between two points * @param {Object} p1 {x, y} * @param {Object} p2 {x, y} * @param {Array} [props] containing x and y keys * @return {Number} distance */ export default function getDistance(p1, p2, props) { if (!props) { props = PROPS_XY; } let x = p2[props[0]] - p1[props[0]]; let y = p2[props[1]] - p1[props[1]]; return Math.sqrt((x * x) + (y * y)); } ================================================ FILE: src/inputjs/get-rotation.js ================================================ import getAngle from './get-angle'; import { PROPS_CLIENT_XY } from './input-consts'; /** * @private * calculate the rotation degrees between two pointersets * @param {Array} start array of pointers * @param {Array} end array of pointers * @return {Number} rotation */ export default function getRotation(start, end) { return getAngle(end[1], end[0], PROPS_CLIENT_XY) + getAngle(start[1], start[0], PROPS_CLIENT_XY); } ================================================ FILE: src/inputjs/get-scale.js ================================================ import { PROPS_CLIENT_XY } from './input-consts'; import getDistance from './get-distance'; /** * @private * calculate the scale factor between two pointersets * no scale is 1, and goes down to 0 when pinched together, and bigger when pinched out * @param {Array} start array of pointers * @param {Array} end array of pointers * @return {Number} scale */ export default function getScale(start, end) { return getDistance(end[0], end[1], PROPS_CLIENT_XY) / getDistance(start[0], start[1], PROPS_CLIENT_XY); } ================================================ FILE: src/inputjs/get-velocity.js ================================================ /** * @private * calculate the velocity between two points. unit is in px per ms. * @param {Number} deltaTime * @param {Number} x * @param {Number} y * @return {Object} velocity `x` and `y` */ export default function getVelocity(deltaTime, x, y) { return { x: x / deltaTime || 0, y: y / deltaTime || 0 }; } ================================================ FILE: src/inputjs/input-constructor.js ================================================ import boolOrFn from '../utils/bool-or-fn'; import addEventListeners from '../utils/add-event-listeners'; import removeEventListeners from '../utils/remove-event-listeners'; import getWindowForElement from '../utils/get-window-for-element'; /** * @private * create new input type manager * @param {Manager} manager * @param {Function} callback * @returns {Input} * @constructor */ export default class Input { constructor(manager, callback) { let self = this; this.manager = manager; this.callback = callback; this.element = manager.element; this.target = manager.options.inputTarget; // smaller wrapper around the handler, for the scope and the enabled state of the manager, // so when disabled the input events are completely bypassed. this.domHandler = function(ev) { if (boolOrFn(manager.options.enable, [manager])) { self.handler(ev); } }; this.init(); } /** * @private * should handle the inputEvent data and trigger the callback * @virtual */ handler() { } /** * @private * bind the events */ init() { this.evEl && addEventListeners(this.element, this.evEl, this.domHandler); this.evTarget && addEventListeners(this.target, this.evTarget, this.domHandler); this.evWin && addEventListeners(getWindowForElement(this.element), this.evWin, this.domHandler); } /** * @private * unbind the events */ destroy() { this.evEl && removeEventListeners(this.element, this.evEl, this.domHandler); this.evTarget && removeEventListeners(this.target, this.evTarget, this.domHandler); this.evWin && removeEventListeners(getWindowForElement(this.element), this.evWin, this.domHandler); } } ================================================ FILE: src/inputjs/input-consts.js ================================================ import prefixed from '../utils/prefixed'; const MOBILE_REGEX = /mobile|tablet|ip(ad|hone|od)|android/i; const SUPPORT_TOUCH = ('ontouchstart' in window); const SUPPORT_POINTER_EVENTS = prefixed(window, 'PointerEvent') !== undefined; const SUPPORT_ONLY_TOUCH = SUPPORT_TOUCH && MOBILE_REGEX.test(navigator.userAgent); const INPUT_TYPE_TOUCH = 'touch'; const INPUT_TYPE_PEN = 'pen'; const INPUT_TYPE_MOUSE = 'mouse'; const INPUT_TYPE_KINECT = 'kinect'; const COMPUTE_INTERVAL = 25; const INPUT_START = 1; const INPUT_MOVE = 2; const INPUT_END = 4; const INPUT_CANCEL = 8; const DIRECTION_NONE = 1; const DIRECTION_LEFT = 2; const DIRECTION_RIGHT = 4; const DIRECTION_UP = 8; const DIRECTION_DOWN = 16; const DIRECTION_HORIZONTAL = DIRECTION_LEFT | DIRECTION_RIGHT; const DIRECTION_VERTICAL = DIRECTION_UP | DIRECTION_DOWN; const DIRECTION_ALL = DIRECTION_HORIZONTAL | DIRECTION_VERTICAL; const PROPS_XY = ['x', 'y']; const PROPS_CLIENT_XY = ['clientX', 'clientY']; export { MOBILE_REGEX, SUPPORT_ONLY_TOUCH, SUPPORT_POINTER_EVENTS, SUPPORT_TOUCH, INPUT_TYPE_KINECT, INPUT_TYPE_MOUSE, INPUT_TYPE_PEN, INPUT_TYPE_TOUCH, COMPUTE_INTERVAL, INPUT_START, INPUT_MOVE, INPUT_END, INPUT_CANCEL, DIRECTION_NONE, DIRECTION_LEFT, DIRECTION_RIGHT, DIRECTION_UP, DIRECTION_DOWN, DIRECTION_HORIZONTAL, DIRECTION_VERTICAL, DIRECTION_ALL, PROPS_XY, PROPS_CLIENT_XY }; ================================================ FILE: src/inputjs/input-handler.js ================================================ import { INPUT_START,INPUT_END,INPUT_CANCEL } from './input-consts'; import computeInputData from './compute-input-data'; /** * @private * handle input events * @param {Manager} manager * @param {String} eventType * @param {Object} input */ export default function inputHandler(manager, eventType, input) { let pointersLen = input.pointers.length; let changedPointersLen = input.changedPointers.length; let isFirst = (eventType & INPUT_START && (pointersLen - changedPointersLen === 0)); let isFinal = (eventType & (INPUT_END | INPUT_CANCEL) && (pointersLen - changedPointersLen === 0)); input.isFirst = !!isFirst; input.isFinal = !!isFinal; if (isFirst) { manager.session = {}; } // source event is the normalized value of the domEvents // like 'touchstart, mouseup, pointerdown' input.eventType = eventType; // compute scale, rotation etc computeInputData(manager, input); // emit secret event manager.emit('hammer.input', input); manager.recognize(input); manager.session.prevInput = input; } ================================================ FILE: src/inputjs/simple-clone-input-data.js ================================================ import { now,round } from '../utils/utils-consts'; import getCenter from './get-center'; /** * @private * create a simple clone from the input used for storage of firstInput and firstMultiple * @param {Object} input * @returns {Object} clonedInputData */ export default function simpleCloneInputData(input) { // make a simple copy of the pointers because we will get a reference if we don't // we only need clientXY for the calculations let pointers = []; let i = 0; while (i < input.pointers.length) { pointers[i] = { clientX: round(input.pointers[i].clientX), clientY: round(input.pointers[i].clientY) }; i++; } return { timeStamp: now(), pointers, center: getCenter(pointers), deltaX: input.deltaX, deltaY: input.deltaY }; } ================================================ FILE: src/main.js ================================================ import Hammer from './hammer'; import assign from './utils/assign'; import { INPUT_START, INPUT_MOVE, INPUT_END, INPUT_CANCEL } from './inputjs/input-consts'; import { STATE_POSSIBLE, STATE_BEGAN, STATE_CHANGED, STATE_ENDED, STATE_RECOGNIZED, STATE_CANCELLED, STATE_FAILED } from './recognizerjs/recognizer-consts'; import { DIRECTION_NONE, DIRECTION_LEFT, DIRECTION_RIGHT, DIRECTION_UP, DIRECTION_DOWN, DIRECTION_HORIZONTAL, DIRECTION_VERTICAL, DIRECTION_ALL } from './inputjs/input-consts'; import Manager from './manager'; import Input from './inputjs/input-constructor'; import TouchAction from './touchactionjs/touchaction-constructor'; import TouchInput from './input/touch'; import MouseInput from './input/mouse'; import PointerEventInput from './input/pointerevent'; import SingleTouchInput from './input/singletouch'; import TouchMouseInput from './input/touchmouse'; import Recognizer from './recognizerjs/recognizer-constructor'; import AttrRecognizer from './recognizers/attribute'; import TapRecognizer from './recognizers/tap'; import PanRecognizer from './recognizers/pan'; import SwipeRecognizer from './recognizers/swipe'; import PinchRecognizer from './recognizers/pinch'; import RotateRecognizer from './recognizers/rotate'; import PressRecognizer from './recognizers/press'; import addEventListeners from './utils/add-event-listeners'; import removeEventListeners from './utils/remove-event-listeners'; import each from './utils/each'; import merge from './utils/merge'; import extend from './utils/extend'; import inherit from './utils/inherit'; import bindFn from './utils/bind-fn'; import prefixed from './utils/prefixed'; import toArray from'./utils/to-array'; import uniqueArray from'./utils/unique-array'; import splitStr from'./utils/split-str'; import inArray from'./utils/in-array'; import boolOrFn from'./utils/bool-or-fn'; import hasParent from'./utils/has-parent'; // this prevents errors when Hammer is loaded in the presence of an AMD // style loader but by script tag, not by the loader. assign(Hammer, { INPUT_START, INPUT_MOVE, INPUT_END, INPUT_CANCEL, STATE_POSSIBLE, STATE_BEGAN, STATE_CHANGED, STATE_ENDED, STATE_RECOGNIZED, STATE_CANCELLED, STATE_FAILED, DIRECTION_NONE, DIRECTION_LEFT, DIRECTION_RIGHT, DIRECTION_UP, DIRECTION_DOWN, DIRECTION_HORIZONTAL, DIRECTION_VERTICAL, DIRECTION_ALL, Manager, Input, TouchAction, TouchInput, MouseInput, PointerEventInput, TouchMouseInput, SingleTouchInput, Recognizer, AttrRecognizer, Tap: TapRecognizer, Pan: PanRecognizer, Swipe: SwipeRecognizer, Pinch: PinchRecognizer, Rotate: RotateRecognizer, Press: PressRecognizer, on: addEventListeners, off: removeEventListeners, each, merge, extend, assign, inherit, bindFn, prefixed, toArray, inArray, uniqueArray, splitStr, boolOrFn, hasParent, addEventListeners, removeEventListeners }); let freeGlobal = (typeof window !== 'undefined' ? window : (typeof self !== 'undefined' ? self : {})); // jshint ignore:line freeGlobal.Hammer = Hammer; /* jshint ignore:start */ if (typeof define === 'function' && define.amd) { define(() => { return Hammer; }); } else if (typeof module !== 'undefined' && module.exports) { module.exports = Hammer; } else { window[exportName] = Hammer; } /* jshint ignore:end */ ================================================ FILE: src/manager.js ================================================ import assign from './utils/assign'; import Hammer from './hammer'; import TouchAction from './touchactionjs/touchaction-constructor'; import createInputInstance from './inputjs/create-input-instance'; import each from './utils/each'; import inArray from './utils/in-array'; import invokeArrayArg from './utils/invoke-array-arg'; import splitStr from './utils/split-str'; import prefixed from './utils/prefixed'; import Recognizer from './recognizerjs/recognizer-constructor'; import { STATE_BEGAN, STATE_ENDED, STATE_CHANGED, STATE_RECOGNIZED } from './recognizerjs/recognizer-consts'; const STOP = 1; const FORCED_STOP = 2; /** * @private * Manager * @param {HTMLElement} element * @param {Object} [options] * @constructor */ export default class Manager { constructor(element, options) { this.options = assign({}, Hammer.defaults, options || {}); this.options.inputTarget = this.options.inputTarget || element; this.handlers = {}; this.session = {}; this.recognizers = []; this.oldCssProps = {}; this.element = element; this.input = createInputInstance(this); this.touchAction = new TouchAction(this, this.options.touchAction); toggleCssProps(this, true); each(this.options.recognizers, (item) => { let recognizer = this.add(new (item[0])(item[1])); item[2] && recognizer.recognizeWith(item[2]); item[3] && recognizer.requireFailure(item[3]); }, this); } /** * @private * set options * @param {Object} options * @returns {Manager} */ set(options) { assign(this.options, options); // Options that need a little more setup if (options.touchAction) { this.touchAction.update(); } if (options.inputTarget) { // Clean up existing event listeners and reinitialize this.input.destroy(); this.input.target = options.inputTarget; this.input.init(); } return this; } /** * @private * stop recognizing for this session. * This session will be discarded, when a new [input]start event is fired. * When forced, the recognizer cycle is stopped immediately. * @param {Boolean} [force] */ stop(force) { this.session.stopped = force ? FORCED_STOP : STOP; } /** * @private * run the recognizers! * called by the inputHandler function on every movement of the pointers (touches) * it walks through all the recognizers and tries to detect the gesture that is being made * @param {Object} inputData */ recognize(inputData) { let { session } = this; if (session.stopped) { return; } // run the touch-action polyfill this.touchAction.preventDefaults(inputData); let recognizer; let { recognizers } = this; // this holds the recognizer that is being recognized. // so the recognizer's state needs to be BEGAN, CHANGED, ENDED or RECOGNIZED // if no recognizer is detecting a thing, it is set to `null` let { curRecognizer } = session; // reset when the last recognizer is recognized // or when we're in a new session if (!curRecognizer || (curRecognizer && curRecognizer.state & STATE_RECOGNIZED)) { curRecognizer = session.curRecognizer = null; } let i = 0; while (i < recognizers.length) { recognizer = recognizers[i]; // find out if we are allowed try to recognize the input for this one. // 1. allow if the session is NOT forced stopped (see the .stop() method) // 2. allow if we still haven't recognized a gesture in this session, or the this recognizer is the one // that is being recognized. // 3. allow if the recognizer is allowed to run simultaneous with the current recognized recognizer. // this can be setup with the `recognizeWith()` method on the recognizer. if (session.stopped !== FORCED_STOP && (// 1 !curRecognizer || recognizer === curRecognizer || // 2 recognizer.canRecognizeWith(curRecognizer))) { // 3 recognizer.recognize(inputData); } else { recognizer.reset(); } // if the recognizer has been recognizing the input as a valid gesture, we want to store this one as the // current active recognizer. but only if we don't already have an active recognizer if (!curRecognizer && recognizer.state & (STATE_BEGAN | STATE_CHANGED | STATE_ENDED)) { curRecognizer = session.curRecognizer = recognizer; } i++; } } /** * @private * get a recognizer by its event name. * @param {Recognizer|String} recognizer * @returns {Recognizer|Null} */ get(recognizer) { if (recognizer instanceof Recognizer) { return recognizer; } let { recognizers } = this; for (let i = 0; i < recognizers.length; i++) { if (recognizers[i].options.event === recognizer) { return recognizers[i]; } } return null; } /** * @private add a recognizer to the manager * existing recognizers with the same event name will be removed * @param {Recognizer} recognizer * @returns {Recognizer|Manager} */ add(recognizer) { if (invokeArrayArg(recognizer, 'add', this)) { return this; } // remove existing let existing = this.get(recognizer.options.event); if (existing) { this.remove(existing); } this.recognizers.push(recognizer); recognizer.manager = this; this.touchAction.update(); return recognizer; } /** * @private * remove a recognizer by name or instance * @param {Recognizer|String} recognizer * @returns {Manager} */ remove(recognizer) { if (invokeArrayArg(recognizer, 'remove', this)) { return this; } recognizer = this.get(recognizer); // let's make sure this recognizer exists if (recognizer) { let { recognizers } = this; let index = inArray(recognizers, recognizer); if (index !== -1) { recognizers.splice(index, 1); this.touchAction.update(); } } return this; } /** * @private * bind event * @param {String} events * @param {Function} handler * @returns {EventEmitter} this */ on(events, handler) { if (events === undefined) { return; } if (handler === undefined) { return; } let { handlers } = this; each(splitStr(events), (event) => { handlers[event] = handlers[event] || []; handlers[event].push(handler); }); return this; } /** * @private unbind event, leave emit blank to remove all handlers * @param {String} events * @param {Function} [handler] * @returns {EventEmitter} this */ off(events, handler) { if (events === undefined) { return; } let { handlers } = this; each(splitStr(events), (event) => { if (!handler) { delete handlers[event]; } else { handlers[event] && handlers[event].splice(inArray(handlers[event], handler), 1); } }); return this; } /** * @private emit event to the listeners * @param {String} event * @param {Object} data */ emit(event, data) { // we also want to trigger dom events if (this.options.domEvents) { triggerDomEvent(event, data); } // no handlers, so skip it all let handlers = this.handlers[event] && this.handlers[event].slice(); if (!handlers || !handlers.length) { return; } data.type = event; data.preventDefault = function() { data.srcEvent.preventDefault(); }; let i = 0; while (i < handlers.length) { handlers[i](data); i++; } } /** * @private * destroy the manager and unbinds all events * it doesn't unbind dom events, that is the user own responsibility */ destroy() { this.element && toggleCssProps(this, false); this.handlers = {}; this.session = {}; this.input.destroy(); this.element = null; } } /** * @private * add/remove the css properties as defined in manager.options.cssProps * @param {Manager} manager * @param {Boolean} add */ function toggleCssProps(manager, add) { let { element } = manager; if (!element.style) { return; } let prop; each(manager.options.cssProps, (value, name) => { prop = prefixed(element.style, name); if (add) { manager.oldCssProps[prop] = element.style[prop]; element.style[prop] = value; } else { element.style[prop] = manager.oldCssProps[prop] || ''; } }); if (!add) { manager.oldCssProps = {}; } } /** * @private * trigger dom event * @param {String} event * @param {Object} data */ function triggerDomEvent(event, data) { let gestureEvent = document.createEvent('Event'); gestureEvent.initEvent(event, true, true); gestureEvent.gesture = data; data.target.dispatchEvent(gestureEvent); } ================================================ FILE: src/recognizerjs/direction-str.js ================================================ import { DIRECTION_LEFT, DIRECTION_RIGHT, DIRECTION_UP, DIRECTION_DOWN } from '../inputjs/input-consts'; /** * @private * direction cons to string * @param {constant} direction * @returns {String} */ export default function directionStr(direction) { if (direction === DIRECTION_DOWN) { return 'down'; } else if (direction === DIRECTION_UP) { return 'up'; } else if (direction === DIRECTION_LEFT) { return 'left'; } else if (direction === DIRECTION_RIGHT) { return 'right'; } return ''; } ================================================ FILE: src/recognizerjs/get-recognizer-by-name-if-manager.js ================================================ /** * @private * get a recognizer by name if it is bound to a manager * @param {Recognizer|String} otherRecognizer * @param {Recognizer} recognizer * @returns {Recognizer} */ export default function getRecognizerByNameIfManager(otherRecognizer, recognizer) { let { manager } = recognizer; if (manager) { return manager.get(otherRecognizer); } return otherRecognizer; } ================================================ FILE: src/recognizerjs/recognizer-constructor.js ================================================ import { STATE_POSSIBLE, STATE_ENDED, STATE_FAILED, STATE_RECOGNIZED, STATE_CANCELLED, STATE_BEGAN, STATE_CHANGED } from './recognizer-consts'; import assign from '../utils/assign'; import uniqueId from '../utils/unique-id'; import ifUndefined from '../utils/if-undefined'; import invokeArrayArg from '../utils/invoke-array-arg'; import inArray from '../utils/in-array'; import boolOrFn from '../utils/bool-or-fn'; import getRecognizerByNameIfManager from './get-recognizer-by-name-if-manager'; import stateStr from './state-str'; /** * @private * Recognizer flow explained; * * All recognizers have the initial state of POSSIBLE when a input session starts. * The definition of a input session is from the first input until the last input, with all it's movement in it. * * Example session for mouse-input: mousedown -> mousemove -> mouseup * * On each recognizing cycle (see Manager.recognize) the .recognize() method is executed * which determines with state it should be. * * If the recognizer has the state FAILED, CANCELLED or RECOGNIZED (equals ENDED), it is reset to * POSSIBLE to give it another change on the next cycle. * * Possible * | * +-----+---------------+ * | | * +-----+-----+ | * | | | * Failed Cancelled | * +-------+------+ * | | * Recognized Began * | * Changed * | * Ended/Recognized */ /** * @private * Recognizer * Every recognizer needs to extend from this class. * @constructor * @param {Object} options */ export default class Recognizer { constructor(options) { this.options = assign({}, this.defaults, options || {}); this.id = uniqueId(); this.manager = null; // default is enable true this.options.enable = ifUndefined(this.options.enable, true); this.state = STATE_POSSIBLE; this.simultaneous = {}; this.requireFail = []; } /** * @private * set options * @param {Object} options * @return {Recognizer} */ set(options) { assign(this.options, options); // also update the touchAction, in case something changed about the directions/enabled state this.manager && this.manager.touchAction.update(); return this; } /** * @private * recognize simultaneous with an other recognizer. * @param {Recognizer} otherRecognizer * @returns {Recognizer} this */ recognizeWith(otherRecognizer) { if (invokeArrayArg(otherRecognizer, 'recognizeWith', this)) { return this; } let { simultaneous } = this; otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); if (!simultaneous[otherRecognizer.id]) { simultaneous[otherRecognizer.id] = otherRecognizer; otherRecognizer.recognizeWith(this); } return this; } /** * @private * drop the simultaneous link. it doesnt remove the link on the other recognizer. * @param {Recognizer} otherRecognizer * @returns {Recognizer} this */ dropRecognizeWith(otherRecognizer) { if (invokeArrayArg(otherRecognizer, 'dropRecognizeWith', this)) { return this; } otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); delete this.simultaneous[otherRecognizer.id]; return this; } /** * @private * recognizer can only run when an other is failing * @param {Recognizer} otherRecognizer * @returns {Recognizer} this */ requireFailure(otherRecognizer) { if (invokeArrayArg(otherRecognizer, 'requireFailure', this)) { return this; } let { requireFail } = this; otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); if (inArray(requireFail, otherRecognizer) === -1) { requireFail.push(otherRecognizer); otherRecognizer.requireFailure(this); } return this; } /** * @private * drop the requireFailure link. it does not remove the link on the other recognizer. * @param {Recognizer} otherRecognizer * @returns {Recognizer} this */ dropRequireFailure(otherRecognizer) { if (invokeArrayArg(otherRecognizer, 'dropRequireFailure', this)) { return this; } otherRecognizer = getRecognizerByNameIfManager(otherRecognizer, this); let index = inArray(this.requireFail, otherRecognizer); if (index > -1) { this.requireFail.splice(index, 1); } return this; } /** * @private * has require failures boolean * @returns {boolean} */ hasRequireFailures() { return this.requireFail.length > 0; } /** * @private * if the recognizer can recognize simultaneous with an other recognizer * @param {Recognizer} otherRecognizer * @returns {Boolean} */ canRecognizeWith(otherRecognizer) { return !!this.simultaneous[otherRecognizer.id]; } /** * @private * You should use `tryEmit` instead of `emit` directly to check * that all the needed recognizers has failed before emitting. * @param {Object} input */ emit(input) { let self = this; let { state } = this; function emit(event) { self.manager.emit(event, input); } // 'panstart' and 'panmove' if (state < STATE_ENDED) { emit(self.options.event + stateStr(state)); } emit(self.options.event); // simple 'eventName' events if (input.additionalEvent) { // additional event(panleft, panright, pinchin, pinchout...) emit(input.additionalEvent); } // panend and pancancel if (state >= STATE_ENDED) { emit(self.options.event + stateStr(state)); } } /** * @private * Check that all the require failure recognizers has failed, * if true, it emits a gesture event, * otherwise, setup the state to FAILED. * @param {Object} input */ tryEmit(input) { if (this.canEmit()) { return this.emit(input); } // it's failing anyway this.state = STATE_FAILED; } /** * @private * can we emit? * @returns {boolean} */ canEmit() { let i = 0; while (i < this.requireFail.length) { if (!(this.requireFail[i].state & (STATE_FAILED | STATE_POSSIBLE))) { return false; } i++; } return true; } /** * @private * update the recognizer * @param {Object} inputData */ recognize(inputData) { // make a new copy of the inputData // so we can change the inputData without messing up the other recognizers let inputDataClone = assign({}, inputData); // is is enabled and allow recognizing? if (!boolOrFn(this.options.enable, [this, inputDataClone])) { this.reset(); this.state = STATE_FAILED; return; } // reset when we've reached the end if (this.state & (STATE_RECOGNIZED | STATE_CANCELLED | STATE_FAILED)) { this.state = STATE_POSSIBLE; } this.state = this.process(inputDataClone); // the recognizer has recognized a gesture // so trigger an event if (this.state & (STATE_BEGAN | STATE_CHANGED | STATE_ENDED | STATE_CANCELLED)) { this.tryEmit(inputDataClone); } } /** * @private * return the state of the recognizer * the actual recognizing happens in this method * @virtual * @param {Object} inputData * @returns {constant} STATE */ /* jshint ignore:start */ process(inputData) { } /* jshint ignore:end */ /** * @private * return the preferred touch-action * @virtual * @returns {Array} */ getTouchAction() { } /** * @private * called when the gesture isn't allowed to recognize * like when another is being recognized or it is disabled * @virtual */ reset() { } } Recognizer.prototype.defaults = {}; ================================================ FILE: src/recognizerjs/recognizer-consts.js ================================================ const STATE_POSSIBLE = 1; const STATE_BEGAN = 2; const STATE_CHANGED = 4; const STATE_ENDED = 8; const STATE_RECOGNIZED = STATE_ENDED; const STATE_CANCELLED = 16; const STATE_FAILED = 32; export { STATE_POSSIBLE, STATE_BEGAN, STATE_CHANGED, STATE_ENDED, STATE_RECOGNIZED, STATE_CANCELLED, STATE_FAILED }; ================================================ FILE: src/recognizerjs/state-str.js ================================================ import { STATE_CANCELLED, STATE_ENDED, STATE_CHANGED, STATE_BEGAN } from './recognizer-consts'; /** * @private * get a usable string, used as event postfix * @param {constant} state * @returns {String} state */ export default function stateStr(state) { if (state & STATE_CANCELLED) { return 'cancel'; } else if (state & STATE_ENDED) { return 'end'; } else if (state & STATE_CHANGED) { return 'move'; } else if (state & STATE_BEGAN) { return 'start'; } return ''; } ================================================ FILE: src/recognizers/attribute.js ================================================ import Recognizer from '../recognizerjs/recognizer-constructor'; import { STATE_BEGAN, STATE_CHANGED, STATE_CANCELLED, STATE_ENDED, STATE_FAILED } from '../recognizerjs/recognizer-consts'; import { INPUT_CANCEL, INPUT_END } from '../inputjs/input-consts'; /** * @private * This recognizer is just used as a base for the simple attribute recognizers. * @constructor * @extends Recognizer */ export default class AttrRecognizer extends Recognizer { constructor() { super(...arguments); } /** * @private * Used to check if it the recognizer receives valid input, like input.distance > 10. * @memberof AttrRecognizer * @param {Object} input * @returns {Boolean} recognized */ attrTest(input) { let optionPointers = this.options.pointers; return optionPointers === 0 || input.pointers.length === optionPointers; } /** * @private * Process the input and return the state for the recognizer * @memberof AttrRecognizer * @param {Object} input * @returns {*} State */ process(input) { let { state } = this; let { eventType } = input; let isRecognized = state & (STATE_BEGAN | STATE_CHANGED); let isValid = this.attrTest(input); // on cancel input and we've recognized before, return STATE_CANCELLED if (isRecognized && (eventType & INPUT_CANCEL || !isValid)) { return state | STATE_CANCELLED; } else if (isRecognized || isValid) { if (eventType & INPUT_END) { return state | STATE_ENDED; } else if (!(state & STATE_BEGAN)) { return STATE_BEGAN; } return state | STATE_CHANGED; } return STATE_FAILED; } } AttrRecognizer.prototype.defaults = { /** * @private * @type {Number} * @default 1 */ pointers: 1 }; ================================================ FILE: src/recognizers/pan.js ================================================ import AttrRecognizer from './attribute'; import { DIRECTION_ALL, DIRECTION_HORIZONTAL, DIRECTION_VERTICAL, DIRECTION_NONE, DIRECTION_UP, DIRECTION_DOWN, DIRECTION_LEFT, DIRECTION_RIGHT } from '../inputjs/input-consts'; import { STATE_BEGAN } from '../recognizerjs/recognizer-consts'; import { TOUCH_ACTION_PAN_X,TOUCH_ACTION_PAN_Y } from '../touchactionjs/touchaction-Consts'; import directionStr from '../recognizerjs/direction-str'; /** * @private * Pan * Recognized when the pointer is down and moved in the allowed direction. * @constructor * @extends AttrRecognizer */ export default class PanRecognizer extends AttrRecognizer { constructor() { super(...arguments); this.pX = null; this.pY = null; } getTouchAction() { let { options:{ direction } } = this; let actions = []; if (direction & DIRECTION_HORIZONTAL) { actions.push(TOUCH_ACTION_PAN_Y); } if (direction & DIRECTION_VERTICAL) { actions.push(TOUCH_ACTION_PAN_X); } return actions; } directionTest(input) { let { options } = this; let hasMoved = true; let { distance } = input; let { direction } = input; let x = input.deltaX; let y = input.deltaY; // lock to axis? if (!(direction & options.direction)) { if (options.direction & DIRECTION_HORIZONTAL) { direction = (x === 0) ? DIRECTION_NONE : (x < 0) ? DIRECTION_LEFT : DIRECTION_RIGHT; hasMoved = x !== this.pX; distance = Math.abs(input.deltaX); } else { direction = (y === 0) ? DIRECTION_NONE : (y < 0) ? DIRECTION_UP : DIRECTION_DOWN; hasMoved = y !== this.pY; distance = Math.abs(input.deltaY); } } input.direction = direction; return hasMoved && distance > options.threshold && direction & options.direction; } attrTest(input) { return AttrRecognizer.prototype.attrTest.call(this, input) && // replace with a super call (this.state & STATE_BEGAN || (!(this.state & STATE_BEGAN) && this.directionTest(input))); } emit(input) { this.pX = input.deltaX; this.pY = input.deltaY; let direction = directionStr(input.direction); if (direction) { input.additionalEvent = this.options.event + direction; } super.emit(input); } } PanRecognizer.prototype.defaults = { event: 'pan', threshold: 10, pointers: 1, direction: DIRECTION_ALL }; ================================================ FILE: src/recognizers/pinch.js ================================================ import AttrRecognizer from './attribute'; import { TOUCH_ACTION_NONE } from '../touchactionjs/touchaction-Consts'; import { STATE_BEGAN } from '../recognizerjs/recognizer-consts'; /** * @private * Pinch * Recognized when two or more pointers are moving toward (zoom-in) or away from each other (zoom-out). * @constructor * @extends AttrRecognizer */ export default class PinchRecognizer extends AttrRecognizer { constructor() { super(...arguments); } getTouchAction() { return [TOUCH_ACTION_NONE]; } attrTest(input) { return super.attrTest(input) && (Math.abs(input.scale - 1) > this.options.threshold || this.state & STATE_BEGAN); } emit(input) { if (input.scale !== 1) { let inOut = input.scale < 1 ? 'in' : 'out'; input.additionalEvent = this.options.event + inOut; } super.emit(input); } } PinchRecognizer.prototype.defaults = { event: 'pinch', threshold: 0, pointers: 2 }; ================================================ FILE: src/recognizers/press.js ================================================ import Recognizer from '../recognizerjs/recognizer-constructor'; import { STATE_RECOGNIZED, STATE_FAILED } from '../recognizerjs/recognizer-consts'; import { now } from '../utils/utils-consts'; import setTimeoutContext from '../utils/set-timeout-context'; import { TOUCH_ACTION_AUTO } from '../touchactionjs/touchaction-Consts'; import { INPUT_START, INPUT_END, INPUT_CANCEL } from '../inputjs/input-consts'; /** * @private * Press * Recognized when the pointer is down for x ms without any movement. * @constructor * @extends Recognizer */ export default class PressRecognizer extends Recognizer { constructor() { super(...arguments); this._timer = null; this._input = null; } getTouchAction() { return [TOUCH_ACTION_AUTO]; } process(input) { let { options } = this; let validPointers = input.pointers.length === options.pointers; let validMovement = input.distance < options.threshold; let validTime = input.deltaTime > options.time; this._input = input; // we only allow little movement // and we've reached an end event, so a tap is possible if (!validMovement || !validPointers || (input.eventType & (INPUT_END | INPUT_CANCEL) && !validTime)) { this.reset(); } else if (input.eventType & INPUT_START) { this.reset(); this._timer = setTimeoutContext(() => { this.state = STATE_RECOGNIZED; this.tryEmit(); }, options.time, this); } else if (input.eventType & INPUT_END) { return STATE_RECOGNIZED; } return STATE_FAILED; } reset() { clearTimeout(this._timer); } emit(input) { if (this.state !== STATE_RECOGNIZED) { return; } if (input && (input.eventType & INPUT_END)) { this.manager.emit(`${this.options.event}up`, input); } else { this._input.timeStamp = now(); this.manager.emit(this.options.event, this._input); } } } PressRecognizer.prototype.defaults = { event: 'press', pointers: 1, time: 251, // minimal time of the pointer to be pressed threshold: 9 // a minimal movement is ok, but keep it low }; ================================================ FILE: src/recognizers/rotate.js ================================================ import AttrRecognizer from './attribute'; import { TOUCH_ACTION_NONE } from '../touchactionjs/touchaction-Consts'; import { STATE_BEGAN } from '../recognizerjs/recognizer-consts'; /** * @private * Rotate * Recognized when two or more pointer are moving in a circular motion. * @constructor * @extends AttrRecognizer */ export default class RotateRecognizer extends AttrRecognizer { constructor() { super(...arguments); } getTouchAction() { return [TOUCH_ACTION_NONE]; } attrTest(input) { return super.attrTest(input) && (Math.abs(input.rotation) > this.options.threshold || this.state & STATE_BEGAN); } } RotateRecognizer.prototype.defaults = { event: 'rotate', threshold: 0, pointers: 2 }; ================================================ FILE: src/recognizers/swipe.js ================================================ import AttrRecognizer from '../recognizers/attribute'; import { abs } from '../utils/utils-consts'; import { DIRECTION_HORIZONTAL,DIRECTION_VERTICAL } from '../inputjs/input-consts'; import PanRecognizer from './pan'; import { INPUT_END } from '../inputjs/input-consts'; import directionStr from '../recognizerjs/direction-str'; /** * @private * Swipe * Recognized when the pointer is moving fast (velocity), with enough distance in the allowed direction. * @constructor * @extends AttrRecognizer */ export default class SwipeRecognizer extends AttrRecognizer { constructor() { super(...arguments); } getTouchAction() { return PanRecognizer.prototype.getTouchAction.call(this); } attrTest(input) { let { direction } = this.options; let velocity; if (direction & (DIRECTION_HORIZONTAL | DIRECTION_VERTICAL)) { velocity = input.overallVelocity; } else if (direction & DIRECTION_HORIZONTAL) { velocity = input.overallVelocityX; } else if (direction & DIRECTION_VERTICAL) { velocity = input.overallVelocityY; } return super.attrTest(input) && direction & input.offsetDirection && input.distance > this.options.threshold && input.maxPointers === this.options.pointers && abs(velocity) > this.options.velocity && input.eventType & INPUT_END; } emit(input) { let direction = directionStr(input.offsetDirection); if (direction) { this.manager.emit(this.options.event + direction, input); } this.manager.emit(this.options.event, input); } } SwipeRecognizer.prototype.defaults = { event: 'swipe', threshold: 10, velocity: 0.3, direction: DIRECTION_HORIZONTAL | DIRECTION_VERTICAL, pointers: 1 }; ================================================ FILE: src/recognizers/tap.js ================================================ import setTimeoutContext from '../utils/set-timeout-context'; import Recognizer from '../recognizerjs/recognizer-constructor'; import { TOUCH_ACTION_MANIPULATION } from '../touchactionjs/touchaction-Consts'; import {INPUT_START,INPUT_END } from '../inputjs/input-consts'; import { STATE_RECOGNIZED, STATE_BEGAN, STATE_FAILED } from '../recognizerjs/recognizer-consts'; import getDistance from '../inputjs/get-distance'; /** * @private * A tap is recognized when the pointer is doing a small tap/click. Multiple taps are recognized if they occur * between the given interval and position. The delay option can be used to recognize multi-taps without firing * a single tap. * * The eventData from the emitted event contains the property `tapCount`, which contains the amount of * multi-taps being recognized. * @constructor * @extends Recognizer */ export default class TapRecognizer extends Recognizer { constructor() { super(...arguments); // previous time and center, // used for tap counting this.pTime = false; this.pCenter = false; this._timer = null; this._input = null; this.count = 0; } getTouchAction() { return [TOUCH_ACTION_MANIPULATION]; } process(input) { let { options } = this; let validPointers = input.pointers.length === options.pointers; let validMovement = input.distance < options.threshold; let validTouchTime = input.deltaTime < options.time; this.reset(); if ((input.eventType & INPUT_START) && (this.count === 0)) { return this.failTimeout(); } // we only allow little movement // and we've reached an end event, so a tap is possible if (validMovement && validTouchTime && validPointers) { if (input.eventType !== INPUT_END) { return this.failTimeout(); } let validInterval = this.pTime ? (input.timeStamp - this.pTime < options.interval) : true; let validMultiTap = !this.pCenter || getDistance(this.pCenter, input.center) < options.posThreshold; this.pTime = input.timeStamp; this.pCenter = input.center; if (!validMultiTap || !validInterval) { this.count = 1; } else { this.count += 1; } this._input = input; // if tap count matches we have recognized it, // else it has began recognizing... let tapCount = this.count % options.taps; if (tapCount === 0) { // no failing requirements, immediately trigger the tap event // or wait as long as the multitap interval to trigger if (!this.hasRequireFailures()) { return STATE_RECOGNIZED; } else { this._timer = setTimeoutContext(() => { this.state = STATE_RECOGNIZED; this.tryEmit(); }, options.interval, this); return STATE_BEGAN; } } } return STATE_FAILED; } failTimeout() { this._timer = setTimeoutContext(() => { this.state = STATE_FAILED; }, this.options.interval, this); return STATE_FAILED; } reset() { clearTimeout(this._timer); } emit() { if (this.state === STATE_RECOGNIZED) { this._input.tapCount = this.count; this.manager.emit(this.options.event, this._input); } } } TapRecognizer.prototype.defaults = { event: 'tap', pointers: 1, taps: 1, interval: 300, // max time between the multi-tap taps time: 250, // max time of the pointer to be down (like finger on the screen) threshold: 9, // a minimal movement is ok, but keep it low posThreshold: 10 // a multi-tap can be a bit off the initial position }; ================================================ FILE: src/touchactionjs/clean-touch-actions.js ================================================ import inStr from '../utils/in-str'; import { TOUCH_ACTION_NONE, TOUCH_ACTION_PAN_X, TOUCH_ACTION_PAN_Y, TOUCH_ACTION_MANIPULATION, TOUCH_ACTION_AUTO } from './touchaction-Consts'; /** * @private * when the touchActions are collected they are not a valid value, so we need to clean things up. * * @param {String} actions * @returns {*} */ export default function cleanTouchActions(actions) { // none if (inStr(actions, TOUCH_ACTION_NONE)) { return TOUCH_ACTION_NONE; } let hasPanX = inStr(actions, TOUCH_ACTION_PAN_X); let hasPanY = inStr(actions, TOUCH_ACTION_PAN_Y); // if both pan-x and pan-y are set (different recognizers // for different directions, e.g. horizontal pan but vertical swipe?) // we need none (as otherwise with pan-x pan-y combined none of these // recognizers will work, since the browser would handle all panning if (hasPanX && hasPanY) { return TOUCH_ACTION_NONE; } // pan-x OR pan-y if (hasPanX || hasPanY) { return hasPanX ? TOUCH_ACTION_PAN_X : TOUCH_ACTION_PAN_Y; } // manipulation if (inStr(actions, TOUCH_ACTION_MANIPULATION)) { return TOUCH_ACTION_MANIPULATION; } return TOUCH_ACTION_AUTO; } ================================================ FILE: src/touchactionjs/get-touchaction-props.js ================================================ import { NATIVE_TOUCH_ACTION } from './touchaction-Consts'; export default function getTouchActionProps() { if (!NATIVE_TOUCH_ACTION) { return false; } let touchMap = {}; let cssSupports = window.CSS && window.CSS.supports; ['auto', 'manipulation', 'pan-y', 'pan-x', 'pan-x pan-y', 'none'].forEach((val) => { // If css.supports is not supported but there is native touch-action assume it supports // all values. This is the case for IE 10 and 11. return touchMap[val] = cssSupports ? window.CSS.supports('touch-action', val) : true; }); return touchMap; } ================================================ FILE: src/touchactionjs/touchaction-Consts.js ================================================ import prefixed from '../utils/prefixed'; import { TEST_ELEMENT } from '../utils/utils-consts'; import getTouchActionProps from './get-touchaction-props'; const PREFIXED_TOUCH_ACTION = prefixed(TEST_ELEMENT.style, 'touchAction'); const NATIVE_TOUCH_ACTION = PREFIXED_TOUCH_ACTION !== undefined; // magical touchAction value const TOUCH_ACTION_COMPUTE = 'compute'; const TOUCH_ACTION_AUTO = 'auto'; const TOUCH_ACTION_MANIPULATION = 'manipulation'; // not implemented const TOUCH_ACTION_NONE = 'none'; const TOUCH_ACTION_PAN_X = 'pan-x'; const TOUCH_ACTION_PAN_Y = 'pan-y'; const TOUCH_ACTION_MAP = getTouchActionProps(); export { PREFIXED_TOUCH_ACTION, NATIVE_TOUCH_ACTION, TOUCH_ACTION_AUTO, TOUCH_ACTION_COMPUTE, TOUCH_ACTION_MANIPULATION, TOUCH_ACTION_NONE, TOUCH_ACTION_PAN_X, TOUCH_ACTION_PAN_Y, TOUCH_ACTION_MAP }; ================================================ FILE: src/touchactionjs/touchaction-constructor.js ================================================ import { TOUCH_ACTION_COMPUTE, TOUCH_ACTION_MAP, NATIVE_TOUCH_ACTION, PREFIXED_TOUCH_ACTION, TOUCH_ACTION_NONE, TOUCH_ACTION_PAN_X, TOUCH_ACTION_PAN_Y } from './touchaction-Consts'; import { DIRECTION_VERTICAL, DIRECTION_HORIZONTAL } from '../inputjs/input-consts'; import each from '../utils/each'; import boolOrFn from '../utils/bool-or-fn'; import inStr from '../utils/in-str'; import cleanTouchActions from './clean-touch-actions'; /** * @private * Touch Action * sets the touchAction property or uses the js alternative * @param {Manager} manager * @param {String} value * @constructor */ export default class TouchAction { constructor(manager, value) { this.manager = manager; this.set(value); } /** * @private * set the touchAction value on the element or enable the polyfill * @param {String} value */ set(value) { // find out the touch-action by the event handlers if (value === TOUCH_ACTION_COMPUTE) { value = this.compute(); } if (NATIVE_TOUCH_ACTION && this.manager.element.style && TOUCH_ACTION_MAP[value]) { this.manager.element.style[PREFIXED_TOUCH_ACTION] = value; } this.actions = value.toLowerCase().trim(); } /** * @private * just re-set the touchAction value */ update() { this.set(this.manager.options.touchAction); } /** * @private * compute the value for the touchAction property based on the recognizer's settings * @returns {String} value */ compute() { let actions = []; each(this.manager.recognizers, (recognizer) => { if (boolOrFn(recognizer.options.enable, [recognizer])) { actions = actions.concat(recognizer.getTouchAction()); } }); return cleanTouchActions(actions.join(' ')); } /** * @private * this method is called on each input cycle and provides the preventing of the browser behavior * @param {Object} input */ preventDefaults(input) { let { srcEvent } = input; let direction = input.offsetDirection; // if the touch action did prevented once this session if (this.manager.session.prevented) { srcEvent.preventDefault(); return; } let { actions } = this; let hasNone = inStr(actions, TOUCH_ACTION_NONE) && !TOUCH_ACTION_MAP[TOUCH_ACTION_NONE]; let hasPanY = inStr(actions, TOUCH_ACTION_PAN_Y) && !TOUCH_ACTION_MAP[TOUCH_ACTION_PAN_Y]; let hasPanX = inStr(actions, TOUCH_ACTION_PAN_X) && !TOUCH_ACTION_MAP[TOUCH_ACTION_PAN_X]; if (hasNone) { // do not prevent defaults if this is a tap gesture let isTapPointer = input.pointers.length === 1; let isTapMovement = input.distance < 2; let isTapTouchTime = input.deltaTime < 250; if (isTapPointer && isTapMovement && isTapTouchTime) { return; } } if (hasPanX && hasPanY) { // `pan-x pan-y` means browser handles all scrolling/panning, do not prevent return; } if (hasNone || (hasPanY && direction & DIRECTION_HORIZONTAL) || (hasPanX && direction & DIRECTION_VERTICAL)) { return this.preventSrc(srcEvent); } } /** * @private * call preventDefault to prevent the browser's default behavior (scrolling in most cases) * @param {Object} srcEvent */ preventSrc(srcEvent) { this.manager.session.prevented = true; srcEvent.preventDefault(); } } ================================================ FILE: src/utils/add-event-listeners.js ================================================ import each from './each'; import splitStr from './split-str'; /** * @private * addEventListener with multiple events at once * @param {EventTarget} target * @param {String} types * @param {Function} handler */ export default function addEventListeners(target, types, handler) { each(splitStr(types), (type) => { target.addEventListener(type, handler, false); }); } ================================================ FILE: src/utils/assign.js ================================================ /** * @private * extend object. * means that properties in dest will be overwritten by the ones in src. * @param {Object} target * @param {...Object} objects_to_assign * @returns {Object} target */ let assign; if (typeof Object.assign !== 'function') { assign = function assign(target) { if (target === undefined || target === null) { throw new TypeError('Cannot convert undefined or null to object'); } let output = Object(target); for (let index = 1; index < arguments.length; index++) { const source = arguments[index]; if (source !== undefined && source !== null) { for (const nextKey in source) { if (source.hasOwnProperty(nextKey)) { output[nextKey] = source[nextKey]; } } } } return output; }; } else { assign = Object.assign; } export default assign; ================================================ FILE: src/utils/bind-fn.js ================================================ /** * @private * simple function bind * @param {Function} fn * @param {Object} context * @returns {Function} */ export default function bindFn(fn, context) { return function boundFn() { return fn.apply(context, arguments); }; } ================================================ FILE: src/utils/bool-or-fn.js ================================================ import { TYPE_FUNCTION } from './utils-consts'; /** * @private * let a boolean value also be a function that must return a boolean * this first item in args will be used as the context * @param {Boolean|Function} val * @param {Array} [args] * @returns {Boolean} */ export default function boolOrFn(val, args) { if (typeof val === TYPE_FUNCTION) { return val.apply(args ? args[0] || undefined : undefined, args); } return val; } ================================================ FILE: src/utils/deprecate.js ================================================ /** * @private * wrap a method with a deprecation warning and stack trace * @param {Function} method * @param {String} name * @param {String} message * @returns {Function} A new function wrapping the supplied method. */ export default function deprecate(method, name, message) { let deprecationMessage = `DEPRECATED METHOD: ${name}\n${message} AT \n`; return function() { let e = new Error('get-stack-trace'); let stack = e && e.stack ? e.stack.replace(/^[^\(]+?[\n$]/gm, '') .replace(/^\s+at\s+/gm, '') .replace(/^Object.\s*\(/gm, '{anonymous}()@') : 'Unknown Stack Trace'; let log = window.console && (window.console.warn || window.console.log); if (log) { log.call(window.console, deprecationMessage, stack); } return method.apply(this, arguments); }; } ================================================ FILE: src/utils/each.js ================================================ /** * @private * walk objects and arrays * @param {Object} obj * @param {Function} iterator * @param {Object} context */ export default function each(obj, iterator, context) { let i; if (!obj) { return; } if (obj.forEach) { obj.forEach(iterator, context); } else if (obj.length !== undefined) { i = 0; while (i < obj.length) { iterator.call(context, obj[i], i, obj); i++; } } else { for (i in obj) { obj.hasOwnProperty(i) && iterator.call(context, obj[i], i, obj); } } } ================================================ FILE: src/utils/extend.js ================================================ import deprecate from './deprecate'; /** * @private * extend object. * means that properties in dest will be overwritten by the ones in src. * @param {Object} dest * @param {Object} src * @param {Boolean} [merge=false] * @returns {Object} dest */ const extend = deprecate((dest, src, merge) => { let keys = Object.keys(src); let i = 0; while (i < keys.length) { if (!merge || (merge && dest[keys[i]] === undefined)) { dest[keys[i]] = src[keys[i]]; } i++; } return dest; }, 'extend', 'Use `assign`.'); export default extend; ================================================ FILE: src/utils/get-window-for-element.js ================================================ /** * @private * get the window object of an element * @param {HTMLElement} element * @returns {DocumentView|Window} */ export default function getWindowForElement(element) { let doc = element.ownerDocument || element; return (doc.defaultView || doc.parentWindow || window); } ================================================ FILE: src/utils/has-parent.js ================================================ /** * @private * find if a node is in the given parent * @method hasParent * @param {HTMLElement} node * @param {HTMLElement} parent * @return {Boolean} found */ export default function hasParent(node, parent) { while (node) { if (node === parent) { return true; } node = node.parentNode; } return false; } ================================================ FILE: src/utils/if-undefined.js ================================================ /** * @private * use the val2 when val1 is undefined * @param {*} val1 * @param {*} val2 * @returns {*} */ export default function ifUndefined(val1, val2) { return (val1 === undefined) ? val2 : val1; } ================================================ FILE: src/utils/in-array.js ================================================ /** * @private * find if a array contains the object using indexOf or a simple polyFill * @param {Array} src * @param {String} find * @param {String} [findByKey] * @return {Boolean|Number} false when not found, or the index */ export default function inArray(src, find, findByKey) { if (src.indexOf && !findByKey) { return src.indexOf(find); } else { let i = 0; while (i < src.length) { if ((findByKey && src[i][findByKey] == find) || (!findByKey && src[i] === find)) {// do not use === here, test fails return i; } i++; } return -1; } } ================================================ FILE: src/utils/in-str.js ================================================ /** * @private * small indexOf wrapper * @param {String} str * @param {String} find * @returns {Boolean} found */ export default function inStr(str, find) { return str.indexOf(find) > -1; } ================================================ FILE: src/utils/inherit.js ================================================ import assign from './assign'; /** * @private * simple class inheritance * @param {Function} child * @param {Function} base * @param {Object} [properties] */ export default function inherit(child, base, properties) { let baseP = base.prototype; let childP; childP = child.prototype = Object.create(baseP); childP.constructor = child; childP._super = baseP; if (properties) { assign(childP, properties); } } ================================================ FILE: src/utils/invoke-array-arg.js ================================================ import each from './each'; /** * @private * if the argument is an array, we want to execute the fn on each entry * if it aint an array we don't want to do a thing. * this is used by all the methods that accept a single and array argument. * @param {*|Array} arg * @param {String} fn * @param {Object} [context] * @returns {Boolean} */ export default function invokeArrayArg(arg, fn, context) { if (Array.isArray(arg)) { each(arg, context[fn], context); return true; } return false; } ================================================ FILE: src/utils/merge.js ================================================ import deprecate from './deprecate'; import extend from './extend'; /** * @private * merge the values from src in the dest. * means that properties that exist in dest will not be overwritten by src * @param {Object} dest * @param {Object} src * @returns {Object} dest */ const merge = deprecate((dest, src) => { return extend(dest, src, true); }, 'merge', 'Use `assign`.'); export default merge; ================================================ FILE: src/utils/prefixed.js ================================================ import { VENDOR_PREFIXES } from './utils-consts'; /** * @private * get the prefixed property * @param {Object} obj * @param {String} property * @returns {String|Undefined} prefixed */ export default function prefixed(obj, property) { let prefix; let prop; let camelProp = property[0].toUpperCase() + property.slice(1); let i = 0; while (i < VENDOR_PREFIXES.length) { prefix = VENDOR_PREFIXES[i]; prop = (prefix) ? prefix + camelProp : property; if (prop in obj) { return prop; } i++; } return undefined; } ================================================ FILE: src/utils/remove-event-listeners.js ================================================ import each from './each'; import splitStr from './split-str'; /** * @private * removeEventListener with multiple events at once * @param {EventTarget} target * @param {String} types * @param {Function} handler */ export default function removeEventListeners(target, types, handler) { each(splitStr(types), (type) => { target.removeEventListener(type, handler, false); }); } ================================================ FILE: src/utils/set-timeout-context.js ================================================ import bindFn from './bind-fn'; /** * @private * set a timeout with a given scope * @param {Function} fn * @param {Number} timeout * @param {Object} context * @returns {number} */ export default function setTimeoutContext(fn, timeout, context) { return setTimeout(bindFn(fn, context), timeout); } ================================================ FILE: src/utils/split-str.js ================================================ /** * @private * split string on whitespace * @param {String} str * @returns {Array} words */ export default function splitStr(str) { return str.trim().split(/\s+/g); } ================================================ FILE: src/utils/to-array.js ================================================ /** * @private * convert array-like objects to real arrays * @param {Object} obj * @returns {Array} */ export default function toArray(obj) { return Array.prototype.slice.call(obj, 0); } ================================================ FILE: src/utils/unique-array.js ================================================ import inArray from './in-array'; /** * @private * unique array with objects based on a key (like 'id') or just by the array's value * @param {Array} src [{id:1},{id:2},{id:1}] * @param {String} [key] * @param {Boolean} [sort=False] * @returns {Array} [{id:1},{id:2}] */ export default function uniqueArray(src, key, sort) { let results = []; let values = []; let i = 0; while (i < src.length) { let val = key ? src[i][key] : src[i]; if (inArray(values, val) < 0) { results.push(src[i]); } values[i] = val; i++; } if (sort) { if (!key) { results = results.sort(); } else { results = results.sort((a, b) => { return a[key] > b[key]; }); } } return results; } ================================================ FILE: src/utils/unique-id.js ================================================ /** * @private * get a unique id * @returns {number} uniqueId */ let _uniqueId = 1; export default function uniqueId() { return _uniqueId++; } ================================================ FILE: src/utils/utils-consts.js ================================================ const VENDOR_PREFIXES = ['', 'webkit', 'Moz', 'MS', 'ms', 'o']; const TEST_ELEMENT = document.createElement('div'); const TYPE_FUNCTION = 'function'; const { round, abs } = Math; const { now } = Date; export { VENDOR_PREFIXES, TEST_ELEMENT, TYPE_FUNCTION, round, abs, now }; ================================================ FILE: string-replace.js ================================================ const fs = require('fs'); const pkg = require('./package.json'); let hammer = fs.readFileSync('hammer.js', 'utf8'); hammer = hammer.replace(/{{PKG_VERSION}}/g, pkg.version); fs.writeFile('hammer.js', hammer, 'utf8', (err) => { if (err) { throw err; } console.log('String Replaced!'); }); ================================================ FILE: tests/manual/assets/style.css ================================================ @import url(http://fonts.googleapis.com/css?family=Open+Sans); *, *:after, *:before { box-sizing: border-box; -moz-box-sizing: border-box; } html, body { margin: 0; padding: 0; height: 100%; min-height: 100%; background: #eee; font: 13px/1.5em 'Open Sans', Helvetica, Arial, sans-serif; } a { color: #4986e7; } .bg1, .green { background: #42d692; } .bg2, .blue { background: #4986e7; } .bg3, .red { background: #d06b64; } .bg4, .purple { background: #cd74e6; } .bg5, .azure { background: #9fe1e7; } body { margin: 20px; } pre { background: #fff; padding: 20px; margin-bottom: 20px; } .container { max-width: 900px; margin: 0 auto; } .clear { clear: both; } ================================================ FILE: tests/manual/compute_touch_action.html ================================================ Open the inspector and play a bit with the touchAction property. ================================================ FILE: tests/manual/input.html ================================================ Hammer.js 


        

    

    
    




================================================
FILE: tests/manual/log.html
================================================



    
    
    
    Hammer.js


    


        

            
        


        


        


    

    
    




================================================
FILE: tests/manual/multiple.html
================================================



    
    
    
    Hammer.js
    


    

        

        

        


        
Multiple instances the same time

        
You can run multiple instances of Hammer on your page and they will recognize each completely isolated
            from each other. This makes it possible to build multi-user interfaces.


    

    
    




================================================
FILE: tests/manual/nested.html
================================================



    
    
    
    
    Hammer.js
    




    

        

            

                
1.1

                
1.2

                
1.3

                
1.4

                
1.5

            

        

        

            

                
2.1

                
2.2

                
2.3

                
2.4

                
2.5

            

        

        

            

                
3.1

                
3.2

                
3.3

                
3.4

                
3.5

            

        

        

            

                
4.1

                
4.2

                
4.3

                
4.4

                
4.5

            

        

        

            

                
5.1

                
5.2

                
5.3

                
5.4

                
5.5

            

        

    


    

        
Nested Pan recognizers


        
Nested recognizers are possible with some threshold and with use of requireFailure().

    


    
    





================================================
FILE: tests/manual/simulator-googlemaps.html
================================================



    
    
    Hammer.js





    


    
Gestures simulator

    
Used for unit-testing Hammer.js. To test it on the Google Maps view, you should open your
        
        Inspector and emulate a touch-screen.
        Or just open it on your touch-device.

    
Currently, it only triggers touchEvents.












================================================
FILE: tests/manual/simulator.html
================================================



    
    
    Hammer.js






    

    


    


    













================================================
FILE: tests/manual/touchaction.html
================================================



    
    
    Hammer.js

    



    

        
Hammer provides a kind of polyfill
            for the browsers that don't support the touch-action property.


        
Your browser has support for the touch-action property!

        
Your browser doesn't support the touch-action property,
            so we use the polyfill.


        
touch-action: auto

        
Should prevent nothing.

        


        
touch-action: pan-y

        
Should prevent scrolling on horizontal movement. This is set by default when creating a Hammer instance.

        


        
touch-action: pan-x

        
Should prevent scrolling on vertical movement.

        


        
touch-action: pan-x pan-y

        
Should not prevent any scrolling on any movement. Horizontal and vertical scrolling handled by the browser directly.

        


        
touch-action: none

        
Should prevent all.

        

    

    
    

    

    
hi.






================================================
FILE: tests/manual/visual.html
================================================



    
    
    Hammer.js

    















================================================
FILE: tests/unit/assets/utils.js
================================================
var utils = {
    /**
     * trigger simple dom event
     * @param obj
     * @param name
     */
    triggerDomEvent: function(obj, name) {
        var event = document.createEvent('Event');
        event.initEvent(name, true, true);
        obj.dispatchEvent(event);
    },


    createTouchEvent: function(name, x, y, identifier) {
        var event = document.createEvent('Event');
        event.initEvent('touch' + name, true, true);

        event.touches = event.targetTouches = [{
            clientX: x,
            clientY: y,
            identifier: identifier || 0
        }];

        //https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent.changedTouches
        event.changedTouches = [{
            clientX: x,
            clientY: y,
            identifier: identifier || 0
        }];

        return event;
    },

    dispatchTouchEvent: function(el, name, x, y, identifier) {
        var event = utils.createTouchEvent(name, x, y, identifier);
        el.dispatchEvent(event);
    },

    createHitArea: function(parent) {
        if (parent == null) {
            parent = document.getElementById('qunit-fixture')
        }
        var hitArea = document.createElement('div');
        hitArea.style.background = '#eee';
        hitArea.style.height = '300px';

        parent.appendChild(hitArea);
        return hitArea;
    }
};


================================================
FILE: tests/unit/gestures/test_pan.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,utils,Simulator */

var el;
var hammer;

QUnit.module('Pan Gesture', {
    beforeEach: function() {
        el = document.createElement('div');
        document.body.appendChild(el);

        hammer = new Hammer(el, { recognizers: [] });
      },
    afterEach: function() {
        document.body.removeChild(el);
        hammer.destroy();
      }
  });

QUnit.test('`panstart` and `panmove` should be recognized', function(assert) {
    assert.expect(2);

    var panMoveCount = 0;
    var pan = new Hammer.Pan({ threshold: 1 });

    hammer.add(pan);
    hammer.on('panstart', function() {
      assert.ok(true, 'Pan start triggered');
    });
    hammer.on('panmove', function() {
      panMoveCount++;
    });

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'move', 70, 50);
    utils.dispatchTouchEvent(el, 'move', 90, 50);

    assert.equal(panMoveCount, 1, 'exactly one panMove triggered');
  });

QUnit.test('Pan event flow should be start -> left -> end', function(assert) {
    var done = assert.async();
    assert.expect(1);
    var pan = new Hammer.Pan({ threshold: 1 });
    hammer.add(pan);

    var eventflow = '';
    var isCalledPanleft = false;
    hammer.on('panstart', function() {
        eventflow += 'start';
      });
    hammer.on('panleft', function() {
        if (!isCalledPanleft) {
          isCalledPanleft = true;
          eventflow += 'left';
        }
      });
    hammer.on('panend', function() {
        eventflow += 'end';
        isCalledPanleft = true;
      });

    Simulator.gestures.pan(el, { deltaX: -100, deltaY: 0 }, function() {
        assert.equal(eventflow, 'startleftend', 'correct event flow');
        done();
      });
  });


================================================
FILE: tests/unit/gestures/test_pinch.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,Simulator */

var el;
var hammer;

QUnit.module('Pinch Gesture', {
    beforeEach: function() {
        el = document.createElement('div');
        document.body.appendChild(el);

        hammer = new Hammer(el, { recognizers: [] });
      },
    afterEach: function() {
        document.body.removeChild(el);
        hammer.destroy();
      }
  });

QUnit.test('Pinch event flow should be start -> in -> end', function(assert) {
    var done = assert.async();
    assert.expect(1);
    var pinch = new Hammer.Pinch({ enable: true, threshold: 0.1 });
    hammer.add(pinch);

    var eventflow = '';
    var isFiredPinchin = false;
    hammer.on('pinchstart', function() {
        eventflow += 'start';
      });
    hammer.on('pinchin', function() {
        if (!isFiredPinchin) {
          isFiredPinchin = true;
          eventflow += 'in';
        }
      });
    hammer.on('pinchend', function() {
        eventflow += 'end';
        isFiredPinchin = false;
      });

    Simulator.gestures.pinch(el, { duration: 500, scale: 0.5 }, function() {
        assert.equal(eventflow, 'startinend', 'correct event flow');
        done();
      });
  });


================================================
FILE: tests/unit/gestures/test_swipe.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,utils,Simulator */

var el;
var hammer;
var swipeCount = 0;

QUnit.module('Swipe Gesture', {
    beforeEach: function() {
        el = utils.createHitArea();
        hammer = new Hammer(el, { recognizers: [] });
        swipeCount = 0;
      },
    afterEach: function() {
        hammer.destroy();
      }
  });

QUnit.test('swipe can be recognized', function(assert) {
    assert.expect(1);
    var done = assert.async();
    var swipe = new Hammer.Swipe({ threshold: 1 });
    hammer.add(swipe);
    hammer.on('swipe', function() {
        assert.ok(true);
        done();
      });
    Simulator.gestures.swipe(el);
  });


================================================
FILE: tests/unit/index.html
================================================



    
    Tests
    

    
    
    
    
    

    
    

    



























================================================
FILE: tests/unit/test_enable.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,utils */
/* jshint unused:false */

var el,
    hammer,
    counter;

QUnit.module('Test recognizer enable', {
    beforeEach: function() {
        el = utils.createHitArea();
        hammer = new Hammer.Manager(el, { recognizers: [] });
        counter = 0;
      },
    afterEach: function() {
        hammer && hammer.destroy();
      }
  });

QUnit.test('should disable a recognizer through the `enable` constructor parameter', function(assert) {
    assert.expect(1);
    hammer.add(new Hammer.Tap({ enable: false }));
    hammer.on('tap', function() {
        counter++;
      });

    var done = assert.async();

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);

    setTimeout(function() {

      assert.equal(counter, 0, 'counter is zero');
      done();
    }, 100);
  });

QUnit.test('should disable recognizing when the manager is disabled.', function(assert) {
    assert.expect(1);
    hammer.set({ enable: false });
    hammer.add(new Hammer.Tap());
    hammer.on('tap', function() {
        counter++;
      });

    var done = assert.async();

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);

    setTimeout(function() {
        assert.equal(counter, 0, 'counter is zero');
        done();
      }, 100);
  });

QUnit.test('should toggle a recognizer using the `set` call to the recognizer enable property', function(assert) {
    assert.expect(2);

    hammer.add(new Hammer.Tap());
    hammer.on('tap', function() {
        counter++;
      });

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);
    assert.equal(counter, 1);

    hammer.get('tap').set({ enable: false });

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);
    assert.equal(counter, 1, 'counter is 1');
  });

QUnit.test('should accept the `enable` constructor parameter as function', function(assert) {
    assert.expect(2);

    var canRecognizeTap = false;

    var tap = new Hammer.Tap({
        enable: function() {
            return canRecognizeTap;
          }
      });

    hammer.add(tap);
    hammer.on('tap', function() {
        counter++;
      });

    var done = assert.async();
    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);

    setTimeout(function() {
        assert.equal(counter, 0, 'counter is zero');

        canRecognizeTap = true;

        utils.dispatchTouchEvent(el, 'start', 50, 50);
        utils.dispatchTouchEvent(el, 'end', 50, 50);

        assert.equal(counter, 1, 'counter is 1');
        done();
      }, 100);
  });

QUnit.test('should accept a function parameter with `set`', function(assert) {
    assert.expect(3);

    hammer.add(new Hammer.Tap());
    hammer.on('tap', function() {
        counter++;
      });

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);
    assert.equal(counter, 1, 'counter is 1');

    var canRecognizeTap = false;
    hammer.get('tap').set({ enable: function() {
        return canRecognizeTap;
      } });

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);
    assert.equal(counter, 1, 'counter is 1');

    canRecognizeTap = true;
    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);
    assert.equal(counter, 2, 'counter is 2');
  });

QUnit.test('should pass the recognizer and optional the input parameter to the `enable` callback', function(assert) {
    assert.expect(2);

    var tap;

    // The enable function is called initially to setup the touch-action property
    // at that moment there isn't any input
    var canEnable = function(recognizer, input) {
        assert.equal(recognizer, tap, 'recognizer is tap');
        return true;
      };
    tap = new Hammer.Tap({ enable: canEnable });
    hammer.add(tap);

    utils.dispatchTouchEvent(el, 'start', 50, 50);
  });

QUnit.test('should toggle based on other object method', function(assert) {
    assert.expect(2);

    var view = {
        state: 0,
        canRecognizeTap: function(recognizer, input) {
            return this.state !== 0;
          }
      };

    hammer.add(new Hammer.Tap({ enable: function(rec, input) {
        return view.canRecognizeTap(rec, input);
      } }));
    hammer.on('tap', function() {
        counter++;
      });

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);
    assert.equal(counter, 0, 'counter is 0');

    view.state = 1;
    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);
    assert.equal(counter, 1, 'counter is 1');
  });


================================================
FILE: tests/unit/test_events.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,utils,el */

QUnit.module('eventEmitter');

QUnit.test('test the eventemitter', function(assert) {
    assert.expect(6);

    var ee = new Hammer.Manager(utils.createHitArea());
    var inputData = {
        target: document.body,
        srcEvent: {
            preventDefault: function() {
                assert.ok(true, 'preventDefault ref');
              },
            target: document.body
          }
      };

    function event3Handler() {
      assert.ok(true, 'emitted event3');
    }

    ee.on('testEvent1', function() {
        assert.ok(true, 'emitted event');
      });
    ee.on('testEvent2', function(ev) {
        assert.ok(true, 'emitted event');
        ev.preventDefault();
        assert.ok(ev.target === document.body, 'target is the body');
      });
    ee.on('testEvent3', event3Handler);

    ee.emit('testEvent1', inputData);
    ee.emit('testEvent2', inputData);
    ee.emit('testEvent3', inputData);

    // Unbind testEvent2
    ee.off('testEvent2');
    ee.off('testEvent3', event3Handler);

    ee.emit('testEvent1', inputData); // Should trigger testEvent1 again
    ee.emit('testEvent2', inputData); // Doenst trigger a thing
    ee.emit('testEvent3', inputData); // Doenst trigger a thing

    // Destroy
    ee.destroy();

    ee.emit('testEvent1', inputData); // Doenst trigger a thing
    ee.emit('testEvent2', inputData); // Doenst trigger a thing
    ee.emit('testEvent3', inputData); // Doenst trigger a thing
  });

/*
 * Hammer.Manager.off method : exception handling
 */
QUnit.test('When Hammer.Manager didnt attach an event, `off` method is ignored', function(assert) {
    var count = 0;
    var hammer = new Hammer(el, { inputTarget: document.body });
    hammer.off('swipeleft', function() {
        count++;
      });
    assert.ok(true, 'nothing');
  });


================================================
FILE: tests/unit/test_gestures.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,utils,Simulator */

// TODO: this tests fails because tapRecognizer changes
// it could be that tapRecognizer setup its BEGAN state and
// disable the other gesture recognition
var el;
var hammer;
var events;
var allGestureEvents = [
    'tap doubletap press',
    'pinch pinchin pinchout pinchstart pinchmove pinchend pinchcancel',
    'rotate rotatestart rotatemove rotateend rotatecancel',
    'pan panstart panmove panup pandown panleft panright panend pancancel',
    'swipe swipeleft swiperight swipeup swipedown'
].join(' ');

QUnit.module('Gesture recognition', {
    beforeEach: function() {
        el = utils.createHitArea();
        hammer = new Hammer(el);
        hammer.get('pinch')
            .set({ // Some threshold, since the simulator doesnt stays at scale:1 when rotating
                enable: true,
                threshold: 0.1
              });

        hammer.get('rotate')
            .set({ enable: true });

        hammer.on(allGestureEvents, function(ev) {
            events[ ev.type ] = true;
          });
        events = {};
      },
    afterEach: function() {
        hammer && hammer.destroy();
        events = null;
      }
  });

QUnit.test('recognize pan', function(assert) {
    var done = assert.async();
    assert.expect(1);

    Simulator.gestures.pan(el, { duration: 500, deltaX: 100, deltaY: 0 }, function() {
        assert.deepEqual(events, {
            pan: true,
            panstart: true,
            panmove: true,
            panright: true,
            panend: true
          }, 'Pan events recognized');
        done();
      });
  });

QUnit.test('recognize press', function(assert) {
    var done = assert.async();
    assert.expect(1);

    Simulator.gestures.press(el, null, function() {
        assert.deepEqual(events, {
            press: true
          });
        done();
      }, 'only press was recognized');
  });

QUnit.test('recognize swipe', function(assert) {
    var done = assert.async();
    assert.expect(1);

    Simulator.gestures.swipe(el, { duration: 300, deltaX: 400, deltaY: 0 }, function() {
        assert.deepEqual(events, {
            pan: true,
            panstart: true,
            panmove: true,
            panright: true,
            panend: true,
            swipe: true,
            swiperight: true
          }, 'pan and swipe events were recognized');
        done();
      });
  });

QUnit.test('recognize pinch', function(assert) {
    var done = assert.async();
    assert.expect(1);

    Simulator.gestures.pinch(el, { duration: 500, scale: 0.5 }, function() {
        assert.deepEqual(events, {
            pinch: true,
            pinchstart: true,
            pinchmove: true,
            pinchend: true,
            pinchin: true
          }, 'pinch events were recognized');
        done();
      });
  });

QUnit.test('recognize children multitouch pinch', function(assert) {
    var done = assert.async();
    assert.expect(1);

    var el1 = utils.createHitArea(el);
    var el2 = utils.createHitArea(el);

    Simulator.gestures.pinch([ el1, el2 ], { duration: 500, scale: 0.5 }, function() {
        assert.deepEqual(events, {
            pinch: true,
            pinchstart: true,
            pinchmove: true,
            pinchend: true,
            pinchin: true
          }, 'pinch events on child were recognized');
        done();
      });
  });

QUnit.test('recognize parent-child multitouch pinch', function(assert) {
    var done = assert.async();
    assert.expect(1);

    var el1 = utils.createHitArea(el);

    Simulator.gestures.pinch([ el, el1 ], { duration: 100, scale: 0.5 }, function() {
        assert.deepEqual(events, {
            pinch: true,
            pinchstart: true,
            pinchmove: true,
            pinchend: true,
            pinchin: true
          }, 'Pinch events on parent were recognized');
        done();
      });
  });

QUnit.test('recognize rotate', function(assert) {
    var done = assert.async();
    assert.expect(1);

    Simulator.gestures.rotate(el, { duration: 500, scale: 1 }, function() {
        assert.deepEqual(events, {
            rotate: true,
            rotatestart: true,
            rotatemove: true,
            rotateend: true
          }, 'Rotate events recognized');
        done();
      });
  });

QUnit.test('recognize multitouch rotate', function(assert) {
    var done = assert.async();
    assert.expect(1);

    var el1 = utils.createHitArea(el);

    Simulator.gestures.rotate([ el, el1 ], { duration: 500, scale: 1 }, function() {
        assert.deepEqual(events, {
            rotate: true,
            rotatestart: true,
            rotatemove: true,
            rotateend: true
          }, 'Rotate events were recognized');
        done();
      });
  });

QUnit.test('recognize rotate and pinch simultaneous', function(assert) {
    var done = assert.async();
    assert.expect(1);

    Simulator.gestures.pinchRotate(el, { duration: 500, scale: 2 }, function() {
        assert.deepEqual(events, {
            rotate: true,
            rotatestart: true,
            rotatemove: true,
            rotateend: true,
            pinch: true,
            pinchstart: true,
            pinchmove: true,
            pinchend: true,
            pinchout: true
          }, 'Rotate and pinch were recognized together');
        done();
      });
  });

QUnit.test("don't recognize pan and swipe when moving down, when only horizontal is allowed", function(assert) {
    var done = assert.async();
    assert.expect(1);

    Simulator.gestures.swipe(el, { duration: 250, deltaX: 0, deltaZ: 200 }, function() {
        assert.deepEqual(events, { }, 'No events were recognized');
        done();
      });
  });

QUnit.test("don't recognize press if duration is too short.", function(assert) {
    var done = assert.async();
    assert.expect(1);

    Simulator.gestures.press(el, { duration: 240 });

    setTimeout(function() {
        assert.deepEqual(events, { tap: true }, 'Tap gesture has been recognized.');
        done();
      }, 275);
  });

QUnit.test("don't recognize tap if duration is too long.", function(assert) {
    var done = assert.async();
    assert.expect(1);

    Simulator.gestures.tap(el, { duration: 255 });

    setTimeout(function() {
        assert.deepEqual(events, { press: true }, 'Press gesture has been recognized.');
        done();
      }, 275);
  });


================================================
FILE: tests/unit/test_hammer.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals,requireTemplateStringsForConcatenation,requireArrayDestructuring
/* globals QUnit,Hammer,utils,Simulator */

var el, el2,
    hammer, hammer2;

QUnit.module('Tests', {
    beforeEach: function() {
        el = utils.createHitArea();
        el2 = utils.createHitArea();
      },

    afterEach: function() {
        if (hammer) {
          hammer.destroy();
          hammer = null;
        }
        if (hammer2) {
          hammer2.destroy();
          hammer2 = null;
        }
      }
  });

//  since Hammer is now a ES6 Class and we cannot call a class as a function,
//  it needs a `new` keyword prefixed that makes this Shortcut test kinda Redundant.

// QUnit.test( "hammer shortcut", function( assert ) {
//     assert.expect( 2 );
//
//     Hammer.defaults.touchAction = "pan-y";
//     hammer = Hammer( el );
//
//     assert.ok( hammer instanceof Hammer.Manager, "returns an instance of Manager" );
//     assert.ok( hammer.touchAction.actions == Hammer.defaults.touchAction, "set the default touchAction" );
// } );
//
// QUnit.test( "hammer shortcut with options", function( assert ) {
//     assert.expect( 2 );
//
//     hammer = Hammer( el, {
//         touchAction: "none"
//     } );
//     assert.ok( hammer instanceof Hammer.Manager, "returns an instance of Manager" );
//     assert.ok( hammer.touchAction.actions == "none", "set the default touchAction" );
// } );

/* Creating a hammer instance does not work on the same way
 * when using Hammer or Hammer.Manager.
 *
 * This can confuse developers who read tests to use the library when doc is missing.
 */
QUnit.test('Hammer and Hammer.Manager constructors work exactly on the same way.', function(assert) {
    assert.expect(2);

    hammer = new Hammer(el, {});
    assert.equal(Hammer.defaults.preset.length, hammer.recognizers.length,
      'Correct number of recognizers by default');

    hammer2 = new Hammer.Manager(el, {});
    assert.equal(0, hammer2.recognizers.length, 'No default recognizers with manager and empty object');
  });

/* DOC to disable default recognizers should be added.
 *
 * - Hammer(el).      IMO: Currently, well done.
 * - Hammer(el, {}) . IMO: should disable default recognizers
 * - Hammer(el, {recognizers: null}).      IMO: now, it fails.
 * - Hammer(el, {recognizers: []}).  It works, but it is likely not intuitive.
 */
QUnit.test('A Hammer instance can be setup to not having default recognizers.', function(assert) {
    assert.expect(1);

    hammer = new Hammer(el, { recognizers: false });
    assert.equal(0, hammer.recognizers.length, 'No default recognizers with recognizers false');
  });

/* The case was when I added a custom tap event which was added to the default
 * recognizers, and my custom tap gesture wasn't working (I do not know exactly the reason),
 * but removing the default recognizers solved the issue.
 */
QUnit.test('Adding the same recognizer type should remove the old recognizer', function(assert) {
    assert.expect(4);

    hammer = new Hammer(el);

    assert.ok(!!hammer.get('tap'));
    assert.equal(7, hammer.recognizers.length, '7 recognizers found');

    var newTap = new Hammer.Tap({ time: 1337 });
    hammer.add(newTap);

    assert.equal(7, hammer.recognizers.length, '7 recognizers found after adding tap');
    assert.equal(1337, hammer.get('tap').options.time, 'Time has been updated to reflect new tap');
  });

/*
 * Swipe gesture:
 * - in this tests, it does not update input.velocity ( always 0)
 * - does not fire swipeleft or swiperight events
 */
QUnit.test('Swiping to the left should fire swipeleft event', function(assert) {
    var done = assert.async();
    assert.expect(2);

    hammer = new Hammer(el, { recognizers: [] });
    hammer.add(new Hammer.Swipe());
    hammer.on('swipe swipeleft', function() {
        assert.ok(true);
      });

    Simulator.gestures.swipe(el, { pos: [ 300, 300 ], deltaY: 0, deltaX: -200 }, function() {
        done();
      });
  });

/*
 * Input target change
 */
QUnit.test('Should detect input while on other element', function(assert) {
    var done = assert.async();
    assert.expect(1);

    hammer = new Hammer(el, { inputTarget: document.body });
    hammer.on('tap', function() {
        assert.ok(true);
      });

    Simulator.gestures.tap(document.body, null, function() {
        done();
      });
  });

/* Hammer.Manager constructor accepts a "recognizers" option in which each
 * element is an array representation of a Recognizer.
 */
QUnit.test('Hammer.Manager accepts recognizers as arrays.', function(assert) {
    assert.expect(4);

    hammer = new Hammer.Manager(el, {
        recognizers: [
            [ Hammer.Swipe ],
            [ Hammer.Pinch ],
            [ Hammer.Rotate ],
            [ Hammer.Pan, { direction: Hammer.DIRECTION_UP }, [ 'swipe', 'pinch' ], [ 'rotate' ] ]
        ]
      });
    assert.equal(4, hammer.recognizers.length, '4 recognizers found');

    var recognizerActual = hammer.recognizers[ 3 ];
    assert.equal(recognizerActual.options.direction, Hammer.DIRECTION_UP,
      'Recognize direction from options');
    assert.equal(2, Object.keys(recognizerActual.simultaneous).length, '2 simultanious recognizers found');
    assert.equal(1, recognizerActual.requireFail.length, '1 require failing recognizer found');
  });

/*
 * Removing a recognizer which cannot be found would errantly remove the last recognizer in the
 * manager's list.
 */
QUnit.test('Remove non-existent recognizer.', function(assert) {
    assert.expect(1);

    hammer = new Hammer(el, { recognizers: [] });
    hammer.add(new Hammer.Swipe());
    hammer.remove('tap');

    assert.equal(1, hammer.recognizers.length, '1 recognizer found');
  });

QUnit.test('check whether Hammer.defaults.cssProps is restored', function(assert) {
    var beforeCssProps = {
        userSelect: 'text',
        touchSelect: 'grippers',
        touchCallout: 'default',
        contentZooming: 'chained',
        userDrag: 'element',
        tapHighlightColor: 'rgba(0, 1, 0, 0)'
      };
    var prop;
    Hammer.each(Hammer.defaults.cssProps, function(value, name) {
        prop = Hammer.prefixed(el.style, name);
        if (prop) {
          el.style[ prop ] = beforeCssProps[ name ];
        }
      });

    hammer = new Hammer(el);
    hammer.destroy();
    hammer = null;
    Hammer.each(Hammer.defaults.cssProps, function(value, name) {
        prop = Hammer.prefixed(el.style, name);
        if (prop) {
          assert.equal(el.style[ prop ], beforeCssProps[ name ], 'check if ' + name + ' is restored');
        }
      });
  });


================================================
FILE: tests/unit/test_jquery_plugin.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,utils,Simulator,$,jQuery */

var el, hammer, events;

var jQueryPluginPath = '../../node_modules/jquery-hammerjs/jquery.hammer.js';

QUnit.module('jQuery plugin', {
    beforeEach: function() {
        el = utils.createHitArea();
        events = {};
      },
    afterEach: function() {
        hammer && hammer.destroy();
      }
  });

QUnit.test('trigger pan with jQuery', function(assert) {
    var done = assert.async();
    assert.expect(2);

    $.getScript(jQueryPluginPath, function() {
        jQuery(el).hammer();
        jQuery(el).bind('panstart pan panmove panright panend', function(ev) {
            if (ev.gesture) {
              events[ ev.type ] = true;
            }
          });

        Simulator.gestures.pan(el, { deltaX: 50, deltaY: 0 }, function() {

            assert.deepEqual(events, {
                pan: true,
                panstart: true,
                panmove: true,
                panright: true,
                panend: true
              }, 'Pan events recognized');

            assert.ok(jQuery(el).data('hammer') instanceof Hammer.Manager, 'data attribute refers to the instance');
            done();
          });
      });
  });

QUnit.test('trigger pan without jQuery should still work', function(assert) {
    var done = assert.async();
    assert.expect(1);
    var hammer = new Hammer(el);
    hammer.on('panstart pan panmove panright panend', function(ev) {
        events[ev.type] = true;
      });
    Simulator.gestures.pan(el, { deltaX: 50, deltaY: 0 }, function() {
        assert.deepEqual(events, {
            pan: true,
            panstart: true,
            panmove: true,
            panright: true,
            panend: true
          }, 'Pan events recognized');
        done();
      });
  });


================================================
FILE: tests/unit/test_multiple_taps.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,utils*/

var el;
var hammer;

var tripleTapCount = 0;
var doubleTapCount = 0;
var tapCount = 0;

QUnit.module('Tap delay', {
    beforeEach: function() {
        el = utils.createHitArea();
        hammer = new Hammer(el, { recognizers: [] });

        var tap = new Hammer.Tap();
        var doubleTap = new Hammer.Tap({ event: 'doubleTap', taps: 2 });
        var tripleTap = new Hammer.Tap({ event: 'tripleTap', taps: 3 });

        hammer.add([ tripleTap, doubleTap, tap ]);

        tripleTap.recognizeWith([ doubleTap, tap ]);
        doubleTap.recognizeWith(tap);

        doubleTap.requireFailure(tripleTap);
        tap.requireFailure([ tripleTap, doubleTap ]);

        tripleTapCount = 0;
        doubleTapCount = 0;
        tapCount = 0;

        hammer.on('tap', function() {
            tapCount++;
          });
        hammer.on('doubleTap', function() {
            doubleTapCount++;
          });
        hammer.on('tripleTap', function() {
            tripleTapCount++;
          });
      },
    afterEach: function() {
        hammer.destroy();
      }
  });
QUnit.test('When a tripleTap is fired, doubleTap and Tap should not be recognized', function(assert) {
    var done = assert.async();
    assert.expect(3);

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);

    setTimeout(function() {
        assert.equal(tripleTapCount, 1, 'one tripletap event');
        assert.equal(doubleTapCount, 0, 'no doubletap event');
        assert.equal(tapCount, 0, 'no singletap event');
        done();
      }, 350);
  });
QUnit.test('When a doubleTap is fired, tripleTap and Tap should not be recognized', function(assert) {
    var done = assert.async();
    assert.expect(3);

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);

    setTimeout(function() {
        assert.equal(tripleTapCount, 0, 'No tripple taps recognized');
        assert.equal(doubleTapCount, 1, '1 double tap recognized');
        assert.equal(tapCount, 0, 'No single taps recognized');
        done();
      }, 350);
  });

QUnit.test('When a tap is fired, tripleTap and doubleTap should not be recognized', function(assert) {
    var done = assert.async();
    assert.expect(3);

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'end', 50, 50);

    setTimeout(function() {
        assert.equal(tripleTapCount, 0, 'No tripple taps recognized');
        assert.equal(doubleTapCount, 0, 'No double taps recognized');
        assert.equal(tapCount, 1, '1 single tap recognized');
        done();
      }, 350);
  });


================================================
FILE: tests/unit/test_nested_gesture_recognizers.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,utils*/
/*jshint -W079 */

var parent,
    child,
    hammerChild,
    hammerParent;

QUnit.module('Nested gesture recognizers (Tap Child + Pan Parent)', {
    beforeEach: function() {
        parent = document.createElement('div');
        child = document.createElement('div');

        document.getElementById('qunit-fixture').appendChild(parent);
        parent.appendChild(child);

        hammerParent = new Hammer.Manager(parent, {
            touchAction: 'none'
          });
        hammerChild = new Hammer.Manager(child, {
            touchAction: 'none'
          });

        hammerChild.add(new Hammer.Tap());
        hammerParent.add(new Hammer.Pan({ threshold: 5, pointers: 1 }));
      },
    afterEach: function() {
        hammerChild.destroy();
        hammerParent.destroy();
      }
  });

QUnit.test('Tap on the child', function(assert) {
    assert.expect(1);

    hammerChild.on('tap', function() {
        assert.ok(true);
      });
    hammerParent.on('tap', function() {
        throw new Error('tap should not fire on parent');
      });

    utils.dispatchTouchEvent(child, 'start', 0, 10);
    utils.dispatchTouchEvent(child, 'end', 0, 10);
  });

QUnit.test('Panning on the child should fire parent pan and should not fire child tap event', function(assert) {
    assert.expect(1);

    hammerChild.on('tap', function() {
        throw new Error('tap should not fire on parent');
      });
    hammerParent.on('panend', function() {
        assert.ok(true);
      });

    utils.dispatchTouchEvent(child, 'start', 10, 0);
    utils.dispatchTouchEvent(child, 'move', 20, 0);
    utils.dispatchTouchEvent(child, 'end', 30, 0);

  });

/*
 // test (optional pointers validation)
 test('Panning with one finger down on child, other on parent', function () {
 expect(1);

 var event,
 touches;

 hammerParent.on('panend', function () {
 ok(true);
 });

 // one finger one child
 utils.dispatchTouchEvent(child, 'start', 10, 0, 0);
 utils.dispatchTouchEvent(parent, 'start', 12, 0, 1);

 touches = [
 {clientX: 20, clientY: 0, identifier: 0 },
 {clientX: 20, clientY: 0, identifier: 1 }
 ];

 event = document.createEvent('Event');
 event.initEvent('touchmove', true, true);
 event.touches = touches;
 event.changedTouches = touches;

 parent.dispatchEvent(event);

 touches = [
 {clientX: 30, clientY: 0, identifier: 0 },
 {clientX: 30, clientY: 0, identifier: 1 }
 ];

 event = document.createEvent('Event');
 event.initEvent('touchend', true, true);
 event.touches = touches;
 event.changedTouches = touches;

 parent.dispatchEvent(event);
 });
 */

var pressPeriod = 600;
QUnit.module('Nested gesture recognizers (Press Child + Pan Parent)', {
    beforeEach: function() {
        parent = document.createElement('div');
        child = document.createElement('div');

        document.getElementById('qunit-fixture').appendChild(parent);
        parent.appendChild(child);

        hammerParent = new Hammer.Manager(parent, {
            touchAction: 'none'
          });
        hammerChild = new Hammer.Manager(child, {
            touchAction: 'none'
          });

        hammerChild.add(new Hammer.Press({ time: pressPeriod }));
        hammerParent.add(new Hammer.Pan({ threshold: 5, pointers: 1 }));
      },
    afterEach: function() {
        hammerChild.destroy();
        hammerParent.destroy();
      }
  });

QUnit.test('Press on the child', function(assert) {
    assert.expect(1);

    hammerChild.on('press', function() {
        assert.ok(true);
      });
    hammerParent.on('press', function() {
        throw new Error('press should not fire on parent');
      });

    utils.dispatchTouchEvent(child, 'start', 0, 10);

    var done = assert.async();

    setTimeout(function() {
        done();
      }, pressPeriod);
  });

QUnit.test('When Press is followed by Pan on the same element, both gestures are recognized', function(assert) {
    assert.expect(2);
    hammerChild.on('press', function() {
        assert.ok(true);
      });
    hammerParent.on('panend', function() {
        assert.ok(true);
      });

    utils.dispatchTouchEvent(child, 'start', 0, 10);
    var done = assert.async();

    setTimeout(function() {
        utils.dispatchTouchEvent(child, 'move', 10, 10);
        utils.dispatchTouchEvent(child, 'move', 20, 10);
        utils.dispatchTouchEvent(child, 'move', 30, 10);
        utils.dispatchTouchEvent(child, 'end', 30, 10);

        done();
      }, pressPeriod);
  });


================================================
FILE: tests/unit/test_propagation_bubble.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,utils*/
/*jshint -W079 */

var parent;
var child;
var hammerChild;
var hammerParent;

QUnit.module('Propagation (Tap in Child and Parent)', {
    beforeEach: function() {
        parent = document.createElement('div');
        child = document.createElement('div');

        document.getElementById('qunit-fixture').appendChild(parent);
        parent.appendChild(child);

        hammerParent = new Hammer.Manager(parent);
        hammerChild = new Hammer.Manager(child);

        hammerChild.add(new Hammer.Tap());
        hammerParent.add(new Hammer.Tap());
      },
    afterEach: function() {
        hammerChild.destroy();
        hammerParent.destroy();
      }
  });

QUnit.test('Tap on the child, fires also the tap event to the parent', function(assert) {
    assert.expect(2);

    hammerChild.on('tap', function() {
        assert.ok(true);
      });
    hammerParent.on('tap', function() {
        assert.ok(true);
      });

    utils.dispatchTouchEvent(child, 'start', 0, 10);
    utils.dispatchTouchEvent(child, 'end', 0, 10);
  });

QUnit.test('When tap on the child and the child stops the input event propagation, the tap event does not get fired in the parent', function(assert) {
    assert.expect(1);

    hammerChild.on('tap', function() {
        assert.ok(true);
      });
    hammerParent.on('tap', function() {
        throw new Error('parent tap gesture should not be recognized');
      });

    child.addEventListener('touchend', function(ev) {
        ev.stopPropagation();
      });

    utils.dispatchTouchEvent(child, 'start', 0, 10);
    utils.dispatchTouchEvent(child, 'end', 0, 10);
  });


================================================
FILE: tests/unit/test_require_failure.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,utils,Simulator */

var el;
var hammer;
var pressPeriod = 200;
var pressThreshold = 20;
var pressCount = 0;
var panStartCount = 0;
var swipeCount = 0;

QUnit.module('Require Failure ( Swipe & Press )', {
    beforeEach: function() {
        el = utils.createHitArea();
        hammer = new Hammer(el, { recognizers: [] });

        var swipe = new Hammer.Swipe({ threshold: 1 });
        var press = new Hammer.Press({ time: pressPeriod, threshold: pressThreshold });

        hammer.add(swipe);
        hammer.add(press);

        swipe.recognizeWith(press);
        press.requireFailure(swipe);

        pressCount = 0;
        swipeCount = 0;
        hammer.on('press', function() {
            pressCount++;
          });
        hammer.on('swipe', function() {
            swipeCount++;
          });
      },
    afterEach: function() {
        hammer.destroy();
      }
  });

QUnit.test('When swipe does not recognize the gesture, a press gesture can be fired', function(assert) {
    var done = assert.async();
    assert.expect(1);

    utils.dispatchTouchEvent(el, 'start', 50, 50);

    setTimeout(function() {
        assert.equal(pressCount, 1, '1 press recognized');
        done();
      }, pressPeriod + 100);
  });

QUnit.test('When swipe does recognize the gesture, a press gesture cannot be fired', function(assert) {
    var done = assert.async();
    assert.expect(2);

    Simulator.gestures.swipe(el, null, function() {
      assert.ok(swipeCount > 0, 'swipe gesture should be recognizing');

      assert.equal(pressCount, 0, 'press gesture should not be recognized because swipe gesture is recognizing');
      done();
    });
  });
QUnit.module('Require Failure ( Pan & Press )', {
    beforeEach: function() {
        el = document.createElement('div');
        document.body.appendChild(el);

        hammer = new Hammer(el, { recognizers: [] });

        var pan = new Hammer.Pan({ threshold: 1 });
        var press = new Hammer.Press({ time: pressPeriod, threshold: pressThreshold });

        hammer.add([ pan, press ]);

        pan.recognizeWith(press);
        press.requireFailure(pan);

        pressCount = 0;
        panStartCount = 0;
        hammer.on('press', function() {
            pressCount++;
          });
        hammer.on('panstart', function() {
            panStartCount++;
          });
      },
    afterEach: function() {
        document.body.removeChild(el);
        hammer.destroy();
      }
  });

QUnit.test('When pan does not recognize the gesture, a press gesture can be fired', function(assert) {
    var done = assert.async();
    assert.expect(1);

    utils.dispatchTouchEvent(el, 'start', 50, 50);

    setTimeout(function() {
      assert.equal(pressCount, 1, '1 press recognized');
      done();
    }, pressPeriod + 100);
  });

QUnit.test('When pan recognizes the gesture, a press gesture cannot be fired', function(assert) {
    var done = assert.async();
    assert.expect(2);

    utils.dispatchTouchEvent(el, 'start', 50, 50);
    utils.dispatchTouchEvent(el, 'move', 50 + pressThreshold / 4, 50);

    setTimeout(function() {
      assert.ok(panStartCount > 0, 'pan gesture should be recognizing');

      assert.equal(pressCount, 0, 'press gesture should not be recognized because pan gesture is recognizing');
      done();
    }, pressPeriod + 100);
  });


================================================
FILE: tests/unit/test_simultaneous_recognition.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,utils*/

var el;
var hammer;

QUnit.module('Simultaenous recognition', {
    beforeEach: function() {
        el = utils.createHitArea();
      },
    afterEach: function() {
        hammer && hammer.destroy();
      }
  });

QUnit.test('should pinch and pan simultaneously be recognized when enabled', function(assert) {
    var done = assert.async();
    assert.expect(4);

    var panCount = 0;
    var pinchCount = 0;

    hammer = new Hammer.Manager(el, {
        touchAction: 'none'
      });

    hammer.add(new Hammer.Pan({ threshold: 5, pointers: 2 }));

    var pinch = new Hammer.Pinch({ threshold: 0, pointers: 2 });
    hammer.add(pinch);
    pinch.recognizeWith(hammer.get('pan'));

    hammer.on('panend', function() {
        panCount++;
      });
    hammer.on('pinchend', function() {
        pinchCount++;
      });

    var executeGesture = function(cb) {
        var event, touches;

        touches = [
            { clientX: 0, clientY: 10, identifier: 0, target: el },
            { clientX: 10, clientY: 10, identifier: 1, target: el }
        ];

        event = document.createEvent('Event');
        event.initEvent('touchstart', true, true);
        event.touches = touches;
        event.targetTouches = touches;
        event.changedTouches = touches;
        el.dispatchEvent(event);

        setTimeout(function() {
            touches = [
                { clientX: 10, clientY: 20, identifier: 0, target: el },
                { clientX: 20, clientY: 20, identifier: 1, target: el }
            ];

            event = document.createEvent('Event');
            event.initEvent('touchmove', true, true);
            event.touches = touches;
            event.targetTouches = touches;
            event.changedTouches = touches;

            el.dispatchEvent(event);
          }, 100);

        setTimeout(function() {
            touches = [
                { clientX: 20, clientY: 30, identifier: 0, target: el },
                { clientX: 40, clientY: 30, identifier: 1, target: el }
            ];

            event = document.createEvent('Event');
            event.initEvent('touchmove', true, true);
            event.touches = touches;
            event.targetTouches = touches;
            event.changedTouches = touches;
            el.dispatchEvent(event);

            event = document.createEvent('Event');
            event.initEvent('touchend', true, true);
            event.touches = touches;
            event.targetTouches = touches;
            event.changedTouches = touches;
            el.dispatchEvent(event);

            cb();
          }, 200);
      };

    // 2 gesture will be recognized
    executeGesture(function() {
        assert.equal(panCount, 1, '1 pan event recognized');
        assert.equal(pinchCount, 1, '1 pinch event recognized');

        pinch.dropRecognizeWith(hammer.get('pan'));

        // Only the pan gesture will be recognized
        executeGesture(function() {
            assert.equal(panCount, 2, '2 pan events recognized');
            assert.equal(pinchCount, 1, 'One pinch event recognized');

            done();
          });
      });
  });

QUnit.test('the first gesture should block the following gestures (Tap & DoubleTap)', function(assert) {
    assert.expect(4);

    var tapCount = 0;
    var doubleTapCount = 0;

    hammer = new Hammer.Manager(el, {
        touchAction: 'none'
      });

    var tap = new Hammer.Tap();
    var doubleTap = new Hammer.Tap({ event: 'doubletap', taps: 2 });

    hammer.add(tap);
    hammer.add(doubleTap);

    hammer.on('tap', function() {
        tapCount++;
      });
    hammer.on('doubletap', function() {
        doubleTapCount++;
      });

    utils.dispatchTouchEvent(el, 'start', 0, 10);
    utils.dispatchTouchEvent(el, 'end', 0, 10);
    utils.dispatchTouchEvent(el, 'start', 0, 10);
    utils.dispatchTouchEvent(el, 'end', 0, 10);

    assert.equal(tapCount, 2, 'on a double tap gesture, the tap gesture is recognized twice');
    assert.equal(doubleTapCount, 0, 'double tap gesture is not recognized because the prior tap gesture does not recognize it simultaneously');

    doubleTap.recognizeWith(hammer.get('tap'));

    utils.dispatchTouchEvent(el, 'start', 0, 10);
    utils.dispatchTouchEvent(el, 'end', 0, 10);
    utils.dispatchTouchEvent(el, 'start', 0, 10);
    utils.dispatchTouchEvent(el, 'end', 0, 10);

    assert.equal(tapCount, 4, '4 tap events recognized');
    assert.equal(doubleTapCount, 1, 'when the tap gesture is configured to work simultaneously, tap & doubleTap can be recognized simultaneously');
  });

QUnit.test('when disabled, the first gesture should not block gestures  (Tap & DoubleTap )', function(assert) {
    assert.expect(4);

    var tapCount = 0;
    var doubleTapCount = 0;

    hammer = new Hammer.Manager(el, {
        touchAction: 'none'
      });

    var tap = new Hammer.Tap();
    var doubleTap = new Hammer.Tap({ event: 'doubletap', taps: 2 });

    hammer.add(tap);
    hammer.add(doubleTap);

    hammer.on('tap', function() {
        tapCount++;
      });
    hammer.on('doubletap', function() {
        doubleTapCount++;
      });

    utils.dispatchTouchEvent(el, 'start', 0, 10);
    utils.dispatchTouchEvent(el, 'end', 0, 10);
    utils.dispatchTouchEvent(el, 'start', 0, 10);
    utils.dispatchTouchEvent(el, 'end', 0, 10);

    assert.equal(tapCount, 2, 'on a double tap gesture, the tap gesture is recognized twice');
    assert.equal(doubleTapCount, 0, 'double tap gesture is not recognized because the prior tap gesture does not recognize it simultaneously');

    hammer.get('tap').set({ enable: false });

    utils.dispatchTouchEvent(el, 'start', 0, 10);
    utils.dispatchTouchEvent(el, 'end', 0, 10);
    utils.dispatchTouchEvent(el, 'start', 0, 10);
    utils.dispatchTouchEvent(el, 'end', 0, 10);

    assert.equal(tapCount, 2, 'tap gesture should not be recognized when the recognizer is disabled');
    assert.equal(doubleTapCount, 1, 'when the tap gesture is disabled, doubleTap can be recognized');
  });

QUnit.test('the first gesture should block the following gestures (DoubleTap & Tap)', function(assert) {
    assert.expect(4);

    var tapCount = 0;
    var doubleTapCount = 0;

    hammer = new Hammer.Manager(el, {
        touchAction: 'none'
      });

    var tap = new Hammer.Tap();
    var doubleTap = new Hammer.Tap({ event: 'doubletap', taps: 2 });

    hammer.add(doubleTap);
    hammer.add(tap);

    hammer.on('tap', function() {
        tapCount++;
      });
    hammer.on('doubletap', function() {
        doubleTapCount++;
      });

    utils.dispatchTouchEvent(el, 'start', 0, 10);
    utils.dispatchTouchEvent(el, 'end', 0, 10);
    utils.dispatchTouchEvent(el, 'start', 0, 10);
    utils.dispatchTouchEvent(el, 'end', 0, 10);

    assert.equal(doubleTapCount, 1, 'double tap is recognized');
    assert.equal(tapCount, 1, 'tap is detected, the doubletap is only catched by the doubletap recognizer');

    // Doubletap and tap together
    doubleTap.recognizeWith(hammer.get('tap'));
    doubleTapCount = 0;
    tapCount = 0;

    utils.dispatchTouchEvent(el, 'start', 0, 10);
    utils.dispatchTouchEvent(el, 'end', 0, 10);
    utils.dispatchTouchEvent(el, 'start', 0, 10);
    utils.dispatchTouchEvent(el, 'end', 0, 10);

    assert.equal(doubleTapCount, 1, '1 double tap recognized');
    assert.equal(tapCount, 2, 'when the tap gesture is configured to work simultaneously, tap & doubleTap can be recognized simultaneously');
  });


================================================
FILE: tests/unit/test_utils.js
================================================
// jscs:disable requireArrowFunctions,disallowVar,requireEnhancedObjectLiterals
/* globals QUnit,Hammer,utils,_*/

QUnit.module('utils');

// For the tests, all hammer properties and methods of Hammer are exposed to window.Hammer

QUnit.test('get/set prefixed util', function(assert) {
    assert.ok(_.isUndefined(Hammer.prefixed(window, 'FakeProperty')), 'non existent property returns undefined');

    window.webkitFakeProperty = 1337;
    assert.ok(Hammer.prefixed(window, 'FakeProperty') == 'webkitFakeProperty', 'existent prefixed property returns the prefixed name');

    delete window.webkitFakeProperty;
  });

QUnit.test('fnBind', function(assert) {
    var context = { a: true };

    Hammer.bindFn(function(b) {
        assert.ok(this.a === true, 'bindFn scope');
        assert.ok(b === 123, 'bindFn argument');
      }, context)(123);
  });

QUnit.test('Inherit objects', function(assert) {
    function Base() {
      this.name = true;
    }

    function Child() {
      Base.call(this);
    }

    Hammer.inherit(Child, Base, {
        newMethod: function() {
        }
      });

    var inst = new Child();

    assert.ok(inst.name == true, 'child has extended from base');
    assert.ok(inst.newMethod, 'child has a new method');
    assert.ok(Child.prototype.newMethod, 'child has a new prototype method');
    assert.ok(inst instanceof Child, 'is instanceof Child');
    assert.ok(inst instanceof Base, 'is instanceof Base');
    assert.ok(inst._super === Base.prototype, '_super is ref to prototype of Base');
  });

QUnit.test('toArray', function(assert) {
    assert.ok(_.isArray(Hammer.toArray({ 0: true, 1: 'second', length: 2 })), 'converted an array-like object to an array');
    assert.ok(_.isArray(Hammer.toArray([ true, true ])), 'array stays an array');
  });

QUnit.test('inArray', function(assert) {
    assert.ok(Hammer.inArray([ 1, 2, 3, 4, 'hammer' ], 'hammer') === 4, 'found item and returned the index');
    assert.ok(Hammer.inArray([ 1, 2, 3, 4, 'hammer' ], 'notfound') === -1, 'not found an item and returned -1');
    assert.ok(Hammer.inArray([
        { id: 2 },
        { id: 24 }
    ], '24', 'id') === 1, 'find by key and return the index');
    assert.ok(Hammer.inArray([
        { id: 2 },
        { id: 24 }
    ], '22', 'id') === -1, 'not found by key and return -1');
  });

QUnit.test('splitStr', function(assert) {
    assert.deepEqual(Hammer.splitStr(' a  b  c d   '), [ 'a', 'b', 'c', 'd' ], 'str split valid');
  });

QUnit.test('uniqueArray', function(assert) {
    assert.deepEqual(Hammer.uniqueArray([
        { id: 1 },
        { id: 2 },
        { id: 2 }
    ], 'id'), [
        { id: 1 },
        { id: 2 }
    ], 'remove duplicate ids');
  });

QUnit.test('boolOrFn', function(assert) {
    assert.equal(Hammer.boolOrFn(true), true, 'Passing an boolean');
    assert.equal(Hammer.boolOrFn(false), false, 'Passing an boolean');
    assert.equal(Hammer.boolOrFn(function() {
        return true;
      }), true, 'Passing an boolean');
    assert.equal(Hammer.boolOrFn(1), true, 'Passing an integer');
  });

QUnit.test('hasParent', function(assert) {
    var parent = document.createElement('div');
    var child = document.createElement('div');

    document.body.appendChild(parent);
    parent.appendChild(child);

    assert.equal(Hammer.hasParent(child, parent), true, 'Found parent');
    assert.equal(Hammer.hasParent(parent, child), false, 'Not in parent');

    document.body.removeChild(parent);
  });

QUnit.test('each', function(assert) {
    var object = { hi: true };
    var array = [ 'a', 'b', 'c' ];
    var loop;

    loop = false;
    Hammer.each(object, function(value, key) {
        if (key == 'hi' && value === true) {
          loop = true;
        }
      });
    assert.ok(loop, 'object loop');

    loop = 0;
    Hammer.each(array, function(value) {
        if (value) {
          loop++;
        }
      });
    assert.ok(loop == 3, 'array loop');

    loop = 0;
    array.forEach = null;
    Hammer.each(array, function(value) {
        if (value) {
          loop++;
        }
      });
    assert.ok(loop == 3, 'array loop without Array.forEach');
  });

QUnit.test('assign', function(assert) {
    assert.expect(2);
    assert.deepEqual(
        Hammer.assign(
            { a: 1, b: 3 },
            { b: 2, c: 3 }
        ),
        { a: 1, b: 2, c: 3 },
        'Simple extend'
    );

    var src = { foo: true };
    var dest = Hammer.assign({}, src);
    src.foo = false;
    assert.deepEqual(dest, { foo: true }, 'Clone reference');
  });

QUnit.test('test add/removeEventListener', function(assert) {
    function handleEvent() {
      assert.ok(true, 'triggered event');
    }

    assert.expect(2);

    Hammer.addEventListeners(window, 'testEvent1  testEvent2  ', handleEvent);
    utils.triggerDomEvent(window, 'testEvent1');
    utils.triggerDomEvent(window, 'testEvent2');

    Hammer.removeEventListeners(window, ' testEvent1 testEvent2 ', handleEvent);
    utils.triggerDomEvent(window, 'testEvent1');
    utils.triggerDomEvent(window, 'testEvent2');
  });