Thursday, June 9, 2011

Csinibaba Szeress Belém avagy Sminkelés/Themeing a Yii rendszerrel

Alapozás

A "Theming vagy Sminkelés" nem más, mint egy (webes) alkalmazás kimenetét a felhasználó elé táró kinézet-lapok rendszere. Egy új Sminket használva az egész program általános kinézete azonnal megváltoztatható.

Yii-ben minden Sminket egy mappa képvisel, ami különböző Nézet és Layout (pl: header vagy footer stb...) fájlokat tartalmaz(hat), ugyancsak itt találhatók meg a Sminkhez tartozó képek, CSS- és JS file-ok is. A Smink neve minden esetben megegyezik a mappa nevével (fontos!). Az összes Smink a WebRoot/themes mappa alatt található, és egyszerre csak egy Smink lehet aktív.


Smink felkenése:

Egy Sminket úgy aktiválhatunk, hogy beállítjuk a Web programunk 'theme' paraméterét. Ezt vagy magában a fő konfigurációs file-ben tehetjuk meg (protected/config/main.php), vagy futás közben a Kontrollerben. (persze futás közben sminket feltenni veszélyes is lehet - minden körülmények között!)

Megjegyzés: maga a Smink neve kis- és nagybetű érzékeny. Ha egy olyan Smink-et probálunk aktiválni, ami nem létezik a 'Yii::app()->theme' null-t fog vissza adni.

Paletta készítése:

A Smink-nek mindenképpen követnie kell a Yii által használt és szorgalmazott könyvtárfelépítést. Például minden Nézet file-nak a '/views' mappában kell elhelyezkednie, a layout file-oknak pedig a '/views/layouts'- és a rendszer nézet file-oknak pedig a '/views/system' alatt. Tehát ha pl. le szeretnénk cserélni a 'PostController' kontroller 'create' nézet file-ját a 'classic' smink-ben, csak mentsük el az új nézet file-unkat valahogy így 'Webroot/themes/classic/views/post/create.php'.

Azokat a Nézet file-okat, amelyek olyan Kontrollerekhez tartoznak amik egy meghatározott Modul részei, ugyanúgy a 'views' mappa alá kell elhelyezni. Például, ha az előbb említett PostController egy 'forum' nevű modul alatt található, akkor az új "sminkelt" nézet file-t a WebRoot/themes/classic/views/forum/post/create.php-ként mentjük el. Ha pedig maga a forum modul egy másik modul, pl: 'support' része (mert iiyet lehet a Yii-vel ;) ) akkor egyszerűen ide mentjük: WebRoot/themes/classic/views/support/forum/post/create.php.

Megjegyzés: Mivel a 'views' mappa tartalmazhat kényes file-okat, érdemes úgy konfigurálni, hogy halandó internetfelhasználó ne férhessen hozzá.

Amikor a render()-t vagy renderPartial()-t meghívjuk, hogy  a Nézet-ünket megjelenítse, Yii először megpróbálja megtalálni magát a nézet file-t és a hozzá tartózó layout file-t az aktív smink könyvtár alatt. Ha sikerül, ezek a file-ok kerülnek megjelenítésre. Ha nem, akkor pedig az alap nézet és layout file-ok, amiket a viewPath/layoutPath-ek állítanak be.


Tipp: Gyakran előfordul olyan, hogy a nézet file-unkból szeretnénk elérni egyéb, csak az aktív sminkre jellemző, file-okat. Ilyenek lehetnek például a képek a smink 'images' mappában. A baseUrl változó segítségével ezt könnyedén megtehetjük, valahogy így: Yii::app()->theme->baseUrl.'/images/FileName.gif'.
Alább látható egy Yii alkalmazás teljes mappa rendszere, két sminkkel basic és fancy néven.

WebRoot/
  assets
  protected/
    .htaccess
    components/
    controllers/
    models/
    views/
      layouts/
        main.php
      site/
       index.php
themes/
  basic/
    views/
      .htaccess
      layouts/
        main.php
      site/
        index.php
  fancy/
    views/
      .htaccess
      layouts/
        main.php
      site/
        index.php
És ha az alkalmazásunk konfigurációs file-jába ezt beállítjuk (/protected/config/main.php):

return array(
  ...
  'theme'=>'basic',
  ...
);
akkor a basic smink lesz aktív, ami azt jelenti, hogy a themes/basic/views alatti /layouts/main.php és a site/index.php kerül megjelenítésre. Ha pedig ezek nem lennének meg, akkor Yii automatikusan a "gyári" /protected/views-t fogja használni.

then the basic theme will be in effect, which means the application's layout will use the one under the directory themes/basic/views/layouts, and the site's index view will use the one under themes/basic/views/site. In case a view file is not found in the theme, it will fall back to the one under the protected/views directory.

Hát ennyi :)

A Yii Themes oldalon lehet ingyé előre elkészített Sminkeket letölteni a Yii-hez.

Eredeti cikk (még több infóval): http://www.yiiframework.com/doc/guide/1.1/en/topics.theming