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

Refactors date handling for ISO week compatibility

Browse source 
Centralizes all date calculations into a new `DateCalculator` class for better maintainability and consistency.

Ensures correct ISO week handling (Monday as the first day) throughout the calendar.

Updates `CalendarConfig` to use ISO day numbering (1-7 for Mon-Sun) for work week definitions.

Fixes issue where date calculations were inconsistent.
Enhances event rendering and navigation.
Updates navigation logic to use pre-rendered events.
Removes the need for `CONTAINER_READY_FOR_EVENTS` event.
This commit is contained in:
Janus Knudsen 2025-08-20 00:39:31 +02:00
parent efc1742dad
commit 7d513600d8
13 changed files with 230 additions and 343 deletions
Download patch file Download diff file Expand all files Collapse all files

28
src/renderers/EventRenderer.ts
View file

@ -2,7 +2,7 @@
import { CalendarEvent } from '../types/CalendarTypes';
import { CalendarConfig } from '../core/CalendarConfig';
import { DateUtils } from '../utils/DateUtils';
import { DateCalculator } from '../utils/DateCalculator';
/**
* Interface for event rendering strategies
@ -16,6 +16,11 @@ export interface EventRendererStrategy {
* Base class for event renderers with common functionality
*/
export abstract class BaseEventRenderer implements EventRendererStrategy {
protected dateCalculator: DateCalculator;
constructor(config: CalendarConfig) {
this.dateCalculator = new DateCalculator(config);
}
renderEvents(events: CalendarEvent[], container: HTMLElement, config: CalendarConfig): void {
console.log('BaseEventRenderer: renderEvents called with', events.length, 'events');
@ -70,8 +75,8 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
eventElement.style.backgroundColor = event.metadata?.color || '#3498db';
// Format time for display
const startTime = this.formatTime(event.start);
const endTime = this.formatTime(event.end);
const startTime = this.dateCalculator.formatTime(new Date(event.start));
const endTime = this.dateCalculator.formatTime(new Date(event.end));
// Create event content
eventElement.innerHTML = `
@ -160,15 +165,24 @@ export class DateEventRenderer extends BaseEventRenderer {
protected getEventsForColumn(column: HTMLElement, events: CalendarEvent[]): CalendarEvent[] {
const columnDate = column.dataset.date;
if (!columnDate) return [];
if (!columnDate) {
console.log(`DateEventRenderer: Column has no dataset.date`);
return [];
}
const columnEvents = events.filter(event => {
const eventDate = new Date(event.start);
const eventDateStr = DateUtils.formatDate(eventDate);
return eventDateStr === columnDate;
const eventDateStr = this.dateCalculator.formatISODate(eventDate);
const matches = eventDateStr === columnDate;
if (!matches) {
console.log(`DateEventRenderer: Event ${event.title} (${eventDateStr}) does not match column (${columnDate})`);
}
return matches;
});
console.log(`DateEventRenderer: Column ${columnDate} has ${columnEvents.length} events`);
console.log(`DateEventRenderer: Column ${columnDate} has ${columnEvents.length} events from ${events.length} total`);
return columnEvents;
}
}