XSL -- stylov² jazyk pro nßroΦnΘ

Ji°φ Kosek ml.

eXtensible Stylesheet Language (XSL) pracuje na zcela jinΘm principu ne₧ kaskßdovΘ styly. XSL je jazyk, kter²m vytvß°φme pravidla pro transformaci jednΘ t°φdy XML dokument∙ na jin² XML dokument. V²sledn² dokument, kter² vznikne aplikovßnφm transformaΦnφch pravidel, je pou₧it pro zobrazenφ. Dnes se nejΦast∞ji XSL styl vytvß°φ tak, aby v²sledkem jeho aplikovßnφ byl HTML dokument. To umo₧≥uje vyu₧φt souΦasnß jßdra prohlφ₧eΦ∙, kterß si se zobrazenφm HTML poradφ. Navφc lze XML dokumenty pomocφ XSL transformovat do HTML jeÜt∞ na serveru, a tak zp°φstupnit XML dokumenty libovolnΘmu prohlφ₧eΦi.

Obr. 1: Princip prßce s XSL styly

XSL je prozatφm nßvrh standardu, kter² p°ipravuje konsorcium W3C. XSL krom∞ transformaΦnφho jazyka (kter² b²vß n∞kdy oznaΦovßn jako XSLT) obsahuje i vlastnφ formßtovacφ model, kter² m∙₧eme pou₧φt nap°φklad mφsto v²stupu do HTML. Formßtovacφ model vychßzφ z jazyk∙ CSS a DSSSL a jeho cφlem je nabφdnout minimßln∞ to, co stylovΘ jazyky, ze kter²ch vychßzφ.

Pokud si chceme XSL vyzkouÜet v praxi, musφme se dnes v podstat∞ omezit na XSLT. Ten je a₧ na drobnΘ v²jimky ve shod∞ se standardem W3C implementovßn v IE 5.0. Formßtovacφ model XSL zatφm zvlßdajφ (a to pouze ΦßsteΦn∞) jen n∞kterΘ testovacφ implementace, kterΘ rozhodn∞ nejsou urΦeny pro rutinnφ nasazenφ.

Dnes se podφvßme na zßklady transformaΦnφho jazyka XSL, kterΘ si m∙₧eme rovnou vyzkouÜet nap°φklad ve spojenφ s IE 5.0. Gecko zatφm bohu₧el XSL nepodporuje. A₧ bude k dispozici i n∞jakß snadno dostupnß implementace formßtovacφ modelu XSL, urΦit∞ vßs s nφ na strßnkßch naÜeho t²denφku seznßmφme.

Zßklady XSL

XSL styl je sßm o sob∞ XML dokumentem. M∞l by proto zaΦφnat odpovφdajφcφ XML deklaracφ:

<?xml version="1.0" encoding="utf-8"?>

Jeliko₧ je v²sledkem aplikovßnφ XSL stylu XML dokument, musφme ve stylu pou₧φvat elementy, kterΘ se vyskytnou ve v²slednΘm XML dokumentu. Aby se navzßjem nepomφchaly elementy z cφlovΘho dokumentu a ze stylu, pou₧φvajφ se tzv. jmennΘ prostory (namespaces). P°ed nßzvy vÜech element∙ stylu, kterΘ souvisejφ s XSL se p°ed°adφ xsl:, aby se odliÜily od ostatnφch. Pou₧itφ jmennΘho prostoru je pot°eba deklarovat u ko°enovΘho elementu stylu stylesheet.

<xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl">

Samotn² styl se sklßdß p°evß₧n∞ ze Üablon. Pomocφ Üablony vybereme v₧dy urΦit² element a urΦφme, co se mß s jeho obsahem ud∞lat. Definice Üablony se provßdφ pomocφ elementu template a elementy, na kterΘ se pou₧ije, se urΦujφ pomocφ vzoru zapsanΘho do atributu match. Pokud bychom cht∞li, aby se element para pomocφ stylu p°em∞nil na HTML element p pro odstavec, pou₧ijeme nßsledujφcφ Üablonu:

<xsl:template match="para">
  <p><xsl:apply-templates/></p>
</xsl:template>

Element apply-templates XSL procesoru °φkß, aby obsah elementu para postoupil dalÜφm Üablonßm -- ty zpracujφ samotn² text odstavce, p°φpadn∞ dalÜφ elementy, kterΘ mohou nap°φklad m∞nit pou₧it² styl pφsma. Tagy <p> a </p> se objevφ ve v²slednΘm HTML dokumentu.

Pokud nechceme, aby byl zpracovßn cel² obsah elementu, m∙₧eme u apply-templates pou₧φt atribut select a pomocφ vzoru urΦit, kterΘ Φßsti elementu se majφ zpracovat.

