cojack blog » System szablonów http://www.cojack.pl Programowanie oraz Open Source powodem do życia Fri, 20 Aug 2010 18:16:05 +0000 PL hourly 1 http://wordpress.org/?v=3.0.1 Separated Template http://www.cojack.pl/separated-template http://www.cojack.pl/separated-template#comments Tue, 15 Sep 2009 14:14:30 +0000 cojack http://cojack.os-cms.pl/?p=235 Tak więc na phpclasses.org jakiś czas temu pojawiła się nowa klasa o nazwie sTemplate, co lepsze, jest to twór Polaka, co mnie bardzo cieszy a kolejne zdziwienie jakie mnie naszło, że jest to młody chłopak co mnie jeszcze bardziej cieszy, gdyż tacy ludzie są lub będą intelektualną śmietanką jeżeli w dalszym ciągu będą rozwijać swoją wiedzę oraz chcieć poznawać i tworzyć nowe rzeczy. Wracając do rzeczy, autorem tego systemu szablonów jest Sebastian Potasiak, link do jego blogu jest u mnie na stronie zatytułowanej Linki. Do rzeczy z czym to się je? Kolega rozwiązał w dość sprytny sposób ominięcie na wstawianie zmiennych w tpl, czyli jak w itx np {SOME_VARIABLE} lub też w smartach {$some_variable}, przykład:

1
2
3
4
5
6
7
8
9
10
11
12
13

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml-strict.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
     <head>
          <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
          <title class="tytul"></title>
     </head>
     <body>
          <div class="tytul"></div>
          <div class="tresc"></div>
     </body>
</html>

Jak widać nie ma niczego co by można było parsować, a teraz spójrzmy na to:

1
2
3
4
5
6
7
8
9
10
11

<?php
     include('./sTemplate.class.php');
 
     $tpl = new sTemplate;
 
     $zmienne = array(
          'tytul' => 'Moja strona',
          'tresc' => 'To jest przykładowa treść mojej strony.<br />Aby zobaczyć więcej wyślij SMS o treści CHWDP na numer PREFIX_997'
     );
 
     $tpl->load('home', $zmienne);

Co nam to zwróci? A taki kod:

1
2
3
4
5
6
7
8
9
10
11
12
13

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml-strict.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
     <head>
          <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
          <title class="tytul">Moja strona</title>
     </head>
     <body>
          <div class="tytul">Moja strona</div>
          <div class="tresc">To jest przykładowa treść mojej strony.<br />Aby zobaczyć więcej wyślij SMS o treści CHWDP na numer PREFIX_997</div>
     </body>
</html>

Takie sobie to co? Ja widzę parę problemów, dajmy na to że klasa title używamy do wylistowania artykułów, i jeżeli mielibyśmy ciągle taki sam tytuł to trochę do bani co? ;] Więc prosty system szablonów, na bardzo proste strony. Jak się mają benchmarki, a czort go wie ;] W następnym wpisie przedstawię wyniki.

]]> http://www.cojack.pl/separated-template/feed 2 System szablonów ITX cz.2 http://www.cojack.pl/system-szablonow-itx-cz-2 http://www.cojack.pl/system-szablonow-itx-cz-2#comments Sat, 22 Aug 2009 07:56:09 +0000 cojack http://cojack.os-cms.pl/?p=179 Poznaliśmy już podstawy tejże klasy, potrafimy już oddzielać php od html’a, w b.małym stopniu, ale mimo wszystko coś tam robimy. Dziś postaram się pokazać jak zrobić menu 2 poziomowe w ITX oraz prosty przykład na zarządzanie akcjami z tym systemem szablonów.

Na początku prosty przykład z obsługi akcji.
W pliku index.php po utworzeniu obiektu klasy, piszemy taki o to kod:

1
2
3
4
5
6

// (...)
$link = $_GET['akcja'];
if( is_file("./$link.php") ){
    $tpl->addBlockFile("ZMIENNA","nasza_nazwa_wymyslona_nowego_bloku","$link.tpl");
    @include_once("./$link.php");
}

