Вы находитесь на странице: 1из 149

UNIVERSIDAD POLITCNICA DE MADRID

Escuela Tcnica Superior de Ingenieros de Telecomunicacin

Mster en Tecnologas y Sistemas de


Comunicaciones.

Trabajo Fin de Mster


ESTUDIO COMPARATIVO Y DE INTEGRACIN PARA LAS
PLATAFORMAS DE TELEVISIN INTERACTIVA
EUROPEA HBBTV Y LATINOAMERICANA GINGA

Autor: Diego Fernando Villamarn Zapata

Tutor: Jos Manuel Menndez.

Madrid - Espaa
2014
AGRADECIMIENTOS

Agradezco en primer lugar a Dios por darme sabidura y

humildad para luchar con perseverancia para alcanzar mis

objetivos, y por la bendicin de tener a mi familia.

A mis padres, por el amor, cario, comprensin, motivacin

y ejemplo que siempre me han brindado y el apoyo incondicional

en los momentos difciles que he pasado lejos de casa.

A Indy, a mis hermanos Mayra y Guillo, a toda mi familia y

mis amigos por su apoyo y motivacin.

A todos mis profesores por las enseanzas y la amistad

brindada, especialmente a Carlos Alberto Martin Edo y a mi

tutor Jos Manual Menndez.

Al gobierno de la Repblica del Ecuador encabezados por el

seor presidente economista Rafael Correa Delgado que gracias

a sus polticas de estado por medio de la Secretara Nacional de

Educacin Superior, Ciencia, Tecnologa e Innovacin me

brindaron todo el respaldo econmico para poder realizar mis

estudios de postgrado.

2
DEDICATORIA

Este trabajo fin de Mster va dedicado con mucho cario para

para mi familia y para Indy, en especial para mis padres porque

con xito han sabido guiarme y apoyarme en el transcurso de mi

formacin profesional, y con mucho afecto a mis amigos y

profesores que colaboraron en este proyecto.

3
Tabla de contenido

CAPTULO 1 (ESTADO DEL ARTE)

INTRODUCCIN ................................................................................................................ 7
TELEVISIN DIGITAL TERRESTRE (TDT) ............................................................................. 8
ESTNDARES DE TELEVISIN DIGITAL ........................................................................ 10
ISDB-Tb (Integrated Services Digital Broadcasting - Brazilian Terrestrial version) .... 12
PRINCIPALES CARACTERSTICAS DE ISDB-Tb .......................................................... 13
CARACTERSTICAS TCNICAS ISDB-Tb .................................................................... 14
IPTV (Internet Protocol Television) ................................................................................ 17
Servicios que ofrece IPTV ........................................................................................... 19
Modelo de la televisin IP .......................................................................................... 20
Arquitectura de IPTV .................................................................................................. 21
INTERACTIVIDAD EN TELEVISIN ................................................................................... 22
Avanzar hacia la televisin interactiva. ...................................................................... 23
Interactividad Local .................................................................................................... 24
Interactividad Completa ............................................................................................. 25
LA TELEVISIN HBRIDA .................................................................................................. 26

CAPTULO 2 (HbbTV y GINGA)

HBBTV (Hybrid Broadcast Broadband TV) ...................................................................... 31


NORMAS Y ESPECIFICACIN HBBTV ........................................................................... 35
FACTORES DE XITO DE HBBTV .................................................................................. 37
APLICACIONES CON HBBTV ........................................................................................ 39
Presente y Futuro de HbbTv ....................................................................................... 41
MIDDLEWARE GINGA ..................................................................................................... 44
Arquitectura del Middleware Ginga ........................................................................... 46
Ginga-NCL (Nested Context Language) ...................................................................... 51
Ginga-J (Java) .............................................................................................................. 51
PRESENTE Y FUTURO DE GINGA ................................................................................. 52
RELACIN DE HbbTV CON GINGA .................................................................................. 53

4
CAPTULO 3 (ESTUDIO DE INTEGRACIN)

ESTUDIO DE INTEGRACIN DE HbbTV EN GINGA .......................................................... 55


Cmo cargar una aplicacin HbbTV sobre GINGA...................................................... 55
Pruebas de aplicaciones HbbTV sobre GINGA............................................................ 56
Anlisis del mejor Navegador para GINGA ................................................................. 58
ANT Galio Browser .................................................................................................. 62
Berkelium ................................................................................................................ 65
Google Chrome ....................................................................................................... 66
Mozilla Firefox ........................................................................................................ 67
FireHbbTV plugging ................................................................................................ 68
Opera HbbTV Emulator .......................................................................................... 68
Chromium Embedded Framework ......................................................................... 70
Iceweasel ................................................................................................................ 72
Webkit Web Browser ............................................................................................. 72
Konqueror Web Browser ........................................................................................ 74
Resultados de la evaluacin de los navegadores ....................................................... 75
Integracin del Chromium Embedded Framework en Ginga..................................... 79

CAPTULO 4 (APLICACIN Y ESTUDIO COMPARATIVO)

CREACIN DE UNA APLICACIN INTERACTIVA .............................................................. 82


APLICACIN INTERACTIVA DESARROLLADA EN GINGA ............................................. 82
APLICACIN INTERACTIVA DESARROLLADA EN HbbTV.............................................. 88
ESTUDIO COMPARATIVO DE LAS DOS PLATAFORMAS................................................... 93
COMPARACIN CUALITATIVA .................................................................................... 95
Experiencia Cualitativa en Base al Usuario............................................................. 95
Experiencia Cualitativa en Base al Programador. ................................................... 97
COMPARACIN CUANTITATIVA ................................................................................. 99
Experiencia Cuantitativa en Base al Usuario. ......................................................... 99
Experiencia Cuantitativa en Base al Programador. .............................................. 103
VENTAJAS Y DESVENTAJAS ....................................................................................... 104

CAPTULO 5 (CONCLUSIONES Y RECOMENDACIONES)

CONCLUSIONES............................................................................................................. 106

5
RECOMENDACIONES .................................................................................................... 107
REFERENCIAS ................................................................................................................ 108
GLOSARIO ..................................................................................................................... 112
ANEXO 1........................................................................................................................ 115
ANEXO 2........................................................................................................................ 118
ANEXO 3........................................................................................................................ 124
ANEXO 4........................................................................................................................ 135

6
CAPTULO 1

INTRODUCCIN

En la actualidad existen varios sistemas que permiten generar interactividad en


video, ya sean estos por un medio de difusin tipo broadcast como la televisin
digital terrestre TDT con los diferentes estndares a nivel mundial o ya sean por
multicast con la televisin bajo un protocolo de internet IPTV, por eso ahora es
comn escuchar el concepto de televisin hbrida o televisin conectada, que no es
ms que un sistema que une lo mejor de la televisin tradicional ahora en formato
digital, con lo mejor del internet.

Dentro de las diferentes plataformas para generar y exhibir interactividad en la


televisin, existen unas abiertas y otras cerradas o propietarias, por ejemplo las
diferentes marcas de fabricantes de televisores o receptores de televisin han creado
y adaptado sistemas de interactividad propietarias, y le han denominado con
nomenclaturas como Samsung Smart TV, Sony Smart TV, Apple TV, Google TV,
Androide TV, entre otras.

Para solucionar un problema de compatibilidad y que todas estas tecnologas


puedan converger en un mismo estndar y facilitar su desarrollo en Europa se cre
HbbTV, (Hybrid Broadcast Broadband TV) que es una plataforma de emisin de
contenidos bajo demanda combinando los servicios de radiodifusin (broadcast) y
banda ancha (broadband). Se trata de una iniciativa de la industria para armonizar la
emisin de contenido interactivo por radiodifusin o banda ancha y la entrega de
entretenimiento gratuito para el consumidor final a travs de televisores inteligentes
o televisores conectados a set-top boxes. A travs de la adopcin de HbbTV, los
consumidores sern capaces de acceder a nuevos servicios de entretenimiento, que

7
pueden ser brindados por las estaciones de televisin, por servidores de internet o
por los fabricantes de televisiones o set top boxes, los servicios de entretenimiento
incluye, vdeo bajo demanda (VoD), publicidad interactiva, personalizacin,
votaciones, juegos y redes sociales, as como servicios relacionados con la
programacin, como el texto digital y las guas de programacin electrnica EPG [1].

En la TDT el panorama es similar existen varios sistemas de interactividad de


acuerdo a cada estndar algunos quizs ms desarrollados y explotados que otros,
uno de ellos que quizs no tuvo tanta difusin y que actualmente se lo ha dejado de
utilizar es MHP (Multimedia Home Platform) adoptado como sistema de
interactividad por el estndar de televisin digital europeo DVB (Digital Video
Broadcasting), por otro lado y quizs con mejor panorama para su desarrollo est el
sistema de interactividad de la norma japonesa brasilea ISDB-Tb (International
System Digital Broadcasting, Terrestrial, Brazilian version) denominado GINGA.

En el presente trabajo se muestra el estado del arte con antecedentes y


detalles sobre HbbTV y GINGA, se detalla sus caractersticas y se busca relacionar
estos sistemas analizando la posible coexistencia e integracin de HbbTV sobre
aplicaciones GINGA, para el estudio de integracin se muestra diferentes pruebas de
navegadores y se detalla el proceso que se debe seguir para lograr incluir el
navegador ideal dentro de GINGA para que logre mostrar aplicaciones HbbTV,
finalmente se realiza un estudio comparativo de los dos sistemas, para lo cual se
disea y desarrolla una aplicacin comn que funcionar sobre las dos plataformas y
se termina con conclusiones y recomendaciones.

TELEVISIN DIGITAL TERRESTRE (TDT)

La televisin digital terrestre TDT transmite su seal ntegramente con


tecnologa digital, lo que mejora la calidad tanto de audio como de vdeo y posibilita
incorporar servicios interactivos de televisin, permitiendo al usuario interactuar con
la programacin ya sea en equipos receptores fijos, porttiles o mviles, con la
caracterstica que el televidente ahora puede disfrutar de una seal mucho ms

8
robusta, sin ruidos, sin interferencias, ni doble imagen, perfeccionando de este modo
los contenidos que el espectador est visualizando.

Adems, la digitalizacin de la seal de televisin reduce el ancho de banda


necesario para la transmisin de cada canal, por lo que puede incrementarse el
nmero de canales de televisin o bien utilizar el ancho de banda sobrante para la
introduccin de nuevos servicios.
El desarrollo de la televisin digital terrestre posibilita el acceso de los sectores
de poblacin de escasos recursos econmicos, a redes y servicios de
telecomunicaciones.

Gestin del
Produccin Empaquetado Transmisin Recepcin Decodificacin
Multiplexor

Canal retorno
Interactividad

Fig. 1 Funcionamiento de la TDT

La figura 1 refleja el esquema de funcionamiento de la televisin digital


terrestre. Los contenidos audiovisuales se generan en la etapa de produccin y
postproduccin, a lo que sigue la etapa de empaquetado de los contenidos por parte
de los radiodifusores.

A continuacin se llevan a cabo las actividades de gestin del mltiple, donde


se combinan los programas y servicios que integran cada uno de los canales mltiples
reservados a las transmisiones de TDT [8]. Una vez integrado cada uno de los canales
mltiples, la seal es transmitida por el operador de red.

La recepcin de la seal de TDT se realiza en los hogares que dispongan de una


antena, individual o colectiva, adaptada a este tipo de transmisiones. Finalmente, la
seal recibida pasa por el equipo de descodificacin para que pueda ser interpretada
por un televisor convencional.

9
Adicionalmente, para lograr la prestacin de servicios interactivos, el sistema
de TDT puede dotarse de un canal de retorno que permita la comunicacin en
sentido ascendente (desde el usuario al radiodifusor). A modo de ejemplo, pueden
utilizarse como canal de retorno la red telefnica convencional o la red de telefona
mvil.

ESTNDARES DE TELEVISIN DIGITAL

En todo el mundo se han desarrollado varios estndares de televisin digital,


los cuales son bsicamente cinco (ver figura 2):
Estndar Americano, ATSC (Advanced Television Systems Committee).
Estndar Europeo, DVB (Digital Video Broadcasting).
Estndar Europeo, DVB-T2 (Digital Video Broadcasting, II version.).
Estndar Japons, ISDB-T (Integrated Services Digital Broadcasting).
Estndar Chino, DTMB (Digital Terrestrial / Television Multimedia
Broadcasting).

Fig. 2 Distribucin de los Estndares de TV Digital en el mundo [40].

10
La televisin digital terrestre est operando mundialmente con cinco
estndares. La plataforma usada en Norteamrica y algunos pases centroamericanos
es ATSC; ISDB-T en Japn y Filipinas. ISDB-Tb (variante del ISDB-T) en Brasil y la
mayora de los pases latinoamericanos: Per, Argentina, Chile, Venezuela, Ecuador,
Costa Rica, Paraguay, Bolivia, Uruguay, Nicaragua y Guatemala, con la excepcin de
Colombia, Guyana, Surinam, Panam, Honduras, El Salvador y Mxico. DTMB en la
Repblica Popular China, Hong Kong y Macao. DVB-T en los pases europeos,
Australia, partes de frica y pases de Amrica Latina: Colombia, y Panam, tambin
algunos pases que utilizan este estndar estn comenzando hacer pruebas y han
adoptado oficialmente DVB-T2, que es un estndar ms robusto que su anterior
versin. El resto del mundo an no se ha decidido [8].

A continuacin en la tabla 1 se presenta un cuadro comparativo de los


estndares de TV Digital, con sus diferentes variaciones y caractersticas.

ANCHO CODEC CODEC MULTIPLEXA


ADOPTADO
ESTANDAR DE DE DE MODULACIN CIN Y OBSERVACIONES
EN:
BANDA VIDEO AUDIO TRANSPORTE
Estndar
EE.UU, Radiodifusores
ATSC
Canad, terrestres: 8 VSB
A/52 Para conseguir un
Corea del
ATSC 6 MHz MPEG-2 MPEG-2 TS sistema ms robusto
sur, Mxico, Estaciones de TV por
(Dolby se emplea E-VST.
Honduras y cable: 16 VSB o 256
Digital
El Salvador QAM
AC-3)
En la
totalidad de Emplea redes SFN
COFDM, QPSK, 16
los pases MPEG-2 con el fin de aumentar
6, 7 u 8 QAM Y 64 QAM,
DVB-T europeos, MPEG-2 Y Dolby MPEG-2 TS la eficiencia del uso de
MHz Modulacin
adems de AC-3 los canales
jerrquica.
Panam, disponibles.
Colombia.
DVB-T2 incorpora la
ltima evolucin en
En la
Modulacin dinmica modulacin y resuelve
mayora de
1.7, 5, 6, H.264 variable para cada el error de proteccin
pases que
DVB-T2 7, 8, 10 (MPEG-4 HE-AAC clula COFDM. MPEG-2 TS para aumentar la
adoptaron
MHz Parte 10) QPSK, 16QAM, capacidad de la tasa
previamente
64QAM, 256QAM de bits mejorando la
DVB-T
robustez de la seal.
[37].

11
BST-COFDM con 13
Emplea modulacin
segmentos de
OFDM, interleaving y
frecuencia DQPSK,
Mpeg-2 cdigos de correccin
ISDB-T Japn 6 MHz MPEG-2 QPSK, 16 QAM Y 64 MPEG-2 TS
ACC de errores.
QAM
Soporta transmisiones
Transmisin
jerrquicas y one-seg
jerrquica.
Poseen un middleware
Brasil, Per,
innovador y
Venezuela,
desarrollado en Brasil
Chile,
H.264 (Ginga)
Argentina,
ISDB-Tb 6 MHz (MPEG-4 HE-AAC BST-COFDM MPEG-2 TS Emplea tecnologas de
Uruguay,
Parte 10) compresin de audio y
Bolivia, Costa
video ms avanzadas
Rica y
que las empleadas en
Ecuador
Japn.
Para mejorar su
TDS-OFDM eficiencia utiliza el
MPEG2,
China, Hong MPEG-4 cdigo pseudo-
6, 7 y 8 H.264
DTMB Kong y Part 3 4QAM, 4QAM-NR, MPEG-2 TS aleatorio de ruido,
MHz (MPEG-4
Macao. BSAC 16QAM, 32QAM, Emplea redes SFN y
Parte 10)
64QAM redes MFN.

Tabla 1 Cuadro comparativo de los estndares de TV Digital

ISDB-Tb (Integrated Services Digital Broadcasting - Brazilian


Terrestrial version)

A partir del 2000, el gobierno de Brasil a travs de las universidades del pas
desarroll un estudio sobre la televisin digital y las ventajas y retos que conlleva
realizar esta transicin. En noviembre del 2003 se cre el Sistema Brasilero de TV
Digital (SBTVD), actualmente denominado ISDB-Tb (Integrated Services Digital
Broadcasting - Brazilian Terrestrial version), que inici sus servicios comerciales y
pblicos el 2 de diciembre de 2007 en la ciudad de Sao Paulo - Brasil [4]. Se diferencia
bsicamente de la norma japonesa por el uso del cdec MPEG-4 (H.264) para
compresin de vdeo, en lugar de MPEG-2 (Moving Picture Experts Group) usado en
ISDB-T, compresin de audio con HE-AAC (High-Efficiency Advanced Audio Coding),
modulacin en BST-OFDM-TI, presentacin de 30 cuadros por segundo incluso en
dispositivos porttiles, a diferencia de los 15 cuadros por segundo para equipos
mviles en la norma ISDB-T e interaccin utilizando el middleware o software de
soporte de aplicaciones distribuidas o intermediario, desarrollado en Brasil y

12
denominado Ginga, compuesto por los mdulos Ginga-NCL, usado para exhibir
documentos en lenguaje NCL (Nested Context Language) y Ginga-J para aplicaciones
escritas en lenguaje Java. En el caso de la norma original ISDB-T, este software es el
BML (Broadcast Markup Language). Esto ocasiona que los receptores ISDB-T no sean
compatibles con las seales desarrolladas para la norma ISDB-Tb, aunque stos
ltimos si son compatibles con los de la versin original. Adems, es posible utilizar
SBTVD/ISDB-Tb en 6 Mhz, 7 MHz o 8 MHz si es requerido porque el sistema es
totalmente compatible.

En enero de 2009, la Agencia Brasileo-Japonesa, grupo de estudio para la


televisin digital, termin y public un documento de adhesin a la especificacin
ISDB-T con el brasileo SBTVD, resultando en una especificacin que ahora se llama
ISDB-T Internacional o ISDB-Tb [5].

El 29 de abril de 2009 ISDB-Tb fue certificado oficialmente por la Unin


Internacional de Telecomunicaciones (UIT) tanto el mdulo de Ginga-NCL como el
lenguaje NCL/Lua, desarrollado por la Universidad Catlica de Ro de Janeiro, como
primera recomendacin internacional para entornos multimedia interactivos para TV
Digital y IPTV-Recomendacin H.761 [3].

PRINCIPALES CARACTERSTICAS DE ISDB-Tb

Incorpora el servicio de transmisin mvil terrestre de audio/video digital


denominado 1seg (One-seg). "1seg" fue diseado para tener una recepcin
estable en los trenes de alta velocidad en Japn.
Transmisin de un canal con mltiple programacin ya sea en HD, SD y One-Seg en
los mismos 6Mhz de ancho de banda, mediante el multiplexado de canales. La
combinacin de estos servicios puede ser cambiada en cualquier momento.
Proporciona servicios interactivos con transmisin de datos, como juegos,
consultas bancarias, informacin adicional, publicidad interactiva, compras, etc.

13
Adems soporta acceso a Internet como canal de retorno. El acceso a Internet
tambin es provisto en telfonos mviles.
Suministra EPG (Electronic Program Guide) o gua electrnica de programas.
Provee SFN (Single Frequency Network), Red de frecuencia nica, permitiendo el
uso eficiente del espectro radioelctrico, porque para cubrir un rea grande de
cobertura se lo puede hacer con la misma frecuencia.
Puede recibirse con una simple antena interior.
Proporciona robustez a la interferencia multitrayecto, causante de los
denominados "fantasmas" de la televisin analgica y a la interferencia de canal
adyacente de la televisin anloga.
Proporciona mayor inmunidad en la banda UHF a las seales transitorias que
provienen de motores de vehculos y lneas de energa elctrica en ambientes
urbanos.
Permite la recepcin de HDTV en vehculos a velocidades por sobre los 100 km/h.

CARACTERSTICAS TCNICAS ISDB-Tb

a) Modulacin: BST-OFDM (Band Segmented Transmission - Orthogonal


Frequency Division Multiplexing). Transmisin en Banda Segmentada
Multiplexacin Ortogonal por Divisin de Frecuencia.

b) Banda de Frecuencias: VHF o UHF, de acuerdo con la estrategia de


implementacin en el pas y del espectro radioelctrico disponible.

c) Arquitectura de transmisin: Segmentada


Receptores fijos: 13 segmentos (todos os segmentos destinados a un
programa con resolucin Full HD). Otros arreglos son posibles de
acuerdo con la resolucin deseada e del nmero de programas
transmitidos en un canal.
Receptores mviles (en vehculos por ejemplo): La misma de los
receptores fijos.

14
Receptores porttiles (telfonos celulares por ejemplo): 1 segmento.

Gracias a esta arquitectura el estndar, permite la recepcin en mltiples


dispositivos como se muestra en la figura 3.

d) Tasa de actualizacin de imagen:


Servicio Fijo/Mvil: Japn, Brasil, Per, Argentina, Chile, Venezuela e
Ecuador: 30 fps y 60 fps (frames per second) fotogramas por segundo.
Servicio Porttil: Brasil, Per, Argentina, Chile e Venezuela: Mximo de
30 fps; Japn: Mximo de 15 fps [4].

Fig. 3 Recepcin en mltiples dispositivos.

e) Ancho de banda del Canal: 6 MHz (Pero tambin es posible utilizar el


estndar ISDB-T en 7 MHz o 8 MHz si fuese deseado por cualquier otro pas).

f) Sistema de Compresin de Audio:


ServicioFijo/Mvil:
Multi Canal 5.1: MPEG-4 AAC@L4 (Advanced Audio Coding, Level 4) o MPEG-4
HE-AAC v1@L4 (High Efficiency AAC, Version 1, Level 4)

15
Estreo: MPEG-4 AAC@L2 (AAC Level 2) o MPEG-4 HE-AAC v1@L2 (HE-AAC,
Version 1, Level 2)
Servicio Porttil: MPEG-4 HE-AAC v2@L2 (HE-AAC, Versin 2, Level 2)
para audio estreo.
Adicionalmente, la codificacin de audio debe seguir la norma ISO/IEC 14496-
3:2004 [15].

g) Sistema de Compresin de Vdeo:


Fijo/Mvil: MPEG-4 AVC HP@L4 (Advanced Video Coding, High Profile,
Level 4)
Porttil: MPEG-4 AVC BP@L1.3 (AVC, Base Profile, Level 1.3)

h) Resolucin de Vdeo, Tipo de Montaje de Cuadros ("Framing") y Relacin de


Aspecto ("Aspect Ratio"):
Fijo/Mvil:
SD 720x480i en 4:3 o 16:9
SD 720x480p en 4:3 o 16:9
SD 720x576i en 4:3 o 16:9
SD 720x576p en 4:3 o 16:9
HD 1280x720p en 16:9
Full HD 1920x1080i en 16:9
Donde: i = Montaje de cuadros entrelazado.
p = Montaje de cuadros progresivo [15].
Porttil:
SQVGA (160x120 o 160x90)
QVGA (320x240 o 320x180)
CIF (352x288)
Todos esos formatos utilizando relaciones de aspecto 4:3 o 16:9.

i) Sistema de Multiplexacin: MPEG-2 system (ISO/IEC 13818-1 2000) [15].

16
j) Menor potencia media en el transmisor de TV digital en comparacin a la TV
analgica. Para cubrir la misma rea de cobertura se necesita 4 veces menos potencia
en el transmisor digital, como se muestra en la figura 4

Fig. 4 Comparacin del rea de cobertura de los sistemas anlogos y digital.


k) Procesos de Correccin de Errores: Time Interleaving (Entrelazador de
smbolos en Tiempo) y Frequence Interleaving (Entrelazador de smbolos en
frecuencia)

l) Middleware para TV Interactiva:


Mdulo Declarativo: Ginga-NCL e Imperativo LUA
Mdulo Procesual: Ginga-J

m) Difusin de Alerta: Permite al Gobierno enviar alertas sobre desastres


naturales (terremoto, tsunami, etc.) a cada dispositivo en el rea en que la seal
ISDB-T/SBTVD/ISDB-T est presente. La seal de alerta usa cierto espacio en el rea
de datos de uno de los segmentos de la seal transmitido, automticamente todos
los receptores y presenta la informacin de alerta en la pantalla del receptor [3].

IPTV (Internet Protocol Television)

A partir del ao 2005 algunos operadores de telecomunicaciones empezaron a


dar el servicio de Televisin sobre redes de telecomunicaciones que hacen uso del
protocolo de Internet, protocolo IP, en lugar de emplear los medios tradicionales
como TV terrestre (analgica o digital), satlite o cable.

17
IPTV es un sistema utilizado para entregar los servicios que la televisin digital
ofrece a los consumidores que son suscriptores registrados para recibir este sistema.
La entrega de TV digital es posible usando el protocolo de Internet sobre una
conexin de banda ancha, por lo general se emplea un administrador de red en lugar
del Internet pblico, con el objetivo de garantizar una buena calidad de los servicios.

Aunque IPTV recoja el trmino protocolo en su nombre, en realidad el concepto


abarca ms que eso. Esta tecnologa transformar la televisin actual en una
experiencia totalmente personalizada, por supuesto sobre conexiones de banda
ancha y con ancho de banda reservado para garantizar la calidad de servicio (QoS). El
cambio consiste en que los canales de televisin ya no transmitirn la misma
programacin para todos los usuarios, los cuales pasarn de una actitud totalmente
pasiva a otra interactiva. De esta manera, el proveedor de televisin no transmitir
continuamente toda su programacin esperando que algn usuario se conecte al
sistema, sino que, con IPTV, ser el usuario el que solicite qu contenidos quiere ver y
en qu momento. Esta nueva modalidad exigir mayor ancho de banda disponible en
el sistema para ofrecer, de manera sencilla y eficiente, servicios de televisin digital
de siguiente generacin sobre la red existente de banda ancha basada en IP. El
sistema, prcticamente, podr individualizar a cada usuario y hacer mediciones de
audiencia casi perfectas.

Entre los posibles servicios de IPTV se encuentran la oferta ilimitada de canales


de televisin digital y msica, programacin de pago por evento, vdeo bajo
demanda, grabacin personalizada de vdeo (PVR), publicidad interactiva y servicios
de informacin, entre otros. A menudo se suministra el servicio de IPTV junto con el
servicio de conexin a Internet, proporcionado por un operador de banda ancha
sobre la misma infraestructura pero con un ancho de banda reservado a tal
propsito. Por ello, se requiere un mnimo de al menos unos 4 Mbps para poder
recibir la seal de TV comprimida segn el formato MPEG-2 o MPEG-4, algo que se
consigue fcilmente con los estndares de ADSL, como son ADSL2 y ADSL2+, que
pueden llegar hasta 20 Mbps en bajada, sobre el bucle de abonado, si la distancia a la
central telefnica que provee el servicio no es muy elevada, actualmente con el

18
despliegue de las redes de fibra ptica que fcilmente llegan a los 100 Mbps, se
podra dar servicios de IPTV inclusive con Ultra Alta Definicin en formato (UHDTV
4K) [11].
La capacidad estimada para servicios de IPTV se asume entre 1 y 2 Mbps por
cada canal de definicin estndar (SDTV); 8 - 12 Mbps por cada canal de alta
definicin (HDTV) y ms o menos los 20 Mbps para (UHDTV). Para dos canales
simultneos el ancho de banda bruto resultante es de 2- 4 Mbps para un servicio
bsico o 8-12 Mbps si se incluye un canal HDTV, en ambos casos utilizando tecnologa
MPEG-4 para la codificacin /compresin de la seal de vdeo. A esta capacidad
habra que aadirle el ancho de banda contratado para la conexin de Internet, que
por bajo que sea implica la necesidad de manejar tasas de acceso de muy alta
capacidad [11].

Servicios que ofrece IPTV

La televisin por Internet o IPTV es el resultado de la convergencia de Internet y


Televisin, lo cual trae consigo nuevas opciones de entretenimiento y servicios para
los usuarios, as como tambin la generacin de mayores ingresos para los
operadores que brindan este servicio. IPTV puede ofrecer difusin en directo, al igual
que la actual televisin analgica o la TDT, o descarga de programacin bajo
demanda (VoD), tambin llamado pay per view, y se puede ver tanto en un PC
como en un televisor convencional que adems cuente con un decodificador (set top-
box), el mismo que se encarga de descomprimir y decodificar la seal de vdeo para
ser presentada al usuario. Los usuarios a su vez tienen la opcin de seleccionar el
contenido que desean ver y descargarlo y si lo almacenan, por ejemplo, en un disco
duro, lo pueden visualizar tantas veces como deseen. Una estrategia de los
proveedores es que al ofrecer un conjunto de servicios como son: vdeo, voz y datos
(Triple Play), se incrementan las ganancias por usuario, mejora su satisfaccin y
mantiene la fidelidad del mismo. Entre los posibles servicios que brinda IPTV se
encuentran: canales de televisin digital y msica ilimitados, PVR, programacin
pagada, Caller ID en pantalla, verdadero video-on-demand (VOD), e-mail, VOD por
suscripcin (SVOD), Internet, juegos, pago de facturas e impuestos, servicios de

19
informacin, compra de productos, publicidad interactiva, e-Learning, guas
telefnicas , entre otros.

Entre las ventajas de este servicio digital, es que la imagen y el sonido tienen
calidad DVD o superior y se puede acceder a un sinnmero de contenidos digitales.
Adems ofrece interactividad, lo que permite seleccionar lo que deseamos ver y
manejar la programacin como si la estuvisemos viendo grabada, es decir, con las
opciones de pausar, retroceder, paso rpido, etc. [11].

Modelo de la televisin IP

El modelo de Televisin Digital IP o tambin conocido como IPTV utiliza como


medio de transmisin, conexiones de banda ancha sobre el protocolo IP. Un ejemplo
de una plataforma de IPTV se muestra en la figura 5.

Fig. 5 Plataforma de IPTV.

IPTV se ha desarrollado basndose en el video-streaming. Este sistema consiste


en que la reproduccin de los videos o pelculas no requieren una descarga previa

20
por parte del usuario, sino que el servidor entrega los datos de forma continua,
sincronizada y en tiempo real (al mismo tiempo que se enva, se est visualizando el
video con su audio).
Entre las ventajas de este modelo tenemos que la red de distribucin ya est
desplegada y aprovecha al mximo el ancho de banda para conseguir velocidades de
varios Mbps en canal descendente. La desventaja de este sistema es que el
despliegue de este modelo depender de la disponibilidad de equipos en centrales
[11].

Arquitectura de IPTV

IPTV es un sistema completo mediante el cual la seal de televisin es


