diff --git a/src/v2/constants/CoreEvents.ts b/src/v2/constants/CoreEvents.ts index 11ae6c3..1425a2f 100644 --- a/src/v2/constants/CoreEvents.ts +++ b/src/v2/constants/CoreEvents.ts @@ -71,5 +71,8 @@ export const CoreEvents = { // Calendar command events CALENDAR_CMD_NAVIGATE_PREV: 'calendar:cmd:navigate:prev', - CALENDAR_CMD_NAVIGATE_NEXT: 'calendar:cmd:navigate:next' + CALENDAR_CMD_NAVIGATE_NEXT: 'calendar:cmd:navigate:next', + CALENDAR_CMD_DRAWER_TOGGLE: 'calendar:cmd:drawer:toggle', + CALENDAR_CMD_RENDER: 'calendar:cmd:render', + CALENDAR_CMD_WORKWEEK_CHANGE: 'calendar:cmd:workweek:change' } as const; diff --git a/src/v2/core/CalendarApp.ts b/src/v2/core/CalendarApp.ts index ac86fcd..375ca76 100644 --- a/src/v2/core/CalendarApp.ts +++ b/src/v2/core/CalendarApp.ts @@ -86,26 +86,27 @@ export class CalendarApp { this.handleNavigateNext(); }); - // Other commands via container DOM events (migrates later) - this.container.addEventListener('calendar:cmd:render', ((e: CustomEvent) => { - const { viewId, direction } = e.detail; - this.handleRenderCommand(viewId, direction); + // Drawer toggle via EventBus + this.eventBus.on(CoreEvents.CALENDAR_CMD_DRAWER_TOGGLE, () => { + this.headerDrawerManager.toggle(); + }); + + // Render command via EventBus + this.eventBus.on(CoreEvents.CALENDAR_CMD_RENDER, ((e: CustomEvent) => { + const { viewId } = e.detail; + this.handleRenderCommand(viewId); }) as EventListener); - this.container.addEventListener('calendar:cmd:drawer:toggle', (() => { - this.headerDrawerManager.toggle(); + // Workweek change via EventBus + this.eventBus.on(CoreEvents.CALENDAR_CMD_WORKWEEK_CHANGE, ((e: CustomEvent) => { + const { presetId } = e.detail; + this.handleWorkweekChange(presetId); }) as EventListener); } - private async handleRenderCommand(viewId: string, direction?: 'left' | 'right'): Promise { + private async handleRenderCommand(viewId: string): Promise { this.currentViewId = viewId; - - if (direction) { - await this.animator.slide(direction, () => this.render()); - } else { - await this.render(); - } - + await this.render(); this.emitStatus('rendered', { viewId }); } @@ -121,6 +122,15 @@ export class CalendarApp { this.emitStatus('rendered', { viewId: this.currentViewId }); } + private async handleWorkweekChange(presetId: string): Promise { + const preset = await this.settingsService.getWorkweekPreset(presetId); + if (preset) { + this.workweekPreset = preset; + await this.render(); + this.emitStatus('rendered', { viewId: this.currentViewId }); + } + } + private async render(): Promise { const storedConfig = await this.viewConfigService.getById(this.currentViewId); if (!storedConfig) { diff --git a/src/v2/demo/DemoApp.ts b/src/v2/demo/DemoApp.ts index 78c2293..c7083cd 100644 --- a/src/v2/demo/DemoApp.ts +++ b/src/v2/demo/DemoApp.ts @@ -41,12 +41,13 @@ export class DemoApp { this.setupNavigation(); this.setupDrawerToggle(); this.setupViewSwitching(); + this.setupWorkweekSelector(); // Listen for calendar status events this.setupStatusListeners(); // Initial render - this.emitRenderCommand(this.currentView); + this.eventBus.emit(CoreEvents.CALENDAR_CMD_RENDER, { viewId: this.currentView }); } private setupNavigation(): void { @@ -69,7 +70,7 @@ export class DemoApp { const view = (chip as HTMLElement).dataset.view; if (view) { this.currentView = view; - this.emitRenderCommand(view); + this.eventBus.emit(CoreEvents.CALENDAR_CMD_RENDER, { viewId: view }); } }); }); @@ -77,10 +78,18 @@ export class DemoApp { private setupDrawerToggle(): void { document.getElementById('btn-drawer')!.onclick = () => { - this.container.dispatchEvent(new CustomEvent('calendar:cmd:drawer:toggle')); + this.eventBus.emit(CoreEvents.CALENDAR_CMD_DRAWER_TOGGLE); }; } + private setupWorkweekSelector(): void { + const workweekSelect = document.getElementById('workweek-select') as HTMLSelectElement; + workweekSelect?.addEventListener('change', () => { + const presetId = workweekSelect.value; + this.eventBus.emit(CoreEvents.CALENDAR_CMD_WORKWEEK_CHANGE, { presetId }); + }); + } + private setupStatusListeners(): void { this.container.addEventListener('calendar:status:ready', () => { console.log('[DemoApp] Calendar ready'); @@ -95,9 +104,4 @@ export class DemoApp { }) as EventListener); } - private emitRenderCommand(viewId: string, direction?: 'left' | 'right'): void { - this.container.dispatchEvent(new CustomEvent('calendar:cmd:render', { - detail: { viewId, direction } - })); - } }