Calendar/wwwroot/js/managers/NavigationManager.js

import { CoreEvents } from '../constants/CoreEvents';
export class NavigationManager {
    constructor(eventBus, eventRenderer, gridRenderer, dateService, weekInfoRenderer) {
        this.animationQueue = 0;
        this.eventBus = eventBus;
        this.dateService = dateService;
        this.weekInfoRenderer = weekInfoRenderer;
        this.gridRenderer = gridRenderer;
        this.currentWeek = this.getISOWeekStart(new Date());
        this.targetWeek = new Date(this.currentWeek);
        this.init();
    }
    init() {
        this.setupEventListeners();
    }
    /**
     * Get the start of the ISO week (Monday) for a given date
     * @param date - Any date in the week
     * @returns The Monday of the ISO week
     */
    getISOWeekStart(date) {
        const weekBounds = this.dateService.getWeekBounds(date);
        return this.dateService.startOfDay(weekBounds.start);
    }
    setupEventListeners() {
        // Listen for filter changes and apply to pre-rendered grids
        this.eventBus.on(CoreEvents.FILTER_CHANGED, (e) => {
            const detail = e.detail;
            this.weekInfoRenderer.applyFilterToPreRenderedGrids(detail);
        });
        // Listen for navigation button clicks from NavigationButtons
        this.eventBus.on(CoreEvents.NAV_BUTTON_CLICKED, (event) => {
            const { direction, newDate } = event.detail;
            // Navigate to the new date with animation
            this.navigateToDate(newDate, direction);
        });
        // Listen for external navigation requests
        this.eventBus.on(CoreEvents.DATE_CHANGED, (event) => {
            const customEvent = event;
            const dateFromEvent = customEvent.detail.currentDate;
            // Validate date before processing
            if (!dateFromEvent) {
                console.warn('NavigationManager: No date provided in DATE_CHANGED event');
                return;
            }
            const targetDate = new Date(dateFromEvent);
            // Use DateService validation
            const validation = this.dateService.validateDate(targetDate);
            if (!validation.valid) {
                console.warn('NavigationManager: Invalid date received:', validation.error);
                return;
            }
            this.navigateToDate(targetDate);
        });
        // Listen for event navigation requests
        this.eventBus.on(CoreEvents.NAVIGATE_TO_EVENT, (event) => {
            const customEvent = event;
            const { eventDate, eventStartTime } = customEvent.detail;
            if (!eventDate || !eventStartTime) {
                console.warn('NavigationManager: Invalid event navigation data');
                return;
            }
            this.navigateToEventDate(eventDate, eventStartTime);
        });
    }
    /**
     * Navigate to specific event date and emit scroll event after navigation
     */
    navigateToEventDate(eventDate, eventStartTime) {
        const weekStart = this.getISOWeekStart(eventDate);
        this.targetWeek = new Date(weekStart);
        const currentTime = this.currentWeek.getTime();
        const targetTime = weekStart.getTime();
        // Store event start time for scrolling after navigation
        const scrollAfterNavigation = () => {
            // Emit scroll request after navigation is complete
            this.eventBus.emit('scroll:to-event-time', {
                eventStartTime
            });
        };
        if (currentTime < targetTime) {
            this.animationQueue++;
            this.animateTransition('next', weekStart);
            // Listen for navigation completion to trigger scroll
            this.eventBus.once(CoreEvents.NAVIGATION_COMPLETED, scrollAfterNavigation);
        }
        else if (currentTime > targetTime) {
            this.animationQueue++;
            this.animateTransition('prev', weekStart);
            // Listen for navigation completion to trigger scroll
            this.eventBus.once(CoreEvents.NAVIGATION_COMPLETED, scrollAfterNavigation);
        }
        else {
            // Already on correct week, just scroll
            scrollAfterNavigation();
        }
    }
    navigateToDate(date, direction) {
        const weekStart = this.getISOWeekStart(date);
        this.targetWeek = new Date(weekStart);
        const currentTime = this.currentWeek.getTime();
        const targetTime = weekStart.getTime();
        // Use provided direction or calculate based on time comparison
        let animationDirection;
        if (direction === 'next') {
            animationDirection = 'next';
        }
        else if (direction === 'previous') {
            animationDirection = 'prev';
        }
        else if (direction === 'today') {
            // For "today", determine direction based on current position
            animationDirection = currentTime < targetTime ? 'next' : 'prev';
        }
        else {
            // Fallback: calculate direction
            animationDirection = currentTime < targetTime ? 'next' : 'prev';
        }
        if (currentTime !== targetTime) {
            this.animationQueue++;
            this.animateTransition(animationDirection, weekStart);
        }
    }
    /**
     * Animation transition using pre-rendered containers when available
     */
    animateTransition(direction, targetWeek) {
        const container = document.querySelector('swp-calendar-container');
        const currentGrid = document.querySelector('swp-calendar-container swp-grid-container:not([data-prerendered])');
        if (!container || !currentGrid) {
            return;
        }
        // Reset all-day height BEFORE creating new grid to ensure base height
        const root = document.documentElement;
        root.style.setProperty('--all-day-row-height', '0px');
        let newGrid;
        console.group('🔧 NavigationManager.refactored');
        console.log('Calling GridRenderer instead of NavigationRenderer');
        console.log('Target week:', targetWeek);
        // Always create a fresh container for consistent behavior
        newGrid = this.gridRenderer.createNavigationGrid(container, targetWeek);
        console.groupEnd();
        // Clear any existing transforms before animation
        newGrid.style.transform = '';
        currentGrid.style.transform = '';
        // Animate transition using Web Animations API
        const slideOutAnimation = currentGrid.animate([
            { transform: 'translateX(0)', opacity: '1' },
            { transform: direction === 'next' ? 'translateX(-100%)' : 'translateX(100%)', opacity: '0.5' }
        ], {
            duration: 400,
            easing: 'ease-in-out',
            fill: 'forwards'
        });
        const slideInAnimation = newGrid.animate([
            { transform: direction === 'next' ? 'translateX(100%)' : 'translateX(-100%)' },
            { transform: 'translateX(0)' }
        ], {
            duration: 400,
            easing: 'ease-in-out',
            fill: 'forwards'
        });
        // Handle animation completion
        slideInAnimation.addEventListener('finish', () => {
            // Cleanup: Remove all old grids except the new one
            const allGrids = container.querySelectorAll('swp-grid-container');
            for (let i = 0; i < allGrids.length - 1; i++) {
                allGrids[i].remove();
            }
            // Reset positioning
            newGrid.style.position = 'relative';
            newGrid.removeAttribute('data-prerendered');
            // Update state
            this.currentWeek = new Date(targetWeek);
            this.animationQueue--;
            // If this was the last queued animation, ensure we're in sync
            if (this.animationQueue === 0) {
                this.currentWeek = new Date(this.targetWeek);
            }
            // Emit navigation completed event
            this.eventBus.emit(CoreEvents.NAVIGATION_COMPLETED, {
                direction,
                newDate: this.currentWeek
            });
        });
    }
}
//# sourceMappingURL=NavigationManager.js.map