CONSTRUÇÃO DE PROGRAMAS INTERATIVOS PARA TV DIGITAL USANDO GINGA

Preview:

DESCRIPTION

Minicurso Básico III. CONSTRUÇÃO DE PROGRAMAS INTERATIVOS PARA TV DIGITAL USANDO GINGA. Aquiles Burlamaqui - UERN Igor Rosberg - UFRN Diogo Henrique - UERN. SUMÁRIO. Introdução a TV Digital Interativa Túnel do tempo O que muda? Middleware para a TVDI Sistema Americano - PowerPoint PPT Presentation

Citation preview

CONSTRUÇÃO DE PROGRAMAS INTERATIVOS PARA TV DIGITAL USANDO GINGA

Minicurso Básico III

Aquiles Burlamaqui - UERNIgor Rosberg - UFRNDiogo Henrique - UERN

SUMÁRIO

Introdução a TV Digital Interativa Túnel do tempo O que muda?

Middleware para a TVDI Sistema Americano Sistema Europeu Sistema Japonês Sistema Brasileiro

Ginga Ginga-NCL

▪ NCL▪ Lua▪ XHTML

Ginga-J▪ JavaTV, HAVI▪ XletView

Mercado de TV Digital

Introdução a tv digital interativa

Conhecendo a TVDI

Túnel do TempoTecnologias

1950 1972 2007

2 de dezembro inicia-se a transmissão

da TVDI no BrasilSurgimento da TV no Brasil

19 de fevereiro chegaram as cores na

TV do brasileiro

Túnel do Tempo

1950

1964

1975

1985

1990

2000 ...

Fase ElitistaFase de

Globalização e da TV

Paga

Fase de desenvolvi

mento Tecnológico

Fase Populista

Fase da Convergênc

ia e da Qualidade

Digital

Fase de Expansão

Internacional

Fases da História da TV no Brasil

O que muda? Imagem

HDTV Tela no formato 16:9 MPEG-4 Duas vezes melhor do que

qualidade de DVD Som

Qualidade melhor que CD Surround 5.1 HE-AAC (High Efficiency

Advanced Audio Coding) Sucessor do mp3 Utilizado no IPod, Playstation

3, Nintendo wii

O que Muda?

MELHOR SOM

MELHOR IMAGEM

Analógica Digital

APLICAÇÕES

O que muda? Mobilidade e

Portabilidade Multiprogramação

Diferentes programas, mesmo canal

Interatividade Compras pela TV Votar em

enquetes/pesquisas Acesso a serviços ...

O que muda? Hardware

Display Set-top-box USB dongle 1-seg PSP e DS 1-seg Celulares 1-Seg

O CanalLargura

6MHzAnalógico

Tudo para o vídeo e o áudio em resolução padrão▪ SDTV (4:3 = 640x480 / 16:9 = 704x480 )

O CanalDigital

6 Mhz 29,162 Mbps

▪ LDTV ( 240x320)▪ HDTV(1920x 1080)

MIDDLEWARE PARA A TVDIConhecendo a TVDI

Sistema de TV Digital Interativa Organização do Sistema de TV Digital

Interativa

Middleware Sistema

Americano Mais antigo, 1998 ATSC

▪ Foco na transmissão em HDTV

Middleware DASE

Sistema Europeu Utilizado em mais

de 15 países DVB

▪ Multiprogramação▪ Interatividade

Middleware MHP

Sistema Japonês Datando de 1999 ISDB

▪ Baseado no DVB▪ Mobilidade aliado

a alta definição Middleware ARIB

Sistema Brasileiro Início das

transmissões em 2007

SBTVD-T▪ HDTV▪ Multiprogramação▪ Interatividade▪ Mobilidade

Middleware GINGA

GINGAConstruindo aplicações para a TVDI

Middleware Ginga

Áudio

Vídeo

Dados Datagramas IP MPEGÁudio

Vídeo

DadosCarrossel de Dados

MPEGHardware

Real-Time Operating System

Device Drivers

ITV Middleware (eg. MHP or DASE)

Conditional Access

Aplicação

Envio e execução de programas de TV Interativos

Middleware Ginga

Sobre o NCL

Linguagem declarativa;

Não define nenhum objeto de mídia em si;

Possui uma linguagem de script (LUA)

Sobre o NCL API NCL APIs XHTML

CSS DOM javascript

API NCL-LUA API NCL-JAVA

API NCL - Linguagem NCL Estrutura

O que?▪ Nós de Mídia

Onde ?▪ Região da tela onde irá tocar

Como ?▪ Características como volume, transparência,

