rails-angularjs 1.3.12

Sign up to get free protection for your applications and to get access to all the features.
Files changed (52) hide show
  1. checksums.yaml +7 -0
  2. data/MIT-LICENSE +22 -0
  3. data/README.md +37 -0
  4. data/lib/rails-angularjs.rb +9 -0
  5. data/lib/rails-angularjs/engine.rb +4 -0
  6. data/lib/rails-angularjs/sprockets.rb +3 -0
  7. data/lib/rails-angularjs/version.rb +4 -0
  8. data/vendor/assets/javascripts/angularjs/angular-animate.js +2137 -0
  9. data/vendor/assets/javascripts/angularjs/angular-animate.min.js +33 -0
  10. data/vendor/assets/javascripts/angularjs/angular-aria.js +339 -0
  11. data/vendor/assets/javascripts/angularjs/angular-aria.min.js +12 -0
  12. data/vendor/assets/javascripts/angularjs/angular-cookies.js +206 -0
  13. data/vendor/assets/javascripts/angularjs/angular-cookies.min.js +8 -0
  14. data/vendor/assets/javascripts/angularjs/angular-loader.js +405 -0
  15. data/vendor/assets/javascripts/angularjs/angular-loader.min.js +9 -0
  16. data/vendor/assets/javascripts/angularjs/angular-messages.js +400 -0
  17. data/vendor/assets/javascripts/angularjs/angular-messages.min.js +10 -0
  18. data/vendor/assets/javascripts/angularjs/angular-mocks.js +2396 -0
  19. data/vendor/assets/javascripts/angularjs/angular-resource.js +667 -0
  20. data/vendor/assets/javascripts/angularjs/angular-resource.min.js +13 -0
  21. data/vendor/assets/javascripts/angularjs/angular-route.js +989 -0
  22. data/vendor/assets/javascripts/angularjs/angular-route.min.js +15 -0
  23. data/vendor/assets/javascripts/angularjs/angular-sanitize.js +680 -0
  24. data/vendor/assets/javascripts/angularjs/angular-sanitize.min.js +16 -0
  25. data/vendor/assets/javascripts/angularjs/angular-scenario.js +37499 -0
  26. data/vendor/assets/javascripts/angularjs/angular-touch.js +622 -0
  27. data/vendor/assets/javascripts/angularjs/angular-touch.min.js +13 -0
  28. data/vendor/assets/javascripts/angularjs/angular.js +26130 -0
  29. data/vendor/assets/javascripts/angularjs/angular.min.js +250 -0
  30. data/vendor/assets/javascripts/angularjs/unstable/angular-animate.js +2137 -0
  31. data/vendor/assets/javascripts/angularjs/unstable/angular-animate.min.js +33 -0
  32. data/vendor/assets/javascripts/angularjs/unstable/angular-aria.js +339 -0
  33. data/vendor/assets/javascripts/angularjs/unstable/angular-aria.min.js +12 -0
  34. data/vendor/assets/javascripts/angularjs/unstable/angular-cookies.js +206 -0
  35. data/vendor/assets/javascripts/angularjs/unstable/angular-cookies.min.js +8 -0
  36. data/vendor/assets/javascripts/angularjs/unstable/angular-loader.js +410 -0
  37. data/vendor/assets/javascripts/angularjs/unstable/angular-loader.min.js +9 -0
  38. data/vendor/assets/javascripts/angularjs/unstable/angular-messages.js +400 -0
  39. data/vendor/assets/javascripts/angularjs/unstable/angular-messages.min.js +10 -0
  40. data/vendor/assets/javascripts/angularjs/unstable/angular-mocks.js +2400 -0
  41. data/vendor/assets/javascripts/angularjs/unstable/angular-resource.js +667 -0
  42. data/vendor/assets/javascripts/angularjs/unstable/angular-resource.min.js +13 -0
  43. data/vendor/assets/javascripts/angularjs/unstable/angular-route.js +989 -0
  44. data/vendor/assets/javascripts/angularjs/unstable/angular-route.min.js +15 -0
  45. data/vendor/assets/javascripts/angularjs/unstable/angular-sanitize.js +682 -0
  46. data/vendor/assets/javascripts/angularjs/unstable/angular-sanitize.min.js +16 -0
  47. data/vendor/assets/javascripts/angularjs/unstable/angular-scenario.js +38463 -0
  48. data/vendor/assets/javascripts/angularjs/unstable/angular-touch.js +622 -0
  49. data/vendor/assets/javascripts/angularjs/unstable/angular-touch.min.js +13 -0
  50. data/vendor/assets/javascripts/angularjs/unstable/angular.js +27088 -0
  51. data/vendor/assets/javascripts/angularjs/unstable/angular.min.js +281 -0
  52. metadata +140 -0
