diff --git a/src/managers/DragDropManager.ts b/src/managers/DragDropManager.ts index cfdac0f..178ef5c 100644 --- a/src/managers/DragDropManager.ts +++ b/src/managers/DragDropManager.ts @@ -19,10 +19,6 @@ import { } from '../types/EventTypes'; import { MousePosition } from '../types/DragDropTypes'; -interface CachedElements { - scrollContainer: HTMLElement | null; -} - export class DragDropManager { private eventBus: IEventBus; @@ -46,12 +42,6 @@ export class DragDropManager { // Movement threshold to distinguish click from drag private readonly dragThreshold = 5; // pixels - private scrollContainer!: HTMLElement | null; - - // Auto-scroll properties - private autoScrollAnimationId: number | null = null; - private readonly scrollSpeed = 10; // pixels per frame - private readonly scrollThreshold = 30; // pixels from edge // Smooth drag animation private dragAnimationId: number | null = null; @@ -76,7 +66,6 @@ export class DragDropManager { document.body.addEventListener('mousedown', this.handleMouseDown.bind(this)); document.body.addEventListener('mouseup', this.handleMouseUp.bind(this)); - this.scrollContainer = document.querySelector('swp-scrollable-content') as HTMLElement; const calendarContainer = document.querySelector('swp-calendar-container'); if (calendarContainer) { @@ -94,21 +83,7 @@ export class DragDropManager { } else if (target.closest('swp-day-column')) { this.handleColumnMouseEnter(e as MouseEvent); } else if (target.closest('swp-event')) { - // Entered an event - activate hover tracking and set color - const eventElement = target.closest('swp-event'); - const mouseEvent = e as MouseEvent; - - // Only handle hover if mouse button is up - if (eventElement && !this.isDragStarted && mouseEvent.buttons === 0) { - // Clear any previous hover first - if (this.currentHoveredEvent && this.currentHoveredEvent !== eventElement) { - this.currentHoveredEvent.classList.remove('hover'); - } - - this.isHoverTrackingActive = true; - this.currentHoveredEvent = eventElement; - eventElement.classList.add('hover'); - } + this.handleEventMouseEnter(e as MouseEvent); } }, true); // Use capture phase @@ -249,14 +224,11 @@ export class DragDropManager { return true; } - /** - * Continue drag movement - update position and auto-scroll - */ + private continueDrag(currentPosition: MousePosition): void { if (!this.draggedClone!.hasAttribute("data-allday")) { // Calculate raw position from mouse (no snapping) const column = ColumnDetectionUtils.getColumnBounds(currentPosition); - console.log("continueDrag"); if (column) { // Calculate raw Y position relative to column (accounting for mouse offset) @@ -272,11 +244,7 @@ export class DragDropManager { } } - // Check for auto-scroll - this.checkAutoScroll(currentPosition); } - else - console.log("hasAttribute(data-allday)"); } /** @@ -305,7 +273,6 @@ export class DragDropManager { * Optimized mouse up handler with consolidated cleanup */ private handleMouseUp(event: MouseEvent): void { - this.stopAutoScroll(); this.stopDragAnimation(); if (this.draggedElement) { @@ -404,7 +371,6 @@ export class DragDropManager { // 4. Clean up state this.cleanupDragState(); - this.stopAutoScroll(); this.stopDragAnimation(); } @@ -485,82 +451,6 @@ export class DragDropManager { } - /** - * Optimized auto-scroll check with cached container - */ - private checkAutoScroll(mousePosition: MousePosition): void { - - if (this.scrollContainer == null) - return; - - const containerRect = this.scrollContainer.getBoundingClientRect(); - const mouseY = mousePosition.clientY; - - // Calculate distances from edges - const distanceFromTop = mousePosition.y - containerRect.top; - const distanceFromBottom = containerRect.bottom - mousePosition.y; - - // Check if we need to scroll - if (distanceFromTop <= this.scrollThreshold && distanceFromTop > 0) { - this.startAutoScroll('up', mousePosition); - } else if (distanceFromBottom <= this.scrollThreshold && distanceFromBottom > 0) { - this.startAutoScroll('down', mousePosition); - } else { - this.stopAutoScroll(); - } - } - - /** - * Optimized auto-scroll with cached container reference - */ - private startAutoScroll(direction: 'up' | 'down', event: MousePosition): void { - if (this.autoScrollAnimationId !== null) return; - - const scroll = () => { - if (!this.scrollContainer || !this.draggedElement) { - this.stopAutoScroll(); - return; - } - - const scrollAmount = direction === 'up' ? -this.scrollSpeed : this.scrollSpeed; - this.scrollContainer.scrollTop += scrollAmount; - - // Emit updated position during scroll - adjust for scroll movement - if (this.draggedElement) { - // During autoscroll, we need to calculate position relative to the scrolled content - // The mouse hasn't moved, but the content has scrolled - const columnElement = ColumnDetectionUtils.getColumnBounds(event); - - if (columnElement) { - const columnRect = columnElement.boundingClientRect; - // Calculate free position relative to column, accounting for scroll movement (no snapping during scroll) - const relativeY = this.currentMouseY - columnRect.top - this.mouseOffset.y; - const freeY = Math.max(0, relativeY); - - this.eventBus.emit('drag:auto-scroll', { - draggedElement: this.draggedElement, - snappedY: freeY, // Actually free position during scroll - scrollTop: this.scrollContainer.scrollTop - }); - } - } - - this.autoScrollAnimationId = requestAnimationFrame(scroll); - }; - - this.autoScrollAnimationId = requestAnimationFrame(scroll); - } - - /** - * Stop auto-scroll animation - */ - private stopAutoScroll(): void { - if (this.autoScrollAnimationId !== null) { - cancelAnimationFrame(this.autoScrollAnimationId); - this.autoScrollAnimationId = null; - } - } - /** * Stop drag animation */ @@ -600,6 +490,26 @@ export class DragDropManager { return null; } + /** + * Handle mouse enter on swp-event - activate hover tracking + */ + private handleEventMouseEnter(event: MouseEvent): void { + const target = event.target as HTMLElement; + const eventElement = target.closest('swp-event'); + + // Only handle hover if mouse button is up + if (eventElement && !this.isDragStarted && event.buttons === 0) { + // Clear any previous hover first + if (this.currentHoveredEvent && this.currentHoveredEvent !== eventElement) { + this.currentHoveredEvent.classList.remove('hover'); + } + + this.isHoverTrackingActive = true; + this.currentHoveredEvent = eventElement; + eventElement.classList.add('hover'); + } + } + /** * Handle mouse enter on calendar header - simplified using native events */