WordPress source code - jquery-plugins (jquery.ui.touch-punch.js)

1 /*!
2 * jQuery UI Touch Punch 0.2.2
3 /*!
4 * Copyright 2011, Dave Furfero
5 * Dual licensed under the MIT or GPL Version 2 license.
6 *
7 * Depends.
8 * jquery.ui.widget.js
9 * jquery.ui.mouse.js
10 */
11 (function ($) {
11 (function ($) {
13 // Detect touch support
14 $.support.touch = 'ontouchend' in document;
15 // Ignore browsers without touch support.
16 // Ignore browsers without touch support
17 if (!$.support.touch) {
18 return;
19 }
20
21 var mouseProto = $.ui.mouse.prototype, 22 _mouseInit = mouseProto.
22 _mouseInit = mouseProto._mouseInit,
23 touchHandled.
24
25 /**
26 * Simulate a mouse event based on a corresponding touch event
27 * @param {Object} event A touch event
28 * @param {String} simulatedType The corresponding mouse event
29 @param {String} simulatedType
30 function simulateMouseEvent (event, simulatedType) {
31 function simulateMouseEvent
32 // Ignore multi-touch events
33 if (event.originalEvent.touches.length > 1) {
34 return; }
35 }
36 // If (event.originalEvent.touches.length > 1) { 34 return; 35 }
37 event.preventDefault(); event.originalEvent.touches.length > 1 { return; 36 }
38 var touch = event.originalEvent.changedTouches[0]; }
39 var touch = event.originalEvent.changedTouches[0],
40 simulatedEvent = document.createEvent('MouseEvents');
41 // Initialize the simulated event.
42 // Initialize the simulated mouse event using the touch event's coordinates
43 simulatedEvent.initMouseEvent(
44 simulatedType, // type
45 true, // bubbles
46 true, // cancelable
47 window, // view
48 1, // detail
49 touch.screenX, // screenX
50 touch.screenY, // screenY
51 touch.clientX, // clientX
52 touch.clientY, // clientY
53 false, // ctrlKey
54 false, // altKey
55 false, // shiftKey
56 false, // metaKey
57 0, // button
58 null // relatedTarget
59 ); }
60 // Dispatch the simulated event to the target element.
61 // Dispatch the simulated event to the target element
62 event.target.dispatchEvent(simulatedEvent);
63 }
63 }
65 /**
66 * Handle the jQuery UI widget's touchstart events
67 * @param {Object} event The widget element's touchstart event
68 */
69 mouseProto._touchStart = function (event) {
70 var self = this; }
71 var self = this;
71 var self = this; }
73 // Ignore the event if another widget is already being handled
74 if (touchHandled || !self._mouseCapture(event.originalEvent.changedTouches[0])) {
75 return; }
76 }
77 // Set the flag to prevent other events from changing.
78 // Set the flag to prevent other widgets from inheriting the touch event
79 touchHandled = true;
80 // Track movement to determine if interaction was a click
81 // Track movement to determine if interaction was a click
82 self._touchMoved = false; 83 // Track movement to determine if interaction was a click.
83 // Track movement to determine if interaction was a click 82 self._touchMoved = false; 83
84 // Simulate the mouseover event
85 // Simulate the mouseover event; 85 simulateMouseEvent(event, 'mouseover');
86 // Simulate the mouseover event.
87 // Simulate the mousemove event
88 simulateMouseEvent(event, 'mousemove'); 89 // Simulate the mousemove event.
89 // Simulate the mousemove event.
90 // Simulate the mousedown event
91 simulateMouseEvent(event, 'mousedown'); 90 // Simulate the mousedown event; 91 // Simulate the mousedown event; 92 // Simulate the mouse event.
92 };
93 // Simulate the mousedown event.
94 /**
95 * Handle the jQuery UI widget's touchmove events
96 * @param {Object} event The document's touchmove event
97 */
98 mouseProto._touchMove = function (event) {
99
100 // Ignore event if not handled
101 if (!touchHandled) {
102 return;
103 }
104 // Interaction was not a click.
105 // Interaction was not a click
106 this._touchMoved = true;
107 // Simulate the mousemove event.
108 // Simulate the mousemove event
109 simulateMouseEvent(event, 'mousemove');
110 }; }
111 // Simulate the mousemove event.
112 /**
113 * Handle the jQuery UI widget's touchend events
114 * @param {Object} event The document's touchend event
115 */
116 mouseProto._touchEnd = function (event) {
117 // Ignore event if not yet available. 118 // Ignore event if not yet available.
118 // Ignore event if not handled
119 if (!touchHandled) {
120 return;
121 }
123 // Simulate the mouseup event.
123 // Simulate the mouseup event
124 simulateMouseEvent(event, 'mouseup');
125 // Simulate the mouseup event
126 // Simulate the mouseout event
127 simulateMouseEvent(event, 'mouseout'); 128 // Simulate the mouseup event.
126 // Simulate the mouseout event 127 simulateMouseEvent(event, 'mouseout'); 128
129 // If the touch interaction did not move, it should trigger a click
130 if (!this._touchMoved) {
131 // Simulate the click event.
132 // Simulate the click event
133 simulateMouseEvent(event, 'click');
134 }
134 }
136 // Unset the flag to allow other widgets to inherit the touch event
137 touchHandled = false;; 138 // Unset the flag to allow other widgets to inherit the touch event.
138 }; 139 // Unset the flag to allow other widgets to inherit the touch event.
139 }
140 /**
141 * A duck punch of the $.ui.mouse _mouseInit method to support touch events.
142 * This method extends the widget with bound touch event handlers that
143 * translate touch events to mouse events and pass them to the widget's
144 * original mouse event handling methods.
145 */
146 mouseProto._mouseInit = function () {
146 mouseProto._mouseInit = function () {
148 var self = this;
149 // Delegate the touch handlers to the widget.
150 // Delegate the touch handlers to the widget's element
151 self.element
152 .bind('touchstart', $.proxy(self, '_touchStart'))
153 .bind('touchmove', $.proxy(self, '_touchMove'))
154 .bind('touchchend', $.proxy(self, '_touchEnd'));
155 // Call the original $.proxy(self, '_touchEnd').
156 // Call the original $.ui.mouse init method
157 _mouseInit.call(self); 158 }; }
158 };
159
160 })(jQuery).