Создаем блог на Open Constructor’e

Идея написать такую статью висела в отдаленных локациях мозга уже очень давно. Блог для современного фреймворка — это все равно что Hello World! для языка программирования, так что идея, что называется, висела в воздухе.

Анализ

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

• Заголовок
• Текст поста
• Дата создания
• Категории
• Комментарии

Все, как видите, очень просто. Блог мы будем создавать по стандартному шаблону: в шапке название, слева категории, справа посты. В общем, поехали.

Структура данных

Начнем с того, что создадим структуру данных для нашего блога. Итак, устанавливаем Open Constructor, заходим как root и открываем вкладку «Данные». Эта вкладка у нас пока что девственно пуста. Так как блог у нас не втискивается ни в один стандартный тип данных, приходится создавать раздел гибридных данных.

В открывшемся окне заполняем поля и жмем «Создать». Вуаля. Раздел готов к конфигурированию. Итак, вспомним еще раз нашу структуру. Как видим поле «Заголовок» уже присутствует по умолчанию. Тем лучше, нам работы меньше. Поехали дальше. Жмем «Добавить поле».

Текст поста, скорее всего, будет простым полем с HTML-текстом. После создания не забываем разрешить базовые HTML-теги. Подробнее о фильтрации тегов и их аттрибутов

Дата создания заводится также просто как примитивное поле типа Date. На категории же немного притормозим.

Чтобы создать поле типа «Дерево», нам нужно сначала это дерево посадить. Для этого открываем вкладку «Каталог», нажимаем в панели инструментов «Создать узел», вводим ключ и название дерева. Готово!

Теперь можно вернуться к профилю гибридного раздела и создать поле «Категория».

С комментариями тоже не все так просто. По умолчанию специального типа «Комментарии» в Open Constructor’е нет. Но блин какой же это блог без камментов? Тлог блин какой-то никому не нужный. Выход к счастью есть. Очень похожим на комментарии является тип данных «Гостевая книга». И в самом деле, что такое комментарии, как не гостевая книга, отдельная для каждого поста? Ура! Решение найдено. Возвращаемся во вкладку «Данные» и создаем прототип для комментариев. Ничего не буду объяснять. Все и так понятно по скриншотам.

Просто как 1, 2, 3...

Ну вот и все. Структура данных готова.

Структура сайта

Переходим во вкладку «Карта сайта». Здесь тоже пока девственно пусто. Но это ненадолго. Включим мозг и быстренько представим себе структуру обычного блога. Наверное, что-то вроде этого:

• Главная
• Страница категории
• Страница поста

Не забываем при создании страницы категории и поста поставить галочку «Маршрутицировать вируальные URI на подразделы».

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

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

Вернемся во вкладку «Карта сайта» и выбираем для страницы Root наш шаблон «Страница». Жмем кнопку «Сохранить». Прекрасненько. Каркас страницы готов. Да, не забудьте написать файл стилей для нашего шаблона и привязать его к страницам.

Список категорий

Прежде чем выводить список категорий, создадим несколько.

Когда список готов, переходим во вкладку «Объекты». Знакомо-таки, да? Чистехонько. Немного обезобразим эту чистоту. Переходим в раздел «Гибридные данные / Структура» и жмем кнопку «Создать объект».

После создания объекта на странице его конфигурации:

1. Чекаем чекбокс «Категория» в группе «Поля по которым формируется иерархия»
2. Кликаем по кнопке «Создать новый» напротив поля «Использовать шаблон»

В окне создания нового объекта кликаем по кнопке «Шаблон по умолчанию», дабы не заморачиваться пока что, и сохраняем шаблон.

Возвращаемся в окошко профиля объекта, там новорожденный шаблон уже выбран. Жмем кнопку «Сохранить». Объект готов. Теперь нужно его присобачить в правильное место.

Нажимаем кнопку «Места применения объекта». В открывшемся окошке чекаем все страницы, выбираем блок «right» и сохраняем.

А теперь можно посмотреть, что получилось. Открываем в браузере адрес http://blog/ (или как там у вас) и наслаждаемся.

Список постов

Переходим к самому важному, а именно списку постов на главной странице. Для начала внесем несколько постов в блог. Открываем вкладку «Данные», входим в раздел «Гибридные данные / Блог» и жмем кнопку с зеленым плюсом.

Возьмем рыбку из Яндекс.Рефератов и нашлепаем три-четыре поста в блог.

Создаем объект вывода. По уже проторенной дорожке идем во вкладку «Объекты», но теперь в раздел «Гибридные данные / Список документов». Создаем объект.