entregada a los usuarios sobre el protocolo IP (Internet Protocol). Este sistema est
formado por los servidores de contenido, encargados de codificar la seal (en MPEG-
2 o MPEG-4 /H.264), y fragmentarla encapsulando los paquetes para ofrecerlos en la
red IP core, mediante multicast o unicast. Esta red core o ncleo agrupa los flujos
de video codificado en diferentes canales. El trfico de IPTV puede ser protegido de
otros trficos de datos, para garantizar un nivel adecuado de QoS. El ltimo enlace o
enlace de ltima milla, que llega hasta el hogar, encargado de distribuir los datos,
voz y video, puede ser realizado empleando distintas tecnologas fsicas (FTTx, xDSL,
WLAN, WIMAX, etc.). Finalmente, los Set-Top-Box, u otros dispositivos multimedia se
encargan de decodificar la informacin, y presentarla al usuario. Siendo altamente
impulsado por las grandes compaas de telecomunicaciones, el servicio de IPTV est
basado especialmente en la utilizacin de infraestructura ya existente, en lugar de
construir una nueva red para la distribucin de televisin como acontece con algunas
otras tecnologas. Con esta alternativa se logra minimizar los costos asociados a la
nueva tecnologa [11].

21
Fig. 6 Arquitectura genrica de IPTV

Los operadores de telecomunicaciones poseen redes de elevada dimensin y


con una alta tasa de penetracin a nivel de pas, lo que hace particularmente
indicado para la oferta de servicio de televisin, haciendo posible llegar a un elevado
nmero de personas. Sin embargo, y al contrario de las redes de distribucin de
televisin que fueron pensadas de raz para este efecto, las redes de cobre de las
empresas de Telecomunicaciones tienen en su origen en el servicio telefnico, como
requisitos de ancho de banda inferiores pero que hasta la actualidad tienen un gran
impacto en las redes de acceso [11].

INTERACTIVIDAD EN TELEVISIN

Interactividad significa la capacidad que tiene un dispositivo para interactuar o


permitir la interaccin con el usuario. Se debe observar que la existencia de
interactividad est estrictamente relacionada con la existencia de un medio
electrnico, que acta como intermediario de este proceso.

La interactividad en la TV posibilita al telespectador actuar junto al programa


de TV que est mirando, enviando pedidos de informacin adicional a la estacin de

22
televisin, mediante el control remoto, esta informacin puede ser imgenes
adicionales al programa original, audio, texto, grficos, etc.

De esta manera el televidente pasa a ser un usuario que puede acceder a


servicios como consultas y transferencias bancarias, Tele-Salud, Tele-Educacin,
compras, votacin en programas, video bajo demanda y variada informacin
adicional.

La interactividad depende de recursos de hardware, la TV o decodificador (Set


Top Box), y de los aplicativos que corran en estos equipos (software).

El enlace entre el hardware y el software es hecho a travs de un componente


denominado middleware, en el estndar ISDB-Tb este middleware es GINGA y fue
desarrollado por la Universidad Catlica de Rio de Janeiro [3].

El middleware GINGA es un programa que tiene la funcin de recibir los


aplicativos transmitidos por las emisoras de televisin (por el aire), instalar esos
aplicativos en la TV o en el Set Top Box y dejarlos listos para su uso, recibir las
acciones del televidente mediante el control remoto y ejecutarlo con xito.

Pero existen otros sistemas que nos permiten interactuar con la televisin por
ejemplo las plataformas de las Smart TV, y el estndar HbbTV.

Avanzar hacia la televisin interactiva.

Las opiniones de las personas, la percepcin e incluso la definicin de la


televisin interactiva han cambiado notablemente en la ltima dcada. Antes
simplemente era el estado del tiempo y otros servicios de informacin entregada
principalmente como texto con un par de fotos, ahora se convirti en servicios de
video personalizados prestados a travs de banda ancha, que permite a los usuarios
ponerse al da con los programas preferidos, ver la ltima pelcula, acceder a redes
sociales o inclusive poder realizar compras u operaciones bancarias desde la TV.

23
Un servicio de televisin "interactiva" va mucho ms all de ofrecer acceso a
Internet en el televisor, para que tenga xito total el servicio tiene que ser impulsado
por los canales y programas de televisin. Actualmente pesar de la creciente gama de
opciones disponibles, la gran mayora de vdeo observaba en todo el mundo (incluso
en los hogares de banda ancha conectado) sigue siendo de televisin lineal. Hay
muchas razones para esto, pero sobre todo es que este mtodo sigue siendo la forma
ms eficiente para entregar el vdeo a la casa. Y todava atrae a grandes audiencias.

Lo que la televisin interactiva ofrece es la oportunidad para que los


espectadores se muevan entre un pblico masivo y tengan una experiencia
personalizada sin tener que dejar la comodidad de su sala de estar.

A modo de ejemplo, en el Reino Unido la BBC anunci recientemente que 11


millones de personas presionan el botn rojo para acceder a sus servicios interactivos
a travs de la televisin digital terrestre, satlite y cable cada semana en 2009. Esto
demuestra ampliamente la acogida de la televisin interactiva [24].

Interactividad Local

Dentro del estndar ISDB-Tb se define como aplicaciones de interactividad local


aquellas transmitidas por Broadcast y descargadas en el Set-top-Box, como se
muestra en la figura 7. Este tipo de interactividad es la que es accesible a todos los
televidentes o usuarios porque no necesita un canal de retorno para darle utilidad.
En este nivel de interactividad se puede cargar un sin nmero de aplicativos, como
juegos, informativos, publicitarios, EPG, etc., de manera constante y el usuario
escoge cuando acceder a estas informaciones.

24
Fig. 7 Interactividad Local

Este modelo de interactividad es muy ventajoso y accesible a todas las personas


ya que no es necesario que el usuario posea una conexin a internet, para tener
acceso a la informacin. En este caso la estacin de TV es la que est conectada a la
red obteniendo informaciones actualizadas que luego emitir a los televidentes.

Con este modelo en pases latinoamericanos donde no todos las personas


tienen acceso a Internet ya sea porque no existe la infraestructura de una red de
telecomunicaciones accesible o porque no poseen los medios econmicos para
adquirirla, se puede llegar y brindar servicios de aplicaciones que permitan la
inclusin social.

Interactividad Completa

Se llama interactividad completa porque requiere canal de retorno (Conexin


de Internet) para dar utilidad a sus aplicativos, como se muestra en la figura 8. En
este nivel de interactividad, la estacin de televisin transmite aplicaciones ms
personalizadas, el usuario puede acceder a sitios de compras, redes sociales, cuentas
bancarias, encuestas, video bajo demanda, etc.

El medio de acceso del canal de retorno es indiferente, se puede tener


conexin a internet por ADSL, Cable, FFTH, Wimax, GSM, Wifi, etc.

25
Y en este aspecto la interactividad para los dispositivos mviles tiene una
ventaja ya que tienen el canal de retorno solucionado.

Fig. 8. Interactividad Completa

LA TELEVISIN HBRIDA

Actualmente en esta era de internet se est viviendo la transformacin global


del servicio de televisin, en donde la televisin hbrida representa la revolucin en la
transmisin de programas junto a una gran flexibilidad en los contenidos emitidos,
siendo posible mezclar un gran nmero de canales de video, audio y datos.

La televisin hbrida o tambin conocida como televisin conectada combina


las ventajas de la televisin radiodifundida estndar, con todo el contenido en
Internet ya sean enlaces a textos, fotografas, audio o vdeo ya que se pueden
sincronizar con los espectculos de difusin actuales. Se podra decir de manera
simplificada que la televisin hibrida une lo mejor de la TDT con lo mejor de la
televisin por internet (TDT + IPTV), aparte de todas las ventajas que se tiene al tener
a una televisin conectada con toda la informacin disponible en la red. La
informacin puede ser transmitida slo en la pantalla de visualizacin, mientras que
los espectadores pueden seguir viendo el programa de televisin. Por ejemplo,
mientras ve un programa deportivo, un espectador puede informarse de los
resultados provisionales de otros partidos, tambin se podra permitir a los

26
espectadores participar mediante votaciones, trivias, juegos, etc. Todo mediante el
mando a distancia.

Dentro de la televisin hibrida existen varias plataformas, una de ellas y en la


que nos enfocaremos en este trabajo son las conocidas como HbbTv, en Espaa
tambin denominada como TDT Hbrida, pero existe tambin las conocidas SmartTV
("TV inteligente"), con las cuales el televisor se puede conectar a Internet, pero eso
no asegura que sean compatibles con HbbTV. La mayor parte de las "Smart TV"
todava necesitan aplicaciones de propsito especial, denominada widgets, cada uno
desarrollado especficamente para una marca en particular de los receptores.

La Smart TV es la apuesta de los fabricantes que aprovechando la vieja etiqueta


de "caja tonta", han lanzado el trmino "televisin inteligente" como reclamo. Las
Smart TV permiten, adems de ver los canales convencionales, otro tipo de cosas,
como conectarnos a Internet o interactuar en redes sociales.

No existe un nico estndar de Smart TV y cada fabricante tiene el suyo.


Samsung, LG, Panasonic, Sony, todos cuentan con su propio sistema y diferentes
aplicaciones. Para poder gozar de las virtudes de la Smart TV tenemos 2 opciones:

Comprar un televisor nuevo que incluya este servicio.


Comprar un dispositivo alternativo que, al conectarlo a la televisin, nos
permita aprovechar las ventajas de la Smart TV. Existen decodificadores en el
mercado y tambin es posible mediante algunos reproductores Blu-ray.

Las Smart TV son estndares cerrados donde cada compaa controla los vdeos
y aplicaciones a diferencia de la HbbTv que es una solucin estandarizada para que
los diferentes canales de televisin puedan aadir servicios y aplicaciones, son
sistemas diferentes pero no incompatibles: en una misma televisin podemos tener
Smart TV y HbbTV.

27
Pese a que estos conceptos puedan parecer complejos, usar estas tecnologas
es tan sencillo como apretar un botn y navegar por mens e interfaces que nos
mostrarn los contenidos a nuestra disposicin. Saber si un televisor tiene Smart TV
es sencillo, el propio fabricante se preocupa de aclararlo y de proporcionar cada vez
ms contenidos [22].

Aunque hace ya varios aos que se viene hablando de la televisin conectada a


Internet y ya en 2004 la TV hbrida formaba parte del roadmap de la industria; de
hecho desde 2008 gran parte de los fabricantes set-top boxes ofrecan en Europa
esta posibilidad junto con la recepcin de la TDT, es recin en los ltimos aos que se
est desplegando con fuerza en pases como Alemania, Espaa, Francia, Austria,
Polonia, Suiza, Holanda, Republica Checa, entre otros, en algunos pases le han
denominado la TDT Hbrida.

El mercado de IPTV aunque se encuentra en crecimiento, sigue siendo inferior


al 10% del mercado total de TV. Sin embargo, los operadores de televisin terrestre,
por cable y por satlite contemplan la opcin de la televisin interactiva, apostando
por el modelo hbrido. El mercado de televisin de pago por cualquiera de las
plataformas antes mencionadas es enorme con cientos de millones de usuarios, por
lo que el mercado potencial para la TV hbrida es amplio y es por ello que est en la
agenda de todos los proveedores de telecomunicaciones y suministradores de TV,
siendo actualmente el estndar HbbTV el que acapara toda la atencin de la industria
y, de hecho, ya existen algunas experiencias de despliegue exitoso de la TV hbrida
utilizando este estndar, como es el caso de Verizon, FiOS y Orange TV, contando
cada uno con ms de cuatro millones de clientes, En Alemania, desde su lanzamiento
en 2009, la televisin hbrida bajo el estndar HbbTV est muy desarrollada, siendo
numerosos los operadores que la ofrecen (ARD, ZDF, RTL, ProSieben, etc.) y los
usuarios pueden acceder a decenas de aplicaciones; segn un estudio llevado a cabo
por la consultora Mcke Sturm Company, en 2014 habr ya en este pas 23 millones
de televisores adaptados a este nuevo formato. Otros pases, como Reino Unido e
Italia, tambin participan de estas experiencias. En Espaa a finales del 2013 se
oficializ el lanzamiento de la aplicacin HbbTv denominada Botn Rojo de la Red

28
de Televisin Espaola RTVE, adems otras empresas como Mediaset Espaa y
Telefnica tambin estn prontos de implantar aplicaciones con HbbTv, apostando
por esta nueva forma de ver la televisin y acceder a contenidos varios a travs de un
televisor o descodificador, conectados a Internet permitiendo a los espectadores
acceder a los varios contenidos de cada cadena de televisin o servidores de internet,
incluso a contenido en alta definicin si el ancho de banda disponible es elevado.

El proyecto de Mediaset Espaa se lleva a cabo de la mano de Telefnica.


Quienes han suscrito una alianza estratgica para iniciar las pruebas piloto. El acceso
es fcil. La pantalla del televisor muestra una barra lateral en la que aparecen las
aplicaciones interactivas. A travs de ellas el usuario puede enlazar con Internet o
con las redes sociales para obtener datos adicionales sobre el programa que est
viendo.
La iniciativa que ahora echa a andar est abierta a todos los agentes del sector
audiovisual, segn sus impulsores. En esta primera fase se trata de sentar las bases
de "compatibilidad" entre la televisin y la banda ancha. El siguiente paso ser
mejorar la "navegabilidad" en Internet. Adems, Mediaset se propone crear una
televisin a la carta en Movistar Videoclub. Utilizar para ello la plataforma OTT
(Over the top) de Telefnica, que permite distribuir contenidos bajo demanda incluso
con calidad propia de la alta definicin [29].

La televisin hbrida permite varios modelos de negocio ya que la tecnologa es


flexible, por ejemplo en la feria SIMO Network 2010, Vodafone present el que es
ahora su nuevo servicio de televisin hbrida, que brinda la posibilidad de ver en el
televisor tanto seales TDT (abierta y pago) como streaming y vdeo bajo demanda
(en HD, e incluso 3D) as como todo el contenido multimedia (fotos, msica, vdeo)
que est disponible en otros dispositivos de la casa, desde telfonos mviles a PC, a
travs del estndar DLNA. Vodafone Internet TV incorpora la funcin de televisin a
la carta que permite disfrutar de programas ya emitidos. Este nuevo servicio
permitir al usuario recibir canales de DVB-T as como una variedad de servicios IPTV
entre los que se incluir vdeo bajo demanda. Tambin facilitar el acceso a Internet

29
en la TV, incluyendo otros servicios a la carta y a los sitios de streaming. La caja
incluye conectividad DLNA, Wi-Fi y Ethernet.

El funcionamiento de la TV hbrida es muy sencillo de entender, aunque


tcnicamente tiene su complejidad. En este estndar el radiodifusor elabora su
oferta a la carta e inserta una direccin de Internet en su seal de TV para acceder
a sus contenidos, que el televisor recibe a travs de la antena y la muestra al
telespectador. Haciendo uso del mando a distancia de su televisor, si el usuario pulsa
el botn inmediatamente, se le muestra en pantalla un men con la oferta de
contenidos a la carta; el usuario selecciona el contenido que quiere ver y lo
reproduce en su TV. Estos contenidos se obtienen a travs de la conexin de banda
ancha e infraestructura del operador de telecomunicaciones. Cuando quiera salir del
modo TV a la carta el usuario pulsa otro botn del mando a distancia y, en ese
momento, se vuelve al canal de televisin que se estaba viendo.

30
CAPTULO 2

HBBTV (Hybrid Broadcast Broadband TV)

La televisin hibrida HbbTV (Hybrid Broadcast Broadband TV) o televisin


conectada es un nuevo estndar de la industria que proporciona una plataforma de
tecnologa abierta y neutral que combina servicios suministrados a travs de
radiodifusin (broadcast) con los servicios de acceso a internet de banda ancha
(broadband). Un diagrama de su funcionamiento se muestra en la figura 9.

Fig. 9 Diagrama de HbbTV


Se trata de una iniciativa de la industria y de promocin para la televisin digital
con el fin de armonizar la emisin IPTV, banda ancha y la entrega de entretenimiento
para el consumidor final a travs de televisores inteligentes conectados a set-top

31
boxes [1]. El consorcio HbbTV, que reagrupa a la radiodifusin digital y las empresas
del sector de Internet, establece un estndar para la entrega de la TV abierta y TV de
banda ancha para el hogar, a travs de una nica interfaz de usuario, la creacin de
una plataforma abierta como una alternativa a las tecnologas de propiedad. Los
productos y servicios que utilizan el estndar HbbTV pueden funcionar sobre
diferentes tecnologas de radiodifusin, como por satlite, por cable o las redes
terrestres.

HbbTV es impulsado por la Unin Europea de Radiodifusores (UER) con el fin de


que en el futuro todos los dispositivos, tanto decodificadores como televisores,
puedan conectarse de forma interactiva a Internet. El proyecto HbbTV nace en
febrero de 2009 derivado de la asociacin de los proyectos H4TV francs y el
proyecto alemn German HTML Profille. La primera vez que se mostr HbbTV fue en
la televisin francesa para el evento deportivo de Roland Garros de ese ao [2].

Los miembros fundadores del consorcio HbbTV junto con un nutrido grupo de
seguidores han desarrollado conjuntamente la especificacin HbbTV la versin 1.1.1
de esta especificacin fue aprobada por el ETSI como ETSI TS 102 796, en junio de
2010. Los miembros fundadores del consorcio estn formados por radiodifusores,
fabricantes de dispositivos de TV y empresas de la comunidad europea, lo que
significa que hay un objetivo comn de crear servicios y que los radiodifusores
puedan ofrecerlos mientras se cumple con las funciones relacionado con el DRM
(Digital Resource Managment) para vdeo bajo demanda.

En mayo de 2011 el consorcio HbbTV qued abierto a la entrada de nuevos


miembros y busca ampliar la participacin a fin de fomentar la introduccin en el
mercado y la evolucin continua [26]. Desde entonces, el nmero de estos no ha
dejado de crecer y actualmente asciende a ms de 60. Entre ellos podemos
mencionar:
- Organismos de normalizacin: EBU (Unin Europea de Radiodifusin), IRT,
DTG, Fraunhofer IIS.

32
- Organismos de radiodifusin: France Tlvisions, TF1, Canal +, NRJ 12, RTL
Group, Astra, Eutelsat, Abertis Telecom, TDF, ITV, BSkyB.
- Editores de middleware para dispositivos de electrnica de consumo: ANT
Software Ltd, iPlus Technologies, OpenTV, Opera Software, Access, Espial, HTTV,
Icareus, Irdeto, NDS, Kudelski, Viaccess.
- Fabricantes de electrnica de consumo y de componentes de dispositivos:
Philips, Samsung, Sony, LG, Loewe, Sharp, STMicroelectronics, Humax, Haier, Kaoin
Media, TechniSat, TechnoTrend, iPlus Technologies.
- Laboratorios de prueba para dispositivos de electrnica de consumo: Digital TV
Labs.
- Los miembros del consorcio HbbTV del grupo de direccin son: Abertis, Astra,
Ant Software Ltd, Digital TV Labs, European Broadcasting Union, France Tlvisions,
IRT, OpenTV, Opera, Philips, RTL, Samsung, Sony, TF1.

Actualmente la recepcin de televisin digital y, en particular la radiodifusin,


de alta definicin en el hogar est bastante extendida en toda Europa [28]. La
difusin de TV por Internet y la entrega de contenido multimedia a travs de Internet
tambin se estn convirtiendo en un servicio muy comn, aunque dicho contenido
sea visto, a menudo, en un ordenador o conectando una pantalla de TV desde dicho
ordenador a travs de un reproductor multimedia conectado a la red domstica.
HbbTV tiene la intencin de ampliar el alcance de los contenidos multimedia
directamente a la televisin, de modo que el espectador pueda acceder a dichos
contenidos con mayor comodidad.

Tambin los servicios HbbTV se abren paso en Europa especialmente en pases


como Francia, Alemania, Espaa, Suiza y Austria teniendo como impulsores los
operadores pblicos y privados de estos pases y ofreciendo servicios de VOD (Video
On Demand), Teletexto enriquecido, informacin en directo, etc [2]. En la siguiente
imagen (ver figura 10) se muestra la implementacin de HbbTV en Europa.

33
Fig. 10 Despliegue de HbbTV en Europa
Aunque no en todos los pases que han adoptado existe el mismo despliegue en
la reunin del foro HbbTV llevado a cabo en Holanda en Marzo del 2014, se detalla
un cuadro (ver tabla 2) con detalle sobre el desarrollo en cada uno de los pases, cabe
mencionar que tambin existen noticias que se estara evaluando el estndar en
pases fuera de la Unin Europea como China, Estados Unidos y Australia. Tambin el
Reino Unido estara en planes de adoptar HBBTV 2.0.

Pas HbbTV Maduro HbbTV HbbTV en


desarrollado crecimiento
Alemania X
Francia X
Espaa X
Austria X
Polonia X
Blgica X
Dinamarca X
Finlandia X
Hungra X
Holanda X
Republica Checa X
Suiza X

Tabla 2 Cuadro de desarrollo de HbbTV en pases Europeos

34
NORMAS Y ESPECIFICACIN HBBTV

La especificacin HbbTV se basa en los estndares existentes y las tecnologas


web, incluyendo OIPF (Open IPTV Forum), CEA, DVB y W3C [21]. Como muestra la
figura 11. En este sentido, se adapta a las tecnologas disponibles en lugar de
implementar un nuevo desarrollo tcnico. Utilizando la tecnologa estndar de
Internet permite el desarrollo rpido de aplicaciones. La norma europea facilita la
combinacin de los servicios de radiodifusin y banda ancha y establece las
caractersticas y las funcionalidades requeridas para la entrega de los mismos; define
unos requisitos mnimos, simplificando as la aplicacin en los dispositivos y dejando
espacio para la diferenciacin, lo que limita la inversin requerida por los fabricantes
para construir dispositivos compatibles.

Fig. 11 Bloques que componen la especificacin HbbTV.

En resumen se tiene los siguientes 4 bloques:


OIPF
APIs de Javascript para entornos de televisin.
Formatos de audio y video.

35
Modifica el CE-HTML, lenguaje para la creacin de pginas de interfaz de
usuario en dispositivos como los televisores.
CEA
APIs de Javascript para servicios bajo demanda.
Conjunto de especificaciones y formatos de imagen de W3C.
Soporte para el control remoto de redes UPnP e Internet.
DVB
Transporte de sealizacin y aplicaciones va DVB.
W3C
Recomendaciones para World Wide Web.
XHTML.
Hojas de estilo CSS 2.1, CSS-TV.
ECMA Script.
Peticiones HTTP y HTTPS con XMLHTTP Request.

Por una parte, CE-HTML define las funciones bsicas del navegador: CE-HTML
se basa en los estndares del W3C Web comunes y especifica un perfil de HTML para
dispositivos de CE (electrnica de consumo). Utiliza XHTML 1.0, DOM 2, CSS TV perfil
1.0, as como Java, y est optimizado para renderizar HTML / JavaScript en pginas
web en los dispositivos de CE, en concreto en las pantallas de televisin. CE-HTML
tambin contiene elementos tales como la definicin de cdigos de las teclas del
mando a distancia.

Por otra parte, Open IPTV Forum perfil del navegador: Esta especificacin ha
sido desarrollada para los sistemas basados en DVB-IPTV, pero el API (JavaScript) que
proporciona tambin se puede aplicar a cualquier hbrido de los sistemas DVB. Estas
API transmiten las funciones de combinar la imagen de TV con pginas HTML, para
sintonizar la televisin DVB o servicios de radio, para agregar eventos a la lista del
temporizador, y para leer los metadatos DVB y otra informacin relacionada con
DVB.

36
Finalmente, la sealizacin y el transporte DVB: La sealizacin de las
aplicaciones es compatible con el estndar DVB. Estas aplicaciones se pueden
ejecutar en el contexto de un televisor o un servicio de radio en un mltiplex DVB. De
una manera muy similar a la norma MHP, esto se hace a travs de la tabla de
sealizacin (AIT) en el correspondiente servicio DVB y se indica en su tabla de mapa
de Programa (PMT). La norma DSM-CC define carruseles de objetos para ofrecer
aplicaciones de difusin. Los carruseles de objetos tambin proporcionan una forma
para que el receptor se sincronice con los puntos especficos en los medios de
comunicacin mediante el uso de "eventos de flujo".

Las especificaciones describen cmo las aplicaciones interactivas se sealan en


el flujo de datos. La especificacin HbbTV no especifica el sistema operativo o
plataforma de cliente en s mismo en el dispositivo receptor. La ltima especificacin
aprobada por el consorcio HbbTV es la versin 1.5 de la especificacin de HbbTV que
proporciona soporte a streaming adaptativo en el protocolo HTTP basndose en la
reciente especificacin MPEG-DASH, mejorando la calidad del vdeo recibido en
conexiones saturadas o de baja velocidad. Adems, permite a los proveedores
proteger sus contenidos con tecnologas DRM basadas en la especificacin de MPEG
CENC. Por otra parte, existen significativas mejoras en la gua electrnica de
programacin, ya que se permite a los operadores introducir informacin para los
siguientes siete das. Otra de las posibilidades que se mejoran es la distribucin de
aplicaciones manejables directamente por los receptores, otorgando as una
experiencia totalmente integrada al usuario. Segn el propio consorcio HbbTV, la
publicacin de la versin 1.5 es la respuesta a una fuerte demanda del mercado por
nuevas posibilidades a travs de la televisin conectada [20].

FACTORES DE XITO DE HBBTV

Al xito de HbbTV contribuirn fundamentalmente tres factores: la creciente


penetracin en el mercado de aparatos con el sistema HbbTV integrado, la calidad de
los contenidos, y la facilidad de manejo de este formato. Al ser un estndar de cdigo
abierto, tiene muchas posibilidades de triunfar sobre otros formatos de carcter

37
cerrado y privado como Google TV y Apple TV, y es que del HbbTV se benefician
todos, desde los fabricantes de televisores a las cadenas de televisin, pasando por
los portales online y los proveedores de comercio electrnico.

Mediante el nuevo estndar HbbTV las emisoras pueden generar, con la


tradicional seal de televisin, un hipervnculo que pulsando un solo botn lleva al
usuario directamente a la correspondiente oferta de contenidos online. Adems de
los servicios tradicionales de difusin, el estndar incorpora servicios de vdeo bajo
demanda (VOD), juegos o aplicaciones interactivas como el llamado botn rojo,
que permite la interactividad con el mando a distancia para ampliar informacin
sobre un tema determinado, votaciones u otras participaciones. HbbTV incorpora un
sistema operativo que permite la compatibilidad con aparatos externos, de modo
que no es necesario ningn aparato adicional para lograr la conexin a Internet y la
interactividad prometida.

Los servicios HbbTV se activan, pulsando el botn rojo del mando a distancia,
las aplicaciones se las puede utilizar con las teclas de navegacin y las teclas de
colores del mando.

El fenmeno masivo de comentar programas por Twitter, Facebook, LinkedIn y


otras redes sociales son fenmenos muy recientes que aprovecharn sin duda la
tecnologa de HbbTV. El volcado de vdeos en YouTube, o de fotos en Flickr, as como
la tendencia hacia el cloud computing donde cada vez hay ms y ms contenidos, son
elementos que estn nutriendo la televisin que consumimos y si a ello le sumamos
la facilidad de sistemas con Android o iniciativas como Google y Apple TV, de uso
muy sencillo, podemos asegurar que poco a poco va convergiendo la TV e Internet de
la misma manera que hizo la telefona mvil e Internet. Gracias a que el estndar
HbbTV permite acceder a contenido adicional y relevante en Internet sobre los
contenidos que estamos viendo en la televisin en un momento determinado, ahora
se posibilita la generacin de nuevos ingresos para los operadores siempre que el
modelo de negocio sea el adecuado.

38
Pero si bien mucha gente expresa su escepticismo acerca de la nueva solucin
hbrida para la televisin interactiva, argumentando que Internet por s sola ya ofrece
ms funcionalidad que las promesas de futuro de HbbTV, adems de que la rapidez
de evolucin de Internet deja obsoleto cualquier desarrollo con pocos meses de vida,
lo que si es cierto es que para que pueda tener xito, es necesario al menos, como
sucede en este caso, la estrecha colaboracin entre operadores y radiodifusores, ya
que la inversin necesaria y el riesgo asociado son muy elevados para ser acometidos
por un nico agente, as que habr que esperar algn tiempo para ver cmo se
desarrolla y la respuesta de los usuarios a un nuevo canal de comunicacin
interactiva que combina dos de los ya existentes.

APLICACIONES CON HBBTV

La integracin de nuevos servicios, interactividad y movilidad permiten la


mejora de la experiencia del usuario enriqueciendo la experiencia televisiva. Se
incluye un mayor volumen de informacin, EPG, participacin en juegos, compras u
otras aplicaciones interactivas y el llamado Botn Rojo o Red Button, que permite
la aparicin de aplicaciones autoarrancables. HbbTV incorpora un sistema operativo
que permite la compatibilidad con aparatos externos, de modo que no es necesario
ningn aparato extra para lograr la conexin a Internet.

Dentro de las aplicaciones se distingue dos categoras: Por una parte estn las
que solo se difunden a travs del canal de banda ancha y no se pueden declarar en la
secuencia de difusin y por otra parte, las que si se declaran en la sealizacin DVB.
Entre las primeras encontramos aplicaciones para redes sociales, juegos, VoD, etc.
mientras que entre las segundas podemos citar la publicidad interactiva o votaciones.
Para empezar, una aplicacin puede arrancar por orden del usuario final, a travs del
mando a distancia. Tambin puede ser por la sealizacin en el servicio de difusin o
bien por otra aplicacin que ya se est ejecutando. Para finalizar, una aplicacin
puede detenerse por orden del propio usuario, por orden del sistema bajo
condiciones de error o mediante la llamada del mtodo que destruye la aplicacin,
entre otros [26].

39
Las aplicaciones HbbTV y sus servicios en general son probados por entidades
como Digital TV Labs, se trata de un laboratorio que ofrece una aplicacin HbbTV
para realizar tests destinada a los desarrolladores, ofreciendo pruebas que verifican
la compatibilidad entre una amplia gama de receptores HbbTV en el mercado. Dichas
pruebas pretenden adems asegurar la QoE (Quality of Experience) ofrecida al
usuario.

Un sin nmero de aplicaciones ya se encuentran disponibles para quienes


dispongan de un receptor HbbTv, por ejemplo en Espaa, el pionero en lazar su
aplicacin del botn rojo fue Radio Televisin Espaola ofreciendo a sus usuarios
servicios de televisin a la carta el primero es "RTVE.es A la Carta" donde se dispone
de toda su programacin, pudiendo acceder a la misma cuando guste el televidente y
Clan a la Carta, este ltimo es una aplicacin de vdeos a la carta para el pblico
infantil del canal Clan TVE donde se pueden reproducir las series favoritas desde el
servicio de la TDT Hbrida. Los vdeos se pueden reproducir con el audio en espaol o
en ingls.

Siguiendo el ejemplo de la RTVE, otros canales de televisin como TV3 de


Catalua, Telemadrid, Canal Sur, Televisin de Galicia, Radio Televisin Canaria,
Televisin de las Islas Baleares, entre otras, estn comenzando a ofrecer aplicaciones
de televisin a la carta y aplicaciones en lnea de contenidos de TV. Goltelevisin
aunque sobre una plataforma de pago, tambin ofrece servicios de HbbTv con
resmenes de los partidos de primera y segunda divisin. Otra plataforma de pago
con aplicaciones interesantes con titulares, entretenimiento, noticias y portadas de
peridicos es OrbyTV [30].

Es importante mencionar que si se desea adquirir un receptor con HbbTv,


