@rwap/jquery-ui-touch-punch - npm Package Compare versions

Comparing version 1.0.11 to 1.1.5

jquery.ui.touch-punch.js

 /*!
- * jQuery UI Touch Punch 1.0.8 as modified by RWAP Software
+ * jQuery UI Touch Punch 1.1.5 as modified by RWAP Software
  * based on original touchpunch v0.2.3 which has not been updated since 2014
@@ -31,4 +31,4 @@ *
   // Detect touch support - Windows Surface devices and other touch devices
-  $.support.mspointer = window.navigator.msPointerEnabled;		
-  $.support.touch = ( 'ontouchstart' in document
+  $.mspointer = window.navigator.msPointerEnabled;		
+  $.touch = ( 'ontouchstart' in document
    	|| 'ontouchstart' in window
@@ -42,10 +42,10 @@ || window.TouchEvent
   // Ignore browsers without touch or mouse support
-  if ((!$.support.touch && !$.support.mspointer) || !$.ui.mouse) {
+  if ((!$.touch && !$.mspointer) || !$.ui.mouse) {
 	return;
   }
 
-  var mouseProto = $.ui.mouse.prototype,
+  let mouseProto = $.ui.mouse.prototype,
       _mouseInit = mouseProto._mouseInit,
       _mouseDestroy = mouseProto._mouseDestroy,
-      touchHandled;
+      touchHandled, lastClickTime  = 0;
 
@@ -75,2 +75,7 @@ /**
 
+    //Ignore input or textarea elements so user can still enter text
+    if ($(event.target).is("input") || $(event.target).is("textarea")) {
+      return;
+    }
+
     // Prevent "Ignored attempt to cancel a touchmove event with cancelable=false" errors
@@ -81,24 +86,13 @@ if (event.cancelable) {
 
-    var touch = event.originalEvent.changedTouches[0],
-        simulatedEvent = document.createEvent('MouseEvents');
+    let touch = event.originalEvent.changedTouches[0],
+        simulatedEvent = new MouseEvent(simulatedType, {
+          bubbles: true,
+          cancelable: true,
+          view:window,
+          screenX:touch.screenX,
+          screenY:touch.screenY,
+          clientX:touch.clientX,
+          clientY:touch.clientY
+        });
 
-    // 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
@@ -114,3 +108,3 @@ event.target.dispatchEvent(simulatedEvent);
 
-    var self = this;
+    let self = this;
 
@@ -182,8 +176,12 @@ // Interaction time
     // Allow for Apple Stylus to be used also
-    var timeMoving = event.timeStamp - this._startedMove;
+    let timeMoving = event.timeStamp - this._startedMove;
     if (!this._touchMoved || timeMoving < 500) {
         // Simulate the click event
-        simulateMouseEvent(event, 'click');
+        if( event.timeStamp - lastClickTime < 400 )
+            simulateMouseEvent(event, 'dblclick');
+        else
+            simulateMouseEvent(event, 'click');
+        lastClickTime = event.timeStamp;	    
     } else {
-      var endPos = getTouchCoords(event);
+      let endPos = getTouchCoords(event);
       if ((Math.abs(endPos.x - this._startPos.x) < 10) && (Math.abs(endPos.y - this._startPos.y) < 10)) {
@@ -206,2 +204,6 @@
 
+  let _touchStartBound;
+  let _touchMoveBound;
+  let _touchEndBound
+
   /**
@@ -215,3 +217,3 @@ * A duck punch of the $.ui.mouse _mouseInit method to support touch events.
 
-    var self = this;
+    let self = this;
 	  
@@ -221,9 +223,13 @@ // Microsoft Surface Support = remove original touch Action
       self.element[0].style.msTouchAction = 'none';
-    }	  
+    }	
 
+    _touchStartBound = mouseProto._touchStart.bind(self);
+    _touchMoveBound  = mouseProto._touchMove.bind(self);
+    _touchEndBound   = mouseProto._touchEnd.bind(self);	  
+
     // Delegate the touch handlers to the widget's element
     self.element.on({
-      touchstart: $.proxy(self, '_touchStart'),
-      touchmove: $.proxy(self, '_touchMove'),
-      touchend: $.proxy(self, '_touchEnd')
+      touchstart: _touchStartBound,
+      touchmove: _touchMoveBound,
+      touchend: _touchEndBound
     });
@@ -240,9 +246,9 @@
 
-    var self = this;
+    let self = this;
 
     // Delegate the touch handlers to the widget's element
     self.element.off({
-      touchstart: $.proxy(self, '_touchStart'),
-      touchmove: $.proxy(self, '_touchMove'),
-      touchend: $.proxy(self, '_touchEnd')
+      touchstart: _touchStartBound,
+      touchmove: _touchMoveBound,
+      touchend: _touchEndBound
     });
@@ -249,0 +255,0 @@

package.json

 {
   "name": "@rwap/jquery-ui-touch-punch",
-  "version": "1.0.11",
+  "version": "1.1.5",
   "description": "A duck punch for adding touch events to jQuery UI",
@@ -5,0 +5,0 @@ "browser": "jquery.ui.touch-punch.js",

README.md

@@ -6,4 +6,2 @@ # jQuery UI Touch Punch
 
-_[Visit the official Touch Punch website](http://touchpunch.furf.com)._
-
 Currently, [jQuery UI](http://jqueryui.com/) user interface library does not support the use of touch events in their widgets and interactions. This means that the slick UI you designed and tested in your desktop browser will fail on most, if not all, touch-enabled mobile devices, because jQuery UI listens to mouse events—mouseover, mousemove and mouseout—not touch events—touchstart, touchmove and touchend.
@@ -15,7 +13,10 @@
 
-This code is dual licensed under the MIT or GPL Version 2 licenses and is therefore free to use, modify and/or distribute, but if you include Touch Punch in other software packages or plugins, please include an attribution to the original software and a link to [this Touch Punch website](http://touchpunch.furf.com/).
+This code is dual licensed under the MIT or GPL Version 2 licenses and is therefore free to use, modify and/or distribute, but if you include Touch Punch in other software packages or plugins, please include an attribution to the original software and a link to [this repo](https://github.com/RWAP/jquery-ui-touch-punch).
 
-RWAP Version (2019)
-The above was last updated in 2014.
+Fork: https://github.com/RWAP/jquery-ui-touch-punch
 
+RWAP Version (2019-2024)
+
+The [original repo](https://github.com/furf/jquery-ui-touch-punch) was last updated in 2014.
+
 I have created a new fork which contains various suggested improvements to the code when it became clear that touch-punch does not work too well on Android devices, and actually stopped the close button on jquery-ui dialogs from working on some devices.
@@ -52,1 +53,13 @@
 _Tested on iPad, iPhone, Android and other touch-enabled mobile devices._
+
+## If it does not seem to work…
+
+Remember that Touch Punch is just allowing various key strokes (such as touch, cliuck and double click) to emulate mouse movements.  We do nothing with the underlying jQuery code.
+
+If it does not appear to work for you:
+
+1. Ensure that you are using the latest version of this plugin (and not the [original repo](https://github.com/furf/jquery-ui-touch-punch) ).
+
+2. Ensure that you have the latest versions of jQuery and jQuery UI linked in your webpage, BEFORE this code
+
+3. Ensure that the original code works as expected on desktop.

No alert changes

Improved metrics

Total package byte prevSize

11920

increased by5.96%

Lines of code

203

increased by2.01%

Number of lines in readme file

63

increased by26%

No dependency changes