redesign - new dashboard, new contentpanel template functionality, monatsplan fix #29

2026-09-04T14:26:06+02:00

samuelbias commented

2026-09-04 14:26:06 +02:00

Überblick

Dieser PR führt den aktuellen Entwicklungsstand aus dev nach main zusammen. Die Historie umfasst zwölf angezeigte Commits beziehungsweise Merge-Commits aus den Bereichen Core-Refactoring, Docker-/Strato-Konfiguration, Developerpanel, Monatsplan, Contentpanel und Dashboard.

Die materiell neuen Änderungen gegenüber main betreffen vor allem zwei größere, in sich abgeschlossene Überarbeitungen:

den neuen DOCX-basierten Aushangworkflow im Contentpanel
den vollständigen Neuaufbau des Dashboards einschließlich Monatsplan-Korrekturen

Obwohl der PR groß wirkt, entfallen 1.587 hinzugefügte Zeilen allein auf die automatisch von npm erzeugte package-lock.json. Weitere große Diff-Anteile entstehen durch saubere Rewrites bestehender Contentpanel- und Dashboard-Dateien: 2.057 bisherige Zeilen werden dabei entfernt.

Projektanpassung

Metrik: Lines of Code (LOC)

Bereich	Hinzugefügt	Entfernt
Automatisierte Tests	1.387	0
Produktiver Feature- und Rewrite-Code	2.910	2.057
`package-lock.json` und Konfiguration	1.737	6
Gesamt	6.034	2.063

Binäre Dateien wie die DOCX-Vorlage und die eingebetteten Schriftdateien sind in diesen LOC-Werten nicht enthalten.

„Feature-Code“ umfasst die produktive Webanwendung, Worker, Renderer und Monatsplan-Erzeugung. „Konfiguration“ umfasst insbesondere Docker-, Build-, Abhängigkeits-, Ignore- und Dokumentationsdateien.

Aushangworkflow im Contentpanel

Der bisherige Aushangworkflow wurde neu strukturiert und um die Verarbeitung über eine feste DOCX-Designvorlage erweitert.

Verarbeitung

hochgeladene PDFs werden seitenweise analysiert
textarme Seiten können über ein konfiguriertes bildfähiges Ollama-Modell transkribiert werden
Inhalte werden in das feste Schema title und paragraphs überführt
Kontextgrenzen werden durch kontrollierte Aufteilung und begrenzte Wiederholungen berücksichtigt
Prüfungen verhindern die unbeabsichtigte Erfindung von Zahlen, Kontaktdaten oder anderen Fakten
fehlerhafte oder unvollständige KI-Antworten werden nicht als erfolgreiches Ergebnis veröffentlicht

DOCX und BetterOffice

Die aufbereiteten Inhalte werden in die bestehende DOCX-Formatvorlage eingesetzt und anschließend mit @betteroffice/docx-react in Chromium seitenweise als PNG gerendert. Die benötigten Suisse-Schriften werden explizit und reproduzierbar eingebunden.

Besonders interessant ist dabei openooxml/betteroffice: Die Office-Dokumentverarbeitung basiert auf einer eigenen OOXML-Engine in Rust, die über WebAssembly verwendet wird. Dadurch ist weder Microsoft Office noch LibreOffice im Hintergrund erforderlich. Dieselbe Engine kann für Parsing, Layout und Rendering genutzt werden.

Veröffentlichung und Fehlertoleranz

Veröffentlichung erst nach vollständig erfolgreicher Erzeugung aller Seiten
temporäre Renderdateien liegen im gleichen Dateisystem wie die Zielbilder
direkter HTTP-Zugriff auf interne Arbeitsdateien wird über contentpanel-private.conf verhindert
vorhandene Veröffentlichungen werden vor dem Ersetzen gesichert
bei einem Fehler wird der vorherige Stand vollständig wiederhergestellt
schlägt die Formatüberführung fehl, wird die unveränderte Original-PDF über Ghostscript veröffentlicht
erst wenn auch dieser Fallback fehlschlägt, gilt der Auftrag als fehlgeschlagen
nach erfolgreicher Verarbeitung wird die ursprüngliche PDF aus der Queue entfernt
Benachrichtigungsmails enthalten den ermittelten Titel und das Verarbeitungsergebnis
admin_messages wird als nachvollziehbares Verarbeitungsprotokoll verwendet

Dashboard

