warlockfx ([info]warlockfx) wrote,
@ 2009-07-09 10:37:00
Previous Entry  Add to memories!  Tell a Friend  Next Entry
Entry tags:web-development

Сборка сайта из шаблона

Сегодня пришло на почту письмо с благодарностью за статью о вёрстке и подтолкнула к написанию ещё одной статьи в продолжение темы.

Итак, по прочтении, мы имеем шаблон с метками, на место которых нужно вставить всю очень важную и уместную информацию. Ещё у нас имеются следующие файлы:

./inc/css/style.css — файл с каскадными таблицами стилей, содержащий информацию о том, какие блоки у нас есть, как всё должно быть оформлено и так далее;

./inc/tpl/index.tpl.html — файл-шаблон, который содержит базовую разметку (как правило, подобной она будет по всему сайту, а меняться будет лишь информация, хранящаяся в шаблоне в виде меток);

Добавим теперь капельку программирования и создадим следующие файлы:

./inc/func.inc.php — файл с функциями, каждая из которых будет играть определённую роль в формировании сайта;

./index.php — основной файл-сценарий, который будет выполняться в самую первую очередь, когда появится посетитель.

Важно помнить, что весь дизайн, который рисуется и создаётся, нужно разбить самым оптимальным образом — картинки должны быть высокого качества и в большинстве случаев, информация о них должна храниться в CSS, как фон какого-то элемента. Реже — в файле описания шаблона. Все отступы, границы и шрифты должны быть уже подобраны на этом этапе.

В первую очередь, нужно понять логику веб-приложения. Что именно нужно получить по исполнении сценария. Зачастую, этот этап является самым длительным. Но от тщательности его исполнения зависит судьба всего проекта.



Структура основного сценария

В первую очередь нужно включить все зависимые файлы — конфигурационный, поддержку системы управления базами данных, список и описание функций, список всех переменных, языковой пакет и так далее. Затем, часто запускают механизм журналирования. Но в нашем примере это не очень нужно.

Далее, проверяют источник, запрашивающий страницу. Это критично, когда есть страница для закачивания файлов на сервер и перегрузка будет ни к чему. А злоумышленник может написать простой закольцованный скрипт, отправляющий постоянно дикие объёмы информации. Это как-то не очень благостно.

Следующим пунктом идёт формирование массива данных (то, чем будут заменены метки из прошлой статьи), а дальше — проверка ввода. В зависимости от обстоятельств, что-то будет происходить с приложением. Это сложный момент, который называется обработчиком (controller) в модели «MVC». Если логика хорошо продумана, то от версии к версии этот файл меняться особо не будет.

Заключительным моментом является вставка данных из массива в шаблон и отправка сформированного xHTML-кода браузеру клиента.

Всё! Вот как примерно это может выглядеть:

Пример: (файл index.php)

<?php

  /* включаем вспомогательные файлы */
  include_once('inc/func.php');

  /* проверяем клиента, который запросил страницу методом post */
  if($_SERVER['REQUEST_METHOD']=="POST"){
    isset($_SERVER['HTTP_REFERER']) or die();
    eregi($_SERVER['HTTP_HOST'], $_SERVER['HTTP_REFERER']) or die();
  }

  /* массив с данными */
  $contents=array(
    'TITLE' => get_title()
    ,'MAINLOGO' => get_mainlogo()
    ,'TRANS' => get_trans()
    ,'LOGIN' => get_login()
    ,'CONTENT' => ''
    ,'FOOTER' => get_footer()
  );

  /* небольшая хитрость для пущего удобства
     и удаление визуального мусора с кода */
  if(isset($_GET['act'])){
    $_act=$_GET['act'];
  }elseif(isset($_POST['act'])){
    $_act=$_POST['act'];
  }

  if(isset($_act)){
    switch($_act){
     /* здесь будут происходить разные действия,
        в зависимости от логики самого приложения */
    }
  }

  /* получаем готовый xHTML и отдаём его клиенту */
  echo compile($contents, 'inc/tpl/index.tpl.html');

?>
 

Теперь чтобы весь этот крэп взлетел, надо отредактировать файл с функциями.



Создание массива с информацией

Это обыкновенный ассоциативный массив (стало намного понятней), где имена элементов такие же, как и метки в файле-шаблоне. Моим персональным правилом является написание в верхнем регистре (КАПСЛОЧНО) этих имён. Значения же этих элементов массива — обыкновенный xHTML-код или просто текст.



Список функций

Из примера становится ВНЕЗАПНО ясно, что разработчики PHP как бы не предусмотрели того, что кому-то надо будет чем-то заполнять шапку, создавать блок с формой авторизации и так далее. Поэтому всё это будет написано вручную. В первую очередь писать надо следующие функции (взято из примера выше):

get_title — сборка заголовка;

get_mainlogo — создание логотипа из изображений, подписей и что там ещё может потребоваться;

get_trans — не знаю зачем этот блок нужен, но он идёт сверху справа;

get_login — форма для авторизации (видимо, на момент написания прошлой статьи считал этот блок нужным);

get_footer — то, что идёт в самом низу;

compile — единственная функция, которая что-то делает, а именно заменяет все метки из определённого файла на информацию из массива.

Пример: (файл inc/func.inc.php)

<?php

  /* ничего интересного, простая передача xHTML */
  function get_title(){ return '<p>some title</p>'; }
  function get_mainlogo(){ return '<p>Logo</p>'; }
  function get_trans(){ return '<p>some xHTML</p>'; }
  function get_login(){ return '<p>Login | Registration</p>'; }
  function get_footer(){ return '<p>distributed under General Public Licence</p>'; }

  /* этой функции требуется массив и имя файла с шаблоном */
  function compile($messages, $filename){
    /* открывается файл для чтения и в переменную $content
       заносится его содержимое */
    $handler=fopen($filename, 'r');
    $content=fread($handler, filesize($filename));
    fclose($handler);

    /* тупая замена блоков, окружённых символом процента
       на текст, сформированный функциями выше */
    foreach($messages as $key => $value)
      $content=str_replace('%'.$key.'%', $value, $content);
    return $content;
  }


?>
 

По идее — всё. Должно работать. Если какие-то вопросы будут — можно писать в комментариях. Постараюсь ответить, если знаю.




Create an Account
Forgot your login or password?
Login w/ OpenID
English • Español • Deutsch • Русский…