previamente hay que verificar que el mismo sea un dispositivo certificado, para el
mercado espaol Abertis Telecom, operador de infraestructuras de
telecomunicaciones del grupo Abertis, ha sido reconocido por los radiodifusores
como Entidad Certificadora para los fabricantes de receptores. Como Entidad

40
Certificadora, realiza las pruebas necesarias y comprueba que se cumplan las
especificaciones tcnicas adecuadas por parte de los fabricantes que participan en el
desarrollo de la TDT Hbrida. El espectador podr encontrar una completa gama de
receptores Certificados con el logo TDT Hbrida, que indica que dicho aparato ofrece
la garanta tecnolgica necesaria para ofrecer el servicio, existe un portal donde se
encuentra la lista de estos dispositivos, las marcas homologadas son: Panasonic,
Philips, Sony, LG, Samsung y Televes [31].

Con HbbTV tambin se puede incluir una gua electrnica de programas (EPG)
mucho ms dinmica y amigable que el estndar EPG anterior, esta nueva aplicacin
del EPG incluye fotografas y demostraciones en video.

Tambin contiene la opcin de acceder a una base de datos completa de los


vdeos publicados en la web de la estacin de Televisin, estas aplicaciones incluyen
consejos y videos ms vistos de la televisin, tambin se pueden buscar videos o
programas por fecha o por orden alfabtico, con varias opciones adicionales como la
de por ejemplo marcar los programas favoritos. Los vdeos pueden reproducirse en
una ventana o pantalla completa. La ventaja de HbbTV es que se ejecuta en segundo
plano de la radiodifusin televisiva. Por lo tanto, podemos suponer que en el futuro
crecern aplicaciones que enriquezcan el programa estndar de televisin con
contenido adicional [36].

Presente y Futuro de HbbTv

HbbTV sigue su avance en Europa, donde se ha situado como el estndar de


facto. Alemania, Francia y Espaa, estn liderando el proceso por su aceptacin e
implantacin. La venta de receptores hbridos en Alemania es imparable, con 4
millones de receptores en el mercado hasta la fecha. Se calcula que el 70% de las
ventas ya incorporan HbbTV y ser un elemento de serie en 2015. En Francia los
receptores compatibles HbbTV se sitan en unos 1,5 millones, de los cuales
aproximadamente 400 mil tienen esta opcin activa. En 2015 habr unos 10 millones
de receptores conectados, de los cuales al menos el 20% dispondr de HbbTV

41
instalado. En Espaa se estima que se terminar el ao con unos 2 millones de TV
conectados a la red, y que habr alrededor de 1 milln de televisores hbridos. De
momento no se dispone de cifras sobre el nmero de receptores con HbbTV en el
mercado.

Estos tres pases son los que encabezan el despliegue de la TV conectada en


Europa junto con Italia, que sigue el estndar GEM/MHP, y donde se calcula que
alrededor de 1 milln de televisores tienen la opcin de conectarse a la red. Muy de
cerca en este progreso se encuentra la zona nrdica, que tambin ha oficializado la
adopcin de HbbTV como estndar. El Reino Unido sigue decantndose por
plataformas verticales, como Youview o Freesat, siguiendo muy de cerca los trabajos
en HbbTV, y ya han incorporado el estndar a dos de sus especificaciones. Segn el
representante britnico en el congreso, se espera que su pas tenga una participacin
mucho ms activa en la evolucin del estndar hacia su versin 2.0 [32].

Los fabricantes de TV consideran que la TDT Hbrida aporta grandes ventajas.


Juan Carlos Cordo, director de Marketing de Negocio, Marketing y Comunicacin de
Philips (TPVision), precis que "no va a ser un fiasco, porque aporta grandes
ventajas". Uno de ellos, segn l, es que "puedes disponer de contenidos a la carta.
Por su parte, Samuel Fabra, Project Manager de Sony, quiso dejar claro que "una cosa
muy distinta son los Smart TV y otra la TV hbrida". Para l, darlo a conocer es
fundamental, y por ese motivo alaba el famoso "botn rojo" de TVE, "no slo no va
en contra de los fabricantes sino que es un valor aadido al producto". Y es que
hasta la llegada de este botn casi nadie conoca la HbbTV. Ayudas como stas son
las que motivan a estos fabricantes para intentar seguir apostando por esta nueva
forma de ver televisin, y no ya slo con aparatos que lleven activada la HbbTV sino
tambin, como seal Francisco Jos Prez Fernndez, Director Comercial Nacional
de Televs, "con un concepto de adaptacin del parque de televisores que no son
compatibles con la televisin hbrida, como cuando lanzamos al mercado, con la
llegada de la televisin digital terrestre, un receptor adaptador de las televisiones de
tubo que no llevaban TDT incorporada". Eso s, Francisco Prez subray que no slo
sirve con el esfuerzo que pueden hacer los fabricantes, "para que la gente demande

42
este tipo de televisin es importante que las cadenas pongan contenidos atractivos, y
no slo TVE, sino todas en general". Lo mejor de todo para ellos, como indic Samuel
Fabra, es que "aunque no se renovarn tan rpido como los smartphone, los
televisores actuales no van a tardar 20 aos, como ocurra antes, para ser sustituidos,
por lo que entre todos hay que dar un impulso a la televisin hbrida".

En Espaa habr ms de 100 millones de pantallas en 2018, sumando