etc. Quando ?

▪ Em que momento ele irá tocar?

O que ? Nós de Mídias

AUDIO VÌDEO

IMAGEM TEXTO

MEDIA

O que ?

i.jpgreceita.html

CONTEXTO

CONTEXTO

MEDIA

VÌDEO

Onde ?

i.jpg

O que ? MEDIA

REGION

i.jpg

Onde ?

O que ? MEDIA

REGION

i.jpg

Onde ?

O que ? MEDIA

REGION

Como ?Onde ?O que ? MEDIA

REGION

DESCRIPTOR

AUDIO DESCRIPTOR

- VOLUME

Como ?Onde ?O que ? MEDIA

REGION

DESCRIPTOR

IMAGEM

Quando ?

CONNECTOR

CONNECTOR

OnSelect Start

LINK

LINK

Como ?Onde ?O que ? MEDIA

REGION

DESCRIPTOR

IMAGEM

Quando ?

CONNECTOR

CONNECTOR

OnSelect Start

LINK

LINK

Ambientes de execução

Há diversos ambientes de execução para a linguagem NCL

Entre os mais usados estão os desenvolvidos pela PUC-Rio, em JAVA e C++

Atualmente várias empresas privadas desenvolvem ambientes de execução, sendo que várias delas situam-se no nordeste

Fedora-fc7-ginga-i386

WinSCP

Usado para acessar as pastas do SO Fedora-fc7-ginga-i386

Através dele são feitas as transferências de arquivos do Sistema Operacional em uso para a máquina virtual do Fedora

Putty

É um programa amplamente utilizado na realização de conexões remotas

Simula um ambiente de terminal de controle

Através dele serão executados os comandos necessários

Estrutura do Documento .ncl

Estrutura básica de um arquivo NCL Cabeçalho; Uma seção de cabeçalho do programa

(head) O corpo do programa (body) Uma porta que indica o ínico do programa Conclusão do documento;

Cabeçalho

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

<ncl id="exemplo01">

Seção de cabeçalho - HEAD Inicia com a tag <head> e termina

com a tag </head>

É na seção HEAD que se definem as regiões, os descritores, os conectores e as regras utilizadas pelo programa;

Seção HEAD – Base de Regiões Inicia com a tag <regionBase> e

termina com a tag </regionBase >

Na base de regiões, são definidas todas as regiões nas quais as mídias serão exibidas

Exemplo de declaração de região

<regionBase><region id=“rgTela” left=“0” top=“0” width=“800” height=“600”>

<region id=“rgTopo” left=“10” top=“10” width=“780” height=“30”/> <region id=“rgVideo” left=“10” top=“50” width=“400” height=“250”/>

<region id=“rgDir” left=“420” top=“50” width=“150” height=“250”/></region>

</regionBase>

OBS: A região não define a associação com cada mídia particular. Essa associação é feita através dos

descritores.

Visão de leiautergTela: 0,0 (800,600px)

rgTopo: 10,10 (780,30px)

rgVideo: 10,50 (400,250px) rgDir: 420,50 (150,250px)

Seção HEAD – Base de Descritores Inicia com a tag <descriptorBase> e

termina com a tag </descriptorBase>

É através dos descritores que as mídias são associadas à uma determinada região;

Definem também a forma como a mídia será apresentada; EX: Volume, transparência etc.

Exemplo de declaração de Descritor

<descriptorBase><descriptor id=“dVideo” region=“rgVideo”/>

</descriptorBase>

OBS: Ao se definir um descritor, é necessário definir a região à qual ele estará associado. Toda mídia que utilizar esse descritor estará associada à região corresponde.

Seção HEAD – Base de Conectores Inicia com a tag <connectorBase> e

termina com a tag </connectorBase>

Os conectores definem como os elos são ativados e o que eles disparam.

Em NCL existe apenas um tipo de conector: o conector causal.

Exemplo de declaração de conectores<connectorBase>

<causalConnector id="onBeginAbortStart"><simpleCondition role="onBegin"/><compoundAction operator="seq">

<simpleAction role="abort" max="unbounded" qualifier="par"/>

<simpleAction role="start" max="unbounded" qualifier="par"/> </compoundAction></causalConnector><causalConnector id="onBeginStart">

<simpleCondition role="onBegin"/> <simpleAction role="start"/>

</causalConnector></connectorBase >

Exemplo de declaração de conectores Uma forma de tornar prática a

reutilização de conectores é defini-los em um arquivo externo semelhante a um .css agrupando assim dezenas de conectores prontos para o uso.

