fix: improvement for touch devices (#621)

xability · Dec 19, 2024 · e608277 · e608277
1 parent 44b4b93
commit e608277
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 15 deletions.
diff --git a/src/js/controls.js b/src/js/controls.js
@@ -306,8 +306,8 @@ class Control {
       let selectorElems = document.querySelectorAll(singleMaidr.selector);
       if (selectorElems.length > 0) {
         constants.events.push([
-          document,
-          'mousemove',
+          constants.chart,
+          ['mousemove', 'touchmove'],
           function (e) {
             if (constants.chartType == 'bar' || constants.chartType == 'hist') {
               // check if we've hit a selector
@@ -416,13 +416,15 @@ class Control {
             } else if (constants.chartType == 'heat') {
               // check if we've hit a selector
               let index = Array.from(selectorElems).indexOf(e.target);
-              if (
-                position.x != Math.floor(index / plot.num_rows) ||
-                position.y != plot.num_rows - (index % plot.num_rows) - 1
-              ) {
-                position.x = Math.floor(index / plot.num_rows);
-                position.y = plot.num_rows - (index % plot.num_rows) - 1;
-                control.UpdateAll();
+              if (index != -1) {
+                if (
+                  position.x != Math.floor(index / plot.num_rows) ||
+                  position.y != plot.num_rows - (index % plot.num_rows) - 1
+                ) {
+                  position.x = Math.floor(index / plot.num_rows);
+                  position.y = plot.num_rows - (index % plot.num_rows) - 1;
+                  control.UpdateAll();
+                }
               }
             } else if (constants.chartType == 'line') {
               // compare coordinates and get the point we're closest to, if we're within 24px

diff --git a/src/js/init.js b/src/js/init.js
@@ -291,17 +291,37 @@ function SetEvents() {
   // add all events
   for (let i = 0; i < constants.events.length; i++) {
     if (Array.isArray(constants.events[i][0])) {
+      // sometimes we have multiple elements to apply the same event to in the [i][0] spot
       for (let j = 0; j < constants.events[i][0].length; j++) {
-        constants.events[i][0][j]?.addEventListener(
+        // and sometimes we have multiple event types in [i][1]
+        if (Array.isArray(constants.events[i][1])) {
+          for (let k = 0; k < constants.events[i][1].length; k++) {
+            constants.events[i][0][j]?.addEventListener(
+              constants.events[i][1][k],
+              constants.events[i][2]
+            );
+          }
+        } else {
+          constants.events[i][0][j]?.addEventListener(
+            constants.events[i][1],
+            constants.events[i][2]
+          );
+        }
+      }
+    } else {
+      if (Array.isArray(constants.events[i][1])) {
+        for (let j = 0; j < constants.events[i][1].length; j++) {
+          constants.events[i][0]?.addEventListener(
+            constants.events[i][1][j],
+            constants.events[i][2]
+          );
+        }
+      } else {
+        constants.events[i][0]?.addEventListener(
           constants.events[i][1],
           constants.events[i][2]
         );
       }
-    } else {
-      constants.events[i][0]?.addEventListener(
-        constants.events[i][1],
-        constants.events[i][2]
-      );
     }
   }
   // add all post load events