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

Implements edge scrolling functionality

Browse source 
Adds edge scrolling to automatically scroll the calendar
when dragging an event near the edges of the view.

This improves the drag-and-drop experience by allowing users
to move events beyond the visible area.

Removes auto-scroll logic from the event renderer, centralizing
the scrolling behavior within the new edge scroll manager.
This commit is contained in:
Janus C. H. Knudsen 2025-10-12 09:21:32 +02:00
parent 40b19a092c
commit 8df1f6c4f1
5 changed files with 139 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/renderers/EventRenderer.ts
View file

@ -97,19 +97,6 @@ export class DateEventRenderer implements EventRendererStrategy {
swpEvent.updatePosition(columnDate, payload.snappedY);
}
/**
* Handle drag auto-scroll event
*/
public handleDragAutoScroll(eventId: string, snappedY: number): void {
if (!this.draggedClone) return;
// Update position directly using the calculated snapped position
this.draggedClone.style.top = snappedY + 'px';
// Update timestamp display
//this.updateCloneTimestamp(this.draggedClone, snappedY); //TODO: Commented as, we need to move all this scroll logic til scroll manager away from eventrenderer
}
/**
* Handle column change during drag
*/

11
src/renderers/EventRendererManager.ts
View file

@ -126,7 +126,6 @@ export class EventRenderingService {
private setupDragEventListeners(): void {
this.setupDragStartListener();
this.setupDragMoveListener();
this.setupDragAutoScrollListener();
this.setupDragEndListener();
this.setupDragColumnChangeListener();
this.setupDragMouseLeaveHeaderListener();
@ -162,16 +161,6 @@ export class EventRenderingService {
});
}
private setupDragAutoScrollListener(): void {
this.eventBus.on('drag:auto-scroll', (event: Event) => {
const { draggedElement, snappedY } = (event as CustomEvent).detail;
if (this.strategy.handleDragAutoScroll) {
const eventId = draggedElement.dataset.eventId || '';
this.strategy.handleDragAutoScroll(eventId, snappedY);
}
});
}
private setupDragEndListener(): void {
this.eventBus.on('drag:end', (event: Event) => {
const { originalElement: draggedElement, sourceColumn, finalPosition, target } = (event as CustomEvent<DragEndEventPayload>).detail;