Exemplo:<connectorBase>

<importBase alias="connectors" documentURI="connectorBase.ncl"/></connectorBase>

Corpo do programa NCL (body) Inicia com a tag <body> e termina

com a tag </body> O body é um caso particular de

contexto, representando o documento como um todo.

Nele são inseridos os nós (mídias), portas, elos, âncoras etc.

Portas Uma porta do body define o primeiro nó do

documento a ser apresentado. Caso haja mais de uma porta no contexto body

(fato não muito comum), os nós mapeados por todas as portas são iniciados em paralelo.

Exemplo: <port id=“entryPoint”

component=“mainVideo”> As portas também são definidas como ponto de

entrada dos contextos aninhados.

Exemplo de estrutura básica de um arquivo NCL

<?xml version="1.0" encoding="ISO-8859-1"?><ncl id="nclClicks" xmlns="http://www.ncl.org.br/NCL3.0/EDTVProfile">

<head><regionBase><region zIndex="0" left="0" top="0" width="550" height="400" id="rgTela"><region zIndex="1" left="0" top="70" width="379" height="330" id="rgVideo"/></region></regionBase><descriptorBase><descriptor id="dVideo" region="rgVideo"/></descriptorBase><connectorBase><causalConnector id="onBeginStart"><simpleCondition role="onBegin"/><simpleAction role="start"/></causalConnector></connectorBase></head><body><port id="entryPoint" component="video1"/><media type="video/mpeg" id="video1" src="video1.mpg" descriptor="dVideo1“/> <media type=“image/jpeg" id=“image1" src=“image1.jpeg" descriptor="dImage“/> <link xconnector="onBeginStart"><bind role="onBegin" component="video1"/><bind role="start" component="image1"/></link></body>

</ncl>

Nós

Os nós são referências para as mídias. O nó funciona semelhante à tag <a> do html. Sendo assim, os nós funcionam como links que, quando ativados, disparam a exibição de uma determinada mídia.

Os nós podem ser de dois tipos: Nó de conteúdo (mídia) ou nó de contexto.

Nó de conteúdo Os nós de conteúdo são definitos através da tag

<media/> Esse tipo de nó é associado a um tipo de mídia

(txt, html, jpeg, mpeg etc). Um nó de conteúdo é iniciado através da tag <media>.

Os tipos mais comuns são: image/gif, image/jpeg, image/bmp, video/mpeg, text/plain, text/html, audio/mp3

Exemplo:<media type="video/mpeg" id="video1" src="video1.mpg" descriptor="dVideo1“/> <media type=“image/jpeg" id=“image1" src=“image1.jpeg" descriptor="dImage“/>

Exemplo prático 01

Criação e exibição de um nó de conteúdo

Nó de contexto Inicia com a tag <context> e termina com a tag

</context> Contextos ou nós de composição são utilizados para

estruturar um documento hipermídia. Os contextos podem ser aninhados, para refletir a estrutura do documento e ajudar o autor a organizar os segmentos do programa audiovisual interativo.

Exemplo de nó de contexto<link id="lSelectBotaoVermelho"

xconnector="connectors#onSelection1SetStartStopDelay"> <bind component="botaoVermelho" role="onSelection">

<bindParam name="keyCode" value="RED" /> </bind> <bind component="ctxBasico" interface="pBasico" role="start" />

</link><context id="ctxBasico">

<port id="pBasico" component="videoPrincipal" /><!-- nós e elos do contexto ctxBasico --> <media type="video" id="videoPrincipal" src="media/video_principal.mpg" descriptor="dVideo1" />

</context>

Elos Através dos elos podemos sincronizar

eventos em um programa NCL Um exemplo de sincronização é o início de

um determinado nó, imediatamente após o início ou término de outro nó etc.

Os elos estão intimamente vinculados aos conectores. Eles definem qual mídia estará associada ao papél condicional de um conector e que mídias sofrerão a ação através dos papéis de ação

Exemplo de declaração de Elo

<link xconnector="connectors#onBegin1StartN" id=“iniciaTitulo"><bind role="onBegin" component=“inicio"/><bind role="start" component="titulo"/>

</link>

Exemplo prático 02

Exibição de um nó de conteúdo imediatamente após o término de outro nó de conteúdo.

Âncoras

As âncoras são pontos de entrada para os nós de mídia ou contextos. O objetivo de se utilizar âncoras é utilizar segmentos de um nó de mídia ou contexto, seja como origem ou destino de elos.

Existem dois tipos de âncoras: A âncora de conteúdo e a âncora de propriedade.