Pou₧itφ atributu select je velmi siln² nßstroj. Jeho vhodn²m pou₧itφm, m∙₧eme Φßsti dokumentu vy°adit ze zobrazenφ nebo m∞nit po°adφ element∙ na v²stupu. Kdybychom nap°φklad cht∞li nßÜ ukßzkov² XML dokument zobrazit tak, ₧e nejprve bude jmΘno autora, pak nßzev Φlßnku a rubrika nebude v∙bec zobrazena, pou₧ijeme ve stylu nßsledujφcφ jednoduchou Üablonu:

<xsl:template match="zahlavi">
  <xsl:apply-templates select="autor"/>
  <xsl:apply-templates select="nazev"/>
</xsl:template>     

D∙le₧it²m nßstrojem pro identifikaci jednotliv²ch Φßstφ dokumentu jsou vzory, kterΘ jsme pou₧ili v atributech match a select. Vzorem nemusφ b²t jen samotn² nßzev elementu. Mo₧nosti jsou mnohem ÜirÜφ, jak je vid∞t v tabulce 1.

Chceme-li vytvß°et vlastnφ styly v XSL, musφme znßt princip, na kterΘm styl pracuje. Na ka₧d² element dokumentu se aplikuje Üablona, kterß mß vyhovujφcφ vzor. Pokud je element mo₧no zpracovat pomocφ vφce Üablon, mß p°ednost ta poslednφ. Podle specifikace XSL by m∞l mφt ka₧d² XSL procesor zabudovßny Üablony, kterΘ zp∙sobφ vypsßnφ celΘho dokumentu. To usnadnφ psanφ styl∙, proto₧e pak staΦφ pomocφ Üablon oÜet°it elementy, u kter²ch po₧adujeme specißlnφ formßtovßnφ. IE bohu₧el tyto Üablony nemß zabudovanΘ. Na zaΦßtku ka₧dΘho XSL stylu, kter² chceme pou₧φt i v IE, bychom proto m∞li uvΘst definici nßsledujφcφch t°φ Üablon:

<xsl:template match="/">
  <xsl:apply-templates/>		
</xsl:template>

<xsl:template match="*">
  <xsl:apply-templates/>
</xsl:template>

<xsl:template match="text()">
  <xsl:value-of select="."/>
</xsl:template>

Prvnφ Üablona zajistφ zpracovßnφ ko°enovΘho elementu dokumentu. Druhß Üablona se postarß o to, ₧e budou zpracovßny vÜechny elementy. KoneΦn∞ poslednφ Üablona do v²slednΘho dokumentu vypφÜe textov² obsah vÜech element∙ na nejni₧Üφ ·rovni. Dφky tomu, ₧e pozd∞ji uvedenΘ Üablony majφ vyÜÜφ prioritu, neovlivnφ tyto t°i Üablony nijak dalÜφ zpracovßnφ dokumentu.

Na ukßzce 3 vidφte p°φklad stylu, kter² m∙₧eme pou₧φt pro zpracovßnφ naÜeho ukßzkovΘho XML dokumentu. V²slednΘ zobrazenφ je tΘm∞° shodnΘ jako p°i pou₧itφ CSS. Mohli jsme si vÜak dovolit provßd∞t r∙znß "kouzla", na kterß kaskßdovΘ styly nestaΦφ. Pomocφ ÜikovnΘho vzoru jsme nap°φklad zφskali nßzev Φlßnku a umφstili ho jako titulek strßnky do popisu okna prohlφ₧eΦe.

Ukßzka 3: XSL styl a jeho zobrazenφ

XSL styl

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl">

  <xsl:template match="/">
    <html>
      <head>
	<title>
	  <xsl:apply-templates select="clanek/zahlavi/nazev/text()"/>
	</title>
      </head>
      <body style="background-color: white;
	           font-family: Arial, Verdana, sans-serif"> 
	<xsl:apply-templates/>		
      </body>
    </html>
  </xsl:template>

  <xsl:template match="*">
    <xsl:apply-templates/>
  </xsl:template>

  <xsl:template match="text()">
    <xsl:value-of select="."/>
  </xsl:template>

  <xsl:template match="zahlavi">
    <div style="text-align: center;
                padding: 10pt;
                margin: 20pt; 
                background-color: silver;
                border: 4pt outset silver">
      <xsl:apply-templates/>
    </div>
  </xsl:template>

  <xsl:template match="rubrika">
    <div style="float: right; 
                color: yellow;
                font-size: small;
                font-weight: bold">
      <xsl:apply-templates/>
    </div>
  </xsl:template>
      
  <xsl:template match="nazev">
    <div style="font-size: 300%;
                text-transform: uppercase;
                color: blue;
                margin: 5pt">
      <xsl:apply-templates/>
    </div>
  </xsl:template>

  <xsl:template match="autor">
    <div style="font-style: italic">
      <xsl:apply-templates/>
    </div>
  </xsl:template>

  <xsl:template match="perex">
    <div style="margin: 5pt 20pt;
                font-style: italic;
                font-weight: bold">
      <xsl:apply-templates/>
    </div>
  </xsl:template>

  <xsl:template match="para">
    <div style="margin: 5pt 20pt">
      <xsl:attribute name="align">
	<xsl:choose>
	  <xsl:when test="@zarovnani[.='nastred']">center</xsl:when>
	  <xsl:when test="@zarovnani[.='doprava']">right</xsl:when>
	  <xsl:when test="@zarovnani[.='doleva']">left</xsl:when>
	  <xsl:otherwise>left</xsl:otherwise>
	</xsl:choose>
      </xsl:attribute>
      <xsl:apply-templates/>
    </div>
  </xsl:template>

  <xsl:template match="em">
    <strong>
      <xsl:apply-templates/>
    </strong>
  </xsl:template>

