Fix tooltip not to be displayed by long touch (#379)

* Fix tooltip not to be displayed by long touch

* fix

Author: ota-meshi

packages/cheetah-grid/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cheetah-grid",
-  "version": "1.7.8",
+  "version": "1.7.9",
   "description": "Cheetah Grid is a high performance grid engine that works on canvas",
   "keywords": [
     "spreadsheet",

packages/cheetah-grid/src/js/core/DrawGrid.ts

@@ -1341,13 +1341,22 @@ function _bindEvents(this: DrawGrid): void {
     | null
     | undefined = null;
   let longTouchId: NodeJS.Timeout | null = null;
-  let touchStartIntervalId: NodeJS.Timeout | null = null;
+  let useTouch: { timeoutId?: NodeJS.Timeout } | null = null;
+  function useTouchStart() {
+    if (useTouch?.timeoutId != null) clearTimeout(useTouch.timeoutId);
+    useTouch = {};
+  }
+  function useTouchEnd() {
+    if (useTouch) {
+      if (useTouch.timeoutId != null) clearTimeout(useTouch.timeoutId);
+      useTouch.timeoutId = setTimeout(() => {
+        useTouch = null;
+      }, 350);
+    }
+  }
   handler.on(element, "touchstart", (e) => {
     // Since it is an environment where touch start can be used, it blocks mousemove that occurs after this.
-    if (touchStartIntervalId != null) clearTimeout(touchStartIntervalId);
-    touchStartIntervalId = setTimeout(() => {
-      touchStartIntervalId = null;
-    }, 350);
+    useTouchStart();
 
     if (!doubleTapBefore) {
       doubleTapBefore = getCellEventArgsSet(e).eventArgs;
@@ -1402,9 +1411,13 @@ function _bindEvents(this: DrawGrid): void {
       longTouchId = null;
     }
   }
-  handler.on(element, "touchcancel", cancel);
+  handler.on(element, "touchcancel", (e) => {
+    cancel(e);
+    useTouchEnd();
+  });
   handler.on(element, "touchmove", cancel);
   handler.on(element, "touchend", (e) => {
+    useTouchEnd();
     if (longTouchId) {
       clearTimeout(longTouchId);
       grid[_].cellSelector.select(e);
@@ -1469,7 +1482,7 @@ function _bindEvents(this: DrawGrid): void {
   });
 
   handler.on(element, "mousemove", (e) => {
-    if (touchStartIntervalId != null) {
+    if (useTouch) {
       // Probably a mousemove event triggered by a touchstart. Therefore, this event is blocked.
       return;
     }

packages/vue-cheetah-grid/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-cheetah-grid",
-  "version": "1.7.8",
+  "version": "1.7.9",
   "description": "Cheetah Grid for Vue.js",
   "main": "lib/index.js",
   "unpkg": "dist/vueCheetahGrid.js",