Создание приложения на Kohana. Часть 1
Доброго времени суток! И мы с Вами продолжаем изучать фреймворк Kohana. Мы уже с Вами разобрались как установить Kohana, рассмотрели тут и тут принцип работы Kohana, изучили роуты в Kohana, научились настраивать данный фреймворк. Теперь время пришло реализовать полученные данные на практике. Давайте приступим.
Мы будем создавать библиотеку книг. Наше приложение будет состоять из двух частей: frontend — непосредственно само приложение, доступное для пользователя и backend — административная часть. Договоримся: все что относиться к административной части будет находиться в папке admin, так например контроллеры для backend части будут располагаться в ./application/classes/controller/admin, а представления в ./application/views/admin.
Начнем создавать наше приложение и первое, что мы сделаем — это базовый класс.
Создадим в ./application/classes/controller файл base.php и поместим туда следующий код:
<!--?php defined('SYSPATH') or die('No direct script access.'); class Controller_Base extends Controller_Template { public $template = 'base'; public function before() { parent::before(); // Название сайта $site_name = 'Библиотека книг'; // description сайта $site_description = 'База данных моей домашней библиотеки'; // title страницы $page_title = null; /*Вывод данных в шаблон*/ //Вывод в шаблон названия сайта $this--->template->site_name = $site_name; // Вывод в шаблон описания сайта meta тег description $this->template->site_description = $site_description; // Ввывод в шаблон title страницы $this->template->page_title = $page_title; /*Подключаем файлы CSS, JavaScript*/ // Файл CSS $this->template->styles = array('media/css/style.css'); // Файл JavaScript $this->template->scripts = array(); } }
Давайте я прокомментирую данный код. Мы создаем контроллер base, которые наследует все методы от контроллера Template.
В строке
public $template = 'base';
определяем базовый шаблон.
В данном контроллере мы используем метод before. Метод before — это специальный метод, который будет вызываться перед выполнением любого action данного контроллера.
В методе before мы будем передавать в шаблон некоторые значения переменных:
- $site_name — название сайта
- $site_description — описание нашего сайта
- $page_title — заголовок страницы
- в переменную нашего шаблона style будем передавать название нашего CSS файла
- в переменную шаблона scripts будем передавать названия наших javascript файлов
Для чего это надо? Это необходимо для того, чтобы в каждом контроллере не повторять код. А как Вы понимаете название сайта, описание сайта изменяться не будет, так же не будет изменяться и базовый шаблон. А другие контроллеры нашего приложения уже будут наследовать этот базовый контроллер. Сумбурно? Ничего страшного по ходу написания нашего приложения на Kohana все ляжет по своим местам и Вы поймете насколько это просто и удобно.
Теперь давайте создадим базовое представление base.php в папке ./application/views
Я за ранее подготовил верстку нашего приложения и на этом я не буду останавливаться. Кому интересно исходник верстки находиться тут или тут.
И поместим в него следующий код:
<!-- Подключение фалов стилей --> <!--?php foreach ($styles as $style): echo html::style($style); endforeach; ?--> <!-- Подключение файлов скриптов --> <!--?php foreach ($scripts as $script): echo html::script($script); endforeach; ?--> <!--?php if (isset($page_title)) : echo $page_title; endif; ?--> <!-- Wrapper --></pre> <div id="wrapper"> <!-- Header --> <div id="magnifier"></div> <div id="header"> <div id="logo"> <a href="#">Моя библиотека</a></div> <div id="top_menu"> <ul> <li><a href="#1">Автор</a></li> <li><a href="#2">Жанр</a></li> <li><a href="#3">Название</a></li> <li><a href="#3">Управление</a></li> </ul> </div> </div> <!-- End Header --> <!-- Advertising --> <div id="advertising"> <div id="advertising_text"> Создаем сайт при помощи фреймворка Kohana Сайт <a href="http://web-programming.com.ua" target="_blank">http://web-programming.com.ua</a> На этом сайте Вы также можете найти полезные материалы по: <ul> <li>Языку программирования PHP</li> <li>Языку программирования JavaScript</li> <li>Пакету jQuery</li> <li>CMS WordPress</li> <li>Полезные инструменты для WEB-разработчика</li> </ul> </div> <img src="media/img/kohana.png" alt="" /></div> <!-- End Advertising --> <!-- News --> <div id="news"> News</div> <!-- End news --> <!-- Content --> <div id="content"> <!--?php if (isset($content)): echo $content; endif; ?--></div> <!-- End content --> <!-- Empty --> <div id="empty"></div> <!-- End Empty --></div> <pre> <!-- End wrapper --> <!-- Footer --></pre> <div id="footer"> Footer</div> <pre> <!-- End footer -->
Верстку я не буду комментировать, а вот php вставки я обьясню.
В строках:
foreach ($styles as $style): echo html::style($style); endforeach;
Мы подключаем CSS файлы. Конструкция html::style — это хелпер, о которых мы поговорим в другой статье.
Файлы скриптов подключаются по аналогии с подключением CSS файлов, только используем html::script хелпер.
В строках:
if (isset($page_title)) : echo $page_title; endif;
мы подключаем вывод title для страницы. По аналогии мы подключаем и контент.
Давайте к нашему приложению добавим картинки и файл стилей. Для этого в корне нашего сайта создадим папку media, в которой создадим директории css — для файлов стилей, img — для картинок и js — для файлов скриптов.
В папку css поместим файл style.css следующего содержания
* { margin:0; padding: 0; } html,body{ height: 100%; background-image: url(../img/backgraund.png); } #wrapper { margin: 0 auto; width: 1000px; min-height: 100%; } #header { height: 195px; width: 1000px; } #magnifier { height:121px; width:111px; position:absolute; margin-top: 79px; margin-left: -16px; background: url(../img/magnifier.png) no-repeat; z-index:100; } #logo { height:50px; width:150px; position: relative; top: 100px; left:45px; z-index:1; } #logo a { text-decoration:none; color: black; font-size: 36px; } #top_menu { height:50px; width:600px; position: relative; top:50px; left:200px; } #top_menu ul { } #top_menu ul li { text-decoration:none; list-style: none; float: left; margin-left: 5px; } #top_menu ul li a { color: #873b11; font-size: 36px; text-decoration:none; } #top_menu ul li a:hover { color: #3b2215; } #advertising { height:217px; width:1000px; border: 1px solid #000; background-color: #291304; } #advertising_text { height:217px; width:600px; text-align:center; } *:first-child+html #advertising_text { text-align:left; } #advertising p, #advertising li { font-family: Georgia, "MS Trebuchet", sans-serif; font-style:italic; color:#999; } #advertising img { position: relative; left:600px; top: -217px; } #advertising ul li{ text-decoration:none; list-style: none; } #news { width:1000px; position:relative; background-color: red; } #content { width: 1000px; min-height:200px; position: relative; z-index: 100; } #empty{ height: 106px; } #footer { width: 1000px; height: 106px; margin: 0 auto; margin-top: -289px; padding-top: 200px; background-image: url(../img/gradient.png); position: relative; z-index: 1; }
Описывать файл стилей я не буду — не наша задача. Теперь данный стиль нам надо подключить в базовом контроллере:
$this->template->styles = array('media/css/style.css');
А в папку img добавим наши картинки, которые касаются дизайна.
Проверим, что у нас получилось. Откроем файл index.php, который находиться в ./application/classes/controller и изменим его на:
<!--?php defined('SYSPATH') or die('No direct script access.'); class Controller_Index extends Controller_Base { public function action_index() { $this--->template->page_title = 'Главная страница'; $this->template->content = View::factory('index',array ( 'text'=>'Привет', )); } }
Т.е. мы создаем контроллер index, который наследует все свойства и методы контроллера base (class Controller_Index extends Controller_Base). Создаем экшн index, в котором:
- Передаем в наш шаблон переменную page_title со значением “Главная страница” ( $this->template->page_title = ‘Главная страница’ )
- Передаем в переменную content нашего базового шаблона шаблон index и в него переменную text со значением “Привет” ($this->template->content = View::factory(‘index’,array (‘text’=>’Привет’, ));)
Теперь необходимо создать шаблон index в ./application/views, который мы вызываем в нашем контроллере, следующего содержания:
Главая страница <!--?php echo $text ?-->
Думаю, тут пояснять ничего не надо.
Проверим, что у нас получилось. Переходим на Ваш сайт (в моем случае это books) и видим:
У нас все работает.
На этом данный пост я заканчиваю. Главное, что Вы должны вынести из данной статьи:
- Создание базового контроллера, для того чтобы избежать избыточного, повторяющегося кода.
- Создание базового шаблона.
- Принцип работы функции before
А в следующей статье мы остановимся на работе с базой данных. Так, что не пропускайте выхода новых постов, подписавшись на мой блог.
Скачать исходник можно отсюда или отсюда.
[…] с Вами продолжаем создавать приложение на Kohana. Так в прошлой статье мы с Вами начали создавать приложение. И в данном […]
Здравствуйте.
Возможно переместить папку медиа в каталог модуля?
и как реализовать это?
при решении данной проблемы у меня не подключались стили
я так понял что проблема в роутах возможно Вы сталкивались с подобным
заранее спасибо за ответ
не работает по твоему мануалу!
Всё работает, кое где убрал лишние символы в коде, типа тере и т.д. и все ОК. Спасибо за урок.