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

Improves edge scroll and drag handling

Browse source 
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
Download patch file Download diff file Expand all files Collapse all files

4
src/managers/EdgeScrollManager.ts
View file

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

78
src/managers/HeaderManager.ts
View file

@ -13,13 +13,10 @@ import { ColumnDetectionUtils } from '../utils/ColumnDetectionUtils';
*/ */
export class HeaderManager { export class HeaderManager {
// Event listeners for drag events
private dragMouseEnterHeaderListener: ((event: Event) => void) | null = null;
private dragMouseLeaveHeaderListener: ((event: Event) => void) | null = null;
constructor() { constructor() {
// Bind methods for event listeners // Bind handler methods for event listeners
this.setupHeaderDragListeners = this.setupHeaderDragListeners.bind(this); this.handleDragMouseEnterHeader = this.handleDragMouseEnterHeader.bind(this);
this.handleDragMouseLeaveHeader = this.handleDragMouseLeaveHeader.bind(this);
// Listen for navigation events to update header // Listen for navigation events to update header
this.setupNavigationListener(); this.setupNavigationListener();
@ -40,46 +37,51 @@ 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 { public setupHeaderDragListeners(): void {
console.log('🎯 HeaderManager: Setting up drag event listeners'); console.log('🎯 HeaderManager: Setting up drag event listeners');
// Create and store event listeners // Subscribe to drag events from DragDropManager
this.dragMouseEnterHeaderListener = (event: Event) => { eventBus.on('drag:mouseenter-header', this.handleDragMouseEnterHeader);
const { targetColumn: targetDate, mousePosition, originalElement, draggedClone: cloneElement } = (event as CustomEvent<DragMouseEnterHeaderEventPayload>).detail; eventBus.on('drag:mouseleave-header', this.handleDragMouseLeaveHeader);
console.log('🎯 HeaderManager: Received drag:mouseenter-header', {
targetDate,
originalElement: !!originalElement,
cloneElement: !!cloneElement
});
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;
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'); 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,
originalElement: !!originalElement,
cloneElement: !!cloneElement
});
if (targetDate) {
const calendarType = calendarConfig.getCalendarMode();
const headerRenderer = CalendarTypeFactory.getHeaderRenderer(calendarType);
}
}
/**
* 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
});
}
/** /**
* Setup navigation event listener * Setup navigation event listener
*/ */