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

Refactors event rendering and drag-and-drop logic

Browse source 
Simplifies event drag handling by removing redundant clone management
Optimizes single column event rendering and cleanup process
Removes unnecessary logging and console output
Improves event update and re-rendering strategies

Enhances performance and reduces complexity in event manipulation
This commit is contained in:
Janus C. H. Knudsen 2025-11-06 21:11:22 +01:00
parent fba85094d7
commit 3b6f0407fb
5 changed files with 89 additions and 98 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/renderers/EventRenderer.ts
View file

@ -16,10 +16,11 @@ import { EventLayoutCoordinator, IGridGroupLayout, IStackedEventLayout } from '.
export interface IEventRenderer {
renderEvents(events: ICalendarEvent[], container: HTMLElement): void;
clearEvents(container?: HTMLElement): void;
renderSingleColumnEvents?(column: IColumnBounds, events: ICalendarEvent[]): void;
handleDragStart?(payload: IDragStartEventPayload): void;
handleDragMove?(payload: IDragMoveEventPayload): void;
handleDragAutoScroll?(eventId: string, snappedY: number): void;
handleDragEnd?(eventId: string, originalElement: HTMLElement, draggedClone: HTMLElement, finalColumn: IColumnBounds, finalY: number): void;
handleDragEnd?(originalElement: HTMLElement, draggedClone: HTMLElement, finalColumn: IColumnBounds, finalY: number): void;
handleEventClick?(eventId: string, originalElement: HTMLElement): void;
handleColumnChange?(payload: IDragColumnChangeEventPayload): void;
handleNavigationCompleted?(): void;
@ -153,7 +154,7 @@ export class DateEventRenderer implements IEventRenderer {
let eventsLayer = payload.targetColumn.element.querySelector('swp-events-layer');
// Add "clone-" prefix to match clone ID pattern
timedClone.dataset.eventId = `clone-${payload.calendarEvent.id}`;
//timedClone.dataset.eventId = `clone-${payload.calendarEvent.id}`;
// Remove old all-day clone and replace with new timed clone
payload.draggedClone.remove();
@ -165,7 +166,7 @@ export class DateEventRenderer implements IEventRenderer {
/**
* Handle drag end event
*/
public handleDragEnd(eventId: string, originalElement: HTMLElement, draggedClone: HTMLElement, finalColumn: IColumnBounds, finalY: number): void {
public handleDragEnd(originalElement: HTMLElement, draggedClone: HTMLElement, finalColumn: IColumnBounds, finalY: number): void {
if (!draggedClone || !originalElement) {
console.warn('Missing draggedClone or originalElement');
return;
@ -187,6 +188,13 @@ export class DateEventRenderer implements IEventRenderer {
// Clean up instance state
this.draggedClone = null;
this.originalEvent = null;
// Clean up any remaining day event clones
const dayEventClone = document.querySelector(`swp-event[data-event-id="clone-${cloneId}"]`);
if (dayEventClone) {
dayEventClone.remove();
}
}
/**
@ -226,6 +234,18 @@ export class DateEventRenderer implements IEventRenderer {
});
}
/**
* Render events for a single column
*/
public renderSingleColumnEvents(column: IColumnBounds, events: ICalendarEvent[]): void {
const columnEvents = this.getEventsForColumn(column.element, events);
const eventsLayer = column.element.querySelector('swp-events-layer') as HTMLElement;
if (eventsLayer) {
this.renderColumnEvents(columnEvents, eventsLayer);
}
}
/**
* Render events in a column using combined stacking + grid algorithm
*/