Basis für ein Wochenend-Projekt
Für iOS und Rechner: TV-Livestreaming-Seite mit Hotkeys und Zapping
Wenn wir in ruhigen Minuten eine kleine Runde Code Golf spielen, dann kommt manchmal sogar etwas Brauchbares dabei heraus. Aktuell haben wir in Anlehnung an die Mac-Anwendung Telemac eine schlichte Internetseite gestrickt, die den einfachen und schnellen Zugriff auf das Live-Programm aller Öffentlich-Rechtlichen sowie auf die Auslandssender NHK, RT und Al Jazeera ermöglicht.
Die Webseite – eine schlichte HTML-Datei – besitzt keine lokalen Abhängigkeiten und kann gerne von euch weiterbearbeitet, auf dem eigenen Webserver eingesetzt oder auch nur als Ausgangspunkt für ein eigenes Wochenend-Projekt genutzt werden.
Nach dem Aufruf spielt die Seite automatisch den (bei Aufruf erst mal tonlosen) Stream des ARD ab und passt sich selbstständig an die Display-Auflösungen von iPhone, iPad und Rechner-Monitor an.
Hotkeys für Ton, Vollbild und Zapping
Steht euch eine Tastatur zur Verfügung, könnt ihr mit den Tasten „+/-“ durch die verfügbaren Sender zappen, die Taste „M“ schaltet den Ton ein bzw. stumm, die Taste „F“ startet und verlässt die Vollbildansicht. Auf iPhone und iPad muss von Hand umgeschaltet werden.
Die Javascript-Schnipsel, die die kleine Spielerei ermöglichen machen uns nicht stolz – die Funktionen die umgesetzt werden sollten funktionieren jedoch auch mit unserem Flickenteppich, das reicht uns.
Solltet ihr Lust haben den Code zu optimieren, zu kommentieren bzw. unsere Wischi-Waschi-Funktionen durch ordentlich vereinheitlichte Klassen zu ersetzen, dann bitte keine Zurückhaltung. Den Code könnt ihr hier einsehen und kopieren.
Eine Demo-Version haben wir zu Testzwecken auf dem Entwickler-Portal jsfiddle abgelegt. Diese könnt ihr hier aufrufen und schon mal auf iPad, iPhone oder Mac probeschauen – denkt euch den weißen Balken am oberen Seitenende einfach weg. Auf dem iPhone muss die Seite in Safari geladen werden um zu funktionieren und nicht in einem In-App-Browser.
Unsere Video-Seite funktioniert auch auf Servern mit HTTPS-Verschlüsselung, lässt sich in Chrome, Safari und Firefox nutzen und bietet lediglich unter iOS noch keinen (funktionalen) Knopf zum Wechseln in den Vollbildmodus an. Apples Browser unterstützt die Funktion bislang noch nicht sondern besteht auf die Nutzung der nativen Video-Elemente.