From a0344c61437c4d5c161537d7577afc7fbb25bec7 Mon Sep 17 00:00:00 2001 From: "Janus C. H. Knudsen" Date: Sun, 12 Oct 2025 23:17:22 +0200 Subject: [PATCH] Improves drag event handling and scrolling Refactors drag and drop event handling for smoother updates. Tracks the current mouse position during drag operations to improve the accuracy of position updates. Adjusts edge scrolling behavior. --- src/managers/DragDropManager.ts | 10 ++++++---- src/managers/EdgeScrollManager.ts | 3 ++- src/renderers/EventRenderer.ts | 2 +- 3 files changed, 9 insertions(+), 6 deletions(-) diff --git a/src/managers/DragDropManager.ts b/src/managers/DragDropManager.ts index 5d52d1f..a3e6024 100644 --- a/src/managers/DragDropManager.ts +++ b/src/managers/DragDropManager.ts @@ -24,6 +24,7 @@ export class DragDropManager { // Mouse tracking with optimized state private mouseDownPosition: MousePosition = { x: 0, y: 0 }; + private currentMousePosition: MousePosition = { x: 0, y: 0 }; private mouseOffset: MousePosition = { x: 0, y: 0 }; // Drag state @@ -160,6 +161,7 @@ export class DragDropManager { if (event.buttons === 1) { const currentPosition: MousePosition = { x: event.clientX, y: event.clientY }; + this.currentMousePosition = currentPosition; // Track current mouse position // Try to initialize drag if not started if (!this.isDragStarted && this.originalElement) { @@ -168,9 +170,9 @@ export class DragDropManager { } } - // Continue drag if started + // Continue drag if started //TODO: This has to be fixed... it fires way too many events, we can do better if (this.isDragStarted && this.originalElement && this.draggedClone) { - console.log("Continue drag if started", this.draggedClone); + //console.log("Continue drag if started", this.draggedClone); this.continueDrag(currentPosition); this.detectColumnChange(currentPosition); } @@ -386,7 +388,7 @@ export class DragDropManager { const dragMovePayload: DragMoveEventPayload = { originalElement: this.originalElement!, draggedClone: this.draggedClone, // Always uses current reference - mousePosition: this.mouseDownPosition, + mousePosition: this.currentMousePosition, // Use current mouse position! snappedY: this.currentY, columnBounds: this.targetColumn, mouseOffset: this.mouseOffset @@ -402,7 +404,7 @@ export class DragDropManager { const dragMovePayload: DragMoveEventPayload = { originalElement: this.originalElement!, draggedClone: this.draggedClone, - mousePosition: this.mouseDownPosition, + mousePosition: this.currentMousePosition, // Use current mouse position! snappedY: this.currentY, columnBounds: this.targetColumn, mouseOffset: this.mouseOffset diff --git a/src/managers/EdgeScrollManager.ts b/src/managers/EdgeScrollManager.ts index 82858de..be043e7 100644 --- a/src/managers/EdgeScrollManager.ts +++ b/src/managers/EdgeScrollManager.ts @@ -84,6 +84,7 @@ export class EdgeScrollManager { } private updateMouseY(y: number): void { + // console.log('🖱️ EdgeScrollManager: updateMouseY called', { oldMouseY: this.mouseY, newMouseY: y }); this.mouseY = y; // Ensure RAF loop is running during drag if (this.isDragging && this.scrollRAF === null) { @@ -113,7 +114,7 @@ export class EdgeScrollManager { // Beregn ny position baseret på initial position + total scroll delta const newTop = this.initialCloneTop + totalScrollDelta; - this.draggedClone.style.top = `${newTop}px`; + //this.draggedClone.style.top = `${newTop}px`; console.log('📜 EdgeScrollManager: Scroll event - updated clone', { initialScrollTop: this.initialScrollTop, diff --git a/src/renderers/EventRenderer.ts b/src/renderers/EventRenderer.ts index 01af06a..706be34 100644 --- a/src/renderers/EventRenderer.ts +++ b/src/renderers/EventRenderer.ts @@ -91,7 +91,7 @@ export class DateEventRenderer implements EventRendererStrategy { */ public handleDragMove(payload: DragMoveEventPayload): void { - // Delegate to SwpEventElement to update position and timestamps + console.log('handleDragMove', payload) const swpEvent = payload.draggedClone as SwpEventElement; const columnDate = this.dateService.parseISO(payload.columnBounds!!.date); swpEvent.updatePosition(columnDate, payload.snappedY);