Dieser Artikel ist älter als zwei Jahre und womöglich veraltet!

HbbTV: CE-HTML im Fernseher

Der Teletext (oder auch Videotext) mit seinen 23 Zeilen ist schon etwas in die Jahre gekommen und soll in den nächsten Jahren durch HbbTV ersetzt werden. Mit Hybrid Broadcast Broadband TV soll die Zukunft in die textbasierte Information am Fernseher Einzug halten. Nicht mehr über die Satelliten-Ausstrahlung, sondern über die Internetverbindungen sollen so Informationen abgerufen werden.

HbbTV Logo

Mit dieser Technik ist es erstmals möglich hochaufgelöste Informationsseiten mit Videos und Interaktivität zur Verfügung zu stellen. Realisiert wird die durch Standard-Techniken aus der Websiten-Programmierung. So wird bei HbbTV CE-HTML eingesetzt. Das Consumer Electronic-HTML stellt eine Erweiterung der bestehenden Standards für die Einbindung von aktuellen Fernsehbildern und die Bedienung mit der Fernbedienung dar.

Aufbau eines CE-HTML Dokumentes

Grundsätzlich ist ein Dokument mit CE-HTML genauso aufgebaut wie ein normales HTML-Dokument. Unterschiede gibt es lediglich im verwendeten MIME-Type und dem Doctype. So wird das Dokument mit dem Content-Type-Header application/ce-html+xml übertragen. Der Doctype sollte wie folgt lauten:

1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "ce-html-1.0-transitional.dtd">

Erwähnenswert ist auch noch folgende CSS-Regel, um die Seite transpartent über das TV-Bild legen zu können:

1body {
2	background-color: transparent;
3}

Steuerung

Gesteuert wird die Anwendung natürlich nicht über eine Maus, sondern über die Tasten der Fernbedienung. Hauptsächlich über die vier farbigen Tasten in Rot, Gelb, Grün und Blau und den Pfeiltasten. Bei der Benützung einer der Tasten auf der Fernbedienung wird ein keydown-Event mit dem entspechenden keyCode-Wert ausgelöst. Über einen EventListener kann nun bei solch einer Aktion der Code der Taste ausgewertet werden. Die Werte der einzelnen Tasten sind in den Konstanten VK_RED, VK_BLUE, usw. gespeichert und müssen nur mehr mit dem übergebenen Code verglichen werden.

 1document.body.addEventListener("keydown", function(e){
 2   switch(e.keyCode){
 3       case VK_RED:
 4           alert("rot");
 5       break;
 6       case VK_BLUE:
 7           alert("blau");
 8       break;
 9       case VK_GREEN:
10           alert("grün");
11       break;
12       case VK_YELLOW:
13           alert("gelb");
14       break;
15       case VK_UP:
16           alert("rauf");
17       break;
18       case VK_DOWN:
19           alert("runter");
20       break;
21       case VK_LEFT:
22           alert("links");
23       break;
24       case VK_RIGHT:
25           alert("rechts");
26       break;
27   }
28});

Eine Liste mit allen Befehlen bekommt man zum Beispiel bei Opera oder durch Lektüre der Spezifikation von HbbTV.

Weitere Informationen über die Verwendung von Bildern, Videos, dem Applikations-Modell und den weiteren Funktionen, wie zum Beispiel Einstellungen und Lesezeichen, gibt es in der oben genannten Spezifikation.

Weitere Artikel

Apps für Samsung Smart TVs analysieren

Zurzeit sind Fernseher groß in Mode, die sich mit dem Internet verbinden können und die reine Verwendung als Fernseher um weitere Dienste erweitern. Auch Apps kann man auf diesen Geräten installieren und so zum Beispiel Videos aus Mediatheken abrufen oder auf Online-Konten zugreifen. Doch, was …

Johannes Mittendorfer
Johannes Mittendorfer