Das Dashboard wurde für den dauerhaften Einsatz auf einem großen Informationsmonitor vollständig neu geschrieben. Im Vordergrund stehen hohe Informationsdichte, gute Fernlesbarkeit, das aktuelle Corporate Design und unauffällige Hintergrundaktualisierungen.

Aufbau

responsive Skalierung für Full HD und 4K
kompakte Darstellung von:
- Uhrzeit, Datum und Temperaturen
- allen zukünftig relevanten Ansagen
- Bibelwort des Tages
- Live-Busabfahrten
- vollständigem Monatsplan
- großflächigen Aushängen
weiße, rahmenlose Inhaltsflächen mit farbigen Corporate-Design-Akzenten
Wolkenhintergrund und reduzierter ungenutzter Weißraum
einheitliche Typografie und dynamische Skalierung

Ansagen und Bibelwort

Ansagen werden direkt aus dem Contentpanel übernommen
alle ab heute relevanten Ansagen bleiben kontinuierlich sichtbar
abgelaufene Einträge werden beim Aufruf von Dashboard oder Contentpanel bereinigt
einheitlich ausgerichtete, listenartige Darstellung
weiche Ausblendung am unteren Rand statt Seitenwechsel
Bibelwort wird ohne automatischen Wechsel vollständig dargestellt
sichtbare Inhalte werden bei fehlgeschlagenen Hintergrundabfragen nicht vorübergehend durch Fehlermeldungen ersetzt

Aushänge

zusammengehörige Seiten werden als gemeinsames Dokument gruppiert
mehrseitige Aushänge bleiben möglichst vollständig zusammen
Seiten eines Dokuments werden ohne Zwischenraum und mit gemeinsamem Rahmen dargestellt
verfügbare Flächen werden möglichst vollständig gefüllt
bei zu wenigen Seiten können geeignete Seiten aus der vorherigen Zusammenstellung übernommen werden
kreisförmige Fortschrittsanzeige bis zum nächsten Seitenwechsel
neue Inhalte werden nach einem vollständigen Aushangdurchlauf im Hintergrund geladen
der bisherige Inhalt bleibt während der Aktualisierung sichtbar

Live-Abfahrten

nächste fünf Busabfahrten an der Haltestelle Eichborndamm/Antonienstraße
Anzeige von Linie, Fahrtrichtung, verbleibender Zeit und Abweichung
alternierende weiße und graue Tabellenzeilen
grüner Statusrand für pünktliche und planmäßige Abfahrten
orangefarbener Statusrand für Verspätungen
roter Statusrand für verfrühte oder entfallende Fahrten
Aktualisierung ungefähr alle zwölf Sekunden sowie zum Minutenwechsel
serverseitiger, prozessübergreifender Cache für bis zu 30 Abfahrten
der letzte erfolgreiche Stand bleibt bei API-Ausfällen fünf Minuten aktuell
Restzeiten und sichtbare Einträge werden auch mit zwischengespeicherten Daten fortlaufend aktualisiert
verzögerte Wiederholungsversuche vermeiden unnötige Last bei externen Fehlern

Temperaturen

Innenwert über Home Assistant
Außenwert passend zum Standort der Bushaltestelle
Innentemperatur wird nach der definierten 0,4-Grenze auf ganze Grad gerundet
bereits erfolgreich geladene Werte bleiben bei vorübergehenden Verbindungsproblemen sichtbar

Monatsplan

Die bestehende Monatsplan-Erzeugung wurde gezielt korrigiert, ohne das grundsätzliche Erscheinungsbild zu verändern.

Ortsangaben werden dem tatsächlichen Ereignisblock zugeordnet
ausgewertet wird ausschließlich das CKalender-Feld show_place
Titel, Notizen, Datumsbereiche und Trennzeichen können dadurch nicht mehr versehentlich als Ort erscheinen
fehlende Ortsangaben bleiben leer; -- wird nicht ausgegeben
jeder Monat erhält ein korrekt platziertes Logo im Monatstitel
passt der erste Monat vollständig auf Seite 1, beginnt der zweite Monat auf einer neuen Seite
reicht der erste Monat bereits auf Seite 2, wird der zweite Monat dort mit dem vorgesehenen Abstand fortgesetzt
transparente Außenbereiche werden im Dashboard berücksichtigt
beide Monatsplanseiten behalten denselben Maßstab und erhalten einen gleichmäßigen Rand und Seitenabstand

