2.3. Разделение дизайна и скриптов

В этой схеме разделяются два главных компонента web-приложения: дизайн и программирование. Подобное деление обеспечивает возможность параллельной разработки (web-дизайн и программирование) без необходимости постоянной координации на протяжении всего рабочего цикла. Более того, оно позволяет в будущем модифицировать один компонент, не влияя на работу другого.

3. Нетривиальная система шаблонов

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

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

Листинг 1. Пример шаблона

<html>

<head>

<title>{page_title}</title>

</head>

<body bgcolor="{bg_color}">

Добро пожаловать на страницу {user_name}!

</body>

</html>

Обратите внимание на три строки (page_title, bg_color и user_name), заключенные в фигурные скобки ({ }). Фигурные скобки имеют особый смысл при обработке шаблонов - заключенная в них строка интерпретируется как имя переменной, вместо которого подставляется ее значение.

Дизайнер строит страницу по своему усмотрению; все, что от него потребуется, - включать в соответствующие места документа эти ключевые строки. Конечно, программисты и дизайнеры должны заранее согласовать имена всех переменных!

НЕ нашли? Не то? Что вы ищете?

Все функции построения и выполнения операций с шаблонами будут оформлены в виде методов класса. Определение класса начинается так:

Пример

class template

{

//идентификаторы файлов и содержимое каждого файла

var $files = array( );

//двухмерный массив для хранения файлового идентификатора (ключа) и всех //соответствующих переменных, обрабатываемых в схеме шаблонов

var $variables = array( );

// ограничители для частей шаблона, которые должны заменяться системой

var $opening_escape = '{';

var $closing_escape = '}';

}

В наших примерах в качестве ограничителей будут использоваться фигурные скобки ({ }). Можно изменить два последних атрибута и выбрать ограничители по своему усмотрению. Главное - проследить за тем, чтобы эти символы не использовались для других целей.

Каждый метод класса решает конкретную задачу, соответствующую той или иной операции в процессе обработки шаблона. Этот процесс можно разделить на четыре стадии.

1.  Регистрация файлов - регистрация всех файлов, обрабатываемых сценариями шаблонов.

2.  Регистрация переменных - регистрация всех переменных, которые должны заменяться своими значениями в зарегистрированных файлах.

3.  Обработка файлов - замена всех переменных, находящихся между ограничителями, в зарегистрированных файлах.

4.  Вывод файла - вывод обработанных зарегистрированных файлов в браузере.

4. Регистрация файлов

В процессе регистрации содержимое файла сохраняется в массиве с ключом, однозначно идентифицирующим этот файл. Метод register_file() открывает и читает содержимое файла, имя которого передается в качестве параметра. Код этого метода приведен в листинге 2.

Листинг 2. Метод регистрации файла в классе шаблона

function register_file($file_id, $file_name)

{

// Открыть $file_name для чтения или завершить программу с выдачей сообщения об ошибке

$fh = fopen($file_name, "r") or die ("Не могу открыть файл - $file_name!");

// Прочитать все содержимое файла $file_name в переменную

$file_contents = fread($fh, filesize($file_name));

// Присвоить содержимое элементу массива с ключом $file_id

$this->files[$file_id] = $file_contents;

// Работа с файлом завершена, закрыть его.

fclose($fh);

}

Параметр $file_id содержит идентификатор – символьный псевдоним для последующих операций с файлом, упрощающий последующие вызовы метода. Идентификатор используется в качестве ключа для индексирования массива $files.

Пример регистрации файла:

// Включить класс шаблона

include("template. class");

// Создать новый экземпляр класса

$template = new template;

// Зарегистрировать файл "homepage.html", присвоив ему псевдоним "home"

$template->register_file("home", "homepage. html");

5. Регистрация переменных

После регистрации файлов необходимо зарегистрировать все переменные, которые будут интерпретироваться особым образом. Метод register_variables( ) (листинг 3) читает имена переменных и сохраняет их в массиве $variables.

Листинг 3. Метод регистрации переменных

function register_vanables($file_id, $variable_name)

{// Попытаться создать массив, содержащий переданные имена переменных

$input_variables = explode(".", $variable_name);

// Перебрать имена переменных

while (list($value) = each($input_variables)) :

// Присвоить значение очередному элементу массива $this->variables

$this->variables[$file_id][] = $value:

endwhile;

}

В параметре $file_id передается ранее присвоенный псевдоним файла. Например, в предыдущем примере файлу homepage. html был присвоен псевдоним home. Обратите внимание - при регистрации имен переменных, которые должны особым образом обрабатываться в файле homepage. html, вы должны ссылаться на файл по псевдониму! В параметре $variable_name передаются имена одной или нескольких переменных, регистрируемых для указанного псевдонима.

Пример:

// Включить класс шаблона

