Videoplayer

Ein Flask-basierter Medienplayer für Raspberry Pi, Mini-PC oder TV-Kiosk. Steuerung per Handy über HTTP, Ausgabe über HDMI am TV.

Funktionsweise

Die App besteht aus zwei getrennten Ansichten, die über einen gemeinsamen Server-Status kommunizieren:

• /display – reine Ausgabe-Ansicht (TV/Mac). Zeigt das aktuelle Medium ohne Bedienelemente. Pollt den Server-Status und reagiert automatisch auf Befehle.
• /controller – Steuerungs-Ansicht fürs Handy. Enthält Medienliste, Upload, Play/Stop/Next/Prev/Spulen und Lautstärkeregler.

Der Server verwaltet einen zentralen Player-State (current, playing, seek, volume), den der Display pollt und der Controller per API steuert.

Funktionen

• Upload von mp4, webm, mp3, wav, m4a, jpg, jpeg, png, gif
• Medienliste mit auswählbaren Elementen
• Play, Stop, Vor/Zurück, Vor-/Rückwärtsspulen (+/-10s)
• Lautstärkeregler
• Bildanzeige (Diashow per Controller-Timer)
• Drag-and-drop-Upload
• Löschen mit Bestätigungsdialog
• Fernsteuerung per Handy, Ausgabe am TV
• Tabler-Oberfläche mit CANCOM-Branding, Darkmode und Theme-Toggle
• Muted-Autoplay-Fallback (Display startet sofort ohne Klick)

API-Endpunkte

Methode	Pfad	Beschreibung
GET	/api/state	Aktuellen Player-State abrufen
POST	/api/play	Medium abspielen oder Wiedergabe fortsetzen
POST	/api/stop	Wiedergabe anhalten
POST	/api/next	Nächstes Medium in der Playlist
POST	/api/prev	Vorheriges Medium
POST	/api/seek	Spulen (±10 Sekunden)
POST	/api/volume	Lautstärke setzen
GET	/api/media	Medienliste abrufen

Beispiele (mit curl)

Status abrufen

curl http://<host>:5008/api/state
# {"current":{"name":"video.mp4","kind":"video"},"playing":true,"seek":0,"version":5,"volume":0.8}

Medium aus der Medienliste abspielen

curl -X POST http://<host>:5008/api/play \
  -H "Content-Type: application/json" \
  -d '{"name": "video.mp4"}'

Aktuelles Medium fortsetzen (nach Stop)

curl -X POST http://<host>:5008/api/play \
  -H "Content-Type: application/json" \
  -d '{}'

Wiedergabe anhalten

curl -X POST http://<host>:5008/api/stop

Nächstes / vorheriges Medium

curl -X POST http://<host>:5008/api/next
curl -X POST http://<host>:5008/api/prev

10 Sekunden vor / zurück spulen

curl -X POST http://<host>:5008/api/seek \
  -H "Content-Type: application/json" \
  -d '{"seconds": 10}'
curl -X POST http://<host>:5008/api/seek \
  -H "Content-Type: application/json" \
  -d '{"seconds": -10}'

Lautstärke auf 50 %

curl -X POST http://<host>:5008/api/volume \
  -H "Content-Type: application/json" \
  -d '{"volume": 0.5}'

Medienliste abrufen

curl http://<host>:5008/api/media

Oberfläche

• Die Kopfzeile nutzt das CANCOM-Logo aus static/cancom.svg
• Das Favicon liegt in static/favicon.ico
• Die Wordmark Videoplayer / Media Kiosk ist zweizeilig in der Kopfzeile
• Darkmode und Lightmode werden über keyadmin-theme im Browser gespeichert
• CANCOM-Rot (#da002d) als Primärfarbe, dunkler Header (#2b2f36)

Starten

python3 -m venv venv
source venv/bin/activate
pip install -r requirements.txt
python3 app.py

Danach im Browser:

• http://<host>:5008/display auf dem HDMI-Monitor oder Mac-Kiosk
• http://<host>:5008/controller auf dem Handy

Der Display startet sofort ohne Klick (Muted-Autoplay). Einmaliger Klick auf den Display-Bildschirm schaltet den Ton endgültig frei.

Kioskmodus

Chromium im Kioskmodus starten:

chromium-browser --kiosk http://127.0.0.1:5008/display

Autostart unter Linux

chmod +x install-autostart.sh
./install-autostart.sh

Optional auch manuell in ~/.config/autostart/launch-videoplayer.desktop.

systemd Autostart

sudo chmod +x install-systemd.sh
sudo ./install-systemd.sh
sudo systemctl start videoplayer.service

Der Dienst nutzt standardmäßig /opt/videoplayer, Uploads unter /opt/videoplayer/uploads.

Mac-Kiosk

Start: ./start-mac-kiosk.sh Stop: ./stop-mac-kiosk.sh

Umgebungsvariablen

• UPLOAD_DIR – Upload-Verzeichnis (Standard: <app>/uploads)
• PORT – Server-Port (Standard: 5008)

Hinweise

• Die Steuerung läuft komplett über HTTP und REST-API, also auch vom Handy aus.
• /display enthält keinerlei Bedienelemente – nur das aktuelle Medium.
• Der Lautstärkeregler auf /controller steuert die Ausgabe-Lautstärke auf dem Display.
• Der Server-Player-State bleibt beim Wechsel zwischen den Ansichten erhalten.