SMIL – základní elementy a konstrukce

13. července 2004

•

V předchozím článku o Synchronized Multimedia Integration Language jsem se věnoval jeho podpoře v různých programech a teoreticky jsem přiblížil multimediální technologii SMIL. Tentokrát bych vám rád přiblížil některé ze základních prvků jazyka SMIL.

SMIL 1.0

Nejprve se podíváme na specifikaci SMIL 1.0. Jde o velmi jednoduchý jazyk, který sestává z nemnoha značek. Nejdůležitější částí SMIL dokumentu je DTD, která vypadá následovně:

<!DOCTYPE smil PUBLIC „-//W3C//DTD SMIL 1.0//EN“ „http://www.w3.org/TR/REC-smil/SMIL10.dtd“>

Kořenovým elementem dokumentu je prvek smil. SMIL dokument je rozdělen do dvou částí (podobně jako dokument (X)HTML). První část je tvořena elementem head a druhá elementem body. Výsledný dokument může mít následující podobu:

<!DOCTYPE smil PUBLIC „-//W3C//DTD SMIL 1.0//EN“ „http://www.w3.org/TR/REC-smil/SMIL10.dtd“>
<smil>
<head>
…hlavička dokumentu
</head>
<body>
…tělo dokumentu
</body> </smil>

Hlavička dokumentu

Hlavička dokumentu obsahuje obecné informace a nastavení celého dokumentu. V hlavičce se nastavuje pozadí, rozměry prezentace, pozice jednotlivých prvků a podobně. Kromě toho může element head obsahovat několik dalších elementů:

meta – použití elementu je podobné jako v dokumentech (X)HTML
layout – element layout nastavuje rozvržení dokumentu

Pro určení rozvržení dokumentu může element layout obsahovat další dva prvky – root-layout a region. Element root-layout nastavuje vlastnosti celého dokumentu pomocí několika atributů – „background-color“ (barva pozadí), „height“ (výška okna), „width“ (šířka okna), „title“ (titulek). Element region vytváří imaginární obdélníky, do kterých bude později možné nahrát multimédia. Zkrátka u vloženého obrázku nastavíte, do kterého regionu se má nahrát. Prvek region má tyto atributy:

id – identifikátor regionu
background-color – barva pozadí
left – pozice od levého okraje okna
top – pozice od horního okraje okna
height – výška regionu
width – šířka regionu
z-index – tento atribut řeší překrývání dvou regionů (stejně jako v CSS)

Elementy region i root-layout jsou prázdné elementy.

Tělo dokumentu

Tělo dokumentu je tvořeno elementem body. Následující elementy vkládají jednotlivá média:

img – obrázek
audio – zvuk
video – video
text – textový objekt (HTML, TXT)

Pro tyto elementy existuje mnoho společných atributů:

src – URL zdroje
alt – popisek
dur – trvání v časové ose
begin – začátek v časové ose
end – konec v časové ose
region – id regionu, ve kterém se má objekt zobrazit
top, left, height, width – rozměry

Časová osa a synchronizace

Atributy „begin“, „dur“ a „end“ pracují s časovou osou. Časová osa začíná nulou (od spuštění dokumentu). Atribut „begin“ určuje sekundu, od které má být objekt zobrazen. Atribut „dur“ určuje dobu trvání objektu, případně lze také použít atribut „end“, který nastavuje sekundu ukončení objektu.

Jednotlivé objekty je možné seskupovat a následně synchronizovat pomocí elementů seq a par, které je možné i vnořovat.

seq – definuje sekvenční zobrazení (pokud obsahuje více jak jeden objekt, zobrazuje objekty postupně, jeden po druhém, přičemž atribut „begin“ nastavuje časovou prodlevu od předchozího objektu)
par – definuje paralelní zobrazení objektů (objekty budou zobrazeny současně, přičemž atribut „begin“ nastavuje časovou prodlevu od spuštění prezentace)

Kontrola obsahu

Kontrolou obsahu se rozumí rozhodnutí o vhodném médiu. SMIL je schopný zjišťovat vlastnosti klientského počítače (jazyk, rozlišení a další) a závisle na zjištěních poskytovat alternativy. Obecný zápis vypadá takto:

Použitelných atributů existuje několik:

system-bitrate – rychlost připojení v bps (28 800, 56 000…)
system-language – systémový jazyk (en, sk, cz…)
system-screen-size – rozlišení monitoru (640×480, 800×600, 1024×768…)
system-screen-depth – barevná hloubka monitoru

Příklad nakonec, určení jazyka klienta:

Konstrukce zjistí, zda se má přehrávat česky, slovensky nebo francouzsky a pokud ani jedna možnost nevyhovuje, bude použit anglický snímek.

Odkazy

Použití elementu a je velmi obdobné použití v (X)HTML, hodnotou atributu „href“ je URL nebo „id“ jiného objektu. SMIL přidává atribut „show“, který může nabývat hodnot „replace“, „new“ a „pause“. V případě použití „replace“ bude aktuální prezentace pozastavena a nahrazena novou, při použití „new“ bude prezentace otevřena v novém okně a původní bude pokračovat dál, při použití „pause“ se nová prezentace otevře v novém okně a původní je pozastavena. Obsahem elementu a může být některý z objektů (img, video, audio…) nebo synchronizační elementy (par a seq).

