Урок 1. Меню навигации

Урок 1. Меню навигации

Начнем с самого начала. Итак, мы собираемся сделать сайт (узел, сервер). Первым делом необходимо уяснить, каким образом на сайте будет упорядочена та или иная информация. Сколько будет категорий, подразделов и т. д. Все эти вопросы возникают на первом этапе - «Организация сайта».

А какой должна быть навигация сайта? Требований к хорошей навигации много. Она должна быть понятной, легкоузнаваемой, единообразной и удобной в использовании, быстро загружаться, давать четкое понятие о текущем местоположении. При этом на сайте не должно возникать 404-й ошибки, т. е. все ссылки должны работать. Тем, у кого есть опыт создания сайтов, наверняка приходилось сталкиваться с проблемой создания грамотной навигации.

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

Создание меню, которое ориентирует пользователя на сайте, не дает ему заблудиться - вот задача, с которой нам хочется начать повествование о Parser. Почему именно это? Прежде всего потому, что большое количество тегов

<a href="страница_сайта.html">

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

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

1)	Всю информацию о наших ссылках будем хранить в одном файле, что позволит впоследствии вносить необходимые изменения только в него. В корневом каталоге будущего сайта создаем файл sections.cfg, в который помещаем следующую информацию:

section_id	name	uri
1	Главная	/
2	Новости	/news/
3	Контакты	/contacts/
4	Цены	/price/
5	Ваше мнение	/gbook/

Здесь используется так называемый формат tab-delimited. Столбцы разделяются знаком табуляции, а строки - переводом каретки. При копировании этой таблицы в текстовый редактор данное форматирование будет создано автоматически, но если таблица будет создаваться вручную, необходимо это учитывать. Для таблиц по умолчанию применяется формат tab-delimited.

2)	В том же каталоге, где содержится sections.cfg, создаем файл auto.p . В нем мы будем хранить все те кирпичики, из которых впоследствии Parser соберет наш сайт. AUTO означает, что все эти кирпичики будут всегда доступны для Parser в нужный момент, а расширение .p - это… правильно! Он самый!

3)	В файл auto.p вставим следующий код:

@navigation[]
$sections[^table::load[sections.cfg]]

<nav>
   ^sections.menu{
      <a href="$sections.uri">$sections.name</a>
   }[|]
</nav>

Данные из этого файла и будут служить основой для нашего навигационного меню.

Вот и все, подготовительные работы закончены. Теперь открываем код страницы, где все это должно появиться (например, index.html), и говорим: «Вставить меню навигации». На Parser это называется «вызов метода» и пишется так:

^navigation[]

Осталось только открыть в браузере файл, в который мы вставили вызов метода, и посмотреть на готовое меню навигации. Теперь в любом месте на любой странице мы можем написать заветное ^navigation[], и Parser вставит туда наше меню. Страница будет сформирована «на лету». Что хотели, то и получили.

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

Однако не будем радоваться раньше времени. Сперва разберемся, что же мы сделали, чтобы добиться такого результата. Предлагаем взглянуть на код в auto.p. Если кажется, что все непонятно, не надо бежать прочь. Уверяем, через несколько минут все встанет на свои места. Итак, посмотрим на первую строчку:

@navigation[]

Она аналогична строке ^navigation[], которую мы вставили в текст страницы для создания меню. Различие только в первом символе: ^ и @. Однако логический смысл этого выражения совершенно иной: здесь мы определяем метод, который вызовем позже. Символ @ («собака») в первой колонке строки в Parser означает, что мы хотим описать некоторый блок, которым воспользуемся в дальнейшем. Следующее слово определяет имя нашего метода: navigation. И это только наше решение, как его назвать. Вполне допустимы имена вида а_ну_ка_вставь_меню_быстро. Но читаться такая программа будет хуже, впрочем, кому как понятнее.

Жизненно необходимо давать методам простые, понятные имена. Они должны точно соответствовать тому, что именуемый объект будет хранить и делать. Настоятельно рекомендуется крайне внимательно относиться к именам, чтобы сохранить нервы и время себе, а также всем тем, кому впоследствии придется разбираться в написанном коде. Имена могут быть написаны как латинскими, так и русскими символами, главное - соблюдать единообразие: все или по-русски, или по-английски.

Идем дальше.

$sections[^table::load[sections.cfg]]

Это ключевая строка нашего кода. Она достаточно большая, поэтому лучше разобрать ее по частям.

