Improves edge scroll and drag handling

Increases edge scrolling speed for improved user experience.

Refactors header drag event handling to use handler methods for better organization.
This commit is contained in:
Janus C. H. Knudsen 2025-10-14 17:47:12 +02:00
parent 5f4a7fa9b1
commit 5b0ae0ca5c
2 changed files with 42 additions and 40 deletions

View file

@ -22,8 +22,8 @@ export class EdgeScrollManager {
// Constants - fixed values as per requirements
private readonly OUTER_ZONE = 100; // px from edge (slow zone)
private readonly INNER_ZONE = 50; // px from edge (fast zone)
private readonly SLOW_SPEED_PXS = 80; // px/sec in outer zone
private readonly FAST_SPEED_PXS = 240; // px/sec in inner zone
private readonly SLOW_SPEED_PXS = 140; // px/sec in outer zone
private readonly FAST_SPEED_PXS = 640; // px/sec in inner zone
constructor(private eventBus: IEventBus) {
this.init();

View file

@ -13,13 +13,10 @@ import { ColumnDetectionUtils } from '../utils/ColumnDetectionUtils';
*/
export class HeaderManager {
// Event listeners for drag events
private dragMouseEnterHeaderListener: ((event: Event) => void) | null = null;
private dragMouseLeaveHeaderListener: ((event: Event) => void) | null = null;
constructor() {
// Bind methods for event listeners
this.setupHeaderDragListeners = this.setupHeaderDragListeners.bind(this);
// Bind handler methods for event listeners
this.handleDragMouseEnterHeader = this.handleDragMouseEnterHeader.bind(this);
this.handleDragMouseLeaveHeader = this.handleDragMouseLeaveHeader.bind(this);
// Listen for navigation events to update header
this.setupNavigationListener();
@ -40,14 +37,24 @@ export class HeaderManager {
}
/**
* Setup header drag event listeners - REFACTORED to listen to DragDropManager events
* Setup header drag event listeners - Listen to DragDropManager events
*/
public setupHeaderDragListeners(): void {
console.log('🎯 HeaderManager: Setting up drag event listeners');
// Create and store event listeners
this.dragMouseEnterHeaderListener = (event: Event) => {
const { targetColumn: targetDate, mousePosition, originalElement, draggedClone: cloneElement } = (event as CustomEvent<DragMouseEnterHeaderEventPayload>).detail;
// Subscribe to drag events from DragDropManager
eventBus.on('drag:mouseenter-header', this.handleDragMouseEnterHeader);
eventBus.on('drag:mouseleave-header', this.handleDragMouseLeaveHeader);
console.log('✅ HeaderManager: Drag event listeners attached');
}
/**
* Handle drag mouse enter header event
*/
private handleDragMouseEnterHeader(event: Event): void {
const { targetColumn: targetDate, mousePosition, originalElement, draggedClone: cloneElement } =
(event as CustomEvent<DragMouseEnterHeaderEventPayload>).detail;
console.log('🎯 HeaderManager: Received drag:mouseenter-header', {
targetDate,
@ -58,26 +65,21 @@ export class HeaderManager {
if (targetDate) {
const calendarType = calendarConfig.getCalendarMode();
const headerRenderer = CalendarTypeFactory.getHeaderRenderer(calendarType);
}
};
}
this.dragMouseLeaveHeaderListener = (event: Event) => {
const { targetDate, mousePosition, originalElement, draggedClone: cloneElement } = (event as CustomEvent<DragMouseLeaveHeaderEventPayload>).detail;
/**
* Handle drag mouse leave header event
*/
private handleDragMouseLeaveHeader(event: Event): void {
const { targetDate, mousePosition, originalElement, draggedClone: cloneElement } =
(event as CustomEvent<DragMouseLeaveHeaderEventPayload>).detail;
console.log('🚪 HeaderManager: Received drag:mouseleave-header', {
targetDate,
originalElement: !!originalElement,
cloneElement: !!cloneElement
});
};
// Listen for drag events from DragDropManager
eventBus.on('drag:mouseenter-header', this.dragMouseEnterHeaderListener);
eventBus.on('drag:mouseleave-header', this.dragMouseLeaveHeaderListener);
console.log('✅ HeaderManager: Drag event listeners attached');
}
/**