Die Oberfläche zeigt jetzt, was der Server seit Stufe 4 weiss. Auf der Startseite zwei neue Reihen, ganz oben: **Weiterschauen** und **Nächste Folge**. Sie überschneiden sich nicht — was angefangen ist, steht links, was ansteht, rechts. Eine leere Reihe wird gar nicht erst gezeigt. Auf jeder Kachel ein Balken, und zwar **ab der ersten Sekunde**. Bei einem Zweieinhalbstünder sind zwei Minuten 1,3 % — anderthalb Bildpunkte. Der Balken hat deshalb eine Mindestbreite, sonst wäre das Versprechen „wir merken uns jede Sekunde" ausgerechnet dort unsichtbar, wo es zählt. Serien tragen die Zahl offener Folgen als Plakette in der Ecke. Auf der Detailseite stehen **beide Knöpfe nebeneinander**: „Weiterschauen ab 0:42" und „Von vorn". Auch bei einem gesehenen Film — der Server wirft die Stelle nicht weg, wenn das Häkchen kommt, und sie hier zu verschweigen hiesse, genau den Unterschied wegzuwerfen, um dessentwillen er sie behält. Dazu ein Schalter für gesehen/ungesehen. Der Spieler meldet alle zehn Sekunden, beim Pausieren, am Ende und beim Schliessen. Nicht bei jedem `timeupdate`: das feuert viermal je Sekunde, und daraus Anfragen zu machen hiesse, den Server mit Meldungen zu bewerfen, die sich um 250 ms unterscheiden. Eine verlorene Meldung kostet ein paar Sekunden Fortschritt — dafür mitten im Film einen Fehler einzublenden wäre die schlechtere Hälfte des Tauschs. **Nebenbei ein Fehler beseitigt, der nur mit grosser Mediathek aufgefallen wäre:** die Detailseite holte 200 Titel und suchte darin nach der Kennung. Bei 201 Filmen hätte sie vom letzten behauptet, es gebe ihn nicht mehr. Jetzt gibt es den Einzelabruf, und sie benutzt ihn. Im Container durchgespielt: „Der Untergang" von vorn, die MKV wird umgepackt, läuft durch — danach steht „Gesehen" unter dem Titel, der Balken ist voll, und der Knopf bietet beides an. 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.