Skip to content
Browse files

Add the jQuery UI Touch Punch plugin to handle dragging on mobile dev…

…ices, props georgestephanis, see #20014

git-svn-id: http://svn.automattic.com/wordpress/trunk@20433 1a063a9b-81f0-0310-95a4-ce76da25c4cd
  • Loading branch information...
1 parent f89c8b2 commit 6aaf0dad43490d08ff8b26af7cd6a3691556fbbb azaozz committed Apr 11, 2012
View
3 wp-admin/edit-form-advanced.php
@@ -12,6 +12,9 @@
wp_enqueue_script('post');
+if ( wp_is_mobile() )
+ wp_enqueue_script( 'jquery-touch-punch' );
+
if ( post_type_supports($post_type, 'editor') || post_type_supports($post_type, 'thumbnail') ) {
add_thickbox();
wp_enqueue_script('media-upload');
View
3 wp-admin/index.php
@@ -19,6 +19,9 @@
wp_enqueue_script( 'media-upload' );
add_thickbox();
+if ( wp_is_mobile() )
+ wp_enqueue_script( 'jquery-touch-punch' );
+
$title = __('Dashboard');
$parent_file = 'index.php';
View
3 wp-admin/link-add.php
@@ -23,6 +23,9 @@
wp_enqueue_script('link');
wp_enqueue_script('xfn');
+if ( wp_is_mobile() )
+ wp_enqueue_script( 'jquery-touch-punch' );
+
$link = get_default_link_to_edit();
include('./edit-link-form.php');
View
3 wp-admin/link.php
@@ -99,6 +99,9 @@
wp_enqueue_script('link');
wp_enqueue_script('xfn');
+ if ( wp_is_mobile() )
+ wp_enqueue_script( 'jquery-touch-punch' );
+
$parent_file = 'link-manager.php';
$submenu_file = 'link-manager.php';
$title = __('Edit Link');
View
3 wp-admin/nav-menus.php
@@ -35,6 +35,9 @@
wp_enqueue_script( 'wp-lists' );
wp_enqueue_script( 'postbox' );
+if ( wp_is_mobile() )
+ wp_enqueue_script( 'jquery-touch-punch' );
+
// Container for any messages displayed to the user
$messages = array();
View
8 wp-admin/widgets.php
@@ -25,11 +25,15 @@ function wp_widgets_access_body_class($classes) {
return "$classes widgets_access ";
}
-if ( 'on' == $widgets_access )
+if ( 'on' == $widgets_access ) {
add_filter( 'admin_body_class', 'wp_widgets_access_body_class' );
-else
+} else {
wp_enqueue_script('admin-widgets');
+ if ( wp_is_mobile() )
+ wp_enqueue_script( 'jquery-touch-punch' );
+}
+
do_action( 'sidebar_admin_setup' );
$title = __( 'Widgets' );
View
160 wp-includes/js/jquery/jquery.ui.touch-punch.dev.js
@@ -0,0 +1,160 @@
+/*!
+ * jQuery UI Touch Punch 0.2.2
+ *
+ * Copyright 2011, Dave Furfero
+ * Dual licensed under the MIT or GPL Version 2 licenses.
+ *
+ * Depends:
+ * jquery.ui.widget.js
+ * jquery.ui.mouse.js
+ */
+(function ($) {
+
+ // Detect touch support
+ $.support.touch = 'ontouchend' in document;
+
+ // Ignore browsers without touch support
+ if (!$.support.touch) {
+ return;
+ }
+
+ var mouseProto = $.ui.mouse.prototype,
+ _mouseInit = mouseProto._mouseInit,
+ touchHandled;
+
+ /**
+ * Simulate a mouse event based on a corresponding touch event
+ * @param {Object} event A touch event
+ * @param {String} simulatedType The corresponding mouse event
+ */
+ function simulateMouseEvent (event, simulatedType) {
+
+ // Ignore multi-touch events
+ if (event.originalEvent.touches.length > 1) {
+ return;
+ }
+
+ event.preventDefault();
+
+ var touch = event.originalEvent.changedTouches[0],
+ simulatedEvent = document.createEvent('MouseEvents');
+
+ // Initialize the simulated mouse event using the touch event's coordinates
+ simulatedEvent.initMouseEvent(
+ simulatedType, // type
+ true, // bubbles
+ true, // cancelable
+ window, // view
+ 1, // detail
+ touch.screenX, // screenX
+ touch.screenY, // screenY
+ touch.clientX, // clientX
+ touch.clientY, // clientY
+ false, // ctrlKey
+ false, // altKey
+ false, // shiftKey
+ false, // metaKey
+ 0, // button
+ null // relatedTarget
+ );
+
+ // Dispatch the simulated event to the target element
+ event.target.dispatchEvent(simulatedEvent);
+ }
+
+ /**
+ * Handle the jQuery UI widget's touchstart events
+ * @param {Object} event The widget element's touchstart event
+ */
+ mouseProto._touchStart = function (event) {
+
+ var self = this;
+
+ // Ignore the event if another widget is already being handled
+ if (touchHandled || !self._mouseCapture(event.originalEvent.changedTouches[0])) {
+ return;
+ }
+
+ // Set the flag to prevent other widgets from inheriting the touch event
+ touchHandled = true;
+
+ // Track movement to determine if interaction was a click
+ self._touchMoved = false;
+
+ // Simulate the mouseover event
+ simulateMouseEvent(event, 'mouseover');
+
+ // Simulate the mousemove event
+ simulateMouseEvent(event, 'mousemove');
+
+ // Simulate the mousedown event
+ simulateMouseEvent(event, 'mousedown');
+ };
+
+ /**
+ * Handle the jQuery UI widget's touchmove events
+ * @param {Object} event The document's touchmove event
+ */
+ mouseProto._touchMove = function (event) {
+
+ // Ignore event if not handled
+ if (!touchHandled) {
+ return;
+ }
+
+ // Interaction was not a click
+ this._touchMoved = true;
+
+ // Simulate the mousemove event
+ simulateMouseEvent(event, 'mousemove');
+ };
+
+ /**
+ * Handle the jQuery UI widget's touchend events
+ * @param {Object} event The document's touchend event
+ */
+ mouseProto._touchEnd = function (event) {
+
+ // Ignore event if not handled
+ if (!touchHandled) {
+ return;
+ }
+
+ // Simulate the mouseup event
+ simulateMouseEvent(event, 'mouseup');
+
+ // Simulate the mouseout event
+ simulateMouseEvent(event, 'mouseout');
+
+ // If the touch interaction did not move, it should trigger a click
+ if (!this._touchMoved) {
+
+ // Simulate the click event
+ simulateMouseEvent(event, 'click');
+ }
+
+ // Unset the flag to allow other widgets to inherit the touch event
+ touchHandled = false;
+ };
+
+ /**
+ * A duck punch of the $.ui.mouse _mouseInit method to support touch events.
+ * This method extends the widget with bound touch event handlers that
+ * translate touch events to mouse events and pass them to the widget's
+ * original mouse event handling methods.
+ */
+ mouseProto._mouseInit = function () {
+
+ var self = this;
+
+ // Delegate the touch handlers to the widget's element
+ self.element
+ .bind('touchstart', $.proxy(self, '_touchStart'))
+ .bind('touchmove', $.proxy(self, '_touchMove'))
+ .bind('touchend', $.proxy(self, '_touchEnd'));
+
+ // Call the original $.ui.mouse init method
+ _mouseInit.call(self);
+ };
+
+})(jQuery);
View
11 wp-includes/js/jquery/jquery.ui.touch-punch.js
@@ -0,0 +1,11 @@
+/*
+ * jQuery UI Touch Punch 0.2.2
+ *
+ * Copyright 2011, Dave Furfero
+ * Dual licensed under the MIT or GPL Version 2 licenses.
+ *
+ * Depends:
+ * jquery.ui.widget.js
+ * jquery.ui.mouse.js
+ */
+(function(b){b.support.touch="ontouchend" in document;if(!b.support.touch){return;}var c=b.ui.mouse.prototype,e=c._mouseInit,a;function d(g,h){if(g.originalEvent.touches.length>1){return;}g.preventDefault();var i=g.originalEvent.changedTouches[0],f=document.createEvent("MouseEvents");f.initMouseEvent(h,true,true,window,1,i.screenX,i.screenY,i.clientX,i.clientY,false,false,false,false,0,null);g.target.dispatchEvent(f);}c._touchStart=function(g){var f=this;if(a||!f._mouseCapture(g.originalEvent.changedTouches[0])){return;}a=true;f._touchMoved=false;d(g,"mouseover");d(g,"mousemove");d(g,"mousedown");};c._touchMove=function(f){if(!a){return;}this._touchMoved=true;d(f,"mousemove");};c._touchEnd=function(f){if(!a){return;}d(f,"mouseup");d(f,"mouseout");if(!this._touchMoved){d(f,"click");}a=false;};c._mouseInit=function(){var f=this;f.element.bind("touchstart",b.proxy(f,"_touchStart")).bind("touchmove",b.proxy(f,"_touchMove")).bind("touchend",b.proxy(f,"_touchEnd"));e.call(f);};})(jQuery);
View
2 wp-includes/script-loader.php
@@ -157,6 +157,7 @@ function wp_default_scripts( &$scripts ) {
// deprecated, not used in core, most functionality is included in jQuery 1.3
$scripts->add( 'jquery-form', "/wp-includes/js/jquery/jquery.form$suffix.js", array('jquery'), '2.73', 1 );
+ // jQuery plugins
$scripts->add( 'jquery-color', "/wp-includes/js/jquery/jquery.color$suffix.js", array('jquery'), '2.0-4561m', 1 );
$scripts->add( 'suggest', "/wp-includes/js/jquery/suggest$suffix.js", array('jquery'), '1.1-20110113', 1 );
$scripts->add( 'schedule', '/wp-includes/js/jquery/jquery.schedule.js', array('jquery'), '20m', 1 );
@@ -165,6 +166,7 @@ function wp_default_scripts( &$scripts ) {
$scripts->add( 'jquery-hotkeys', "/wp-includes/js/jquery/jquery.hotkeys$suffix.js", array('jquery'), '0.0.2m', 1 );
$scripts->add( 'jquery-table-hotkeys', "/wp-includes/js/jquery/jquery.table-hotkeys$suffix.js", array('jquery', 'jquery-hotkeys'), false, 1 );
$scripts->add( 'jquery-postmessage', "/wp-includes/js/jquery/jquery.postmessage$suffix.js", array('jquery'), '0.5', 1 );
+ $scripts->add( 'jquery-touch-punch', "/wp-includes/js/jquery/jquery.ui.touch-punch$suffix.js", array('jquery-ui-widget', 'jquery-ui-mouse'), '0.2.2', 1 );
$scripts->add( 'thickbox', "/wp-includes/js/thickbox/thickbox.js", array('jquery'), '3.1-20111117', 1 );
$scripts->localize( 'thickbox', 'thickboxL10n', array(

0 comments on commit 6aaf0da

Please sign in to comment.
Something went wrong with that request. Please try again.