From ce106542355772afae38048d0b1510b43e87f74f Mon Sep 17 00:00:00 2001
From: Pahul Gogna <135852041+PahulGogna@users.noreply.github.com>
Date: Sat, 26 Oct 2024 00:33:51 +0530
Subject: [PATCH 1/2] feat:prevent unwanted movements of elements on mouse
 click

---
 packages/excalidraw/components/App.tsx | 29 ++++++++++++++++++++++++++
 1 file changed, 29 insertions(+)

diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx
index fb0c24d91..afcdea4e1 100644
--- a/packages/excalidraw/components/App.tsx
+++ b/packages/excalidraw/components/App.tsx
@@ -531,6 +531,7 @@ let isDraggingScrollBar: boolean = false;
 let currentScrollBars: ScrollBars = { horizontal: null, vertical: null };
 let touchTimeout = 0;
 let invalidateContextMenu = false;
+let elementStartedMoving = false;
 
 /**
  * Map of youtube embed video states
@@ -7900,6 +7901,31 @@ class App extends React.Component<AppProps, AppState> {
           !this.state.editingTextElement &&
           this.state.activeEmbeddable?.state !== "active"
         ) {
+
+          if(!this.state.editingLinearElement && !this.state.editingFrame && !this.state.resizingElement){
+
+            // this determines the threshold for dragging the element initially
+            const MOVEMENT_BUFFER = 4;
+  
+            // this calculates the buffer for the movement based on the zoom level
+            const ZOOM_RELETIVE_MOVEMENT_BUFFER = MOVEMENT_BUFFER / this.state.zoom.value;
+            
+            if(typeof(ZOOM_RELETIVE_MOVEMENT_BUFFER) === 'number'){
+  
+              if (
+                pointDistance(
+                  pointFrom(pointerCoords.x, pointerCoords.y),
+                  pointFrom(pointerDownState.origin.x, pointerDownState.origin.y),
+                ) < ZOOM_RELETIVE_MOVEMENT_BUFFER && !elementStartedMoving
+              ) {
+                return;
+              }
+            }
+  
+            // sets the elementStartedMoving to true so that the buffer is only used once
+            elementStartedMoving = true;
+          }
+
           const dragOffset = {
             x: pointerCoords.x - pointerDownState.origin.x,
             y: pointerCoords.y - pointerDownState.origin.y,
@@ -8408,6 +8434,9 @@ class App extends React.Component<AppProps, AppState> {
         isCropping,
       } = this.state;
 
+      // sets the elementStartedMoving to false so that the buffer can be used again
+      elementStartedMoving = false;
+
       this.setState((prevState) => ({
         isResizing: false,
         isRotating: false,

From fd0a53fe024358bc644cf8e45a39258db9d9a791 Mon Sep 17 00:00:00 2001
From: Pahul Gogna <135852041+PahulGogna@users.noreply.github.com>
Date: Wed, 11 Dec 2024 01:10:42 +0530
Subject: [PATCH 2/2] fix: improving buffer check logic.

---
 packages/excalidraw/components/App.tsx | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx
index 8b2175d5b..2a4c2c869 100644
--- a/packages/excalidraw/components/App.tsx
+++ b/packages/excalidraw/components/App.tsx
@@ -8109,19 +8109,18 @@ class App extends React.Component<AppProps, AppState> {
             const MOVEMENT_BUFFER = 4;
   
             // this calculates the buffer for the movement based on the zoom level
-            const ZOOM_RELETIVE_MOVEMENT_BUFFER = MOVEMENT_BUFFER / this.state.zoom.value;
+            const ZOOM_RELETIVE_MOVEMENT_BUFFER: number = MOVEMENT_BUFFER / this.state.zoom.value;
+
+            console.log(ZOOM_RELETIVE_MOVEMENT_BUFFER); // TODO: remove
             
-            if(typeof(ZOOM_RELETIVE_MOVEMENT_BUFFER) === 'number'){
-  
               if (
-                pointDistance(
+                  !elementStartedMoving && pointDistance(
                   pointFrom(pointerCoords.x, pointerCoords.y),
                   pointFrom(pointerDownState.origin.x, pointerDownState.origin.y),
-                ) < ZOOM_RELETIVE_MOVEMENT_BUFFER && !elementStartedMoving
+                ) < ZOOM_RELETIVE_MOVEMENT_BUFFER
               ) {
                 return;
               }
-            }
   
             // sets the elementStartedMoving to true so that the buffer is only used once
             elementStartedMoving = true;