televisores, telfonos mviles y tabletas, segn datos de la consultora GfK
presentados el 12 de noviembre de 2013, en la IV Jornada Anual de Aedeti
(Asociacin Espaola de empresas de Televisin Interactiva). En 2013 se
comercializarn unos 14 millones de pantallas, con 2,3 millones de televisores de ms
de 32 pulgadas (que contrastan con los seis millones que se vendieron en 2010,
coincidiendo con el apagn analgico'). En cuanto a televisiones inteligentes, las
cifras de GfK hablan de que el 33% de las ventas de este ao sern productos Smart
TV, y que ya estarn presentes en ms del 10% de los hogares. En Espaa habr siete
millones de equipos al finalizar el ao con capacidad de ser conectados a internet, y
un tercio de los hogares contar con la posibilidad de conectarse.

La entrada en funcionamiento del servicio de televisin conectada de TVE,


denominado Botn rojo'. Segn inform el director de Desarrollo de Negocio de la
cadena pblica, Francisco Asensi, despus del el lanzamiento del botn rojo en la
televisin espaola en los primeros meses ya se superan los 600.000 usuarios al mes.
Lo mejor de este servicio, dijo, es que "el tipo de consumo en fundamentalmente
audiovisual y supera la hora de duracin, dato que es espectacular llevado a trminos
de Internet". Asegur que "hay programas, como 'Los conciertos de Radio 3', que van
a horas intempestivas, que la gente consume ya ms en la web que en la propia
televisin". Francisco Asensi tiene claro, sin embargo, que a pesar del buen
funcionamiento de ese botn rojo, "ahora toca pasar la voz al consumidor, que vea
qu le ofrecemos y todas las alternativas que puede tener para poder comprar un
dispositivo de este tipo". Por ese motivo es por el que reconoce que lanzaron la idea
del botn rojo, para "dar a conocer las posibilidades que ofrece la TV hbrida", que
dice est permitiendo "que el espectador se d cuenta de que con ella se le est

43
ofreciendo algo nuevo". Lo de menos es la tecnologa que va vinculada a este
servicio, "hay que hacer que sta sea invisible, porque la gente tiene que saber que
no debe conocer cosas tecnolgicas para poder acceder al servicio".

Amadeu Gass Gimeno, director de Explotacin e Ingeniera de TV3, afirma que


"la televisin hbrida es sobre todo televisin, no Internet". Aunque resalta que la
"televisin conectada es sencilla y muy buena para los usuarios, si las cadenas no
tienen ms servicios que ofrecerles, al final stos se irn a los smartphones'. De
momento, las pruebas que est llevando a cabo estn deparando buenos resultados
de audiencias, "y sin haberlo publicitado". Por todo ello pide a los fabricantes que
sigan apostando por receptores de TV hbrida, "porque, si no, estarn cometiendo un
error estratgico".

Para el director General de Atresmedia Digital, Jos Manuel Gonzlez Pacheco,


ms que una carrera de Frmula 1, lo de la televisin hbrida es "un maratn, en el
que no hay que ir muy rpido, porque tiene que haber un desarrollo de mercado, que
los usuarios se acostumbren a ello, algo que todava no se ha logrado, un parque de
receptores y un desarrollo de mercado". Eso s, pese a todo es optimista, "hay signos
de que ahora se puede apostar por todo ello de una manera ms activa". Tambin lo
dice Ignacio Arrola, director de Marketing de Mediapro, que celebra que "un usuario
de Gol TV, sin necesidad de ser cliente, ya puede acceder a contenidos, con lo que
tenemos la posibilidad de ensear nuestro producto", aunque que indica que el
principal problema que ve en el tema de la TV Hbrida es "que lo confundamos con
internet". En este sentido, el Director de Negocio de TVE aclara que "en Espaa el
televisor se compra para ver televisin" y de ah la necesidad de "crear contenidos" y
no ir muy deprisa [32].

MIDDLEWARE GINGA

Ginga es el nombre del middleware de la Recomendacin ITU-T para servicios


de IPTV y del Sistema Nipo-Brasileo de TV Digital Terrestre (ISDB-TB). El nombre fue

44
escogido en reconocimiento a la cultura, arte y continua lucha por libertad e igualdad
del pueblo brasileo [41].

Ginga es una capa de software intermedio (middleware), entre el


hardware/Sistema Operativo y las aplicaciones, que ofrece una serie de facilidades
para el desarrollo de contenidos y aplicaciones para TV Digital, permitiendo la
posibilidad de poder presentar los contenidos en distintos receptores
independientemente de la plataforma de hardware del fabricante y el tipo de
receptor (TV, celular, PDAs, etc.).

Middleware es un neologismo creado para designar capas de software que no


constituyen directamente aplicaciones, sino que facilitan el uso de ambientes ricos
en tecnologa de informacin. La capa de middleware concentra servicios como
identificacin, autenticacin, autorizacin, directorios, certificados digitales y otras
herramientas de seguridad. En el contexto de la TV Digital, el middleware viene a ser
un software que controla sus principales facilidades (grado de programacin, mens
de opciones), inclusive la posibilidad de ejecutar aplicaciones, dando soporte a la
interactividad.

El middleware abierto Ginga esta subdividido en dos subsistemas principales


entrelazados, que permiten el desenvolvimiento de aplicaciones siguiendo dos
paradigmas de programacin diferentes. Dependiendo de las funcionalidades
requeridas en cada aplicacin, un paradigma ser ms adecuado que el otro. Estos
dos subsistemas son llamados Ginga-J para aplicaciones de procedimiento Java y
Ginga-NCL para aplicaciones declarativas NCL.

En comparacin con los sistemas de middleware concebidos para los otros


estndares de TV Digital, algunas de las funcionalidades de Ginga son innovadoras,
desarrolladas especficamente para la realidad brasilea. En Brasil, el uso de la TV
como medio de inclusin digital es prioridad para el gobierno, desde este punto de
vista, el desenvolvimiento de aplicaciones interactivas para TV Digital ocupa un lugar

45
destacado, lo que no ocurre en otros pases donde ya tienen implantado un Sistema
de TV Digital hace mucho ms tiempo [14].

Arquitectura del Middleware Ginga

El middleware Ginga a diferencia de los sistemas hipermedia convencionales,


en donde prevalece el modelo de servicio tipo pull, donde es responsabilidad del
programa intrprete solicitar un nuevo documento y buscar el contenido de los
objetos, como ocurre por ejemplo con los navegadores web, en TV un modelo de
servicio es de tipo push. En este caso, la emisora proporciona para la difusin flujos
de audio y vdeo multiplexados con otros datos, algunos objetos multimedia pueden
ser recibidos bajo demanda, ms un servicio de tipo push es predominante.

Adems de invertir un paradigma de servicio, los usuarios pueden comenzar a


mirar un programa ya iniciado, ms aun todava, los usuarios pueden querer cambiar
de canal, y por consiguiente salir y entrar a programas ya en proceso. Otro aspecto
desafiante es la edicin de documentos durante su exhibicin, en los programas en
vivo y en programas modificados por retransmisoras, esta posibilidad es bastante
interesante.
En la figura 12 se muestra la arquitectura de la TV digital, representada en
capas de todas las tecnologas ya existentes, una de estas capas es la del Middleware
[14].

46
Fig. 12 Arquitectura de la TV Digital, con las tecnologas utilizadas en cada capa

En la figura 13 se presentan la arquitectura en capas de referencia del Sistema


TV digital terrestre ISDB-Tb, incluido su middleware Ginga.

Fig. 13 Normas de referencia del Sistema de TV digital terrestre ISDB-Tb

La idea central de la arquitectura en capas, est en que cada una ofrezca


servicios para la capa superior y use los servicios ofrecidos por la inferior. De esta
manera, las aplicaciones que se ejecutan en TV Digital interactiva usen la capa del
middleware, que intermedia toda la comunicacin entre las aplicaciones y el resto de
los servicios ofrecidos por las capas inferiores.

47
La finalidad de la capa del middleware o capa intermedia es ofrecer un servicio
estandarizado para las aplicaciones (capa superior), escondiendo las peculiaridades y
heterogeneidades de las capas inferiores (tecnologas de compresin, de transporte y
de modulacin). El uso del middleware facilita la portabilidad de las aplicaciones,
permitiendo que sean transportadas para cualquier receptor digital (o set top box)
que soporte el middleware adoptado. Esa portabilidad es primordial en sistemas de
TV digital, pues es muy complicado considerar como premisa que todos los
receptores digitales sean exactamente iguales.

El universo de las aplicaciones Ginga pueden ser particionadas en un conjunto


de aplicaciones declarativas y un conjunto de aplicaciones de procedimiento. Los
lenguajes declarativos son ms intuitivos es decir de ms alto nivel y es por esto que
resultan ms fciles de utilizar, normalmente no exigen de un programador experto.
Sin embargo, los lenguajes declarativos tienden a ser definidos con un enfoque
especfico. Cuando el enfoque de la aplicacin no se relaciona con el del lenguaje, el
uso de un lenguaje de procedimiento es apenas ventajoso, ms se hace necesario. Un
uso del lenguaje de procedimiento usualmente requiere un muy buen nivel de
programacin. Una aplicacin hbrida es aquella cuyo conjunto de entidades posee
tanto contenidos de tipo declarativos como de procedimiento. Una aplicacin,
entretanto, no necesariamente debe ser puramente declarativa o de procedimiento;
sin temor a equivocacin se puede afirmar que en los sistemas de TV digital, ambos
tipos de aplicaciones coexisten, siendo pertinente que los dispositivos receptores
integren soporte para ambos tipos en su middleware. Esto ocurre en todos los
middlewares de todos los sistemas incluido el middleware Ginga.

En particular, las aplicaciones declarativas frecuentemente hacen usos de


scripts, cuyo contenido es de naturaleza de procedimiento, adems una aplicacin
declarativa puede hacer referencia a un cdigo JavaTV Xlet incorporado. De igual
manera, una aplicacin de procedimiento puede hacer referencia a una aplicacin
declarativa, conteniendo, por ejemplo, contenido grfico, o puede construir o iniciar
las aplicaciones con contenidos declarativos. Por lo tanto, ambos tipos de

48
aplicaciones Ginga pueden utilizar las facilidades de los ambientes de aplicacin
declarativo y de procedimiento.

Una arquitectura de implementacin de referencia del middleware Ginga


puede ser divida en tres grandes mdulos: Ginga-CC (Common Core), el ambiente de
presentacin Ginga-NCL (declarativo) y el ambiente de ejecucin Ginga-J (de
procedimiento); esta arquitectura de muestra en la figura 14.

Figura 14. Arquitectura Ginga

Ginga-NCL es el subsistema lgico del sistema Ginga que procesa documentos


NCL. Un componente clave de Ginga-NCL es el motor decodificador de contenidos
declarativos (Programa intrprete NCL llamado Maestro). Otro de los mdulos
importante es el agente de usuario del modelo XHTML, el cual incluye un stylesheet
(CSS), el interpretador ECMAScript, y la mquina Lua, la que es responsable de
interpretar los Scripts Lua. La especificacin de este subsistema se base en las normas
ABNT NBR 15606-2 [16] y ABNT NBR 15606-5 [49].

Ginga-J es el subsistema lgico del sistema Ginga que procesa el contenido de


los objetos Xlet. Un componente clave del ambiente de aplicaciones de
procedimiento es el motor de ejecucin de contenidos de procedimiento, compuesta
pos la mquina virtual de Java. La especificacin de este subsistema se basa en la
norma ABNT NBR 15606-4 [50].

49
Ginga-NCL y Ginga-J son construidos sobre los servicios ofrecidos por el modulo
del ncleo comn de Ginga (Ginga-Common Core), cuya composicin se muestra en
la figura 15. [14].

Fig. 15. Ginga Common Core

Los decodificadores de contenido comn sirven tanto para las necesidades de


decodificacin de las aplicaciones declarativas como de las de procedimiento, as
tambin para la presentacin de contenidos comunes como PNG, JPEG, MPEG y otros
formatos. El ncleo comn de Ginga est compuesto por decodificadores de
contenido comn y procedimientos para obtener contenidos, transportados en un
flujo de MPEG-2 o a travs del canal de retorno. El ncleo comn de Ginga debe
tambin soportar el modelo de despliegue conceptual especificado por el estndar
brasileo de TV Digital [14].

La arquitectura y facilidades de Ginga son proyectadas a ser aplicadas a


sistemas de radiodifusin y receptores terrestres (medio aire). Sin embargo, la misma
arquitectura y facilidades pueden ser aplicadas a otros sistemas de transporte (como
satlite, TV por cable, y sistemas de IPTV).

En general, Ginga no discrimina cualquier aplicacin nativa que tambin puede


escoger compartir el plano de grficos. Esto incluye pero no se limita a: subttulos
para sordos, sistema de mensajes de acceso condicional, mens del receptor, y gua
de programas nativos. Las aplicaciones nativas pueden tomar precedencia sobre
aplicaciones Ginga. Los subttulos para sordo y los mensajes de emergencia deben
tomar precedencia sobre el sistema Ginga. Algunas aplicaciones nativas, como el

50
encabezamiento cerrado, presentan un caso especial donde la aplicacin nativa
puede estar activa por largos periodos concurrentemente con aplicaciones Ginga
[14].

Ginga-NCL (Nested Context Language)

El Ginga-NCL fue desarrollado por la Pontificia Universidad Catlica de Rio de


Janeiro PUC-Rio, provee una infraestructura de presentacin para aplicaciones
interactivas de tipo declarativas escritas en el lenguaje NCL (Nested Context
Languaje). NCL es una aplicacin de XML (eXtensible Markup Language) con
facilidades para los aspectos de interactividad, sincronismo, espacio-temporal entre
objetos de media, adaptabilidad, soporte a mltiplos dispositivos y soporte a la
produccin de programas interactivos en vivo no-lineares. El NCL es un lenguaje del
tipo basado en la estructura que define una separacin bien demarcada entre el
contenido y la estructura de un aplicativo, permitiendo definir objetos de media
estructurados y relacionados tanto en tiempo y espacio.

Para las tareas que requieren la programacin algortmica, NCL cuenta con LUA
como su lenguaje de scripting. Para facilitar el desarrollo de aplicaciones Ginga-NCL,
PUC-Rio tambin cre la herramienta Composer, un entorno de creacin dirigido a la
creacin de programas de NCL para la televisin digital interactiva. En esta
herramienta, las abstracciones se definen en los distintos tipos de puntos de vista
que le permiten simular un tipo especfico de la edicin (estructural, temporal,
disposicin y textual). Estas visiones funcionan de forma sincrnica con el fin de
ofrecer un entorno de creacin integrado [41].

Ginga-J (Java)

El Ginga-J fue desarrollado por la Universidad Federal de Paraiba UFPB, para


proveer una infraestructura de ejecucin de aplicaciones basadas en lenguaje Java,
llamadas Xlet, con facilidades y detalles para el ambiente de Tv digital, proporcionada
por la especificacin Globally Executable MHP (GEM), que fueron sustituidos ms

51
tarde con la especificacin abierta Java DTV, desarrollada por Sun Microsystems,
ahora Oracle Corporation [41].

Ginga-J es un subsistema lgico del Sistema Ginga que procesa aplicaciones


interactivas de tipo procedimental (Xlets Java). Un componente clave del ambiente
de aplicaciones procedurales es el mecanismo de ejecucin de contenido
procedimental, que tiene como base la mquina virtual de Java. Ginga-J est basado
en tres grupos de APIs llamados Verde, Amarillo y Azul [14].

PRESENTE Y FUTURO DE GINGA

Desde su concepcin, Ginga tuvo en consideracin la necesidad de la inclusin


social/digital y la obligacin de compartir el conocimiento de forma libre. Ginga es
una tecnologa que le da al ciudadano todos los medios para que obtenga acceso a la
informacin, educacin a distancia y servicios sociales a travs de su TV, el medio de
comunicacin omnipresente en los pases latinoamericanos. Ginga tiene en
consideracin la importancia de la televisin, como un medio complementario para
la inclusin social/digital. Ginga suporta las llamadas "aplicaciones de inclusin", tales
como T-Government, T-Health y T-Leraning. Con el desarrollo de Ginga, Brasil se
convirti en el primer pas en ofrecer un conjunto de soluciones en software libre
para la TV digital.

Ginga es una especificacin abierta, de fcil aprendizaje y libre de royalties,


permitiendo que todos produzcan contenido interactivo, lo que dar un nuevo
impulso a las TVs comunitarias y a la produccin de contenido por las grandes
emisoras. Extensiones de Ginga, sin embargo, se rigen por sus propias directivas. El
entorno declarativo de Ginga, llamado Ginga-NCL tiene tambin una implementacin
de referencia en cdigo abierto, desarrollada por el Laboratorio TeleMdia de la PUC-
Rio. Adoptando la licencia GPLv2, el laboratorio TeleMdia garantiza el acceso
permanente a toda la evolucin del cdigo publicado en la Comunidad Ginga, sean
cuales fueren sus aplicaciones y autores de aqu en adelante [41].

52
Los pases latinoamericanos tras la adopcin del estndar ISDB-Tb, ya han
comenzado sus planes para hacer la transicin hacia la televisin digital y junto con
ello GINGA actualmente est teniendo un gran desarrollo, principalmente su versin
de GINGA NCL, por ser la que no necesita pagar royalties. En algunos pases como
Brasil y Argentina ya han declarado a GINGA NCL como obligatorio para los equipos
receptores que ingresan a sus mercados, con esto han conseguido dar un impulso
fuerte para el xito de GINGA. En estos pases que actualmente son los pioneros en
aplicaciones interactivas ya existe desarrollo de aplicativos GINGA que son
transmitidos junto con la programacin habitual en los canales de la TDT.

Ginga tiene un gran potencial pues permite realizar un sin nmero de


aplicaciones interactivas que llegaran al televidente de forma totalmente gratuita,
con aplicaciones que permiten interactuar con la programacin y obtener
informacin sin la necesidad de estar conectados a internet, como es el caso de las
aplicaciones locales que no necesitan canal de retorno. Esto viendo desde el punto de
vista de la inclusin social a la era digital en pases en va de desarrollo como son los
latinoamericanos que an no tienen extendidas infraestructuras de redes de
telecomunicaciones en todo sus territorios y que poseen un nivel de adquisicin bajo,
prueba de ello, el ndice de penetracin del internet es bastante bajo a comparacin
de Norte Amrica o Europa, Ginga vendra a ser una solucin muy eficiente.

RELACIN DE HbbTV CON GINGA

HbbTV no es la nica tecnologa existente para la televisin interactiva. Un


competidor suyo es GINGA, aunque los dos actualmente funcionan sobre plataformas
diferentes, por lo que tal vez no se lo pueda denominar como competidor, el primero
sobre la televisin digital con el estndar europeo DVB, y el segundo sobre el
estndar de televisin digital terrestre ISDB-Tb e IPTV. Ambos tienen muchas cosas
en comn como por ejemplo sus aplicaciones se basan en un lenguaje XML, HbbTV
utiliza CE-HTML y GINGA aunque tiene dos versiones, principalmente se basa en NCL.
Ambas son tecnologas abiertas y que estn causando el inters por los fabricantes
de receptores, por los desarrolladores de aplicaciones y por los televidentes que

53
hallan interesante el poder interactuar con sus televisiones sin tener que pagar por
ello.

HbbTV es ms reciente pero sin embargo ha ganado terreno en muchos pases.


La principal razn es que HbbTV tiene aceptacin en un mercado muy amplio como
es el europeo, con mayor nmero de aplicaciones y nuevos servicios hbridos. El xito
de HbbTV se puede atribuir a tres factores: su flexibilidad, las bases sobre normas
existentes y el apoyo de grupos de la industria, en particular de la Unin Europea de
Radiodifusin.

Visto el gran desarrollo y la acogida que est teniendo HbbTV en Europa, se


encuentra muy interesante complementar estas dos tecnologas y realizar las
pruebas pertinentes para que sobre una aplicacin desarrollada en GINGA se pueda
rodar o ejecutar aplicaciones HbbTV.

Con la integracin de aplicaciones HbbTV dentro de GINGA se los podra ver


como socios o complementos, para ampliar la posibilidad de tener ms y mejores
plataformas de interactividad en el mercado mundial de aplicaciones. Con esto los
desarrolladores de aplicaciones GINGA podran integrar de manera sencilla
aplicaciones HbbTV dentro de las suyas, obviamente si las mejoras planteadas para
su interoperabilidad tambin son implementadas por los fabricantes de los
receptores que incluyen GINGA.

54
CAPTULO 3

ESTUDIO DE INTEGRACIN DE HbbTV EN GINGA

En este captulo se describe el estudio realizado para lograr la integracin de las


dos plataformas de interactividad. Se muestran las pruebas realizadas y los
resultados obtenidos y se encamina el proceso que se debe seguir para alcanzar este
objetivo.

Cmo cargar una aplicacin HbbTV sobre GINGA.

Anteriormente se describi la arquitectura de GINGA y en la grfica 1.14 se


pudo observar que posee un navegador XHTML, el cual incluye un stylesheet (CSS), el
interpretador ECMAScript, y la mquina Lua, la que es responsable de interpretar los
Scripts Lua. Visto de este modo GINGA si tendra la capacidad de reproducir
aplicaciones HbbTV que ocupan cdigo CE-HTML.

Lo primero que se hace es crear un documento de Ginga NCL mediante la


utilizacin del IDE Eclipse SDK que debe tener previamente instalado el plugging de
NCL, para mayor detalle ver la informacin y descargar las fuentes en [74]; luego en
su cdigo incluir un objeto de tipo hipermedia declarativo que permita cargar un
documento o un archivo HTML. Para tener una visin general de cmo funciona el
incluir objetos de tipo hipermedia es necesario revisar la documentacin de Nested
Context Language 3.0 Part 11 Declarative Hypermedia Objects in NCL: Nesting
Objects with NCL code in NCL Documents [53].

55
A continuacin se muestra el cdigo donde se observa que se incluye el enlace
o URL de una aplicacin NCL, para el ejemplo se utiliz la aplicacin HbbTV de la
Televisin Espaola.

<!-- Generated by NCL Eclipse -->

<ncl id="myNCLDocID" xmlns="http://www.ncl.org.br/NCL3.0/EDTVProfile">


<body id="myBodyID">
<port id="p0" component="m0"/>
<media id="m0" src="http://www.rtve.es/xl/hbbtv/">
<property name="width" value="100%"/>
<property name="height" value="100%"/>
<property name="focusIndex" value="1"/>
</media>
</body>
</ncl>

Como se puede observar en el cdigo NCL tiene una estructura muy parecida a
HTML pues como ya se mencion est basada en lenguaje de marcas XML. Dentro del
cuerpo se instancia una puerta de entrada (port) que inicializar la aplicacin y se
instancia un objeto hipermedia (media) con las propiedades de alto y ancho para la
resolucin de la pantalla, en nuestro caso se utiliz el 100%, tambin se puede
trabajar con el nmero de pixeles. Y muy importante es incluir la propiedad
(focusIndex) que es la que permite seleccionar el objeto y mostrarlo. Cabe mencionar
que para la manipulacin de objetos hipermedia tambin se lo puede hacer por
medio de Lua que es un lenguaje imperativo complemento de NCL que es solo
declarativo, pero esta sera una integracin ms compleja con el javascript de la
aplicacin HBBTV.

Pruebas de aplicaciones HbbTV sobre GINGA

En la figura 16 se muestra el resultado de la carga de la aplicacin HbbTV de la


RTVE denominada botn rojo, dentro del emulador del middleware GINGA, el GUI de
GINGA est disponible para PC (Windows)[75].

56
Fig. 16 Aplicacin HbbTV de la RTVE en GINGA.

Por defecto se observa el contorno verde del focusIndex de Ginga que lo


declaramos en el documento NCL y dentro de la aplicacin HbbTV se observa un
nuevo focusIndex con color rojo que es el que nos permite movernos dentro de la
aplicacin. Se realiz la misma prueba con otras aplicaciones (Ver tablas 1.6 - 1.9) y
se determin que existen algunos problemas con el navegador, como por ejemplo
algunas aplicaciones tenan problemas en la presentacin visual, en la navegacin de
las teclas es decir problemas con el focusIndex y problemas de pluggings en la
reproduccin de los videos, los detalles se incluyen en las tablas indicadas.

Tambin se realiz pruebas en el Set Top Box de EITV para TDT con el estndar
ISDB-Tb que incluye el middleware GINGA, para conocer las caractersticas del mismo
se incluye la hoja tcnica en el (Anexo 1).

Los resultados de estas pruebas fueron negativos, no se logr cargar estas


aplicaciones HbbTV, de la misma manera que se hizo en el navegador del emulador
de GINGA, aunque si se logr cargar otro tipo de documento HTML, pero tampoco
con buenos resultados es decir algunas pginas simples si lograba mostrar y otras
pginas ms elaboradas no lo haca, por lo que se lleg a la conclusin que este Set
Top Box no tiene una implementacin completa de un navegador dentro del

57
middleware GINGA y por ser una implementacin propietaria de EITV no se pudo
obtener mayor detalle sobre la misma.

Despus de las pruebas realizadas en el set top box y en el emulador de Ginga,


se concluye que la solucin para que las aplicaciones HbbTV sean compatibles y se
reproduzcan en Ginga, es buscar un nuevo navegador y reemplazarlo al actual, este
nuevo navegador tiene que tener mejores caractersticas, se tiene que comprobar
que sea compatible con las aplicaciones HbbTV; adems tiene que ser de distribucin
libre y totalmente abierto para poder ser embebido o incluido en el middleware
Ginga como su nuevo navegador HTML. Para esto es indispensable buscar los
navegadores disponibles y realizar varias pruebas con el fin de poder recomendar el
navegador ptimo para cumplir con el objetivo.

Anlisis del mejor Navegador para GINGA

Existe en el mercado disponible varios navegadores de distribucin gratuita, en


base a las calificaciones, recomendaciones y experiencias de los usuarios, se ha
escogido varios de estos que se exponen en el siguiente estudio; para luego mostrar
las pruebas realizadas y finalmente elegir el de mejor rendimiento.

La seleccin del mejor navegador web de cdigo abierto requiere un poco de


investigacin y pruebas de funcionamiento y rendimiento de algunos navegadores. El
cdigo abierto es el trmino que describe a la prctica de los desarrolladores de
software que proporcionan el acceso a su cdigo para que otros puedan construir
sobre ella un programa de mejores caractersticas o un programa personalizado
segn las necesidades. Se insta a las personas que utilizan un navegador de cdigo
abierto para proporcionar retroalimentacin a los desarrolladores para tener un
mejoramiento continuo. Los mejores navegadores web de cdigo abierto tienen
caractersticas que ahorran tiempo, ofrecen atajos y bloquean o permiten el acceso
seguro. Los hbitos de trabajo, las caractersticas y gustos personales tendrn mucho
que ver con el tipo de navegador de cdigo abierto seleccionado.

58
Antes de detallar los navegadores que se han elegido para hacer las pruebas de
compatibilidad con las aplicaciones HbbTV, es importante conocer las comparaciones
y las caractersticas de algunos de ellos, as como tambin los rankins de acuerdo de
los ms usados y populares en la web. A continuacin en la figura 17 se muestra la
utilizacin y la popularidad de los navegadores ms utilizados a todo el mundo [70].

Fig. 17 Cuota de uso de navegadores web segn StatCounter .

En la figura 18 se muestra un pastel con los porcentajes de la comparacin de


uso de los navegadores a nivel mundial. Siendo el ms utilizado el Chome, seguido
del Internet Explorer, Firefox, Safari, Andorid, Opera y otros, en el orden detallado
[70].

59
Fig 18 Uso de Navegadores en el mundo.

Un dato interesante sobre los navegadores tambin se muestra en la figura 19


donde se detalla el uso de los navegadores ms populares por pas, segn
StatCounter [57].

Fig. 19 Navegadores web ms utilizados por pas segn StatCounter.

Adems de estos datos donde se muestran los navegadores ms utilizados en el


mundo existen varias pginas que muestran rankings y detalles de varios
navegadores y donde califican las experiencias y dan comentarios los usuarios o
internautas que han probado los mismos. En base algunas de estas recomendaciones
se ha seleccionado algunos de los navegadores con los que se realizar las
evaluaciones [72] [73]. A continuacin se muestra algunas tablas donde se compara y
se muestra datos interesantes sobre los navegadores seleccionados para las pruebas.

60
Navegador Autor ltima versin Coste Licencia de Motor de
estable (USD) software renderizado
Berkelium Google 11.0.696.57 Gratuito Libre: BSD Blink
Chromium (Descontinuado)
Google Chrome Google 36.0.1985.143 Gratuito Libre: BSD Blink
(Algunas fuentes
cerradas)
Mozilla Firefox Fundacin 28.00 Gratuito Libre: MPL, GNU Gecko
Mozilla GPL, GNU LGNU
Opera Opera 22.0 Gratuito Software no libre Blink
Software
Chromium Google 38.0.2123.1 Gratuito Libre: BSD Blink
Emdedded
Chromium
Framework (CEF)
Iceweasel Debian 24.0 Gratuito Libre: MPL Gecko
Webkit Web Webkit 0.5.0 (Versin de Gratuito Libre: GNU GPL, KHTML
Browser Prueba) GNU LGPL y BSD
Konqueror KDE 4.10.2 Gratuito Libre: GNU GPL KHTML
Tabla 3 Informacin General Bsica sobre los navegadores [70] [71].

Navegador Windows OS X Linux BSD Oher Unix

Berkelium SI SI SI SI NO
Google Chrome SI SI SI NO NO
Mozilla Firefox SI SI SI SI SI
Opera SI SI SI SI SI
Chromium Emdedded SI SI SI SI NO
Framework (CEF)
Iceweasel SI NO SI NO NO
Webkit Web Browser SI SI SI NO NO
Konqueror SI SI SI SI SI
Tabla 4 Soporte en los Sistemas Operativos [70] [71].

Navegador CCS2.1 Frames Java xHTML XSLT HTTP ECMA DOM2 SSL
Script Script
Berkelium SI SI SI SI SI SI SI ? ?
Google Chrome SI SI SI SI SI SI SI SI SI
Mozilla Firefox SI SI SI SI SI SI SI SI SI
Opera SI SI SI SI SI SI SI SI SI
Chromium Emdedded SI SI SI SI SI SI SI SI SI
Framework (CEF)
Iceweasel SI SI SI SI SI SI SI SI SI
Webkit Web Browser SI SI SI SI NO SI SI SI SI
Konqueror SI SI SI SI NO SI SI SI SI
Tabla 5 Soporte de Tecnologas y Protocolos Web [70] [71].

61
Pero antes de pasar a realizar las evaluaciones a continuacin se detalla
brevemente algunas caractersticas importantes de los navegadores seleccionados
para ser evaluados, tambin se incluye la descripcin del navegador ANT Galio que
utiliza la mayora de dispositivos HbbTV, para poder tener una base y comparar cul
de los navegadores que luego se describen es el ms idneo.

ANT Galio Browser

ANT Galio es un navegador web propietario, especficamente desarrollado y


optimizado para la TV, producido por ANT Software Limited, una empresa de
desarrollo de software con sede en Cambridge, Reino Unido. Fue lanzado en el ao
2004 como sucesor de ANT Fresco con soporte aadido para AJAX y moderno
JavaScript, as como otras mejoras. El navegador ANT Galio da a los operadores y
fabricantes una plataforma probada para entregar experiencias de televisin
completas y atractivas. A partir de 15 aos de experiencia, ANT Galio es capaz de
ofrecer una potente solucin, robusta para la entrega de aplicaciones y servicios de
televisin. ANT Galio es un proveedor lder de software de cliente y soluciones para la
IPTV, industrias hbridas de TV y electrnica de consumo, ANT Galio Browser soporta
TV bajo demanda, vdeo bajo demanda, servicios de grabadora de vdeo digital y EPG
adems de otras aplicaciones web [69].

La Plataforma HbbTV de ANT Galio est formada por el poderoso Browser ANT
Galio y un conjunto completo de extensiones HbbTV como se puede observar en la
figura 20, estrechamente integrada para ofrecer la funcionalidad de TV fiable con
experiencias atractivas para el usuario. ANT est a la vanguardia del estndar HbbTV,
que ofrece una solucin llave en mano para las dos versiones 1.1.1 y 1.5 de la
especificacin HbbTV para todos los dispositivos de TV. Esta plataforma se ha
implementado en muchas series de fabricantes de dispositivos, comenzando con los
primeros receptores HbbTV desde diciembre de 2009. Por lo cual proporcionar una
plataforma robusta, flexible y probada, la Plataforma HbbTV ANT Galio permite tanto
a los proveedores de servicios y fabricantes de dispositivos desarrollar y desplegar
aplicaciones HbbTV afines para los servicios de transmisin de TV hbrida de forma

62
rpida y fcil. Al ser una plataforma hbrida rica, no solo es compatible con HbbTV,
sino tambin con una amplia gama de servicios de televisin por internet. Por todas
las caractersticas descritas la Plataforma HbbTV de ANT Galio es el middleware de
eleccin para muchos fabricantes de dispositivos lderes [69].

Fig. 20 Plataforma HbbTV de ANT Galio

La Plataforma Galio ANT ofrece soporte para todos los estndares abiertos de
hoy para aplicaciones de televisin, incluyendo HbbTV, OIPF y HTML5. Tambin
proporciona soporte para las API de JavaScript avanzados de ANT para la TV y los
medios de control.

Todas estas APIs proporcionan un enlace entre los elementos de alto nivel de la
interfaz de usuario y el cdigo porttil optimizado nativo, de la Plataforma Galio ANT
para entregar experiencias de televisin adaptados a las caractersticas de
implementacin particulares.

La Plataforma Galio ANT ofrece capacidades de control y gestin para la TV


abierta tradicional, IPTV, funciones de vdeo bajo demanda (VOD) y PVR, que permite
aplicaciones de televisin que se desplegarn en una variedad de plataformas,
independientemente del sistema de suministro, la plataforma de hardware, o los
medios de comunicacin y formatos de metadatos. Esto permite que el desarrollador

63
de aplicaciones para centrarse en la experiencia del usuario en lugar de la tecnologa
involucrada, con alto nivel de JavaScript API adaptado a conceptos que son familiares
en un televisor o sistema de entretenimiento en el hogar. Todas las aplicaciones y
servicios se desarrollan utilizando tecnologas web familiares para implementar la
interfaz de usuario y funcionalidad de la aplicacin [69].

A pesar que este navegador no es de distribucin libre como el que se est


buscando y tampoco consta en los rankings de los navegadores ms utilizados, este
navegador junto con algunas plataformas propietarias de ANT Galio ofrece soporte y
es utilizado como navegador en mucho dispositivos HbbTV, por ser el ms robusto
para aplicaciones de TV e IPTV. Por tales motivos a continuacin se detalla algunas de
sus caractersticas y funcionalidades que luego pueden ayudar a la eleccin del mejor
navegador.

Cumple con el estndar HbbTV (Soporte para HbbTV 1.5)


Diseado especficamente para plataformas embebidas, fcil portabilidad a
cualquier CPU 32/64 bits y OS / RTOS.
Una gama flexible de opciones de integracin y optimizacin del
rendimiento de los equipos disponibles, portabilidad a las nuevas
plataformas y ya integrada a una variedad de plataformas de hardware y
software.
Documentacin y cdigo muestra para guiar el proceso de integracin.
Una solucin completa que soporta la funcionalidad del botn rojo y la
interfaz de usuario del portal de TV.
Capacidad y flexibilidad Web 2.0
CE HTML, HTML 5 (parcial), HTML 4.01, XHTML 1.0, DHTML
CSS 3 (parcial), CSS 2.1 y CSS TV Profile 1.0
DOM 3 (parcial), DOM 2, DOM 1, DOM 0
JavaScript 1.5 (EcmaScript 262 Edicin 3)
XML 1.0 y XML 1.1.
HTTP 1.1, HTTPS

64
Unicode y soporte de mltiples idiomas internacionales
Concesin de licencias de cdigo fuente disponible
Apto para cualquier CPU 32/64 bits y OS / RTOS
Portable, modular y arquitectura extensible
Algoritmos escalables para CPU y uso eficiente de la memoria
Soporta RGB y YUV frame buffers
Construido para el uso con un control remoto de TV estndar - sin
necesidad de un ratn o un teclado
Amplio soporte para los estndares actuales de televisin, fcil reutilizacin
para otros tipos de productos ms all de HbbTV [69].

Berkelium

Berkelium es una biblioteca con licencia BSD que ofrece un navegador off-
screen (que se puede insertar dentro de otra aplicacin) basado en el cdigo abierto
de Google Chromium web browser. Se aprovecha del renderizado multiproceso de
Chromium para aislar los navegadores de los dems y puede reproducir cualquier
bfer en memoria. El usuario de la biblioteca puede inyectar cdigo javascript de
entrada y en las pginas web para su control, as como escuchar los eventos
generados por la pgina, tales como eventos de navegacin, eventos de secuencia de
carga y eventos de pintura. Berkelium ofrece un pequeo API para embeber un
completo y funcional navegador en cualquier aplicacin [55].

La librera de Berkelium est disponible en versin de 32 bit y 64 bit en cada


plataforma soportada, incluida Windows. Es totalmente abierta, gratuita y por las
facilidades que brinda, Ginga adopt este browser como su navegador HTML
predeterminado, en las pruebas realizadas se evala su funcionamiento tanto dentro
del emulador de Ginga como bajo el sistema operativo de Windows. Actualmente el
paquete de Berkelium ya no se mantiene por lo que en su pgina se recomienda el
uso de Chromium Embedded Framework. La versin que se utiliz es la 11.0.696.57
para Windows.

65
Google Chrome

Google Chrome es un navegador web desarrollado por Google y compilado con


base en varios componentes e infraestructuras de desarrollo de aplicaciones
(frameworks) de cdigo abierto, como el motor de renderizado Blink (bifurcacin o
fork de WebKit). Est disponible gratuitamente bajo condiciones de servicio
especficas. El nombre del navegador deriva del trmino en ingls usado para el
marco de la interfaz grfica de usuario (chrome).

Cuenta con ms de 750 millones de usuarios y dependiendo de la fuente de


medicin global, puede ser considerado el navegador ms usado de Internet variando
hasta el segundo puesto, algunas veces logrando la popularidad mundial en la
primera posicin. Su cuota de mercado se situaba aproximadamente entre el 17% y
32% a finales de junio de 2012, con particular xito en la mayora de pases de
Amrica Latina donde es el ms popular. Actualmente el nmero de usuarios
aument considerablemente situndose en una cuota de mercado cercana al 43%
convirtindolo en el navegador ms utilizado de todo el planeta.

Por su parte, Chromium es el proyecto de software libre con el que se ha


desarrollado Google Chrome y es de participacin comunitaria (bajo el mbito de
Google Code) para fundamentar las bases del diseo y desarrollo del navegador
Chrome (junto con la extensin Chrome Frame), adems del sistema operativo
Google Chrome OS. La porcin realizada por Google est amparada por la licencia de
uso BSD, con otras partes sujetas a una variedad de licencias de cdigo abierto
permisivas que incluyen MIT License, Ms-PL y la triple licencia MPL/GPL/LGPL. En
esencia, los aportes hechos por el proyecto libre Chromium fundamentan el cdigo
fuente del navegador base sobre el que est construido Chrome y por tanto tendr
sus mismas caractersticas, pero con un logotipo ligeramente diferente y sin el apoyo
comercial o tcnico de la compaa Google.

66
El 2 de septiembre de 2008 sali a la luz la primera versin al mercado, siendo
esta una versin beta. Finalmente, el 11 de diciembre de 2008 se lanz una versin
estable al pblico en general. Actualmente el navegador est disponible para los
sistemas operativos de escritorio Microsoft Windows, Mac OS X, Ubuntu, Debian,
Fedora, openSUSE, Chrome OS y en los sistemas operativos mviles Android y iOS
[56].

Mozilla Firefox

Mozilla Firefox es un navegador web libre y de cdigo abierto, desarrollado


para Microsoft Windows, Mac OS X y GNU/Linux coordinado por la Corporacin
Mozilla y la Fundacin Mozilla. Usa el motor Gecko para renderizar pginas webs, el
cual implementa actuales y futuros estndares web. A partir de agosto de 2012
Firefox tiene aproximadamente un 23% de la cuota de mercado, convirtindose en el
tercer navegador web ms usado, con particular xito en Indonesia, Alemania y
Polonia, donde es el ms popular con un 65%, 47% y 47% de uso, respectivamente.

Es compatible con varios lenguajes web, incluyendo HTML, XML, XHTML, SVG,
CSS 1, 2 y 3, ECMAScript (JavaScript), DOM, MathML, DTD, XSLT, XPath, e imgenes
PNG con transparencia alfa. Tambin incorpora las normas propuestas por el
WHATWG y es compatible con el elemento HTML Canvas.

En cuestin al cumplimiento de estndares web, pasa satisfactoriamente la


prueba de Acid2 a partir de la versin 3.0. Sin embargo, las ramas de versiones 3.x no
pasaban completamente la prueba de Acid3, pues obtienen un puntaje de 93/100 en
Firefox 3.5 y un puntaje de 94/100 en la versin 3.6. Firefox 4 y versiones ms
recientes, obtienen un puntaje de 100/100.

El cdigo fuente de Firefox es libre, abierto y es distribuido bajo triple licencia;


Licencia Pblica de Mozilla (MPL), Licencia pblica general de GNU (GPL), o la Licencia
pblica general reducida de GNU (LGPL). Estas licencias permiten a cualquiera ver,
modificar y/o redistribuir el cdigo fuente, y son varias las aplicaciones que se
conocen hacen uso: por ejemplo Flock, Miro, GNU IceCat, IceWeasel y Songbird estn

67
hechos a partir del cdigo de Firefox. Aproximadamente el 40 % del cdigo de Firefox
est escrito por voluntarios [57].

FireHbbTV plugging

FireHbbTV plugging es un complemento de Firefox para ayudar al desarrollo de


aplicaciones compatibles con HbbTV. Los beneficios son buenos ya que se tiene una
herramienta de desarrollo asociada con el navegador. El API de HbbTV se inyecta en
la marcha en la pgina web una vez que se activa el soporte para plugins para un sitio
dado, proporcionando herramientas tiles, tales como cambio de tamao, cambio de
relacin de aspecto, muestra del margen y navegacin con el teclado compatible con
el control remoto de la TV. Ms caractersticas se detallan a continuacin [58] y [59].
Javascript HbbTV API inyectado en la marcha.
Soporte especfico de la mayora de HbbTV <object> (audio, video y
difusin.)
Soporte de los comandos de HbbTV.
Soporte mnimo para DVB uri.
Tres mdios diferentes de broadcast en el backend. (SVG, Tag HTML
<video> y Firebreath VLC)
Redimensionamento inteligente.
Cambio de la relacin de aspecto de la pantalla.
Muestra el margen del rea segura en la zona de la pantalla.
Reemplaza la imagen de la TV.
Lista de canales, secuencia personalizada por canal.
Simulacin del flujo de eventos DSM-CC.
Navegacin con teclado simulando el mando de la TV.

Opera HbbTV Emulator

El emulador HbbTV de Opera proporciona un entorno de prueba para


aplicaciones HbbTV. Esta versin beta est basado en la especificacin 1.1.1 HbbTV.

68
El programa est basado en el navegador de Opera, pero corre como una mquina
virtual independiente emulando el comportamiento de un receptor con HbbTV [63].

El navegador web Opera fue creado por la empresa noruega Opera Software.
Usa el motor de renderizado Blink. Los sistemas operativos compatibles con Opera
son Microsoft Windows y Mac OS X. Los usuarios de GNU/Linux y FreeBSD deben
instalar versiones antiguas que tengan el motor Presto. Hay versiones de Opera para
telfonos mviles y tabletas. Los sistemas operativos mviles soportados son
Maemo, BlackBerry, Symbian, Windows Mobile, Android e iOS; as como la
plataforma Java ME. Opera ha sido pionero en originar caractersticas que han sido
posteriormente adoptadas por otros navegadores web, como por ejemplo el Acceso
Rpido (Speed Dial) [64].

El 13 de febrero de 2013, Opera Software inform que cambiara su motor de


renderizado Presto por WebKit y que contribuira con el desarrollo de WebKit y de
Chromium. El 4 de abril de 2013, Opera Software anunci que descart Webkit para
unirse a Google en la construccin del motor de renderizado Blink. El 27 de mayo de
2013, sali la versin de prueba Opera Next 15 en la que se incorpor el nuevo
motor. El 2 de julio de 2013 apareci la versin estable de Opera 15 con el motor
Blink. El 23 de abril de 2014, Opera Software lanz para Windows la versin 12., que
es una actualizacin del navegador con el motor Presto. Esta versin tiene arreglada
la vulnerabilidad con respecto al agujero de seguridad Heartbleed [64].

Para agosto de 2013, Opera tena ms de 350 millones de usuarios, segn


Opera Software. El nmero de usuarios estaba distribuido de la siguiente forma:
Versin de escritorio: 52 millones.
Versin mvil: ms de 264 millones.
Versiones instaladas en otros equipos: ms de 25 millones.

En la parte de resultados se incluye las pruebas realizadas con el emulador de


HbbTV desarrollado por Opera.

69
Chromium Embedded Framework

Chromium Emdedded Framework (CEF) es un simple framework para embeber


o incluir navegadores basados en Chromium dentro de otras aplicaciones. Es un
proyecto de cdigo abierto con licencia BSD fundada por Marshall Greenblatt en
2008 y basado en el proyecto de Google Chromium.

A diferencia del proyecto Chromium en s, que se centra principalmente en el


desarrollo de aplicaciones de Google Chrome, CEF se centra en facilitar los casos de
uso del navegador integrado en aplicaciones de terceros. CEF asla al usuario de la
subyacente complejidad del cdigo en Chromium y Blink, ofreciendo APIs de calidad
de produccin estables, liberacin de ramas de seguimiento especficas de Chromium
y las distribuciones binarias. La mayora de las caractersticas de CEF tienen
implementaciones predeterminadas que proporcionan una rica funcionalidad
mientras que requieren poco o ningn trabajo de integracin por parte del usuario.
Actualmente hay ms de 100 millones instancias instaladas de CEF de todo el mundo
integrados en productos de una amplia gama de empresas e industrias. Una lista
parcial de las compaas y productos utilizando CEF est disponible en la pgina CEF
Wikipedia. Algunos casos de uso de CEF son:

Incluir un control del explorador Web HTML5 compatible en una aplicacin


nativa existente.
Creacin de una aplicacin ligera nativa "shell" que aloje una interfaz de
usuario desarrollada principalmente utilizando tecnologas Web.
Representacin de contenido Web "fuera de la pantalla" en aplicaciones que
tienen sus propios marcos de dibujo personalizado.
Actuando como anfitrin para las pruebas automatizadas de propiedades
Web existentes y aplicaciones.

CEF es compatible con una amplia gama de lenguajes de programacin y


sistemas operativos y se puede integrar fcilmente en las aplicaciones nuevas y
existentes. Fue diseado desde cero con el rendimiento y la facilidad de uso en

70
mente. El marco de base incluye C y C + + de programacin de interfaces expuestas a
travs bibliotecas nativas que aslan la aplicacin principal de los detalles de la
implementacin de Chromium y Blink. Proporciona una estrecha integracin entre el
navegador y la aplicacin principal incluyendo soporte para plugins personalizados,
protocolos, objetos de JavaScript y las extensiones de JavaScript. La aplicacin
principal puede cargar opcionalmente control de los recursos, la navegacin, los
mens contextuales, impresin y ms, aprovechando al mismo tiempo el mismo
rendimiento y tecnologas de HTML5 disponibles en el navegador web Google
Chrome [60] y [61].

El proyecto CEF es una extensin del proyecto de Chromium y mantiene el


desarrollo y liberacin de ramas que registran las variaciones de Chromium. El cdigo
fuente CEF se puede descargar, modificarlo y se embebe manualmente o con
herramientas automatizadas. La base del framework CEF incluye soporte para los
lenguajes de programacin C y C++. Gracias a la ardua labor de los colaboradores
externos de CEF se puede integrar con un sin nmero de otros lenguajes de
programacin y frameworks.

Las distribuciones binarias, que incluyen todos los archivos necesarios para
construir una aplicacin basada en CEF, estn disponibles en la pgina de descargas
[62], incluye los nuevos cambios, pero puede no estar totalmente probado.
Distribuciones binarias son autnomas y no requiere la descarga de CEF o el cdigo
fuente de Chromium. Los archivos de smbolos de depuracin de las distribuciones
binarias de libcef tambin se pueden descargar desde el enlace anterior.

Por las caractersticas detalladas y por su cdigo totalmente libre y gratuito es


una opcin muy buena para ser embebida como el navegador predeterminado de
Ginga. Adelante se mostrar la evaluacin de su desempeo en las pruebas
realizadas con las aplicaciones HbbTV.

71
Iceweasel

Iceweasel es el nombre de un proyecto derivado de Mozilla Firefox, una


compilacin renombrada, preparada por Debian, para resolver la demanda hecha por
Mozilla que los obligaba a dejar de utilizar el nombre o acogerse a sus trminos, los
cuales son inaceptables dentro de las polticas de Debian. No confundir con el
nombre IceWeasel (con W mayscula) que es un proyecto independiente
rebautizado como GNU IceCat, un proyecto GNU para suministrar versiones de
programas de Mozilla constituidos, en su totalidad, de software libre.

El Iceweasel de Debian est basado en una versin modificada de Firefox, en la


que se reemplazan las marcas registradas de Mozilla por otras libres, y se incorporan
mejoras de seguridad adicionales siguiendo la poltica de actualizaciones de
seguridad de Debian. Iceweasel es el navegador por defecto de Debian Etch y
versiones posteriores. Iceweasel tambin est incluido en derivados de Debian, como
en Kali linux y TAILS.

Iceweasel todava utiliza algunos servicios de Internet basados en Mozilla, como


el servicio de bsqueda de agregados Mozilla y el notificador de actualizaciones.
Tampoco ha habido cambio en cuanto a cmo funcionan o se pueden conseguir los
componentes no libres. Al igual que siempre, Debian est comprometida a
suministrar soluciones de seguridad a cualquier versin de Iceweasel que se incluya
en sus lanzamientos estables hasta que el soporte para dichos lanzamientos termine
[65].

Webkit Web Browser

WebKit es una plataforma para aplicaciones que funciona como base para el
navegador web Safari, Google Chrome, Opera, Epiphany, Maxthon, Midori, QupZilla
entre otros. Est basado originalmente en el motor de renderizado KHTML del
navegador web del proyecto KDE, Konqueror.

WebKit logra 100/100 en la prueba Acid3 desde el 26 de marzo de 2008. Desde


junio de 2005 es software libre bajo las licencias GNU GPL, GNU LGPL y BSD. La API de

72
WebKit est desarrollada en Objective-C y posibilita interactuar con un servidor web
para recuperar y renderizar pginas web, descargar archivos, y administrar plugins.
Webkit incluye dos frameworks de ms bajo nivel: WebCore, un analizador sintctico
y motor de renderizado de HTML basado en KHTML, y JavaScriptCore, un intrprete
de JavaScript basado en KJS. Con los lanzamientos pre-alfa se est incluyendo un
depurador de Javascript llamado Drosera4.

El cdigo que se convertira en WebKit se inici en 1998 como parte de un


proyecto KDE de renderizado HTML denominado KHTML y del motor JavaScript de
KDE (KJS). El nombre del proyecto y 'WebKit' fueron creados en 2002, cuando Apple
Inc. cre un fork (bifurcacin) de KHTML y KJS. Los desarrolladores de Apple
explicaron en un correo electrnico a los desarrolladores de KDE5 que estos motores
permiten un desarrollo ms fcil que otras tecnologas por el hecho de ser pequeos
(menos de 140.000 lneas de cdigo), diseados limpiamente y compatibles con las
normas. KHTML y KJS fueron portados a Mac OS X con la ayuda de una biblioteca
adaptada y renombrada como WebCore y JavaScriptCore.

El 7 de junio de 2005, Dave Hyatt, desarrollador de Safari, anunci en su blog


que Apple estaba liberando el cdigo fuente de WebKit como software libre
(anteriormente, slo eran libres WebCore y JavaScriptCore) y el acceso a la estructura
de rbol de WebKit CVS adems de la Base de Datos de Bugs. A mediados de
diciembre 2005, se incluy soporte para SVG (grficos vectoriales escalables) y se
incluy en la distribucin estndar y a principios de enero de 2006, el cdigo fuente
se migr desde el CVS a Subversion. JavaScriptCore WebKit y los componentes
WebCore estn disponibles bajo la GNU General Public License, mientras que el resto
de WebKit est disponible bajo una licencia tipo BSD. El 13 de junio de 2005, Nokia
anunci que se encontraba desarrollando un navegador web basado en WebKit, que
finalmente sera conocido como Web Browser for S60.

WebKit2 se anunci el 8 de abril de 2010. WebKit2 est diseado desde cero


para generar un modelo de procesos divididos, donde el contenido de la web
(Javascript, HTML, diseo, etc) se ejecuta cada uno en proceso separado. Este

73
modelo es similar a lo que a da de hoy Google Chrome tiene implementado, la
principal diferencia es que en WebKit2 ha construido el modelo de proceso de
separacin directamente en un framework, permitiendo que otros desarrolladores lo
puedan utilizar. Actualmente WebKit2 est disponible para Mac y Windows,
cualquiera que desee portar el cdigo a otro sistema puede hacerlo sin restricciones,
ya que es software libre [66].

Konqueror Web Browser

Konqueror es un navegador web, administrador de archivos y visor de archivos.


Forma parte oficial del proyecto KDE. Es software libre y de cdigo abierto, y al igual
que el resto de los componentes de KDE, est liberado bajo la licencia GPL. El nombre
Konqueror es un juego de palabras con el nombre de otros navegadores: primero
vino el Navigator (navegador), despus el Explorer (explorador), y finalmente el
Konqueror (conquistador). Adems, sigue la convencin de KDE de que los nombres
de los programas contengan la letra K.
La interfaz de usuario de Konqueror es en parte reminiscente de la del
Microsoft Internet Explorer (a su vez diseada a partir de la del Netscape Navigator y
la del NSCA Mosaic), aunque es mucho ms personalizable. Trabaja extensamente
con "paneles", los cuales pueden ser recolocados o aadidos. Por ejemplo, se puede
tener un panel de marcadores en el lado izquierdo de la ventana del navegador, y
pulsando un marcador, la respectiva pgina web se abre en el panel principal de la
derecha. Alternativamente, se puede mostrar una lista jerrquica de las carpetas en
un panel y el contenido de la carpeta seleccionada en otro. Los paneles son muy
flexibles y pueden incluir hasta ventanas de consola. La configuracin de los paneles
puede salvarse, habiendo algunas ya incluidas por defecto. Por ejemplo, la
configuracin "Midnight Commander" muestra la ventana dividida en dos paneles
verticales, cada uno de los cuales muestra una carpeta, una pgina web o la
previsualizacin de un fichero [67].

Utilizando la tecnologa de KParts, Konqueror puede ejecutar en su interior


componentes capaces de visualizar (y en ocasiones editar) tipos de archivo

74
especficos. Esto permite, por ejemplo, ver un documento de KOffice dentro de
Konqueror, evitando la necesidad de abrir otra aplicacin.
Adems de navegar por directorios y sitios web, Konqueror utiliza los plug-ins
KIO (KDE Input-Output, o sistema de entrada-salida de KDE) para extender sus
capacidades. KIO permite acceder a diferentes protocolos como HTTP o FTP.
Konqueror tambin puede utilizar plug-ins KIO para acceder a archivos ZIP,
comparticiones Samba (Windows) o cualquier otro protocolo imaginable como links
ed2k, Audio CD, ripeando su contenido simplemente arrastrando y soltando.
Konqueror soporta tambin la navegacin por directorios locales, ya sea
mediante la introduccin de la ruta en la barra de direcciones o mediante la seleccin
de iconos en los paneles [68]. Konqueror permite:
Visualizar los contenidos de mltiples directorios en simultneo.
Ordenar los elementos de cada directorio segn criterios preestablecidos (por
fecha, tamao, nombre, tipo, etc.).
Generar previsualizaciones de archivos de texto, documentos HTML,
imgenes y vdeos en el acto.
Mover, copiar, eliminar, crear, ejecutar, visualizar y editar archivos y
directorios desde mens simples.

Resultados de la evaluacin de los navegadores

Despus del anlisis realizado y la descripcin detallada de cada uno de los


navegadores elegidos para la evaluacin del mejor navegador para ser embebido o
incluido en GINGA, en las siguientes tablas se muestran los resultados de las
evaluaciones con cuatro diferentes aplicaciones HbbTV.

Prueba 1: Comportamiento de la aplicacin HbbTV con los Navegadores


Fuente de la aplicacin 1: http://itv.ard.de/hbbtvtest/
Navegador Presentacin Navegacin con Teclas de control Reproduccin de
visual. el teclado (Foco) (Rojo F5, Verde F6, Vdeo
Amarillo F7, Azul
F8, otras).
Emulador OK No funcionan las No se puede probar. No se puede
Ginga GUI teclas de probar.
navegacin, solo

75
el ENTER.
Berkelium No carga. No se puede No se puede probar. No se puede
probar. probar.
Chrome OK OK OK OK
FireHbbTV OK OK OK OK
pluging Firefox
Firefox No carga. No se puede No se puede probar. No se puede
probar. probar.
Opera HbbTV OK OK OK No funciona (Tiene
Emulator problema con el
plugging de vdeo)
Chromium CEF OK OK OK OK
IceWeasel No carga. No carga. No carga. No carga.
WebKit No carga. No carga. No carga. No carga.
Browser
Konqueror No carga. No carga. No carga. No carga.
Tabla 6 Resultados de la evaluacin de los navegadores con la Aplicacin HbbTV 1.

Prueba 2: Comportamiento de la aplicacin HbbTV con los Navegadores


Fuente de la aplicacin 2: http://www.rtve.es/xl/hbbtv/
Navegador Presentacin Navegacin con Teclas de control Reproduccin de
visual. el teclado (Foco) (Rojo F5, Verde F6, Vdeo
Amarillo F7, Azul
F8, otras).
Emulador OK OK No funciona. No funciona.
Ginga GUI
Berkelium OK No funcionan las OK No funciona (Tiene
teclas de problema con el
navegacin. Se plugging de vdeo)
puede acceder
con el mouse.
Chrome OK No funcionan las OK No funciona (Tiene
teclas de problema con el
navegacin. Se plugging de vdeo)
puede acceder
con el mouse.
FireHbbTV OK OK No funciona. No da certo (Tem
pluging Firefox No funciona (Tiene
problema con el
plugging de vdeo)
Firefox OK No funcionan las OK OK
teclas de
navegacin. Se
puede acceder
con el mouse.
Opera HbbTV OK No funcionan las No funciona. No funciona (Tiene

76
Emulator teclas de problema con el
navegacin. Se plugging de vdeo)
puede acceder
con el mouse.
Chromium CEF OK No funcionan las OK No funciona (Tiene
teclas de problema con el
navegacin. Se plugging de vdeo)
puede acceder
con el mouse y
el ENTER.
IceWeasel OK No funcionan las OK OK
teclas de
navegacin. Se
puede acceder
con el mouse y
el ENTER.
WebKit OK No funcionan las OK No funciona (Tiene
Browser teclas de problema con el
navegacin. Se plugging de vdeo)
puede acceder
con el mouse y
el ENTER.
Konqueror OK No funcionan las OK No funciona (Tiene
teclas de problema con el
navegacin. Se plugging de vdeo)
puede acceder
con el mouse y
el ENTER.
Tabla 7 Resultados de la evaluacin de los navegadores con la Aplicacin HbbTV 2.

Prueba 3: Comportamiento de la aplicacin HbbTV con los Navegadores


Fuente de la aplicacin 3: http://hbbtv.daserste.de/
Navegador Presentacin Navegacin con Teclas de control Reproduccin de
visual. el teclado (Foco) (Rojo F5, Verde F6, Vdeo
Amarillo F7, Azul
F8, otras).
Emulador No muestra todo No funciona No funciona No funciona
Ginga GUI
Berkelium OK OK No funciona OK
Chrome OK OK OK OK
FireHbbTV OK OK OK No funciona
pluging Firefox
Firefox OK OK OK OK
Opera HbbTV OK OK OK No funciona (Tiene
Emulator problema con el
plugging de vdeo)

77
Chromium CEF OK OK OK OK
IceWeasel OK OK OK OK
WebKit OK OK OK OK
Browser
Konqueror OK OK OK No funciona (Tiene
problema con el
plugging de vdeo)
Tabla 1.8 Resultados de la evaluacin de los navegadores con la Aplicacin HbbTV 3.

Prueba 4: Comportamiento de la aplicacin HbbTV con los Navegadores


Fuente de la aplicacin 4: http://138.4.47.33:2103/juanpedro/alfredo3/
Navegador Presentacin Navegacin con Teclas de control Reproduccin de
visual. el teclado (Foco) (Rojo F5, Verde F6, Vdeo
Amarillo F7, Azul
F8, otras).
Emulador OK No funcionan las No funciona. La aplicacin no
Ginga GUI teclas de tiene video.
navegacin, solo
el ENTER.
Berkelium No carga bien. No funciona. No funciona. La aplicacin no
tiene video.
Chrome OK OK OK La aplicacin no
tiene video.
FireHbbTV OK OK OK La aplicacin no
pluging Firefox tiene video.
Firefox OK OK OK La aplicacin no
tiene video.
Opera HbbTV OK OK OK La aplicacin no
Emulator tiene video.
Chromium CEF OK OK OK La aplicacin no
tiene video.
IceWeasel OK OK OK La aplicacin no
tiene video.
WebKit No carga. No carga. OK La aplicacin no
Browser tiene video.
Konqueror OK OK OK La aplicacin no
tiene video.
Tabla 9 Resultados de la evaluacin de los navegadores con la Aplicacin HbbTV 4.

El navegador que obtuvo los mejores resultados en las pruebas realizadas con
las diferentes aplicaciones HbbTV fue el Chromium Embedded Framework (CEF)
adems que en el anlisis de sus caractersticas y su cdigo abierto y gratuito lo hace
el ganador entre los navegadores probados, tambin tuvieron buenos resultados los
navegador Iceweasel, Webkit y el Konqueror en ese orden. Por lo cual se concluye

78
que si se quiere reproducir aplicaciones HbbTV dentro del middleware Ginga es
necesario hacer la implementacin del Chromium Embedded como nuevo navegador
de Ginga.

Integracin del Chromium Embedded Framework en Ginga.

Con los resultados que se obtuvieron en el apartado anterior y despus de


conocer las caractersticas del navegador Chromium Embedded Framework (CEF)
descritas previamente, se procede a la integracin de este navegador en GINGA.
No existe una metodologa definida pero despus de consultar con los
expertos y creadores del sistema, a continuacin se detalla los pasos que se debera
seguir para lograr la integracin del nuevo navegador en GINGA:

1. Acceso a los cdigos fuente.- Se necesita tener acceso a todo el cdigo abierto de
GINGA donde incluyen libreras, extensiones, funciones, etc. y de igual forma
descargar y tener disponible todos los cdigos binarios precompilados y
cabeceras del Chromium Embedded Framework que se pueden encontrar en la
web [62].
2. Instalacin del software para su compilacin.- El Middleware GINGA
actualmente soporta un build en Windows por medio de Visual Studio [75] y un
build en Linux via autotools [76]. Se puede utilizar cualquiera de los dos segn
con cual se est ms familiarizado aunque se aconseja utilizar el build de
Windows que es el que est ms estable. En este caso se ha escogido el programa
Visual Studio Ultimate 2012.
3. Compilacin de Ginga.- Cabe mencionar que para hacer las pruebas pertinentes y
tener acceso al cdigo fuente de GINGA se ha contactado con los creadores del
sistema de la Pontfice Universidad Catlica de Rio de Janeiro y muy gentilmente
se nos ha brindado la apertura y la ayuda necesaria, as como el acceso a los
cdigos binarios con las dependencias (dll) previamente configuradas. Dentro de
la carpeta que contiene el cdigo fuente de Ginga con todas las dependencias ya
configuradas, se debe abrir el archivo GingaWindowsMonolitic de tipo VC++
Project por medio del Visual Studio, este archivo se encuentra dentro del

79
directorio \ginga\ginga-vs2010-solution\GingaWindowsMonolitic y es el que nos
permitir realizar la compilacin. En la figura 21 se muestra el IDE de Visual
Studio con el proyecto de Ginga cargado, se observa que existe una gran cantidad
de clases, libreras y cdigo C++ en general, por lo que habr que tener
habilidades con este lenguaje para poder hacer los cambios y seguir el proceso de
integracin con xito.

Fig. 21 Compilacin de Ginga sobre Visual Studio

4. Ejecucin de Ginga.- Para comprobar que los archivos descargados con las
dependencias (dll) configuradas previamente estn funcionando sin problema
bajo el sistema operativo que se vaya a utilizar, es necesario invocar una
ejecucin de una aplicacin NCL a travs del terminal (cmd).
El binario final de Ginga se encuentra en la carpeta ginga\ginga-vs2010-
solution\Debug, aqu es donde se debe ubicar desde la ventana del cmd para
invocar una aplicacin de Ginga NCL, para ejecutar la aplicacin se utiliza el
siguiente comando: ginga --ncl <PATH-APP-NCL> --vmode 640x480.
5. Anlisis de las APIs del Chromium Embedded Framework.- Antes de comenzar
con la integracin es indispensable tratar de entender bien las APIs y cmo
utilizar el Chromium Embedded Framework. Para eso se puede tener informacin
en los tutoriales de CEF [60].

80
6. Integracin del Chromium Embedded Framework.- Para esta integracin se debe
tener en cuenta que en el cdigo actual de GINGA ya se encuentra embebido el
navegador Berkelium, por lo que ahora la idea es tratar de analizar cmo estn
funcionando y cules son las extensiones que manejan el Player de HTML y
reemplazarlas por las nuevas extensiones del Chromium. En conclusin tratar de
programar encima las clases del Berkelium ya existentes y sustituir las llamadas
que hace al Berkelium por llamadas al Chromium Embedded Framework.
La que mayor demanda de esfuerzo tendr es la integracin de las APIs que
manipulan el video principal en el Player principalmente porque para lograr eso
se debe acceder a la parte comn del ncleo de Ginga conocido como Ginga-CC
(Common Core) como se mostr en la figura 15.
Haciendo una breve revisin en las cabeceras funciones y cdigos de Ginga
detallo las siguientes clases del Berkelium que ahora ser necesario reprogramar
con las del Chromium Embedded Framework.
./gingacc-player/include/player/BerkeliumHandler.h
./gingacc-player/include/player/BerkeliumPlayer.h
./gingancl/include/gingancl/adapters/application/declarative/xhtml/berkelium/Berkeli
umPlayerAdapter.h
./gingacc-player/src/application/declarative/xhtml/berkelium/BerkeliumHandler.cpp
./gingacc-player/src/application/declarative/xhtml/berkelium/BerkeliumPlayer.cpp
./gingancl/src/adapters/application/declarative/xhtml/berkelium/BerkeliumPlayerAda
pter.cpp

No se descarta que adicional a esto tambin sea posible que el Chromium


Embedded Framework necesite de otras libreras y clases para lograr su
integracin, por lo que ser un trabajo que demande de mucho tiempo y
dedicacin.
7. Pruebas Finales.- Despus de realizar todos los cambios ser necesario compilar
nuevamente y luego que no existan errores, someterla a una especie de plugging
test, invocando la ejecucin de varias ejemplos de aplicaciones con el fin de
comprobar que la integracin del nuevo navegador en GINGA ha sido un xito.

81
CAPTULO 4

CREACIN DE UNA APLICACIN INTERACTIVA

Con el fin de realizar una comparacin ms objetiva de las dos plataformas de


interactividad se plante el objetivo de realizar una aplicacin interactiva comn,
pero desarrollada en ambas plataformas, utilizando las herramientas disponibles y
procedimientos necesarios tanto para HbbTV como para GINGA. La aplicacin
interactiva que se va desarrollar es de carcter informativo relacionada con la
temtica de este trabajo, es decir que tendr informacin bsica sobre los dos
sistemas de interactividad, ambas utilizaran las mismas imgenes fuente para luego
poder realizar una comparacin cuantitativa y cualitativa cuando ya estn
funcionando en los equipos receptores, una televisin o un Set Top Box que tenga
HbbTV incluido para el primer caso y para mostrar la aplicacin Ginga utilizaremos el
Set Top Box de desarrollo de EITV.

APLICACIN INTERACTIVA DESARROLLADA EN GINGA

Para desarrollar una aplicacin GINGA primero se debe definir el diseo con la
funcionalidad que se le quiere dar a la aplicacin, es decir disear un bosquejo donde
se ubique el rea de presentacin de las imgenes o archivos multimedia, con los
porcentajes o tamao de pixeles que se quiera mostrar en la pantalla, se recomienda
utilizar porcentajes para definir los atributos de las imgenes o regin de video con el
fin de que se acople a la resolucin y tamao de cualquier monitor.

Luego de tener definido el bosquejo se pasa a trabajar en su desarrollo con el


software que antes ya se haba mencionado (IDE de Eclipse con el plugging para NCL).
Se crea un proyecto NCL y dentro de este un nuevo archivo NCL. Un documento NCL
consta de la misma estructura que uno HTML, tiene una cabecera y un cuerpo,

82
dentro de la cabecera head se instancia los atributos region (Dnde se va
mostrar las imgenes?, es decir el rea que ocuparan), descriptor (Cmo se van a
mostrar las imgenes?, es decir es donde se detalla las propiedades de las imgenes,
por ejemplo le daremos un focusIndex a cada una de las imgenes para poder
navegar sobre un men); a continuacin dentro de la cabecera se crea una base de
conectores conectorBase (son los que hacen funcionar a los enlaces o
LinkConectors) para que la aplicacin cumpla con las funciones que se requiera.
Dentro del cuerpo body se instancia los atributos media (Qu imgenes se va
mostrar? es decir se detalla la fuente de las imgenes), el atributo port (es la
puerta de entrada a la aplicacin, la primera imagen que da la cara para acceder a la
aplicacin) y finalmente el atributo Link (Cundo se van a mostrar las imgenes?,
es decir el que nos permitir interactuar con las imgenes estos funcionan segn los
conectores instanciados en la cabecera). A continuacin se muestra el cdigo del
documento NCL principal de la aplicacin, donde se podr observar la estructura con
los atributos y las propiedades mencionadas.

<?xml version="1.0" encoding="ISO-8859-1"?>


<!-- Generated by NCL Eclipse -->
<ncl id="main" xmlns="http://www.ncl.org.br/NCL3.0/EDTVProfile">
<head>
<!--AREA DE REGIONES-->
<regionBase>
<region id="rgfondo" width="100%" height="100%"
zIndex="1"/>
<region id="rgVideo" width="100%" height="100%"
zIndex="2"/>
<region id="rgrojo" height="28%" width="25%" top="1%"
left="74%" zIndex="3"/>
<region id="rgrojo2" height="8%" width="8%" bottom="4%"
left="1%" zIndex="3"/>
<region id="rg1" height="15%" width="20%" top="83%"
left="10%" zIndex="3"/>
<region id="rg2" height="15%" width="20%" top="83%"
left="32%" zIndex="3"/>
<region id="rg3" height="15%" width="20%" top="83%"
left="54%" zIndex="3"/>
<region id="rg4" height="15%" width="20%" top="83%"
left="76%" zIndex="3"/>
<region id="rginfo" height="80%" width="40%" top="2%"
left="56%" zIndex="3"/>
</regionBase>

<!--AREA DE DESCRIPTORES-->
<descriptorBase>
<descriptor id="dfondo" region="rgfondo"/>
<descriptor id="dVideo" region="rgVideo"/>

83
<descriptor id="drojo" region="rgrojo"/>
<descriptor id="drojo2" region="rgrojo2"/>
<descriptor id="drg1" region="rg1" focusIndex="1"
moveLeft="4" moveRight="2"/>
<descriptor id="drg2" region="rg2" focusIndex="2"
moveLeft="1" moveRight="3"/>
<descriptor id="drg3" region="rg3" focusIndex="3"
moveLeft="2" moveRight="4"/>
<descriptor id="drg4" region="rg4" focusIndex="4"
moveLeft="3" moveRight="1"/>
<descriptor id="drginfo" region="rginfo"/>
</descriptorBase>

<!--AREA DE CONECTORES-->
<connectorBase>
<causalConnector id="onKeySelectionStartNStopN">
<connectorParam name="keyCode"/>
<simpleCondition role="onSelection"
key="$keyCode"/>
<compoundAction operator="seq">
<simpleAction role="start" max="unbounded"
qualifier="par"/>
<simpleAction role="stop" max="unbounded"
qualifier="par"/>
</compoundAction>
</causalConnector>

<causalConnector id="onKeySelectionSet">
<connectorParam name="keyCode"/>
<connectorParam name="var"/>
<simpleCondition role="onSelection"
key="$keyCode"/>
<simpleAction role="set" value="$var"/>
</causalConnector>

<causalConnector id="onSelectionStartNStopN">
<simpleCondition role="onSelection"/>
<compoundAction operator="seq">
<simpleAction role="start" max="unbounded"
qualifier="par"/>
<simpleAction role="stop" max="unbounded"
qualifier="par"/>
</compoundAction>
</causalConnector>

</connectorBase>
</head>

<body>

<!--AREA DE MEDIAS-->
<media id="fondo" src="media/fondo2.png" descriptor="dfondo"/>
<media id="video" src="media/Hbbtv2.mp4" descriptor="dVideo"><!-
-TOMA AL BROADCAST COMO FUENTE DE VIDEO-->
<property name="bounds"/><!--PERMITE EL
REDIMENSIONAMIENTO-->
</media>
<media id="irojo" src="media/logo_inicio.png"
descriptor="drojo"/>

84
<media id="irojo2" src="media/salir2.png" descriptor="drojo2"/>
<media id="irg1" src="media/opc1.png" descriptor="drg1"/>
<media id="irg2" src="media/opc2.png" descriptor="drg2"/>
<media id="irg3" src="media/opc3.png" descriptor="drg3"/>
<media id="irg4" src="media/opc4.png" descriptor="drg4"/>
<media id="irinfo1" src="media/inf1.png" descriptor="drginfo"/>
<media id="irinfo2" src="media/inf2.png" descriptor="drginfo"/>
<media id="irinfo3" src="media/inf3.png" descriptor="drginfo"/>
<media id="irinfo4" src="media/inf4.png" descriptor="drginfo"/>

<!--PUERTA DE ENTRADA-->
<port id="i1" component="video"/>
<port id="i2" component="irojo"/>

<!--AREA DE ENLACES Y CONECTORES-->


<link xconnector="onKeySelectionStartNStopN">
<bind role="onSelection" component="irojo" >
<bindParam name="keyCode" value="RED"/>
</bind>
<bind role="start" component="fondo" />
<bind role="start" component="video" />
<bind role="start" component="irojo2" />
<bind role="start" component="irg1" />
<bind role="start" component="irg2" />
<bind role="start" component="irg3" />
<bind role="start" component="irg4" />
<bind role="stop" component="irojo" />
</link>
<link xconnector="onKeySelectionSet">
<bind role="onSelection" component="irojo">
<bindParam name="keyCode" value="RED"/>
</bind>
<bind role="set" component="video" interface="bounds">
<bindParam name="var" value="5%,15%,50%,50%"/>
</bind>
</link>

<link xconnector="onKeySelectionStartNStopN">
<bind role="onSelection" component="irojo2" >
<bindParam name="keyCode" value="RED"/>
</bind>
<bind role="stop" component="fondo" />
<bind role="stop" component="irinfo1"/>
<bind role="stop" component="irinfo2"/>
<bind role="stop" component="irinfo3"/>
<bind role="stop" component="irinfo4"/>
<bind role="stop" component="irojo2" />
<bind role="stop" component="irg1" />
<bind role="stop" component="irg2" />
<bind role="stop" component="irg3" />
<bind role="stop" component="irg4" />
<bind role="start" component="irojo" />

</link>

<link xconnector="onKeySelectionSet">
<bind role="onSelection" component="irojo2">
<bindParam name="keyCode" value="RED"/>
</bind>

85
<bind role="set" component="video" interface="bounds">
<bindParam name="var" value="0,0,200%,200%"/>
</bind>
</link>

<link xconnector="onSelectionStartNStopN">
<bind role="onSelection" component="irg1" />
<bind role="start" component="irinfo1" />
<bind role="stop" component="irinfo2" />
<bind role="stop" component="irinfo3" />
<bind role="stop" component="irinfo4" />
</link>

<link xconnector="onSelectionStartNStopN">
<bind role="onSelection" component="irg2" />
<bind role="start" component="irinfo2" />
<bind role="stop" component="irinfo1" />
<bind role="stop" component="irinfo3" />
<bind role="stop" component="irinfo4" />
</link>

<link xconnector="onSelectionStartNStopN">
<bind role="onSelection" component="irg3" />
<bind role="start" component="irinfo3" />
<bind role="stop" component="irinfo1" />
<bind role="stop" component="irinfo2" />
<bind role="stop" component="irinfo4" />
</link>

<link xconnector="onSelectionStartNStopN">
<bind role="onSelection" component="irg4" />
<bind role="start" component="irinfo4" />
<bind role="stop" component="irinfo1" />
<bind role="stop" component="irinfo3" />
<bind role="stop" component="irinfo2" />
</link>

</body>
</ncl>

Para probar los resultados de la aplicacin se lo hace con el GUI de GINGA


disponible para Windows, a continuacin en la figura 22 se muestra el resultado de la
aplicacin. En esta se puede observar que sobre el video de fondo, en la esquina
superior derecha sale el logo del grupo GATV, y con una leyenda que dice PRESIONE
EL BOTN ROJO.

86
Fig 22 Aplicacin Ginga rodando sobre el Emulador.

Despus de las pruebas realizadas con el emulador, se carg la aplicacin en el


Set Top Box, mediante la interfaz de un browser que tiene el propio equipo, para
enviar el video de fondo se debe conectar el Set Top Box a una red y por medio del
VLC se emite un video mediante un protocolo UDP, recordemos que este STB es un
receptor de IPTV y de TDT con estndar ISDB-Tb. En la figura 23 se muestra el men
principal de la aplicacin que se accedi previamente presionando el botn rojo.
Dentro de la aplicacin se puede navegar por cuatro opciones, al presionar OK en
alguna de ellas se muestra la informacin referente a la opcin elegida, adems de
puede observar que el rea o regin donde se muestra el video se redimensiona y de
ubica en otro lugar. Esto permite que la aplicacin interactiva no sea intrusiva y que
el usuario no se pierda de la emisin de TV tipo broadcast que est recibiendo.

87
Fig. 23 Aplicacin Ginga en la TV mediante el STB de EiTV.

Para luego hacer el anlisis comparativo es importante mencionar que se


necesit 160 lneas de cdigo en un solo documento NCL para lograr que funcione la
aplicacin.

APLICACIN INTERACTIVA DESARROLLADA EN HbbTV

Para el desarrollo de la aplicacin HbbTV, al igual que en el desarrollo de la


aplicacin de GINGA, se inicia con el bosquejo del diseo, en este caso se ocupar el
mismo diseo que ya se mostr con GINGA ya que el objetivo es tener la misma
aplicacin en las dos plataformas.

La aplicacin interactiva HbbTV se aloja en un servidor web, al que el


desarrollador o administrador web podr acceder en remoto desde cualquier
navegador con conexin a Internet a travs de un portal web que da soporte al
servidor.
Las herramientas disponibles para el desarrollo de aplicaciones HbbTV son
varias aunque no existe una especfica y dedicada exclusivamente para HbbTV que
permita testear o tenga patrones y estilos predeterminados, se puede ocupar
cualquiera editor de textos, editor de cdigos (XML, HTML, CSS, PHP, JavaScript) o
herramientas abiertas que permitan de una manera rpida y sencilla generar cdigo

88
HTML, existen tambin herramientas propietarias que permiten generar cdigos
HTML como el Dreamweaver y que adems son intrpretes de los cdigos CSS, XML,
JavaScript, PHP, etc. En este caso se ha ocupado el Dreamweaver y el propio editor
de cdigos que tiene el Servidor Web donde se aloja la aplicacin.
Para esta aplicacin se necesita dos archivos CE-HTML, la primera es el cdigo
que se muestra en el siguiente cdigo, este contiene la puerta de entrada a la
aplicacin, para acceder al men principal de la aplicacin se debe presionar el botn
rojo del mando a distancia.

<?xml version="1.0" encoding="utf-8" ?>


<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15">

<!-- Carga de clases javascript -->


<script type="text/javascript" src="rojo.js"></script>
<script type="text/javascript" src="base.js"></script>
<script type="text/javascript" src="botonesindex.js"></script>
<script type="text/javascript" src="hbbtvlib.js"></script>
<script type="text/javascript" src="keycodes.js"></script>
<title>Aplicacion de prueba Broadcast</title>

<style>
#rb{
top: 15px;
left: 900px;
position: absolute;
background-repeat: no-repeat;
}
</style>

</head>

<script type="text/javascript">
function mostrarUocultarRetardado(){

setTimeout("mostrarUocultar('botonRojo');",5000);
}

function mostrarUocultar( whichLayer )


{
var elem, vis;
if( document.getElementById ) //Asi trabaja el estandar.
elem = document.getElementById( whichLayer );
else if( document.all ) // this is the way old msie versions work
elem = document.all[whichLayer];
else if( document.layers ) // this is the way nn4 works
elem = document.layers[whichLayer];
vis = elem.style;
if(vis.display==''&&elem.offsetWidth!=undefined&&elem.offsetHeight!=undefined)
vis.display = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'block':'none';

89
vis.display = (vis.display==''||vis.display=='block')?'none':'block';
}

</script>

<body onload="startAll(); mostrarUocultarRetardado();">


<div style="visibility: hidden; height: 0; width: 0; position: absolute;">
<object type="application/oipfApplicationManager" id="appmgr"></object>
<object type="application/oipfConfiguration" id="oipfcfg"></object>
</div>
<div id="rb">
<div id="botonRojo"><img width="320" height="240"
src="imagenes/logo_inicio.png"></img></div>
</div>

</body>

Dentro de la cabecera se incluye la declaracin de 5 libreras de JavaScript que


son las que contienen el cdigo con las funciones y los atributos de las acciones para
el funcionamiento de la aplicacin. Para conocer mayor detalle sobre el cdigo de
cada una de estas se incluye el cdigo completo en el Anexo3.

A continuacin se muestra el segundo cdigo CE-HTML, que simplemente es el


cdigo declarativo que contiene la estructura de la interfaz principal de la aplicacin,
dentro de la cabecera se instancia las libreras JavaScript que ocupa un lenguaje
imperativo utilizado para indicar a la mquina como realizar las tareas requeridas por
la aplicacin, adems dentro de la cabecera se instancia el documento que contiene
la hoja de estilos donde se pone los atributos como el color, el tipo de letra, la
posicin de las imgenes dentro del background de la estructura de la interfaz
principal, etc. Dentro del cuerpo se declara los objetos necesarios para utilizar las
funciones OIPF, y la estructura del men principal con las 4 opciones y las regiones
donde se muestra la regin de las imgenes informativas y la regin de video
principal. Los cdigos de los archivos complementarios (JavaScript, CSS, XML) se
detallan en el Anexo 4.

<?xml version="1.0" encoding="ISO-8859-1" ?>


<!DOCTYPE html PUBLIC "-//HbbTV//1.1.1//EN" "http://www.hbbtv.org/dtd/HbbTV-1.1.1.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">

<head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<link rel="stylesheet" type="text/css" href="css/teletexto.css" media="all" />

90
<script type="text/javascript" src="js/etiquetas.js"></script>
<script type="text/javascript" src="js/fecha.js"></script>
<script type="text/javascript" src="js/fichas.js"></script>
<script type="text/javascript" src="js/hbbtvlib.js"></script>
<script type="text/javascript" src="js/keycodes.js"></script>
<script type="text/javascript" src="js/base.js"></script>
<script type="text/javascript" src="js/navegacion.js"></script>
<script type="text/javascript" src="js/teletexto.js"></script>
<title>DIEGO GATV</title>
</head>

<body onload="startText();">

<div style="visibility: hidden; height: 0; width: 0; position: absolute;">


<!-- Estos objetos son necesarios para usar las funciones del OIPF-->
<object type="application/oipfApplicationManager" id="appmgr"></object>
<object type="application/oipfConfiguration" id="oipfcfg"></object>
</div>
<div id="todo">
<div id="indice"> <ul id="menu"><!--Men lateral--></ul> </div>
<div id="lateral">
<div class="relleno"><div id="pagina"><!--Este es el indicador de la
pgina actual--></div></div>
</div>
<div id="video1"><object id="video" type="video/broadcast" style="position:
absolute; left: 2%; top: 2%; width: 96%; height: 96%; z-index: 10;" ></object></div>
<div id="contenedor">
<div id="contenido">
<div id="cabecera">
<div id="titular"><!--Este mensaje sale si no se carga
la pgina, pues no se sobrescribe-->La cabecera no se ha cargado correctamente</div>
<div id="fecha">99/99/9999</div>
</div>
<div id="categoria" class="categoria"></div>
<div id="cuerpo" class="cuerpo">
<div id="texto">
<p>No se han cargado correctamente, debe haber un problema en el servidor</p>
</div>
<div id="foto" class="foto"></div>
</div>
</div>
</div>
<div id="pie">
<li><div class="rojo"><div class="boton_rojo"></div></div></li>
<li><div class="opc1"><div class="boton_opc1"></div></div></li>
<li><div class="opc2"><div class="boton_opc2"></div></div></li>
<li><div class="opc3"><div class="boton_opc3"></div></div></li>
<li><div class="opc4"><div class="boton_opc4"></div></div></li>
</div>
</div>
</body>
</html>

Los resultados de la aplicacin se lo pueden probar en cualquier navegador,


pero para poder observar cmo se mostrara en la TV, se utiliza el emulador de

91
HbbTV para Firefox, denominado FireTV. En la figura 24 se puede observar la interfaz
principal de la aplicacin, que muestra un men con 4 opciones, para acceder a una
de ellas se lo hace con ENTER en el teclado de la PC o con la tecla OK del mando de la
TV, para navegar entre las opciones se lo hace con las teclas de navegacin (flecha
izquierda y flecha derecha).

Fig. 24 Aplicacin HbbTV en el emulador

Finalmente en la figura 25, se muestra la aplicacin rodando sobre la televisin,


esta TV incluye el estndar HbbTV, para conocer las especificaciones de la TV
utilizada (ver Anexo 2), para realizar esta demostracin se necesita transmitir el
transport stream (TS) por medio de un modulador DVB, este fichero .TS debe incluir
en la multiplexacin la tabla AIT, dentro de esta tabla se debe incluir el link o URL de
la puerta de entrada de la aplicacin. Es decir la puerta de entrada de la aplicacin es
transmitida por el aire y la TV o el receptor de TDT con HbbTV recibe esta seal y
muestra en su pantalla que est disponible una aplicacin, en la imagen inicial lleva la
leyenda de Presione el botn rojo, con la cual el usuario por medio del mando a
distancia podr acceder a la aplicacin, se recuerda que la TV debe estar conectada a
la red y tener acceso a internet, a diferencia que en el caso anterior de la aplicacin
de GINGA, donde s se recibe la seal por el AIRE, como es una aplicacin de carcter

92
local, netamente informativa, no sera necesario que el receptor est conectado al
internet, pues la aplicacin viaja por el carrusel de datos del Transport Stream y es
descargada en el receptor para que el middleware GINGA muestre la interfaz grfica
de la aplicacin.

Fig. 25 Aplicacin HbbTV en la TV.

ESTUDIO COMPARATIVO DE LAS DOS PLATAFORMAS

En un anlisis anterior se haba buscado hallar una relacin entre los dos
estndares para encontrar alguna manera de integrarles o complementarles, de
hecho se describi tambin los pasos seguidos para lograr una integracin plena de
las aplicaciones HbbTV sobre GINGA, aprovechando que la arquitectura del sistema
GINGA incluye un navegador de HTML. En la tabla 10, se detalla un anlisis
comparativo de las caractersticas y especificaciones principales de los dos
estndares.

PARMETRO HbbTV GINGA


Estandarizado Si (Servicios interactivos Si (Recomendacin ITU-T para
sobre redes broadcast & servicios de IPTV & ISDB-Tb)
broadband)
Nombre de la ETSI TS 102 796 v1.2.1 ITU-T H.761 Ginga-NCL
especificacin. HbbTV 1.5 middleware.

93
Plataforma abierta Si Si
Royalties HbbTV actualmente no est GINGA NCL No
bajo las reclamaciones de GINGA JAVA Si
derechos de autor o
patentes [77].
Desarrolladores Consorcio Europeo de las GINGA NCL PUC-Rio de
Industrias de TV. Janeiro
GINGA JAVA UFPB
(Universidad Federal de
Paraba)
Estndar hbrido Si Si
Pases EUROPA (Alemania, Francia, LATINOAMRICA (Brasil, Per,
Espaa, Austria, Polonia, Argentina, Chile, Venezuela,
Blgica, Dinamarca, Ecuador, Costa Rica, Paraguay,
Finlandia, Hungra, Holanda, Bolivia, Uruguay, Nicaragua y
Republica Checa y Suiza) Guatemala)
Lenguaje de CE-HTML, XML, CSS NCL (Nested Context
Programacin Language)
Declarativo
Lenguaje de JavaScript LUA
Programacin JAVA
Imperativo
Interactividad Local No Si
(Sin conexin a
Internet)
Interactividad Si Si
Completa (Con
conexin a Internet)
Despliegue Muy maduro en pases Muy maduro en Brasil y
como Alemania, Francia y Argentina, en el resto de pases
Espaa, en desarrollo en el estn en etapas de pruebas,
resto de Europa. hay que tomar en cuenta que
la TDT en Latinoamrica est
empezando la transicin.
Modo de difusin La puerta de entrada de la La aplicacin integra se
aplicacin se transmite con transmite con la TDT, dentro
la TDT, dentro del carrusel del carrusel de datos definida
de datos definida en la en la Tabla AIT, o se puede
Tabla AIT, o se puede incluir incluir mediante una aplicacin
mediante una aplicacin dentro del receptor HbbTV.
dentro del receptor HbbTV.
TDT que utiliza DVB ISDB-Tb
Funciona sobre IPTV Si Si
Versin nueva a ser HbbTV 2.0 No hay informacin
lanzada
Tabla 10. Comparacin especificaciones HbbTV vs GINGA.

94
Ahora que ya se conoce las caractersticas y especificaciones principales a
continuacin se muestra un anlisis ms profundo en base a la experiencia del
manejo de los dos estndares, en base a los resultados de la aplicacin mostrada en
las dos plataformas y en base al rendimiento sobre los receptores testeados. Para lo
cual se plante mostrar comparaciones cuantitativas y cualitativas tanto del lado del
programador como del lado del usuario.

COMPARACIN CUALITATIVA

Para hacer esta comparacin cualitativa nos basamos en la observacin o


percepcin que se ha tenido en el manejo y utilizacin de los dos estndares, es decir
se podra definir como un QoE (Quality of Experience). La calidad de experiencia se
define como la aceptabilidad global de una aplicacin o servicio, tal y como se
percibe subjetivamente por el usuario final. Incluye la totalidad de efectos del
sistema extremo a extremo (cliente, terminal, red, servicios de infraestructura) y
puede verse influenciada por las expectativas de los usuarios y el contexto. En este
caso se presenta la comparacin cualitativa desde el punto de vista del usuario y
tambin desde el punto de vista del programador o desarrollador de la aplicacin, ya
que para el usuario el mtodo o las herramientas que se utilice para disear y
finalmente presentar la aplicacin son transparentes [78].

Experiencia Cualitativa en Base al Usuario.

Es difcil definir algunos parmetros que se puedan evaluar o medir


cualitativamente, por lo que antes se mencion que la QoE se mide subjetivamente y
pueda diferir de un usuario a otro. La calidad de la experiencia (QoE) para contenidos
multimedia como IPTV, televisin hbrida y uso de servicios de comunicaciones o de
aplicaciones interactivas proporcionadas por los servidores de servicios de
telecomunicaciones, es definida por el usuario donde describe como le parece el
servicio y si este satisface sus expectativas. La anterior definicin deja ver un poco la
naturaleza subjetiva de la QoE ya que en ella se tienen en cuenta muchos factores
diferentes a los relacionados con la QoS, algunos de estos son; el precio del servicio,
el ambiente de visualizacin, nivel de estrs de los usuarios, la accesibilidad o tiempo
de reaccin, la usabilidad o claridad con que se presenta y la impresin general.

95
Accesibilidad.
En este parmetro se evala que tan accesible es la aplicacin para el usuario,
es decir si le llama la atencin y el tiempo que demora en acceder a la misma y
comenzar a interactuar con la misma.

Usabilidad
La usabilidad es muy importante porque para este tipo de aplicaciones el
usuario no recibe un manual o las instrucciones para que pueda utilizar la aplicacin,
por lo que debe ser muy importante el cmo se presenta visualmente, para que el
usuario intuya a utilizarla mediante la correcta utilizacin de los colores y las teclas
de navegacin del mando a distancia.

Impresin General
Este parmetro se basa en cmo le pareci la experiencia de utilizar la
aplicacin e interactuar con las opciones e informacin que recibi el usuario, para
esto hay que tener en cuenta que la aplicacin no debe ser intrusiva por lo que por
ejemplo se debe mantener activo en la TV la programacin que el usuario estaba
asistiendo en la televisin, ya que la TV por lo general no es de uso personal, ms
bien se la suele ver en conjunto, entre amigos, familia, pareja, etc. Y si alguien est
viendo su partido de futbol o su novela preferida, resultara molesto que alguien use
o interacte con la aplicacin. Por esto es indispensable manejar
redimensionamiento de pantalla y que las imgenes sean de alta calidad y vistosas,
atractivas visualmente para el usuario.

Para las dos plataformas se ocup el mismo diseo de la aplicacin, por lo que
en este aspecto ms que tener un resultado comparativo entre los dos plataformas
se obtuvo un resultado cualitativo de la aplicacin en general, ya que para el usuario
resulta transparente la plataforma sobre la cual est corriendo o recibiendo la
aplicacin. Para realizar estas pruebas se utiliz a 15 voluntarios que no tenan
conocimiento sobre estos sistemas a los cuales se le present la aplicacin en la TV y
se les entreg el mando a distancia para que interacten, los parmetros que se
evaluaron son los tres antes mencionados (Accesibilidad, Usabilidad e Impresin
general) calificando con tres niveles (Excelente, Bueno y Malo). En la tabla 11 y en la
figura 26 se muestran los resultados.

96
PARMETRO Excelente Bueno Malo
Accesibilidad 5 7 3
Usabilidad 4 7 4
Impresin
General 8 6 1
Tabla 11. Resultado cualitativo de la aplicacin segn los usuarios

Impresin General

Excelente
Usabilidad
Bueno
Malo

Accesibilidad

0% 20% 40% 60% 80% 100%

Fig. 26. Grfico de los resultados cualitativos de la aplicacin segn los usuarios

Analizando el grfico de los resultados se observa que la accesibilidad a la


aplicacin en bastante buena ya que la imagen de entrada tiene su propia leyenda
que invita a pulsar el botn rojo del mando, la usabilidad tal vez result un poquito
ms difcil para algunos usuarios tomando en cuenta que son personas que primera
vez que interactuaban con este sistema y que algunas personas estn ms vinculados
con el uso de dispositivos tecnolgicos, para las personas de menor edad les resulta
ms familiar y ms fcil utilizar esta tecnologa, a los personas de mayor edad les
cuesta un poco ms pero en general tanto para los menores y mayores la impresin
general ha sido muy buena, despus de que interactuaron y se les explic el alcance
que podra tener este tipo de aplicaciones en la TV.

Experiencia Cualitativa en Base al Programador.

En base al programador la experiencia cualitativa se basa en la percepcin que


ha tenido utilizando las herramientas disponibles y de que tan fcil o difcil le pareci

97
para lo cual en la tabla 12 se evala varios parmetros desde el punto de vista del
desarrollador de la aplicacin.

Parmetro HbbTV GINGA


Herramientas Hay variedad pero ninguna Hay IDE de programacin
disponibles dedicada a HbbTV. dedicado a GINGA.
Herramientas de Hay algunas de diseo HTML que Todos los softwares tanto de
programacin libres y s son gratuitas y otras que programacin como de
accesibles necesitan pago. Si tiene plugings emulacin de resultados son
que emulan HbbTV en los gratuitos.
navegadores.
Programacin HTML. Es muy conocido y fcil de NCL. Aunque no es muy
declarativa utilizar, aunque necesita tambin difundido es muy sencillo de
de conocimientos de otros programar. Es un lenguaje
lenguajes complementarios como declarativo de contextos
CSS y XML. anidados basada en XML.
Programacin Para el programador es Para el programador no es
imperativa imprescindible conocer y necesario conocer de
entender bien cmo funciona programacin imperativa, las
JavaScript, para poder decir funciones que tiene NCL no le
mediante cdigo cmo funciona hacen indispensable. Salvo que
la aplicacin. la aplicacin tenga que
gestionar canal de retorno o
realizar operaciones
matemticas o de estadsticas,
para lo cual se utiliza Lua.
Lneas de cdigo de Mayor Menor
programacin
Conocimiento de la Si es necesario saber algunas No es indispensable saber las
norma caractersticas de la norma para caractersticas de la norma, la
poder utilizar los recursos de la interfaz de programacin es
TV. muy amigable
Tabla 12. Comparacin cualitativa de los lenguajes de programacin

Despus del anlisis presentado en la comparacin descrita en la tabla anterior


y en base a la experiencia diseando y programando la aplicacin, sin duda es ms
fcil programar la aplicacin GINGA porque el lenguaje de programacin NCL es muy
sencillo, ligero y robusto adems que la herramienta disponible de forma gratuita es
muy amigable, a pesar que el lenguaje es nuevo resulta fcil aprenderlo, aunque si ya
se est muy familiarizado con HTML puede ser que para algunos les resulte ms
cmodo programar la aplicacin HbbTV, tambin es importante mencionar que

98
HTML por ser un lenguaje ms conocido y difundido es ms accesible encontrar
informacin con cursos online o tutoriales gratuitos.

COMPARACIN CUANTITATIVA

Para que exista metodologa cuantitativa se requiere que entre los elementos
del problema de investigacin exista una relacin cuya naturaleza sea representable
por algn modelo numrico. En esta comparacin cuantitativa se trata de encontrar
una relacin del rendimiento de las aplicaciones basadas en el tiempo que demoran
en presentarse al usuario para lo cual es necesario conocer tambin las
caractersticas del procesador y recursos de memoria de los receptores. En los anexos
1 y 2 se muestra las caractersticas de los receptores, en la tabla 13 se observa las
caractersticas de los procesadores tanto del set top box con GINGA como de la TV
con HbbTV.
Recurso Receptor GINGA Receptor HbbTV
Procesador STi 7105 ARM
(CPU 450 MHz) (CPU 800 Mhz)
Memoria 256 Mbytes 512 Mbytes
RAM
Memoria 128 Mbytes 1 Gbyte
Flash
Tabla 13. Comparacin de las caractersticas del procesador de los Receptores

Experiencia Cuantitativa en Base al Usuario.

Se usa al tiempo en segundos como magnitud numrica y luego mediante el


uso de herramientas estadsticas se presenta los resultados para comparar el
rendimiento de las dos plataformas.

En las tablas 14 y 15 se muestra el tiempo que toma la presentacin de las


imgenes de las opciones que tiene la aplicacin tanto en HbbTV como en GINGA.

Aplicacin HbbTV
Imagen Imagen Imagen Imagen Imagen Imgenes Imagen de
Tiempo (s) Opc1 Opc2 Opc3 Opc4 Salir Men Principal Entrada
T1 1,41 1,69 1,85 2,39 2,53 63,54 1,50
T2 1,17 1,32 1,46 1,30 1,76 56,33 1,09
T3 5,85 4,06 4,27 5,72 5,67 4,84 0,70

99
T4 4,03 8,47 9,73 6,48 2,30 3,34 1,66
T5 5,75 1,39 5,20 3,31 2,42 25,00 1,22
T6 1,30 6,07 5,89 2,69 3,04 5,48 1,56
T7 4,80 2,79 2,31 1,97 2,81 36,50 1,12
T promedio 3,47 3,68 4,39 3,41 2,93 27,86 1,26
Tabla 14. Tiempos de Carga de la aplicacin HbbTV

Aplicacin GINGA
Imagen Imagen Imagen Imagen Imagen Imgenes Imagen de
Tiempo (s) Opc1 Opc2 Opc3 Opc4 Salir Men Principal Entrada
T1 1,70 1,43 1,33 1,25 0,85 3,88 2,99
T2 1,31 1,26 1,09 1,18 1,22 4,45 3,37
T3 1,40 1,37 1,07 1,10 0,93 4,59 3,71
T4 1,23 1,20 1,16 1,08 0,99 4,40 3,03
T5 1,41 1,16 1,36 1,18 0,94 5,46 3,79
T6 1,30 1,32 1,33 1,11 0,66 3,87 4,02
T7 1,80 1,79 1,12 1,26 1,03 4,19 3,21
T promedio 1,45 1,36 1,21 1,17 0,95 4,41 3,45
Tabla 15. Tiempos de Carga de la aplicacin GINGA

Para poder comparar ms objetivamente y con claridad se muestra a


continuacin las figuras 27, 28 y 29.

Tiempo de reaccin App. HbbTV


70,00

60,00

50,00

40,00

30,00

20,00

10,00

0,00
T1 T2 T3 T4 T5 T6 T7 T promedio

Imagen Opc1 Imagen Opc2 Imagen Opc3


Imagen Opc4 Imagen Salir Imgenes Men Principal
Imagen de Entrada

Fig. 27. Grfico del tiempo de reaccin de la aplicacin HbbTV

100
Tiempo de reaccin App. GINGA
6,00

5,00

4,00

3,00

2,00

1,00

0,00
T1 T2 T3 T4 T5 T6 T7 T promedio

Imagen Opc1 Imagen Opc2 Imagen Opc3


Imagen Opc4 Imagen Salir Imgenes Men Principal
Imagen de Entrada

Fig. 28. Grfico del tiempo de reaccin de la aplicacin GINGA

Timpos de reaccin HbbTV vs GINGA


Tiempo promedio HbbTV Tiempo promedio GINGA
27,86

3,47 3,68 4,39 3,41 4,41 3,45


2,93
1,45 1,36 1,21 1,17 0,95 1,26

Imagen Opc1 Imagen Opc2 Imagen Opc3 Imagen Opc4 Imagen Salir Imgenes Men Imagen de
Principal Entrada

Fig. 29. Grfico del tiempo de reaccin de HbbTV vs GINGA

Con los resultados mostrados en la figuras 27, 28 y 29 se puede llegar a la


conclusin de que a pesar que el procesador de la TV tiene mejores caractersticas, la
aplicacin GINGA tiene un mejor funcionamiento por su menor tiempo de reaccin lo
que influye tambin en la percepcin del usuario, esto se debe a que la aplicacin
HbbTV gestiona siempre una conexin a la red, porque la aplicacin esta hospedada

101
en un servidor Web, a comparacin que la de GINGA descarga la aplicacin en su
memoria y la procesa internamente sin requerir realizar una conexin web. Para
realizar las pruebas del tiempo de reaccin se busc tener condiciones ptimas es
decir una conexin de banda ancha estable, como se muestra en la figura 30.

Fig. 30. Banda Ancha ocupado para probar la aplicacin HbbTV

Claramente va ser una ventaja que GINGA reproduce la aplicacin como si fuera
una aplicacin local, que a pesar de tener pocos recursos de hardware lo utiliza bien,
la misma aplicacin HbbTV testeada desde una PC s que tiene mucho mejor
rendimiento que la mostrada en el receptor de TV con HbbTV. Aunque viendo desde
el punto de vista del programador y del servidor de aplicaciones interactivas que
emiten en vivo las aplicaciones dentro de su flujo de transporte, es mucho ms
sencillo gestionar desde cualquier acceso remoto y realizar los cambios en caliente,
ya que la aplicacin siempre est accediendo a internet para obtener informacin, en
el caso de GINGA resulta un poco ms complicado ya que la aplicacin debera ser
modificada e insertada nuevamente dentro del carrusel de datos e indicar que tiene
una actualizacin, por lo que nuevamente en el receptor se debera cerrar
totalmente la aplicacin y volver a cargarla.

102
Experiencia Cuantitativa en Base al Programador.

Aunque en las experiencias cualitativas en base al programador ya se detall


que exista una mayor cantidad de lneas de programacin en el desarrollo de la
aplicacin HbbTV con respecto a la aplicacin GINGA, en la figura 31 se muestra
grficamente esta relacin.
Lneas de
Cdigo
Ginga;
160

Lneas de
Cdigo
HbbTV;
1489

Fig. 31. Comparativa de las lneas de cdigo de programacin en la aplicacin HbbTV y GINGA

Y tambin cabe mencionar que las lneas de cdigo de GINGA fueron escritas en
un nico archivo.ncl, y que para la creacin de la misma aplicacin fue necesario
ocupar 18 archivos de diferentes extensiones, html, css y js. Una descripcin grfica
de la comparacin se muestra en la figura 32.

Ginga; 1

HbbTV;
18

Fig. 32. Comparativa de los archivos ocupados en la aplicacin HbbTV y GINGA

103
Con estas comparativas cuantitativas se reafirma la aseveracin ya antes
mencionada que para el programador resulta ms rpido y sencillo realizar una
misma aplicacin sobre GINGA que sobre HbbTV.

VENTAJAS Y DESVENTAJAS

Para finalizar este anlisis comparativo en la tabla 16, se presenta un compilado


de algunas de las ventajas y desvantajas que presentan uno u otra plataforma de
interactividad.

Plataforma de HBBTV GINGA


Interactividad
VENTAJAS - Es un sistema hbrido que ocupa las - Las aplicaciones pueden ser
ventajas de un sistema broadcast y transmitidas o llegar al consumidor
broadband. por broadcast o por un sistema
- Usa tecnologas y lenguajes de broadband IPTV, FTP, etc, lo que
programacin ampliamente permite la posibilidad de crear una
conocidas y probadas. especie de APP Store de aplicaciones.
- Totalmente enfocado al - Simple de disear y desarrollar una
radiodifusor y a sus intereses. aplicacin.
- Fcil de realizar cambios de las - Usa un lenguaje de desarrollo
aplicaciones en vivo. totalmente independiente de
- Existen portales de aplicaciones cualquier otra tecnologa ya existente.
abiertas muy desarrollados y - Tiene herramientas dedicadas para
amigables que acercan el desarrollo de aplicaciones.
eficientemente al usuario los - La versin de GINGA NCL es
servicios de internet mediante la TV. totalmente abierta y libre de royalties.
- Integra fcilmente servicios de - Permite aplicaciones de carcter
VoD, y EPG. local sin que el usuario tenga una
- Ha evolucionado con el tiempo. conexin a internet.
- Libre de Royalties. - En Latinoamrica est siendo
- Existe el inters de la industria de enfocada a dar servicios de carcter
los receptores de televisin. social que permitan la inclusin digital
- Estandariza el mercado de las a personas de bajos recursos que no
plataformas interactivas en Europa. tienen acceso a internet.
- Nuevas opciones de negocio tanto - Un mercado que an no ha sido
como para fabricantes como para explotado y donde se puede crear
desarrolladores y servidores y muchos modelos de negocio.
distribuidores de contenido de TV.
DESVENTAJAS - An le falta por extenderse en el - Usa NCL, un lenguaje un poco
resto de pases europeos aunque ya desconocido.
han dado el ejemplo Alemania, - Aun no ha comenzado un despliegue

104
Francia y Espaa Debe consolidarse masivo en Latinoamrica.
en el mercado lo antes posible. - Aun no se consolida como un
- Necesita tener mayores recursos estndar obligatorio en los receptores
de hardware en los equipos de TDT.
receptores. - Debe existir mejores herramientas
- Est orientado solo para para gestionar los cambios y
aplicaciones de interactividad total, actualizaciones de las aplicaciones
es decir necesita el canal de retorno interactivas que son transmitidas por
para funcionar. el aire en vivo.

Tabla 16. Ventajas y desventajas de GINGA y HbbTV

105
CAPTULO 5

CONCLUSIONES

Las emisoras, proveedores de servicios y fabricantes quieren mejorar la


experiencia de TV para los consumidores de varias maneras. La creacin de una
solucin para hacer frente a este problema requiere estndares abiertos para evitar
la tecnologa cerrada y una base comn desde la cual trabajar a fin de fomentar la
dinmica del mercado, necesarias para lograr soluciones asequibles. Las soluciones
HbbTV y GINGA que se han presentado en este trabajo satisfacen esta demanda.

La industria ser uno de los grandes dinamizadores del sistema y tendrn


mucho que decir en cmo se desarrollen incluso los contenidos o parte de ellos.
Hasta el momento hay una cierta falta de apoyo ya que algunos fabricantes optan
por soluciones propietarias que impiden la convergencia entre televisin e Internet.

El proyecto HbbTV ha despegado de manera significativa con la colaboracin de


diversos grupos de entidades compuestos por los principales fabricantes
internacionales de televisin y de radiodifusin, sin embargo todava falta para su
completa integracin.

En Espaa el nmero de dispositivos que soportan HbbTV todava es reducido,


pero se espera que aumente en los prximos aos, sin embargo se pretende
aprovechar que las estaciones de Televisin ya han comenzado a lanzar un sin
nmero de aplicaciones como la del botn rojo y este ser el punto de partida para
establecer y promocionar otra forma de consumir televisin.

GINGA se presenta como una plataforma abierta con un gran futuro en


Latinoamrica, prueba de ello es la obligatoriedad que han declarado algunos pases

106
para la entrada de los equipos receptores, esto sin duda ser un factor de xito y
junto con el desarrollo de aplicaciones llamativas, ser un buen prembulo para
motivar al telespectador a comprar receptores con GINGA y consumir las aplicaciones
interactivas que se transmitan con la TDT o por IPTV.

Este estudio muestra claramente las fortalezas y debilidades de los dos


sistemas de interactividad y sobre esto con las pruebas realizadas y los resultados
obtenidos deja sentado las bases para la futura integracin total de HbbTV sobre
GINGA.

Con la creacin de la aplicacin que funciona sobre las dos plataformas se


comprob que se puede alcanzar los mismos resultados adems que permiti
realizar los anlisis comparativos cuantitativos y cualitativos de las aplicaciones.

RECOMENDACIONES

Sera interesante que se siga con el proceso de integracin para tener


plataformas de interactividad en televisin ms robustas y que para el usuario tenga
mayores posibilidades de acceder a aplicaciones interactivas de este tipo sin importar
la plataforma que se utilice. Lo cual fortalecera la posibilidad de negocios en esta
rea.

Se recomienda seguir impulsando el desarrollo de este tipo de aplicaciones


para promover la industria de la interactividad sobre la televisin que ltimamente se
ha visto un poco opacada por la interactividad que los usuarios utilizan por medio de
sus dispositivos personales, smartphones, tablets, porttiles, etc. Con el fin de tener
mayores posibilidades de integracin de la sociedad hacia las tecnologas.

Se puede tambin incursionar en investigar mecanismos que permitan a partir


de un cdigo NCL convertir en cdigo CE-HTML o un cdigo CE-HTML en cdigo NCL
para luego lograr modificar aplicaciones GINGA mediante HbbTV o viceversa.

107
REFERENCIAS

[1] Pgina oficial de HbbTV, http://www.hbbtv.org, Fecha de consulta 12-03-2014.


[2] Wikipedia Foundation, Inc., HbbTV, http://es.wikipedia.org/wiki/HbbTV, 2014,
Fecha de consulta 12-03-2014.
[3] Wikipedia Foundation, Inc., Estandar ISDB-T, http://es.wikipedia.org/wiki/ISDB-T,
2010, Fecha de consulta 12-03-2014.
[4] Wikipedia Foundation, Inc., Sistema Brasileo de Televisin Digital,
http://pt.wikipedia.org/wiki/SBTVD, 2010, Fecha de consulta 12-03-2014.
[5] M. Illescas, D. Villamarn, Implementacin de un transmisor de pruebas de tv
digital terrestre ISDB-Tb, para la emisin de aplicaciones interactivas, 2011.
[6] Televisin Digital de Argentina, Ventajas de la Televisin Digital,
http://www.minplan.gov.ar/html/tv_digital/a.php, 2010, Fecha de consulta 12-03-
2014.
[7] Pisciotta Nestor, Sistema ISDB-Tb (Primera parte), Universidad Blas Pascal,
Argentina, 2010.
[8] Villamarn, D.; Illescas, M.; Olmedo, G.; Lara, R.; Generating a Transport Stream for
Digital Terrestrial Television System in conformance with ISDB-Tb standard, IEEE
2013.
[9] Armas, F.; Olmedo, G.; Acosta, F., Anlisis de prueba de medicin de campo para
definir el sistema de TV digital para Ecuador. 2008.
[10] Arcos, N.; Olmedo, G.; Lara, R.A., Estudio de los servicios interactivos sobre
redes de televisin digital y su aplicacin en el Ecuador. 2008
[11] Morales, A.; Olmedo, G.; Lara, R.A., Diseo de la red para interactividad en
televisin digital terrestre e IPTV en el campus ESPE Sangolqu. 2010.
[12] Changoluisa, C. P.; Garzn, S; Lara, R.A.; Olmedo, G., Estudio de factibilidad para
la implementacin del canal de televisin de la Escuela Politcnica del Ejrcito.
2011.
[13] Granja, N; Olmedo, G.; Acosta, F., Anlisis del Transport Stream para el estndar
de televisin digital ISDB-TB. 2011.
[14] Torres J.; Olmedo, G.; Lara, R.A., Diseo y desarrollo de una aplicacin de
contenidos interactivos para tv digital basada en el Middleware Ginga del Sistema
Brasileo. 2010
[15] ISO / IEC 13818-1, "MPEG-2", Third Edition, Fecha de consulta 12-03-2014.
[16] ABNT NBR 15603-2, "Televiso digital terrestre Multiplexao e servios de
informao (SI) Parte 2: Estrutura de dados e definies da informao bsica de
SI" primeira edio, Diciembre 2007.
[17] Hybrid Broadcast Broadband TV. (2012, May 18). En Wikipedia,
http://en.wikipedia.org/w/index.php?title=Hybrid_Broadcast_Broadband_TV&oldi
d=493151929
[18] Mundo Interactivo. Primer servicio HbbTV en la TDT. Fecha de consulta 12-03-
2014. http://www.mundoplus.tv/noticias/?seccion=tv_digital&id=8743
[19] Mundo Interactivo. 2012 ser el ao de la televisin conectada, Fecha de
consulta 12-03-2014.
http://www.mundoplus.tv/noticias/?seccion=tv_digital&id=9383
[20] HbbTV Specification, Version 1.5, marzo de 2012. Fecha de consulta 12-03-
2014. http://www.hbbtv.org/pages/about_hbbtv/HbbTV-specification-1-5.pdf

108
[21] Hybrid Broadcast Broadband TV. ETSI TS 102 796 V1.1.1, 2010.
http://www.etsi.org/deliver/etsi_ts/102700_102799/102796/01.01.01_60/ts_1027
96v010101p.pdf. Fecha de consulta 12-03-2014.
[22] Internet TV (Web TV /TV hbrida /Smart TV) http://www.tv-
plattform.de/de/dokumente/dokumente-internetatv. Fecha consulta 12-03-2014.
[23] DVB Standards https://www.dvb.org/standards, Fecha de consulta 12-03-2014.
[24] Televisin Interactiva http://en.wikipedia.org/wiki/Interactive_television,
Fecha de consulta 12-03-2014.
[25] Televisin Interactiva, http://es.wikipedia.org/wiki/Televisi%C3%B3n_
interactiva, Fecha de consulta 12-03-2014.
[26] Qu es HbbTV?, http://www.ceskatelevize.cz/hbbtv/, Fecha de consulta 12-03-
2014.
[27] Antecedentes de HbbTV con transmisores codificados, Fecha de consulta 12-
03-2014. http://www.digitalfernsehen.de/HbbTV-bei-codierten-Sendern-Seite-
2.113447.0.html
[28] Llega la Televisin hbrida, Fecha de consulta 12-03-2014.
http://elpais.com/diario/2011/06/18/radiotv/1308348003_850215.html
[29] La televisin conectada: inteligente o hbrida?, Fecha de consulta 12-03-2014.
http://www.ocu.org/tecnologia/television/noticias/television-conectada
[30] Canales y servicios hbridos. http://www.tdthibrida.es/canales.php, Fecha de
consulta 12-03-2014.
[31] Dispositivos de la TDT Hbrida. http://www.tdthibrida.es/dispositivos.php,
Fecha de consulta 12-03-2014.
[32] AEDETI (Asociacin Espaola de TV Digital Interactiva). www.aedeti.com, Fecha
de consulta 12-03-2014.
[33] Ramn Jess Milln, Televisin Digital Terrestre TDT
http://www.ramonmillan.com/tutoriales/tdt.php, Fecha de consulta 12-03-2014.
[34] One-seg TV Digital Mvil http://blog.pucp.edu.pe/item/79299/one-seg-tv-
digital-movil, Fecha de consulta 12-03-2014.
[35] Televisin Digital Terrestre TDT, Fecha de consulta 12-03-2014.
http://wikitel.info/wiki/Televisi%C3%B3n_digital_terreste,
[36] Interactividad.http://www.televisiondigital.es/tecnologias/Interactividad/Pagi
nas/tdt-hibrida.aspx, Fecha de consulta 12-03-2014.
[37] Segunda Generacin DVB-T2 Fecha de consulta 12-03-2014.
https://www.dvb.org/resources/public/factsheets/dvb-t2_factsheet.pdf
[38] Matthew Huntington, Qu es HbbTV, Fecha de consulta 12-03-2014.
http://www.nagra.com/dtv/company/newsroom/headlines/what-is-hbbtv/
[39] Las nuevas tendencias de la Televisin Hbrida, HbbTv
http://www.redestelecom.es/tendencias/reportajes/1050192003003/television-
hibrida-ya-aqui.1.html, Fecha de consulta 12-03-2014.
[40] Estado actual de los estndares de TV Digital en el mundo
http://www.dtvstatus.net/map/map.html, Fecha de consulta 12-03-2014.
[41] Pgina oficial de GINGA http://www.ginga.org.br, Fecha de consulta 12-03-2014.
[42] MERITXELL, Estebanell, Interactividad e Interaccin, Universidad de Girona
Espaa, http://web.udg.edu/pedagogia/images/gretice/INTERACT.pdf,

109
[43] AYMERICH, Laura, Los nuevos formatos de publicidad interactiva en televisin,
Grupo de investigacin consolidado del Departamento de Comunicacin
Audiovisual y Publicidad de la UAB.
[44] ARCINIEGAS, Jos, AMAYA, Juan, URBANO, Franco, CAMPO, Wilmar,
EUSCATEGUI, Robert, GARCA, Alexander, GARCA, Xabiel, EDiTV: Educacin virtual
basado en televisin interactiva para soportar programas a distancia, Universidad
del Cauca Colombia, Universidad Autnoma de Occidente Colombia,
Universidad de Oviedo Espaa.
[45] PRADO, Emili, FRANQUET, Rosa, SOTO, Mara, RIBES, Xavier, FERNNDEZ, David,
Tipologa funcional de la televisin interactiva y de las aplicaciones de interaccin
con el televisor
[46] SIMIONI, Adriano, Un framework para el desenvolvimiento de aplicaciones
interactivas para Televisin Digital, Centro de Ciencias exactas y Tecnolgicas,
Universidad de Vale do Rio dos Sinos.
[47] LAIOLA GUIMARES, Rodrigo, DE RESENDE COSTA, Romualdo, Interactividad y
Sincronizacin en TV Digital, Departamento de Informtica, PUC de Rio.
[48] RIBEIRO, Jean, Middleware Ginga, Departamento de Ingeniera, Universidad
Federal Fluminense, 2010.
[49] ABNT NBR 15606-5 Asociacin Brasilera de Normas Tcnicas Televisin
Digital Terrestre Codificacin de datos y especificaciones de transmisin para
radiodifusin digital Parte 5: Ginga-NCL para receptores porttiles Lenguaje
aplicacin XML para codificacin de aplicaciones Sistema Brasilero de TV Digital
Terrestre, 2008.
[50] ABNT NBR 15606-4 Asociacin Brasilera de Normas Tcnicas Televisin
digital terrestre Codificacin de datos y especificaciones de transmisin para
radiodifusin digital Parte 4: Ginga-J Ambiente para ejecucin de aplicaciones
de procedimiento Sistema Brasilero de TV Digital Terrestre, 2010.
[51] GOMES, Luiz, FERREIRA Rogiro, FERREIRA, Mrcio, Ginga-NCL: El Ambiente
Declarativos del Sistema de TV Digital Brasilera, Departamento de Informtica,
Pontificia Universidad Catlica de Rio de Janeiro, 2009.
[52] LEMOS DE SOUZA, Guido, CUNHA, Luiz, COELHO Carlos, Ginga-J: El Middleware
de Procedimiento del Sistema de TV Digital Brasilera, Departamento de
Informtica, Universidad Federal de Paraba, 2009.
[53] GOMES SOARES, Luiz, JUNQUEIRA BARBOSA, Simone, Programando en NCL
3.0, Editorial Elsevier, Tercera Edicin, 2009.
[54] CARVALHO, Rafael, FERREIRA, Joel, RIBEIRO, Jean, VARANDA, Julia, MUCHALUAT,
Debora, Introduccin a los Lenguajes NCL y Lua: Desarrollando Aplicaciones
Interactivas para TV Digital, Laboratorio MdiaCom, Universidad Federal
Fluminense, 2010.
[55] Pgina oficial de Berkelium Web Browser. http://berkelium.org/
[56] Wikipedia Foundation, Inc., Google Chrome Web Browser,
http://es.wikipedia.org/wiki/Google_Chrome, 2014, Fecha de consulta 12-06-2014.
[57] Wikipedia Foundation, Inc., Mozilla Firefox Web Browser,
http://es.wikipedia.org/wiki/Mozilla_Firefox, 2014, Fecha de consulta 12-06-2014.
[58] HbbTV Firefox plugin. https://addons.mozilla.org/es/firefox/addon/firehbbtv/,
2014, Fecha de consulta 12-06-2014.

110
[59] HbbTV Fire plugin http://tum-iptv.aw.atosorigin.com/firehbbtv/#presentation,
2014, Fecha de consulta 12-06-2014.
[60] Chromium Embedded Framework Project Information
https://code.google.com/p/chromiumembedded/, 2014, Fecha de consulta 12-06-
2014.
[61] Wikipedia Foundation, Inc., Chromium Embedded Framework Web Browser,
http://en.wikipedia.org/wiki/Chromium_Embedded_Framework, 2014, Fecha de
consulta 12-06-2014.
[62] Chromium Embedded Framework download. http://cefbuilds.com/.
[63] Opera HbbTV Emulator software. http://www.operasoftware.com/products/tv-
emulator
[64] Wikipedia Foundation, Inc., Opera Web Browser,
http://es.wikipedia.org/wiki/Opera_(navegador), Fecha de consulta 12-06-2014.
[65] Wikipedia Foundation, Inc., Iceweasel Web Browser,
http://es.wikipedia.org/wiki/Iceweasel, 2014, Fecha de consulta 12-06-2014.
[66] Wikipedia Foundation, Inc., WebKit Web Browser,
http://es.wikipedia.org/wiki/Webkit, 2014, Fecha de consulta 12-06-2014.
[67] Wikipedia Foundation, Inc., Konqueror Web Browser,
http://es.wikipedia.org/wiki/Konqueror, 2014, Fecha de consulta 12-06-2014.
[68] Pgina oficial del navegador Konqueror de KDE http://www.konqueror.org, 2014,
Fecha de consulta 12-06-2014.
[69] Pgina oficial de la plataforma y del navegador ANT Galio,
http://www.antlimited.co.uk/ant_galio_browser.asp?menu=153, 2014, Fecha de
consulta 12-06-2014.
[70] Wikipedia Foundation, Inc., Comparison of web browsers,
http://en.wikipedia.org/wiki/Comparison_of_web_browsers, 2014, Fecha de
consulta 12-06-2014.
[71] Wikipedia Foundation, Inc., Anexo. Comparativa de los navegadores,
http://es.wikipedia.org/wiki/Anexo:Comparativa_de_navegadores_web, 2014,
Fecha de consulta 12-06-2014.
[72] Compare Best Open Source Web Browsers. http://web-
browsers.findthebest.com/saved_search/Best-Open-Source-Web-Browsers, 2014,
Fecha de consulta 12-06-2014.
[73] Show alternatives of web browsers. http://alternativeto.net/software/opera/,
2014, Fecha de consulta 12-06-2014.
[74] Fuentes e informacin sobre la instalacin del plugging de Eclipse NCL,
disponibles en http://laws.deinf.ufma.br/ncleclipse/es:install#.VCJdm_l_uSo.
[75] Visual Studio http://www.visualstudio.com/.
[76] Introduccin y Manuales de la herramienta Autotools sobre Linux
http://www.gnu.org/software/automake/manual/html_node/Autotools-
Introduction.html
[77] Jos Daniel Gambn Tomasi, DESARROLLO DE UN SERVICIO DE TELEVISIN
INTERACTIVA HbbTV SEGN EL ESTNDAR ETSI TS 102 796 v1.1.1 (JUN 2010),
Universidad Politcnica de Cartagena 2012.
[78] Wikipedia Foundation, Inc., Calidad de Experiencia, (QoE, Quality of
Experience), http://es.wikipedia.org/wiki/Calidad_de_experiencia, 2014, Fecha de
consulta 12-06-2014.

111
GLOSARIO

ADSL Asincronic Digital Suscriptor Line - Lnea Digital de Suscripcin


Asincrnica.

AIT Application Information Table - Tabla de informacin de la aplicacin.

API Application Programming Interface - Interface de programacin de


aplicaciones

ATSC Advanced Television System Committee Comit de Sistemas de


Televisin Avanzados.

BML Broadcast Markup Language Lenguaje de Marcas del Radiodifusor.

BST Band Segmented Transmission - Transmisin de Banda Segmentada.

CE Consumer Electronic - Electrnica de Consumo

CEA Consumer Electronic Association - Asociacin de Electrnica de Consumo

COFDM Coded Orthogonal Frequency Division Multiplexing - Multiplexacin por


Divisin de Frecuencias Ortogonales Codificadas

CSS Cascading Style Sheets - Hojas de Estilo en Cascada.

DLNA Digital Living Network Alliance - Alianza para el estilo de vida digital en
red

DQPSK Differential Quadrature Phase Shift Keying Modulacin por


desplazamiento de fase diferencial.

DSM-CC Digital Storage Media Command and Control - Comando de control del
almacenamiento de medios digitales.

DTMB Digital Terrestrial Multimedia Broadcast Radiodifusin Digital


Terrestre de Multimedia.

DVB Digital Video Broadcasting - Radiodifusin de Vdeo Digital.

ES Elementary Stream - Flujo Elemental.

EDTV Enhanced Definition Television - Televisin Digital Mejorada

EPG Electronic Program Guide - Gua de Programacin electrnica.

FTTx Fiber to the X (Home, Build, etc.) - Fibra hasta la Casa, Edificio, Etc.

112
GEM Globally Executable MHP - MHP Ejecutable Global.

GPLv2 General Public License version 2 - Licencia Pblica General Version 2.

HbbTV Hybrid Broadcast Broadband TV - TV hbrida radiodifundida y banda


ancha.

HD High-definition - Alta Definicin.

HDTV High Definition Television - Televisin de Alta Definicin.

HE-AAC High-Efficiency Advanced Audio Coding- Codificacin de Audio Avanzado


de Alta eficiencia.

HTML HyperText Markup Language - Lenguaje de marcas de hipertexto

CE-HTML Customer Electronic - HyperText Markup Language - Lenguaje de marcas


de hipertexto para dispositivos de Electrnica de Consumo

IP Internet Protocol - Protocolo de Internet.

IPTV Internet Protocol Television- Televisin sobre un protocolo de Internet.

ISDB-T Integrated Services Digital Broadcasting-Terrestrial - Servicios


Integrados de Radiodifusin Digital - Terrestre.

ISDB-TB Integrated Services Digital Broadcasting-Terrestrial Brazil - Servicios


Integrados de Radiodifusin Digital - Terrestre Brasil.

LCD Liquid Crystal Display Pantalla de cristal lquido.

LDTV Low-definition television - Televisin de Baja Definicin.

MHP Multimedia Home Platform - Plataforma multimedia para el hogar

MPEG Moving Picture Experts Group - Grupo de Expertos en Imgenes


Dinmicas.

NCL Nested Context Language Lenguaje de Contextos Anidados.

OFDM Orthogonal Frequency Division Multiplexing - Multiplexacin por


Divisin de Frecuencias Ortogonales.

OIPF Open IPTV Forum - Foro Abierto de IPTV

OTT Over the top Technology.

PCR Program Clock Reference - Referencia de Reloj para los Programas.

PES Packetized Elementary Stream - Flujo Elemental Empaquetado.

113
PID Packet Identifier - Identificador do Paquetes.

PIXEL Picture element - Elemento de imagen.- es la menor unidad homognea


en color que forma parte de una imagen digital, ya sea esta una
fotografa, un fotograma de vdeo o un grfico.

PMT Program Map Table Tabla de Mapeamiento de Programas

QAM Quadrature Amplitude Modulation - Modulacin en Amplitud y


Cuadratura.

QoE Quality of Experience - Calidad de experiencia.

QoS Quality of Service - Calidad de servicio.

QPSK Quadrature Phase Shift Keying - Modulacin de Fase en Cuadratura.

RF Radio Frequency - Radio Frecuencia.

SBTVD Sistema Brasileo de Televisin Digital.

SDTV Standard Definition Television - Televisin de Definicin Estndar.

SI Service Information - Tablas de Informacin del Sistema.

STB Set Top Box Decodificador para TV Digital.

SVOD Suscriptor Video on Demand - Video bajo demanda por suscripcin.

TDT Televisin Digital Terrestre.

TS Transport Stream - Flujo de Transporte.

UIT Unin Internacional de Telecomunicaciones.

UHDTV Ultra High Definition TV - Televisin de Ultra Alta Definicin

UHF Ultra High Frequency Frecuencias Ultra Altas

VoD Video on demand - Video bajo demanda.

VSB Vestigial Side Band Modulacin de banda lateral vestigial.

W3C World Wide Web Consortium - Consorcio del amplio mundo de la red.

WLAN Wireless Local Area Network Red de rea local inalmbrica.

XHTML Extensible HyperText Markup Language - Lenguaje de marcas de


hipertexto extensible.

XML eXtensible Markup Language Lenguajes de marcas extensible.

114
ANEXO 1

HOJA TCNICA SET TOP BOX EITV


EiTV Developer Box es un set-top box hbrido (ISDB-T e IPTV) enfocado en
desarrolladores de aplicativos Ginga (DTVi), compatible con los estndares declarativo
(Ginga-NCL / Lua) e imperativo (Ginga-J / JavaDTV) que fueron especificados para el
Sistema Brasileo de TV Digital (SBTVD).
El producto permite que los desarrolladores de aplicativos ejecuten sus aplicativos sin
la necesidad de transmitirlos en la seal de la emisora de TV digital. De esta manera, el
desarrollador podr probar localmente su aplicativo, antes de publicarlo para ser
transmitido por la emisora de TV.

El EiTV Developer Box es indicado para uso en emisoras de TV, empresas


desarrolladoras de aplicativos, agencias de publicidad, universidades, institutos de I&D
y tambin por cualquier persona o empresa interesada en desarrollar aplicativos para
TV digital.
El EiTV Developer Box, por poseer soporte a canales IP, tambin es adecuado para
utilizarlo en soluciones IPTV y Digital Signage.
SET-TOP BOX HBRIDO (ISDB-T Y IPTV)
Vista en perspectiva:

CARACTERSTICAS TCNICAS
Front-End (Tuner + Demodulador):
Frecuencia de Entrada :
UHF: 470MHz(CH14) a 806MHz (CH69)
VHF: 174MHz(CH7) a 216MHz (CH13)
Ancho de Banda: 5.6MHz
Nivel de Seal: -85 dBm la -20 dBm
Seal: Compatible con el sistema ISDB-T
Impedancia de Entrada: 75 Ohms (nominal)
Conexin de entrada/salida: Conector F
Unidad de Procesamiento:
Procesador: STi 7105 (CPU 450 MHz)
Memoria RAM: 256 Mbytes

115
Memoria Flash: 128 Mbytes
Decodificacin de Vdeo:
Estndar: Rec. ITU-T H.264 (MPEG-4 AVC)
Profile: HP@L4.0
Formatos: 480i y 1080i
Frame Rate: 25, 30, 50 y 60MHz
Frecuencia de vdeo: 50 y 60Hz
Decodificacin de Audio:
Estndar: ISO/IEC 14496-3 (MPEG-4 AAC) (SBR)
Profile: AAC@L4 y HE-AAC@L4
Panel Frontal:
Botones: cambio de canales y enciende/apaga (stand-by)
Sensor infrarrojo para el control remoto
Interfaces de comunicacin:
High Speed USB 2.0
Ethernet 100 Mbps (RJ45)
Interfaces de salida:
Salida Digital de Audio y Vdeo (HDMI)
Salida de Vdeo Componente (YPbPr)
Salida de Audio Estreo 1 (D + Y)
Salida de Vdeo Compuesto (CVBS A/V)
Salida de Audio Estreo 2 (D + Y)
Salida de Audio Digital (SPDIF coaxial)
Fuente de Energa:
Tensin de Entrada: 100 ~ 240V AC, 50-60Hz
Consumo: 8W
Dimensiones:
Dimensiones: 37 x 187 x 220 mm
Peso: 960g

Vista trasera:

CARACTERSTICAS ADICIONALES

Interactividad completa (DTVi Ginga);

116
Muestra slo vdeo y audio del canal de difusin;
Carga de aplicativos por aire, va Internet o red local;
Soporte simultneo a canales ISDB-T e IPTV (va UDP y RTP);
Aplicativo grfico (GUI) va Web Server para la instalacin y configuracin de los
aplicativos Ginga (DTVi) y canales IPTV;
Ajuste de la imagen en la pantalla del televisor;
Control del bloqueo de canales por edad, con contrasea;
Compatible con los estndares de colores PAL-M y NTSC;
Bsqueda automtica de canales;
Gua de programacin electrnica (EPG);
Men en portugus, ingls o espaol;
Seleccin de audio.
TEMS INCLUIDOS

1 Convertidor Digital;
1 Manual de instrucciones;
1 Control Remoto;
2 Pilas/bateras AAA;
1 Cable HDMI;
1 Cable RCA.

MS INFORMACIN

EiTV - Entretenimiento & Interactividad para Televisin Digital


Rua Rafael Andrade Duarte, 600, 6 Andar.
Jardim Paraso - CEP 13.100-011 - Campinas - SP - Brasil
Telfono/Fax: (19) 3579-0744

117
ANEXO 2

Televisor TOSHIBA 32SL833G Especificaciones

Eco
Clase Energtica :C
EU Etiqueta Ecolgica :Si
Contenido en Mercurio :Diseo Mandos Tctiles
Componentes de Plomo (Directiva RoHS
:Si
incluyendo exenciones)
Fijacin Pared (VESA) :200 x 200 (M6)
Modo Tienda
Etiqueta Digital Demo :Si
Resolution + demo :Si
Active Vision 100Hz demo :Si
Alimentacin
Consumo en Stand-by (W) :0.212
Consumo Mximo EN60065 -(W) :93
Tensin Alimentacin :220-240V 50-60Hz
Consumo energa anual (Media) :96.8272
Consumo EN62087 - Modo Hogar (W) :66.32
Otras Caractersticas
Auto Formato :Si
Modo Hotel :Si
Apagado sin seal :Si
Temporizador :Si
Bloqueo de Pqanel :Si
Audio Descripcin (Slo UK) :Si
Congelacin de Pantalla :Si
Ampliacin de 4 :3 Si
Clonado :Si
Accessorios Incluidos
Bateras Mando a Distancia :R03(AAA) x2
Pedestal incluido :Si
Manual de Instrucciones :Si
Mando a Distancia (Tipo) :CT-90369
Personal-TV
Configuracin Personal de Volumen :Si
Configuracin Personal de Imagen :Si

118
Lista Personal de Favoritos :Si
Configuracin para 4 usuarios :Si
Organizador Personal de Grabaciones :Si
Imagen
Reduccin Digital de Ruido (DNR) :Si
Real Digital Picture :Si
200 Active Motion Rate (AMR) / Ratio
:Si
Refresco Imagen
LED-TV :Si
Resolution Panel :1920 x 1080
Meta Brain :Si
3D Digital Comb Filter :Si
LED Edge :Si
Formato Pantalla :16:9
Contraste Dinmico Ratio :4.000.000:1
3D Colour Management :Si
Sensor Ambiental :Si
Resolution+ :Si
Seleccin Manual de tamao Pantalla :Si
Full HD - Alta Definicin 1080p :Si
Exact Scan Mode :Si
Diagonal pantalla (cm/pulgadas) :81/32
Control Activo de Retroiluminacin :Si
24p Mode : Standard | Smooth Si
Temperatura de Color Seleccionable :Si
Angulo de Visin () :178
Tiempo de Respuesta (G a G) (ms) :505
Brillo (cd/m2) :450
Reduccin de Ruido MPEG :Si
Accessorios Optionales
Adaptador USB WiFi (Dongle) :Si
Sonido
NICAM Stereo :Si
Audyssey EQ :Si
Potencia de Sonido (RMS) W :2 x 10
Dolby Digital Plus :Si
Sound Navi :Si
Dolby Volume :Si
Modos Imagen

119
Pelcula :Si
Comercio :Si
Standard :Si
Juego :Si
Dinmico :Si
AutoView :Si
Conexiones
INSTAPORT :Si
Analogue audio (Cinch) | Audio (mini Sck) :Si ISi
Euroconector :Si
1080p, 1080i, 720p, 720i, 576p, 576i, 480p,
:Si I Si
480i | 24Hz (24p)
Video Componentes :Si
Entrada PC :Si
Version 1.4 | Canal Retorno Audio | HDMI
Canal Ethernet| Mejora de Contenido Audio | :Si , Si , - , Si
3D
Nmero de USB :2
HDMI :4
USB :Si
Salida de Audio Digital :Si
REGZA-Link (HDMI-CEC) :Si
LAN :Si
Euroconector(RGB | S-Video | AV) :Si
Video Compuesto :Si
Auricular :Si
Ajustes Experto
3D Colour Management :Si
Copiado a todas las Entradas :Si
Ajustes Gamma :Si
Preajustes : Hollywood Mode 1 & 2 (Modo Da/Noche) Si
601/709 Seleccin Decodificado de Color :Si
Plantilla Universal de Ajuste Integrada :Si
Filtro RGB :Si
HDMI Informacion :Si
Ajuste de Escala de Grises :Si
Dimensiones
Fondo con Pedestal (mm) :258
Peso con Pedestal (kg) :12.1

120
Fondo sin Pedestal (mm) :35.8
Peso sin Pedestal (kg) :8.9
Altura Embalaje (mm) :560
Ancho Embalaje (mm) :1060
Fondo Embalaje (mm) :95
Altura con Pedestal (mm) :526
Ancho (mm) :752
Altura sin Pedestal (mm) :473
Peso Embalaje (kg) :13.25
Caractersticas Interactivas
Memoria de Pginas TXT :500
Teletexto :Si
Gua Electrnica de Programacin de 8 das :Si
Memorizacin de Canales Favoritos :Si
Now and Next Informacin :Si
Caractersticas USB
Audio (USB) :MP3, MP4
:AVCHD, AVCHD Lite, mts, m2ts, H.264,
Vdeo (USB) MPEG2-PS, mpg, mpeg, MPEG2, MP4, mp4,
m4v
Foto (USB) :JPEG
Sintonizacin
H.264 :Si
Interfaz Comn+ (CI+) :Si
Auto Set-up :Si
Analgico :Si
TDT :Si
NTSC Video-Playback :Si
Sintonizador DVB Cable (HD) :Si
TV Standards :PAL I/BG/DK; SECAM BG/DK/L, NTSC BG 4.43
Nmero de Canales :ATV (100) , DTV (9999)
Smart-TV
DLNA DMP :Si
Compatible Windows 7 :Si
WiFi Protected Setup (WPS) :Si
Wireless Ready (con Llave WIFI Toshiba
:Si
opcional)
HbbTV :Si
Aplicacin Regza para Telfonos Mviles :Si

121
DLNA :Si
Toshiba Media Controller compatible :Si
Toshiba Places :Si
DLNA DMR :Si
You Tube :Si
Procesador
Procesador : ARM (CPU 800 Mhz)
RAM DDR :500 MByte
Memoria Flash :1 GByte

122
123
ANEXO 3.

rojo.js Funcin que inicializa la aplicacin HbbTV

function startAll(){
hbbtvlib_initialize();
hbbtvlib_show();
applicationIsVisible = true;
registerKeyEventListener();
initApp();
}// JavaScript Document

base.js Funcin que controla la interaccin de la aplicacin.

var opts = false;


var selected = 0;
function initVideo() {
try {
document.getElementById('video').bindToCurrentChannel();
} catch (e) {
// ignore
}
try {
document.getElementById('video').setFullScreen(false);
} catch (e) {
// ignore
}
}

function initApp() {
try {
var app = document.getElementById('appmgr').getOwnerApplication(document);
app.show();
app.activate();
} catch (e) {
// ignore
}
setKeyset(0x1+0x2+0x4+0x8+0x10);
}

function setKeyset(mask) {
// for HbbTV 0.5:
try {
var elemcfg = document.getElementById('oipfcfg');
elemcfg.keyset.value = mask;
} catch (e) {
// ignore
}
try {
var elemcfg = document.getElementById('oipfcfg');
elemcfg.keyset.setValue(mask);
} catch (e) {
// ignore
}
// for HbbTV 1.0:

124
try {
var app = document.getElementById('appmgr').getOwnerApplication(document);
app.privateData.keyset.setValue(mask);
app.privateData.keyset.value = mask;
} catch (e) {
// ignore
}
}

function registerKeyEventListener() {
document.addEventListener("keydown", function(e) {
if (handleKeyCode(e.keyCode)) {
e.preventDefault();
}
}, false);
}

function menuInit() {
opts = document.getElementById('indice').getElementsByTagName('li');
menuSelect(0);
}

function menuSelect(i) {
if (i<=0) {
i = 0;
} else if (i>=opts.length) {
i = opts.length-1;
}
selected = i;
var scroll = Math.max(0, Math.min(opts.length-13, selected-6));
for (i=0; i<opts.length; i++) {
opts[i].style.display = (i>=scroll && i<scroll+13) ? 'block' : 'none';
opts[i].className = selected==i ? 'lisel' : '';
}
}

function showStatus(succss, txt) {


var elem = document.getElementById('status');
elem.className = succss ? 'statok' : 'statfail';
if (!txt) {
elem.innerHTML = '';
return;
}
elem.innerHTML = '<b>Status:<'+'/b><br />'+txt;
if (succss) {
setInstr('Test succeeded, please execute the next test<br />(press OK).');
if (opts) menuSelect(selected+1);
} else {
setInstr('Test failed, please return to test menu<br />(press OK).');
if (opts) menuSelect(opts.length-1);
}
}

function setInstr(txt) {
document.getElementById('instr').innerHTML = txt;
}

125
botonesindex.js Funcin que carga el Link del botn rojo.

var req = false;


function handleKeyCode(kc) {
if (kc==VK_UP) {
return true;
} else if (kc==VK_DOWN) {
return true;
} else if (kc==VK_RED) {
document.location.href = '../diego/segundo.htm';
return true;
} else if (kc==VK_GREEN) {
return true;
} else if (kc==VK_YELLOW) {
return true;
}
}

hbbtvlib.js Librera de HbbTV que siempre se debe cargar en toda aplicacin.


/**
* HbbTV library v1.0
*
* (C) 2009, IRT GmbH
*
* Overview:
*
* You need to add the OIPF application manager and the oipf configuration
* embedded object to your HTML DOM tree e.g.:
*
<div style="visibility: hidden; display: none;">
<object type="application/oipfApplicationManager" id="oipfAppMan"> </object>
<object type="application/oipfConfiguration" id="oipfConfig"> </object>
</div>
*
* Before using any other function call the initializer first.
*
* function hbbtvlib_intialize()
* Creates and initializes HbbTV, i.e. OIPF DAE, embedded objects.
* Always call this function prior to other functions of this library.
*
* function hbbtvlib_show()
* Shows the application and requests keys via the keyset object.
*
* function hbbtvlib_hide()
* Hides the application and releases keys via the keyset object.
*
* function hbbtvlib_createApp()
* Create applications with the OIPF Application Manager
*
* function hbbtvlib_closeApp()
* Destroys this application.
*
* function hbbtvlib_init_broadcast()
* Convenience function that integrates the broadcast video in your application.
*
* function hbbtvlib_release_broadcast()

126
* Convenience function that removes the broadcast video from your application.
*
* function hbbtvlib_current_service()
* Returns the DVB service ID.
*/

/**
* The last error occured in hbbtvlib. If one of the functions returns false,
* the error can be retrieved via this property.
*/
var hbbtvlib_lastError = "no error";

/**
* @return true if OIPF functions are available
*/
function hbbtvlib_initialize() {
try {
int_createOipfObjs();

var appMgr = int_objs[int_objTypes.appMan];


if (appMgr && typeof(appMgr.getOwnerApplication) != "undefined")
int_app = appMgr.getOwnerApplication(document);
else {
hbbtvlib_lastError = "no application manager";
int_app = null;
return false;
}
return int_initKeysetObj();
} catch (e) {
hbbtvlib_lastError = e;
int_app = null;
}
return false;
};

/**
* This function does everything HbbTV requires an application to do
* when it wants to get visible.
*
* @return
*/
function hbbtvlib_show() {
try {
int_app.show();
if (typeof int_app.activate != "undefined") int_app.activate();
if (typeof int_app.activateInput != "undefined") int_app.activateInput();
int_keyset.setValue(int_ksVisible);
return true;
} catch (e) {
hbbtvlib_lastError = e;
return false;
}
}

/**
* This function does everything HbbTV requires an application to do
* when it wants to transition to the hidden state.

127
*
* @return
*/
function hbbtvlib_hide() {
try {
if (int_bc_video) int_bc_video.style.visibility = "visible";
int_app.hide();
int_keyset.setValue(int_ksHidden);
return true;
} catch (e) {
hbbtvlib_lastError = e;
return false;
}
}

/**
* Overrides the default keysets.
* Default is RED for hidden state, all for visible state.
*
* @param visibleSet a keyset bitmask
* @param hiddenSet a keyset bitmask
* @return
*/
function hbbtvlib_setKeysets(visibleSet, hiddenSet) {
if (typeof visibleSet == "Number") int_ksVisible = visibleSet;
if (typeof hiddenSet == "Number") int_ksHidden = hiddenSet;
};

/**
* Starts a new application and destroys this application.
*
* @param dvbUrl including organization and application ids
* @param httpUrl a fallback URL
*
* @return false
*/
function hbbtvlib_createApp(dvbUrl, httpUrl) {
if (int_app) {
try {
if (dvbUrl && int_app.createApplication(dvbUrl, false)) {
int_app.destroyApplication();
return true;
}
hbbtvlib_lastError = "Failed to launch dvb URL: " + dvbUrl;
} catch (e) {
hbbtvlib_lastError = e;
}
try {
if (httpUrl && int_app.createApplication(httpUrl, false)) {
int_app.destroyApplication();
return true;
}
hbbtvlib_lastError = "Failed to launch http URL: " + httpUrl;
} catch (e) {
hbbtvlib_lastError = e;
}

128
return false;
} else if (httpUrl) {
document.location.href = httpUrl;
}
hbbtvlib_lastError = "OIPF application manager not available";
return false;
};

/**
* Destroys this application.
*
* @param fallBackUrl
* @return
*/
function hbbtvlib_closeApp(fallBackUrl) {
if (int_app) {
try {
int_app.destroyApplication();
} catch (e) {
hbbtvlib_lastError = e;
}
} else if (fallBackUrl) {
document.location.href = fallBackUrl;
} else {
window.close();
}
return false;
};

/**
* Handle OIPF DAE Broadcast video
*/
var int_bc_video = null;
var int_bc_container = null;
var int_currentChannel = null;

/**
* Creates and initializes a broadcast video inside the element
* identified by the containerId. If no bc video can be included
* the dummy picture is added instead of the bc.
*
* @param parentId the id of the HTML container where the video/broadcast object will be added
* @param objId id which shall be set for the video/broadcast object
* @param dummyPic an optional picture to be shown if video/broadcast can not be added
*
*/
function hbbtvlib_init_broadcast (parentId, objId, dummyPic) {
try {
int_bc_container = document.getElementById(parentId);
if (!int_bc_container) return false;

// root container for video/broadcast object


int_bc_container.innerHTML = '<object id="' + objId + '" type="video/broadcast" style="visibility:
visible;"> </object>';
int_bc_video = document.getElementById(objId);

// check if OIPF video/broadcast object is supported

129
// window.setTimeout(function () {
try {
if (typeof (int_bc_video.bindToCurrentChannel) != 'undefined') {
int_bc_video.onChannelChangeSucceeded = function (channel)
{
int_currentChannel = channel;
};
int_bc_video.onChannelChangeError = function (channel, errorState)
{
int_vb_onError(objId, dummyPic);
};
int_bc_video.bindToCurrentChannel();
} else if (dummyPic) {
hbbtvlib_lastError = "video/broadcast object not supported";
int_bc_container.innerHTML = '<img id="'+ objId + '" src="' + dummyPic + '" alt="TV Bild" />';
}

} catch (ex) {
hbbtvlib_lastError = ex;
int_vb_onError(objId, dummyPic);
}
// }
// , 1000);

return true;

} catch (e) {
hbbtvlib_lastError = e;
int_vb_onError(objId, dummyPic);
}
return false;
};

function int_vb_onError (objId, dummyPic) {


if (dummyPic) {
int_bc_container.innerHTML = '<img id="'+ objId + '" src="' + dummyPic + '" alt="TV Bild" />';
} else
{
int_bc_container.innerHTML = "";
}
int_currentChannel = null;
int_bc_video = null;
}

/**
* Releases the video/broadcast object and removes the object from the DOM.
*/
function hbbtvlib_release_broadcast () {
try {
if (int_bc_video && typeof (int_bc_video.release) != "undefined") {
int_bc_video.release();
int_bc_video = null;
}
if (int_bc_container) {
int_bc_container.innerHTML = "";
int_bc_container = null;
}

130
int_currentChannel = null;
} catch (e) {
hbbtvlib_lastError = e;
}
};

/**
* Requires hbbtvlib_init_broadcast
*
* @return the DVB service id of the current presented service or -1
*/
function hbbtvlib_current_service () {
try {
return int_bc_video.currentChannel.sid;
} catch (e) {
hbbtvlib_lastError = e;
}
return -1;
};

/**
* Tunes to a DVB service identified by the DVB Triplet. The application may
* get killed due to the application life cycle, i.e. if it is not signalled
* with their application ID on the tuned service.
*
* @param onid the original network id
* @param tsid the transport stream id
* @param sid the service id
*
* @return false if there is no video broadcast object available or there is no
* channel found for this triplet
*/
function hbbtvlib_tuneTo(onid, tsid, sid) {
try {
var chLst = int_bc_video.getChannelConfig().channelList;

onid = (typeof(onid) == 'number') ? onid : parseInt(onid, 10);


tsid = (typeof(tsid) == 'number') ? tsid : parseInt(tsid, 10);
sid = (typeof(sid) == 'number') ? sid : parseInt(sid, 10);

var ch = chLst.getChannelByTriplet(onid, tsid, sid);

if (ch == null) {
hbbtvlib_lastError = "Tuning failed, no channel object found for given DVB triplet.";
return false;
}

int_bc_video.setChannel(ch, false);

return true;
}catch (e) {
hbbtvlib_lastError = "Tuning failed due to " + e;
}
return false;
};

/*

131
* Library internal (private) properties and functions.
*/

/**
* Array of OIPF DAE embedded objects. Access Key is the mime-type without "application/".
*/
var int_objs = new Array();

var int_objTypes = {
appMan: "oipfApplicationManager",
config: "oipfConfiguration"
};

/**
* OIPF DAE Application object
* - to show/hide the application
* - create or destroy applications
* - providing the keyset object
*/
var int_app = null;

/**
* The OIPF keyset object used to request keys from terminal.
*
* Usually this is the RED button in hidden mode, and up to all
* available keys in visible mode.
*/
var int_keyset = null;

var int_ksHidden = null;

var int_ksVisible = null;

/**
* Internal function to create OIPF embedded objects,
* like ApplicationManager etc., if not already existing.
*/
function int_createOipfObjs() {
if (int_objs.length) return;
// Look for existing objects
var objects = document.getElementsByTagName("object");
for (var i=0; i<objects.length; i++) {
var sType = objects.item(i).getAttribute("type");
//alert(sType);
for (var eType in int_objTypes) {
if (sType == "application/" + int_objTypes[eType]) {
int_objs[int_objTypes[eType]] = objects.item(i);
}
}
}
};

/**
* Retrieves the keyset object for HbbTV 1.1.1 and 0.5 implementations.
*
* Sets default keysets for hidden and visible modes.
*/

132
function int_initKeysetObj () {
// try HbbTV 1.1.1
try {
int_keyset = int_app.privateData.keyset;
hbbtvlib_lastError = "privateData";
} catch (e) {
int_keyset = null;
// try HbbTV 0.5
try {
var tmp = int_objs[int_objTypes.config].keyset;
tmp.setValue = function (val) {
this.value = val;
};
int_keyset = tmp;
hbbtvlib_lastError = "oipfConfig";

} catch (e) {
int_keyset = null;
}
}

if (int_keyset) {
// set default key sets
if (!int_ksHidden) int_ksHidden = int_keyset.RED;
if (!int_ksVisible) int_ksVisible = 0x33F; // color + nav + vcr + numeric + alpha
}

return int_keyset != null;


};

keycode.js Librera de HbbTV que escucha cuando una tecla fue presionada.

if (typeof(KeyEvent)!='undefined') {
if (typeof(KeyEvent.VK_LEFT)!='undefined') {
var VK_LEFT = KeyEvent.VK_LEFT;
var VK_UP = KeyEvent.VK_UP;
var VK_RIGHT = KeyEvent.VK_RIGHT;
var VK_DOWN = KeyEvent.VK_DOWN;
}
if (typeof(KeyEvent.VK_ENTER)!='undefined') {
var VK_ENTER = KeyEvent.VK_ENTER;
}
if (typeof(KeyEvent.VK_RED)!='undefined') {
var VK_RED = KeyEvent.VK_RED;
var VK_GREEN = KeyEvent.VK_GREEN;
var VK_YELLOW = KeyEvent.VK_YELLOW;
var VK_BLUE = KeyEvent.VK_BLUE;
}
if (typeof(KeyEvent.VK_PLAY)!='undefined') {
var VK_PLAY = KeyEvent.VK_PLAY;
var VK_PAUSE = KeyEvent.VK_PAUSE;
var VK_STOP = KeyEvent.VK_STOP;
}
if (typeof(KeyEvent.VK_FAST_FWD)!='undefined') {
var VK_FAST_FWD = KeyEvent.VK_FAST_FWD;
var VK_REWIND = KeyEvent.VK_REWIND;
}

133
if (typeof(KeyEvent.VK_BACK)!='undefined') {
var VK_BACK = KeyEvent.VK_BACK;
}
if (typeof(KeyEvent.VK_0)!='undefined') {
var VK_0 = KeyEvent.VK_0;
var VK_1 = KeyEvent.VK_1;
var VK_2 = KeyEvent.VK_2;
var VK_3 = KeyEvent.VK_3;
var VK_4 = KeyEvent.VK_4;
var VK_5 = KeyEvent.VK_5;
var VK_6 = KeyEvent.VK_6;
var VK_7 = KeyEvent.VK_7;
var VK_8 = KeyEvent.VK_8;
var VK_9 = KeyEvent.VK_9;
}
}
if (typeof(VK_LEFT)=='undefined') {
var VK_LEFT = 0x25;
var VK_UP = 0x26;
var VK_RIGHT = 0x27;
var VK_DOWN = 0x28;
}
if (typeof(VK_ENTER)=='undefined') {
var VK_ENTER = 0x0d;
}
if (typeof(VK_RED)=='undefined') {
var VK_RED = 0x74;
var VK_GREEN = 0x75;
var VK_YELLOW = 0x76;
var VK_BLUE = 0x77;
}
if (typeof(VK_PLAY)=='undefined') {
var VK_PLAY = 0x50;
var VK_PAUSE = 0x51;
var VK_STOP = 0x53;
}
if (typeof(VK_FAST_FWD)=='undefined') {
var VK_FAST_FWD = 0x46;
var VK_REWIND = 0x52;
}
if (typeof(VK_BACK)=='undefined') {
var VK_BACK = 0xa6;
}
if (typeof(VK_0)=='undefined') {
var VK_0 = 0x30;
var VK_1 = 0x31;
var VK_2 = 0x32;
var VK_3 = 0x33;
var VK_4 = 0x34;
var VK_5 = 0x35;
var VK_6 = 0x36;
var VK_7 = 0x37;
var VK_8 = 0x38;
var VK_9 = 0x39;
}

134
ANEXO 4

teletexto.js Funcin que llama a todos los mtodos necesarios para inicializar la
aplicacin

/* Funcin que llama a todos los mtodos necesarios para inicializar el teletexto*/
function startText(){
updateDateTimeString();//actualiza la fecha y la hora
actualizarEtiquetas();//actualiza las categoras del men
cargarPaginas();//prepara la cadena de pginas disponibles en el teletexto
updatePreview("Teletexto/html_generados/100.xml");//carga la primera pgina
hbbtvlib_initialize();//inicializa las funciones del OIPF
hbbtvlib_show();//muestra la aplicacin
aplicacionEsVisible = true;
registerKeyEventListener();//activa un "escuchador" de teclas pulsadas, que captura el cdigo
de la tecla que se puls en el mando y la enva a otra funcin
inicAplicacion();//inicializa la aplicacin con los mtodos del objeto OIPF Application Manager
}

base.js Funcin que controla la interaccin de la aplicacin.

var opts = false;


var selected = 0;
/* Funcin que inicializa la aplicacin HbbTV */
function inicAplicacion() {
try {
var app = document.getElementById('appmgr').getOwnerApplication(document);
app.show();
app.activate();
} catch (e) {
// se ignoran las excepciones
}
setKeyset(0x1+0x2+0x4+0x8+0x10);
}
/* Funcin que enmascara las pulsaciones, es decir, prepara una mscara para ignorar ciertas
pulsaciones */
function setKeyset(mask) {
// para HbbTV 0.5:
try {
var elemcfg = document.getElementById('oipfcfg');
elemcfg.keyset.value = mask;
} catch (e) {
// se ignoran las excepciones
}
try {
var elemcfg = document.getElementById('oipfcfg');
elemcfg.keyset.setValue(mask);
} catch (e) {
// se ignoran las excepciones
}
// para HbbTV 1.0:
try {
var app = document.getElementById('appmgr').getOwnerApplication(document);
app.privateData.keyset.setValue(mask);
app.privateData.keyset.value = mask;

135
} catch (e) {
// se ignoran las excepciones
}
}

/* Funcin que activa un "escuchador" de teclas pulsadas. Captura el cdigo de la tecla que se puls en
el mando y la env-a a otra funcin */
function registerKeyEventListener() {
document.addEventListener("keydown", function(e) {
if (handleKeyCode(e.keyCode)) {
e.preventDefault();
}
}, false);
}

/* Funcin que inicializa el men lateral */


function menuInic() {
opts = document.getElementById('indice').getElementsByTagName('li');//array que contiene las
distintas opciones del menu lateral
menuSeleccionar(0);//la primera opcin viene seleccionada por defecto
}
var opts = false;
var selected = 0;
/* Funcin que inicializa la aplicacin HbbTV */
function inicAplicacion() {
try {
var app = document.getElementById('appmgr').getOwnerApplication(document);
app.show();
app.activate();
} catch (e) {
// se ignoran las excepciones
}
setKeyset(0x1+0x2+0x4+0x8+0x10);
}
/* Funcin que enmascara las pulsaciones, es decir, prepara una mscara para ignorar ciertas
pulsaciones */
function setKeyset(mask) {
// para HbbTV 0.5:
try {
var elemcfg = document.getElementById('oipfcfg');
elemcfg.keyset.value = mask;
} catch (e) {
// se ignoran las excepciones
}
try {
var elemcfg = document.getElementById('oipfcfg');
elemcfg.keyset.setValue(mask);
} catch (e) {
// se ignoran las excepciones
}
// para HbbTV 1.0:
try {
var app = document.getElementById('appmgr').getOwnerApplication(document);
app.privateData.keyset.setValue(mask);
app.privateData.keyset.value = mask;
} catch (e) {
// se ignoran las excepciones

136
}
}

/* Funcin que activa un "escuchador" de teclas pulsadas. Captura el cdigo de la tecla que se puls en
el mando y la env-a a otra funcin */
function registerKeyEventListener() {
document.addEventListener("keydown", function(e) {
if (handleKeyCode(e.keyCode)) {
e.preventDefault();
}
}, false);
}
/* Funcin que inicializa el foco */
function menuInic() {
opts = document.getElementById('column').getElementsByTagName('a');//array que contiene
las distintas opciones del menu lateral
menuSeleccionar(0);//la primera opcin viene seleccionada por defecto
}

/* Funcin para navegar por las 4 opciones de la pgina */


function menuSeleccionar(i) {
if (i<=0) {
i = 0;
} else if (i>=opts.length) {
i = opts.length-1;
}
selected = i;
var scroll = Math.max(0, Math.min(opts.length-5, selected-2));//para hacer scoll entre las opciones que
estn "ocultas" por el tamao de la pantalla
for (i=0; i<opts.length; i++) {
opts[i].style.display = (i>=scroll && i<scroll+5) ? 'inline-table' : 'none';
if (selected == i) {
opts[i].setAttribute('focused','si');
} else {
opts[i].setAttribute('focused','no');
}
}
}var opts = false;
var selected = 0;

/* Funcin que inicializa la aplicacin HbbTV */


function inicAplicacion() {
try {
var app = document.getElementById('appmgr').getOwnerApplication(document);
app.show();
app.activate();
} catch (e) {
// se ignoran las excepciones
}
setKeyset(0x1+0x2+0x4+0x8+0x10);
}

/* Funcin que enmascara las pulsaciones, es decir, prepara una mscara para ignorar ciertas
pulsaciones */
function setKeyset(mask) {
// para HbbTV 0.5:
try {

137
var elemcfg = document.getElementById('oipfcfg');
elemcfg.keyset.value = mask;
} catch (e) {
// se ignoran las excepciones
}
try {
var elemcfg = document.getElementById('oipfcfg');
elemcfg.keyset.setValue(mask);
} catch (e) {
// se ignoran las excepciones
}
// para HbbTV 1.0:
try {
var app = document.getElementById('appmgr').getOwnerApplication(document);
app.privateData.keyset.setValue(mask);
app.privateData.keyset.value = mask;
} catch (e) {
// se ignoran las excepciones
}
}

/* Funcin que activa un "escuchador" de teclas pulsadas. Captura el cdigo de la tecla que se puls en
el mando y la env-a a otra funcin */
function registerKeyEventListener() {
document.addEventListener("keydown", function(e) {
if (handleKeyCode(e.keyCode)) {
e.preventDefault();
}
}, false);
}

/* Funcin que inicializa el menu lateral */


function menuInic() {
opts = document.getElementById('indice').getElementsByTagName('li');//array que contiene las
distintas opciones del menu lateral
menuSeleccionar(0);//la primera opcin viene seleccionada por defecto
}

/* Funcin para navegar por el menu lateral */


function menuSeleccionar(i) {
if (i<=0) {
i = 0;
} else if (i>=opts.length) {
i = opts.length-1;
}
selected = i;
var scroll = Math.max(0, Math.min(opts.length-5, selected-2));//para hacer scoll entre las opciones que
estn "ocultas" por el tamao de la pantalla
for (i=0; i<opts.length; i++) {
opts[i].style.display = (i>=scroll && i<scroll+5) ? 'inline-table' : 'none';
if (selected == i) {
opts[i].setAttribute('focused','si');
} else {
opts[i].setAttribute('focused','no');
}
}
}

138
navegacion.js Contiene las funciones que cargan las opciones de navegacin sobre
la aplicacin.

var req = false;


var focus = 'lateral';
var enlaceSelected = 0;
var tipoFicha = 0;
var paginas = 0;
var cadenaEnlaces = 0;
var index = 0;

var aplicacionEsVisible = false;

/* Funcin que permite almacenar en el array pginas todas las pginas disponibles */
function cargarPaginas(){
req = new XMLHttpRequest();
req.onreadystatechange = function() {
if (req.readyState!=4 || req.status!=200) return;
paginas = req.responseText.split('#'); //las pginas estn separadas por '#'
req.onreadystatechange = null;
req = null;
};
req.open('GET', 'paginas.php');
req.send(null);
}

var textopacity = 0;
var animtimer = false;

/* Funcin que fija el tipo de la ficha que se est mostrando. Las fichas pueden ser 'i'-ndice o 'c'-
contenido */
function fijarTipo (t){
tipoFicha = t;
}

/* Funcin que sirve para ocultar el teletexto */


function cambiarVisibilidad() {

try {
var tStyle = aplicacionEsVisible? "hidden":"visible";
var todo = document.getElementById("todo");
aplicacionEsVisible= !aplicacionEsVisible;
if (aplicacionEsVisible) {
hbbtvlib_show();
} else {
if (!hbbtvlib_hide()) window.close();
}
} catch (e) {
//alert("Cambiar visibilidad de la aplicacin: " + e);
}
}

/* Funcin que sirve para navegar el teletexto cuando el foco est en las fichas. Si es una pgina de
ndice, que contiene

139
enlaces, la funcin navega por los enlaces. Tambin sirve para avanzar por las pginas de contenido y
retroceder. */
function navegarPagina(dir) {
if(dir == 'left') { // si la direccin es hacia arriba
if ( tipoFicha == 'i'){ // si es una pgina de ndice
if ( enlaceSelected == 0 ){ // si est en el primer enlace
retrocederPagina(); // se retrocede una pgina
}
if ( enlaceSelected > 0 ){ // si se est en cualquier otro enlace
enlaceSelected -= 1;
enlaceSeleccionar(enlaceSelected); // se selecciona el enlace superior

}
if (tipoFicha == 'c'){ // si es una pgina de contenidos
retrocederPagina(); //se retrocede una pgina
}
}
if(dir == 'right') { //si la direccin es hacia abajo
if (tipoFicha == 'i'){// si es una pgina de ndice
if ( enlaceSelected >=
document.getElementById('enlaces').getElementsByTagName('li').length - 1){
avanzarPagina(); // si el enlace que estaba seleccionado es el ltimo,
se avanza una pgina
}
if ( enlaceSelected <
document.getElementById('enlaces').getElementsByTagName('li').length - 1 ){
enlaceSelected += 1;
enlaceSeleccionar(enlaceSelected); // si se est en cualquier otro
enlace se selecciona el enlace inferior

}
if (tipoFicha == 'c'){ // si es una pgina de contenido
avanzarPagina() // se avanza una pgina
}
}
return true;
}

/* Funcin que carga la siguiente pgina */


function avanzarPagina(){
if(index+1<paginas.length){
updatePreview('Teletexto/html_generados/' + paginas[index + 1] + '.xml');//pide la
pgina
index++;// aumenta la cuenta
}
}

/* Funcin que carga la pgina anterior */


function retrocederPagina(){
if (index>=1){
updatePreview('Teletexto/html_generados/' + paginas[index-1] + '.xml');//pide la
pgina

140
index--;//aumenta la cuenta
}
}

/* Funcin que gestiona la seleccin de los enlaces */


function enlaceSeleccionar(n){
var enlaces = document.getElementById('texto').getElementsByTagName('li');//array que
contiene todos los enlaces de la pgina mostrada
var k = 0;
if (n<=0){
n =0;
}else if (i>=enlaces.length){
n = enlaces.length - 1;
}
for (k=0; k<enlaces.length; k++){
if ( k == n )enlaces[k].setAttribute('selected','si');
if ( k != n )enlaces[k].setAttribute('selected','no');

}
var enlaceSeleccionado = n;
var scroll = Math.max(0, Math.min(enlaces.length-6, enlaceSeleccionado-4));
var i = 0;
for (i=0; i<enlaces.length; i++) {
enlaces[i].style.display = (i>=scroll && i<scroll+6) ? 'inline-table' : 'none';//para ir
mostrando los enlaces que no "caben" en la pgina
}
}

/* Funcin para alternar el foco entre la seccin lateral y la central */


function cambiarFoco(){
if ( focus == 'lateral'){
focus = 'centro';
enlaceSeleccionar(0);
var i;
for (i=0; i<opts.length; i++){
if ( opts[i].getAttribute('focused') == 'si') opts[i].setAttribute('focused','no');
}
} else if ( focus == 'centro'){
menuSeleccionar(selected);
focus = 'lateral';
}
}

/* Funcin que determina el comportamiento al pulsar las teclas del mando */


function handleKeyCode(kc) {
if (kc==VK_LEFT) {
if ( focus == 'lateral') {
menuSeleccionar(selected-1);
} else if ( focus == 'centro'){
navegarPagina('up');
}
return true;
} else if (kc==VK_RIGHT) {
if ( focus == 'lateral') {
menuSeleccionar(selected+1);
} else if ( focus == 'centro'){
navegarPagina('down');

141
} return true;
}
else if (kc==VK_ENTER) {//accede a la opcin seleccionada, es como RIGHT
if ( focus == 'lateral') {
var page = opts[selected].getAttribute("pagina");
var link = 'Teletexto/html_generados/' + page + '.xml';
updatePreview(link);
var i
for (i = 0; i < opts.length; i++){
if ( i == selected){
opts[i].setAttribute('selected','si');
} else {
opts[i].setAttribute('selected','no');
}
}
}
else if ( focus == 'centro' && tipoFicha == 'i'){
var link = 'Teletexto/html_generados/' + cadenaEnlaces[enlaceSelected] +
'.xml';
updatePreview(link);
}return true;
}else if (kc==VK_RED) {//oculta y muestra el teletexto
document.location.href = '../diego/iniciorojo.htm';
return true;
}
return false;
}

etiquetas.js Funcin que obtiene las diferentes opciones del men mediante una
peticin XMLHttpRequest

var etiquetasReq = new XMLHttpRequest();


function actualizarEtiquetas() {
try {
var progUrl = "xml/categorias.xml";
if (etiquetasReq != null) etiquetasReq.abort();

etiquetasReq.onreadystatechange =
function () {
handleEtiquetasXML(etiquetasReq);
};
etiquetasReq.open("GET", progUrl);
etiquetasReq.setRequestHeader("Cache-Control", "no-cache");
etiquetasReq.send(null);

} catch (e) {
alert(e);
}
}

/* Funcin que presenta el men lateral */


function handleEtiquetasXML (request) {
if (request.readyState==4) {
if (request.status == 200 || request.status == 0) {
try {
var xml = request.responseXML;

142
var elementos = xml.getElementsByTagName("elemento");//array
que contiene todas las opciones
document.getElementById("indice").innerHTML = '';

for (var i = 0; i < elementos.length; i++){


var texto = elementos[i].getElementsByTagName("texto");
var nombre =
elementos[i].getElementsByTagName("nombre");
var pagina =
elementos[i].getElementsByTagName("pagina");
document.getElementById("indice").innerHTML += '<li
selected="no" focused="no" pagina="' + pagina[0].firstChild.nodeValue + '" name="' +
nombre[0].firstChild.nodeValue + '">' + texto[0].firstChild.nodeValue+'</li>';//inserta cada opcin en el
men lateral
}
menuInic();

} catch (e) {
//alert(e);
}
}
}
}

hbbtvlib.js Librera de HbbTV que siempre se debe cargar en toda aplicacin.

Esta es la misma que ya se muestra en el anexo 2.

keycode.js Librera de HbbTV que escucha cuando una tecla fue presionada.

Esta es la misma que ya se muestra en el anexo 2.

fecha.js Funcin que obtiene la hora del sistema.

function createDateTimeString(date) {
var dateStr = "";
var temp = date.getDate();
dateStr += ((temp < 10) ? "0" + temp : temp) + ".";
temp = date.getMonth() + 1;
dateStr += ((temp < 10) ? "0" + temp : temp) + ".";
dateStr += date.getFullYear() + ", ";
temp = date.getHours();
dateStr += ((temp < 10) ? "0" + temp : temp) + ":";
temp = date.getMinutes();
dateStr += ((temp < 10) ? "0" + temp : temp);
return dateStr;
}
function updateDateTimeString() {
document.getElementById("fecha").innerHTML = createDateTimeString(new Date());
}

fichas.js Funcin que obtiene la imagen que se desea mostrar en formato XML

var previewReq = new XMLHttpRequest();


var paginaActual = 0;

143
function updatePreview(url) {
try {
var progUrl = url;
if (previewReq != null) previewReq.abort();

previewReq.onreadystatechange =
function () {
handlePreviewXML(previewReq);
};

previewReq.open("GET", progUrl);
previewReq.setRequestHeader("Cache-Control", "no-cache");
previewReq.send(null);

} catch (e) {
alert(e);
}
}

/* Funcin que presenta la ficha en el espacio reservado para ello */


function handlePreviewXML (request) {
if (request.readyState==4) {
if (request.status == 200 || request.status == 0) {
try {
var xml = request.responseXML;
var tipo = xml.getElementsByTagName("tipo");//indica el tipo de la
ficha (ndice o contenido)
fijarTipo(tipo[0].firstChild.nodeValue);
var titulo = xml.getElementsByTagName("titulo");
var etiqueta = xml.getElementsByTagName("etiqueta");
var imagen = xml.getElementsByTagName("imagen");
var audio = xml.getElementsByTagName("audio");//aun no se ha
utilizado, pero la idea es que aqu se contenga el link a la notica locutada
var pagina = xml.getElementsByTagName("pagina");
var cadena = xml.getElementsByTagName("cadena");
document.getElementById("pagina").innerHTML =
pagina[0].firstChild.nodeValue;
paginaActual = pagina[0].firstChild.nodeValue;
index = paginas.indexOf(paginaActual);
document.getElementById("titular").innerHTML =
etiqueta[0].firstChild.nodeValue;
document.getElementById("categoria").innerHTML =
titulo[0].firstChild.nodeValue;
if (tipo[0].firstChild.nodeValue == 'c'){
document.getElementById("categoria").style.height = '0px';
document.getElementById("cuerpo").style.height = '0px';
document.getElementById("texto").style.height = '0px';
var texto = xml.getElementsByTagName("texto");
document.getElementById("texto").innerHTML =
texto[0].firstChild.nodeValue;
}
if (tipo[0].firstChild.nodeValue == 'i'){
enlaceSelected = 0;
cadenaEnlaces = cadena[0].firstChild.nodeValue.split('#');
var enlaces = xml.getElementsByTagName("enlace");
var j;
document.getElementById("categoria").style.height = '0px';

144
document.getElementById("cuerpo").style.height = '0px';
document.getElementById("texto").style.height = '0px';
document.getElementById("texto").innerHTML = '';
document.getElementById("texto").innerHTML += '<div
id="enlaces"></div>';
for( j=0; j<enlaces.length; j++){
var texto =
enlaces[j].getElementsByTagName("texto");
var pagina =
enlaces[j].getElementsByTagName("pagina");
document.getElementById("enlaces").innerHTML
+= '<li selected="no" page=' + pagina[0].firstChild.nodeValue + '>' + texto[0].firstChild.nodeValue +
'</li>';
}
var links =
document.getElementById("enlaces").getElementsByTagName("li");
var k;
for ( k=6; k < links.length; k++){
links[k].style.display = 'none';
}
}
if(imagen.length != 0){
document.getElementById("foto").innerHTML = '<img
src="Teletexto/'+imagen[0].firstChild.nodeValue+'"/>';
document.getElementById("foto").style.width = '0px';
document.getElementById("texto").style.width = '0px';

} else {
document.getElementById("foto").innerHTML = '';
document.getElementById("foto").style.width = '0px';
document.getElementById("texto").style.width = '0px';
}

} catch (e) {
//alert(e);
}
}
}
}

teletexto.css Contiene la hoja de estilo con los atributos de los elementos del
archivo html principal.

body{
background-image: url(../imagenes/fondo1.png);
background-repeat: no-repeat;
background-size: 100%,100%;
width: 1920px;
height: 1080px;
display: block;
}
#todo{
background-color: transparent;
background-repeat: no-repeat;

145
background-size: 100%,100%;
width: 1366px;
height: 768px;
}
img{
height: 500px;
width: 480px;
}
#contenedor{
background-color: transparent;
width: 60%;
height: 5%;
position: absolute;
top: 0%;
left: 0%;
}
#video1{
background-color: transparent;
width: 50%;
height: 50%;
position: absolute;
top: 20%;
left: 10%;
}
#lateral{
/*background-color: #DFF2E3;*/
float: left;
width: 0px;
}
#lateral .relleno{
height: 0px;
width: 0px;
}
#pagina{
color: transparent;
}
#indice{
background-color: transparent;
width: 100%;
height: 100%;
position: absolute;
top: 80%;
left: 10%;
}
#indice li {
margin: 0% 0% 0% 1%;
padding: 1% 1% 1% 0%;
color: transparent;
height: 15%;
width: 20%;
background-image: transparent;
background-size: 100%,100%;
background-repeat: no-repeat;
background-position: center;
}

