Vorher: eine Liste von Tagen, je Tag drei Knöpfe, und erst nach „Ansehen" stand irgendwo Text. Wer wissen wollte, was gerade schiefgeht, brauchte drei Handgriffe für eine Antwort, die auf der ersten Seite hätte stehen können. Jetzt ist „Protokolle" eine Liste von Ereignissen, wie man sie aus Home Assistant kennt: der heutige Tag sofort und offen, neueste Zeile oben — damit man zum Mitlesen nicht scrollen muss —, und alle vier Sekunden kommt dazu, was dazugekommen ist. Fehler und Warnungen tragen die Farbe am Rand statt im Text; eine ganze Zeile in Rot liest sich schlechter als eine in Grau mit rotem Strich. Die früheren Tage stehen darunter als Kacheln zum Herunterladen. Der heutige nicht: er steht schon oben, und eine zweite Tür zum selben Raum ist keine Hilfe. Mehrzeiliges — ffmpeg schreibt gern vier Zeilen — hat keinen eigenen Zeitstempel und gehört zur Zeile darüber. Es wird eingerückt gezeigt statt verworfen. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Flaro Web
Die Weboberfläche für Rechner, auf denen es keine App gibt — Windows vor allem.
Aufbau
| Ordner | Was |
|---|---|
app/ |
Das Frontend (Vite, TypeScript) |
server/ |
Ein Server ohne Abhängigkeiten, der die Anfragen weiterreicht und die gebauten Dateien ausliefert |
frontend/ |
Die erste Fassung als einzelne Datei. Läuft, wird abgelöst. |
jellyfin-theme/ |
Ein Kleid für Jellyfins eigene Oberfläche — die kleine Lösung von vorher |
Warum ein eigener Server?
Er löst zwei Dinge, an denen die einzelne Datei scheitert, und zwar unabhängig davon, wie gut das Frontend geschrieben ist:
- Herkunft. Anfragen laufen über
/apiund damit über dieselbe Adresse wie die Seite. Kein CORS, auch nicht beim Streamen. - Klartext und Verschlüsselung. Läuft der Medienserver über
httpund die Seite überhttps, blockiert der Browser den Stream. Dagegen kann keine Zeile im Frontend etwas tun — ein Server davor schon.
Nebenbei bleibt der Zugangsschlüssel beim Server, statt im Browser zu liegen.
Betreiben
cd app && npm install && npm run build
cd ../server && FLARO_SERVER=http://jellyfin:8096 node index.js
Dann auf http://localhost:8080. Der Port lässt sich über PORT ändern.
Entwickeln
cd app && FLARO_SERVER=http://jellyfin:8096 npm run dev
Vite übernimmt dabei das Weiterreichen, der eigene Server wird nicht gebraucht.