Teletext Element

Introduction

The teletext element provides DVB teletext stream visualisation and interaction (list pages/subpages, process coloured keys). Element is implemented as windowless (i.e. it does not have its own window, but it draws some data). Teletext element supports both SVG Browser and Webkit.

Note! This functionality is optional and implemented as an external NPAPI runtime plugin.

Embedding

Building

To build IIP package with teletext element there an option in config file should be enabled

# Plugin for SVG browser
kreatv-option-npapi-teletext:mode=svg
# Plugin for Webkit
kreatv-option-npapi-teletext:mode=html

Embedding teletext to SVG portal

function embedTeletextElement() {
  var teletext = document.createElement("foreignObject");
  teletext.setAttribute("id", "teletext");
  teletext.setAttribute("x", teletextX);
  teletext.setAttribute("y", teletextY);
  teletext.setAttribute("width", teletextWidth);
  teletext.setAttribute("height", teletextHeight);
  teletext.setAttribute("requiredExtensions", "application/motorola-teletext-plugin");
  document.documentElement.appendChild(teletext);

  return teletext;
}

Embedding teletext to HTML portal

function embedTeletextPlugin() {
  teletext = document.createElement("embed");
  teletext.id = "teletext";
  teletext.type = "application/motorola-teletext-plugin";
  teletext.style.position = "absolute";
  teletext.style.width = teletextWidth + "px";
  teletext.style.height = teletextHeight + "px";
  teletext.style.top = teletextY + "px"; // has to be 1 rather than 0
  teletext.style.left = teletextX + "px"; // has to be 1 rather than 0
  teletext.style.zIndex = "10";
  document.body.appendChild(teletext);

  return teletext;
}

Note! The API of plugin for HTML accessable over control object api.

Programming APIs

Methods

void inputDigit(short digit)

Process input of one digit for a page selection.

Parameters

digit
Type: short
Allowed range is 0-9.

void inputRedKey()
void inputGreenKey()
void inputYellowKey()
void inputCyanKey()

Process colored key press.

void gotoIndexPage()

Switch to page 100.

void gotoNextPage()

Navigate next page.

void gotoPreviousPage()

Navigate previous page.


void gotoNextSubpage()

Navigate next subpage.

void gotoPreviousSubpage()

Navigate previous subpage.

Note! Methods gotoNextSubpage() and gotoPreviousSubpage() works only if property controllableSubPages is true.


Attributes

boolean transparent

If true then teletext background is transparent, otherwise is opaque.

Note! This affects only colored areas of teletext, i.e. if some screen are is to be drawn transparent (e.g. on subtitles teletext page 888) it is always transparent.

boolean controllableSubPages

If true, the sub-pages navigation controls are enabled, otherwise subpages are switched automatically. Default value is false. Some teletext pages can contain several subpages which are displayed one-by-one after some delay. When subpage navigation is enabled, a counter appears in the top left corner, next to the page number, like 2(5), and the sub-pages are switched using gotoPreviousSubpage() and gotoNextSubpage() calls, automatic update does not work.

Examples

Set teletext visibility (SVG)

function setVisible(isVisible) {
  if (isVisible) {
    teletext.setAttribute("display", "inline");
  } else {
    teletext.setAttribute("display", "none");
  }
}

Set teletext visibility (HTML)

function setVisible(isVisible) {
  if (isVisible) {
    teletext.style.visibility = "visible";
  } else {
    teletext.style.visibility = "hidden";
  }
}

General usage example (SVG)

function onKeyTeletext(keyCode) {
  switch(keyCode) {
    case KEY_LEFT:
      teletext.gotoNextPage();
    break;
    case KEY_RIGHT:
      teletext.gotoPreviousPage();
    break;
    case KEY_INDEX:
      teletext.gotoIndexPage();
    break;
    case KEY_RED:
      teletext.inputRedKey();
    break;
    case KEY_GREEN:
      teletext.inputGreenKey();
    break;
    case KEY_YELLOW:
      teletext.inputYellowKey();
    break;
    case KEY_BLUE:
      teletext.inputCyanKey();
    break;
    case KEY_TRANSPARENT:
      //toggles transparent background of teletext
      teletext.transparent = !teletext.transparent;
    break;
  }

  if (keyCode >= KEY_0 && keyCode <= KEY_9) {
    teletext.inputDigit(getDigitValue(keyCode));
  }
}

General usage example (HTML)

function onKeyTeletext(keyCode) {
  switch(keyCode) {
    case KEY_LEFT:
      teletext.api.gotoNextPage();
    break;
    case KEY_RIGHT:
      teletext.api.gotoPreviousPage();
    break;
    case KEY_INDEX:
      teletext.api.gotoIndexPage();
    break;
    case KEY_RED:
      teletext.api.inputRedKey();
    break;
    case KEY_GREEN:
      teletext.api.inputGreenKey();
    break;
    case KEY_YELLOW:
      teletext.api.inputYellowKey();
    break;
    case KEY_BLUE:
      teletext.api.inputCyanKey();
    break;
    case KEY_TRANSPARENT:
      //toggles transparent background of teletext
      teletext.api.transparent = !teletext.api.transparent;
    break;
  }

  if (keyCode >= KEY_0 && keyCode <= KEY_9) {
    teletext.api.inputDigit(getDigitValue(keyCode));
  }
}