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

Refactors navigation buttons with comprehensive logic

Browse source 
Enhances navigation buttons management with advanced date calculation and view-specific navigation

Separates navigation logic from GridManager into dedicated NavigationButtons component
Adds support for multiple calendar views (week, month, day)
Implements robust event-driven navigation mechanism
Improves date navigation with dynamic period label generation
This commit is contained in:
Janus C. H. Knudsen 2025-11-13 20:12:05 +01:00
parent 8faa3e2df2
commit a666a632bd
2 changed files with 141 additions and 94 deletions
Download patch file Download diff file Expand all files Collapse all files

87
src/managers/GridManager.ts
View file

@ -61,6 +61,13 @@ export class GridManager {
this.render();
});
// Listen for navigation events from NavigationButtons
eventBus.on(CoreEvents.NAVIGATION_COMPLETED, (e: Event) => {
const detail = (e as CustomEvent).detail;
this.currentDate = detail.newDate;
this.render();
});
// Listen for config changes that affect rendering
eventBus.on(CoreEvents.REFRESH_REQUESTED, (e: Event) => {
this.render();
@ -105,86 +112,6 @@ export class GridManager {
}
/**
* Get current period label
*/
public getCurrentPeriodLabel(): string {
switch (this.currentView) {
case 'week':
case 'day':
const weekStart = this.getISOWeekStart(this.currentDate);
const weekEnd = this.getWeekEnd(this.currentDate);
return this.dateService.formatDateRange(weekStart, weekEnd);
case 'month':
return this.dateService.formatMonthYear(this.currentDate);
default:
const defaultWeekStart = this.getISOWeekStart(this.currentDate);
const defaultWeekEnd = this.getWeekEnd(this.currentDate);
return this.dateService.formatDateRange(defaultWeekStart, defaultWeekEnd);
}
}
/**
* Navigate to next period
*/
public navigateNext(): void {
let nextDate: Date;
switch (this.currentView) {
case 'week':
nextDate = this.dateService.addWeeks(this.currentDate, 1);
break;
case 'month':
nextDate = this.dateService.addMonths(this.currentDate, 1);
break;
case 'day':
nextDate = this.dateService.addDays(this.currentDate, 1);
break;
default:
nextDate = this.dateService.addWeeks(this.currentDate, 1);
}
this.currentDate = nextDate;
eventBus.emit(CoreEvents.NAVIGATION_COMPLETED, {
direction: 'next',
newDate: nextDate,
periodLabel: this.getCurrentPeriodLabel()
});
this.render();
}
/**
* Navigate to previous period
*/
public navigatePrevious(): void {
let prevDate: Date;
switch (this.currentView) {
case 'week':
prevDate = this.dateService.addWeeks(this.currentDate, -1);
break;
case 'month':
prevDate = this.dateService.addMonths(this.currentDate, -1);
break;
case 'day':
prevDate = this.dateService.addDays(this.currentDate, -1);
break;
default:
prevDate = this.dateService.addWeeks(this.currentDate, -1);
}
this.currentDate = prevDate;
eventBus.emit(CoreEvents.NAVIGATION_COMPLETED, {
direction: 'previous',
newDate: prevDate,
periodLabel: this.getCurrentPeriodLabel()
});
this.render();
}
/**
* Get current view's display dates