Caio Neves
Leila Soriano
Agenda
O que é Ginga?
SBTVD News
NCL
API NCLua
Exemplos
O que é Ginga?
 Middleware Aberto do Sistema Brasileiro de
TV Digital (SBTVD)
 Dois Módulos
Ginga-J (Java)
Ginga-NCL (Lua - suporte)
 Grande Inovação (Ponte Java-NCL NCL-Java)
SBTVD News
Ginga-J
Primeiro draft final de setembro
Royalties free
Implementação aqui! (cesar)
Seminário de Televisão Digital: Modelo,
Cenários, Linguagem
Ginga 1.0
NCL - O que tocar?
NCL – O que tocar?
Suporta todos os tipos definidos na
norma.
A definição do que tocar define-se no
body.
<media id="video" src="/misc/video-samples/corrego1.mp4" descriptor="dsVideo"/>
<media id="lua" src="exemplo_0.lua" descriptor="dsLua"/>
<media id=“jpg" src=“img.jpg" descriptor=“img"/>
<media id=“gif" src=“img.gif" descriptor=“gif"/>
NCL - Onde tocar?
NCL – Onde tocar?
As dimensões podem ser definidas por
unidades de pixel ou por porcentagem.
<regionBase>
<region width="100%" height="100%" left="0" top="0" id="rgVideo" zIndex="2"/>
<region width="100%" height="100%" left="0" top="0" id="rgLua" zIndex="1"/>
</regionBase>
NCL - Como tocar?
NCL – Como tocar?
 Definido no head.
 Parâmetros:
 transparency
 freeze
 ...
<descriptorBase>
<descriptor id="dsVideo" region="rgVideo"/>
<descriptor id="dsLua" region="rgLua">
<descriptorParam name="transparency" value="0.7"/>
</descriptor>
</descriptorBase>
NCL – Quando tocar?
NCL – Quando tocar?
Descreve-se o comportamento do elo no
head.
Pode-se ter ações compostas.
<connectorBase>
<causalConnector id="onBeginStart">
<simpleCondition role="onBegin"/>
<simpleAction role="start"/>
</causalConnector>
</connectorBase>
NCL – Quando tocar?
Com o port pode-se tornar uma mídia
auto initialize.
 <port id="portVideo" component="video"/>
Definido no body.
NCL – Quando tocar?
Conectar a mídia ao comportamento do
elo.
<link xconnector="onBeginStart">
<bind role="onBegin" component="video"/>
<bind role="start" component="lua"/>
</link>
NCL - Estrutura
Todo documento NCL é escrito em XML
Cabeçalho do documento NCL
Uma seção de Cabeçalho do programa
(head)
Corpo do programa (body)
Pelo menos uma porta
Conclusão do documento
NCL - Estrutura
API – NCLua (Events)
 event.register (f: function)
 event.timer (time: number, f: function)
 event.post (dst: string; evt: event)
 event.uptime ()
 event.post(evt)
Classes de Eventos
Eventos Key:
evt = { class='key', type: string, key: string}
type pode ser 'press' ou 'release'.
key é o valor da tecla em questão.
evt = { class='key', type='press', key=’0’ }
Tipo ‘presentation’:
evt = { class='ncl', type='presentation', area='?',
action='start'/'stop'/'abort'/'pause'/'resume' }
Classes de Eventos
Tipo ‘selection’:
evt = { class='ncl', type='selection', area='?',
transition='stops' }
Tipo ‘attribution’:
evt = { class='ncl', type='attribution',
area='?', transition='stops' }
Classes TCP:
evt = { class=’tcp’, from=’addr:port’,
value=string }
Settings
Dados do próprio set-top-box
lang = settings.system.language
age = settings.user.age
location = settings.user.location
Persistent
Variáveis persistentes entre execuções
Divididas entre tres grupos:
“service”
“channel”
“shared”
persistent.service.total = 10
color = persistent.shared.color
API – NCLua (Canvas)
canvas:new()
Construtor vazio, imagem, (width, height)
canvas:attrSize()
retorno x, y = canvas:attrSize()
canvas:attrColor()
'white', 'aqua', 'lime', 'yellow', 'red',
'fuchsia', 'purple', 'maroon','blue', 'navy',
'teal', 'green', 'olive', 'silver', 'gray', 'black'
API – NCLua (Canvas)
canvas:attrFont (face: string; size:
number; style: string)
canvas:drawLine (x1, y1, x2, y2: number)
canvas:drawRect (mode: string; x, y,
width, height: number)
canvas:drawPolygon (mode: string)
canvas:drawPolygon('fill')(1,1)(10,1)(10,10)(1,10)()
API – NCLua (Canvas)
canvas:drawEllipse (mode: string; xc, yc,
width, height, ang_start, ang_end:
number)
canvas:drawText (text: string; x, y:
number)
canvas:flush ()
API – NCLua (Canvas)
canvas:measureText (x, y: number; text:
string)
canvas:compose (x, y: number; src:
canvas; [ src_x, src_y, src_width,
src_height: number ])
Exemplo 1
Aplicacao que conta o números de
cliques e mostra na tela.
Desafio
Faça o macaco comer a banana!
Através de captura de eventos da classe
“key”
Criação de canvas com imagens
Composição de canvas
Referências
http://www.abnt.org.br/imagens/Normal
izacao_TV_Digital/ABNTNBR156065_2008Ed1.pdf
www.ncl.org.br/documentos/TutorialNCL
3.0-2ed.pdf
Dúvidas?
Obrigado pela atenção!