smil 1.0 gaspare giuliano bruno. historico dec 1995: towards a real-time multimedia web, 4th www...
TRANSCRIPT
SMIL 1.0
Gaspare Giuliano Bruno
Historico
• Dec 1995: Towards a Real-Time Multimedia Web, 4th WWW conference, Boston
• Nov 1997: Primeiro Draft SMIL 1.0
• Abr 1998: W3C Recomendation SMIL 1.0 • Jul 1998: Beta G2 da Real suporta SMIL 1.0 • Nov 1999: Draft SMIL 2.0 (Boston)
• Jan 2000: Apple Quicktime 4.1 (SMIL 1) e Internet Explorer 5.5 (XHTML+TIME 2)
Historico
• Outubro 2000: Adobe suporta SMIL (Adobe GOLive 5.0)
• Junho 2001: Grins, primeiro player SMIL 2.0 • Agosto 2001: Internet Explorer 6.0 Suporta SMIL 2.0
(XHTML+SMIL) • Agosto 2001: Draft XHTML+SMIL
• Agosto 2001: W3C Recomendation SMIL 2.0
• Setembro 2001: RealOne Plataform Beta, Suporte completo a SMIL 2.0
Exemplos
• The Doctor's Trial at Nuremberg
• Finance2000: Mutual Funds in the Global Marketplace
Estrutura<SMIL>
<HEAD>
...
</HEAD>
<BODY>
...
</BODY>
</SMIL>
Head: Informações NãoTemporais (Layout, MetaDados, etc...)
Body: Informações Temporais(Seqüência de mídias,paralelismo, etc..)
Meta Dados
• Incluso dentro do Head
• Possui informações sobre a apresentação em geral (Autor, Versão, etc...)
<head> <meta name="Publisher" content="W3C" /> <meta name="Date" content="1999-10-12" /> <meta name="Rights" content="Copyright 1999 John Smith" /> <meta http-equiv="Expires" content=" 31 Dec 2001 12:00:00 GMT"/>
</head>
Layout
• Define o posicionamento das mídias na apresentação.
• Composto por:– root-layout: Define o molde da apresentação (tamanho,
comprimento, cor de fundo, etc...)
– region:
– Define uma área dentro da raiz.
– Possui um identificador (ID) para se relacionar com as medias.
– Pode conter informações de sobreposição (z-index)
Layout
<layout> <root-layout height="140" width="210" background-color="#ffffff" title="Attributes"/> <region id="face" width="210" height="140" top="0" left="0" z-index="2" /> <region id="hand" width="180" height="104" top="18" left="15" z-index="3" /> <region id="era_text" width="160" height="60" top="40" left="35" z-index="4" /> <region id="time_text" width="130" height="60" top="40" left="55" z-index="5" />
</layout>
Layout
• Parâmetro fit• fit é usado para determinar a ação a ser executada
caso o tamanho da mídia seja diferente do tamanho da região informada.
• Segue os seguintes padrões:
Mídias
• Definidas sempre dentro do campo Body
• Precisam de uma região de layout (a não ser que sejam medias seqüenciais ou seja mídia de áudio)
• Pode ser:– audio
– video
– img
– text
– textstream
Midias
<body> <video src="video/video1-8.mpg" /> <video src="video/video2-8.mpg" /> <video src="video/video3-8.mpg" /> <audio src=”audio/audio1-8.mp2" /></body>
Sincronismo
• O sincronismo de medias se da com o uso dos elementos <par>, para mídias em paralelo, e <seq> para mídias em seqüência.
• É obrigatório informar a região de layout onde a mídia ira ser executada
Sincronismo
<body> <par> <video src="video/video1-8.mpg" /> <audio src=“audio/audio1-8.mp3” /> </par></body>
Clipping
• Clipping é a técnica de cortar uma media em fatias de tempo
• Composta por• clip-begin
• clip-end
• tempos: 15s, 0.5s, 2:01, 1m, 1h, etc...
Clipping
<body> <par> <video region="video1" src=”video.mpg" /> <video region="video2" src="video.mpg” clip-begin=“4s” /> </par> </body></smil>
Inline Timing• Consiste em definir o momento em que uma
midia entra, quanto tempo ela toca, e o momento em que ela sai
• Comporto por• dur, begin, end
• Importante para mídias não temporais (text, img)• Pode usar referencia a outras mídias: id(vid),
id(vid)(4s)
Inline Timing
<body> <par> <video region="video1" src=”video.mpg" dur=“8s”/> <video region="video2" src="video.mpg” begin=“4s” dur=“8s”/> </par> </body></smil>
Fill
• Usado para determinar a ação a ser executada caso uma mídia, após executada normalmente, não atinja o final do tempo de apresentação.
• Pode conter os valores “remove” e “freeze”• EX:
<video src="videossong.rm" dur="30s” fill="freeze"/>
EndSync
• O parâmetro endsync permite o controle de um bloco paralelo do smil.
• Com ele, é possível informar qual é a mídia mestre de um bloco de mídias em execução paralela.
• A mídia mestre informa quando o bloco irá terminar.
Endsync
• Seus valores são:– first: a primeira mídia a terminar sua execução
encerra todo o bloco.– last: o bloco é executado até a última mídia
terminar.– id(mídia): o bloco é executado até que a mídia
informada termine.
EndSync
• EX:<par endsync="id(vid)">
<video id="vid" src="videossong.rm"/><textstream src="lyricssong.rt"/>
</par>
Paramentros de Teste
• Utilizado para selecionar um determinado conteúdo de acordo com o ambiente em execução.
• São empregados utilizando o elemento <switch>
Parâmetros de Teste
• system-bitrate– Executado apenas se a taxa de transmissão (bitrate)
estiver igual ou maior que o valor informado.
– EX: <switch>
<par system-bitrate="40000"> ... </par> <par system-bitrate="24000"> ... </par></switch>
Parâmetros de Teste
• system-language• Executado se o código do pais informado for igual
ao definido no sistema operacional (ou player)
• EX:<switch>
<audio src="joe-audio-fr.wav" system-language="fr"/>
<audio src="joe-audio-em.wav" system-language="en"/>
</switch>
Parâmetros de Teste
• system-screen-size - system-screen-depth
– Executados apenas em ambientes com as características de resolução e cores informadas.
– EX <switch>
<par system-screen-size="1280X1024" system-screen-depth="16"> ........ </par> <par system-screen-size="640X480" system-screen-depth="32"> ... </par>
</switch>
Links
• A representação de um link pode ser para outro objetos qualquer (html, smil, etc...)
• É possível o posicionamento automático dentro de outra mídia SMIL utilizando o caracter #.
EX: http://www.cwi.nl/presentationB.smil#next
O posicionamento é então feito para o inicio da media com este id:<par> <video src="rtsp://foo.com/timbl.rm" region="l_window"/> <video id="next" src="rtsp://foo.com/v1.rm" region="r_window"/> <text src="rtsp://foo.com/caption1.html" region="l_2_title"/> <text src="rtsp://foo.com/caption2.rtx" region="r_2_title"/> </par>
Links
• Elemento <a>• Associa um link a uma media. Sempre que o usuário
clicar na região onde a media esta sendo apresentado, o link é executado.
• EX:<a href="http://www.cwi.nl/presentationB#next">
<video src="rtsp://foo.com/graph.imf” region="l_2_title” />
</a>
Links
• Elemento <anchor>• Associa um link a partes de uma região da media ou
links temporais (validos por um período de tempo).
• As coordenadas podem ser relativas (em porcentagem) ou absolutas.
• Para links temporais, são validos os parâmetros begin e end
• O elemento <anchor> também aceita identificadores (id). Neste caso, ele passa a agir como um destino.
Links
<video src="http://www.w3.org/CoolStuff"> <anchor href="AudioVideo” coords="0%,0%,50%,50%"/> <anchor href="Style” coords="50%,50%,100%,100%"/></video>
<video src="http://www.w3.org/CoolStuff"> <anchor href="AudioVideo" begin="0s" end="5s"/> <anchor href="Style" begin="5s" end="10s"/> </video>
Links
Apresentação A:
<a href="http://www.cwi.nl/mm/presentationB#tim"> <video id="graph" src="rtsp://foo.com/graph.imf” region="l_window"/></a>
Apresentação B:
<video src="http://www.w3.org/CoolStuff"> <anchor id="joe" begin="0s" end="5s" coords="0%,0%,50%,50%" href="http://www.w3.org/"/> <anchor id="tim" begin="5s" end="10s" coords="0%,0%,50%,50%" href="http://www.w3.org/Tim"/></video>
SMIL 1.0
FIM...
Fonte:http://www.w3.org/TR/REC-smil