95 lines
3.3 KiB
JavaScript
95 lines
3.3 KiB
JavaScript
|
import { CoreEvents } from '../constants/CoreEvents';
|
||
|
|
import { WORK_WEEK_PRESETS } from '../configurations/CalendarConfig';
|
||
|
|
/**
|
||
|
|
* WorkweekPresetsManager - Manages workweek preset UI and state
|
||
|
|
*
|
||
|
|
* RESPONSIBILITY:
|
||
|
|
* ===============
|
||
|
|
* This manager owns all logic related to the <swp-workweek-presets> UI element.
|
||
|
|
* It follows the principle that each functional UI element has its own manager.
|
||
|
|
*
|
||
|
|
* RESPONSIBILITIES:
|
||
|
|
* - Owns WORK_WEEK_PRESETS data
|
||
|
|
* - Handles button clicks on swp-preset-button elements
|
||
|
|
* - Manages current workweek preset state
|
||
|
|
* - Validates preset IDs
|
||
|
|
* - Emits WORKWEEK_CHANGED events
|
||
|
|
* - Updates button UI states (data-active attributes)
|
||
|
|
*
|
||
|
|
* EVENT FLOW:
|
||
|
|
* ===========
|
||
|
|
* User clicks button → changePreset() → validate → update state → emit event → update UI
|
||
|
|
*
|
||
|
|
* SUBSCRIBERS:
|
||
|
|
* ============
|
||
|
|
* - ConfigManager: Updates CSS variables (--grid-columns)
|
||
|
|
* - GridManager: Re-renders grid with new column count
|
||
|
|
* - CalendarManager: Relays to header update (via workweek:header-update)
|
||
|
|
* - HeaderManager: Updates date headers
|
||
|
|
*/
|
||
|
|
export class WorkweekPresetsManager {
|
||
|
|
constructor(eventBus, config) {
|
||
|
|
this.buttonListeners = new Map();
|
||
|
|
this.eventBus = eventBus;
|
||
|
|
this.config = config;
|
||
|
|
this.setupButtonListeners();
|
||
|
|
}
|
||
|
|
/**
|
||
|
|
* Setup click listeners on all workweek preset buttons
|
||
|
|
*/
|
||
|
|
setupButtonListeners() {
|
||
|
|
const buttons = document.querySelectorAll('swp-preset-button[data-workweek]');
|
||
|
|
buttons.forEach(button => {
|
||
|
|
const clickHandler = (event) => {
|
||
|
|
event.preventDefault();
|
||
|
|
const presetId = button.getAttribute('data-workweek');
|
||
|
|
if (presetId) {
|
||
|
|
this.changePreset(presetId);
|
||
|
|
}
|
||
|
|
};
|
||
|
|
button.addEventListener('click', clickHandler);
|
||
|
|
this.buttonListeners.set(button, clickHandler);
|
||
|
|
});
|
||
|
|
// Initialize button states
|
||
|
|
this.updateButtonStates();
|
||
|
|
}
|
||
|
|
/**
|
||
|
|
* Change the active workweek preset
|
||
|
|
*/
|
||
|
|
changePreset(presetId) {
|
||
|
|
if (!WORK_WEEK_PRESETS[presetId]) {
|
||
|
|
console.warn(`Invalid preset ID "${presetId}"`);
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
if (presetId === this.config.currentWorkWeek) {
|
||
|
|
return; // No change
|
||
|
|
}
|
||
|
|
const previousPresetId = this.config.currentWorkWeek;
|
||
|
|
this.config.currentWorkWeek = presetId;
|
||
|
|
const settings = WORK_WEEK_PRESETS[presetId];
|
||
|
|
// Update button UI states
|
||
|
|
this.updateButtonStates();
|
||
|
|
// Emit event for subscribers
|
||
|
|
this.eventBus.emit(CoreEvents.WORKWEEK_CHANGED, {
|
||
|
|
workWeekId: presetId,
|
||
|
|
previousWorkWeekId: previousPresetId,
|
||
|
|
settings: settings
|
||
|
|
});
|
||
|
|
}
|
||
|
|
/**
|
||
|
|
* Update button states (data-active attributes)
|
||
|
|
*/
|
||
|
|
updateButtonStates() {
|
||
|
|
const buttons = document.querySelectorAll('swp-preset-button[data-workweek]');
|
||
|
|
buttons.forEach(button => {
|
||
|
|
const buttonPresetId = button.getAttribute('data-workweek');
|
||
|
|
if (buttonPresetId === this.config.currentWorkWeek) {
|
||
|
|
button.setAttribute('data-active', 'true');
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
button.removeAttribute('data-active');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
//# sourceMappingURL=WorkweekPresetsManager.js.map
|