Âncora de conteúdo Define um segmento da mídia (intervalo

de tempo e/ou região no espaço) que poderá ser utilizado como ponto de ativação de elos.

Uma âncora de conteúdo é definida como uma tag <area> dentro da tag <media>.

Exemplo de âncora de conteúdo<media type="vídeo/mpeg" id="video1" src="video1.mpg" descriptor="dVideo1">

<area id="aVideoLegenda01" begin="5s" end="9s"/><area id="aVideoLegenda02" begin="10s" end="14s"/><area id="aVideoLegenda03" begin="15s" end="19s"/>

</media>

Exemplo prático 03

Declaração e utilização de âncoras na sincronização entre legenda e áudio.

Âncora de propriedade Uma âncora de propriedade se refere a

propriedades de um nó, que podem ser manipulados pelos elos.

Uma âncora de atributo é definida através da tag <property> dentro da tag <media> ou <context>

Exemplo:<media type="video" id="video1" src="media/video1.mpg" descriptor="dVideo1"> <property id="top" name="top"/>

<property id="left" name="left"/><property id="width" name="width"/><property id="height" name="height"/>

</media>

Exemplo prático 04

Utilização de âncoras de propriedade na redimensionalisação

LUA Lua foi planejada para ser utilizada por

qualquer aplicação que necessite de uma linguagem de script leve e poderosa.

Lua é implementada como uma biblioteca, escrita em C

Por ser uma linguagem de extensão, Lua não possui a noção de um programa principal: ela somente funciona embarcada em um programa cliente anfitrião, chamado de programa hospedeiro ou simplesmente de hospedeiro.

LUA – Bibliotecas para TVDI As novas bibliotecas são divididas em

módulos essenciais onde cada um exporta um conjunto de funções de seu domínio.

Dois módulos serão abordados nesse minicurso. event canvas

Além dos módulos event e canvas, há também os módulos persistent e settings que não serão abordados nesse tutorial.

O que é Lua? Uma linguagem de script leve

Pequena, portátil, eficiente Uma linguagem tipada dinamicamente

O tipo da variável depende do valor armazenado

Toda linguagem pode ter erro de “tipos” em tempo de execução

Uma linguagem com gerência automática de memória

Pré-compilação em bytecodes Pode-se carregar arquivos compilados

Como Lua é?

Sintaxe convencional print(“hello world”) print“hello world”

Comentários

Comentários de 1 linha -- (dois traços)

Comentários de blocos --[[ bloco ]]

Variáveis

Varáveis globais não precisam de declaração

Variáveis locais são declaradas com a palavra chave local

Tipos 8 tipos básicos

nil – tipo do valor nil que é diferente de qualquer outro, é o valor default das variáveis

boolean – true, false number – double string – array de caracteres, imutável function – valor de primeira classe, significa que

funções podem ser armazenadas em variáveis, passadas como argumentos, retornadas

userdata – dados C arbitrários, manipulado através da API C

thread – threads independentes de execução table – arrays associativos

Consulta do tipo da variável através da função type

Operadores

Aritméticos +, -, *, /, ^

Relacionais <, >, <=, >=, ==, ~=

Operadores lógicos and, or, not Avaliação por curto-circuito

Concatenação ..

Atribuição

a = 0 a, b, c = 0, 0, 0 a, b = b, a -- troca de valores a, b, c = 0, 0 -- c recebe nil

Tabelas

Resultado da expressão {} Qualquer valor como chave, exceto

nil Único mecanismo de estruturação de

dados Indexação na forma variável[índice]

ou variável.índice, quando o índice é uma string

Estruturas de Controle for var = inicio, fim [, passo] do bloco end

Numérico for var {, var} in expressão do bloco end

Genérico while expressão do bloco end repeat block until expressão break ou return pode ser usado para

terminar o laço if expressão then bloco {elseif expressão

then bloco} [else bloco] end

Funções

Retorno foo()

▪ Nenhum valor de retorno x = foo()

▪ Ajustado para 1 valor x, y = foo()

▪ Ajustado para 2 valores {foo()}

▪ Cria uma tabela com todos os valores retornados

Bibliotecas

Basic String Table Math IO OS

Basic

Oferecem funções básicas print type setmetatable pairs error

String

Funções para manipulação de strings

Table

Funções para manipulação de tabelas table.insert table.remove table.sort

Math

Funções matemáticas math.sqrt math.sin math.log

IO

Funções de entrada e saída io.open io.close io.read io.write

OS

Funções associadas ao sistema operacional os.clock os.date os.execute

Mais Informações