Architektur und Betrieb

getrennte Dashboard-Endpunkte für Inhalte, Bilder, Temperaturen und Abfahrten
unabhängige Hintergrundabfragen verhindern, dass ein fehlerhafter Dienst andere Bereiche blockiert
Inhalte werden erst nach erfolgreichen Antworten ausgetauscht
reduzierte Datenstrukturen und entfernte ungenutzte Konfiguration
generierte Monatsplan-, Aushang- und Cachedateien werden nicht versioniert
temporäre Contentpanel-Dateien sind gegen direkten Webzugriff geschützt
lokale und produktive Docker-Konfigurationen wurden um die benötigten Worker- und Renderer-Komponenten ergänzt
keine Datenbankmigration erforderlich

Enthaltene Entwicklungsstränge

Die Commit-Historie enthält außerdem die bereits zwischen dev und main parallel gemergten Entwicklungsstränge für:

Core-Refactoring und gehärtete Autorisierung
vereinfachte Endpunkte
CKalender-Einlesekorrektur
RSS-Ausgabe im Developerpanel
Docker-/Strato-Synchronisation
verknüpfte Entwicklungsinstanz und SSO

Die zugehörigen Merge-Commits unterscheiden sich zwischen den Branches, die materiellen Änderungen sind in main jedoch bereits weitgehend vorhanden.

Prüfung

PHP-Syntax der Dashboard-Endpunkte und Hilfsdateien geprüft
JavaScript-Syntax des Dashboards geprüft
Python-Syntax der Worker und Monatsplan-Erzeugung geprüft
Dashboard in Full HD und 4K kontrolliert
Monatsplan anhand der erzeugten Seiten visuell geprüft
Ortszuordnung, Seitenumbruch und Logo-Platzierung kontrolliert
Aushanggruppierung, Skalierung und Seitenwechsel geprüft
Busdarstellung, Statusfarben, Restzeiten und Cache-Verhalten geprüft
62 automatisierte Testfälle für Contentpanel, Verarbeitung, Rendering, Queue und Webvorschau vorhanden

