Doc:Dev/GUI

Autor: Juraj Šimlovič

Skin

Za grafickú podobu výstupu do prehliadača (nazývanú skin) je zodpovedná trieda Skin, ktorá je pre požiadavku spracovávajúci modul dostupná z triedy Output.

Samotná trieda Skin je abstraktná. Definuje a implementuje základné stavebné prvky pre konkrétne implementácie, predovšetkým konštanty a metódy určené k polymorfií. V neposlednej rade obsahuje táto trieda factory metódu pre svojich potomkov, tj. metódu, ktorá podľa zadaného reťazca načíta a vráti požadovaného potomka.

Potomkovia triedy Skin (napríklad trieda SimpleSkin) tvoria finálne implementácie skinov.

Základným stavebným prvkom tried typu Skin sú súbory CSS, ktoré definujú vizuálnu podobu výstupných stránok. CSS informácia je ďalej doplnená o atribúty, ktoré priamo v CSS špecifikovať nie je možné alebo vhodné, ako napríklad doporučená veľkosť náhľadov fotiek.

Počas generovania výstupu do prehliadača je inštancia konkrétneho potomka triedy Skin zodpovedná za vygenerovanie hlavičky a pätičky výstupnej stránky; a ďalej za riadenie poriadia výstupu jednotlivých prvkov (hlavné menu, okno správ, atď.). Konkrétna implementácia triedy Skin má tak plnú kontrolu nad základnou štruktúrou výstupnej stránky a môže ľahšie rozhodovať o vizuálnej podobe skinu.

Grid

Jedným zo základných stavebných prvkov našej aplikácie je trieda Grid a jej potomkovia. Trieda Grid predstavuje abstrakciu ľubovoľného zobraziteľného zoznamu prvkov. Potomkovia triedy Grid (napríklad PhotoGrid) potom ponúkajú jednoduchý a predovšetkým zapúzdrený spôsob, ako na výstup zobraziť zoznam podporovaných objektov (napríklad fotiek).

Poznámka: Pre jednoduchosť a názornosť sa v nasledujúcom texte spomína PhotoGrid a jeho zobrazovanie fotiek. Podobne však fungujú aj gridy na zobrazovanie albumov, skupín, užívateľov a všetkých ostatných zobrazovaných objektov.

Trieda Grid pre svojich potomkov pripravuje základné metódy ako SetItems() a SetStyle(), ktorými volajúca trieda (napr. PhotoListPage) zadá čo a ako chce zobraziť. Potomok triedy Grid, PhotoGrid potom implementuje metódy Run() a Display(), ktoré zodpovedajú za korektné donačítanie zobrazovaných informácií z databáze; resp. vygenerovanie výstupného XHTML kódu.

Rozdelenie zodpovednosti

Zodpovednosť za donačítanie často i netriviálnych informácií (napríklad počty komentárov fotiek) je vždy delegovaná na samotný grid. Volajúcej triede tak vždy stačí špecifikovať čo chce zobraziť a v akom štýle/móde to chce zobraziť. PhotoGrid napríklad ponúka možnosť zobrazenia v štýloch DETAIL, THUMBS, COMMON, FULL a LIST a v módoch USER a ADMIN. Použitie rôznych štýlov a rôznych módov tak vo výsledku znamená zobrazenie rôznych informácií v rôznej podobe.

Príklad zobrazenia gridu:

function Run ()
{
  // load photos for the grid
  $photos = Photo::LoadByFilter ($filterData, $sortData, $page, $pageLen);
 
  // create and setup photo grid
  $this->grid = new PhotoGrid ();
  $this->grid->SetItems ($photos);
  $this->grid->SetStyle (THUMBS, USER);
 
  // let the grid work up our wishes
  $this->grid->Run ();
}
 
function Display ()
{
  // let the grid work out our wishes
  $this->grid->Display ();
}

