2 * "events" plugin - Handles events
5 (function( $, window, undefined ) {
7 // add new event shortcuts
8 $.each( ( "touchstart touchmove touchend orientationchange throttledresize " +
9 "tap taphold swipe swipeleft swiperight scrollstart scrollstop" ).split( " " ), function( i, name ) {
11 $.fn[ name ] = function( fn ) {
12 return fn ? this.bind( name, fn ) : this.trigger( name );
15 $.attrFn[ name ] = true;
18 var supportTouch = $.support.touch,
19 scrollEvent = "touchmove scroll",
20 touchStartEvent = supportTouch ? "touchstart" : "mousedown",
21 touchStopEvent = supportTouch ? "touchend" : "mouseup",
22 touchMoveEvent = supportTouch ? "touchmove" : "mousemove";
24 function triggerCustomEvent( obj, eventType, event ) {
25 var originalType = event.type;
26 event.type = eventType;
27 $.event.handle.call( obj, event );
28 event.type = originalType;
31 // also handles scrollstop
32 $.event.special.scrollstart = {
38 var thisObject = this,
39 $this = $( thisObject ),
43 function trigger( event, state ) {
45 triggerCustomEvent( thisObject, scrolling ? "scrollstart" : "scrollstop", event );
48 // iPhone triggers scroll after a small delay; use touchmove instead
49 $this.bind( scrollEvent, function( event ) {
51 if ( !$.event.special.scrollstart.enabled ) {
56 trigger( event, true );
59 clearTimeout( timer );
60 timer = setTimeout(function() {
61 trigger( event, false );
67 // also handles taphold
68 $.event.special.tap = {
70 var thisObject = this,
71 $this = $( thisObject );
73 $this.bind( "vmousedown", function( event ) {
75 if ( event.which && event.which !== 1 ) {
79 var origTarget = event.target,
80 origEvent = event.originalEvent,
83 function clearTapTimer() {
84 clearTimeout( timer );
87 function clearTapHandlers() {
90 $this.unbind( "vclick", clickHandler )
91 .unbind( "vmouseup", clearTapTimer )
92 .unbind( "vmousecancel", clearTapHandlers );
95 function clickHandler(event) {
98 // ONLY trigger a 'tap' event if the start target is
99 // the same as the stop target.
100 if ( origTarget == event.target ) {
101 triggerCustomEvent( thisObject, "tap", event );
105 $this.bind( "vmousecancel", clearTapHandlers )
106 .bind( "vmouseup", clearTapTimer )
107 .bind( "vclick", clickHandler );
109 timer = setTimeout(function() {
110 triggerCustomEvent( thisObject, "taphold", $.Event( "taphold" ) );
116 // also handles swipeleft, swiperight
117 $.event.special.swipe = {
118 scrollSupressionThreshold: 10, // More than this horizontal displacement, and we will suppress scrolling.
120 durationThreshold: 1000, // More time than this, and it isn't a swipe.
122 horizontalDistanceThreshold: 30, // Swipe horizontal displacement must be more than this.
124 verticalDistanceThreshold: 75, // Swipe vertical displacement must be less than this.
127 var thisObject = this,
128 $this = $( thisObject );
130 $this.bind( touchStartEvent, function( event ) {
131 var data = event.originalEvent.touches ?
132 event.originalEvent.touches[ 0 ] : event,
134 time: ( new Date() ).getTime(),
135 coords: [ data.pageX, data.pageY ],
136 origin: $( event.target )
140 function moveHandler( event ) {
146 var data = event.originalEvent.touches ?
147 event.originalEvent.touches[ 0 ] : event;
150 time: ( new Date() ).getTime(),
151 coords: [ data.pageX, data.pageY ]
155 if ( Math.abs( start.coords[ 0 ] - stop.coords[ 0 ] ) > $.event.special.swipe.scrollSupressionThreshold ) {
156 event.preventDefault();
160 $this.bind( touchMoveEvent, moveHandler )
161 .one( touchStopEvent, function( event ) {
162 $this.unbind( touchMoveEvent, moveHandler );
164 if ( start && stop ) {
165 if ( stop.time - start.time < $.event.special.swipe.durationThreshold &&
166 Math.abs( start.coords[ 0 ] - stop.coords[ 0 ] ) > $.event.special.swipe.horizontalDistanceThreshold &&
167 Math.abs( start.coords[ 1 ] - stop.coords[ 1 ] ) < $.event.special.swipe.verticalDistanceThreshold ) {
169 start.origin.trigger( "swipe" )
170 .trigger( start.coords[0] > stop.coords[ 0 ] ? "swipeleft" : "swiperight" );
173 start = stop = undefined;
179 (function( $, window ) {
180 // "Cowboy" Ben Alman
182 var win = $( window ),
187 $.event.special.orientationchange = special_event = {
189 // If the event is supported natively, return false so that jQuery
190 // will bind to the event using DOM methods.
191 if ( $.support.orientation && $.mobile.orientationChangeEnabled ) {
195 // Get the current orientation to avoid initial double-triggering.
196 last_orientation = get_orientation();
198 // Because the orientationchange event doesn't exist, simulate the
199 // event by testing window dimensions on resize.
200 win.bind( "throttledresize", handler );
202 teardown: function(){
203 // If the event is not supported natively, return false so that
204 // jQuery will unbind the event using DOM methods.
205 if ( $.support.orientation && $.mobile.orientationChangeEnabled ) {
209 // Because the orientationchange event doesn't exist, unbind the
210 // resize event handler.
211 win.unbind( "throttledresize", handler );
213 add: function( handleObj ) {
214 // Save a reference to the bound event handler.
215 var old_handler = handleObj.handler;
218 handleObj.handler = function( event ) {
219 // Modify event object, adding the .orientation property.
220 event.orientation = get_orientation();
222 // Call the originally-bound event handler and return its result.
223 return old_handler.apply( this, arguments );
228 // If the event is not supported natively, this handler will be bound to
229 // the window resize event to simulate the orientationchange event.
231 // Get the current orientation.
232 var orientation = get_orientation();
234 if ( orientation !== last_orientation ) {
235 // The orientation has changed, so trigger the orientationchange event.
236 last_orientation = orientation;
237 win.trigger( "orientationchange" );
241 // Get the current page orientation. This method is exposed publicly, should it
242 // be needed, as jQuery.event.special.orientationchange.orientation()
243 $.event.special.orientationchange.orientation = get_orientation = function() {
244 var isPortrait = true, elem = document.documentElement;
246 // prefer window orientation to the calculation based on screensize as
247 // the actual screen resize takes place before or after the orientation change event
248 // has been fired depending on implementation (eg android 2.3 is before, iphone after).
249 // More testing is required to determine if a more reliable method of determining the new screensize
250 // is possible when orientationchange is fired. (eg, use media queries + element + opacity)
251 if ( $.support.orientation ) {
252 // if the window orientation registers as 0 or 180 degrees report
253 // portrait, otherwise landscape
254 isPortrait = window.orientation % 180 == 0;
256 isPortrait = elem && elem.clientWidth / elem.clientHeight < 1.1;
259 return isPortrait ? "portrait" : "landscape";
262 })( jQuery, window );
265 // throttled resize event
268 $.event.special.throttledresize = {
270 $( this ).bind( "resize", handler );
272 teardown: function(){
273 $( this ).unbind( "resize", handler );
278 handler = function() {
279 curr = ( new Date() ).getTime();
280 diff = curr - lastCall;
282 if ( diff >= throttle ) {
285 $( this ).trigger( "throttledresize" );
290 clearTimeout( heldCall );
293 // Promise a held call will still execute
294 heldCall = setTimeout( handler, throttle - diff );
305 scrollstop: "scrollstart",
309 }, function( event, sourceEvent ) {
311 $.event.special[ event ] = {
313 $( this ).bind( sourceEvent, $.noop );