Druhý možný odkaz se vytváří elementem anchor, který se podobá klikacím mapám v HTML. Atribut „coords“ vymezuje obdélníkovou oblast, určenou hodnotami „top“, „left“ (souřadnice horního rohu) a „bottom“, „right“ (dolní roh).

Ukázková prezentace

Níže si můžete prohlédnout kód ukázkové prezentace, kterou si můžete zobrazit také on-line, například v Apple Quick Time Playeru.

<!DOCTYPE smil PUBLIC „-//W3C//DTD SMIL 1.0//EN“ „http://www.w3.org/TR/REC-smil/SMIL10.dtd“>
<smil>
  <head>
    <layout>
      <root-layout width=“160″ height=“160″ background-color=“white“/>
      <region id=“r1″ top=“0″ left=“0″ height=“80″ width=“80″ />
      <region id=“r2″ top=“0″ left=“80″ height=“80″ width=“80″ />
      <region id=“r3″ top=“80″ left=“0″ height=“80″ width=“80″ />
      <region id=“r4″ top=“80″ left=“80″ height=“80″ width=“80″ />
  </layout>
  </head>
  <body>
    <par>
      <img src=“objekt.png“ begin=“1s“ dur=“5s“ region=“r1″ />
      <img src=“objekt.png“ begin=“2s“ dur=“4s“ region=“r2″ />
      <seq>
        <img src=“objekt.png“ begin=“1s“ dur=“5s“ region=“r3″ />
        <img src=“objekt.png“ begin=“2s“ dur=“4s“ region=“r4″ />
      </seq>
    </par>
  </body>
</smil>

V příkladu je okno rozděleno do čtyř čtverců (80×80 px). Je zde také jasně zřetelný rozdíl mezi par a seq. Po spuštění prezentace se po jedné sekundě zobrazí obrázek v regionu r1 a r3, o sekundu později obrázek v regionu r2 a o dalších šest sekund později obrázek v regionu r4 (ten se zobrazí dvě sekundy po skončení předchozího obrázku).

SMIL 2.0

Asi mi dáte za pravdu, že naučit se používat SMIL 1.0 není žádný zvláštní problém, stačí si jen umět spočítat na prstech časy všech objektů a výsledek je zaručen. Bohužel rozdíl mezi specifikací SMIL 1.0 a SMIL 2.0 je propastný. V novější specifikaci přibylo mnoho stránek a těžko by se mi je podařilo shrnout do jednoho článku (což u SMIL 1.0 možné bylo, i když jsem se rozhodl nepopisovat úplně vše).

SMIL 2.0 přidává především moduly pro interaktivitu (uživatel může reagovat na prezentaci – měnit parametry objektů) a animace (změna barvy, parametru, pohyb po křivce). Závažnou změnou je modularizace, tedy rozdělení prvků SMILu do skupin – modulů, což umožňuje použít vybrané vlastnosti SMILu k doplnění jiného formátu. Kupříkladu animační moduly jsou použity v SVG. SMIL 2.0 obsahuje celkem 45 modulů rozdělených do deseti skupin:

Animation Modules: Moduly obsahující elementy a atributy k začlenění animace do dokumentu. Některé animační moduly přebírá SVG (samozřejmě s jistými odlišnostmi).
Content Control Modules: Moduly obsahující atributy a elementy pro kontrolu obsahu (rozhodovací konstrukce). Jde o moduly, které zjišťují informace o systému návštěvníka – rychlost připojení, rozlišení, jazyk a podobně. Závisle na zjištěných datech je možné poskytnout návštěvníkovi odpovídající obsah, například audio v jím preferovaném jazyce. Část tohoto modulu byla obsažena již ve SMIL 1.0, a to v podobě elementu switch pro rozhodovací konstrukci.
Layout Modules: Moduly pro návrh (rozložení) prezentace. Obsahem jsou zejména elementy root-layout, layout a region. Tento modul nepopisuje pouze rozvržení dokumentu, ale také hlasitosti audio a video médií. Tento modul popisuje spíše vzhled než sémantiku.
Linking Modules: Moduly určené k tvorbě odkazů (ze SMIL 1.0 přetrvávají elementy anchor, a).
Media Object Modules: Moduly sloužící k začlenění médií do dokumentu (audio, video, img a mnoho dalších elementů).
Matainformation Modules: Metainformační moduly reprezentované podobně jako v (X)HTML elementem meta a nově elementem metadata, který pracuje s RDF.
Structure Modules: Strukturní moduly popisují rozčlenění dokumentu (elementy smil, head, body a jejich atributy).
Timing and Synchronization Module: Časovací a synchronizační moduly (par, seq a další nové elementy a atributy).
Time Manipulations Module: Moduly pro změny působení času. Obsahem jsou například atributy, které nastavují rychlost přehrávání médií – zrychlení či zpomalení oproti normálu.
Transition Effects Module: Modul pro tvorbu přechodů (změna barvy v určitém časové úseku).