Настройка объекта следующая:

1. Создаем шаблон. Правда вместо шаблона по умолчанию пишем свой.
2. Задаем идентификатор узла – category.
3. Создаем шаблон для URL. Ссылки будут вида /post/index.php/.1, где .1 – это идентификатор поста
4. Выбираем для вывода поля «Заголовок», «Дата создания» и «Текст поста»
5. Настраиваем сортировку по полю «Дата создания» по убыванию
6. Прикручиваем этот объект к блоку left на главной странице и в странице категории.

Открываем в браузере http://blog/ и смотрим на результат. Кликаем по одной из категорий, и снова наслаждаемся результатом.

Страница поста

И опять та же последовательность действий. Создаем объект вывода в разделе «Гибридные данные / Гибридный документ».

Настраиваем объект:

1. Идентификатор документа post
2. Выбираем для вывода поля «Заголовок», «Дата создания», «Текст поля» и «Комментарии»
3. Пишем шаблон.
4. Назначаем этому объекту блок left на странице поста.

Готово!

Комментарии

Так как, комментарии это отдельный подраздел данных для типа «Блог», для их вывода нужно создавать отдельный объект вывода сообщений гостевой книги.

Настраиваем объект так, как указано на скриншоте. Назначаем его блоку PRE на странице поста.

Создадим теперь объект вывода сообщений из гостевой книги. Для этого переходим в раздел «Гостевая книга / Список всех сообщений».

Настраиваем объект:

1. Создаем шаблон. Можно принять тот, что по умолчанию.
2. Заголовок объекта указываем «Комментарии»
3. Ставим галочку «Выводить в обратном порядке»
4. Чтобы было понятно, что список комментариев нужен для конкретного поста – указываем определение раздела через контекст как .post.comments/id
5. Назначаем этот объект блоку left2 на странице поста (не забудьте предварительно добавить этот блок в шаблон страницы)

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

Получается вот такой код:

{set cid = $ctx->newCaptchaId()}
<div class="block">
{if $header}
 <h1 class="head">{$header}</h1>
{/if}
 <div class="blockcont">
  <ul>
  {foreach from=$messages item=message}
   <li class="item" title="{$message.subject}">
    <h5 class="pubname"{if $message.published == 0} style="color: #666666;"{/if}>{$message.subject}</h5>
    <i><a href="mailto:{$message.email}"{if $message.published == 0} style="color: #666666;"{/if}>{$message.author}</a></i>
    {if $message.date}<nobr class="date">{$message.date}</nobr>{/if}
    {if $message.html}
    <div class="intro">
    {$message.html}
    </div>
    {/if}
    <a href="{$message.href}"{if $message.published == 0} style="color: #666666;"{/if} class="more" title="{$more}">{$more}</a>
   </li>
  {/foreach}
  </ul>
 </div>
 
 <form method="POST" action="./sent?cid={$cid}">
 Имя <input type="text" name="f_author" /><br />
 E-mail <input type="text" name="f_email" /><br />
 Сообщение <br /><textarea name="f_message"></textarea>
 <img src="/res/captcha/{$cid}.png" id="img-captcha" onclick="this.src = '/res/captcha/{$cid}.png?' + (new Date()).getTime();">
 <input type="text" name="f_cid" value="" size="10" id="comment-captcha">
 <br /><br />
 <input type="Submit" />
 </form>
</div>

Ну а теперь необходимо создать страницу обработчик для добавления комментария. Как видно из формы она имеет алиас sent и находится уровнем ниже страницы поста.

Вкратце добавление комментария состоит из следующих этапов:

1. Загрузка поста
2. Запуск обработчика сообщения гостевой книги

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

Напоследок добавим редирект со страницы добавления комментария обратно к странице поста. Для этого напишем объект PHP-кода.

1. Создаем раздел PHP-кода
2. Добавляем код «POST обработки комментариев»
   

<?php
 $name = $_POST['f_author'];
 $email = @$_POST['f_email'];
 $expires = time()+3888000;//Cookies Lifetime is 45 days
 setcookie('comment[author]', $name, $expires, '/');
 setcookie('comment[email]', $email, $expires, '/');
 $obj = &$ctx->getObject(17);
 $ref = explode('?', $_SERVER['HTTP_REFERER']);
 header("Location: ".$ref[0].'#c'.$obj->success);
?>

3. Создаем объект «Включения РНР-кода» и назначем ему блок POST на странице добавления комментария.

Ну вот и все. Можно добавлять комментарии. Блог готов.