li[selected=si]{

146
background-color: #DFF2E3;
}

li[focused=si]{
background-color: #69BF80;
}

#contenido{
background-color: transparent;
float: right;
}

#titular{
color: transparent;
}
#fecha{
color: transparent;
}

#contenido .categoria {
background-color: transparent;
color: transparent;
}

#contenido .cuerpo {
background-color: transparent;
color: transparent;
}

#contenido .foto{
float: right;
}

#texto{
color: transparent;
}
#pie .rojo {
background-image: url(../imagenes/salir2.png);
background-size: 100%,100%;
background-repeat: no-repeat;
background-position: left bottom;
position: absolute;
width: 9%;
height: 13%;
bottom: 4%;
left: 1%;
}
#pie .opc1 {
background-image: url(../imagenes/opc1.png);
background-size: 100%,100%;
background-repeat: no-repeat;
background-position: left bottom;
position: absolute;
width: 19%;
height: 14%;
bottom: 4%;
left: 12%;

147
}
#pie .opc2 {
background-image: url(../imagenes/opc2.png);
background-size: 100%,100%;
background-repeat: no-repeat;
background-position: left bottom;
position: absolute;
width: 19%;
height: 14%;
bottom: 4%;
left: 34%;
}
#pie .opc3 {
background-image: url(../imagenes/opc3.png);
background-size: 100%,100%;
background-repeat: no-repeat;
background-position: left bottom;
position: absolute;
width: 19%;
height: 14%;
bottom: 4%;
left: 56%;
}
#pie .opc4 {
background-image: url(../imagenes/opc4.png);
background-size: 100%,100%;
background-repeat: no-repeat;
background-position: left bottom;
position: absolute;
width: 19%;
height: 14%;
bottom: 4%;
left: 78%;
}