I gdybyśmy coś takiego napisali, to jesteśmy w trupie, no nasza strona za pomocą ataków z $_GET padła by ofiarą w przeciągu paru dni… Więc każdy taki kod jest wart mniej niż 0, nie wolno tak pisać! Nie wolno includować plików prosto z adresu! Należy filtrować wszystkie dane przesyłane przez użytkownika!

Tak więc jak to najbezpieczniej zrobić? Dla mnie dobrym wyjściem jest przechowywać nazwy akcji w bazie danych, np tabela:

1
2
3
4

CREATE TABLE "akcja" (
  "id" serial,
  "nazwa" varchar(64) UNIQUE NOT NULL
);

I teraz po wybraniu wyniku z tabeli, wiemy czy dana akcja istnieje czy nie, zawsze ktoś do $_GET może dołożyć sobie ../ i będzie katalog wyżej, ale to też należy do naszych obowiązków sprawdzić co jest przesyłane w tym $_GET.

Dobra co jest czym? Tutaj akurat w tym przykładzie nie ma dużo co tłumaczyć, jest tylko jedna metoda.

addBlockFile, jak widać coś przyjmuje, przyjmuje 3 argumenty, pierwszy to nazwa zmiennej, czyli teraz dowiemy jak się to używa…

W kodzie templatki, głównej mamy jakąś ZMIENNA i ona zostanie zastąpiona przez blok zawartości, z pliku który podajemy jako trzeci argument, 2 argument, natomiast jest to nazwa bloku na którym możemy wykonywać operacje, w pliku index, a nie w pliku includowanym. Plik includowany odpowiada za działania wewnątrz tej templatki, czyli odpowiednie parsowanie itp.

Można to też w inny sposób zrobić, za pomocą metody addBlock, ta natomiast, nie parsuje nam zmiennej do bloku, tylko wymienia cały blok ;) Ale nie wiem jak to działa, bo nigdy nie stosowałem, jedno działa dobrze, to na cholerę mi drugie? ;]

Jak mogła by wyglądać taka templatka, a np system artykułów, np:

1
2
3
4
5
6

<!-- BEGIN articles -->
  <div class="article-cont">
    <h1>{ARTICLE_NAME}</h1>
    <p class="article-box-cont">{ARTICLE_CONTENT}</p>
  </div>
<!-- END articles -->

A plik php? Proszę:

1
2
3
4
5
6
7
8
9
10
11
12
13

<?php
// małe zabezpieczenie przed wchodzeniem bezpośrednio w plik
if( basename($_SERVER['SCRIPT_FILENAME']) != 'index.php') ){
  header ('location: index.html');
  exit; // należy używać exit po header ponieważ kod się dalej wykona
}
/*
 * Pobieramy dane z bazy
 */
$tpl->setCurrentBlock('articles');
$tpl->setVariable('ARTICLE_NAME',$data['article_name']);
$tpl->setVariable('ARTICLE_CONTENT',htmlspecialchars_decode($data['article_content'],ENT_QUOTES));
$tpl->parseCurrentBlock();

htmlspecialchars_decode używamy, jeżeli u wcześnie użyliśmy htmlspecialchars z ENT_QUOTES i typem kodowania.

Jak zauważyliście, nie zamkłem bloku kodu znacznikiem końca php czyli ?> Dlaczego? A otóż dlatego że sie manuala nie czyta, nie no ja też o tym nie wiedziałem że nie powinno się zamykać php jeżeli plik zawiera sam php, to nie potrzeba dodawać tego znaku, więcej info link

