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

Improves grid layout and navigation

Browse source 
Refactors the calendar grid to support smoother navigation transitions by using separate week containers.

This change introduces a GridManager to handle grid rendering and interactions within these containers, enabling scroll synchronization and click event handling for each week view.

Also, configures the calendar to start at midnight and span a full 24-hour day, providing a more comprehensive view.
This commit is contained in:
Janus Knudsen 2025-07-25 00:24:15 +02:00
parent f06c02121c
commit b443649ced
12 changed files with 719 additions and 302 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/managers/NavigationManager.ts
View file

@ -105,15 +105,15 @@ export class NavigationManager {
}
private animateTransition(direction: 'prev' | 'next', targetWeek: Date): void {
const container = document.querySelector('swp-calendar-container');
const calendarContainer = document.querySelector('swp-calendar-container');
const currentWeekContainer = document.querySelector('swp-week-container');
if (!container || !currentWeekContainer) {
if (!calendarContainer || !currentWeekContainer) {
console.warn('NavigationManager: Required DOM elements not found');
return;
}
// Create new week container
// Create new week container (following POC structure)
const newWeekContainer = document.createElement('swp-week-container');
newWeekContainer.innerHTML = `
<swp-week-header></swp-week-header>
@ -133,8 +133,8 @@ export class NavigationManager {
newWeekContainer.style.height = '100%';
newWeekContainer.style.transform = direction === 'next' ? 'translateX(100%)' : 'translateX(-100%)';
// Add to container
container.appendChild(newWeekContainer);
// Add to calendar container
calendarContainer.appendChild(newWeekContainer);
// Notify other managers to render content for the new week
this.eventBus.emit(EventTypes.WEEK_CONTAINER_CREATED, {