44 lines
2 KiB
JavaScript
44 lines
2 KiB
JavaScript
|
// Column rendering strategy interface and implementations
|
||
|
|
/**
|
||
|
|
* Date-based column renderer (original functionality)
|
||
|
|
*/
|
||
|
|
export class DateColumnRenderer {
|
||
|
|
constructor(dateService, workHoursManager) {
|
||
|
|
this.dateService = dateService;
|
||
|
|
this.workHoursManager = workHoursManager;
|
||
|
|
}
|
||
|
|
render(columnContainer, context) {
|
||
|
|
const { currentWeek, config } = context;
|
||
|
|
const workWeekSettings = config.getWorkWeekSettings();
|
||
|
|
const dates = this.dateService.getWorkWeekDates(currentWeek, workWeekSettings.workDays);
|
||
|
|
const dateSettings = config.dateViewSettings;
|
||
|
|
const daysToShow = dates.slice(0, dateSettings.weekDays);
|
||
|
|
daysToShow.forEach((date) => {
|
||
|
|
const column = document.createElement('swp-day-column');
|
||
|
|
column.dataset.date = this.dateService.formatISODate(date);
|
||
|
|
// Apply work hours styling
|
||
|
|
this.applyWorkHoursToColumn(column, date);
|
||
|
|
const eventsLayer = document.createElement('swp-events-layer');
|
||
|
|
column.appendChild(eventsLayer);
|
||
|
|
columnContainer.appendChild(column);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
applyWorkHoursToColumn(column, date) {
|
||
|
|
const workHours = this.workHoursManager.getWorkHoursForDate(date);
|
||
|
|
if (workHours === 'off') {
|
||
|
|
// No work hours - mark as off day (full day will be colored)
|
||
|
|
column.dataset.workHours = 'off';
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
// Calculate and apply non-work hours overlays (before and after work)
|
||
|
|
const nonWorkStyle = this.workHoursManager.calculateNonWorkHoursStyle(workHours);
|
||
|
|
if (nonWorkStyle) {
|
||
|
|
// Before work overlay (::before pseudo-element)
|
||
|
|
column.style.setProperty('--before-work-height', `${nonWorkStyle.beforeWorkHeight}px`);
|
||
|
|
// After work overlay (::after pseudo-element)
|
||
|
|
column.style.setProperty('--after-work-top', `${nonWorkStyle.afterWorkTop}px`);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
//# sourceMappingURL=ColumnRenderer.js.map
|