Ako prekladať statický obsah v CakePHP sme si ukázali v článku Viacjazyčný web v CakePHP. I keď je už článok pomerne starý a mnohé veci sa zjednodušili, podstata stále ostáva rovnaká a určite vám odporúčam pred ďalším čítaním najprv prečítať tento článok.

Trieda TranslateBehavior

Mozgom celej viacjazyčnej podpory v CakePHP je trieda TranslateBehavior, ktorá sa stará u ukladanie, aktualizáciu a získavanie viacjazyčného obsahu z databázy. Poďme si v krátkosti predstaviť celý mechanizmus práce s viacjazyčným obsahom. Skutočná sila tohto riešenie spočíva v tom, že trieda TranslateBehaviour funguje ako behavior, čiže magicky pridáva funkcionalitu do vašich existujúcich modelov. To okrem iného znamená, že vôbec nemusíte meniť vaše už existujúce databázové tabuľky.

Princíp fungovania je nasledovný. Predstavme si, že chceme prekladať články v našom systéme. Pridáme teda k nášmu modelu Article behavior TranslateBehavior a určíme ktoré atribúty z tabuľky článkov sa majú prekladať. TranslateBehaviour nám bude pri každom uložení článku do databázy ukladať jazykové mutácie atribútov, ktoré sme určili na preklad, do špeciálnej tabuľky. Čiže od tohto momentu budeme mať k našemu článku dostupné aj preložené jednotlivé časti.

Dosť bolo teórie, poďme sa pozrieť na implementáciu celého riešenia pomocou TranslateBehavior.

Implementácia

Predstavme si situáciu, že máme fungujúci systém článkov a chceme do tohto systému pridať podporu pre viacjazyčné články. Články máme uložené v tabuľke articles a o dáta z tejto tabuľky sa stará model Articles.

1. krok – vytvorenie tabuľky i18n

Ako sme si už spomenuli vyššie, TranslateBehavior funguje ako nadstavba k už fungujúcim modelom a preto prvým a nevyhnutným krokom je vytvorenie tabuľky i18n v našej databáze, do ktorej sa bude ukladať viacjazyčný obsah. Učiniť tak môžeme spustením skriptu v našej databáze, ktorý nájdeme v adresári app/config/sql/i18n.sql. Po spustení tohto skriptu sa v databáze vytvorí tabuľka, ktorá má nasledovnú štruktúru

id int(10) NOT NULL auto_increment,
locale varchar(6) NOT NULL,
model varchar(255) NOT NULL,
foreign_key int(10) NOT NULL,
field varchar(255) NOT NULL,
content mediumtext

Akú úlohu plnia jednotlivé atribúty v tejto tabuľke si vysvetlíme neskôr na konkrétnom príklade.

2. krok – pridanie TranslateBehavior k modelu

<?php
class Article extends AppModel {
	public $actsAs = array(
		'Translate'
	);
}
?>

TranslateBehaviour sa pridáva k modelu ako každá iná behavior funkcionalita a to direktívou $actAs. Po týchto dvoch krokoch máme TranslateBehavior nainštalovaný.

3. krok – prekladáme dynamický obsah

Zatiaľ sme síce určili, že by sme chceli prekladať naše články, ale nikde sme neurčili, ktoré časti nášho článku chceme prekladať. V našom prípade tak urobíme pre časti title a text a to následovne

<?php
class Article extends AppModel {
	public $actsAs = array(
		'Translate' => array(
			'title' => 'title', 'text' => 'text'
		)
	);
}
?>

Nastavenie modelu máme týmto hotové a môžeme sa pustiť do implementácie view časti. Naše súbory pre vkladanie článkov by vyzerali pred použitím TranslateBehavior následovne

<? echo $form->input('Article.title'); ?>
<? echo $form->input('Article.text',array('cols' =>'10','rows'=>'10','type'=>'textarea')); ?>

Vyššie uvedený kód je štandardný pre vytvorenie input prvkov a preto ho nie je treba bližšie špecifikovať. Poďme sa pozrieť, ako bude vypadať rovnaký kód, ktorý nám umožní vkladať niekoľko jazykových verzií pre input title ako i pre input text

<? echo $form->input('Article.title.slo'); ?>
<? echo $form->input('Article.title.eng'); ?>

<? echo $form->input('Article.text.slo',array('cols' => '10','rows'=>'10','type'=>'textarea')); ?>
<? echo $form->input('Article.text.eng', array('cols' => '10','rows'=>'10','type'=>'textarea')); ?>

Po napísaní článku a jeho viacjazyčných mutácií môžeme článok uložiť obvyklým spôsobom volaním metódy $this->Article->sanve() z controlleru ArticlesController. To znamená, že v prípade controlleru nie je potrebné pri ukladaní článku vykonávať žiadne zmeny.

