/** * AllDayHeightService - Manages all-day row height calculations and animations * * STATELESS SERVICE - Reads all data from DOM via AllDayDomReader * - No persistent state * - Calculates required rows by reading DOM elements * - Animates header height based on DOM state */ import { ALL_DAY_CONSTANTS } from '../../configurations/CalendarConfig'; import { eventBus } from '../../core/EventBus'; import { AllDayDomReader } from './AllDayDomReader'; export class AllDayHeightService { /** * Main entry point - recalculate and animate header height based on DOM */ recalculateAndAnimate() { const requiredRows = AllDayDomReader.getMaxRowFromEvents(); this.animateToRows(requiredRows); } /** * Animate all-day container to specific number of rows */ animateToRows(targetRows) { const { targetHeight, currentHeight, heightDifference } = this.calculateAllDayHeight(targetRows); if (targetHeight === currentHeight) return; // No animation needed console.log(`🎬 All-day height animation: ${currentHeight}px → ${targetHeight}px (${Math.ceil(currentHeight / ALL_DAY_CONSTANTS.SINGLE_ROW_HEIGHT)} → ${targetRows} rows)`); // Get elements const calendarHeader = AllDayDomReader.getCalendarHeader(); const headerSpacer = AllDayDomReader.getHeaderSpacer(); const allDayContainer = AllDayDomReader.getAllDayContainer(); if (!calendarHeader || !allDayContainer) return; // Get current parent height for animation const currentParentHeight = parseFloat(getComputedStyle(calendarHeader).height); const targetParentHeight = currentParentHeight + heightDifference; const animations = [ calendarHeader.animate([ { height: `${currentParentHeight}px` }, { height: `${targetParentHeight}px` } ], { duration: 150, easing: 'ease-out', fill: 'forwards' }) ]; // Add spacer animation if spacer exists if (headerSpacer) { const root = document.documentElement; const headerHeightStr = root.style.getPropertyValue('--header-height'); const headerHeight = parseInt(headerHeightStr); const currentSpacerHeight = headerHeight + currentHeight; const targetSpacerHeight = headerHeight + targetHeight; animations.push(headerSpacer.animate([ { height: `${currentSpacerHeight}px` }, { height: `${targetSpacerHeight}px` } ], { duration: 150, easing: 'ease-out' })); } // Update CSS variable after animation Promise.all(animations.map(anim => anim.finished)).then(() => { const root = document.documentElement; root.style.setProperty('--all-day-row-height', `${targetHeight}px`); eventBus.emit('header:height-changed'); }); } /** * Calculate all-day height based on number of rows */ calculateAllDayHeight(targetRows) { const targetHeight = targetRows * ALL_DAY_CONSTANTS.SINGLE_ROW_HEIGHT; const currentHeight = AllDayDomReader.getCurrentHeight(); const heightDifference = targetHeight - currentHeight; return { targetHeight, currentHeight, heightDifference }; } /** * Collapse all-day row (animate to 0 rows) */ collapseAllDayRow() { this.animateToRows(0); } } //# sourceMappingURL=AllDayHeightService.js.map