## Überblick Dieser PR führt den aktuellen Entwicklungsstand aus `dev` nach `main` zusammen. Die Historie umfasst zwölf angezeigte Commits beziehungsweise Merge-Commits aus den Bereichen Core-Refactoring, Docker-/Strato-Konfiguration, Developerpanel, Monatsplan, Contentpanel und Dashboard. Die materiell neuen Änderungen gegenüber `main` betreffen vor allem zwei größere, in sich abgeschlossene Überarbeitungen: 1. den neuen DOCX-basierten Aushangworkflow im Contentpanel 2. den vollständigen Neuaufbau des Dashboards einschließlich Monatsplan-Korrekturen Obwohl der PR groß wirkt, entfallen 1.587 hinzugefügte Zeilen allein auf die automatisch von `npm` erzeugte `package-lock.json`. Weitere große Diff-Anteile entstehen durch saubere Rewrites bestehender Contentpanel- und Dashboard-Dateien: 2.057 bisherige Zeilen werden dabei entfernt. ## Projektanpassung **Metrik:** Lines of Code (LOC) | Bereich | Hinzugefügt | Entfernt | | ---------------------------------------- | ----------: | -------: | | Automatisierte Tests | 1.387 | 0 | | Produktiver Feature- und Rewrite-Code | 2.910 | 2.057 | | `package-lock.json` und Konfiguration | 1.737 | 6 | | **Gesamt** | **6.034** | **2.063** | Binäre Dateien wie die DOCX-Vorlage und die eingebetteten Schriftdateien sind in diesen LOC-Werten nicht enthalten. „Feature-Code“ umfasst die produktive Webanwendung, Worker, Renderer und Monatsplan-Erzeugung. „Konfiguration“ umfasst insbesondere Docker-, Build-, Abhängigkeits-, Ignore- und Dokumentationsdateien. ## Aushangworkflow im Contentpanel Der bisherige Aushangworkflow wurde neu strukturiert und um die Verarbeitung über eine feste DOCX-Designvorlage erweitert. ### Verarbeitung - hochgeladene PDFs werden seitenweise analysiert - textarme Seiten können über ein konfiguriertes bildfähiges Ollama-Modell transkribiert werden - Inhalte werden in das feste Schema `title` und `paragraphs` überführt - Kontextgrenzen werden durch kontrollierte Aufteilung und begrenzte Wiederholungen berücksichtigt - Prüfungen verhindern die unbeabsichtigte Erfindung von Zahlen, Kontaktdaten oder anderen Fakten - fehlerhafte oder unvollständige KI-Antworten werden nicht als erfolgreiches Ergebnis veröffentlicht ### DOCX und BetterOffice Die aufbereiteten Inhalte werden in die bestehende DOCX-Formatvorlage eingesetzt und anschließend mit `@betteroffice/docx-react` in Chromium seitenweise als PNG gerendert. Die benötigten Suisse-Schriften werden explizit und reproduzierbar eingebunden. Besonders interessant ist dabei [openooxml/betteroffice](https://github.com/openooxml/betteroffice): Die Office-Dokumentverarbeitung basiert auf einer eigenen OOXML-Engine in Rust, die über WebAssembly verwendet wird. Dadurch ist weder Microsoft Office noch LibreOffice im Hintergrund erforderlich. Dieselbe Engine kann für Parsing, Layout und Rendering genutzt werden. ### Veröffentlichung und Fehlertoleranz - Veröffentlichung erst nach vollständig erfolgreicher Erzeugung aller Seiten - temporäre Renderdateien liegen im gleichen Dateisystem wie die Zielbilder - direkter HTTP-Zugriff auf interne Arbeitsdateien wird über `contentpanel-private.conf` verhindert - vorhandene Veröffentlichungen werden vor dem Ersetzen gesichert - bei einem Fehler wird der vorherige Stand vollständig wiederhergestellt - schlägt die Formatüberführung fehl, wird die unveränderte Original-PDF über Ghostscript veröffentlicht - erst wenn auch dieser Fallback fehlschlägt, gilt der Auftrag als fehlgeschlagen - nach erfolgreicher Verarbeitung wird die ursprüngliche PDF aus der Queue entfernt - Benachrichtigungsmails enthalten den ermittelten Titel und das Verarbeitungsergebnis - `admin_messages` wird als nachvollziehbares Verarbeitungsprotokoll verwendet ## Dashboard Das Dashboard wurde für den dauerhaften Einsatz auf einem großen Informationsmonitor vollständig neu geschrieben. Im Vordergrund stehen hohe Informationsdichte, gute Fernlesbarkeit, das aktuelle Corporate Design und unauffällige Hintergrundaktualisierungen. ### Aufbau - responsive Skalierung für Full HD und 4K - kompakte Darstellung von: - Uhrzeit, Datum und Temperaturen - allen zukünftig relevanten Ansagen - Bibelwort des Tages - Live-Busabfahrten - vollständigem Monatsplan - großflächigen Aushängen - weiße, rahmenlose Inhaltsflächen mit farbigen Corporate-Design-Akzenten - Wolkenhintergrund und reduzierter ungenutzter Weißraum - einheitliche Typografie und dynamische Skalierung ### Ansagen und Bibelwort - Ansagen werden direkt aus dem Contentpanel übernommen - alle ab heute relevanten Ansagen bleiben kontinuierlich sichtbar - abgelaufene Einträge werden beim Aufruf von Dashboard oder Contentpanel bereinigt - einheitlich ausgerichtete, listenartige Darstellung - weiche Ausblendung am unteren Rand statt Seitenwechsel - Bibelwort wird ohne automatischen Wechsel vollständig dargestellt - sichtbare Inhalte werden bei fehlgeschlagenen Hintergrundabfragen nicht vorübergehend durch Fehlermeldungen ersetzt ### Aushänge - zusammengehörige Seiten werden als gemeinsames Dokument gruppiert - mehrseitige Aushänge bleiben möglichst vollständig zusammen - Seiten eines Dokuments werden ohne Zwischenraum und mit gemeinsamem Rahmen dargestellt - verfügbare Flächen werden möglichst vollständig gefüllt - bei zu wenigen Seiten können geeignete Seiten aus der vorherigen Zusammenstellung übernommen werden - kreisförmige Fortschrittsanzeige bis zum nächsten Seitenwechsel - neue Inhalte werden nach einem vollständigen Aushangdurchlauf im Hintergrund geladen - der bisherige Inhalt bleibt während der Aktualisierung sichtbar ### Live-Abfahrten - nächste fünf Busabfahrten an der Haltestelle Eichborndamm/Antonienstraße - Anzeige von Linie, Fahrtrichtung, verbleibender Zeit und Abweichung - alternierende weiße und graue Tabellenzeilen - grüner Statusrand für pünktliche und planmäßige Abfahrten - orangefarbener Statusrand für Verspätungen - roter Statusrand für verfrühte oder entfallende Fahrten - Aktualisierung ungefähr alle zwölf Sekunden sowie zum Minutenwechsel - serverseitiger, prozessübergreifender Cache für bis zu 30 Abfahrten - der letzte erfolgreiche Stand bleibt bei API-Ausfällen fünf Minuten aktuell - Restzeiten und sichtbare Einträge werden auch mit zwischengespeicherten Daten fortlaufend aktualisiert - verzögerte Wiederholungsversuche vermeiden unnötige Last bei externen Fehlern ### Temperaturen - Innenwert über Home Assistant - Außenwert passend zum Standort der Bushaltestelle - Innentemperatur wird nach der definierten 0,4-Grenze auf ganze Grad gerundet - bereits erfolgreich geladene Werte bleiben bei vorübergehenden Verbindungsproblemen sichtbar ## Monatsplan Die bestehende Monatsplan-Erzeugung wurde gezielt korrigiert, ohne das grundsätzliche Erscheinungsbild zu verändern. - Ortsangaben werden dem tatsächlichen Ereignisblock zugeordnet - ausgewertet wird ausschließlich das CKalender-Feld `show_place` - Titel, Notizen, Datumsbereiche und Trennzeichen können dadurch nicht mehr versehentlich als Ort erscheinen - fehlende Ortsangaben bleiben leer; `--` wird nicht ausgegeben - jeder Monat erhält ein korrekt platziertes Logo im Monatstitel - passt der erste Monat vollständig auf Seite 1, beginnt der zweite Monat auf einer neuen Seite - reicht der erste Monat bereits auf Seite 2, wird der zweite Monat dort mit dem vorgesehenen Abstand fortgesetzt - transparente Außenbereiche werden im Dashboard berücksichtigt - beide Monatsplanseiten behalten denselben Maßstab und erhalten einen gleichmäßigen Rand und Seitenabstand ## Architektur und Betrieb - getrennte Dashboard-Endpunkte für Inhalte, Bilder, Temperaturen und Abfahrten - unabhängige Hintergrundabfragen verhindern, dass ein fehlerhafter Dienst andere Bereiche blockiert - Inhalte werden erst nach erfolgreichen Antworten ausgetauscht - reduzierte Datenstrukturen und entfernte ungenutzte Konfiguration - generierte Monatsplan-, Aushang- und Cachedateien werden nicht versioniert - temporäre Contentpanel-Dateien sind gegen direkten Webzugriff geschützt - lokale und produktive Docker-Konfigurationen wurden um die benötigten Worker- und Renderer-Komponenten ergänzt - keine Datenbankmigration erforderlich ## Enthaltene Entwicklungsstränge Die Commit-Historie enthält außerdem die bereits zwischen `dev` und `main` parallel gemergten Entwicklungsstränge für: - Core-Refactoring und gehärtete Autorisierung - vereinfachte Endpunkte - CKalender-Einlesekorrektur - RSS-Ausgabe im Developerpanel - Docker-/Strato-Synchronisation - verknüpfte Entwicklungsinstanz und SSO Die zugehörigen Merge-Commits unterscheiden sich zwischen den Branches, die materiellen Änderungen sind in `main` jedoch bereits weitgehend vorhanden. ## Prüfung - PHP-Syntax der Dashboard-Endpunkte und Hilfsdateien geprüft - JavaScript-Syntax des Dashboards geprüft - Python-Syntax der Worker und Monatsplan-Erzeugung geprüft - Dashboard in Full HD und 4K kontrolliert - Monatsplan anhand der erzeugten Seiten visuell geprüft - Ortszuordnung, Seitenumbruch und Logo-Platzierung kontrolliert - Aushanggruppierung, Skalierung und Seitenwechsel geprüft - Busdarstellung, Statusfarben, Restzeiten und Cache-Verhalten geprüft - 62 automatisierte Testfälle für Contentpanel, Verarbeitung, Rendering, Queue und Webvorschau vorhanden

samuelbias added 11 commits 2026-09-04 14:26:06 +02:00

Merge pull request 'bugfix/docker-compose - strato sync switch implemented' (#15 ) from bugfix/docker-compose into dev 2e33f2da38