10ecad93d5
Setzt Visualization.md Abschnitt 9, Phasen 3-5 vollstaendig um: Phase 3 (Kanban-Board live): Board zeigt echte Ticket-Daten aus GET /api/v1/tickets (office-api.js), Klick auf eine Spalte oeffnet ein Modal mit Titel/Beschreibung/Typ und einem Link auf die Codeberg-Quelle bei per Sync angelegten Tickets (F4). Phase 4 (Monitor-Wand live): Event-, System- und KPI-Monitor zeigen echte Daten, Klick-Modals fuer alle drei. Neuer SSE-Endpoint GET /api/v1/stream (F13) meldet per ChangeFeed-Fingerabdruck, welche Ressourcen sich geaendert haben; office-realtime.js nutzt EventSource mit Polling-Fallback. KPI-Monitor zeichnet eine eigene SVG-Sparkline (F10, kein Chart-Lib) sobald KPIs gemeldet wurden, sonst weiterhin der Phase-2-Platzhalter (F7 bleibt inhaltlich offen). API-Antworten tragen jetzt CORS-Header, da Frontend (:8090) und API (:8091) im Docker-Compose-Setup unterschiedliche Origins sind. Phase 5 (Agenten & Animation): resolveAgentVisualState bildet gemeldete Agenten-Zustaende auf Ort/Pose ab; Agenten-Avatare sind eine per CSS transition animierte, von Board/ Schreibtisch-Moebeln entkoppelte Schicht, die zwischen Schreibtisch, Board, Monitor-Wand und einer neuen Kaffee-Ecke laufen. Idle-Varianten (Zeitung/Kaffee/Schwaetzchen) werden rein kosmetisch client-seitig zufaellig ausgeloest (F8), eine AnimationQueue serialisiert Update-Animationen bei vielen gleichzeitigen Ereignissen (F9). 29 Node-Tests (100% Line-Coverage office-scene.js) und neue PHPUnit-Tests fuer Response::stream(), ChangeFeed, StreamController und die neuen Repository::fingerprint()- Methoden. PHP/Docker-Ausfuehrung konnte in dieser Umgebung nicht verifiziert werden (kein PHP verfuegbar) - vor dem Merge bitte `docker compose run --rm api composer test` pruefen. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
35 lines
1.5 KiB
HTML
35 lines
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="icon" type="image/png" href="/favicon.png">
|
|
<title>FDS Buero-Visualisierung</title>
|
|
<link rel="stylesheet" href="css/office.css">
|
|
</head>
|
|
<body>
|
|
<header class="office-header">
|
|
<h1>Buero</h1>
|
|
<p>
|
|
Kanban-Board, Monitor-Wand und Schreibtische zeigen live die Daten aus der
|
|
<a href="/API.md">REST-API</a> (Push-Updates per Server-Sent Events, Fallback:
|
|
Polling). Klick auf das Board oder einen Monitor oeffnet die Detailansicht. Ist
|
|
die API nicht erreichbar, zeigt die Szene ersatzweise Demo-Daten.
|
|
</p>
|
|
</header>
|
|
|
|
<main id="office-scene" aria-label="Buero-Szene"></main>
|
|
|
|
<script>
|
|
// Docker-Compose-Dev-Setup (siehe docker-compose.yml): Frontend auf Port 8090, API auf
|
|
// Port 8091 - unterschiedliche Origins, daher die explizite Basis-URL (die API liefert
|
|
// dafuer CORS-Header, siehe api/src/Http/Response.php). Bei einem Produktions-Setup mit
|
|
// gemeinsamem Origin/Reverse-Proxy kann dieser Block entfernt werden, Default ist dann
|
|
// das gleiche Origin unter /api/v1 (siehe html/js/office-api.js).
|
|
if (location.port === "8090") {
|
|
window.MONITOR_API_BASE = `${location.protocol}//${location.hostname}:8091/api/v1`;
|
|
}
|
|
</script>
|
|
<script type="module" src="js/office-render.js"></script>
|
|
</body>
|
|
</html>
|