Строка начинается символом $ (доллар) и следующим сразу за ним именем sections. Так в Parser обозначаются переменные. Это надо запомнить. Все просто: видим в тексте $var - имеем дело с переменной var. Переменная может содержать любые данные: числа, строки, таблицы, файлы, рисунки и даже часть кода. Присвоение переменной $parser_home_url значения www.parser3.ru на Parser выглядит так: $parser_home_url[www.parser3.ru]. После этого мы можем обратиться к переменной по имени, т. е. написать $parser_home_url и получить значение www.parser3.ru.

Еще раз то же самое:

$var[…]	- присваиваем
$var	- получаем

Подробнее - см. в разделе «Переменные».

В нашем случае переменная $sections будет хранить таблицу из файла sections.cfg.

Любую таблицу Parser рассматривает как самостоятельный объект, с которым он умеет производить только вполне определенные действия, например добавлять или удалять из нее строки. Поскольку переменная может хранить любые данные, необходимо указать, что значение, присвоенное переменной, является именно таблицей.

Лирическое отступление
Пример из жизни. Всю автомобильную технику можно грубо разделить на несколько классов: легковые автомашины, грузовики, трактора и гусеничная техника. Любой автомобиль является объектом одного из этих классов. При необходимости легко определить, к какому классу относится автомобиль, поскольку их все объединяют общие характеристики, такие как вес, масса перевозимого груза и т. д. Любой автомобиль может совершать действия: двигаться, стоять или ломаться. Каждый из автомобилей обладает своими собственными свойствами. И главное, автомобиль не может появиться сам собой, его нужно создать. Когда конструктор придумывает новую модель автомобиля, он точно знает, автомобиль какого класса он создает, какими свойствами будет наделено его творение и что оно сможет делать. Так же и в Parser: каждый объект относится к определенному классу, объект класса создается конструктором этого класса и наделяется характеристиками (полями) и методами (действиями), общими для всех подобных объектов.

Итог
Любой объект в Parser принадлежит конкретному классу, характеризуется полями и методами именно этого класса. Чтобы он появился, его нужно создать. Делает это конструктор данного класса. Это базовая терминология, ее нужно усвоить перед дальнейшим изучением.

Продолжим. Переменной $sections мы присвоили вот что:

^table::load[sections.cfg]

Буквально это означает следующее: мы создали объект класса table при помощи конструктора load. Общее правило для создания объекта записывается так:

^имя_класса::конструктор[параметры_конструктора]

Подробнее - см. в разделе «Передача параметров».

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

Теперь переменная $sections содержит таблицу с разделами нашего сайта. Parser считает ее объектом класса table и точно знает, какие действия с ней можно выполнить. Пока нам понадобится только один метод этого класса - menu, который последовательно перебирает все строки таблицы. Также нам потребуются значения из полей самой таблицы. Синтаксис вызова методов объекта:

^объект.метод_класса[параметры]

Получение значений полей объекта (мы ведь имеем дело с вполне определенной таблицей с заданными нами же полями):

$объект.имя_поля

Знания, полученные выше, теперь позволяют без труда разобраться в последней части нашего кода:

<nav>
   ^sections.menu{
      <a href="$sections.uri">$sections.name</a>
   }[|]
</nav>

Мы формируем HTML-меню, в каждый пункт которого помещаем значения, содержащиеся в полях нашей таблицы $sections: uri - адрес и name - имя. При помощи метода menu мы автоматически перебираем все строки таблицы. В первом параметре, переданном в фигурных скобках, задан код, который нужно выполнить для каждой строки таблицы. Во втором параметре, переданном в прямых скобках, задана строка, разделяющая пункты меню. Таким образом, даже если у нас будет несколько десятков разделов, ни один из них не будет потерян или пропущен. Мы можем свободно добавлять разделы, удалять их и даже менять местами. Изменения вносятся только в файл sections.cfg. Логика работы не нарушается. Все просто и красиво.

Подведем итоги первого урока.

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

Что узнали: познакомились c концептуальными понятиями языка (класс, объект, свойство, метод), а также некоторыми базовыми конструкциями Parser.

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

Синтаксис работы с объектами:

$переменная[значение]	- задаем значение
$переменная	- получаем значение
$переменная[^имя_класса::конструктор[параметры]]	- создаем объект класса имя_класса и присваиваем его переменной
$переменная.имя_поля	- получаем поле самого объекта, хранящегося в переменной
^переменная.метод[]	- вызываем действие (метод класса, к которому принадлежит объект, хранящийся в переменной)

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

Дата обновления: 16.10.2024