categorias.xml Contiene la lista de las cuatro opciones del men.

<?xml version="1.0" encoding="ISO-8859-1" standalone="yes"?>


<xml>
<elemento>
<nombre>opc1</nombre>
<texto>OPCION1</texto>
<pagina>100</pagina>
</elemento>
<elemento>
<nombre>opc2</nombre>
<texto>OPCION2</texto>
<pagina>200</pagina>
</elemento>
<elemento>
<nombre>opc3</nombre>
<texto>OPCION3</texto>
<pagina>300</pagina>
</elemento>
<elemento>
<nombre>opc4</nombre>

148
<texto>OPCION4</texto>
<pagina>400</pagina>
</elemento>
</xml>

100.xml Carga la imagen de la opcin 1 del men de navegacin.

<?xml version="1.0" encoding="ISO-8859-1" ?>


<ficha>
<tipo><![CDATA[c]]></tipo>
<titulo>Primera</titulo>
<pagina><![CDATA[100]]></pagina>
<etiqueta>OPCION1</etiqueta>
<texto>hola1</texto>
<imagen>uploads/inf1.png</imagen>
</ficha>

200.xml Carga la imagen de la opcin 2 del men de navegacin.

<?xml version="1.0" encoding="ISO-8859-1" ?>


<ficha>
<tipo><![CDATA[c]]></tipo>
<titulo>Segunda</titulo>
<pagina><![CDATA[200]]></pagina>
<etiqueta>OPCION2</etiqueta>
<texto>hola2</texto>
<imagen>uploads/inf2.png</imagen>
</ficha>

300.xml Carga la imagen de la opcin 3 del men de navegacin.

<?xml version="1.0" encoding="ISO-8859-1" ?>


<ficha>
<tipo><![CDATA[c]]></tipo>
<titulo>Tercera</titulo>
<pagina><![CDATA[300]]></pagina>
<etiqueta>OPCION3</etiqueta>
<texto>hola3</texto>
<imagen>uploads/inf3.png</imagen>
</ficha>

400.xml Carga la imagen de la opcin 4 del men de navegacin.

<?xml version="1.0" encoding="ISO-8859-1" ?>


<ficha>
<tipo><![CDATA[c]]></tipo>
<titulo>Cuarta</titulo>
<pagina><![CDATA[400]]></pagina>
<etiqueta>OPCION4</etiqueta>
<texto>hola4</texto>
<imagen>uploads/inf4.png</imagen>
</ficha>

149

Вам также может понравиться