Ciekawą metodą jest: replaceBlockfile np parę razy spotkałem się z problemem, iż pod jedną z pod stron, chciałem mieć inne menu, które było ładowane np w dispatcher (dyspozytor, nie długo o nim opiszę), dość ciekawa funkcja która może nam z tym pomóc. Metoda przyjmuje 3 argumenty, pierwszy z nich to nazwa bloku, czyli np: ‘articles’, nazwa bloku zwierającego się w <!– –>, który chcemy zmienić. Drugim argumentem, jest nazwa templatki, np: „nowosci.tpl”, którą chcemy załadować zamiast bloku kodu. Trzecim, nie wymaganym argumentem jest wartość boolean, czy chcemy zachować tamten kod, standardowo ustawiony na false, ale możemy ustawić na true, np jeżeli jest to sam tekst, a chcemy coś dopisać do wszystkich tekstów, to możemy coś takiego zastosować, tylko nie wiem co ma jakie pierwszeństwo ;)

przykład:

// (...)
$tpl->replaceBlockfile('menu_vertical','menu-vertical-2.tpl');

Menu z podmenu
Tak więc najpierw kod, a później wytłumaczenie:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

<?php
$tablica = array ('Coś' => array ('Pod coś', 'Pod coś 2', 'Pod coś 3'),
		  'Coś 2' => array ('Pod coś', 'Pod coś 2', 'Pod coś 3')
		 );
 
require_once ('HTML/Template/ITX.php');
$tpl = new HTML_Template_ITX('./tpl');
$tpl->loadTemplatefile('index.tpl', true, true);
$tpl->setCurrentBlock('menu1');
foreach ($tablica as $klucz => $wartosc){
  $tpl->setVariable('PARENT',$klucz);
  if( is_array($wartosc) ){
    $tpl->setCurrentBlock('menu2');
    foreach($wartosc as $tekst){
      $tpl->setVariable('CHILDREN',$tekst);
      $tpl->parseCurrentBlock('menu2');
    }
  }
  $tpl->parse('menu1');
}
 
$tpl->show();

A teraz kod templatki, html:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
  <title>Menu z submenu w ITX</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta http-equiv="content-language" content="pl" />
</head>
<body>
  <ul>
    <!-- BEGIN menu1 -->
    <li>{PARENT}</li>
      <ul>
	<!-- BEGIN menu2 -->
	<li>{CHILDREN}</li>
	<!-- END menu2 -->
      </ul>
    <!-- END menu1 -->
  </ul>
</body>
</html>

Dobra, teraz wytłumaczenie:

1) Dlaczego parse() a nie parseCurrentBlock()?
Odp: Dobre pytanie, na prawdę godne uwagi, bardzo dobrze że zwróciłeś na to uwagę, ale pierw chciałbym Ci powiedzieć o Twoich ubezpieczeniach…
P.S. to drugie nie działa, dlaczego? A skąd to ja mam wiedzieć :D

2) Wszystkie inne metody już zostały przetłumaczone, wystarczy przeanalizować działanie dwóch pętli foreach, a to już na zadanie domowe.

]]> http://www.cojack.pl/system-szablonow-itx-cz-2/feed 2 System szablonów ITX http://www.cojack.pl/system-szablonow-itx http://www.cojack.pl/system-szablonow-itx#comments Sun, 28 Jun 2009 17:43:07 +0000 cojack http://cojack.os-cms.pl/?p=21 Tak więc zacznijmy od tego, że należy sprawdzić naszą bibliotekę PEAR, PEAR jest to zbiór rozszerzeń dla PHP. Można to rozumieć na dwojaki sposób, ale należy w taki że jest to repozytorium (zbiór, miejsce) gotowych skryptów (klas) opublikowanych na licencji GPL lub pochodnych. A teraz do rzeczy w konsoli wykonujemy polecenie

pear list

To polecenie powinno nam zwrócić mniej więcej taki wynik:

1
2
3
4
5
6
7
8
9
10
11
12

Installed packages, channel pear.php.net:
=========================================
Package             Version State
Archive_Tar         1.3.3   stable
Console_Getopt      1.2.3   stable
HTML_Common         1.2.5   stable
HTML_QuickForm      3.2.11  stable
HTML_Template_Flexy 1.3.9   stable
HTML_Template_IT    1.2.1   stable
PEAR                1.8.1   stable
Structures_Graph    1.0.2   stable
XML_Util            1.2.1   stable

