024ad45bfd
Simplifies workweek change event propagation across managers Removes redundant grid rerendering logic and focuses on clean event communication Prepares infrastructure for more flexible workweek configuration updates Relates to debug-gridstyle branch
72 lines
2.6 KiB
Markdown
72 lines
2.6 KiB
Markdown
# Workweek Preset Click Sequence Diagram
|
|
|
|
Dette diagram viser hvad der sker når brugeren klikker på en workweek preset knap (f.eks. "Mon-Fri", "Mon-Thu", etc.)
|
|
|
|
```mermaid
|
|
sequenceDiagram
|
|
actor User
|
|
participant HTML as swp-preset-button
|
|
participant VM as ViewManager
|
|
participant Config as Configuration
|
|
participant CM as ConfigManager
|
|
participant EventBus
|
|
participant GM as GridManager
|
|
participant GR as GridRenderer
|
|
participant HM as HeaderManager
|
|
participant HR as HeaderRenderer
|
|
participant DOM
|
|
|
|
User->>HTML: Click på preset button<br/>(data-workweek="compressed")
|
|
HTML->>VM: click event
|
|
|
|
Note over VM: setupButtonGroup handler
|
|
VM->>VM: getAttribute('data-workweek')<br/>→ "compressed"
|
|
VM->>VM: changeWorkweek("compressed")
|
|
|
|
VM->>Config: setWorkWeek("compressed")
|
|
Note over Config: Opdaterer currentWorkWeek<br/>og workweek settings
|
|
|
|
VM->>CM: updateCSSProperties(config)
|
|
Note over CM: Opdaterer CSS custom properties
|
|
CM->>DOM: setProperty('--grid-columns', '4')
|
|
CM->>DOM: setProperty('--hour-height', '80px')
|
|
CM->>DOM: setProperty('--day-start-hour', '6')
|
|
CM->>DOM: setProperty('--work-start-hour', '8')
|
|
Note over DOM: CSS grid layout opdateres
|
|
|
|
VM->>VM: updateAllButtons()
|
|
VM->>DOM: Update data-active attributter<br/>på alle preset buttons
|
|
Note over DOM: Compressed knap får<br/>data-active="true"<br/>Andre knapper mister active
|
|
|
|
VM->>Config: getWorkWeekSettings()
|
|
Config-->>VM: { id: 'compressed',<br/>workDays: [1,2,3,4],<br/>totalDays: 4 }
|
|
|
|
VM->>EventBus: emit(WORKWEEK_CHANGED, payload)
|
|
Note over EventBus: Event: 'workweek:changed'<br/>Payload: { workWeekId, settings }
|
|
|
|
EventBus->>GM: WORKWEEK_CHANGED event
|
|
Note over GM: Listener setup i subscribeToEvents()
|
|
GM->>GM: render()
|
|
GM->>GR: renderGrid(container, currentDate)
|
|
|
|
alt First render (empty grid)
|
|
GR->>GR: createCompleteGridStructure()
|
|
GR->>DOM: Create time axis
|
|
GR->>DOM: Create grid container
|
|
GR->>DOM: Create 4 columns (Mon-Thu)
|
|
else Update existing grid
|
|
GR->>GR: updateGridContent()
|
|
GR->>DOM: Update existing columns
|
|
end
|
|
|
|
GM->>EventBus: emit(GRID_RENDERED)
|
|
|
|
EventBus->>HM: WORKWEEK_CHANGED event
|
|
Note over HM: Via 'workweek:header-update'<br/>from CalendarManager
|
|
HM->>HM: updateHeader(currentDate)
|
|
HM->>HR: render(context)
|
|
HR->>DOM: Update header med 4 dage<br/>(Mon, Tue, Wed, Thu)
|
|
|
|
Note over DOM: Grid viser nu kun<br/>Man-Tor (4 dage)<br/>med opdaterede headers
|
|
|
|
DOM-->>User: Visuelt feedback:<br/>4-dages arbejdsuge
|