include("tempiate. class");

// Создать новый экземпляр класса

$template = new template;

// Зарегистрировать файл "homepage. html", присвоив ему псевдоним "home"

$template->register_file("home", "homepage. html");

// Зарегистрировать несколько переменных

$template->register_variables ("home", "page_title. bg_color. user_name");

6. Обработка файла

После того как файлы и переменные будут зарегистрированы в системе шаблонов, можно переходить к обработке зарегистрированных файлов и замене всех ссылок на переменные с соответствующими значениями. Метод file_parser( ) приведен в листинге 4.

Листинг 4. Метод обработки файла

function file_parser($file_id)

{

// Сколько переменных зарегистрировано для данного файла?

$varcount = count($this->variables[$file_id]);

// Какие файлы зарегистрированы в шаблоне? $keys - массив всех ключей в files

$keys = array_keys($this->files):

// Если файл $file_id существует в массиве $this->files и с ним связаны зарегистрированные переменные

if ( (in_array($file_id, $keys)) && ($varcount > 0) )

{ $x = 0; // Сбросить $x

// Пока остаются переменные для обработки

while ($x < sizeof($this->variables[$file_id])) :

// Получить имя очередной переменной

$string = $this->variables[$file_id][$x];

// Получить значение пер-й. Для получения зн-я используется конструкция $$.

// Полученное значение подставляется в файл вместо указанного имени переменной.

GLOBAL $$string;

// Построить точный текст замены вместе с ограничителями

$result = $this->opening_escape.$string.$this->closing_escape;

// Выполнить замену

$this->files[$file_id] = str_replace( $result, $$string, $this->files[$file_id]);

$x++;// Увеличить $х

endwhile;

}//endif;

}

Сначала мы проверяем, присутствует ли указанное имя файла в массиве $this->files. Если файл был зарегистрирован, мы также проверяем, были ли для него зарегистрированы переменные, и если были - значения этих переменных подставляются в содержимое $file_id.

Пример:

// Включить класс шаблона

include("template. class") ;

$page_title = "Добро пожаловать на страницу!";

$bg_color = "white";

$user_name = "";

// Создать новый экземпляр класса

$template = new template;

// Зарегистрировать файл "homepage. html",присвоив ему псевдоним "home"

$template->register_file( "home", "homepage. html");

// Зарегистрировать несколько переменных

$template->register_variables("home", "page_titie, bg_color, user_name");

$template->file_parser("home");

Поскольку переменные page_title, bg_color и user_name были зарегистрированы, значения каждой переменной (присвоенные в начале сценария) подставляются в страницу homepage. html, хранящуюся в массиве files (атрибуте объекта-шаблона). На этом предварительная подготовка завершается, остается лишь вывести полученный шаблон в браузере. Эта операция рассматривается в следующем разделе.

7. Вывод файла

В нашем примере для вывода файла создается отдельный метод, приведенный в листинге 5, однако в зависимости от ситуации вывод также может интегрироваться с методом fiIe_parser().

Листинг 5. Метод вывода файла в браузере

function print_file($file_id)

{

// Вывести содержимое файла с идентификатором $file_id

print $this->files[$file id];

}

Все очень просто - при вызове print_file( ) содержимое файла, представленного ключом $file_id, передается в браузер.

В листинге 6 приведен пример использования класса template.

Листинг 6. Пример использования класса template

// Включить класс шаблона

include("template. class");

// Присвоить значения переменным

$page_title = "Добро пожаловать на страницу!";

$bg_color = "white";

$user_name = "";

// Создать новый экземпляр класса

$template= new template;

// Зарегистрировать файл "homepage. html" с псевдонимом "home"

$template->register_file("home", "homepage. html");

// Зарегистрировать переменные

$template->register_variables("home", "page_title, bg_color. user_name");

//Произвести обработку переменных

$template->file_parser("home");

// Передать результат в браузер

$template->print_file("home");

Если бы шаблон, приведенный в листинге 1, хранился в файле homepage. html в одном каталоге со сценарием из листинга 16, то в браузер был бы направлен следующий код HTML:

<html>

<head>

<title> Добро пожаловать на страницу!</title>

</head>

<body bgcolor=white>

Добро пожаловать на страницу, !

</body>

</html>

Как видно из приведенного примера, все зарегистрированные переменные были заменены соответствующими значениями. При всей своей простоте класс template обеспечивает стопроцентное разделение уровней программирования и дизайна.

Лекция 7. Архитектура корпоративного сайта.

План.

1.  Архитектура корпоративного сайта.

2.  Типовые блоки корпоративного сайта.

3.  Проектирование структуры каталогов корпоративного сайта.

Литература. М. Кузнецов и др. PHP5. Практика создания Веб-сайтов. СПб, 2007//Глава 6. Проектирование стр. 243-249