Poďme sa pozrieť, ako bude vypadať naša databáza po uložení takéhoto článku a čo sa v nej zmenilo. Predstavme si, že sme odoslali formulár s hodnotami titulok sk, text sk pre slovenskú mutáciu a title en a text en pre anglickú mutáciu. Naše tabuľku budú vypadať následovne

tabuľka articles

+----+-------------+--------------------+--------+---------------------+
| id | title       | text               | user   | created             |
+----+-------------+--------------------+--------+---------------------+
|  1 | titulok sk  | text sk            | Linus  | 2010-02-06          |
+----+-------------+--------------------+--------+---------------------+

tabuľka i18n

+----+--------+-------+---------+-------------+------------+
| id | locale | field | model   | foreign_key | content    |
+----+--------+-------+---------+-------------+------------+
|  1 | slo    | title | Article |           1 | titulok sk |
|  2 | eng    | title | Article |           1 | title en   |
|  3 | slo    | text  | Article |           1 | text sk    |
|  4 | eng    | text  | Article |           1 | text en    |
+----+--------+-------+---------+-------------+------------+

Ako môžeme vidieť TranslateBehavior funguje podľa očakávania a ako bolo povedané, k nášmu článku udržuje v špeciálnej tabuľke i18n jazykové mutácie. Čo znamenajú jednotlivé stĺpce tabuľky? Stĺpec locale ukladá označenie jazykovej mutácie daného riadku, hodnoty pochádzajú z triedy l10n z premennej $__l10nMap a rovnako sa používajú aj vo view pre jednotlivé input prvky. Stĺpec field označuje názov  atribútu z pôvodnej tabuľky články. Čiže v našom prípade sa jedná o title a text, ktoré pôvodne nájdeme v tabuľke articles. Stĺpec foreign_key predstavuje cudzí kľúč z tabuľky articles::id. Stĺpec content obsahuje samotnú jazykovú mutáciu. Myslím si, že viac nie je potrebné vysvetľovať celý mechanizmus a môžeme rovno prejsť na zobrazovanie jednotlivých jazykových mutácií.

4. krok – zobrazujeme viacjazyčný obsah

Prvým krokom pre zobrazenie viacjazyčného obsahu je nastavenie routovacích pravidiel tak, aby sme mohli v našej aplikácii prepínať medzi jednotlivými jazykovými verziami. Pri tomto sa budeme riadiť pravidlom, že zobrazenie jazykovej mutácie obsahu je úplne nezávislé na užívateľových nastaveniach – čiže aktuálny jazyk aplikácie budeme určovať podľa URL a nie podľa hodnôt uložených buď v cookies alebo v sessions.

Routovanie

Rozhodli sme, že jazyk aplikácie bude určovať URL. Formát URL bude nasledovný http://www.tvoja-adresa.sk/jazyk/clanok/id

Routavacie pravidlo bude vyzerať následovne

Router::connect('/:lang',array('controller'=>'pages','action'=>'display','home'),array('lang' => 'sk|en'));
Router::connect('/:lang/clanok/:id',array('controller'=>'articles','action'=>'view'),array('pass'=>array('id'),'lang' => 'sk|en'));

Link helper

Po nastavení routovacieho pravidla budeme potrebovať link helper, ktorý nám ku každému odkazu pridá aktuálny jazyk. Možno sa pýtate, prečo potrebujeme helper a nebude priamo používať metódu $html->link() následovne

<? $html->link(__('o nás',true),array('controller'=>'articles','action'=>'view','id'=>'o-nas','lang'=>$language)); ?>

Je to z dôvodu, aby sme nemuseli zakaždým posielať tejto metóde hodnotu aktuálneho jazyka a navyše sa v budúcnosti môže náš kód zmeniť a tým by sme museli ručne upravovať všetky odkazy. Náš helper si teda nazveme LangHelper a uložíme ho do súboru app/view/helpers/lang_helper.php

<?
class LangHelper extends AppHelper {
    public $helpers = array('Html');

    public function link( $title, $url = NULL, $htmlAttributes = array ( ), $confirmMessage = false, $escapeTitle = true ) {
        if(@$this->params['lang']) {
            $url['lang'] = $this->params['lang'];
        } else {
            $url['lang'] = 'sk';
        }

        return $this->Html->link($title,$url,$htmlAttributes,$confirmMessage,$escapeTitle);
    }
}
?>

Následne môžeme vytovoriť odkaz na náš článok

<? echo $lang->link(__('o nás',true),array('controller'=>'articles','action'=>'view','id'=>'1')); ?>

