OSDN Git Service

Version 0.6.143, fix X.UI.ScrollBox for iOS3.
[pettanr/clientJs.git] / 0.6.x / js / 20_ui / 05_XUI_Gesture.js
1 /* original:\r
2  *  Hammer.JS - v1.0.5 - 2013-04-07\r
3  *  http://eightmedia.github.com/hammer.js\r
4  *  Jorik Tangelder <j.tangelder@gmail.com>, MIT license\r
5  **/\r
6 \r
7         \r
8         var ELEENT_LIST = [],\r
9                 HAMMER_LIST = [],\r
10                 POINTERS    = [],\r
11                 ABS = new Function( 'v', 'return v<0?-v:v' );\r
12         \r
13         function Hammer( uinodeRoot, uinode, type ){\r
14                 this.uinode  = uinode;\r
15                 this.enabled = true;\r
16                 \r
17                 Hammer.startup && Hammer.startup( uinodeRoot );\r
18 \r
19                 this.options = Hammer.defaults;\r
20 \r
21                 // start detection on touchstart\r
22                 Utils.addEvents( uinode, Hammer.EVENT_TYPES_START, this );\r
23                 \r
24                 this[ 'listen' ]( type );\r
25         };\r
26         \r
27         Hammer.defaults = {};\r
28         \r
29         Hammer.prototype.handleEvent = function( e ){\r
30                 //var sourceEventType = e.type.toLowerCase();\r
31 \r
32                 var type       = IdToGestureID[ e.type ],\r
33                         gestures   = Detection.gestures,\r
34                         numTouches = 0,// count the total touches on the screen\r
35                         pointerType, i, l, touches, ret, active, gesture, startEv,\r
36                         hammer, deltaTime, deltaX, deltaY, velocity, center;\r
37                 \r
38                 //console.log( 'Hammer@handleEvent ' + XUI_Event.IdToName[ e.type ] + ' ' + e.pointerType + ' ' + type );\r
39                 if( !type ) return;\r
40                 \r
41                 //console.log( e.type + ' dw:' + XUI_Event._POINTER_DOWN + ' up:' + XUI_Event._POINTER_UP + ' mv:' + XUI_Event._POINTER_MOVE );\r
42                 \r
43                 if( e.pointerType ){\r
44                         type |= POINTER;\r
45                         switch( e.pointerType ){\r
46                                 case 'touch' :\r
47                                         type |= TOUCH; break;\r
48                                 case 'pen' :\r
49                                         type |= PEN; break;\r
50                                 case 'mouse' :\r
51                                         type |= MOUSE; break;\r
52                                 default :\r
53                                         return;\r
54                         };\r
55                 };\r
56                 \r
57                 // onmouseup, but when touchend has been fired we do nothing.\r
58                 // this is for touchdevices which also fire a mouseup on touchend\r
59                 if( type & MOUSE && touch_triggered ){\r
60                         return X_Callback_STOP_NOW | X_Callback_PREVENT_DEFAULT;\r
61                 } else\r
62                 // mousebutton must be down or a touch event\r
63                 if( type & TOUCH || //sourceEventType.match(/touch/) || // touch events are always on screen\r
64                         ( type & POINTER && type & START ) || //sourceEventType.match(/pointerdown/) || // pointerevents touch\r
65                         ( type & MOUSE   && e.button === 0 ) //(sourceEventType.match(/mouse/) && e.which === 1) // mouse is pressed\r
66                 ){\r
67                         enable_detect = true;\r
68                 };\r
69 \r
70                 //console.log( 'Hammer@handleEvent ' + IdToGestureID[ e.type ] + ' ' + e.type + ' ' + XUI_Event._POINTER_DOWN + ' ' + enable_detect );\r
71 \r
72                 // we are in a touch event, set the touch triggered bool to true,\r
73                 // this for the conflicts that may occur on ios and android\r
74                 //type & ( TOUCH | POINTER ) && ( touch_triggered = true );\r
75                 type & TOUCH && ( touch_triggered = true );\r
76                 //if (sourceEventType.match(/touch|pointer/)) { touch_triggered = true;}\r
77 \r
78                 // when touch has been triggered in this detection session\r
79                 // and we are now handling a mouse event, we stop that to prevent conflicts\r
80                 if( enable_detect ){\r
81                         // update pointerevent\r
82                         if( Hammer.HAS_POINTEREVENTS ){ //eventType !== Hammer.EVENT_END ){\r
83                                 console.log( 'e.pointerId = ' + e.pointerId );\r
84                                 POINTERS[ e.identifier = e.pointerId ] = type & END ? null : e;\r
85                                 touches = [];\r
86                                 numTouches = -1;\r
87                                 // we can use forEach since pointerEvents only is in IE10\r
88                                 for( i = 0, l = POINTERS.length; i < l; ++i ){\r
89                                         POINTERS[ i ] && ( touches[ ++numTouches ] = POINTERS[ i ] );\r
90                                 };\r
91                                 numTouches = touches.length;\r
92                                 \r
93                                 ///console.log( 'numTouches ' + numTouches );\r
94                         } else\r
95                         // touch\r
96                         if ( type & TOUCH ){ //sourceEventType.match(/touch/)) {\r
97                                 touches    = Hammer.DO_TOUCHES_FIX && type & END ? [] : e.touches;\r
98                                 numTouches = touches.length;\r
99                         } else\r
100                         // mouse\r
101                         if( !touch_triggered ){\r
102                                 numTouches = ( type & END ) ? 0 : 1;\r
103                                 touches    = numTouches === 0 ? [] : [{\r
104                                         identifier : 1,\r
105                                         pageX      : e.pageX,\r
106                                         pageY      : e.pageY,\r
107                                         target     : e.target\r
108                                 }];\r
109                         };\r
110                         // if we are in a end event, but when we remove one touch and\r
111                         // we still have enough, set eventType to move\r
112                         if( 0 < numTouches && type & END ){ // eventType === Hammer.EVENT_END ){\r
113                                 type = type & POINTER_TYPE_MASK | MOVE;\r
114                                 //eventType = Hammer.EVENT_MOVE;\r
115                         } else if( !numTouches ){\r
116                         // no touches, force the end event\r
117                                 type = type & POINTER_TYPE_MASK | END;\r
118                                 //eventType = Hammer.EVENT_END;\r
119                         };\r
120 \r
121                         // because touchend has no touches, and we often want to use these in our gestures,\r
122                         // we send the last move event as our eventData in touchend\r
123                         ( !numTouches && last_move_event !== null ) ?\r
124                                 ( e = last_move_event ):\r
125                                 ( last_move_event = e ); // store the last move event\r
126 \r
127                         e = {\r
128                                 center      : Utils.getCenter( touches ),\r
129                                 timeStamp   : e.timeStamp,\r
130                                 target      : e.target,\r
131                                 touches     : touches,\r
132                                 eventType   : type & EVENT_TYPE_MASK,\r
133                                 pointerType : type & POINTER_TYPE_MASK\r
134                         };\r
135 \r
136                         if( type & START ){\r
137                                 if( !this.enabled ) return;\r
138                                 // already busy with a Hammer.gesture detection on an element\r
139                                 if( Detection.current ) return;\r
140                                 Detection.current = {\r
141                                         hammer     : this, // reference to HammerInstance we're working for\r
142                                         startEvent : Utils.extend( {}, e ), // start eventData for distances, timing etc\r
143                                         lastEvent  : false, // last eventData\r
144                                         name       : '' // current gesture we're in/detected, can be 'tap', 'hold' etc\r
145                                 };\r
146                                 Detection.stopped = false;\r
147                                 hammer = this;\r
148                                 active = hammer.activeGesture;\r
149                         } else\r
150                         if( !Detection.current || Detection.stopped ){\r
151                                 return;\r
152                         } else {\r
153                                 hammer = Detection.current.hammer;\r
154                                 active = hammer.activeGesture;\r
155                         };\r
156                         \r
157                         // ----------------------------------------------------------------------------------------------------------------\r
158                         // ret = Detection.detect( e );\r
159 \r
160                         // ----------------------------------------------------------------------------------------------------------------\r
161                         // extend event data with calculations about scale, distance etc\r
162                         // e = Detection.extendEventData( e );\r
163                         startEv = Detection.current.startEvent;\r
164                         center  = e.center;\r
165 \r
166                         // if the touches change, set the new touches over the startEvent touches\r
167                         // this because touchevents don't have all the touches on touchstart, or the\r
168                         // user must place his fingers at the EXACT same time on the screen, which is not realistic\r
169                         // but, sometimes it happens that both fingers are touching at the EXACT same time\r
170                         if( startEv && ( numTouches !== startEv.touches.length || touches === startEv.touches ) ){\r
171                                 // extend 1 level deep to get the touchlist with the touch objects\r
172                                 startEv.touches.length = i = 0;\r
173                                 for( ; i < numTouches; ++i ){\r
174                                         startEv.touches[ startEv.touches.length ] = Utils.extend( {}, touches[ i ] );\r
175                                 };\r
176                         };\r
177 \r
178                         deltaTime = e.timeStamp  - startEv.timeStamp;\r
179                         deltaX    = center.pageX - startEv.center.pageX;\r
180                         deltaY    = center.pageY - startEv.center.pageY;\r
181                         velocity  = Utils.getVelocity( deltaTime, deltaX, deltaY );\r
182 \r
183                         Utils.extend( e, {\r
184                                 deltaTime  : deltaTime,\r
185 \r
186                                 deltaX     : deltaX,\r
187                                 deltaY     : deltaY,\r
188 \r
189                                 velocityX  : velocity.x,\r
190                                 velocityY  : velocity.y,\r
191 \r
192                                 distance   : Utils.getDistance( startEv.center, center ),\r
193                                 angle      : Utils.getAngle( startEv.center, center ),\r
194                                 direction  : Utils.getDirection( startEv.center, center ),\r
195 \r
196                                 scale      : Utils.getScale( startEv.touches, touches ),\r
197                                 rotation   : Utils.getRotation( startEv.touches, touches ),\r
198 \r
199                                 startEvent : startEv\r
200                         });\r
201 \r
202                         // store as previous event event\r
203                         Detection.current.lastEvent = e;\r
204                         \r
205                         // call Hammer.gesture handlers\r
206                         for( i = 0, l = gestures.length; i < l; ++i ){\r
207                                 gesture = gestures[ i ];\r
208                                 if( Detection.stopped ) break;\r
209                                 //if( active[ gesture.name ] ) console.log( gesture.name );\r
210                                 // only when the instance options have enabled this gesture\r
211                                 active[ gesture.name ] &&\r
212                                         // if a handler returns false, we stop with the detection\r
213                                         ( ret |= ( gesture.handler( e, hammer ) || X_Callback_NONE ) );\r
214                         };\r
215 \r
216                         // endevent, but not the last touch, so dont stop\r
217                         type & END && numTouches === 0 && Detection.stopDetect();\r
218                         \r
219                         // ----------------------------------------------------------------------------------------------------------------\r
220                         // trigger the handler\r
221                         //handler.call( context, HamEvent.collectEventData( element, eventType, e ) );\r
222 \r
223                         // remove pointerevent from list\r
224                         if( Hammer.HAS_POINTEREVENTS && type & END ){ // eventType === Hammer.EVENT_END ){\r
225                                 numTouches = 0;\r
226                         };\r
227                 };\r
228 \r
229                 //debug(sourceEventType +" "+ eventType);\r
230 \r
231                 // on the end we reset everything\r
232                 if( numTouches === 0 ){\r
233                         last_move_event = null;\r
234                         enable_detect   = false;\r
235                         touch_triggered = false;\r
236                         POINTERS.length = 0;\r
237                 };\r
238                 \r
239                 return ret;\r
240         };\r
241         \r
242         Hammer.startup = function( uinodeRoot ){\r
243                 // find what eventtypes we add listeners to\r
244                 /**\r
245                  * we have different events for each device/browser\r
246                  * determine what we need and set them in the Hammer.EVENT_TYPES constant\r
247                  */\r
248                 // determine the eventtype we want to set\r
249                 // for non pointer events browsers and mixed browsers,\r
250                 // like chrome on windows8 touch laptop         \r
251                 var types, name;\r
252 \r
253                 // Register all gestures inside Gestures\r
254                 for( name in Gestures ){\r
255                         //Gestures.hasOwnProperty( name ) && \r
256                         Detection.register( Gestures[ name ] );\r
257                 };\r
258 \r
259                 Hammer.EVENT_TYPES_START = [ XUI_Event._POINTER_DOWN ];\r
260                 types = [ XUI_Event._POINTER_MOVE, XUI_Event._POINTER_UP, XUI_Event._POINTER_CANCEL ];\r
261 \r
262                 // Add touch events on the document\r
263                 Utils.addEvents( uinodeRoot, types, Hammer.prototype.handleEvent );\r
264 \r
265                 // Hammer is ready...!\r
266                 delete Hammer.startup;\r
267         };\r
268         \r
269         Hammer.prototype.trigger = function( type, gesture ){\r
270                 if( !this.types[ type ] ) return;\r
271                 var e = Utils.extend( {}, gesture );\r
272                 e.type = type;\r
273                 return this.uinode[ 'dispatch' ]( e );\r
274         };\r
275         \r
276         Hammer.prototype.listen = function( type ){\r
277                 var gestures = Detection.gestures,\r
278                         i = gestures.length, g;\r
279                 for( ; i; ){\r
280                         g = gestures[ --i ];\r
281                         if( g.startID <= type && type <= g.endID ){\r
282                                 if( !this.activeGesture ) this.activeGesture = {};\r
283                                 if( !this.types ) this.types = {};\r
284                                 this.activeGesture[ g.name ] = this.types[ type ] = 1;\r
285                                 return;\r
286                         };\r
287                 };\r
288         };\r
289         \r
290         Hammer.prototype.unlisten = function( type ){\r
291                 var gestures = Detection.gestures,\r
292                         i = gestures.length, g;\r
293                 if( !this.activeGesture ) return;\r
294                 for( ; i; ){\r
295                         g = gestures[ --i ];\r
296                         if( g.startID <= type && type <= g.endID ){\r
297                                 if( this.activeGesture[ g.name ] ){\r
298                                         if( this.types[ type ] ) delete this.types[ type ];\r
299                                         for( i = g.startID; i <= g.endID; ++i ){\r
300                                                 if( this.types[ i ] ) return;\r
301                                         };\r
302                                         delete this.activeGesture[ g.name ];\r
303                                 };\r
304                                 return;\r
305                         };\r
306                 };\r
307         };\r
308         \r
309         /*\r
310          *  "Android version < 2.2" return ev.touches.length === 1 when touchend, others return ev.touches.length === 0\r
311          */\r
312         Hammer.DO_TOUCHES_FIX = Hammer.HAS_TOUCHEVENTS && ( X_UA[ 'Android' ] < 2.2 || X_UA[ 'Blink' ] || X_UA[ 'Opera' ] );\r
313         \r
314         // detect touchevents\r
315         Hammer.HAS_POINTEREVENTS = true; // navigator.pointerEnabled || navigator.msPointerEnabled;\r
316         Hammer.HAS_POINTEREVENTS && console.log( 'Hammer.HAS_POINTEREVENTS : true' );\r
317 \r
318 \r
319         // eventtypes per touchevent (start, move, end)\r
320         // are filled by HamEvent.determineEventTypes on setup\r
321         Hammer.EVENT_TYPES_START = null;\r
322 \r
323         // direction defines\r
324         Hammer.DIRECTION_DOWN  = 'down';\r
325         Hammer.DIRECTION_LEFT  = 'left';\r
326         Hammer.DIRECTION_UP    = 'up';\r
327         Hammer.DIRECTION_RIGHT = 'right';\r
328 \r
329         // plugins namespace\r
330         Hammer.plugins = {};\r
331 \r
332         var POINTER     = 1,\r
333                 TOUCH       = 2,\r
334                 PEN         = 8, //4,\r
335                 MOUSE       = 8,\r
336                 START       = 16,\r
337                 MOVE        = 32,\r
338                 END         = 64,\r
339                 CANCEL      = 128,\r
340                 EVENT_TYPE_MASK   = START | MOVE | END,\r
341                 POINTER_TYPE_MASK = POINTER | TOUCH | MOUSE | PEN,\r
342                 IdToGestureID = {};\r
343         IdToGestureID[ XUI_Event._POINTER_DOWN   ] = START;\r
344         IdToGestureID[ XUI_Event._POINTER_MOVE   ] = MOVE;\r
345         IdToGestureID[ XUI_Event._POINTER_UP     ] = END;\r
346         IdToGestureID[ XUI_Event._POINTER_CANCEL ] = END;\r
347         \r
348         var Utils = {\r
349                 \r
350                 /**\r
351                  * touch events with mouse fallback\r
352                  * @param   {HTMLElement}   element\r
353                  * @param   {String}        eventType        like Hammer.EVENT_MOVE\r
354                  * @param   {Function}      handler\r
355                  */\r
356                 addEvents : function( uinode, types, context ){\r
357                         for( var i = 0; i < types.length; ++i ){\r
358                                 uinode[ 'listen' ]( types[ i ], context );\r
359                         };\r
360                 },\r
361                 \r
362                 /**\r
363                  * extend method,\r
364                  * also used for cloning when dest is an empty object\r
365                  * @param   {Object}    dest\r
366                  * @param   {Object}    src\r
367                  * @parm        {Boolean}       merge           do a merge\r
368                  * @returns {Object}    dest\r
369                  */\r
370                 extend : function extend( dest, src, merge ){\r
371                         for( var key in src ){\r
372                                 if( dest[ key ] !== undefined && merge ) continue;\r
373                                 dest[ key ] = src[ key ];\r
374                         };\r
375                         return dest;\r
376                 },\r
377 \r
378                 /**\r
379                  * find if a node is in the given parent\r
380                  * used for event delegation tricks\r
381                  * @param   {HTMLElement}   node\r
382                  * @param   {HTMLElement}   parent\r
383                  * @returns {boolean}       has_parent\r
384                  */\r
385                 hasParent : function( node, parent ){\r
386                         while( node && node.tagName ){ /* tagName for ie */\r
387                                 if( node === parent ) return true;\r
388                                 node = node.parentNode;\r
389                         };\r
390                         return false;\r
391                 },\r
392 \r
393                 /**\r
394                  * get the center of all the touches\r
395                  * @param   {Array}     touches\r
396                  * @returns {Object}    center\r
397                  */\r
398                 getCenter : function getCenter(touches) {\r
399                         var i = 0,\r
400                                 l = touches.length,\r
401                                 valuesX, valuesY;\r
402                         switch( l ){\r
403                                 case 0 :\r
404                                         return {};\r
405                                 case 1 :\r
406                                         return {\r
407                                                 pageX : touches[ 0 ].pageX,\r
408                                                 pageY : touches[ 0 ].pageY\r
409                                         };\r
410                                 case 2 :\r
411                                         return {\r
412                                                 pageX : ( touches[ 0 ].pageX + touches[ 1 ].pageX ) / 2,\r
413                                                 pageY : ( touches[ 0 ].pageY + touches[ 1 ].pageY ) / 2\r
414                                         };\r
415                         };\r
416                         valuesX = [];\r
417                         valuesY = [];\r
418                         for( ; i < l; ++i ){\r
419                                 valuesX[ valuesX.length ] = touches[ i ].pageX;\r
420                                 valuesY[ valuesY.length ] = touches[ i ].pageY;\r
421                         };\r
422                         return {\r
423                                 pageX : ( ( Math.min.apply( null, valuesX ) + Math.max.apply( null, valuesX ) ) / 2 ),\r
424                                 pageY : ( ( Math.min.apply( null, valuesY ) + Math.max.apply( null, valuesY ) ) / 2 )\r
425                         };\r
426                 },\r
427 \r
428                 /**\r
429                  * calculate the velocity between two points\r
430                  * @param   {Number}    deltaTime\r
431                  * @param   {Number}    deltaX\r
432                  * @param   {Number}    deltaY\r
433                  * @returns {Object}    velocity\r
434                  */\r
435                 getVelocity : function getVelocity( deltaTime, deltaX, deltaY ) {\r
436                         return {\r
437                                 x : ABS( deltaX / deltaTime ) || 0,\r
438                                 y : ABS( deltaY / deltaTime ) || 0\r
439                         };\r
440                 },\r
441 \r
442                 /**\r
443                  * calculate the angle between two coordinates\r
444                  * @param   {Touch}     touch1\r
445                  * @param   {Touch}     touch2\r
446                  * @returns {Number}    angle\r
447                  */\r
448                 getAngle : function getAngle(touch1, touch2) {\r
449                         var y = touch2.pageY - touch1.pageY,\r
450                                 x = touch2.pageX - touch1.pageX;\r
451                         return Math.atan2( y, x ) * 180 / Math.PI;\r
452                 },\r
453 \r
454                 /**\r
455                  * angle to direction define\r
456                  * @param   {Touch}     touch1\r
457                  * @param   {Touch}     touch2\r
458                  * @returns {String}    direction constant, like Hammer.DIRECTION_LEFT\r
459                  */\r
460                 getDirection : function getDirection( touch1, touch2 ){\r
461                         var x = touch1.pageX - touch2.pageX,\r
462                                 y = touch1.pageY - touch2.pageY;\r
463                         return ABS( y ) <= ABS( x ) ?\r
464                                 ( x > 0 ? Hammer.DIRECTION_LEFT : Hammer.DIRECTION_RIGHT ) :\r
465                                 ( y > 0 ? Hammer.DIRECTION_UP   : Hammer.DIRECTION_DOWN );\r
466                 },\r
467 \r
468                 /**\r
469                  * calculate the distance between two touches\r
470                  * @param   {Touch}     touch1\r
471                  * @param   {Touch}     touch2\r
472                  * @returns {Number}    distance\r
473                  */\r
474                 getDistance : function getDistance( touch1, touch2 ){\r
475                         var x = touch2.pageX - touch1.pageX,\r
476                                 y = touch2.pageY - touch1.pageY;\r
477                         return Math.sqrt( ( x * x ) + ( y * y ) );\r
478                 },\r
479 \r
480                 /**\r
481                  * calculate the scale factor between two touchLists (fingers)\r
482                  * no scale is 1, and goes down to 0 when pinched together, and bigger when pinched out\r
483                  * @param   {Array}     start\r
484                  * @param   {Array}     end\r
485                  * @returns {Number}    scale\r
486                  */\r
487                 getScale : function getScale( start, end ){\r
488                         // need two fingers...\r
489                         return ( 2 <= start.length && 2 <= end.length ) ?\r
490                                 Utils.getDistance( end[ 0 ], end[ 1 ] ) / Utils.getDistance( start[ 0 ], start[ 1 ] ) :\r
491                                 1;\r
492                 },\r
493 \r
494                 /**\r
495                  * calculate the rotation degrees between two touchLists (fingers)\r
496                  * @param   {Array}     start\r
497                  * @param   {Array}     end\r
498                  * @returns {Number}    rotation\r
499                  */\r
500                 getRotation : function getRotation( start, end ){\r
501                         // need two fingers\r
502                         return ( 2 <= start.length && 2 <= end.length ) ?\r
503                                 Utils.getAngle( end[ 1 ], end[ 0 ] ) - Utils.getAngle( start[ 1 ], start[ 0 ] ) :\r
504                                 0;\r
505                 },\r
506 \r
507                 /**\r
508                  * boolean if the direction is vertical\r
509                  * @param    {String}    direction\r
510                  * @returns  {Boolean}   is_vertical\r
511                  */\r
512                 isVertical : function isVertical( direction ){\r
513                         return direction === Hammer.DIRECTION_UP || direction === Hammer.DIRECTION_DOWN;\r
514                 }\r
515         };\r
516         \r
517         /**\r
518          * this holds the last move event,\r
519          * used to fix empty touchend issue\r
520          * see the onTouch event for an explanation\r
521          * @type {Object}\r
522          */\r
523         var last_move_event = null;\r
524 \r
525         /**\r
526          * when the mouse is hold down, this is true\r
527          * @type {Boolean}\r
528          */\r
529         var enable_detect = false;\r
530 \r
531         /**\r
532          * when touch events have been fired, this is true\r
533          * @type {Boolean}\r
534          */\r
535         var touch_triggered = false;\r
536         \r
537         var Detection = {\r
538                 // contains all registred Gestures in the correct order\r
539                 gestures : [],\r
540 \r
541                 // data of the current Hammer.gesture detection session\r
542                 current : null,\r
543 \r
544                 // the previous Hammer.gesture session data\r
545                 // is a full clone of the previous gesture.current object\r
546                 previous : null,\r
547 \r
548                 // when this becomes true, no gestures are fired\r
549                 stopped : false,\r
550 \r
551                 /**\r
552                  * clear the Hammer.gesture vars\r
553                  * this is called on endDetect, but can also be used when a final Hammer.gesture has been detected\r
554                  * to stop other Gestures from being fired\r
555                  */\r
556                 stopDetect : function stopDetect() {\r
557                         // clone current data to the store as the previous gesture\r
558                         // used for the double tap gesture, since this is an other gesture detect session\r
559                         Detection.previous = Utils.extend( {}, Detection.current );\r
560 \r
561                         // reset the current\r
562                         Detection.current = null;\r
563 \r
564                         // stopped!\r
565                         Detection.stopped = true;\r
566                 },\r
567 \r
568                 /**\r
569                  * register new gesture\r
570                  * @param   {Object}    gesture object, see gestures.js for documentation\r
571                  * @returns {Array}     gestures\r
572                  */\r
573                 register : function( gesture ){\r
574                         // add an enable gesture options if there is no given\r
575                         var options = gesture.defaults || {},\r
576                                 list    = Detection.gestures,\r
577                                 _index, i = 0, l = list.length, index;\r
578                         if( options[ gesture.name ] === undefined ) options[ gesture.name ] = true;\r
579 \r
580                         // extend Hammer default options with the Hammer.gesture options\r
581                         Utils.extend( Hammer.defaults, options, true );\r
582 \r
583                         // set its index\r
584                         gesture.index = gesture.index || 1000;\r
585 \r
586                         // add Hammer.gesture to the list\r
587                         //Detection.gestures.push( gesture );\r
588 \r
589                         // sort the list by index\r
590                         //Detection.gestures.sort( function( a, b ){\r
591                         //      return\r
592                         //              a.index < b.index ? -1 :\r
593                         //              a.index > b.index ? 1 : 0;\r
594                         //});\r
595                         if( l === 0 ){\r
596                                 list[ 0 ] = gesture;\r
597                                 return;\r
598                         };\r
599                         _index = gesture.index;\r
600                         for( i = 0; i < l; ++i ){\r
601                                 index = list[ i ].index;\r
602                                 if( i === 0 && _index < index ){\r
603                                         list.unshift( gesture );\r
604                                         return;\r
605                                 } else\r
606                                 if( i === l - 1 ){\r
607                                         list[ l ] = gesture;\r
608                                         return;\r
609                                 } else\r
610                                 if( index <= _index && _index < list[ i + 1 ].index ){\r
611                                         list.splice( i, 0, gesture );\r
612                                         return;\r
613                                 };\r
614                         };\r
615                 }\r
616         };\r
617 \r
618         var Gestures = Gestures || {};\r
619 \r
620         /**\r
621          * Custom gestures\r
622          * ==============================\r
623          *\r
624          * Gesture object\r
625          * --------------------\r
626          * The object structure of a gesture:\r
627          *\r
628          * { name: 'mygesture',\r
629          *   index: 1337,\r
630          *   defaults: {\r
631          *     mygesture_option: true\r
632          *   }\r
633          *   handler: function(type, e, inst) {\r
634          *     // trigger gesture event\r
635          *     inst.trigger(this.name, e );\r
636          *   }\r
637          * }\r
638 \r
639          * @param   {String}    name\r
640          * this should be the name of the gesture, lowercase\r
641          * it is also being used to disable/enable the gesture per instance config.\r
642          *\r
643          * @param   {Number}    [index=1000]\r
644          * the index of the gesture, where it is going to be in the stack of gestures detection\r
645          * like when you build an gesture that depends on the drag gesture, it is a good\r
646          * idea to place it after the index of the drag gesture.\r
647          *\r
648          * @param   {Object}    [defaults={}]\r
649          * the default settings of the gesture. these are added to the instance settings,\r
650          * and can be overruled per instance. you can also add the name of the gesture,\r
651          * but this is also added by default (and set to true).\r
652          *\r
653          * @param   {Function}  handler\r
654          * this handles the gesture detection of your custom gesture and receives the\r
655          * following arguments:\r
656          *\r
657          *      @param  {Object}    eventData\r
658          *      event data containing the following properties:\r
659          *          timeStamp   {Number}        time the event occurred\r
660          *          target      {HTMLElement}   target element\r
661          *          touches     {Array}         touches (fingers, pointers, mouse) on the screen\r
662          *          pointerType {String}        kind of pointer that was used. matches Hammer.POINTER_MOUSE|TOUCH\r
663          *          center      {Object}        center position of the touches. contains pageX and pageY\r
664          *          deltaTime   {Number}        the total time of the touches in the screen\r
665          *          deltaX      {Number}        the delta on x axis we haved moved\r
666          *          deltaY      {Number}        the delta on y axis we haved moved\r
667          *          velocityX   {Number}        the velocity on the x\r
668          *          velocityY   {Number}        the velocity on y\r
669          *          angle       {Number}        the angle we are moving\r
670          *          direction   {String}        the direction we are moving. matches Hammer.DIRECTION_UP|DOWN|LEFT|RIGHT\r
671          *          distance    {Number}        the distance we haved moved\r
672          *          scale       {Number}        scaling of the touches, needs 2 touches\r
673          *          rotation    {Number}        rotation of the touches, needs 2 touches *\r
674          *          eventType   {String}        matches Hammer.EVENT_START|MOVE|END\r
675          *          srcEvent    {Object}        the source event, like TouchStart or MouseDown *\r
676          *          startEvent  {Object}        contains the same properties as above,\r
677          *                                      but from the first touch. this is used to calculate\r
678          *                                      distances, deltaTime, scaling etc\r
679          *\r
680          *      @param  {Hammer.Instance}    inst\r
681          *      the instance we are doing the detection for. you can get the options from\r
682          *      the inst.options object and trigger the gesture event by calling inst.trigger\r
683          *\r
684          *\r
685          * Handle gestures\r
686          * --------------------\r
687          * inside the handler you can get/set Detection.current. This is the current\r
688          * detection session. It has the following properties\r
689          *      @param  {String}    name\r
690          *      contains the name of the gesture we have detected. it has not a real function,\r
691          *      only to check in other gestures if something is detected.\r
692          *      like in the drag gesture we set it to 'drag' and in the swipe gesture we can\r
693          *      check if the current gesture is 'drag' by accessing Detection.current.name\r
694          *\r
695          *      @readonly\r
696          *      @param  {Hammer.Instance}    inst\r
697          *      the instance we do the detection for\r
698          *\r
699          *      @readonly\r
700          *      @param  {Object}    startEvent\r
701          *      contains the properties of the first gesture detection in this session.\r
702          *      Used for calculations about timing, distance, etc.\r
703          *\r
704          *      @readonly\r
705          *      @param  {Object}    lastEvent\r
706          *      contains all the properties of the last gesture detect in this session.\r
707          *\r
708          * after the gesture detection session has been completed (user has released the screen)\r
709          * the Detection.current object is copied into Detection.previous,\r
710          * this is usefull for gestures like doubletap, where you need to know if the\r
711          * previous gesture was a tap\r
712          *\r
713          * options that have been set by the instance can be received by calling inst.options\r
714          *\r
715          * You can trigger a gesture event by calling inst.trigger("mygesture", event).\r
716          * The first param is the name of your gesture, the second the event argument\r
717          *\r
718          *\r
719          * Register gestures\r
720          * --------------------\r
721          * When an gesture is added to the Gestures object, it is auto registered\r
722          * at the setup of the first Hammer instance. You can also call Detection.register\r
723          * manually and pass your gesture object as a param\r
724          *\r
725          */\r
726 \r
727         /**\r
728          * Hold\r
729          * Touch stays at the same place for x time\r
730          * @events  hold holdend\r
731          */\r
732         Gestures.Hold = {\r
733                 name    : 'hold',\r
734                 index   : 10,\r
735                 startID : XUI_Event.HOLD,\r
736                 endID   : XUI_Event.HOLD_END,\r
737                 defaults : {\r
738                         hold_timeout   : 500,\r
739                         hold_threshold : 1\r
740                 },\r
741                 timerID : null,\r
742                 holding : false,\r
743                 handler : function holdGesture( e, hammer ){\r
744                         switch( e.eventType ){\r
745                                 case START :\r
746                                         // clear any running timers\r
747                                         this.timerID && X_Timer_remove( this.timerID );\r
748 \r
749                                         // set the gesture so we can check in the timeout if it still is\r
750                                         Detection.current.name = this.name;\r
751                                         Gestures.Hold.holding = false;\r
752                                         \r
753                                         // set timer and if after the timeout it still is hold,\r
754                                         // we trigger the hold event\r
755                                         this.timerID = X_Timer_add( hammer.options.hold_timeout, 1, Gestures.Hold._onTimer, [ e, hammer ] );\r
756                                         return;\r
757 \r
758                                 // when you move or end we clear the timer\r
759                                 case MOVE :\r
760                                         if( e.distance <= hammer.options.hold_threshold ) return;\r
761                                 case END :\r
762                                         this.timerID && X_Timer_remove( this.timerID );\r
763                                         if( Gestures.Hold.holding === true ){\r
764                                                 Gestures.Hold.holding = false;\r
765                                                 return hammer.trigger( XUI_Event.HOLD_END, e );\r
766                                         };\r
767                                         break;\r
768                         };\r
769                 },\r
770                 _onTimer : function( e, hammer ){\r
771                         if( Detection.current.name === 'hold' ){\r
772                                 hammer.trigger( XUI_Event.HOLD, e );\r
773                                 Gestures.Hold.holding = true;\r
774                         };\r
775                 }\r
776         };\r
777 \r
778         /**\r
779          * Tap/DoubleTap\r
780          * Quick touch at a place or double at the same place\r
781          * @events  tap, doubletap\r
782          */\r
783         Gestures.Tap = {\r
784                 name     : 'tap',\r
785                 index    : 100,\r
786                 startID  : XUI_Event.TAP,\r
787                 endID    : XUI_Event.DOUBLE_TAP,\r
788                 defaults : {\r
789                         tap_max_touchtime  : 250,\r
790                         tap_max_distance   : 10,\r
791                         tap_always         : true,\r
792                         doubletap_distance : 20,\r
793                         doubletap_interval : 300\r
794                 },\r
795                 handler : function tapGesture( e, hammer ){\r
796                         // previous gesture, for the double tap since these are two different gesture detections\r
797                         var prev = Detection.previous;\r
798                         if( e.eventType === END ){\r
799                                 // when the touchtime is higher then the max touch time\r
800                                 // or when the moving distance is too much\r
801                                 if( hammer.options.tap_max_touchtime < e.deltaTime || hammer.options.tap_max_distance < e.distance ) return;\r
802 \r
803                                 // check if double tap\r
804                                 if( prev && prev.name === 'tap' && ( e.timeStamp - prev.lastEvent.timeStamp ) < hammer.options.doubletap_interval && e.distance < hammer.options.doubletap_distance ){\r
805                                         return hammer.trigger( XUI_Event.DOUBLE_TAP, e );\r
806                                 } else\r
807                                 // do a single tap\r
808                                 if( hammer.options.tap_always && Detection.current.name !== 'tap' ){ // EventFire中にalert すると mouseleave で再び呼ばれるのを防ぐ\r
809                                         Detection.current.name = 'tap';\r
810                                         return hammer.trigger( XUI_Event.TAP, e );\r
811                                 };\r
812                         };\r
813                 }\r
814         };\r
815 \r
816         /**\r
817          * Swipe\r
818          * triggers swipe events when the end velocity is above the threshold\r
819          * @events  swipe, swipeleft, swiperight, swipeup, swipedown\r
820          */\r
821         Gestures.Swipe = {\r
822                 name     : 'swipe',\r
823                 index    : 40,\r
824                 startID  : XUI_Event.SWIP,\r
825                 endID    : XUI_Event.SWIP_DOWN,\r
826                 defaults : {\r
827                         // set 0 for unlimited, but this can conflict with transform\r
828                         swipe_max_touches : 1,\r
829                         swipe_velocity    : 0.7\r
830                 },\r
831                 handler : function swipeGesture(e, hammer) {\r
832                         if( e.eventType === END ){\r
833                                 // max touches\r
834                                 if( 0 < hammer.options.swipe_max_touches && hammer.options.swipe_max_touches < e.touches.length ) return;\r
835 \r
836                                 // when the distance we moved is too small we skip this gesture\r
837                                 // or we can be already in dragging\r
838                                 if( hammer.options.swipe_velocity < e.velocityX || hammer.options.swipe_velocity < e.velocityY ){\r
839                                         // trigger swipe events\r
840                                         hammer.trigger( XUI_Event.SWIP, e );\r
841                                         hammer.trigger(\r
842                                                 e.direction === Hammer.DIRECTION_UP ?\r
843                                                         XUI_Event.SWIP_UP :\r
844                                                 e.direction === Hammer.DIRECTION_DOWN ?\r
845                                                         XUI_Event.SWIP_DOWN :\r
846                                                 e.direction === Hammer.DIRECTION_LEFT ?\r
847                                                         XUI_Event.SWIP_LEFT :\r
848                                                         XUI_Event.SWIP_RIGHT,\r
849                                                 e\r
850                                         );\r
851                                 };\r
852                         };\r
853                 }\r
854         };\r
855 \r
856         /**\r
857          * Drag\r
858          * Move with x fingers (default 1) around on the page. Blocking the scrolling when\r
859          * moving left and right is a good practice. When all the drag events are blocking\r
860          * you disable scrolling on that area.\r
861          * @events  drag, dragstart, dragend, drapleft, dragright, dragup, dragdown\r
862          */\r
863         Gestures.Drag = {\r
864                 name     : 'drag',\r
865                 index    : 50,\r
866                 startID  : XUI_Event.DRAG,\r
867                 endID    : XUI_Event.DRAG_DOWN,\r
868                 defaults : {\r
869                         drag_min_distance : 10,\r
870                         // set 0 for unlimited, but this can conflict with transform\r
871                         drag_max_touches : 1,\r
872                         // prevent default browser behavior when dragging occurs\r
873                         // be careful with it, it makes the element a blocking element\r
874                         // when you are using the drag gesture, it is a good practice to set this true\r
875                         drag_block_horizontal : false,\r
876                         drag_block_vertical : false,\r
877                         // drag_lock_to_axis keeps the drag gesture on the axis that it started on,\r
878                         // It disallows vertical directions if the initial direction was horizontal, and vice versa.\r
879                         drag_lock_to_axis : false,\r
880                         // drag lock only kicks in when distance > drag_lock_min_distance\r
881                         // This way, locking occurs only when the distance has become large enough to reliably determine the direction\r
882                         drag_lock_min_distance : 25\r
883                 },\r
884                 triggered : false,\r
885                 handler : function dragGesture( e, hammer ){\r
886                         var last_direction;\r
887                         // current gesture isnt drag, but dragged is true\r
888                         // this means an other gesture is busy. now call dragend\r
889                         if( Detection.current.name !== this.name && this.triggered ){\r
890                                 hammer.trigger( XUI_Event.DRAG_END, e );\r
891                                 this.triggered = false;\r
892                                 return;\r
893                         };\r
894 \r
895                         // max touches\r
896                         if( 0 < hammer.options.drag_max_touches && hammer.options.drag_max_touches < e.touches.length ) return;\r
897 \r
898                         switch( e.eventType ){\r
899                                 case START:\r
900                                         this.triggered = false;\r
901                                         break;\r
902 \r
903                                 case MOVE :\r
904                                         // when the distance we moved is too small we skip this gesture\r
905                                         // or we can be already in dragging\r
906                                         if( e.distance < hammer.options.drag_min_distance && Detection.current.name !== this.name ) return;\r
907 \r
908                                         // we are dragging!\r
909                                         Detection.current.name = this.name;\r
910 \r
911                                         // lock drag to axis?\r
912                                         if( Detection.current.lastEvent.drag_locked_to_axis || ( hammer.options.drag_lock_to_axis && hammer.options.drag_lock_min_distance <= e.distance ) ){\r
913                                                 e.drag_locked_to_axis = true;\r
914                                         };\r
915                                         last_direction = Detection.current.lastEvent.direction;\r
916                                         if( e.drag_locked_to_axis && last_direction !== e.direction ){\r
917                                                 // keep direction on the axis that the drag gesture started on\r
918                                                 e.direction = Utils.isVertical( last_direction ) ?\r
919                                                         ( e.deltaY < 0 ? Hammer.DIRECTION_UP   : Hammer.DIRECTION_DOWN ) :\r
920                                                         ( e.deltaX < 0 ? Hammer.DIRECTION_LEFT : Hammer.DIRECTION_RIGHT );\r
921                                         };\r
922 \r
923                                         // first time, trigger dragstart event\r
924                                         if( !this.triggered ){\r
925                                                 hammer.trigger( XUI_Event.DRAG_START, e );\r
926                                                 this.triggered = true;\r
927                                         };\r
928 \r
929                                         // trigger normal event\r
930                                         hammer.trigger( XUI_Event.DRAG, e );\r
931 \r
932                                         // direction event, like dragdown\r
933                                         hammer.trigger(\r
934                                                 e.direction === Hammer.DIRECTION_UP ?\r
935                                                         XUI_Event.DRAG_UP :\r
936                                                 e.direction === Hammer.DIRECTION_DOWN ?\r
937                                                         XUI_Event.DRAG_DOWN :\r
938                                                 e.direction === Hammer.DIRECTION_LEFT ?\r
939                                                         XUI_Event.DRAG_LEFT :\r
940                                                         XUI_Event.DRAG_RIGHT,\r
941                                                 e\r
942                                         );\r
943 \r
944                                         // block the browser events\r
945                                         (\r
946                                                 ( hammer.options.drag_block_vertical   &&  Utils.isVertical( e.direction ) ) ||\r
947                                                 ( hammer.options.drag_block_horizontal && !Utils.isVertical( e.direction ) )\r
948                                         ) && e.preventDefault();\r
949                                         break;\r
950 \r
951                                 case END:\r
952                                         // trigger dragend\r
953                                         this.triggered && hammer.trigger( XUI_Event.DRAG_END, e );\r
954                                         this.triggered = false;\r
955                                         break;\r
956                         }\r
957                 }\r
958         };\r
959 \r
960         /**\r
961          * Transform\r
962          * User want to scale or rotate with 2 fingers\r
963          * @events  transform, transformstart, transformend, pinch, pinchin, pinchout, rotate\r
964          */\r
965         Gestures.Transform = {\r
966                 name     : 'transform',\r
967                 index    : 45,\r
968                 startID  : XUI_Event.TRANSFORM,\r
969                 endID    : XUI_Event.ROTATE,\r
970                 defaults : {\r
971                         // factor, no scale is 1, zoomin is to 0 and zoomout until higher then 1\r
972                         transform_min_scale : 0.01,\r
973                         // rotation in degrees\r
974                         transform_min_rotation : 1,\r
975                         // prevent default browser behavior when two touches are on the screen\r
976                         // but it makes the element a blocking element\r
977                         // when you are using the transform gesture, it is a good practice to set this true\r
978                         transform_always_block : false\r
979                 },\r
980                 triggered : false,\r
981                 handler : function transformGesture( e, hammer ){\r
982                         // current gesture isnt drag, but dragged is true\r
983                         // this means an other gesture is busy. now call dragend\r
984                         if( Detection.current.name !== this.name && this.triggered ){\r
985                                 hammer.trigger( XUI_Event.TRANSFORM_END, e );\r
986                                 this.triggered = false;\r
987                                 return;\r
988                         };\r
989 \r
990                         // atleast multitouch\r
991                         if( e.touches.length < 2 ) return;\r
992 \r
993                         // prevent default when two fingers are on the screen\r
994                         hammer.options.transform_always_block && e.preventDefault();\r
995 \r
996                         switch(e.eventType) {\r
997                                 case START:\r
998                                         this.triggered = false;\r
999                                         break;\r
1000 \r
1001                                 case MOVE:\r
1002                                         var scale_threshold    = ABS( 1 - e.scale ),\r
1003                                                 rotation_threshold = ABS( e.rotation );\r
1004 \r
1005                                         // when the distance we moved is too small we skip this gesture\r
1006                                         // or we can be already in dragging\r
1007                                         if( scale_threshold < hammer.options.transform_min_scale && rotation_threshold < hammer.options.transform_min_rotation ) return;\r
1008 \r
1009                                         // we are transforming!\r
1010                                         Detection.current.name = this.name;\r
1011 \r
1012                                         // first time, trigger dragstart event\r
1013                                         if( !this.triggered ){\r
1014                                                 hammer.trigger( XUI_Event.TRANSFORM_START, e );\r
1015                                                 this.triggered = true;\r
1016                                         };\r
1017 \r
1018                                         hammer.trigger( XUI_Event.TRANSFORM, e );\r
1019                                         // basic transform event\r
1020 \r
1021                                         // trigger rotate event\r
1022                                         hammer.options.transform_min_rotation < rotation_threshold && hammer.trigger( XUI_Event.ROTATE, e );\r
1023 \r
1024                                         // trigger pinch event\r
1025                                         if( scale_threshold > hammer.options.transform_min_scale ){\r
1026                                                 hammer.trigger( XUI_Event.PINCH, e );\r
1027                                                 hammer.trigger( e.scale < 1 ? XUI_Event.PINCH_IN : XUI_Event.PINCH_OUT, e );\r
1028                                         };\r
1029                                         break;\r
1030 \r
1031                                 case END:\r
1032                                         // trigger dragend\r
1033                                         this.triggered && hammer.trigger( XUI_Event.TRANSFORM_END, e );\r
1034                                         this.triggered = false;\r
1035                                         break;\r
1036                         };\r
1037                 }\r
1038         };\r
1039 \r
1040         /**\r
1041          * Touch\r
1042          * Called as first, tells the user has touched the screen\r
1043          * @events  touch\r
1044          */\r
1045         Gestures.Touch = {\r
1046                 name     : 'touch',\r
1047                 index    : -Infinity,\r
1048                 defaults : {\r
1049                         // call preventDefault at touchstart, and makes the element blocking by\r
1050                         // disabling the scrolling of the page, but it improves gestures like\r
1051                         // transforming and dragging.\r
1052                         // be careful with using this, it can be very annoying for users to be stuck\r
1053                         // on the page\r
1054                         prevent_default : false,\r
1055 \r
1056                         // disable mouse events, so only touch (or pen!) input triggers events\r
1057                         prevent_mouseevents : false\r
1058                 },\r
1059                 handler : function touchGesture( e, hammer ){\r
1060                         if( hammer.options.prevent_mouseevents && e.pointerType === MOUSE ){\r
1061                                 Detection.stopDetect();\r
1062                                 return;\r
1063                         };\r
1064 \r
1065                         hammer.options.prevent_default && e.preventDefault();\r
1066 \r
1067                         e.eventType === START && hammer.trigger( this.name, e );\r
1068                 }\r
1069         };\r
1070 \r
1071         /**\r
1072          * Release\r
1073          * Called as last, tells the user has released the screen\r
1074          * @events  release\r
1075          */\r
1076         Gestures.Release = {\r
1077                 name    : 'release',\r
1078                 index   : Infinity,\r
1079                 handler : function releaseGesture( e, hammer ){\r
1080                         e.eventType === END && hammer.trigger( this.name, e );\r
1081                 }\r
1082         };\r