Лекция 8. Система администрирования контента

План.

1.  Основные функции приложения

2.  Интерфейс приложения

3.  Проектирование структуры БД

4.  Реализация приложения. Основные файлы

5.  Пример. Система администрирования контента

Литература. М. Кузнецов и др. PHP5. Практика создания Веб-сайтов. СПб, 2007, стр. 249-333

Лекция 9-10. Блок «голосование». Блок «Гостевая книга»

Введение

Блок «голосование».

Для того, чтобы иметь обратную связь с клиентами, на корпоративных сайтах применяют 2 вида веб-приложений – голосование и гостевая книга.

Блок «Голосование» предлагает посетителям вопрос и несколько вариантов ответа.

Цель приложения – привлечь внимание к ресурсу, сбор социологической информации.

1. Система голосования

Система голосования обычно представляет собой небольшую форму, размещаемую на всех страницах сайта, которая содержит вопрос и варианты ответа на него. С помощью этой формы любой посетитель может ответить на задаваемый вопрос, выбрав один из предлагаемых вариантов ответа и нажав кнопку «Голосовать».

Система голосования позволяет вести архив старых опросов. При добавлении нового опроса старый не удаляется, а перемещается в архив. Через систему администрирования любой опрос можно восстановить из архива и снова поместить на сайт.

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

Пример.

1.  Вопрос-ответы-голосовать

2.  После нажатия кнопки «голосовать», ответ обрабатывается в системе голосования и автоматически открывается окно с результатами опроса с учетом текущего голосования.

2. Система администрирования

С помощью системы администрирования проводится управление системой голосования. Через интерфейс системы голосования можно создавать новые голосования, добавлять новые варианты ответов в существующие, направлять голосования в архив и извлекать их из архива.

Главная страница системы администрирования представляет собой меню:

- текущий опрос (открытие страницы с текущим опросом)

- добавить голосование

- перейти к архиву голосований

План.

1.  Основные функции приложения

2.  Интерфейс приложения

3.  Проектирование структуры БД

4.  Реализация приложения. Основные файлы

5.  Пример. Блок «голосование». Блок «Гостевая книга»

Литература. М. Кузнецов и др. PHP5. Практика создания Веб-сайтов. СПб, 2007, стр. 430-459

Лекция 11-12. Блок «Фотогалерея». Блок «Поиск по сайту»

План.

1.  Основные функции приложения

2.  Интерфейс приложения

3.  Проектирование структуры БД

4. Реализация приложения. Основные файлы

5. Пример. Блок «Фотогалерея». Блок «Поиск по сайту»

Литература. М. Кузнецов и др. PHP5. Практика создания Веб-сайтов. СПб, 2007, стр. 430-459

3  План самостоятельной работы студентов

Содержание самостоятельной работы

Кол-во часов

Форма контроля

О

З

С

1

Введение в электронную коммерцию

10

15

15

Отчет

2

Типовая структура Интернет-магазина

10

15

15

Отчет

3

Определение архитектуры Web-приложений

10

15

15

Отчет

4

Артефакты моделирования

10

15

15

Отчет

5

Требования при разработке Web-приложений

10

15

15

Отчет

6

Шаблоны в РНР

10

15

15

Отчет

7

Архитектура корпоративного сайта. Типовые блоки. Проектирование структуры каталогов

10

15

15

Отчет

8

Система администрирования контента

10

15

15

Отчет

9

Блок «голосование»

10

15

15

Отчет

10

Блок «Гостевая книга»

10

15

15

Отчет

11

Лабораторные работы 1-4. Сбор, моделирование, спецификация и аттестация требований к web-приложению

10

15

15

Отчет

12

Лабораторная работа 5. Проектирование структуры базы данных

10

15

15

Отчет

13

Лабораторная работа 6. Проектирование структуры каталогов приложения

10

15

15

Отчет

14

Лабораторная работа 7. Реализация структуры каталогов приложения

10

15

15

Отчет

15

Лабораторная работа 8. Создание и отладка DDL-сценария

10

15

15

Отчет

16

Лабораторная работа 9. Реализация интерфейсов web-приложения

10

15

19

Отчет

17

Лабораторная работа 10. Реализация скриптов web-приложения

10

15

19

Отчет

18

Выполнение семестрового учебного проекта «Проектирование и реализация элемента корпоративного сайта средствами PHP 5.0 и MySQL 5.0)

18

25

25

Защита проекта

4  Контрольные работы (только для ЗО).

4.1  Методические рекомендации по выполнению и оформлению контрольных работ;

4.2  Перечень рекомендуемой литературы;

4.3  Темы (варианты) контрольных работ.

Не предусмотрены учебным планом

Из за большого объема этот материал размещен на нескольких страницах:
1 2 3 4