Ivn Bernal, Ph.D.

ivan.bernal@epn.edu.ec
http://ginga.epn.edu.ec

Escuela Politcnica Nacional

Quito Ecuador
Copyright @2012, I. Bernal

Quito, 26 y 27 de noviembre de 2012

Guayaquil, 29 y 30 de noviembre de 2012

Ivn Bernal, Ph.D.

Escuela Politcnica Nacional

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

Ginga -NCL
Ivn Bernal, Ph.D.
Ivan.bernal@epn.edu.ec
http://ginga.epn.edu.ec

Escuela Politcnica Nacional

Quito Ecuador

Copyright @2012, I. Bernal

Agenda
Generalidades
TV digital
Interactividad

STB

Ginga (middleware)

Ginga-NCL

Ginga-J

Plugin Eclipse y emulador de STB

NCL: regiones, descriptores y medios

Documentos hipermedia: nodos y enlaces

Conectores

Ejemplo

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

Bibliografa
1.

http://wiki.ginga.org.ar (varios artculos)

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

Generalidades
Ginga es el nombre que recibe el middleware.
Ginga permite ejecutar aplicaciones interactivas dentro de un STB
(Set-Top Box).
En el mercado existen STBs de distintos fabricantes y puede variar la
plataforma de hardware/software de los mismos.
Necesidad clara de tener un middleware que permita correr aplicaciones sin
importar que STB se tenga.
Los STBs tendrn la capacidad de actualizar su firmware as como tambin
la versin de Ginga.
Se puede actualizar por aire: mtodo de actualizacin masivo, y es el broadcaster de TV
quien se encarga de emitir la actualizacin.
A travs de un dispositivo USB: el fabricante provee un pendrive o bajando la
actualizacin desde la web.
Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

Generalidades
Ginga
Middleware abierto.
Se subdivide en dos subsistemas interrelacionados que permiten el
desarrollo de aplicaciones siguiendo dos paradigmas de programacin
diferentes.
Ginga-J (para aplicaciones procedimentales Java)
Ginga-NCL (para aplicaciones declarativas NCL)

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

Generalidades
NCL (Nested Context Language)
NCL is an XML application language based on the NCM (Nested Context Model)
NCM is a conceptual model for hypermedia document specification, with temporal and
spatial synchronization among its media objects.

Lenguaje declarativo que provee facilidades para especificar aspectos de

interactividad, sincronismos espacial/temporal entre objetos de multimedia,
adaptabilidad y soporte para mltiples dispositivos, es decir construir aplicaciones.
Ginga-NCL
nico middleware estndar internacional tanto para IPTV como para TV digital
terrestre (en todos los tipos de dispositivos).
nico estndar abierto.
El mismo fue creado en la Pontificia Universidad Catlica de Ro de Janeiro
(PUC-Rio) .
Ofrece una infraestructura de presentacin de aplicaciones de multimedia/hipermedia
desarrolladas sobre el paradigma declarativo, escritas en el lenguaje NCL y el lenguaje
de scripting Lua.
Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

Generalidades
NCL (Nested Context Language)
Las aplicaciones se pueden ejecutar de dos maneras en el STB.
Las aplicaciones a ejecutar en los STBs vienen dentro de la seal que reciben,
en un canal de datos dedicado para las aplicaciones.
Este canal, recibe el nombre de carrusel de datos, dado que se va
iterando sobre los datos de manera circular envindolos constantemente.
Esto es necesario porque cuando se sintoniza un canal de televisin, el
STB debe poder descargar el contenido completo del carrusel.
Luego ya sea por voluntad del usuario, o por eventos emitidos desde el
brodcaster la aplicacin se ejecuta.
La aplicacin es cargada a travs de un dispositivo USB y ejecutada.
Descargar del Internet por el canal de retorno
Puede venir embebida en el STB.

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

Generalidades
NCL (Nested Context Language)
Lenguaje declarativo
Significa que los programas declaran el resultado esperado.
Quien ejecuta el programa debe articular los recursos necesarios para
obtener lo que se declara.
Para comprender esta idea, considerar el lenguaje declarativo HTML,
donde se declara una pgina web pero no se indica paso a paso como
obtenerla, sino que el navegador web interpreta esta declaracin y la
muestra con sus propios algoritmos en base a los recursos que maneja.

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

10

Generalidades
NCL (Nested Context Language)
El lenguaje declarativo NCL puede adems complementarse con el lenguaje
de scripting Lua, combinando programacin declarativa+procedural.
Salvando la diferencia entre lenguajes y el uso especfico para aplicaciones
de TV interactiva de Ginga-NCL-Lua.
Este enfoque es anlogo al uso del lenguaje declarativo HTML con el de scripting
Javascript que se aplica en el desarrollo de paginas web.

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

11

Generalidades
The basic NCL structure module defines:
Te root element, called <ncl>, and its children elements:
The <head> element
The <body> element

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

12

Generalidades
The <head> element may have the following elements as its
children:
<importedDocumentBase>
<ruleBase>
<transitionBase>
<regionBase>
<descriptorBase>
<connectorBase>
<meta> and <metadata>

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

13

Generalidades
The <body> element may have the following elements as
its children:
<port>
<property>
<media>
<context>
<switch>
<link>

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

