From 7a5e17a345ebba521f3d4d89fd583e6e1c6915e8 Mon Sep 17 00:00:00 2001
From: "SPRINX0\\prochazka" <jan.prochazka@sprinx.com>
Date: Mon, 31 Mar 2025 13:29:25 +0200
Subject: [PATCH] SYNC:  fixed selecting in diagrams with zoom

---
 packages/web/src/designer/Designer.svelte |  8 +++++++-
 packages/web/src/utility/moveDrag.ts      | 15 ++++++++++-----
 2 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/packages/web/src/designer/Designer.svelte b/packages/web/src/designer/Designer.svelte
index 8c77d3a56..023760972 100644
--- a/packages/web/src/designer/Designer.svelte
+++ b/packages/web/src/designer/Designer.svelte
@@ -632,9 +632,15 @@
             const domTable = domTables[x.designerId] as any;
             if (domTable) {
               const rect = domTable.getRect();
+              const rectZoomed = {
+                left: rect.left / zoomKoef,
+                right: rect.right / zoomKoef,
+                top: rect.top / zoomKoef,
+                bottom: rect.bottom / zoomKoef,
+              };
               return {
                 ...x,
-                isSelectedTable: rectanglesHaveIntersection(rect, bounds),
+                isSelectedTable: rectanglesHaveIntersection(rectZoomed, bounds),
               };
             }
           }),
diff --git a/packages/web/src/utility/moveDrag.ts b/packages/web/src/utility/moveDrag.ts
index 8712398b5..858ce875f 100644
--- a/packages/web/src/utility/moveDrag.ts
+++ b/packages/web/src/utility/moveDrag.ts
@@ -11,11 +11,16 @@ export default function moveDrag(node, dragEvents) {
   const handleMoveDown = e => {
     if (e.button != 0) return;
 
-    const zoomKoef = window.getComputedStyle(node)['zoom'];
+    // const zoomKoef = window.getComputedStyle(node)['zoom'];
 
     const clientRect = node.getBoundingClientRect();
-    clientX = clientRect.left * zoomKoef;
-    clientY = clientRect.top * zoomKoef;
+    clientX = clientRect.left;
+    clientY = clientRect.top;
+
+    // console.log('ZOOM', zoomKoef);
+    // console.log('CLIENT RECT', clientRect);
+    // console.log('e.clientX', e.clientX);
+    // console.log('e.clientY', e.clientY);
 
     startX = e.clientX;
     startY = e.clientY;
@@ -25,7 +30,7 @@ export default function moveDrag(node, dragEvents) {
   };
 
   const handleMoveMove = e => {
-    const zoomKoef = window.getComputedStyle(node)['zoom'];
+    // const zoomKoef = window.getComputedStyle(node)['zoom'];
 
     e.preventDefault();
     const diffX = e.clientX - startX;
@@ -36,7 +41,7 @@ export default function moveDrag(node, dragEvents) {
     onMove(diffX, diffY, e.clientX - clientX, e.clientY - clientY);
   };
   const handleMoveEnd = e => {
-    const zoomKoef = window.getComputedStyle(node)['zoom'];
+    // const zoomKoef = window.getComputedStyle(node)['zoom'];
 
     e.preventDefault();
     startX = null;