@@ -0,0 +1,622 @@
1
+ /**
2
+ * @license AngularJS v1.4.0-beta.3
3
+ * (c) 2010-2015 Google, Inc. http://angularjs.org
4
+ * License: MIT
5
+ */
6
+ (function(window, angular, undefined) {'use strict';
7
+
8
+ /**
9
+ * @ngdoc module
10
+ * @name ngTouch
11
+ * @description
12
+ *
13
+ * # ngTouch
14
+ *
15
+ * The `ngTouch` module provides touch events and other helpers for touch-enabled devices.
16
+ * The implementation is based on jQuery Mobile touch event handling
17
+ * ([jquerymobile.com](http://jquerymobile.com/)).
18
+ *
19
+ *
20
+ * See {@link ngTouch.$swipe `$swipe`} for usage.
21
+ *
22
+ * <div doc-module-components="ngTouch"></div>
23
+ *
24
+ */
25
+
26
+ // define ngTouch module
27
+ /* global -ngTouch */
28
+ var ngTouch = angular.module('ngTouch', []);
29
+
30
+ /* global ngTouch: false */
31
+
32
+ /**
33
+ * @ngdoc service
34
+ * @name $swipe
35
+ *
36
+ * @description
37
+ * The `$swipe` service is a service that abstracts the messier details of hold-and-drag swipe
38
+ * behavior, to make implementing swipe-related directives more convenient.
39
+ *
40
+ * Requires the {@link ngTouch `ngTouch`} module to be installed.
41
+ *
42
+ * `$swipe` is used by the `ngSwipeLeft` and `ngSwipeRight` directives in `ngTouch`, and by
43
+ * `ngCarousel` in a separate component.
44
+ *
45
+ * # Usage
46
+ * The `$swipe` service is an object with a single method: `bind`. `bind` takes an element
47
+ * which is to be watched for swipes, and an object with four handler functions. See the
48
+ * documentation for `bind` below.
49
+ */
50
+
51
+ ngTouch.factory('$swipe', [function() {
52
+ // The total distance in any direction before we make the call on swipe vs. scroll.
53
+ var MOVE_BUFFER_RADIUS = 10;
54
+
55
+ var POINTER_EVENTS = {
56
+ 'mouse': {
57
+ start: 'mousedown',
58
+ move: 'mousemove',
59
+ end: 'mouseup'
60
+ },
61
+ 'touch': {
62
+ start: 'touchstart',
63
+ move: 'touchmove',
64
+ end: 'touchend',
65
+ cancel: 'touchcancel'
66
+ }
67
+ };
68
+
69
+ function getCoordinates(event) {
70
+ var touches = event.touches && event.touches.length ? event.touches : [event];
71
+ var e = (event.changedTouches && event.changedTouches[0]) ||
72
+ (event.originalEvent && event.originalEvent.changedTouches &&
73
+ event.originalEvent.changedTouches[0]) ||
74
+ touches[0].originalEvent || touches[0];
75
+
76
+ return {
77
+ x: e.clientX,
78
+ y: e.clientY
79
+ };
80
+ }
81
+
82
+ function getEvents(pointerTypes, eventType) {
83
+ var res = [];
84
+ angular.forEach(pointerTypes, function(pointerType) {
85
+ var eventName = POINTER_EVENTS[pointerType][eventType];
86
+ if (eventName) {
87
+ res.push(eventName);
88
+ }
89
+ });
90
+ return res.join(' ');
91
+ }
92
+
93
+ return {
94
+ /**
95
+ * @ngdoc method
96
+ * @name $swipe#bind
97
+ *
98
+ * @description
99
+ * The main method of `$swipe`. It takes an element to be watched for swipe motions, and an
100
+ * object containing event handlers.
101
+ * The pointer types that should be used can be specified via the optional
102
+ * third argument, which is an array of strings `'mouse'` and `'touch'`. By default,
103
+ * `$swipe` will listen for `mouse` and `touch` events.
104
+ *
105
+ * The four events are `start`, `move`, `end`, and `cancel`. `start`, `move`, and `end`
106
+ * receive as a parameter a coordinates object of the form `{ x: 150, y: 310 }`.
107
+ *
108
+ * `start` is called on either `mousedown` or `touchstart`. After this event, `$swipe` is
109
+ * watching for `touchmove` or `mousemove` events. These events are ignored until the total
110
+ * distance moved in either dimension exceeds a small threshold.
111
+ *
112
+ * Once this threshold is exceeded, either the horizontal or vertical delta is greater.
113
+ * - If the horizontal distance is greater, this is a swipe and `move` and `end` events follow.
114
+ * - If the vertical distance is greater, this is a scroll, and we let the browser take over.
115
+ * A `cancel` event is sent.
116
+ *
117
+ * `move` is called on `mousemove` and `touchmove` after the above logic has determined that
118
+ * a swipe is in progress.
119
+ *
120
+ * `end` is called when a swipe is successfully completed with a `touchend` or `mouseup`.
121
+ *
122
+ * `cancel` is called either on a `touchcancel` from the browser, or when we begin scrolling
123
+ * as described above.
124
+ *
125
+ */
126
+ bind: function(element, eventHandlers, pointerTypes) {
127
+ // Absolute total movement, used to control swipe vs. scroll.
128
+ var totalX, totalY;
129
+ // Coordinates of the start position.
130
+ var startCoords;
131
+ // Last event's position.
132
+ var lastPos;
133
+ // Whether a swipe is active.
134
+ var active = false;
135
+
136
+ pointerTypes = pointerTypes || ['mouse', 'touch'];
137
+ element.on(getEvents(pointerTypes, 'start'), function(event) {
138
+ startCoords = getCoordinates(event);
139
+ active = true;
140
+ totalX = 0;
141
+ totalY = 0;
142
+ lastPos = startCoords;
143
+ eventHandlers['start'] && eventHandlers['start'](startCoords, event);
144
+ });
145
+ var events = getEvents(pointerTypes, 'cancel');
146
+ if (events) {
147
+ element.on(events, function(event) {
148
+ active = false;
149
+ eventHandlers['cancel'] && eventHandlers['cancel'](event);
150
+ });
151
+ }
152
+
153
+ element.on(getEvents(pointerTypes, 'move'), function(event) {
154
+ if (!active) return;
155
+
156
+ // Android will send a touchcancel if it thinks we're starting to scroll.
157
+ // So when the total distance (+ or - or both) exceeds 10px in either direction,
158
+ // we either:
159
+ // - On totalX > totalY, we send preventDefault() and treat this as a swipe.
160
+ // - On totalY > totalX, we let the browser handle it as a scroll.
161
+
162
+ if (!startCoords) return;
163
+ var coords = getCoordinates(event);
164
+
165
+ totalX += Math.abs(coords.x - lastPos.x);
166
+ totalY += Math.abs(coords.y - lastPos.y);
167
+
168
+ lastPos = coords;
169
+
170
+ if (totalX < MOVE_BUFFER_RADIUS && totalY < MOVE_BUFFER_RADIUS) {
171
+ return;
172
+ }
173
+
174
+ // One of totalX or totalY has exceeded the buffer, so decide on swipe vs. scroll.
175
+ if (totalY > totalX) {
176
+ // Allow native scrolling to take over.
177
+ active = false;
178
+ eventHandlers['cancel'] && eventHandlers['cancel'](event);
179
+ return;
180
+ } else {
181
+ // Prevent the browser from scrolling.
182
+ event.preventDefault();
183
+ eventHandlers['move'] && eventHandlers['move'](coords, event);
184
+ }
185
+ });
186
+
187
+ element.on(getEvents(pointerTypes, 'end'), function(event) {
188
+ if (!active) return;
189
+ active = false;
190
+ eventHandlers['end'] && eventHandlers['end'](getCoordinates(event), event);
191
+ });
192
+ }
193
+ };
194
+ }]);
195
+
196
+ /* global ngTouch: false */
197
+
198
+ /**
199
+ * @ngdoc directive
200
+ * @name ngClick
201
+ *
202
+ * @description
203
+ * A more powerful replacement for the default ngClick designed to be used on touchscreen
204
+ * devices. Most mobile browsers wait about 300ms after a tap-and-release before sending
205
+ * the click event. This version handles them immediately, and then prevents the
206
+ * following click event from propagating.
207
+ *
208
+ * Requires the {@link ngTouch `ngTouch`} module to be installed.
209
+ *
210
+ * This directive can fall back to using an ordinary click event, and so works on desktop
211
+ * browsers as well as mobile.
212
+ *
213
+ * This directive also sets the CSS class `ng-click-active` while the element is being held
214
+ * down (by a mouse click or touch) so you can restyle the depressed element if you wish.
215
+ *
216
+ * @element ANY
217
+ * @param {expression} ngClick {@link guide/expression Expression} to evaluate
218
+ * upon tap. (Event object is available as `$event`)
219
+ *
220
+ * @example
221
+ <example module="ngClickExample" deps="angular-touch.js">
222
+ <file name="index.html">
223
+ <button ng-click="count = count + 1" ng-init="count=0">
224
+ Increment
225
+ </button>
226
+ count: {{ count }}
227
+ </file>
228
+ <file name="script.js">
229
+ angular.module('ngClickExample', ['ngTouch']);
230
+ </file>
231
+ </example>
232
+ */
233
+
234
+ ngTouch.config(['$provide', function($provide) {
235
+ $provide.decorator('ngClickDirective', ['$delegate', function($delegate) {
236
+ // drop the default ngClick directive
237
+ $delegate.shift();
238
+ return $delegate;
239
+ }]);
240
+ }]);
241
+
242
+ ngTouch.directive('ngClick', ['$parse', '$timeout', '$rootElement',
243
+ function($parse, $timeout, $rootElement) {
244
+ var TAP_DURATION = 750; // Shorter than 750ms is a tap, longer is a taphold or drag.
245
+ var MOVE_TOLERANCE = 12; // 12px seems to work in most mobile browsers.
246
+ var PREVENT_DURATION = 2500; // 2.5 seconds maximum from preventGhostClick call to click
247
+ var CLICKBUSTER_THRESHOLD = 25; // 25 pixels in any dimension is the limit for busting clicks.
248
+
249
+ var ACTIVE_CLASS_NAME = 'ng-click-active';
250
+ var lastPreventedTime;
251
+ var touchCoordinates;
252
+ var lastLabelClickCoordinates;
253
+
254
+
255
+ // TAP EVENTS AND GHOST CLICKS
256
+ //
257
+ // Why tap events?
258
+ // Mobile browsers detect a tap, then wait a moment (usually ~300ms) to see if you're
259
+ // double-tapping, and then fire a click event.
260
+ //
261
+ // This delay sucks and makes mobile apps feel unresponsive.
262
+ // So we detect touchstart, touchmove, touchcancel and touchend ourselves and determine when
263
+ // the user has tapped on something.
264
+ //
265
+ // What happens when the browser then generates a click event?
266
+ // The browser, of course, also detects the tap and fires a click after a delay. This results in
267
+ // tapping/clicking twice. We do "clickbusting" to prevent it.
268
+ //
269
+ // How does it work?
270
+ // We attach global touchstart and click handlers, that run during the capture (early) phase.
271
+ // So the sequence for a tap is:
272
+ // - global touchstart: Sets an "allowable region" at the point touched.
273
+ // - element's touchstart: Starts a touch
274
+ // (- touchmove or touchcancel ends the touch, no click follows)
275
+ // - element's touchend: Determines if the tap is valid (didn't move too far away, didn't hold
276
+ // too long) and fires the user's tap handler. The touchend also calls preventGhostClick().
277
+ // - preventGhostClick() removes the allowable region the global touchstart created.
278
+ // - The browser generates a click event.
279
+ // - The global click handler catches the click, and checks whether it was in an allowable region.
280
+ // - If preventGhostClick was called, the region will have been removed, the click is busted.
281
+ // - If the region is still there, the click proceeds normally. Therefore clicks on links and
282
+ // other elements without ngTap on them work normally.
283
+ //
284
+ // This is an ugly, terrible hack!
285
+ // Yeah, tell me about it. The alternatives are using the slow click events, or making our users
286
+ // deal with the ghost clicks, so I consider this the least of evils. Fortunately Angular
287
+ // encapsulates this ugly logic away from the user.
288
+ //
289
+ // Why not just put click handlers on the element?
290
+ // We do that too, just to be sure. If the tap event caused the DOM to change,
291
+ // it is possible another element is now in that position. To take account for these possibly
292
+ // distinct elements, the handlers are global and care only about coordinates.
293
+
294
+ // Checks if the coordinates are close enough to be within the region.
295
+ function hit(x1, y1, x2, y2) {
296
+ return Math.abs(x1 - x2) < CLICKBUSTER_THRESHOLD && Math.abs(y1 - y2) < CLICKBUSTER_THRESHOLD;
297
+ }
298
+
299
+ // Checks a list of allowable regions against a click location.
300
+ // Returns true if the click should be allowed.
301
+ // Splices out the allowable region from the list after it has been used.
302
+ function checkAllowableRegions(touchCoordinates, x, y) {
303
+ for (var i = 0; i < touchCoordinates.length; i += 2) {
304
+ if (hit(touchCoordinates[i], touchCoordinates[i + 1], x, y)) {
305
+ touchCoordinates.splice(i, i + 2);
306
+ return true; // allowable region
307
+ }
308
+ }
309
+ return false; // No allowable region; bust it.
310
+ }
311
+
312
+ // Global click handler that prevents the click if it's in a bustable zone and preventGhostClick
313
+ // was called recently.
314
+ function onClick(event) {
315
+ if (Date.now() - lastPreventedTime > PREVENT_DURATION) {
316
+ return; // Too old.
317
+ }
318
+
319
+ var touches = event.touches && event.touches.length ? event.touches : [event];
320
+ var x = touches[0].clientX;
321
+ var y = touches[0].clientY;
322
+ // Work around desktop Webkit quirk where clicking a label will fire two clicks (on the label
323
+ // and on the input element). Depending on the exact browser, this second click we don't want
324
+ // to bust has either (0,0), negative coordinates, or coordinates equal to triggering label
325
+ // click event
326
+ if (x < 1 && y < 1) {
327
+ return; // offscreen
328
+ }
329
+ if (lastLabelClickCoordinates &&
330
+ lastLabelClickCoordinates[0] === x && lastLabelClickCoordinates[1] === y) {
331
+ return; // input click triggered by label click
332
+ }
333
+ // reset label click coordinates on first subsequent click
334
+ if (lastLabelClickCoordinates) {
335
+ lastLabelClickCoordinates = null;
336
+ }
337
+ // remember label click coordinates to prevent click busting of trigger click event on input
338
+ if (event.target.tagName.toLowerCase() === 'label') {
339
+ lastLabelClickCoordinates = [x, y];
340
+ }
341
+
342
+ // Look for an allowable region containing this click.
343
+ // If we find one, that means it was created by touchstart and not removed by
344
+ // preventGhostClick, so we don't bust it.
345
+ if (checkAllowableRegions(touchCoordinates, x, y)) {
346
+ return;
347
+ }
348
+
349
+ // If we didn't find an allowable region, bust the click.
350
+ event.stopPropagation();
351
+ event.preventDefault();
352
+
353
+ // Blur focused form elements
354
+ event.target && event.target.blur();
355
+ }
356
+
357
+
358
+ // Global touchstart handler that creates an allowable region for a click event.
359
+ // This allowable region can be removed by preventGhostClick if we want to bust it.
360
+ function onTouchStart(event) {
361
+ var touches = event.touches && event.touches.length ? event.touches : [event];
362
+ var x = touches[0].clientX;
363
+ var y = touches[0].clientY;
364
+ touchCoordinates.push(x, y);
365
+
366
+ $timeout(function() {
367
+ // Remove the allowable region.
368
+ for (var i = 0; i < touchCoordinates.length; i += 2) {
369
+ if (touchCoordinates[i] == x && touchCoordinates[i + 1] == y) {
370
+ touchCoordinates.splice(i, i + 2);
371
+ return;
372
+ }
373
+ }
374
+ }, PREVENT_DURATION, false);
375
+ }
376
+
377
+ // On the first call, attaches some event handlers. Then whenever it gets called, it creates a
378
+ // zone around the touchstart where clicks will get busted.
379
+ function preventGhostClick(x, y) {
380
+ if (!touchCoordinates) {
381
+ $rootElement[0].addEventListener('click', onClick, true);
382
+ $rootElement[0].addEventListener('touchstart', onTouchStart, true);
383
+ touchCoordinates = [];
384
+ }
385
+
386
+ lastPreventedTime = Date.now();
387
+
388
+ checkAllowableRegions(touchCoordinates, x, y);
389
+ }
390
+
391
+ // Actual linking function.
392
+ return function(scope, element, attr) {
393
+ var clickHandler = $parse(attr.ngClick),
394
+ tapping = false,
395
+ tapElement, // Used to blur the element after a tap.
396
+ startTime, // Used to check if the tap was held too long.
397
+ touchStartX,
398
+ touchStartY;
399
+
400
+ function resetState() {
401
+ tapping = false;
402
+ element.removeClass(ACTIVE_CLASS_NAME);
403
+ }
404
+
405
+ element.on('touchstart', function(event) {
406
+ tapping = true;
407
+ tapElement = event.target ? event.target : event.srcElement; // IE uses srcElement.
408
+ // Hack for Safari, which can target text nodes instead of containers.
409
+ if (tapElement.nodeType == 3) {
410
+ tapElement = tapElement.parentNode;
411
+ }
412
+
413
+ element.addClass(ACTIVE_CLASS_NAME);
414
+
415
+ startTime = Date.now();
416
+
417
+ var touches = event.touches && event.touches.length ? event.touches : [event];
418
+ var e = touches[0].originalEvent || touches[0];
419
+ touchStartX = e.clientX;
420
+ touchStartY = e.clientY;
421
+ });
422
+
423
+ element.on('touchmove', function(event) {
424
+ resetState();
425
+ });
426
+
427
+ element.on('touchcancel', function(event) {
428
+ resetState();
429
+ });
430
+
431
+ element.on('touchend', function(event) {
432
+ var diff = Date.now() - startTime;
433
+
434
+ var touches = (event.changedTouches && event.changedTouches.length) ? event.changedTouches :
435
+ ((event.touches && event.touches.length) ? event.touches : [event]);
436
+ var e = touches[0].originalEvent || touches[0];
437
+ var x = e.clientX;
438
+ var y = e.clientY;
439
+ var dist = Math.sqrt(Math.pow(x - touchStartX, 2) + Math.pow(y - touchStartY, 2));
440
+
441
+ if (tapping && diff < TAP_DURATION && dist < MOVE_TOLERANCE) {
442
+ // Call preventGhostClick so the clickbuster will catch the corresponding click.
443
+ preventGhostClick(x, y);
444
+
445
+ // Blur the focused element (the button, probably) before firing the callback.
446
+ // This doesn't work perfectly on Android Chrome, but seems to work elsewhere.
447
+ // I couldn't get anything to work reliably on Android Chrome.
448
+ if (tapElement) {
449
+ tapElement.blur();
450
+ }
451
+
452
+ if (!angular.isDefined(attr.disabled) || attr.disabled === false) {
453
+ element.triggerHandler('click', [event]);
454
+ }
455
+ }
456
+
457
+ resetState();
458
+ });
459
+
460
+ // Hack for iOS Safari's benefit. It goes searching for onclick handlers and is liable to click
461
+ // something else nearby.
462
+ element.onclick = function(event) { };
463
+
464
+ // Actual click handler.
465
+ // There are three different kinds of clicks, only two of which reach this point.
466
+ // - On desktop browsers without touch events, their clicks will always come here.
467
+ // - On mobile browsers, the simulated "fast" click will call this.
468
+ // - But the browser's follow-up slow click will be "busted" before it reaches this handler.
469
+ // Therefore it's safe to use this directive on both mobile and desktop.
470
+ element.on('click', function(event, touchend) {
471
+ scope.$apply(function() {
472
+ clickHandler(scope, {$event: (touchend || event)});
473
+ });
474
+ });
475
+
476
+ element.on('mousedown', function(event) {
477
+ element.addClass(ACTIVE_CLASS_NAME);
478
+ });
479
+
480
+ element.on('mousemove mouseup', function(event) {
481
+ element.removeClass(ACTIVE_CLASS_NAME);
482
+ });
483
+
484
+ };
485
+ }]);
486
+
487
+ /* global ngTouch: false */
488
+
489
+ /**
490
+ * @ngdoc directive
491
+ * @name ngSwipeLeft
492
+ *
493
+ * @description
494
+ * Specify custom behavior when an element is swiped to the left on a touchscreen device.
495
+ * A leftward swipe is a quick, right-to-left slide of the finger.
496
+ * Though ngSwipeLeft is designed for touch-based devices, it will work with a mouse click and drag
497
+ * too.
498
+ *
499
+ * To disable the mouse click and drag functionality, add `ng-swipe-disable-mouse` to
500
+ * the `ng-swipe-left` or `ng-swipe-right` DOM Element.
501
+ *
502
+ * Requires the {@link ngTouch `ngTouch`} module to be installed.
503
+ *
504
+ * @element ANY
505
+ * @param {expression} ngSwipeLeft {@link guide/expression Expression} to evaluate
506
+ * upon left swipe. (Event object is available as `$event`)
507
+ *
508
+ * @example
509
+ <example module="ngSwipeLeftExample" deps="angular-touch.js">
510
+ <file name="index.html">
511
+ <div ng-show="!showActions" ng-swipe-left="showActions = true">
512
+ Some list content, like an email in the inbox
513
+ </div>
514
+ <div ng-show="showActions" ng-swipe-right="showActions = false">
515
+ <button ng-click="reply()">Reply</button>
516
+ <button ng-click="delete()">Delete</button>
517
+ </div>
518
+ </file>
519
+ <file name="script.js">
520
+ angular.module('ngSwipeLeftExample', ['ngTouch']);
521
+ </file>
522
+ </example>
523
+ */
524
+
525
+ /**
526
+ * @ngdoc directive
527
+ * @name ngSwipeRight
528
+ *
529
+ * @description
530
+ * Specify custom behavior when an element is swiped to the right on a touchscreen device.
531
+ * A rightward swipe is a quick, left-to-right slide of the finger.
532
+ * Though ngSwipeRight is designed for touch-based devices, it will work with a mouse click and drag
533
+ * too.
534
+ *
535
+ * Requires the {@link ngTouch `ngTouch`} module to be installed.
536
+ *
537
+ * @element ANY
538
+ * @param {expression} ngSwipeRight {@link guide/expression Expression} to evaluate
539
+ * upon right swipe. (Event object is available as `$event`)
540
+ *
541
+ * @example
542
+ <example module="ngSwipeRightExample" deps="angular-touch.js">
543
+ <file name="index.html">
544
+ <div ng-show="!showActions" ng-swipe-left="showActions = true">
545
+ Some list content, like an email in the inbox
546
+ </div>
547
+ <div ng-show="showActions" ng-swipe-right="showActions = false">
548
+ <button ng-click="reply()">Reply</button>
549
+ <button ng-click="delete()">Delete</button>
550
+ </div>
551
+ </file>
552
+ <file name="script.js">
553
+ angular.module('ngSwipeRightExample', ['ngTouch']);
554
+ </file>
555
+ </example>
556
+ */
557
+
558
+ function makeSwipeDirective(directiveName, direction, eventName) {
559
+ ngTouch.directive(directiveName, ['$parse', '$swipe', function($parse, $swipe) {
560
+ // The maximum vertical delta for a swipe should be less than 75px.
561
+ var MAX_VERTICAL_DISTANCE = 75;
562
+ // Vertical distance should not be more than a fraction of the horizontal distance.
563
+ var MAX_VERTICAL_RATIO = 0.3;
564
+ // At least a 30px lateral motion is necessary for a swipe.
565
+ var MIN_HORIZONTAL_DISTANCE = 30;
566
+
567
+ return function(scope, element, attr) {
568
+ var swipeHandler = $parse(attr[directiveName]);
569
+
570
+ var startCoords, valid;
571
+
572
+ function validSwipe(coords) {
573
+ // Check that it's within the coordinates.
574
+ // Absolute vertical distance must be within tolerances.
575
+ // Horizontal distance, we take the current X - the starting X.
576
+ // This is negative for leftward swipes and positive for rightward swipes.
577
+ // After multiplying by the direction (-1 for left, +1 for right), legal swipes
578
+ // (ie. same direction as the directive wants) will have a positive delta and
579
+ // illegal ones a negative delta.
580
+ // Therefore this delta must be positive, and larger than the minimum.
581
+ if (!startCoords) return false;
582
+ var deltaY = Math.abs(coords.y - startCoords.y);
583
+ var deltaX = (coords.x - startCoords.x) * direction;
584
+ return valid && // Short circuit for already-invalidated swipes.
585
+ deltaY < MAX_VERTICAL_DISTANCE &&
586
+ deltaX > 0 &&
587
+ deltaX > MIN_HORIZONTAL_DISTANCE &&
588
+ deltaY / deltaX < MAX_VERTICAL_RATIO;
589
+ }
590
+
591
+ var pointerTypes = ['touch'];
592
+ if (!angular.isDefined(attr['ngSwipeDisableMouse'])) {
593
+ pointerTypes.push('mouse');
594
+ }
595
+ $swipe.bind(element, {
596
+ 'start': function(coords, event) {
597
+ startCoords = coords;
598
+ valid = true;
599
+ },
600
+ 'cancel': function(event) {
601
+ valid = false;
602
+ },
603
+ 'end': function(coords, event) {
604
+ if (validSwipe(coords)) {
605
+ scope.$apply(function() {
606
+ element.triggerHandler(eventName);
607
+ swipeHandler(scope, {$event: event});
608
+ });
609
+ }
610
+ }
611
+ }, pointerTypes);
612
+ };
613
+ }]);
614
+ }
615
+
616
+ // Left is negative X-coordinate, right is positive.
617
+ makeSwipeDirective('ngSwipeLeft', -1, 'swipeleft');
618
+ makeSwipeDirective('ngSwipeRight', 1, 'swiperight');
619
+
620
+
621
+
622
+ })(window, window.angular);