Janus007/Calendar
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

wip

Browse source
This commit is contained in:
Janus C. H. Knudsen 2025-10-13 21:02:09 +02:00
parent 9a7a90c124
commit b0894629df
1 changed files with 24 additions and 45 deletions
Download patch file Download diff file Expand all files Collapse all files

69
src/managers/DragDropManager.ts
View file

@ -44,8 +44,8 @@ export class DragDropManager {
// Scroll compensation // Scroll compensation
private scrollableContent: HTMLElement | null = null; private scrollableContent: HTMLElement | null = null;
private initialScrollTop = 0; private accumulatedScrollDelta = 0; // Total scroll movement since drag start
private initialCloneTop = 0; private lastScrollTop = 0; // Last scroll position for delta calculation
private isScrollCompensating = false; // Track if scroll compensation is active private isScrollCompensating = false; // Track if scroll compensation is active
private hasScrolledDuringDrag = false; // Track if we have scrolled during this drag operation private hasScrolledDuringDrag = false; // Track if we have scrolled during this drag operation
private scrollListener: ((e: Event) => void) | null = null; private scrollListener: ((e: Event) => void) | null = null;
@ -129,12 +129,18 @@ export class DragDropManager {
this.eventBus.on('edgescroll:started', () => { this.eventBus.on('edgescroll:started', () => {
this.isScrollCompensating = true; this.isScrollCompensating = true;
this.hasScrolledDuringDrag = 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.eventBus.on('edgescroll:stopped', () => {
this.isScrollCompensating = false; this.isScrollCompensating = false;
console.log('🛑 DragDropManager: Edge-scroll stopped - enabling continueDrag()'); console.log('🛑 DragDropManager: Edge-scroll stopped');
}); });
} }
@ -185,8 +191,6 @@ export class DragDropManager {
*/ */
private handleMouseMove(event: MouseEvent): void { private handleMouseMove(event: MouseEvent): void {
if (this.isScrollCompensating) return;
//this.currentMouseY = event.clientY; //this.currentMouseY = event.clientY;
// this.lastMousePosition = { x: event.clientX, y: 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) { if (this.isDragStarted && this.originalElement && this.draggedClone) {
this.continueDrag(this.currentMousePosition); this.continueDrag(this.currentMousePosition);
this.detectColumnChange(this.currentMousePosition); this.detectColumnChange(this.currentMousePosition);
@ -268,10 +272,9 @@ export class DragDropManager {
const columnRect = column.boundingClientRect; const columnRect = column.boundingClientRect;
let eventTopY = currentPosition.y - columnRect.top - this.mouseOffset.y; let eventTopY = currentPosition.y - columnRect.top - this.mouseOffset.y;
// Kompenser for scroll bevægelse hvis vi har scrollet // Kompenser for akkumuleret scroll bevægelse
if (this.scrollableContent && this.initialScrollTop > 0) { if (this.accumulatedScrollDelta !== 0) {
const totalScrollDelta = this.scrollableContent.scrollTop - this.initialScrollTop; eventTopY += this.accumulatedScrollDelta;
eventTopY += totalScrollDelta;
} }
this.targetY = Math.max(0, eventTopY); 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 { private handleScroll(): void {
if (!this.isDragStarted || !this.draggedClone || !this.scrollableContent || !this.isScrollCompensating) return; 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 currentScrollTop = this.scrollableContent.scrollTop;
const totalScrollDelta = currentScrollTop - this.initialScrollTop; const scrollDelta = currentScrollTop - this.lastScrollTop;
// Beregn ny position baseret på initial position + total scroll delta // Akkumuler scroll bevægelse (continueDrag vil bruge denne)
const newTop = this.initialCloneTop + totalScrollDelta; this.accumulatedScrollDelta += scrollDelta;
this.lastScrollTop = currentScrollTop;
// 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();
}
console.log('📜 DragDropManager: Scroll compensation', { console.log('📜 DragDropManager: Scroll compensation', {
initialScrollTop: this.initialScrollTop,
currentScrollTop, currentScrollTop,
totalScrollDelta, lastScrollTop: this.lastScrollTop - scrollDelta,
initialCloneTop: this.initialCloneTop, scrollDelta,
newTop, accumulatedScrollDelta: this.accumulatedScrollDelta
targetY: this.targetY,
currentY: this.currentY
}); });
} }
@ -525,8 +504,8 @@ export class DragDropManager {
this.currentColumn = null; this.currentColumn = null;
this.isDragStarted = false; this.isDragStarted = false;
this.hasScrolledDuringDrag = false; this.hasScrolledDuringDrag = false;
this.initialScrollTop = 0; this.accumulatedScrollDelta = 0;
this.initialCloneTop = 0; this.lastScrollTop = 0;
} }
/** /**