Oczywiście nie powinniście mieć HTML_Template_IT, ale jeżeli macie, pomińcie dalszą część instalacji.

Instalacja
Żeby zainstalować pakiet z biblioteki PEAR, należy uzyskać prawa administratora, ja używam archlinuxa, przez co u mnie uzyskanie praw administratora wykonuje się przez polecenie:

su

w zależności od dystrybucji, może to być też również

sudo su

Po wpisaniu hasła, wydajemy polecenie:

pear update-channels

być może będzie trzeba zrobić coś innego, ale czytajcie logi z konsoli, i na pewno przejdziecie ten etap. Następnie wpisujemy:

pear install HTML_Template_IT

I teraz plus dla Linuxa, linux sam sobie rozwiąże zależności wśród pakietów, co załatwia za nas instalowanie dodatkowych pakietów które musielibyśmy sami rozwiązać (czytaj ściąganie ręcznie z strony pear.php.net reszty paczek). Dobra mamy już to czego nam potrzeba, czyli system szablonów ITX. Dobrym też rozwiązaniem jest upgrejd pozostałych pakietów, jeżeli mamy jakieś stare, możemy to łatwo i szybko rozwiązać wpisując polecenie:

pear upgrade-all

Teraz możemy przejść do części kulminacyjnej, czyli implementacji ITX.

Sposób użycia systemu szablonów ITX
Tworzymy sobie jakiś plik, np index.php, i zaczynamy kodzić nasz pierwszy skrypt z użyciem ITX:

1
2
3
4
5
6
7
8
9

<?php
require_once ('HTML/Template/ITX.php'); # wczytujemy klase bazową
$tpl = new HTML_Template_ITX('./templates'); # do konstruktora podajemy ścieżkę w której znajduje się nas szablon
$tpl->loadTemplatefile('index.tpl',true,true); # wczytujemy nasz plik z templatką
$tpl->setCurrentBlock('start'); # zaczynamy blok do parsowania
$tpl->setVariable('imie','Andrzej'); # parsujemy zmienna imie na tekst Andrzej
$tpl->parseCurrentBlock('start'); # dobrym nawykiem jest dodawanie nazwy bloku
$tpl->show();
?>

Dla totalnie zielonych (nie chcesz nie czytaj)

Mamy już gotowy plik w którym będziemy parsować plik z templatką, teraz troche wyjaśnień co do metod

$tpl = new HTML_Template_ITX('./templates');

W tym momencie tworzymy obiekt klasy HTML_Template_ITX i musimy do konstruktora klasy wysłać ścieżkę w której mamy nasze pliki z szablonami, ./ mówi nam że jest to katalog z którego wykonujemy skrypt, następnie folder templates, w którym mamy nasz plik z szablonem. Nie ma innej możliwości podania klasie lokalizacji folderu z szablonami, więc należy o tym pamiętać.
Następna linijka:

$tpl->loadTemplatefile('index.tpl',true,true);

Tutaj natomiast podajemy nazwę szablonu którego ma użyć w danym skrypcie, funkcja loadTemplatefile jak widać pobiera 3 argumenty, pierwszy to nazwa templatki jako string, druga natomiast przyjmuje wartości boolean, czyli true lub false, dla true usuwa nieznane zmienne z pliku z szablonem, czyli jak damy jakąś zmienną {KTOS} a nie nadamy jej wartości poprzez setVariable, to parses usunie ją, dla false parses zostawi zmienną i wyświetli się nam w postaci {KTOS}, trzeci argument, też przyjmuje wartości boolean, odpowiada za parsowanie bloków w sensie usuwa lub zostawia bloki, już tłumaczę, dla true parser usunie bloki nie dotknięte przez funkcję setCurrentBlock(), lub touchBlock() lub parse(). Ale do tego wrócimy. Dla false zostawi te bloki, i je wyświetli (manual o tym nic nie pisze, ale tak jest ;)
Idźmy dalej:

