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

Improves drag event handling and scrolling

Browse source 
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.
This commit is contained in:
Janus C. H. Knudsen 2025-10-12 23:17:22 +02:00
parent e620c919aa
commit a0344c6143
3 changed files with 9 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/managers/DragDropManager.ts
View file

@ -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

3
src/managers/EdgeScrollManager.ts
View file

@ -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,