diff --git a/src/managers/DragDropManager.ts b/src/managers/DragDropManager.ts index ee23303..e6ba9f7 100644 --- a/src/managers/DragDropManager.ts +++ b/src/managers/DragDropManager.ts @@ -44,8 +44,8 @@ export class DragDropManager { // Scroll compensation private scrollableContent: HTMLElement | null = null; - private initialScrollTop = 0; - private initialCloneTop = 0; + private accumulatedScrollDelta = 0; // Total scroll movement since drag start + private lastScrollTop = 0; // Last scroll position for delta calculation private isScrollCompensating = false; // Track if scroll compensation is active private hasScrolledDuringDrag = false; // Track if we have scrolled during this drag operation private scrollListener: ((e: Event) => void) | null = null; @@ -129,12 +129,18 @@ export class DragDropManager { this.eventBus.on('edgescroll:started', () => { this.isScrollCompensating = true; this.hasScrolledDuringDrag = true; - console.log('🎬 DragDropManager: Edge-scroll started - disabling continueDrag()'); + + // Gem nuværende scroll position for delta beregning + if (this.scrollableContent) { + this.lastScrollTop = this.scrollableContent.scrollTop; + } + + console.log('🎬 DragDropManager: Edge-scroll started'); }); this.eventBus.on('edgescroll:stopped', () => { this.isScrollCompensating = false; - console.log('🛑 DragDropManager: Edge-scroll stopped - enabling continueDrag()'); + console.log('🛑 DragDropManager: Edge-scroll stopped'); }); } @@ -184,8 +190,6 @@ export class DragDropManager { * Optimized mouse move handler with consolidated position calculations */ private handleMouseMove(event: MouseEvent): void { - - if (this.isScrollCompensating) return; //this.currentMouseY = event.clientY; // this.lastMousePosition = { x: event.clientX, y: event.clientY }; @@ -206,7 +210,7 @@ export class DragDropManager { } } - // Continue drag if started + // Continue drag if started (også under scroll - accumulatedScrollDelta kompenserer) if (this.isDragStarted && this.originalElement && this.draggedClone) { this.continueDrag(this.currentMousePosition); this.detectColumnChange(this.currentMousePosition); @@ -268,10 +272,9 @@ export class DragDropManager { const columnRect = column.boundingClientRect; let eventTopY = currentPosition.y - columnRect.top - this.mouseOffset.y; - // Kompenser for scroll bevægelse hvis vi har scrollet - if (this.scrollableContent && this.initialScrollTop > 0) { - const totalScrollDelta = this.scrollableContent.scrollTop - this.initialScrollTop; - eventTopY += totalScrollDelta; + // Kompenser for akkumuleret scroll bevægelse + if (this.accumulatedScrollDelta !== 0) { + eventTopY += this.accumulatedScrollDelta; } this.targetY = Math.max(0, eventTopY); @@ -461,47 +464,23 @@ export class DragDropManager { } /** - * Handle scroll during drag - compensate clone position via targetY/currentY + * Handle scroll during drag - track accumulated scroll delta */ private handleScroll(): void { if (!this.isDragStarted || !this.draggedClone || !this.scrollableContent || !this.isScrollCompensating) return; - // First time scrolling - save initial positions NOW! - if(this.initialScrollTop == 0) { - this.initialScrollTop = this.scrollableContent.scrollTop; - } - if(this.initialCloneTop == 0) { - this.initialCloneTop = parseFloat(this.draggedClone.style.top || '0'); - - console.log('💾 DragDropManager: Scroll compensation started', { - initialScrollTop: this.initialScrollTop, - initialCloneTop: this.initialCloneTop - }); - } - const currentScrollTop = this.scrollableContent.scrollTop; - const totalScrollDelta = currentScrollTop - this.initialScrollTop; - - // Beregn ny position baseret på initial position + total scroll delta - const newTop = this.initialCloneTop + totalScrollDelta; + const scrollDelta = currentScrollTop - this.lastScrollTop; - // Opdater targetY og currentY i stedet for direkte clone opdatering - this.targetY = newTop; - this.currentY = newTop; - - // Kald animateDrag() hvis ikke allerede kører - if (this.dragAnimationId === null) { - this.animateDrag(); - } + // Akkumuler scroll bevægelse (continueDrag vil bruge denne) + this.accumulatedScrollDelta += scrollDelta; + this.lastScrollTop = currentScrollTop; console.log('📜 DragDropManager: Scroll compensation', { - initialScrollTop: this.initialScrollTop, currentScrollTop, - totalScrollDelta, - initialCloneTop: this.initialCloneTop, - newTop, - targetY: this.targetY, - currentY: this.currentY + lastScrollTop: this.lastScrollTop - scrollDelta, + scrollDelta, + accumulatedScrollDelta: this.accumulatedScrollDelta }); } @@ -525,8 +504,8 @@ export class DragDropManager { this.currentColumn = null; this.isDragStarted = false; this.hasScrolledDuringDrag = false; - this.initialScrollTop = 0; - this.initialCloneTop = 0; + this.accumulatedScrollDelta = 0; + this.lastScrollTop = 0; } /**