$tpl->setCurrentBlock('start');

Tutaj jak sama nazwa funkcji wskazuje, ustawiamy jaki blok w templatce chcemy parsować, trzeba wziąć pod uwagę, to że wielkość słów nie ma znaczenia, lecz nie mogą się w nazwie bloku znaleźć Polskie znaki diakrytyczne. Później pokaże jak to można zrobić, tak więc czy napiszemy StArT, czy START, czy jakkolwiek inaczej parser nam to ładnie przewinie, dodam że do nazw można dodawać liczby 0-9, _ (podkreślnik), – (minus) oraz . (kropka).

$tpl->setVariable('imie','Andrzej');

Tutaj natomiast mamy do czynienia z ustawianiem zmiennej imie na string Andrzej, zostanie ona podmieniona a później wyświetlona, należy jednak zapamiętać że nie powinno się stosować takich samych nazw bloków jak i zmiennych, z doświadczenia wiem, że może to nam narobić boruty, i nawet jeżeli mamy 2 bloki, każdy z bloków nazywa się inaczej, to nie wolno stosować takich samych nazw zmiennych w tych blokach! Bardzo ważne i należy się tego trzymać!

$tpl->parseCurrentBlock('start');

Tutaj mamy dziwną sprawę, ponieważ funkcja jest nazwana jako void, co jest bardzo dziwne, ponieważ funkcje typu void niczego nie zwracają, a tu i tak funkcja zwraca nam true więc wartość boolean przy poprawnym rezultacie, no i w przeciwnym wypadku FALSE lub IT_Error, sprawdziłem IT_Error.php, dziedziczy z klasy PEAR_Error, w której nie ma wyjątków, więc co jak co try {} catch {} nam nie pomogą. Dostaniemy gołym php’owym błędem w twarz. Co do podawania nazwy bloku który parsujemy, nie daje on nic, ale daje nam, jeżeli mamy np parę zagnieżdżonych bloków w sobie (np podwójne Menu, potrójne, poczwórne …), to później nam łatwiej jest się odnaleźć który to już blok zamknęliśmy.

$tpl->show();

Funkcja ta, może ale nie musi przyjmować wartość typu string, która jest nazwą bloku, czyli parsujemy jakąś templatkę i nie chcemy parsować wszystkiego na raz, tylko pojedyncze bloki bo takie mamy widzimisię, to podajemy jako string nazwę każdego z poszczególnych bloków. Jeżeli natomiast zastosujemy na końcu po implementacji całego szablonu, parser przeleci wszystkie bloki, i je zwróci jako gotowy kod HTML’a. Btw kolejna funkcja typu void.

Plik szablonu

Przerobiliśmy cały kod z pliku index.php, teraz zostało nam zobaczyć jak wygląda, teraz przyszedł czas na szablon.
Tak więc nazwaliśmy sobie szablon: index.tpl, tak więc w katalogu templates tworzymy sobie ten plik szablonu a w nim następujący kod:

1
2
3
4
5
6
7
8
9
10
11

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >
<title>System szablonów ITX</title>
</head>
<body>
<!-- BEGIN start -->
Witaj {imie}!
<!-- END start -->
</body>
</html>

Jak już zdążyliście zauważyć bloki zaczyna się komentarzami w HTML’u, wyraźnie zaznaczamy rozpoczęcie kodu bloku przez słowo BEGIN i zakończenie END, zmienne wstawiamy w znaki klamer { }
Teraz to już nam nic nie zostało do zrobienia jak tylko odpalenie skryptu, i zobaczyć jak pięknie działa. W ten oto sposób oddzieliliśmy kod PHP od kodu HTML.

W następnych częściach więcej przykładów oraz opisu funkcji.

]]> http://www.cojack.pl/system-szablonow-itx/feed 1