diff --git a/src/ngTouch/directive/ngSwipe.js b/src/ngTouch/directive/ngSwipe.js index d3259426a2f3..cf1d9333a004 100644 --- a/src/ngTouch/directive/ngSwipe.js +++ b/src/ngTouch/directive/ngSwipe.js @@ -12,6 +12,9 @@ * Though ngSwipeLeft is designed for touch-based devices, it will work with a mouse click and drag * too. * + * To disable the mouse click and drag functionality, add `ng-swipe-disable-mouse` to + * the `ng-swipe-left` or `ng-swipe-right` DOM Element. + * * Requires the {@link ngTouch `ngTouch`} module to be installed. * * @element ANY @@ -101,6 +104,8 @@ function makeSwipeDirective(directiveName, direction, eventName) { deltaY / deltaX < MAX_VERTICAL_RATIO; } + var pointerTypes = angular.isDefined(attr['ngSwipeDisableMouse']) ? + ['touch'] : ['touch','mouse']; $swipe.bind(element, { 'start': function(coords, event) { startCoords = coords; @@ -117,7 +122,7 @@ function makeSwipeDirective(directiveName, direction, eventName) { }); } } - }); + }, pointerTypes); }; }]); } diff --git a/src/ngTouch/swipe.js b/src/ngTouch/swipe.js index ea79a96c37ec..884e0800d83c 100644 --- a/src/ngTouch/swipe.js +++ b/src/ngTouch/swipe.js @@ -25,6 +25,20 @@ ngTouch.factory('$swipe', [function() { // The total distance in any direction before we make the call on swipe vs. scroll. var MOVE_BUFFER_RADIUS = 10; + var POINTER_EVENTS = { + 'mouse': { + start: 'mousedown', + move: 'mousemove', + end: 'mouseup' + }, + 'touch': { + start: 'touchstart', + move: 'touchmove', + end: 'touchend', + cancel: 'touchcancel' + } + }; + function getCoordinates(event) { var touches = event.touches && event.touches.length ? event.touches : [event]; var e = (event.changedTouches && event.changedTouches[0]) || @@ -38,6 +52,17 @@ ngTouch.factory('$swipe', [function() { }; } + function getEvents(pointerTypes, eventType) { + var res = []; + angular.forEach(pointerTypes, function(pointerType) { + var eventName = POINTER_EVENTS[pointerType][eventType]; + if (eventName) { + res.push(eventName); + } + }); + return res.join(' '); + } + return { /** * @ngdoc method @@ -46,6 +71,9 @@ ngTouch.factory('$swipe', [function() { * @description * The main method of `$swipe`. It takes an element to be watched for swipe motions, and an * object containing event handlers. + * The pointer types that should be used can be specified via the optional + * third argument, which is an array of strings `'mouse'` and `'touch'`. By default, + * `$swipe` will listen for `mouse` and `touch` events. * * The four events are `start`, `move`, `end`, and `cancel`. `start`, `move`, and `end` * receive as a parameter a coordinates object of the form `{ x: 150, y: 310 }`. @@ -68,7 +96,7 @@ ngTouch.factory('$swipe', [function() { * as described above. * */ - bind: function(element, eventHandlers) { + bind: function(element, eventHandlers, pointerTypes) { // Absolute total movement, used to control swipe vs. scroll. var totalX, totalY; // Coordinates of the start position. @@ -78,7 +106,8 @@ ngTouch.factory('$swipe', [function() { // Whether a swipe is active. var active = false; - element.on('touchstart mousedown', function(event) { + pointerTypes = pointerTypes || ['mouse', 'touch']; + element.on(getEvents(pointerTypes, 'start'), function(event) { startCoords = getCoordinates(event); active = true; totalX = 0; @@ -86,13 +115,15 @@ ngTouch.factory('$swipe', [function() { lastPos = startCoords; eventHandlers['start'] && eventHandlers['start'](startCoords, event); }); + var events = getEvents(pointerTypes, 'cancel'); + if (events) { + element.on(events, function(event) { + active = false; + eventHandlers['cancel'] && eventHandlers['cancel'](event); + }); + } - element.on('touchcancel', function(event) { - active = false; - eventHandlers['cancel'] && eventHandlers['cancel'](event); - }); - - element.on('touchmove mousemove', function(event) { + element.on(getEvents(pointerTypes, 'move'), function(event) { if (!active) return; // Android will send a touchcancel if it thinks we're starting to scroll. @@ -126,7 +157,7 @@ ngTouch.factory('$swipe', [function() { } }); - element.on('touchend mouseup', function(event) { + element.on(getEvents(pointerTypes, 'end'), function(event) { if (!active) return; active = false; eventHandlers['end'] && eventHandlers['end'](getCoordinates(event), event); diff --git a/test.html b/test.html new file mode 100644 index 000000000000..4653ba7fcef2 --- /dev/null +++ b/test.html @@ -0,0 +1,30 @@ + + + + + +
+
+ Name: +
+ + Other data: +
+
+ 
user.name =
+
+ + diff --git a/test/ngTouch/directive/ngSwipeSpec.js b/test/ngTouch/directive/ngSwipeSpec.js index 9ee0411348d3..be80700c21ef 100644 --- a/test/ngTouch/directive/ngSwipeSpec.js +++ b/test/ngTouch/directive/ngSwipeSpec.js @@ -66,6 +66,29 @@ var swipeTests = function(description, restrictBrowsers, startEvent, moveEvent, expect($rootScope.swiped).toBe(true); })); + it('should only swipe given ng-swipe-disable-mouse attribute for touch events', inject(function($rootScope, $compile) { + element = $compile('
')($rootScope); + $rootScope.$digest(); + expect($rootScope.swiped).toBeUndefined(); + + browserTrigger(element, startEvent, { + keys : [], + x : 100, + y : 20 + }); + browserTrigger(element, endEvent,{ + keys: [], + x: 20, + y: 20 + }); + if(description === 'mouse'){ + expect($rootScope.swiped).toBeUndefined(); + } + else{ + expect($rootScope.swiped).toBe(true); + } + })); + it('should pass event object', inject(function($rootScope, $compile) { element = $compile('
')($rootScope); $rootScope.$digest(); diff --git a/test/ngTouch/swipeSpec.js b/test/ngTouch/swipeSpec.js index f770651ec265..daa5a73f92df 100644 --- a/test/ngTouch/swipeSpec.js +++ b/test/ngTouch/swipeSpec.js @@ -1,392 +1,385 @@ 'use strict'; -// Wrapper to abstract over using touch events or mouse events. -var swipeTests = function(description, restrictBrowsers, startEvent, moveEvent, endEvent) { - describe('$swipe with ' + description + ' events', function() { - var element; - - if (restrictBrowsers) { - // TODO(braden): Once we have other touch-friendly browsers on CI, allow them here. - // Currently Firefox and IE refuse to fire touch events. - var chrome = /chrome/.test(navigator.userAgent.toLowerCase()); - if (!chrome) { - return; - } - } - - // Skip tests on IE < 9. These versions of IE don't support createEvent(), and so - // we cannot control the (x,y) position of events. - // It works fine in IE 8 under manual testing. - var msie = +((/msie (\d+)/.exec(navigator.userAgent.toLowerCase()) || [])[1]); - if (msie < 9) { - return; - } - - beforeEach(function() { - module('ngTouch'); - }); - - afterEach(function() { - dealoc(element); - }); - - it('should trigger the "start" event', inject(function($rootScope, $swipe, $compile) { - element = $compile('
')($rootScope); - var events = { - start: jasmine.createSpy('startSpy'), - move: jasmine.createSpy('moveSpy'), - cancel: jasmine.createSpy('cancelSpy'), - end: jasmine.createSpy('endSpy') - }; - - $swipe.bind(element, events); - - expect(events.start).not.toHaveBeenCalled(); - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, startEvent,{ - keys: [], - x: 100, - y: 20 - }); - - expect(events.start).toHaveBeenCalled(); - - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - })); - - it('should trigger the "move" event after a "start"', inject(function($rootScope, $swipe, $compile) { +describe('$swipe', function() { + var element; + var events; + + // Skip tests on IE < 9. These versions of IE don't support createEvent(), and so + // we cannot control the (x,y) position of events. + // It works fine in IE 8 under manual testing. + var msie = +((/msie (\d+)/.exec(navigator.userAgent.toLowerCase()) || [])[1]); + if (msie < 9) { + return; + } + + beforeEach(function() { + module('ngTouch'); + inject(function($compile, $rootScope) { element = $compile('
')($rootScope); - var events = { - start: jasmine.createSpy('startSpy'), - move: jasmine.createSpy('moveSpy'), - cancel: jasmine.createSpy('cancelSpy'), - end: jasmine.createSpy('endSpy') - }; - - $swipe.bind(element, events); - - expect(events.start).not.toHaveBeenCalled(); - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, startEvent,{ - keys: [], - x: 100, - y: 20 - }); + }); + events = { + start: jasmine.createSpy('startSpy'), + move: jasmine.createSpy('moveSpy'), + cancel: jasmine.createSpy('cancelSpy'), + end: jasmine.createSpy('endSpy') + }; + }); - expect(events.start).toHaveBeenCalled(); + afterEach(function() { + dealoc(element); + }); - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); + describe('pointerTypes', function() { + var usedEvents; + var MOUSE_EVENTS = ['mousedown','mousemove','mouseup'].sort(); + var TOUCH_EVENTS = ['touchcancel','touchend','touchmove','touchstart'].sort(); + var ALL_EVENTS = MOUSE_EVENTS.concat(TOUCH_EVENTS).sort(); - browserTrigger(element, moveEvent,{ - keys: [], - x: 140, - y: 20 + beforeEach(function() { + usedEvents = []; + spyOn(element, 'on').andCallFake(function(events) { + angular.forEach(events.split(/\s+/), function(eventName) { + usedEvents.push(eventName); + }); }); + }); - expect(events.start).toHaveBeenCalled(); - expect(events.move).toHaveBeenCalled(); - - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - })); - - it('should not trigger a "move" without a "start"', inject(function($rootScope, $swipe, $compile) { - element = $compile('
')($rootScope); - var events = { - start: jasmine.createSpy('startSpy'), - move: jasmine.createSpy('moveSpy'), - cancel: jasmine.createSpy('cancelSpy'), - end: jasmine.createSpy('endSpy') - }; - + it('should use mouse and touch by default', inject(function($swipe) { $swipe.bind(element, events); - - expect(events.start).not.toHaveBeenCalled(); - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, moveEvent,{ - keys: [], - x: 100, - y: 40 - }); - - expect(events.start).not.toHaveBeenCalled(); - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); + expect(usedEvents.sort()).toEqual(ALL_EVENTS); })); - it('should not trigger an "end" without a "start"', inject(function($rootScope, $swipe, $compile) { - element = $compile('
')($rootScope); - var events = { - start: jasmine.createSpy('startSpy'), - move: jasmine.createSpy('moveSpy'), - cancel: jasmine.createSpy('cancelSpy'), - end: jasmine.createSpy('endSpy') - }; - - $swipe.bind(element, events); - - expect(events.start).not.toHaveBeenCalled(); - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, endEvent,{ - keys: [], - x: 100, - y: 40 - }); - - expect(events.start).not.toHaveBeenCalled(); - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); + it('should only use mouse events for pointerType "mouse"', inject(function($swipe) { + $swipe.bind(element, events, ['mouse']); + expect(usedEvents.sort()).toEqual(MOUSE_EVENTS); })); - it('should trigger a "start", many "move"s and an "end"', inject(function($rootScope, $swipe, $compile) { - element = $compile('
')($rootScope); - var events = { - start: jasmine.createSpy('startSpy'), - move: jasmine.createSpy('moveSpy'), - cancel: jasmine.createSpy('cancelSpy'), - end: jasmine.createSpy('endSpy') - }; - - $swipe.bind(element, events); - - expect(events.start).not.toHaveBeenCalled(); - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, startEvent,{ - keys: [], - x: 100, - y: 40 - }); - - expect(events.start).toHaveBeenCalled(); - - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, moveEvent,{ - keys: [], - x: 120, - y: 40 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 130, - y: 40 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 140, - y: 40 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 150, - y: 40 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 160, - y: 40 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 170, - y: 40 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 180, - y: 40 - }); - - expect(events.start).toHaveBeenCalled(); - expect(events.move.calls.length).toBe(7); - - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, endEvent,{ - keys: [], - x: 200, - y: 40 - }); - - expect(events.start).toHaveBeenCalled(); - expect(events.move.calls.length).toBe(7); - expect(events.end).toHaveBeenCalled(); - - expect(events.cancel).not.toHaveBeenCalled(); + it('should only use touch events for pointerType "touch"', inject(function($swipe) { + $swipe.bind(element, events, ['touch']); + expect(usedEvents.sort()).toEqual(TOUCH_EVENTS); })); - it('should not start sending "move"s until enough horizontal motion is accumulated', inject(function($rootScope, $swipe, $compile) { - element = $compile('
')($rootScope); - var events = { - start: jasmine.createSpy('startSpy'), - move: jasmine.createSpy('moveSpy'), - cancel: jasmine.createSpy('cancelSpy'), - end: jasmine.createSpy('endSpy') - }; - - $swipe.bind(element, events); - - expect(events.start).not.toHaveBeenCalled(); - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, startEvent,{ - keys: [], - x: 100, - y: 40 - }); - - expect(events.start).toHaveBeenCalled(); - - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, moveEvent,{ - keys: [], - x: 101, - y: 40 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 105, - y: 40 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 110, - y: 40 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 115, - y: 40 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 120, - y: 40 - }); - - expect(events.start).toHaveBeenCalled(); - expect(events.move.calls.length).toBe(3); - - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, endEvent,{ - keys: [], - x: 200, - y: 40 - }); - - expect(events.start).toHaveBeenCalled(); - expect(events.move.calls.length).toBe(3); - expect(events.end).toHaveBeenCalled(); - - expect(events.cancel).not.toHaveBeenCalled(); + it('should use mouse and touch if both are specified', inject(function($swipe) { + $swipe.bind(element, events, ['touch', 'mouse']); + expect(usedEvents.sort()).toEqual(ALL_EVENTS); })); - it('should stop sending anything after vertical motion dominates', inject(function($rootScope, $swipe, $compile) { - element = $compile('
')($rootScope); - var events = { - start: jasmine.createSpy('startSpy'), - move: jasmine.createSpy('moveSpy'), - cancel: jasmine.createSpy('cancelSpy'), - end: jasmine.createSpy('endSpy') - }; - - $swipe.bind(element, events); - - expect(events.start).not.toHaveBeenCalled(); - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, startEvent,{ - keys: [], - x: 100, - y: 40 - }); - - expect(events.start).toHaveBeenCalled(); - - expect(events.move).not.toHaveBeenCalled(); - expect(events.cancel).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, moveEvent,{ - keys: [], - x: 101, - y: 41 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 105, - y: 55 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 110, - y: 60 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 115, - y: 70 - }); - browserTrigger(element, moveEvent,{ - keys: [], - x: 120, - y: 80 - }); - - expect(events.start).toHaveBeenCalled(); - expect(events.cancel).toHaveBeenCalled(); - - expect(events.move).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - - browserTrigger(element, endEvent,{ - keys: [], - x: 200, - y: 40 - }); - - expect(events.start).toHaveBeenCalled(); - expect(events.cancel).toHaveBeenCalled(); - - expect(events.move).not.toHaveBeenCalled(); - expect(events.end).not.toHaveBeenCalled(); - })); }); -}; -swipeTests('touch', /* restrictBrowers */ true, 'touchstart', 'touchmove', 'touchend'); -swipeTests('mouse', /* restrictBrowers */ false, 'mousedown', 'mousemove', 'mouseup'); + swipeTests('touch', /* restrictBrowers */ true, 'touchstart', 'touchmove', 'touchend'); + swipeTests('mouse', /* restrictBrowers */ false, 'mousedown', 'mousemove', 'mouseup'); + + // Wrapper to abstract over using touch events or mouse events. + function swipeTests(description, restrictBrowsers, startEvent, moveEvent, endEvent) { + describe('$swipe with ' + description + ' events', function() { + if (restrictBrowsers) { + // TODO(braden): Once we have other touch-friendly browsers on CI, allow them here. + // Currently Firefox and IE refuse to fire touch events. + var chrome = /chrome/.test(navigator.userAgent.toLowerCase()); + if (!chrome) { + return; + } + } + + it('should trigger the "start" event', inject(function($swipe) { + $swipe.bind(element, events); + + expect(events.start).not.toHaveBeenCalled(); + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, startEvent,{ + keys: [], + x: 100, + y: 20 + }); + + expect(events.start).toHaveBeenCalled(); + + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + })); + + it('should trigger the "move" event after a "start"', inject(function($swipe) { + $swipe.bind(element, events); + + expect(events.start).not.toHaveBeenCalled(); + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, startEvent,{ + keys: [], + x: 100, + y: 20 + }); + + expect(events.start).toHaveBeenCalled(); + + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, moveEvent,{ + keys: [], + x: 140, + y: 20 + }); + + expect(events.start).toHaveBeenCalled(); + expect(events.move).toHaveBeenCalled(); + + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + })); + + it('should not trigger a "move" without a "start"', inject(function($swipe) { + $swipe.bind(element, events); + + expect(events.start).not.toHaveBeenCalled(); + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, moveEvent,{ + keys: [], + x: 100, + y: 40 + }); + + expect(events.start).not.toHaveBeenCalled(); + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + })); + + it('should not trigger an "end" without a "start"', inject(function($swipe) { + $swipe.bind(element, events); + + expect(events.start).not.toHaveBeenCalled(); + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, endEvent,{ + keys: [], + x: 100, + y: 40 + }); + + expect(events.start).not.toHaveBeenCalled(); + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + })); + + it('should trigger a "start", many "move"s and an "end"', inject(function($swipe) { + $swipe.bind(element, events); + + expect(events.start).not.toHaveBeenCalled(); + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, startEvent,{ + keys: [], + x: 100, + y: 40 + }); + + expect(events.start).toHaveBeenCalled(); + + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, moveEvent,{ + keys: [], + x: 120, + y: 40 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 130, + y: 40 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 140, + y: 40 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 150, + y: 40 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 160, + y: 40 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 170, + y: 40 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 180, + y: 40 + }); + + expect(events.start).toHaveBeenCalled(); + expect(events.move.calls.length).toBe(7); + + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, endEvent,{ + keys: [], + x: 200, + y: 40 + }); + + expect(events.start).toHaveBeenCalled(); + expect(events.move.calls.length).toBe(7); + expect(events.end).toHaveBeenCalled(); + + expect(events.cancel).not.toHaveBeenCalled(); + })); + + it('should not start sending "move"s until enough horizontal motion is accumulated', inject(function($swipe) { + $swipe.bind(element, events); + + expect(events.start).not.toHaveBeenCalled(); + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, startEvent,{ + keys: [], + x: 100, + y: 40 + }); + + expect(events.start).toHaveBeenCalled(); + + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, moveEvent,{ + keys: [], + x: 101, + y: 40 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 105, + y: 40 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 110, + y: 40 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 115, + y: 40 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 120, + y: 40 + }); + + expect(events.start).toHaveBeenCalled(); + expect(events.move.calls.length).toBe(3); + + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, endEvent,{ + keys: [], + x: 200, + y: 40 + }); + + expect(events.start).toHaveBeenCalled(); + expect(events.move.calls.length).toBe(3); + expect(events.end).toHaveBeenCalled(); + + expect(events.cancel).not.toHaveBeenCalled(); + })); + + it('should stop sending anything after vertical motion dominates', inject(function($swipe) { + $swipe.bind(element, events); + + expect(events.start).not.toHaveBeenCalled(); + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, startEvent,{ + keys: [], + x: 100, + y: 40 + }); + + expect(events.start).toHaveBeenCalled(); + + expect(events.move).not.toHaveBeenCalled(); + expect(events.cancel).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, moveEvent,{ + keys: [], + x: 101, + y: 41 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 105, + y: 55 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 110, + y: 60 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 115, + y: 70 + }); + browserTrigger(element, moveEvent,{ + keys: [], + x: 120, + y: 80 + }); + + expect(events.start).toHaveBeenCalled(); + expect(events.cancel).toHaveBeenCalled(); + + expect(events.move).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + + browserTrigger(element, endEvent,{ + keys: [], + x: 200, + y: 40 + }); + + expect(events.start).toHaveBeenCalled(); + expect(events.cancel).toHaveBeenCalled(); + + expect(events.move).not.toHaveBeenCalled(); + expect(events.end).not.toHaveBeenCalled(); + })); + }); + } +});