pointerEvents: Add hold repeat events

interact(target)
.pointerEvents({
  holdRepeatInterval: 500,
})
.on('hold', event => console.log(event.type, event.count));

Close #228

Author: taye

src/index.js

@@ -5,6 +5,7 @@ require('./legacyBrowsers');
 
 // pointerEvents
 require('./pointerEvents');
+require('./pointerEvents/holdRepeat');
 require('./pointerEvents/interactableTargets');
 
 // inertia

src/pointerEvents/holdRepeat.js

@@ -0,0 +1,38 @@
+const pointerEvents = require('./index.js');
+const Interaction   = require('../Interaction');
+
+pointerEvents.signals.on('new', function ({ pointerEvent }) {
+  pointerEvent.count = (pointerEvent.count || 0) + 1;
+});
+
+pointerEvents.signals.on('fired', function ({ interaction, pointerEvent, eventTarget, targets }) {
+  if (pointerEvent.type !== 'hold') { return; }
+
+  // get the repeat interval from the first eventable
+  const interval = targets[0].eventable.options.holdRepeatInterval;
+
+  // don't repeat if the interval is 0 or less
+  if (interval <= 0) { return; }
+
+  // set a timeout to fire the holdrepeat event
+  interaction.holdIntervalHandle = setTimeout(function () {
+    pointerEvents.collectEventTargets(interaction, pointerEvent, pointerEvent, eventTarget, 'hold');
+  }, interval);
+});
+
+function endHoldRepeat ({ interaction }) {
+  // set the interaction's holdStopTime property
+  // to stop further holdRepeat events
+  if (interaction.holdIntervalHandle) {
+    clearInterval(interaction.holdIntervalHandle);
+    interaction.holdIntervalHandle = null;
+  }
+}
+
+for (const signal of ['move', 'up', 'cancel', 'endall']) {
+  Interaction.signals.on(signal, endHoldRepeat);
+}
+
+// don't repeat by default
+pointerEvents.defaults.holdRepeatInterval = 0;
+pointerEvents.types.push('holdrepeat');

src/pointerEvents/index.js

@@ -69,9 +69,11 @@ function firePointers (interaction, pointer, event, eventTarget, targets, eventT
   }
 
   const signalArg = {
+    interaction,
     pointerEvent,
     pointer,
     event,
+    eventTarget,
     targets,
   };
 
@@ -93,6 +95,8 @@ function firePointers (interaction, pointer, event, eventTarget, targets, eventT
     pointerEvent.clientX -= originX;
     pointerEvent.clientY -= originY;
 
+    pointerEvent.eventable = target.eventable;
+
     target.eventable.fire(pointerEvent);
 
     pointerEvent.pageX   += originX;
@@ -229,8 +233,7 @@ Interaction.signals.on('down', function ({ interaction, pointer, event, eventTar
                         browser.isIE8? eventCopy : pointer,
                         eventCopy,
                         eventTarget,
-                        'hold',
-                        minDuration);
+                        'hold');
   }, minDuration);
 });