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

Improves drag scroll compensation accuracy

Browse source 
Refactors drag scroll compensation to use a direct scroll delta instead of accumulating the scroll.

This improves accuracy and responsiveness during drag operations when the scrollable content is being scrolled. It now updates the target position immediately as the user scrolls.
This commit is contained in:
Janus C. H. Knudsen 2025-10-13 21:22:33 +02:00
parent b0894629df
commit 3fd42f1f9b
1 changed files with 12 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

23
src/managers/DragDropManager.ts
View file

@ -44,7 +44,7 @@ export class DragDropManager {
// Scroll compensation
private scrollableContent: HTMLElement | null = null;
private accumulatedScrollDelta = 0; // Total scroll movement since drag start
private scrollDeltaY = 0; // Current scroll delta to apply in continueDrag
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
@ -270,12 +270,10 @@ export class DragDropManager {
if (column) {
// Calculate raw Y position relative to column (accounting for mouse offset)
const columnRect = column.boundingClientRect;
let eventTopY = currentPosition.y - columnRect.top - this.mouseOffset.y;
// Kompenser for akkumuleret scroll bevægelse
if (this.accumulatedScrollDelta !== 0) {
eventTopY += this.accumulatedScrollDelta;
}
// Beregn position fra mus + scroll delta kompensation
const adjustedMouseY = currentPosition.y + this.scrollDeltaY;
const eventTopY = adjustedMouseY - columnRect.top - this.mouseOffset.y;
this.targetY = Math.max(0, eventTopY);
this.targetColumn = column;
@ -464,7 +462,7 @@ export class DragDropManager {
}
/**
* Handle scroll during drag - track accumulated scroll delta
* Handle scroll during drag - update scrollDeltaY and call continueDrag
*/
private handleScroll(): void {
if (!this.isDragStarted || !this.draggedClone || !this.scrollableContent || !this.isScrollCompensating) return;
@ -472,15 +470,18 @@ export class DragDropManager {
const currentScrollTop = this.scrollableContent.scrollTop;
const scrollDelta = currentScrollTop - this.lastScrollTop;
// Akkumuler scroll bevægelse (continueDrag vil bruge denne)
this.accumulatedScrollDelta += scrollDelta;
// Gem scroll delta for continueDrag
this.scrollDeltaY += scrollDelta;
this.lastScrollTop = currentScrollTop;
// Kald continueDrag med nuværende mus position
this.continueDrag(this.currentMousePosition);
console.log('📜 DragDropManager: Scroll compensation', {
currentScrollTop,
lastScrollTop: this.lastScrollTop - scrollDelta,
scrollDelta,
accumulatedScrollDelta: this.accumulatedScrollDelta
scrollDeltaY: this.scrollDeltaY
});
}
@ -504,7 +505,7 @@ export class DragDropManager {
this.currentColumn = null;
this.isDragStarted = false;
this.hasScrolledDuringDrag = false;
this.accumulatedScrollDelta = 0;
this.scrollDeltaY = 0;
this.lastScrollTop = 0;
}