</xsl:stylesheet>

Pomocφ stylu zpracuje XSL procesor nßÜ dokument a vznikne HTML strßnka:

<html>
  <head>
    <title>
      XML a stylovΘ jazyky
    </title>
  </head>
  <body style="background-color: white; font-family: Arial, 
  Verdana, sans-serif">
    <div style="text-align: center; padding: 10pt; margin: 20pt; 
    background-color: silver; border: 4pt outset silver">
      <div style="float: right; color: yellow; font-size: small; 
      font-weight: bold">
        TΘma t²dne
      </div>
      <div style="font-size: 300%; text-transform: uppercase; 
      color: blue; margin: 5pt">
        XML a stylovΘ jazyky
      </div>
      <div style="font-style: italic">
        Ji°φ Kosek
      </div>
    </div>
    <div style="margin: 5pt 20pt; font-style: italic; font-weight: 
    bold">
      V n∞kolika p°edchozφch Φφslech Computerworldu jsme se
      seznßmili s jazykem XML a s tφm jak v n∞m vytvß°et dokumenty.
      Jazyk XML je v²born² formßt pro p°enos dat mezi r∙zn²mu
      systΘmy. V urΦitΘm okam₧iku vÜak v₧dy do procesu zpracovßnφ
      dokument∙ a dat vstupuje Φlov∞k. V tomto okam₧iku je pot°eba
      dokument prezentovat ve form∞, kterß je pro Φlov∞ka
      nejsrozumiteln∞jÜφ.
    </div>
    <div style="margin: 5pt 20pt" align="center">
      Jazyk XML definuje pouze strukturu dokument∙. Chceme-li vÜak
      dokument p°ehledn∞ zobrazit, musφme n∞jak²m zp∙sobem
      definovat, jak se jednotlivΘ elementy zobrazφ -- jakou
      barvou, jak²m pφsmem, jak budou zarovnanΘ apod. Pro definici
      vzhledu dokument∙ se dnes pou₧φvajφ tzv. <strong>stylovΘ
      jazyky</strong> . Mezi t°i nejznßm∞jÜφ a nejpou₧φvan∞jÜφ
      pat°φ jazyky CSS, XSL a DSSSL.
    </div>
    <div style="margin: 5pt 20pt" align="right">
      V dneÜnφm tΘmatu t²dne se na n∞ podφvßme podrobn∞ji a ukß₧eme
      si, jak vytvo°it XML dokument a odpovφdajφcφ styl tak, aby se
      dokument dal zobrazit v prohlφ₧eΦφch, kterΘ podporujφ XML
      (konkrΘtn∞ tedy v Internet Exploreru 5.0 a ve v²vojovΘ verzi
      Netscape Navigatoru znßmΘ pod nßzvem Gecko).
    </div>
  </body>
</html>

Zobrazenφ dokumentu pomocφ XSL stylu v IE 5.0. XSL je mnohem flexibiln∞jÜφ a mocn∞jÜφ nßstroj ne₧ CSS. Na druhou stranu zatφm nepodporuje n∞kterΘ typografickΘ finesy CSS jako pseudoelementy pro prvnφ pφsmeno Φi °ßdku.

XSL podporuje i mnoho dalÜφch konstrukcφ, o kter²ch jsme se dosud nezmφnili. Nenφ problΘm styl obohatit o podmφnky, cykly a dalÜφ. K dispozici mßme n∞kolik nßstroj∙ na °azenφ element∙ podle tΘm∞° libovoln²ch kritΘriφ. Chceme-li n∞kterΘ elementy automaticky Φφslovat, nenφ to samoz°ejm∞ pro XSL problΘm. Podobn∞ jako u CSS. m∙₧eme v jednom stylu naΦφtat dalÜφ a jejich kombinovßnφm dosßhnout po₧adovanΘho v²sledku. Podrobn∞jÜφ informace o XSL naleznete v nßvrhu specifikace XSL na strßnkßch konsorcia W3C.