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

Just some cleanup

Browse source
This commit is contained in:
Janus Knudsen 2025-08-13 23:05:58 +02:00
parent cdc7e55a92
commit b03707853a
3 changed files with 63 additions and 88 deletions
Download patch file Download diff file Expand all files Collapse all files

73
src/renderers/EventRenderer.ts
View file

@ -30,28 +30,35 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
// Events should already be filtered by DataManager - no need to filter here
console.log('BaseEventRenderer: Rendering', events.length, 'pre-filtered events');
// Render each event in the correct column
events.forEach(event => {
const column = this.findColumn(event);
// OPTIMIZATION: Column-first rendering instead of event-first
// This is much more efficient when there are many events
const columns = this.getColumns();
console.log(`BaseEventRenderer: Found ${columns.length} columns to render events in`);
columns.forEach(column => {
const columnEvents = this.getEventsForColumn(column, events);
console.log(`BaseEventRenderer: Rendering ${columnEvents.length} events in column`);
if (column) {
const eventsLayer = column.querySelector('swp-events-layer');
if (eventsLayer) {
const eventsLayer = column.querySelector('swp-events-layer');
if (eventsLayer) {
columnEvents.forEach(event => {
console.log(`BaseEventRenderer: Rendering event "${event.title}" in events layer`);
this.renderEvent(event, eventsLayer, config);
// Debug: Verify event was actually added
const renderedEvents = eventsLayer.querySelectorAll('swp-event');
console.log(`BaseEventRenderer: Events layer now has ${renderedEvents.length} events`);
} else {
console.warn('BaseEventRenderer: No events layer found in column for event', event.title, 'Column:', column);
}
});
// Debug: Verify events were actually added
const renderedEvents = eventsLayer.querySelectorAll('swp-event');
console.log(`BaseEventRenderer: Events layer now has ${renderedEvents.length} events`);
} else {
console.warn('BaseEventRenderer: No column found for event', event.title);
console.warn('BaseEventRenderer: No events layer found in column');
}
});
}
// Abstract methods that subclasses must implement for column-first rendering
protected abstract getColumns(): HTMLElement[];
protected abstract getEventsForColumn(column: HTMLElement, events: CalendarEvent[]): CalendarEvent[];
protected renderEvent(event: CalendarEvent, container: Element, config: CalendarConfig): void {
const eventElement = document.createElement('swp-event');
eventElement.dataset.eventId = event.id;
@ -160,6 +167,26 @@ export class DateEventRenderer extends BaseEventRenderer {
return dayColumn;
}
protected getColumns(): HTMLElement[] {
const columns = document.querySelectorAll('swp-day-column');
console.log('DateEventRenderer: Found', columns.length, 'day columns in DOM');
return Array.from(columns) as HTMLElement[];
}
protected getEventsForColumn(column: HTMLElement, events: CalendarEvent[]): CalendarEvent[] {
const columnDate = column.dataset.date;
if (!columnDate) return [];
const columnEvents = events.filter(event => {
const eventDate = new Date(event.start);
const eventDateStr = DateUtils.formatDate(eventDate);
return eventDateStr === columnDate;
});
console.log(`DateEventRenderer: Column ${columnDate} has ${columnEvents.length} events`);
return columnEvents;
}
}
/**
@ -177,4 +204,22 @@ export class ResourceEventRenderer extends BaseEventRenderer {
console.log('ResourceEventRenderer: Looking for resource column with name', resourceName, 'found:', !!resourceColumn);
return resourceColumn;
}
protected getColumns(): HTMLElement[] {
const columns = document.querySelectorAll('swp-resource-column');
console.log('ResourceEventRenderer: Found', columns.length, 'resource columns in DOM');
return Array.from(columns) as HTMLElement[];
}
protected getEventsForColumn(column: HTMLElement, events: CalendarEvent[]): CalendarEvent[] {
const resourceName = column.dataset.resource;
if (!resourceName) return [];
const columnEvents = events.filter(event => {
return event.resource?.name === resourceName;
});
console.log(`ResourceEventRenderer: Resource ${resourceName} has ${columnEvents.length} events`);
return columnEvents;
}
}