Встречайте третью часть цикла статей по разработке с Kohana PHP V3 (KO3). Предыдущие части можно найти по метке "знакомство с kohana 3.0". В этот раз речь пойдет о создании шаблонов.
Во второй статье мы рассмотрели виды, а теперь будем наследовать классы Controller'а, что позволит создать шаблон. Шаблон представляет собой вид, который состоит по большей части из (X)HTML кода.
Прежде чем начать заполнять файлы кодом, создадим новую папку в “/application/views/” и назовем ее “templates”. Теперь в любимом редакторе создайте чистый документ и вставьте туда следующее:
Сохраните это как “default.php” в “/application/views/templates/”.
Как видите, этот код по сути выглядит как те виды, которые мы создавали во второй части, только в более расширенной и универсальной, а потому подходящей к использованию во всем проекте, версии. На “foreach” я остановлюсь позже.
На данный момент у нас есть шаблон, но нет указаний системе что-либо с ним делать. Поэтому давайте создадим новый файл со следующим содержимым:
Сохраните его как “defaulttemplate.php” в папке “/application/classes/controller/”.
В этом скрипте мы наследуем класс “Controller_Template” и делаем три базовые операции: делаем некоторые свойства (переменные) доступными нашим методам (экшенам), присваиваем им значения по умолчанию, а затем связываем их с переменными из шаблона перед его визуализацией. Здесь и начинает работать цикл foreach() из шаблона. Он использует статические методы класса-помощника “HTML”: один для загрузки стилей CSS, другой для файлов JavaScript. Эти методы, выполнившись в цикле, создадут корректный HTML-код для подключения файлов. Они принимают как URL, так и относительный путь.
Если вы не знаете, что такое класс-помощник, то вот краткое определение из документации Kohana 2.x:
Итак, вернемся к коду. Как вы могли заметить, в нем присутствует упоминание “assets/css/reset.css”, так что давайте с этим разберемся. В корневой папке создайте директорию “assets”, а в ней — “css”. Стили я скопировал из статьи “Create The Perfect CSS Reset” и засунул в файл “reset.css”, который поместил в “assets/css/.” Можете внутри папки “/assets/” также создать директории “images”, “js” и “files”. Эта папка будет использоваться для хранения статических файлов.
Пока еще наше приложение не знает, что со всем этим делать, поэтому давайте изменим наш контроллер. Откройте “/application/classes/controller/ko3.php” и замените строку:
на:
Также нужно привести экшен “index” (метод action_index()) к следующему виду:
Сохраните файл. Возможно вы заметили, что добавилась строка “$this->template->title = ‘Kohana 3.0′;”, которая присвоит значение переменной “title” в наших шаблонах. Также мы избавились от метода “render()” в конце. В его вызове теперь нет необходимости, поскольку метод “factory()” автоматически отвизуализирует вид в переменную “content” шаблона. Довольно просто, правда?
Перед загрузкой страницы в браузере, пожалуй, стоит удалить некоторый уже не нужный код. Откройте “ko3.php”, который находится в “application/views/pages/”, и приведите его к такому виду:
Теперь, обновив в браузере страничку, вы должны увидеть, что внешне она практически не изменилась, не считая появления заголовка “Kohana 3.0″, но исходный код стал совсем другим.
Вам может быть непонятно назначение остальных переменных в шаблоне, поэтому давайте вернемся к экшену “index” и заменим его на следующий код:
Довольно просто. Возможно вы заметили, что я не заполнил хэдер и футер страницы. Но, уверен, вы догадаетесь, что тут нужно сделать. Подсказка: визуализировать вид в ту переменную (смайлик).
Еще вы можете заметить, что я подключил “assets/css/red.css” и “assets/css/jqtest.js”. Давайте теперь их заполним, начиная с “/assets/css/red.css”:
Теперь “/assets/js/jqtest.js”:
Сохраните их и обновите сайт. Должно появиться всплывающее окно и первая строка должна стать красной.
Поздравляю, в этой части вы на базе встроенного контроллера «Template» создали свой контроллер, использующий созданный вами же файл шаблона.
Во второй статье мы рассмотрели виды, а теперь будем наследовать классы Controller'а, что позволит создать шаблон. Шаблон представляет собой вид, который состоит по большей части из (X)HTML кода.
Прежде чем начать заполнять файлы кодом, создадим новую папку в “/application/views/” и назовем ее “templates”. Теперь в любимом редакторе создайте чистый документ и вставьте туда следующее:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Language" content="en-us" />
<title><?php echo $title;?></title>
<meta name="keywords" content="<?php echo $meta_keywords;?>" />
<meta name="description" content="<?php echo $meta_description;?>" />
<meta name="copyright" content="<?php echo $meta_copywrite;?>" />
<?php foreach($styles as $file => $type) { echo HTML::style($file, array('media' => $type)), "\n"; }?>
<?php foreach($scripts as $file) { echo HTML::script($file, NULL, TRUE), "\n"; }?>
</head>
<body>
<div id="container">
<?php echo $header;?>
<?php echo $content;?>
<?php echo $footer;?>
</div>
</body>
</html>Сохраните это как “default.php” в “/application/views/templates/”.
Как видите, этот код по сути выглядит как те виды, которые мы создавали во второй части, только в более расширенной и универсальной, а потому подходящей к использованию во всем проекте, версии. На “foreach” я остановлюсь позже.
На данный момент у нас есть шаблон, но нет указаний системе что-либо с ним делать. Поэтому давайте создадим новый файл со следующим содержимым:
<?php
defined('SYSPATH') or die('No direct script access.');
class Controller_DefaultTemplate extends Controller_Template
{
public $template = 'templates/default';
/**
* Initialize properties before running the controller methods (actions),
* so they are available to our action.
*/
public function before()
{
// Run anything that need ot run before this.
parent::before();
if($this->auto_render)
{
// Initialize empty values
$this->template->title = '';
$this->template->meta_keywords = '';
$this->template->meta_description = '';
$this->template->meta_copywrite = '';
$this->template->header = '';
$this->template->content = '';
$this->template->footer = '';
$this->template->styles = array();
$this->template->scripts = array();
}
}
/**
* Fill in default values for our properties before rendering the output.
*/
public function after()
{
if($this->auto_render)
{
// Define defaults
$styles = array('assets/css/reset.css' => 'screen');
$scripts = array('http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js');
// Add defaults to template variables.
$this->template->styles = array_reverse(array_merge($this->template->styles, $styles));
$this->template->scripts = array_reverse(array_merge($this->template->scripts, $scripts));
}
// Run anything that needs to run after this.
parent::after();
}
}Сохраните его как “defaulttemplate.php” в папке “/application/classes/controller/”.
В этом скрипте мы наследуем класс “Controller_Template” и делаем три базовые операции: делаем некоторые свойства (переменные) доступными нашим методам (экшенам), присваиваем им значения по умолчанию, а затем связываем их с переменными из шаблона перед его визуализацией. Здесь и начинает работать цикл foreach() из шаблона. Он использует статические методы класса-помощника “HTML”: один для загрузки стилей CSS, другой для файлов JavaScript. Эти методы, выполнившись в цикле, создадут корректный HTML-код для подключения файлов. Они принимают как URL, так и относительный путь.
Если вы не знаете, что такое класс-помощник, то вот краткое определение из документации Kohana 2.x:
Помощники — это удобные функции, которые призваны помочь вам с разработкой.
Они похожи на библиотечные функции, но есть небольшое различие. В случае с библиотеками необходимо создавать экземпляр библиотечного класса, чтобы использовать его методы. Помощники же являются статическими методами класса, который автоматически загружается фреймворком, так что нет нужды производить дополнительные действия.
Итак, вернемся к коду. Как вы могли заметить, в нем присутствует упоминание “assets/css/reset.css”, так что давайте с этим разберемся. В корневой папке создайте директорию “assets”, а в ней — “css”. Стили я скопировал из статьи “Create The Perfect CSS Reset” и засунул в файл “reset.css”, который поместил в “assets/css/.” Можете внутри папки “/assets/” также создать директории “images”, “js” и “files”. Эта папка будет использоваться для хранения статических файлов.
Пока еще наше приложение не знает, что со всем этим делать, поэтому давайте изменим наш контроллер. Откройте “/application/classes/controller/ko3.php” и замените строку:
class Controller_Ko3 extends Controllerна:
class Controller_Ko3 extends Controller_DefaultTemplateТакже нужно привести экшен “index” (метод action_index()) к следующему виду:
public function action_index()
{
$ko3_inner = array();
$ko3 = array();
$this->template->title = 'Kohana 3.0';
View::set_global('x', 'This is a global variable');
$ko3_inner['content'] = 'We have more data';
$ko3['content'] = 'We have data';
$ko3['ko3_inner'] = View::factory('blocks/ko3_inner', $ko3_inner)
->render();
$this->template->content = View::factory('pages/ko3', $ko3);
}Сохраните файл. Возможно вы заметили, что добавилась строка “$this->template->title = ‘Kohana 3.0′;”, которая присвоит значение переменной “title” в наших шаблонах. Также мы избавились от метода “render()” в конце. В его вызове теперь нет необходимости, поскольку метод “factory()” автоматически отвизуализирует вид в переменную “content” шаблона. Довольно просто, правда?
Перед загрузкой страницы в браузере, пожалуй, стоит удалить некоторый уже не нужный код. Откройте “ko3.php”, который находится в “application/views/pages/”, и приведите его к такому виду:
<h1>This is my first view</h1>
<?php echo $content;?>
<?php echo $ko3_inner; ?>
<br/><?php echo $x;?>Теперь, обновив в браузере страничку, вы должны увидеть, что внешне она практически не изменилась, не считая появления заголовка “Kohana 3.0″, но исходный код стал совсем другим.
Вам может быть непонятно назначение остальных переменных в шаблоне, поэтому давайте вернемся к экшену “index” и заменим его на следующий код:
public function action_index()
{
$ko3_inner = array();
$ko3 = array();
$this->template->title = 'Kohana 3.0';
$this->template->meta_keywords = 'PHP, Kohana, KO3, Framework';
$this->template->meta_description = 'A test of of the KO3 framework';
$this->template->styles = array('assets/css/red.css' => 'screen');
$this->template->scripts = array('assets/js/jqtest.js');
View::set_global('x', 'This is a global variable');
$ko3_inner['content'] = 'We have more data';
$ko3['content'] = 'We have data';
$ko3['ko3_inner'] = View::factory('blocks/ko3_inner', $ko3_inner)
->render();
$this->template->content = View::factory('pages/ko3', $ko3);
}Довольно просто. Возможно вы заметили, что я не заполнил хэдер и футер страницы. Но, уверен, вы догадаетесь, что тут нужно сделать. Подсказка: визуализировать вид в ту переменную (смайлик).
Еще вы можете заметить, что я подключил “assets/css/red.css” и “assets/css/jqtest.js”. Давайте теперь их заполним, начиная с “/assets/css/red.css”:
h1
{
color: #FF0000;
}Теперь “/assets/js/jqtest.js”:
$("document").ready(function()
{
alert('Hello Kohana!');
});Сохраните их и обновите сайт. Должно появиться всплывающее окно и первая строка должна стать красной.
Поздравляю, в этой части вы на базе встроенного контроллера «Template» создали свой контроллер, использующий созданный вами же файл шаблона.
