Er packte um, was gar nicht am Umpacken lag

Der Browser bekam stillschweigend Apples Geräteprofil — und mit ihm HEVC, AC3
und EAC3, von denen er keines öffnet. Der Server packte die Datei
pflichtschuldig nach MP4 um, liess Bild und Ton dabei unberührt, und heraus
kam eine tadellose Datei, mit der Chrome nichts anfangen konnte. Umpacken
fasst das Bild nun einmal nicht an.

Jetzt sagt das Gerät selbst, was es kann, und es gibt einen zweiten Weg neben
der fertigen Datei: HLS, das nach Sekunden anfängt statt nach Minuten.
Dasselbe Rohr erledigt beides — mkv nach fMP4 mit „-c:v copy", 4K nach 480p
mit libx264 — und eine MP4, die der Browser ohnehin öffnet, geht ganz ohne
ffmpeg hinaus.

Dazu eine eigene Steuerleiste: Tonspur und Untertitel während der Wiedergabe
umschaltbar, vier Auflösungsstufen, Tastenkürzel, und bei einem Fehler ein
deutscher Satz statt eines schwarzen Bildes.

Gemessen statt vermutet: Chromium antwortet auf canPlayType für HLS mit
"maybe" und kann es dann doch nicht — deshalb entscheidet Hls.isSupported().
hls.js wiegt 372 KB und wird erst beim Abspielen geholt; die Oberfläche
bleibt bei 109.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

web/app/src/icons.ts

@@ -50,6 +50,21 @@ export const icons = {
     + '<path d="M10 16.5 14.5 12 10 7.5"/><path d="M14.5 12H4"/>'),
   schliessen: rahmen('<path d="M6 6l12 12M18 6 6 18"/>'),
   stern: rahmen('<path d="m12 3.6 2.6 5.3 5.9.9-4.3 4.1 1 5.8-5.2-2.7-5.2 2.7 1-5.8L3.5 9.8l5.9-.9z"/>'),
+
+  /* --- Spieler -------------------------------------------------------- */
+  pause: rahmen('<rect x="7" y="5" width="3.5" height="14" rx="1"/>'
+    + '<rect x="13.5" y="5" width="3.5" height="14" rx="1"/>', true),
+  ton: rahmen('<path d="M4 9.5h3.5L12 5.5v13L7.5 14.5H4z"/>'
+    + '<path d="M16 9a4.5 4.5 0 0 1 0 6"/><path d="M18.5 6.5a8 8 0 0 1 0 11"/>'),
+  stummGeschaltet: rahmen('<path d="M4 9.5h3.5L12 5.5v13L7.5 14.5H4z"/>'
+    + '<path d="m16.5 9.5 5 5M21.5 9.5l-5 5"/>'),
+  vollbild: rahmen('<path d="M4 9V5h4"/><path d="M20 9V5h-4"/>'
+    + '<path d="M4 15v4h4"/><path d="M20 15v4h-4"/>'),
+  untertitel: rahmen('<rect x="3" y="5" width="18" height="14" rx="2"/>'
+    + '<path d="M7 14.5h4"/><path d="M13 14.5h4"/>'),
+  zahnrad: rahmen('<circle cx="12" cy="12" r="3.2"/>'
+    + '<path d="M12 2.8v2.4M12 18.8v2.4M4.5 7.5l2.1 1.2M17.4 15.3l2.1 1.2'
+    + 'M4.5 16.5l2.1-1.2M17.4 8.7l2.1-1.2"/>'),
 } as const;
 
 export type IconName = keyof typeof icons;