aboutsummaryrefslogtreecommitdiff
path: root/node_modules/montage/ui/composer/swipe-composer.js
diff options
context:
space:
mode:
Diffstat (limited to 'node_modules/montage/ui/composer/swipe-composer.js')
-rw-r--r--node_modules/montage/ui/composer/swipe-composer.js303
1 files changed, 303 insertions, 0 deletions
diff --git a/node_modules/montage/ui/composer/swipe-composer.js b/node_modules/montage/ui/composer/swipe-composer.js
new file mode 100644
index 00000000..4eb9ee3b
--- /dev/null
+++ b/node_modules/montage/ui/composer/swipe-composer.js
@@ -0,0 +1,303 @@
1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */
6/**
7 @module montage/ui/composer/swipe-composer
8 @requires montage
9 @requires montage/ui/composer/composer
10*/
11var Montage = require("montage").Montage,
12 Composer = require("ui/composer/composer").Composer;
13/**
14 @module montage/ui/composer/swipe-composer
15 */
16/**
17 @class module:montage/ui/composer/swipe-composer.SwipeComposer
18 @classdesc Detects a swipe gesture.
19 @extends module:montage/ui/composer/composer.Composer
20 */
21exports.SwipeComposer = Montage.create(Composer, /** @lends module:montage/ui/composer/swipe-composer.SwipeComposer# */ {
22
23/**
24 Description TODO
25 @function
26 @param {Element}
27 */
28 load: {
29 value: function() {
30 document.addEventListener("touchstart", this, true);
31 }
32 },
33
34/**
35 Description TODO
36 @function
37 */
38 unload: {
39 value: function() {
40 document.removeEventListener("touchstart", this, true);
41 }
42 },
43
44 /**
45 TODO
46 @private
47 */
48 _startX: {
49 enumerable: false,
50 value: 0
51 },
52
53 /**
54 TODO
55 @private
56 */
57 _startY: {
58 enumerable: false,
59 value: 0
60 },
61
62 /**
63 TODO
64 @private
65 */
66 _deltaX: {
67 enumerable: false,
68 value: 0
69 },
70
71 /**
72 TODO
73 @private
74 */
75 _deltaY: {
76 enumerable: false,
77 value: 0
78 },
79
80 /**
81 TODO
82 @private
83 */
84 _threshold: {
85 enumerable: false,
86 value: 50
87 },
88
89 /**
90 TODO
91 @private
92 */
93 _thresholdSwipeAngle: {
94 enumerable: false,
95 value: 20
96 },
97
98 /**
99 TODO
100 @private
101 */
102 _startTimestamp: {
103 enumerable: false,
104 value: 0
105 },
106
107 /**
108 TODO
109 @function
110 @param {Event} event The event.
111 */
112 captureTouchstart: {
113 value: function(event) {
114 this._reset();
115 var touches = event.touches,
116 touch = touches[0];
117 this._startX = touch.clientX;
118 this._startY = touch.clientY;
119 this._startTimestamp = event.timeStamp;
120 document.addEventListener("touchmove", this, true);
121 document.addEventListener("touchend", this, true);
122 document.addEventListener("touchcancel", this, true);
123 }
124 },
125
126 /**
127 TODO
128 @private
129 */
130 _reset: {
131 enumerable: false,
132 value: function() {
133 this._startX = 0;
134 this._startY = 0;
135 this._deltaX = 0;
136 this._deltaY = 0;
137 this._startSwipeAngle = null;
138 }
139 },
140
141 /**
142 TODO
143 @private
144 */
145 _startSwipeAngle: {
146 enumerable: false,
147 value: null
148 },
149
150 /**
151 TODO
152 @function
153 @param {Event} event The event.
154 */
155 captureTouchcancel: {
156 value: function(event) {
157 document.removeEventListener("touchmove", this, true);
158 document.removeEventListener("touchend", this, true);
159 document.removeEventListener("touchcancel", this, true);
160 }
161 },
162
163 /**
164 TODO
165 @function
166 @param {Event} event The event.
167 */
168 captureTouchmove: {
169 value: function(event) {
170 event.preventDefault();
171 var touches = event.changedTouches[0], swipeEvent, direction;
172
173 this._deltaX = touches.clientX - this._startX;
174 this._deltaY = touches.clientY - this._startY;
175
176 var dX = this._deltaX,
177 dY = this._deltaY,
178 threshold = this._threshold,
179 swipeAngle = this._findSwipeAngle(dX, dY);
180
181 if (this._startSwipeAngle != null && Math.abs(this._startSwipeAngle - swipeAngle) > this._thresholdSwipeAngle) {
182 //Direction changed; Abort touch
183 //this.captureTouchcancel();
184 this._startSwipeAngle = null;
185 }
186
187 if (this._startSwipeAngle == null) {
188 this._startSwipeAngle = swipeAngle;
189 this._startX = touches.clientX;
190 this._startY = touches.clientY;
191 this._deltaX = 0;
192 this._deltaY = 0;
193 }
194
195 if (dX > threshold && dY > threshold) {
196 direction = "DIAGONAL";
197 } else if (dX > threshold && dY < threshold) {
198 if (this._deltaX > 0) {
199 direction = "RIGHT";
200 } else {
201 direction = "LEFT";
202 }
203 } else if (dX < threshold && dY > threshold) {
204 if (this._deltaY > 0) {
205 direction = "DOWN";
206 } else {
207 direction = "UP";
208 }
209 }
210
211 swipeEvent = document.createEvent("CustomEvent");
212 swipeEvent.initCustomEvent("swipemove", true, false, null);
213 swipeEvent.direction = direction;
214 swipeEvent.angle = this._startSwipeAngle;
215 swipeEvent.velocity = this._findVelocity((event.timeStamp - this._startTimestamp));
216 swipeEvent.startX = this._startX;
217 swipeEvent.startY = this._startY;
218 swipeEvent.dX = this._deltaX;
219 swipeEvent.dY = this._deltaY;
220
221 this.dispatchEvent(swipeEvent);
222 }
223 },
224
225 /**
226 TODO
227 @private
228 */
229 _findSwipeAngle: {
230 enumerable: false,