Architettura www.novelli.me

flowchart TB subgraph SSB["Server-Side / Build Time"] MD[Markdown Content] Layouts[Liquid Layouts] Jekyll[Jekyll Engine] Assets[Static Assets] MD --> Jekyll Layouts --> Jekyll Jekyll --> Assets end subgraph CSR["Client-Side / Runtime (Browser)"] Boot[Boot Loader] VDS[Virtual Desktop System] DOM[DOM Interface] LS[Local Storage] AI_Local[AI Engine\nLocal/WASM] Boot --> VDS VDS --> DOM VDS --> LS VDS --> AI_Local end subgraph EXT["External Services"] GH_API[GitHub API] end Assets -.->|HTTP| Boot VDS -->|Blog Editor| GH_API

classDiagram direction TB class Boot { +init() +loadConfig() } class WindowManager { -windows Array -zIndexCounter int +openWindow(id, content) +closeWindow(id) +minimizeWindow(id) +bringToFront(id) +tileWindows() } class DesktopRenderer { +renderIcons(config) +renderWallpaper() +updateTheme() } class TaskbarManager { +addTaskbarItem(windowId) +removeTaskbarItem(windowId) +updateClock() +toggleStartMenu() } class NavigationHandler { +handleURLChange() +pushState(url) +parseDeepLinks() } class DraggableMixin { +makeDraggable(element) } class ResizableMixin { +makeResizable(element) } Boot --> DesktopRenderer : Setup UI Boot --> WindowManager : Init Boot --> NavigationHandler : Routing Boot --> TaskbarManager : Init WindowManager --> TaskbarManager : Sync State WindowManager ..> DraggableMixin : Uses WindowManager ..> ResizableMixin : Uses NavigationHandler --> WindowManager : Open Deep Link

sequenceDiagram actor User participant Browser participant Boot as core/boot.js participant Nav as NavigationHandler participant WM as WindowManager participant DOM User->>Browser: Apre URL (es. /blog/post-1) Browser->>Boot: window.onload Boot->>Boot: checkBrowserCompatibility() Boot->>DOM: Render Desktop e Taskbar Boot->>Nav: handleInitialState() rect rgb(230, 240, 255) Note right of Nav: Deep Linking Logic Nav->>Nav: Parse URL for Content ID Nav->>WM: openWindow('post-1', 'parchment') end WM->>DOM: Crea Elemento Finestra WM->>DOM: Fetch Contenuto (AJAX/Fetch) DOM-->>WM: Ritorna HTML Parziale WM->>DOM: Inietta HTML nel Body della Finestra WM->>DOM: Applica Draggable e Resizable WM->>DOM: set z-index (Bring to Front) WM-->>User: Visualizza Finestra

classDiagram class EditorApp { +init() +loadPost(path) +savePost() } class EditorUI { +renderToolbar() +renderMarkdownPreview() +toggleSplitView() +showStatus(msg) } class GitHubOAuth { -clientId string -token string +login() +logout() +handleCallback() +isAuthenticated() } class GitHubAPI { -repo string -branch string +getFile(path) +createBlob(content) +createTree() +createCommit() +updateRef() } EditorApp --> EditorUI : Manages EditorApp --> GitHubOAuth : Auth EditorApp --> GitHubAPI : Data Persistence GitHubAPI ..> GitHubOAuth : Uses Token

stateDiagram-v2 [*] --> Idle Idle --> UserInput : User asks question UserInput --> BrowserCheck : Validate BrowserCheck --> Embedding : WebGPU/WASM OK note right of Embedding : Local Model Embedding --> Retrieval : Query Embedding Generated note right of Retrieval Vector Search in media.json / chunks end note Retrieval --> Context : Top-K Chunks Selected Context --> Inference : Process Prompt + Context Inference --> Streaming : Stream Tokens to UI Streaming --> Idle : Complete

stateDiagram-v2 [*] --> Closed state Open { [*] --> Background state Focused { [*] --> IdleFocus IdleFocus --> Dragging : Mouse Down Header Dragging --> IdleFocus : Mouse Up IdleFocus --> Resizing : Mouse Down Border Resizing --> IdleFocus : Mouse Up } Background --> Focused : Click / Focus Focused --> Background : Blur / Click other } state Minimized Closed --> Open : openWindow() Open --> Minimized : minimizeWindow() Open --> Closed : closeWindow() Minimized --> Open : restoreWindow() note right of Focused : z-index più alto

flowchart LR subgraph Dev["💻 Developer Environment"] Code[VS Code / Local Git] LocalPreview[Local Jekyll Serve] Code --> LocalPreview end subgraph GitHub["☁️ GitHub Ecosystem"] Repo[Git Repository] subgraph Actions["⚙️ GitHub Actions"] TestUnit[Unit Tests] TestE2E[E2E Tests] Build[Jekyll Build] end Pages[GitHub Pages] end subgraph Client["📱 User Device"] Browser[Browser] end Code -->|Push| Repo Repo --> TestUnit Repo --> TestE2E TestUnit --> Build TestE2E --> Build Build -->|Deploy| Pages Pages -->|HTTPS| Browser

sequenceDiagram participant User participant DOM participant Snake as snake.js participant GameLoop as Game Loop User->>DOM: Apre Snake App DOM->>Snake: init() Snake->>Snake: setupCanvas() Snake->>GameLoop: setInterval(gameLoop, speed) loop Every Tick 100ms GameLoop->>Snake: update() activate Snake Snake->>Snake: handleInput(direction) Snake->>Snake: moveSnake() alt Collision Wall or Self Snake->>Snake: gameOver() Snake->>GameLoop: clearInterval() Snake-->>User: Show Game Over else Ate Food Snake->>Snake: grow() Snake->>Snake: spawnFood() Snake->>DOM: Update Score end Snake->>Snake: draw() Snake->>DOM: Render Canvas deactivate Snake end