Připojení složitějšího stylu

Sekce pro styly se vytváří přímo v kořenové sekci dané prezentace. V našich příkladech pro ni zvolíme jméno styles.

Styly se obyčejně mění poměrně málo, nezávisí na obsahu a jejich podoba je zcela nezávislá na jakékoli interakci s uživatelem. Proto je obyčejně výhodné jednou vygenerovaný styl ukládat na souborový systém a příště poskytovat jako soubor (samozřejmě dokud se nezmění).

Toto chování lze nastavit příznakem Generovat statickou podobu u sekce pro styly. Nastavení se vztahuje na veškerý obsah zveřejňovaný v této sekci.

Jako šablona sekce pro styly se nastavuje speciální šablona (konvenčně nazývaná pass_thru), která jednoduše zobrazí hlavní obsahový asset adresovaný v URL stylu. Umožní to prezentovat v sekci různé styly. Hlavní obsahový asset je hodnotou proměnné _main.

{_main}

Složka pro styly

Samotné styly je žádoucí umístit odděleně, tak, aby nebyly přístupné pro správce obsahu a publikované struktury prezentace. Vytváří se pro ně obyčejně samostatná podsložka v logic pro příslušnou prezentaci.

Tato podsložka se pak nastavuje jako datová složka sekce pro styly. Efektem tohoto (jinak celkem zbytného) nastavení jsou jednodušší URL stylů.

Každý styl je představovaný další šablonou ve složce pro styly.

Pokud má šablona generovat styl, je třeba se nějakým způsobem vypořádat se skutečností, že ve stylu se často vyskytují složené závorky. Tyto závorky by totiž měly v jazyce TFS speciální význam: parser by je interpretoval jako znaky, které vyznačují TFS instrukce.

Pro styly je tedy třeba přepnout režim zpracování šablony: na začátek stylu umístit trojici znaků {<? a na jeho konec trojici znaků ?>}. Vše, co je mezi těmito sekvencemi, se zpracovává odlišně: složené závorky zde nemají žádný speciální význam a pro vyznačení TFS instrukcí se používají znaky <? na začátku a ?> na konci.

Pokud tedy přidáme na začátek stylu znaky {<? a na jeho konec ?>}, můžeme ho použít jako tělo šablony.

Styl obsažený v šabloně bude systém zveřejňovat jako stránku identifikovanou následujícími hodnotami:

• obsahový asset je šablona se stylem;
• primární sekce je sekce vytvořená pro styly;
• formát výstupu je css;
• výpis je jazykově nespecifický, tzn. jazyk je none.

K sestrojení takto strukturovaných odkazů slouží funkce link. Bylo by tedy možné připojit k hlavní šabloně vlastnosti referující k šabloně se stylem a k sekci pro styly a vytvořit odkaz v šabloně.

<link href="{link(_template.styles_section, _template.screen_css, "css", "none")}"
  type="text/css" media="screen" rel="stylesheet" />

Opět je ale lepší praxe vytvořit celý odkaz v editaci odkazů šablony a pak ho načítat pomocí funkce target. V tomto případě půjde o interní odkaz; je třeba nastavit v něm všechny položky uvedené výše.

<link href="{target(_template, "screen_css")}"
  type="text/css" media="screen" rel="stylesheet" />

Odkazy na styly se generují do statické podoby. Optimálního výsledku při jejich ukládání do vyrovnávací paměti prohlížeče se dosáhne, pokud bude HTTP hlavička Expires nastavená na vzdálenou budoucnost (to musí zajistit administrátor příslušné instance systému) a současně se URL mění s každou novou verzí stylu.

Pro toto je vhodné použít parametr výpisu odkazu link:version_asset. Hodnotou tohoto parametru musí být asset. Z interního odkazu je možné získat obsahový asset jako jeho vlastnost main. Použijeme konstrukci s příkazem with, který nastaví získaný odkaz jako hodnotu proměnné _.

<link href="{with target(_template, "screen_css")}{_ link:version_asset=_.main}{/with}"
  type="text/css" media="screen" rel="stylesheet" />

Pokud by se typ odkazu na styl změnil na něco jiného než interní odkaz, nebude mít uvedený zápis s link:version_asset žádný efekt, ale také nebude ničemu na škodu.

Všechny tyto kroky jsme podnikli proto, abychom mohli ve stylu používat URL obrázků na základě identifikace assetů, které obrázky obsahují.

Obrázky pro styl se pokládají za součást prezentační logiky; vytvoříme tedy pro ně podsložku images. V ní vytvoříme pro každý obrázek jeden asset. (Dá se předpokládat, že takových obrázků nebude mnoho. Pokud je ve stylu obsaženo velké množství odkazů na obrázky, je to důvod uvažovat o jeho optimalizaci ještě před převodem do systému jNetPublish.)

V případě odkazů na obrázky nepředpokládáme, že by bylo nutné do budoucna měnit typ odkazu. Proto pro vytvoření odkazu na obrázek v šabloně stylu použijeme funkci ref způsobem popsaným v předchozí kapitole. Odlišností je použití znaků <? na začátku a ?> na konci TFS instrukcí.

{<?
...
#header { background-image: url('<? ref(_template.header) ?>'); }
#footer { background-image: url('<? ref(_template.footer) ?>'); }
...
?>}

Složitější styl se z pohledu autora prezentační logiky generuje podobným způsobem jako HTML stránka, která ho odkazuje. Samotný styl je obsažený v adresované šabloně a může obsahovat dynamicky generované odkazy na soubory, zejména obrázky.