14

Eclipse

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

15

Eclipse

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

16

Eclipse

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

17

Eclipse

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

18

Eclipse

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

19

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

20

NCL
Todos los nombres de las etiquetas (tags) estn en letras
minsculas.
A diferencia de HTML, en donde <HTML>, <html>, <Html> y
<hTMl> todas se refieren a la misma cosa.
En NCL, los nombres de las etiquetas son sensibles a
maysculas y minsculas.
Todos los nombres de las etiquetas NCL usan minsculas y as se las debe
utilizar.

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

21

NCL
Elementos
Toma una de dos formas.
Start tag y end tag (etiquetas de inicio y fin) cuyos tipos deben coincidir.

Solo un empty-element tag

Ntese que hay exactamente un / por elemento.

Un elemento puede contener otros elementos

(cualquiera de las dos formas indicadas).
Cada etiqueta puede contener atributos y sus
respectivos valores asignados.
Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

22

NCL

Planificar!!!!!!

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

23

Ejemplo
Dentro de <head>:
Definir una <region> dentro de <regionBase>
Una regin define el espacio de exhibicin de un objeto medio

Definir un <descriptor> dentro de <descriptorBase>

Un descriptor define las caractersticas de presentacin de un medio y la regin en el que
se muestra.
Define como se presentan los medios.

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

24

Ejemplo
region id="rgScreen"
width=100%
height=100%
left=top= 0%

region id="rgBoton"
left="3%
top="5%"
height="10%"
width="10%"

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

25

Ejemplo
region id="rgBanner"
top=0%"
left="70%"
height="100%"
width="30%"

region id="rgInferior"
top="75%"
left="0%"
height="25%"
width="70%"
Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

26

Ejemplo

Para este ejercicio:

Incluir todas las regiones
Incluir todos los descriptores
Las regiones y los descriptores pueden ser utilizados por
varios medios!!!!!
Imgenes verticales: lista, 8 candidatos
Imgenes horizontales: mensaje CNE, propuestas de
todos los candidatos

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

27

Ejemplo

Para este ejercicio:

Incluir por ahora los medios
Video
Botn de interactividad (info.png)
Lista de candidatos (lista.png)
Mensaje del CNE (inferior.png)

No olvidar asociar a los medios los

descriptores!!!

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

28

Ejemplo
Los documentos hipermedios estn compuestos generalmente por
nodos (ns) y enlaces (links, elos).
Cada nodo representa un medio y cada enlace representa la relacin entre
medios.
Una relacin entre medios puede especificar, por ejemplo, que en un
determinado momento de la presentacin de un medio, otro debe iniciarse.

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

29

Ejemplo
Ejemplo: considerando un programa audiovisual interactivo que
al iniciar la presentacin de un video, inicie tambin la
presentacin de una imagen y texto.

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

30

Ejemplo
NCM (Nested Context Model) Modelo de Contextos anidados
Para estructurar/organziar de mejor manera la seccin body (que es un contexto global),
pueden emplearse los contextos para enmarcar algunos medios que estn estrechamente
relacionados. Por ejemplo: los tems de un men.

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

31

Ejemplo
MiConector (onBeginStart)
Apenas existe un rol de condicin y un rol de activacin.
onBegin: condicin que indica que el enlace se activa cuando el nodo asociado a este rol es
iniciado.
start : accin indicando que el enlace, al ser activado, inicia una presentacin del nodo asociado
a este rol.
El conector inicia la presentacin del nodo ligado al rol start cuando el nodo asociado al rol
onBegin es presentado

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

32

Ejemplo

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

33

Ejemplo
En NCL 3.0 solo hay un tipo de conector : causal connector.
Define condiciones sobre las cuales el enlace puede ser activado y las acciones que sern
realizadas cuando el enlace sea activado.
Un conector causal debe poseer por lo menos una condicin y una accin.
Cada condicin o accin est asociada a un rol, punto de interfaz del conector que participar
de las asociaciones (bind) del enlace.
Se lee: cuando la condicin, entonces la accin
Cuando <algn nodo> inicia, termina <algn nodo>

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

34

Ejemplo
Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

35

Ejemplo

Incluir etiquetas <connectorBase>

Ahora DEFINIMOS un conector:

<causalConnector id=MiConector">
<simpleCondition role="onBegin" />
<simpleAction role="start" />

</causalConnector>
Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

36

Ejemplo

Para este ejercicio ahora USAMOS:

<link xconnector="MiConector">
<bind role="onBegin" component="video"/>
<bind role="start" component="info"/>

</link>

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

37

Ejemplo

Puede reutilizar definiciones de conectores.

El propio eclipse trae un archivo
<connectorBase>
<importBase documentURI="ConnectorBase.ncl"
alias="CONN"/>

</connectorBase>

Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

38

Ejemplo
<link xconnector="CONN#onKeySelectionStartNStopN">
<bind role="onSelection" component="info">
<bindParam name="keyCode" value="BLUE"/>
</bind>
<bind role="stop" component="info"/>
<bind role="start" component="lista"/>
<bind role="start" component="inferior"/>
</link>
Noviembre 2012/ Draft

Ivn Bernal, Ph.D.

39