lowered tap movement and tap time thresholds

or, you know, actually change the threshold

updated component test to account for smaller touchmove threshold

closes #1830

CHANGELOG.md

@@ -18,6 +18,7 @@ CHANGELOG
 * Hide the poster when play fires ([view](https://github.com/videojs/video.js/pull/1834))
 * @chikathreesix fixed an object delete error in Chrome ([view](https://github.com/videojs/video.js/pull/1858))
 * @steverandy fixed an issue with scrolling over the player on touch devices ([view](https://github.com/videojs/video.js/pull/1809))
+* @mmcc improved tap sensitivity ([view](https://github.com/videojs/video.js/pull/1830))
 
 --------------------
 

src/js/component.js

@@ -1031,14 +1031,18 @@ vjs.Component.prototype.onResize;
  */
 vjs.Component.prototype.emitTapEvents = function(){
   var touchStart, firstTouch, touchTime, couldBeTap, noTap,
-      xdiff, ydiff, touchDistance, tapMovementThreshold;
+      xdiff, ydiff, touchDistance, tapMovementThreshold, touchTimeThreshold;
 
   // Track the start time so we can determine how long the touch lasted
   touchStart = 0;
   firstTouch = null;
 
   // Maximum movement allowed during a touch event to still be considered a tap
-  tapMovementThreshold = 22;
+  // Other popular libs use anywhere from 2 (hammer.js) to 15, so 10 seems like a nice, round number.
+  tapMovementThreshold = 10;
+
+  // The maximum length a touch can be while still being considered a tap
+  touchTimeThreshold = 200;
 
   this.on('touchstart', function(event) {
     // If more than one finger, don't consider treating this as a click
@@ -1082,8 +1086,8 @@ vjs.Component.prototype.emitTapEvents = function(){
     if (couldBeTap === true) {
       // Measure how long the touch lasted
       touchTime = new Date().getTime() - touchStart;
-      // The touch needs to be quick in order to consider it a tap
-      if (touchTime < 250) {
+      // Make sure the touch was less than the threshold to be considered a tap
+      if (touchTime < touchTimeThreshold) {
         event.preventDefault(); // Don't let browser turn this into a click
         this.trigger('tap');
         // It may be good to copy the touchend event object and change the

test/unit/component.js

@@ -494,7 +494,7 @@ test('should emit a tap event', function(){
     { pageX: 0, pageY: 0 }
   ]});
   vjs.trigger(comp.el(), {type: 'touchmove', touches: [
-    { pageX: 10, pageY: 10 }
+    { pageX: 7, pageY: 7 }
   ]});
   comp.trigger('touchend');
 
@@ -511,8 +511,8 @@ test('should emit a tap event', function(){
   // should still allow a tap
   singleTouch = { pageX: 0, pageY: 0 };
   vjs.trigger(comp.el(), {type: 'touchstart', touches: [singleTouch]});
-  singleTouch.pageX = 10;
-  singleTouch.pageY = 10;
+  singleTouch.pageX = 7;
+  singleTouch.pageY = 7;
   vjs.trigger(comp.el(), {type: 'touchmove', touches: [singleTouch]});
   comp.trigger('touchend');