Navigace

Hlavnφ menu

 

SMIL - zßkladnφ elementy a konstrukce

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:

<switch>
  <element hodnotici_atribut="hodnota" />
  <element hodnotici_atribut="hodnota2" />
</switch>

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 (640x480, 800x600, 1024x768...)
  • system-screen-depth - barevnß hloubka monitoru

P°φklad nakonec, urΦenφ jazyka klienta:

<switch>
    <video src="video-cz.mpg" system-language="cz" />
    <video src="video-sk.mpg" system-language="sk" />
    <video src="video-fr.mpg" system-language="fr" />
    <video src="video-en.mpg" />
</switch>

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).

<a href="http://interval.cz" show="new">
  <img src="obrazek.png" region="r1" />
</a>

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).

<img src="obrazek.png" region="r1">
  <anchor href="http://interval.cz" show="new" coords="10, 10, 100, 100" />
</img>

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∙ (80x80 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).

V²sledkem pou₧itφ vÜech modul∙ je velmi efektivnφ multimedißlnφ prezentace srovnatelnß t°eba s Φasto pou₧φvan²m Power Pointem.

Grimmich, èimon (13. 7. 2004)