Manual Wiki Lua-Users Lista de Discussão IRC

LUA O modelo de execução de um NCLua é todo

orientado a eventos. Isto quer dizer que para todos os usos do

controle remoto, sincronismos em documentos NCL etc, existem eventos associados e é através deles que toda dinâmica de um NCLua se faz presente.

O controle sobre esses eventos ora é feito pelo formatador NCL que aciona o NCLua (que por sua vez recebe o evento e o processa); ora é feito pelo NCLua que posta o evento (sinalizando alguma mudança ao formatador).

LUA Durante a inicialização do script,

antes de se tornar orientado a eventos, um NCLua deve registrar pelo menos uma função de tratamento de eventos.

A partir de então, qualquer ação tomada pela aplicação é somente em resposta a um evento enviado pelo formatador a essa função tratadora.

LUA – Estrutura Básica--- example.lua --- ... -- código de inicialização

function handler (evt)... -- código do tratador end

event.register(handler) -- registro do tratador no formatador

LUA – Módulo event

No módulo event, estão definidas as seguintes classes: ncl, key, tcp, sms, user

Serão abordadas as classes ncl e key

LUA – Módulo event

Em um documento NCL, relacionamentos entre nós de mídia são descritos através de elos, cujas relações de causalidade são baseadas em ações e transições sobre seus eventos.

Há três tipos de eventos NCL: apresentação, seleção e atribuição.

LUA - Módulo event

Apresentação: Eventos de apresentação, conforme o nome diz, controlam a exibição do nó de mídia associado ao NCLua.

Eventos de apresentação podem estar associados a áreas (ou âncoras) específicas ou ao nó como um todo.

LUA - Módulo event No caso de ações geradas pelo

formatador, o campo action indica a ação a ser tomada pelo NCLua. { class='ncl', type='presentation', area='intro', action='start' } 

Para transições geradas pelo NCLua, o campo transition sinaliza a mudança de estado do seu evento de apresentação. {class='ncl', type='presentation', area='intro', transition='stops' } 

LUA - Módulo event Atribuição: Atribuições estão sempre

associadas a propriedades do nó de mídia ( no documento NCL).

Eventos de atribuição sempre devem possuir o campo property com o nome da propriedade em questão.

Exemplo:{ class='ncl', type='attribution', property='counter', action='start', value='2' }

LUA - Módulo event Seleção: eventos de seleção não são tratados

pela classe 'ncl', estando esse suporte na classe de eventos ‘key’.

Usos do controle remoto geram eventos desta classe que são recebidos pelo NCLua.

Neste caso a comunicação é unidirecional, uma vez que o controle remoto é um dispositivo de entrada, apenas.

Exemplo:{ class='key', type='press', key='0' } 

LUA - Módulo canvas

Um NCLua tem a possibilidade de fazer operações gráficas durante a apresentação de uma aplicação.

A variável canvas do NCLua deve estar associada à uma região.

LUA - Módulo canvas Exemplos:

width, height = canvas:attrSize()

canvas:drawLine(0,0, width,height)

img = canvas:new('image.png')

canvas:compose(100, 100, img)

canvas:flush() -- atualiza a região do documento NCL

Ginga-J Linguagem procedural baseada em Java APIs para a implementação de aplicativos para a TVDI

Pacotes da API Java TV Pacotes DAVIC Pacotes HAVI Pacotes DVB API de controle de tunning API de fluxos de mídia API de canal de retorno API aderentes à especificação ARIB STD-B23 API de integração de dispositivos API de ponte Ginga-NCL

Ginga-J

public interface Xlet {

public void initXlet(XletContext ctx) throws XletStateChangeException;

public void startXlet() throws XletStateChangeException;

public void pauseXlet();

public void destroyXlet(boolean unconditional) throws XletStateChangeException;}

Xlets

Ginga-J

Ginga-J XletView – Emulador Java TVw ,

Emulador Java TV

Ginga-J API Java TV

javax.tv.graphics javax.tv.locator javax.tv.media javax.tv.net javax.tv.service javax.tv.util javax.tv.xlet

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Exemplos: Xlet Pizzaria

Ginga-J

HORA DE TRABALHAR!!!

MERCADO DE TVDIMomento para ganhar $....

Empresas

Parceiros

Aplicações Olimpíadas

Aplicação Quizz

Aplicação Torcida Virtual

Aplicação Embaixadinhas

Por onde começar ?

http://www.ginga.org.br

http://www.softwarepublico.gov.br

http://gingarn.wikidot.com/

Obrigado!

aquilesburlamaqui@gmail.com