Druhou zaujímavou skupinou metód v triede Grid sú metódy Harvest(). Tie z Requestu pozbierajú informácie o tom, ktoré checkboxy užívateľ zaškrtol a pod. Volajúca trieda tak dostane rovno hotový zoznam označených fotiek.

Príklad zozbierania informácií o označených fotkách:

function Run ()
{
  // create empty photo grid
  $grid = new PhotoGrid ();
 
  // retreive list of selected items
  $selected = $grid->Harvest ($request);
 
  // load those items from database
  $photos = Photo::LoadByIdSet ($selected);
 
  // execute the requested action
  $this->PerformAction ($photos);
}

Treťou zaujímavou skupinou metód sú AddActionButton() a SetTitleLink(), ktoré do gridu pridávajú k jednotlivým fotkám tlačítka s rôznymi akciami. Volajúca trieda si jednoducho nadefinuje sadu tlačítok a grid sa postará o ich správne zobrazenie u každej fotky.

Daľšie komponenty

Aby sme predišli opakovania toho istého kódu na rôznych miestach, snažili sme sa vo veľkej miere implementovať a používať generické komponenty. Grid a jeho potomkovia sú jedným príkladom tohto prístupu. Ďalšie príklady sú komponenty na stránkovanie, filtrovanie, lišta s tlačítkami, hlavné menu a menu príbuzných liniek.

Všetky komponenty implementujú interface Body a umožňujú tak vďaka polymorfizmu automatické spracovanie a automatické generovanie výslednej stránky v prípadoch, kedy sa výsledná stránka skladá výhradne zo samých komponent.

QuickBox

Medzi jednoduché komponenty patria napríklad potomkovia triedy QuickBox. QuickBox predstavuje ľubovoľnú komponentu zobraziteľnú ako dodatočnú informáciu ku stránke. Jedným z potomkov triedy QuickBox je napríklad hlavné menu. Ďalším často využívaným potomkom je napr. mini-login objavujúci sa pod hlavným menu.

Hlavná myšlienka triedy QuickBox spočíva v poskytnutí abstrakcie pre zobrazovanie doplňujúcich informácií, ktoré síce nie sú súčasťou tela stránky, ale k telu nejakým spôsobom logicky patria. Príkladom takéhoto lokálneho použitia je StorageQuickBox, ktorý sa zobrazuje výhradne na stránkach týkajúcich sa fotiek. O tom, kedy sa StorageQuickBox zobrazí a kedy nie pritom nerozhoduje Output, alebo Skin, ale až samotná PhotoListPage.

GridHeader

GridHeader patrí medzi samostatné komponenty. Jeho úlohou je rozumne a jednotne zobraziť vizuálne záhlavie prakticky ľubovoľného gridu. Ponúka užívateľovi napríklad možnosť vybrať si štýl zobrazenia gridu; ďalej možnosti triedenia a filtrovania dát; a zobrazuje linky na stránkovanie výstupu.

O tom, čo GridHeader užívateľovi poskytne rozhoduje volajúca trieda. Za to, ako sa tieto informácie zobrazia zodpovedá samotný GridHeader.

FilterForm

Podobne ako GridHeader, FilterForm je komponenta, ktorá ponúka užívateľovi zadať informácie, ktoré sa premietnu v zobrazovanom gride. Na rozdiel od triedy GridHeader, FilterForm je len abstrakcia filtrovacieho formuláru, poskytujúca rutiny na generovanie vizuálnych formulárových tabuliek. Až potomkovia triedy FilterForm definujú sféru atribútov, podľa ktorých sa dá aktuálne filtrovať.

Ostatné

Medzi menej zaujímavé komponenty patria jednoduché triedy ako napríklad Tabber (záložkovač) a ButtonBar (lišta tlačítok). Volajúca trieda v týchto komponentách nastaví požadovaný obsah (názvy záložiek alebo tlačítka) a príslušná komponenta tento obsah zobrazí.