Vyššie uvedený odkaz nám vygeneruje URL v tvare http://www.tvoja-adresa.sk/sk/clanok/1 za predpokladu, že aktuálny jazyk aplikácie je sk. Ako je možné, že sa vygenerovala adresa práve v tomto tvare? Je to z dôvodu, že CakePHP automaticky pozná podľa nastavených routovacích pravidiel, aký odkaz na akú URL chceme vytvoriť.

Controller a prepínanie jazyka

Po nastavení routovacích pravidiel sa môžeme pustiť do samotného nastavenia jazyka v našej aplikácii. Jazyk sa nastavuje direktívou Configure::write(‘Config.language’,$locale) kde premenná $locale predstavuje hodnotu z triedy l10n a jej premennej $__l10nCatalog. Nastavenie budeme vykonávať v AppController v metóde beforeFilter()

<?
class AppController extends Controller {
    public function beforeFilter() {
        $this->set_language();
    }

    private function set_language() {
        $code = @$this->params['lang'];
        if(@$code) {
            App::import('l10n');
            $l10n = new L10n();
            $language = $l10n->catalog($code);
            $locale = $language['locale'];
        } else {
            $locale = 'slo';
        }
        Configure::write('Config.language',$locale);
    }
}
?>

Následne môžeme v našej aplikácii prepínať jazyk pomocou URL http://www.vasa-adresa.sk/sk pre slovenský jazyk alebo http://www.vasa-adresa.sk/en pre anglický jazyk

Zobrazujeme článok

Článok môžeme načítať a následne zobraziť štandardným spôsobom, ako ho poznáme z bežného používania. V ArticlesController si načítame článok

public function view($seo_link = null) {
     $article = $this->Article->findBySeo_link($seo_link);
     $this->set(compact("article"));
}

A následne ho môžeme zobraziť vo view

<article class="article">
    <h1><? echo $article['Article']['title']; ?></h1>
    <div><? echo $article['Article']['text']; ?></div>
</article>

Ako ste si určite všimli, nikde sme pri zobrazení neurčovali aká jazyková mutácia sa má zobrazovať. CakePHP to robí v tomto prípade automaticky a z databázy vyťahuje jazykovú mutáciu podľa direktívy Configure::write(‘Config.language’,$locale) a premenná $article má tvar ako v prípade, keď sme TranslateBehavior nepoužívali, avšak s tým rozdielom, že vždy obsahuje jazykovú mutáciu podľa aktuálne nastaveného jazyka.

Načo si dať pozor

Narazil som na menšiu komplikáciu pri editácii článku. Keď sa pokúšate vybrať všetky jazykové mutácie prostredníctvom jedného SQL dotazu, CakePHP nám vráti dáta v nasledovnom formáte

Array
(
    [Article] => Array
        (
            [id] => 1
            [title] => titulok sk
            [text] => text sk
            [locale] => slo
        )

    [title] => Array
        (
            [0] => Array
                (
                    [id] => 44
                    [locale] => eng
                    [model] => Article
                    [foreign_key] => 12
                    [field] => title
                    [content] => title en
                )
            [1] => Array
                (
                    [id] => 43
                    [locale] => slo
                    [model] => Article
                    [foreign_key] => 12
                    [field] => title
                    [content] => titulok sk
                )
        )
    [text] => Array
        (
            [0] => Array
                (
                    [id] => 47
                    [locale] => eng
                    [model] => Article
                    [foreign_key] => 12
                    [field] => text
                    [content] => text en
                )
            [1] => Array
                (
                    [id] => 48
                    [locale] => slo
                    [model] => Article
                    [foreign_key] => 12
                    [field] => text
                    [content] => text sk
                )

        )
)

To znamená, že jazykové mutácie sa nachádzajú v premenných $article['title'] a $article['text'], preto ich treba ešte preformátovať do formátu $article['Article']['title']['jazyk']. Môžeme to urobiť následovne

$this->data = $this->Article->findById($id);
$title = array();
$text = array();

foreach ($this->data['title'] as $item) {
     $title[$item['locale']] = $item['content'];
}
foreach ($this->data['text'] as $item) {
     $text[$item['locale']] = $item['content'];
}
$this->data['Article']['title'] = $title;
$this->data['Article']['text'] = $text;

