default no pointer evenst on matrix

ElyaConrad · Apr 23, 2024 · dab54d1 · dab54d1
1 parent e4866a4
commit dab54d1
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 33 deletions.
diff --git a/zoompinch-vue/package.json b/zoompinch-vue/package.json
@@ -1,7 +1,7 @@
 {
   "name": "zoompinch",
   "private": false,
-  "version": "0.0.34",
+  "version": "0.0.35",
   "type": "module",
   "files": [
     "package.json",

diff --git a/zoompinch-vue/src/components/Zoompinch.vue b/zoompinch-vue/src/components/Zoompinch.vue
@@ -311,6 +311,7 @@ defineExpose({
     top: 0px;
     position: absolute;
     width: 100%;
+    pointer-events: none;
     height: 100%;
     > ::v-deep(*) {
       width: 100%;

diff --git a/zoompinch-vue/src/controllers/touch.ts b/zoompinch-vue/src/controllers/touch.ts
@@ -61,16 +61,25 @@ export function useTouch({
   };
 
   const handleTouchstart = (event: TouchEvent) => {
+    const isWithinMatrix = (event.target as HTMLElement).closest('.matrix') !== null;
+    if (isWithinMatrix) {
+      return;
+    }
+
     event.preventDefault();
     touchStarts = freezeTouches(event.touches);
     touchStartScale = scale.value;
     touchStartTranslate = [translate.value[0], translate.value[1]];
     touchStartRotate = rotate.value;
 
-    console.log('touchStarts', touchStarts);
+    //console.log('touchStarts', touchStarts);
   };
 
   const handleTouchmove = (event: TouchEvent) => {
+    const isWithinMatrix = (event.target as HTMLElement).closest('.matrix') !== null;
+    if (isWithinMatrix) {
+      return;
+    }
     event.preventDefault(); // Prevent default touch behavior
 
     if (touchStarts) {
@@ -187,7 +196,10 @@ export function useTouch({
     }
   };
   const handleTouchend = (event: TouchEvent) => {
-    //event.preventDefault();
+    const isWithinMatrix = (event.target as HTMLElement).closest('.matrix') !== null;
+    if (isWithinMatrix) {
+      return;
+    }
 
     if (event.touches.length === 0) {
       touchStarts = null;

diff --git a/zoompinch-vue/vite.config.ts.timestamp-1713099900691.mjs b/zoompinch-vue/vite.config.ts.timestamp-1713099900691.mjs