Našiel som nejaké návody, žeby sa pri editácii mala nastaviť premenná locale ako pole,  ktoré bude obsahovať zoznam všetkých jazykov a to následovne Configure::write(‘Config.language’,array(’slo’,'eng’)) avšak mne tento spôsob nefungoval. Neviem, možno je to len moja neznalosť, možno bol problém niekde inde.

Týmto je náš článok u konca. Myslím si, že CakePHP ponúka elegantný spôsob ako sa vyrovnať s viacjazyčným obsahom a ako v mnohých prípadoch, nám dokáže ušetriť množstvo času a práce. Rád uvítam vaše nápady a pripomienky v diskusii k článku.

Podrobné zhrnutie nových vlastností nájdete na adrese http://cakephp.lighthouseapp.com/projects/42648/13-new-features

Migračnú príručku nájdete na adrese http://cakephp.lighthouseapp.com/projects/42648/13-migration-guide

Poďme si najprv priblížiť jednotlivé vlastnosti Debug Kit a následne sa pozrieme na jeho inštaláciu a integráciu s CakePHP aplikáciou.

Debug Kit

Debug Kit predstavuje pokročilý debugovací nástroj, ktorý ponúka množstvo informácií o našej aplikácii a jej stave. Debug Kit dokáže zobraziť podrobné informácie o session, sql, request, timer, premenných atď. Poďme sa teda bližšie pozrieť na jednotlivé vlastnosti tohto nástroja.

Panely

Debug Kit zobrazuje vyššie spomínané debug informácie v paneloch. Na nasledujúcom obrázku môžeme vidieť integráciu Debug Kit do stránky a taktiež základné panely, ktoré ponúka Debug Kit v základnej inštalácii.

Medzi základné panely patria: History, Session, Request, Sql Log, Timer, Log, Variables. Poďme si teda bližšie priblížiť jednotlivé možnosti panelov.

Panel History

Panel History zobrazuje informácie o posledných requestoch zobrazením url danej stránky.

Panel Session

Panel Session zobrazuje podrobné informácie o uložených Session našou aplikáciou.

Panel Request

Panel Request zobrazuje informácie o aktuálnom requeste. Medzi informácie patria GET, POST požiadavky, Cake url parametre (v aplikácii dostupné v poli $this->params), Cookie informácie a podrobné informácie o použitých routovacích pravidlách.

Panel SQL Log

Panel SQL Log zobrazuje informácie o spustených sql dotazoch v našej databáze. V podstate sa ničím nelíši od bežného sql výpisu z CakePHP.

Panel Timer

Panel Timer zobrazuje podrobné informácie o čase načítavania jednotlivých častí našej aplikácie pre daný request a taktiež množstvo využitej pamäte. Časové informácie sa zobrazujú pre stránku ako celok, ale rovnako aj pre jednotlivé súčasti, ktoré boli generované v danom requeste.

Debug Kit nám poskytuje možnosť merať čas pre ľubovoľnú časť kódu. Ako môžeme vidieť na obrázku vyššie, vo výpise sa nachádza položka s názvom Listing of articles. Táto položka meria čas spracovania výpisu článkov v metóde index v controlleri ArticlesController. Kód pre danú položku vyzerá následovne

function index() {
     DebugKitDebugger::startTimer($name = 'articles', $message = 'Listing of articles');
     $this->Article->recursive = 1;
     $this->paginate = array('limit'=>Configure::read('Homepage.articles'),'order' => 'Article.created desc','conditions'=>array('show_on_index'=>1,'visible'=>1,'publish_up<=now()'));         $this->set('articles', $this->paginate());
     DebugKitDebugger::stopTimer($name = 'articles');
}

Panel Log

Panel Log nám zobrazuje informácie zo základných debugovacích nástrojov priamo z CakePHP. Jedná sa o výpisy z logovacích súborov.

Panel Variables

Panel Variables zobrazuje podrobné informácie o premenných a ich hodnotách v našej aplikácii, ktoré boli inicializované v controlleri.

Vlastné panely

Debug Kit taktiež ponúka možnosť vytvoriť si vlastné panely alebo zobraziť len určité panely z tých, ktoré sú prednastavené. Táto časť je veľmi jednoduchá a jej štúdium prenechám čitateľom. Bližšie informácie môžete násjť na stránkach Debug Kit – Toolbar Panels

Inštalácia

Inštalácie Debug Kit je veľmi jednoduchá. Stačí si stiahnuť zdrojové kódy priamo z download stránok projektu. Aktuálna verzia v dobe písania článku je Debug Kit 1.1. Po stiahnutí Debug Kit stačí obsah balíčku nakopírovať do adresára app/plugins/debug_kit a vložiť nasledovný kód do požadovaného controllera, v našom prípade sa jedná o ArticlesController v súbore app/controllers/articles_controller.php

class ArticlesController extends AppController {
     var $components = array('DebugKit.Toolbar');
}

Integrácia s FirePHP

Veľmi zaujímavou vlastnosťou Debug Kit je možnosť integrácie tohto nástroja s debugovacím nástrojom FirePHP. FirePHP umožňuje debugovať PHP aplikáciu pomocou známeho nástroja FireBug.

Týmto je náš článok u konca. Myslím si, že Debug Kit je jedným s najlepších debugovacích nástrojov pre CakePHP a určite stojí za vyskúšanie. Rád uvítam vaše nápady a pripomienky k debugovaniu v CakePHP.

Web Developer

Patrí k jedným z najznámejších vývojárskych rozšírení pre Firefox. Do Firefoxu sa integruje ako položka v menu alebo toolbar. Hlavným zámerom tohto rozšírenia je poskytnúť vývojárovi kompletné informácie o všetkých elementoch a možnosť manipulácie so stránkou. Medzi základné funkcie patrí zobrazenie podrobných informácie o html elementoch kliknutím na element (informácie ako šírka, výška, id alebo class, veľkosť písma, jeho predchodcovia atď.), práca s grafikou stránky (css, zobrazenie css podľa výstupného média, obrázky atď.), práca s formulármi, s cookies, automatická validácia stránky, zmena rozlíšenia Firefoxu a množstvo ďalších.

pridaj do Firefoxu
stránka rozšírenia

Firebug

Hlavnými cieľom Firebug je debugovanie, editovanie a monitorovanie CSS, HTML a JavaScriptu priamo na vašich stránkach bez nutnosti úpravy zdrojového kódu. Do Firefoxu sa integruje ako samostatný panel. Medzi pokročilé vlastnosti patrí sledovanie komunikácie stránky so serverom alebo čas načítavanie jednotlivých elementov stránky.

pridaj do Firefox stránka rozšírenia

User Agent Switcher

Ako už z názvu vyplýva, jedná sa o jednoduchého prepínača User Agent, čiže umožňuje Firefoxu, aby sa pre webové stránky identifikoval ako iný prehliadač. Jednoducho tak môžeme otestovať špecifické správanie web stránky pre jednotlivé druhy prehliadačov. Do Firefoxu sa integruje ako položka v menu alebo toolbar. Medzi prednastavené prehliadače patria Internet Explorer 6, 7, 8, Safari iPhone 3.0, avšak môžete si doplniť ľubovoľný druh, ktorý potrebujete.

pridaj do Firefoxu
stránka rozšírenia

YSlow

Hlavným cieľom YSlow je analyzovať web stránky a navrhnúť spôsob, ako zrýchliť web stránku na základe Yahoo pravidiel pre výkonné web stránky. YSlow sa integruje ako rozšírenie Firebug, takže k svojej činnosti potrebuje nainštalované rozšírenie Firebug.

pridaj do Firefoxu
stránka rozšírenia

ColorZilla

Hlavným cieľom ColorZilla je získať hodnotu farby z ktoréhokoľvek bodu na webovej stránke. Jednoducho môžete teda získať RGB hodnotu alebo hodnotu pre CSS z jednotlivých farieb na stránke. ColorZilla sa integruje do Firefoxu ako toolbar.

pridaj do Firefoxu
stránka rozšírenia

IE NetRenderer

Hlavným cieľom je vyrenderovať stránku a vytvoriť z nej screenshot podľa toho, ako by vypadala v prehliadači Internet Explorer. Podporované sú takmer všetky verzie Internet Explorer od verzia 5.5 až po verziu 8. Do Firefoxu sa integruje ako tlačítko alebo položka v menu. K vytvárania screenshotov využíva známu službu IE NetRenderer

pridaj do Firefoxu
stránka rozšírenia

Ak aj vy používate nejaké zaujímavé rozšírenia, podeľte sa s nimi v diskusii k článku.

Ako som už spomínal, defaultne CakePHP na webhosting Websupport nefunguje správne a hlási nasledovnú chybu

The action webroot is not defined in controller AppController

Hneď môžeme vidieť, že niečo nie je v poriadku a pri správnom fungovaní nemusí AppController obsahovať žiadnu metódu webroot. Túto chybu odstránime jednoduchým spôsobom a to nastavením správnej Routes direktívy. Do súboru app/config/rou­tes.php pridáme nasledovný riadok

Router::connec­t(‚/app/webro­ot‘, array(‚controller‘  ⇒ ‚pages‘, ‚action‘  ⇒ ‚display‘,‚ho­me‘));

Samozrejme si môžete zvoliť vlastné hodnoty pre controller a action.

Ak ste sa stretli s podobným problémom a vyriešili ho iným spôsobom, rád uvítam, ak sa s nimi podelíte v diskusii k článku.

CakePHP defaultne nezobrazuje validačné správy pri inpute typu textarea. Pozrime sa na nasledovný príklad

echo $form->textarea(‚text‘);

Tento kód nám správne vygeneruje input textarea, avšak problém nastáva vo chvíli, kedy textarea neprejde validáciou a spolu s textareou by sa mala zobraziť aj validačná správa, ktorá nás bude informovať o tom, čo nie je v poriadku. Takto by vypadal HTML kód pre textarea v prípade validačnej chyby, ak by sme textareu vykresľovali metódou $form->textarea(‚text‘);

<textarea name=„data[Ar­ticle][text]“ cols=„10“ rows=„10“ id=„ArticleIn­troText“ class=„form-error“ ></textarea>

Ako môžeme vidieť, CakePHP nám v tomto prípade žiadnu error správu nevygeneroval, avšak aspoň pridal atribút class=„form-error“. Toto správanie je nežiadúce a my samozrejme budeme chcieť error správu zobraziť. Trik spočíva v tom, že musíme zavolať metódu input() a parametrom určiť, aby vygenerovala input textarea

echo $form->input(‚text‘,a­rray(‚type‘=>‚tex­tarea‘));

V tomto prípade všetko funguje správne a v prípade, že textarea neprejde validáciou, CakePHP správne vygeneruje HTML kód aj s error správou

<textarea name=„data[Ar­ticle][text]“ cols=„10“ rows=„10“ id=„ArticleIn­troText“ class=„form-error“ ></textarea><div class=„error-message“>This field cannot be left blank</div>

Ako ste sa mohli dočítať v spomínanom článku od Chris Coyier – 404 Best Practices, 404 error stránka by mala byť veľmi dôležitou súčasťou každej profesionálnej aplikácie. Návštevníkom sa môže táto error stránka zobraziť veľmi jednoducho, a vôbec to nemusí byť jeho zásluhou (napr. chybný odkaz smerujúci na našu stránku alebo sme mohli presunúť stránku, ktorú sa pokúša návštevník zobraziť, na inú URL atď.) a preto by nám malo záležať na tom, aby sme návštevníka nestratili a poskytli mu určité informácie tak, aby našiel čo hľadá. Tu prichádza na rad prispôsobenie takejto stránky.

Layout pre 404 error stránku

Ako sme si už v CakePHP zvykli, štandardným chovaním pre zobrazenie akejkoľvek informácie je najprv vytvoriť layout a potom samotný obsah layoutu. Inak tomu nie je ani pri 404 error stránke. Layout umiestníme do súboru app/views/lay­outs/error404­.ctp a jeho obsah by mohol vypadať následovne

<? echo $html->docType('xhtml-trans'); ?>

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <? echo $html->charset("utf-8"); ?>
        <title>Tibor Pino - 404 not found</title>
        <meta name="author" content="Tibor Piňo" />

        <style type="text/css">
            body { text-align: center; font-size: 1.3em;}
        </style>
    </head>
    <body>
        <? echo $content_for_layout; ?>

    </body>
</html>

Po vytvorení layoutu je ďalším krokom vytvorenie obsahu stránky.

404 error stránka

V našom prípade budeme chcieť návštevníkovi oznámiť, že stránka, ktorú sa pokúša zobraziť neexistuje, ale zároveň mu poskytneme odkaz na úvodnú stránku, kde by mohol potrebné informácie nájsť. Súbor so stránkou umiestníme do súboru app/views/error­s/404error.ctp a jeho obsah bude vypadať následovne

<?php $this->layout = 'error404'; ?>
<? echo $html->image('404-error-page.jpg',array('alt'=>'Page not found')); ?>
<h1>Stránka nenájdená!</h1>
<p>Stránka, ktorú sa pokúšate zobraziť neexistuje,
<br/>ale <? echo $html->link('úvodná stránka Tibor Piňo',array('controller'=>'pages','action'=>'display')); ?>

<br/>by vám mohla pomôcť.</p>

Tu si musíme trochu vysvetliť, ako CakePHP pracuje s chybovými odpoveďami zo servera. CakePHP automaticky spracováva chybové odpovede, ktoré prijíme od servera. Pri detekovaní chybovej odpovede 404 CakePHP automaticky zobrazí súbor app/views/error­s/404error.ctp, ak takýto súbor existuje. V našom prípade tento súbor existuje a CakePHP ho správne zobrazí, takže nemusíme nič explicitne nastavovať. V tomto súbore je ešte jedna zvláštnosť a to to je určenie samotného layoutu $this->layout = ‚error404‘;. Toto určenie layoutu je nevyhnutné, pretože v opačnom prípade by CakePHP zobrazoval vlastný preddefinovaný layout, čo je v našom prípade nežiadúce.

Týmto máme všetko hotové a našu prispôsobenú 404 error stránku môžete vidieť priamo v praxi na stránke môjho portfólia blueweb.rockre­tail.com

Podobný postup môžete využiť aj pri ďalších chybových odpovediach zo strany servera napr. pre odpoveď 500 Internal Server Error by sme náš kód umiestnili do súborov app/views/error­s/500error.ctp a app/views/lay­outs/500error­.ctp

Na záver ešte doplním, že sa mi nepodarilo zaistiť podporu tém pri týchto chybový stránkach. Vo svojich projektoch často využívam témy, ktoré sú napríklad umiestnené v app/views/the­mes/default a i napriek správnemu fungovaniu tém v mojich projektoch, som musel umiestniť súbory s chybovými hláškami priamo do adresárov umiestnených v app/views namiesto očakávaných v app/views/the­mes/default

Rád uvítam vaše nápady a pripomienky v diskusii k článku.

Prehliadanie internetu prostredníctvom mobilu je čoraz populárnejšie a s príchodom stále rýchlejšieho mobilného pripojenia a zariadení sa bude určite jeho popularita zväčšovať. Z tohto dôvodu prichádzajú na radu mobilné verzie webových stránok. Mobilná verzia je veľmi špecifická, pretože sa musí väčšinou vysporiadať s mobilnými prehliadačmi (vo väčšine prípadov značne obmedzená funkcionalita oproti desktopovým prehliadačom) a taktiež značne s rozdielnymi veľkosťami displejov. Tento článok však nemá za cieľ pokryť problematiku mobilného webu, ale bude zameraný na jeho samotnú tvorbu.

Mobify.me

Služba Mobify.me predstavuje unikátnu službu, pomocou ktorej môžete veľmi rýchlo a jednoducho vytvoriť mobilnú verziu webovej stránky. K tomuto účelu poskytuje jednoduché webové rozhranie s množstvom užitočných funkcií, niektoré z nich si bližšie predstavíme. Celý postup, ako Mobify.me pracuje, môžeme zhrnúť do troch jednoduchých krokov

• Vyberieme najdôležitejšie elementy stránky, ktoré budú súčasťou mobilnej verzie
• Upravíme si požadované elementy s použitím css alebo pridáme nové podľa vlastnej potreby
• Spustíme webovú stránku na adrese m.yourwebsite.com a celý proces dokončíme presmerovaním na mobify.me, kde sa naša mobilná verzia nachádza

Osobne som vždy chcel vytvoriť mobilnú verziu svojho blogu, avšak nikdy som si nebol istý, či ju vytvoriť len pomocou css, alebo pre mobilnú verziu použiť inú tému, resp. iný layout. Na tom už momentálne nezáleží, pretože Mobify.me robí všetku prácu za mňa http://m.ims.rockretail.com.

Máte kontrolu nad obsahom mobilnej verzie

Mobify.me vám umožňuje vybrať jednotlivé elementy stránky a je len na vás, ktorá časť vašej webovej stránky bude súčasťou mobilnej verzie

Vlastný štýl pomocou CSS

Grafiku stránky stále ovládate pomocou CSS. Mobify.me poskytuje plnohodnotný CSS editor, kde zmeny vidíte v reálnom čase. Môžete si samostatne upravovať elementy ako sú header a footer, resp. pridávať elementy, ktoré sa na pôvodnej stránke nevyskytujú. K dispozícii sú taktiež reálne náhľady na niekoľkých mobilných zariadeniach, v tomto prípade sa jedná o Iphone, Nokia, Razr a BlackBerry. Nemusíte sa však obávať, že mobilná verzia vašej stránky je určená len pre tieto značky mobilov, ako Mobify.me uvádza, stránky by mali fungovať na väčšine dostupných mobilných zariadení.

Podpora šablón

Vo vašej stránke môžete rozlíšiť rôzne druhy šablón. Mobify.me rozlišuje šablóny na základe URL. Napríklad ako môžeme vidieť na tomto blogu, všetky články začínajú s URL articles, čo teda predstavuje samostatnú šablónu v ktorej som si mohol určiť, že sa napríklad nemajú zobrazovať komentáre alebo hodnotenie článkov. Ďalšiu šablónu predstavuje index stránka s URL /, kde som naopak určil zobrazenie zoznamu článkov a stránkovanie.

Nestrácate kontakt s plnou verziou stránky

Pri mobilných verziách stránok sa môžete mnohokrát stretnúť so situáciou, kde vás stránka automaticky presmeruje na mobilnú verziu (v prípade identifikovania, že používate mobilný prehliadač) a vy nemáte žiadnu možnosť navštíviť plnohodnotnú verziu. S Mobify.me o túto možnosť neprichádzate, pretože sa na každej vašej mobilnej stránke nachádza priamy odkaz na jej plnohodnotnú verziu.

Nasadenie

K dispozícii je niekoľko možností, ako spustiť mobilnú verziu. Podporované je automatické presmerovanie na mobilnú verziu v prípade detekcie mobilného prehliadača, k dispozícii máte subdoménu na adrese http://yourwebsite.mobify.me (pričom časť url yourwebsite si môžete zvoliť sami bez ohľadu na vašu skutočnú adresu) alebo môžete zvoliť vlastnú subdoménu, ktorú pomocou DNS CNAME záznamu presmerujete na mobify.me.

Rozšírené nastavenia

Okrem vyššie spomínaných vlastností, k dispozícii máte taktiež možnosť určiť vlastnú ikonu mobilnej verzie, Google Analytycs ID, AdMob Analytics ID, Google Maps Key alebo možnosť nastaviť stav vašej mobilnej verzie pomocou statusov.

Je to všetko zdarma?

Mobify.me je k dispozícii v troch verziách. Pričom prvá z nich je úplne zdarma a poskytuje všetky spomínané vlastnosti. Jediným obmedzením tejto verzie je, že na každej vašej stránke sa nachádza priamy odkaz na Mobify.me. Ďalšie dve verzie Plus a Pro sú platené a poskytujú nástroje pre SEO, bezpečnosť, monitorovanie a podporu.

Myslím si, že Mobify.me poskytuje výborný nástroj, ktorý uľahčuje tvorbu mobilného webu a vzhľadom na čoraz viac vzrastajúcu popularitu mobilného internetu sa rozhodne oplatí investovať svoj čas do tvorby takejto verzie.

Mobilná verzia by mala fungovať na väčšine mobilných zariadení, nie len telefónoch typu pda alebo smartphone. V mobilnej verzii môžete nájsť kompletný obsah článkov vrátane kategórií, komentáre by mali byť dostupné v blízkej budúcnosti. K vytvoreniu mobilnej verzie som využil službu Mobife.me, ktorá umožňuje vytvoriť mobilnú verziu v priebehu pár minút. Túto službu plánujem predstaviť prostredníctvom článku v najbližších dňoch (doplnené: Mobify.me – mobilná verzia webovej stránky za pár sekúnd).

Rád uvítam vaše pripomienky a skúsenosti s mobilnou verziou blogu.

V praxi môže nastať situácia, kedy potrebujeme dynamicky nahrať model z controlleru alebo z modelu tzn. až za behu samotnej aplikácie. Najprv si predstavíme spôsob dynamického nahrávania modelu z controlleru.

Dynamické nahrávanie modelu z controlleru

Len si pripomeňme, že za normálnych okolností môžeme model v controlleri nahrať pomocou premennej $uses

class ArticlesController extends AppController {
        var $name = 'Articles';
        var $uses = array('Comment');
}

Takto sa pri každom použití controlleru Articles sa nahrá a vytvorí objekt modelu Comment (samozrejme ak máme definované väzby v modeloch, napr. väzbu Article hasMany Comment, nemusíme explicitne uvádzať, že sa má daný model Comment nahrávať). Takéto správanie nemusí byť vždy žiadúce a nahratie modelu a vytvorenie jeho objektu budeme chcieť urobiť dynamicky, napr. iba pri vykonávaní akcie add. K tomuto účelu využijeme triedu App a jej metódu import

class ArticlesController extends AppController {
        var $name = 'Articles';

        function add() {
            //dynamicke nahratie modelu a vytvorenie objektu
            App::import('Model','Comment');
            $comment = new Comment;
            //volanie metody test z modelu Comment
            $comment->test();
        }
}

Dynamické nahrávanie modelu z iného modelu

Vyššie spomenutý postup je platný aj pre dynamické nahrávanie modelu z iného modelu. Takto by vyzeralo dynamické nahratie a vytvorenie objektu modelu Comment z modelu Article

class Article extends AppModel {

        var $name = 'Article';
        var $useTable = 'articles';

        function addArticle() {
            //dynamicke nahratie modelu a vytvorenie objektu
            App::import('Model','Comment');
            $comment = new Comment;
            //volanie metody test z modelu Comment
            $comment->test();
        }
}

V tomto prípade máme ešte jednu možnosť, ktorá sa však od predchádzajúcej líši najmä situáciou, v ktorej by mala byť použitá. Tou možnosťou je použitie metódy bindModel(). Musím však pripomenúť, že táto metóda je primárne určená na vytváranie dynamických väzieb medzi samotnými modelmi, i napriek tomu patrí medzi možnosti dynamického nahrávanie modelu. V našom prípade sme dynamicky vytvorili väzbu Article hasMany Comment a automaticky získali objekt na model Comment

class Article extends AppModel {

    var $name = 'Article';
    var $useTable = 'articles';

    function addArticle() {
        //dynamicke vytovrenie vazby a automaticke vytvorenie objektu modelu Comment
        $this->bindModel(
            array('hasMany' => array(
                'Comment' => array(
                    'className' => 'Comment'
                    )
                )
            )
        );
        //volanie metody test z modelu Comment
        $this->Comment->test();
    }
}

Dynamické nahratie modelu sa uskutoční iba v prípade volania metódy addArticle, čo je chovanie, ktorého sme chceli dosiahnuť.

Dúfam, že tento krátky článok bude v budúcnosti nápomocný. Rád uvítam vaše poznatky, nápady a pripomienky v diskusii k článku.