Работа с шаблонами

Контейнер [[ROW]]

Для подключения полей необходимо подключить файл с шаблонами полей

1
#include // подключаем файл container.tpl все контейнеры системе

По умолчанию файл уже подключен во всех layout

Контейнер [[ROW]] может включать внутри себя другие контейнеры: [[ROW]], [[CONTAINER]]. Количество разбиваемых колонок должно точно совпадать с содержимым или воспользуйтесь пустым контейнером [[SPACE]] для правильного расчета. Нельзя использовать блоки({BLOCK}{/BLOCK}) внутри контейнеров). Кроме вложенных разрешенных контейнеров, система берет строки и разбивает на колонки. Это может быть что угодно: html elements, но в одну строку. Контейнер должен закрываться [[ROW_END]].
Соблюдение многострочности обязательно.

Свойства полей

  • column – количество колонок (по умолчанию 1). Разбивает содержимое на колонки
  • class – установка классов css на сам контейнер.
  • sizeColumns – устанавливает последовательно размеры колонок(только целые числа). Количество последовательностей может быть меньше. В таком случае система автоматически разобьет остальные поровно с учетом сетки на 12
  • class1..classN– переопределяет классы блоков после разбиения по колонкам, добавляя | class1: col-sm-6 col-md-4 col-lg-2|class2:col-sm-6 col-md-8 col-lg-10. Нумерация начинается с единицы и проверяется по количеству созданных колонок.

Пример:

[[ROW | column: 3 | sizeColumns: 2 8]]
 [[CONTAINER | h:hide | width:2 | height: auto | name: photo]]
  [[PHOTO | name: photo]]
 [[CONTAINER_END]]
 [[CONTAINER | header: #L:MainData | height: auto | column: 2 | name: general]]
  [[field | name: name | label: style=»font-weight:bold»]]
  [[field | name: article]]
  [[field | name: parent]]
  [[field | name: short_name]]
  [[field | name: code]]
  [[field | name: date]]
 [[CONTAINER_END]]
 [[ROW]]
  [[SPACE]]
 [[ROW_END]]
[[ROW_END]]

В данном примере разбивается на три колонки (два контейнера и один вложенный пустой [[ROW]]. Обратите внимание на sizeColumns. Мы могли бы задать sizeColumns: 2 8 2 с учетом сетки на 12. Но система автоматически расчитает остальные поровну. Придерживайтесь сетки и содержимому. Иначе система выдаст одну колонку для каждого элемента равной 12. Если мы бы не задали sizeColumns, система разобьет колонки поровну на 4 4 4. И если бы мы задали sizeColumns: 2, то система разобьет 2 5 5

Контейнер [[CONTAINER]]

Контейнер [[CONTAINER]] не может включать внутри себя контейнеры. Количество разбиваемых колонок должно точно совпадать с содержимым или воспользуйтесь пустым контейнером [[SPACE]] для правильного расчета. Нельзя использовать блоки({BLOCK}{/BLOCK}) внутри контейнеров). Кроме вложенных разрешенных контейнеров, система берет строки и разбивает на колонки. Это может быть что угодно: html elements, но в одну строку. Контейнер должен закрываться [[CONTAINER_END]].
Соблюдение многострочности обязательно.

Свойства полей

  • h – устанваливает класс на заголовок контейнера
  • ah – установка классов на action bar справа вверху.
  • paneClass – устанваливает класс на сам контейнер
  • header – устанавливает заголовок
  • name – устанавливает имя. Оно должно быть уникальным на странице. Служит для сохранения в local storage у пользователя в браузере. Должно быть уникальным на странице. Для кнопки свернуть/развернуть
  • trigger – В action bar вверху справа — есть кнопка свернуть/развернуть. Данный атрибут служит для явного вызова trigger: click. Что бы предположим окно свернулось явно.
  • edit – возможность редактировать поля. По умолчанию нет
  • height – установка высоты. Если установить auto, то расчитается автоматическая высота по parent ui-row
  • column – количество колонок (по умолчанию 1). Разбивает содержимое на колонки
  • sizeColumns – устанавливает последовательно размеры колонок(только целые числа). Количество последовательностей может быть меньше. В таком случае система автоматически разобьет остальные поровно с учетом сетки на 12
  • class1..classN– переопределяет классы блоков после разбиения по колонкам, добавляя | class1: col-sm-6 col-md-4 col-lg-2|class2:col-sm-6 col-md-8 col-lg-10. Нумерация начинается с единицы и проверяется по количеству созданных колонок.
  • template – устанваливает template для контейнера. По умолчанию в системе их два: default, table
  • sizeLabel – Устанавливает внутри контейнера на все [[fields]] ширину label.(Bootstrap 1-12)
  • sizeControl – Устанавливает внутри контейнера на все [[fields]] ширину control.(Bootstrap 1-12)
  • rowOff:1 – когда Column:1, то создается <div class=’ui-row’><div class=’col-*-12′>content</div></div>. Это флаг отключает создание ui-row в случае, когда column:1 или не указан. Этот флаг часто используется, когда нужно height 100%. Если column: != 1 и Вам нужно что бы parent height=100%, то тогда лучше воспользуйтесь paneClass: h100.

Пример:

[[CONTAINER | header: Основные данные | column: 2 | height: auto | name: testName | edit: true]]
 [[field | name: full_name | lock: true]]
 [[field | name: position]]
 [[field | name: email]]
 [[field | name: branch]]
 [[field | name: name]]
 [[field | name: birthday]]
 [[field | name: phone_mobile]]
 [[field | name: department]]
[[CONTAINER_END]]

В данном примере разбивается на две колонки ([[ROW]] — как одна строка воспринимается). Высота расчитается автоматически. Заголовок задан. Редактировать поля можно.
Также есть у поля full_name атрибут «lock». Запрещает удалять и редактировать поле с контейнера.

Если мы установим значение: [[CONTAINER | h:hide | column: 2 | height: auto | name: testName]], то заголовок уберется.

Если у контейнера стоит режим edit: true, тогда появляется возможность создавать, редактировать, удалять и добавлять поля.

editf1

При нажатии на справа вверху на иконку шестеренки, контейнер переводится в режим редактирования полей

editf2

Справа вверху две кнопки — Сохранить — изменения применяться только когда нажмешь эту кнопку, Отмена — обратно в режим просмотра

При редактировании у полей можно менять наименование и устанавливать флаг обязательности. Свои поля(списки) можно редактировать

Контейнер [[CONTAINER_INFO]]

1
#include // подключаем файл container.tpl все контейнеры системе

Свойства полей

  • header – заголовок
  • value – значение.
  • headerAppend – добавить к заголовку иконку
  • paneClass — Родительский класс. По умолчанию «auto» для autoresize height
  • color – один из предустановленных цветов theme
  • icon – иконка справа
  • id – ID атрибут, если нужно
  • h3 – Добавить класс к header
  • img – Url изображения вместо icon. Должно быть или одно или другое
  • rightText – Добавляет под иконку или картинку текст
  • counter:1 – Включает counterUp автоматически.

Так как по умолчанию все CONTAINER_INFO являются paneClass: auto для автоматического выравнивания по ширине. Если такие блоки последние или вы хотите отключить авто-ширину, то необходимо переопределить данное свойство либо как пустое, либо с параметрами:

[[CONTAINER_INFO | header: #L:total | value: $total$ | headerAppend: ruble icon | icon: icon-graph | counter: 1 | id: total | color: green-haze | paneClass: ]]

Использование img и rightText:

container info

Контейнер [[SPACE]]

1
#include // подключаем файл container.tpl все контейнеры системе

Контейнер пустышка. Вставляет пустой блок

. Обычно используется, когда хочется при расчете колонок вставить пробел.

Пример:

[[ROW| column:3]]
 [[field]]
 [[SPACE]]
 [[field]]
[[ROW_END]]

Таким образом Grid посчитает его как элементом и разобьет на col-md-4

Контейнер [[PIE_CHART]]

1
#include // подключаем файл container.tpl все контейнеры системе

Свойства полей

  • id – Идентификатор ID
  • title – Название
  • suffix – после числа в центре. По умолчанию %
  • percent
  • ht – class title
  • rotate
  • lineWidth
  • lineCap
  • scaleLength
  • scaleColor
  • trackColor
  • barColor
  • size

Пример:

[[PIE_CHART | percent: 14 | size: 75]]

Поля

Для вывода поля, достаточно написать [[field | name: name]]. В таком случае все настройки возьмутся с конфигуратора при этом все настройки поля вставятся автоматически. Для ручного управления, можно указать различные типы полей и их данные. [[field | type: text]] вызывает контейнер field и вставляет в .controls элемент [[field.text]]. Контейнер [[field.text]] можно вызвать отдельно.

[[field | name: full_name]] генерирует следующий html основной код:

//[[field]]
<div after="$after" $parentParams class="control-group  ui-row ui-custom-group input $type $parentClass if(!$size)col-md-12 m-b-10">
    <label class="control-label $lClass if(!$sizeLabel)col-md-4 col-lg-6 $required" $paramsLabel for="f_full_name">$addLabel Полное имя $appLabel</label>
    <div class="controls if(!$sizeControl)col-md-8 col-lg-6 $required" type-field="$typeField">
        //[[field.type]]
        <div class="field">
            <input type="text" access="$access" placeholder="$placeholder" class="if(!$size)input-xlarge  $types ui-control-input #cls" id="f_full_name" $required $disabled name="object_full_name" maxlength="$maxLength" value="$value" $params  $tags data-accept="$accept">
        </div>
    </div>
</div>

Параметры

  • after [text] — устанавливается атрибут after
  • parentParams [text] — устанавливается атрибуты в .control-group
  • parentClass [text] — устанавливается классы в .control-group
  • size [text] — задает свои классы в .control-group вместо базовых
  • lClass [text] -устанавливается классы в label
  • sizeLabel [text] — задает свои классы в label вместо базовых
  • paramsLabel [text] — задает атрибуты в label
  • addLabel [text] — вставляет данные перед текстом в label
  • appLabel [text] — вставляет данные после текста в label
  • sizeControl [text] — задает свои классы в .controls вместо базовых
  • type [text] — тип поля. Если не задан, то автоматически берется с конфигуратора
  • name — обязательное поле, задается имя поля
  • placeholder — задается placeholder поля
  • params — устанавливает атрибуты поля. В каждом типе по разному
  • tags — устанавливает атрибуты поля как и params. В некоторых компонентах удобнее params, а в некоторых tags
  • cls — устанавливает в class в большинство полей
  • style — устанавливает в style в большинство полей
  • disabled — устанавливает атрибут в disabled и в некоторых поля класс.
    Задавать надо так: [[field | disabled: disabled]]
  • required — задает валидатору формы — обязательное поле или нет.
    Задавать надо так: [[field | required: required-mode]]
  • auto — задает автоматическую высоту для textarea и html полям.
    Задавать надо так: [[field | auto: 1]]
  • maxLength — устанавливает maxlength атрибут в большинство полей
  • icon — устанавливается иконка на некоторых полях. Иконка устанавливается в формате fontawesome 4
  • decal — количество знаков после запятой и устанавливается для numeric полей.
  • accept — устанавливается атрибут data-accept на некоторые поля. Применяется для смены subSelect и lookup. Используется для дочерних элементов.
  • loadData — устанавливается для subSelect и lookup полей. Для Ajax загрузки указывает какие поля загружать через запятую
  • master — устанавливается для subSelect полей. Указывается поле, за которым нужно следить при изменении и при необходимости изменять данные
  • owner — устанавливается для subSelect полей. Указывается атрибут owner
  • val — устанавливает val в зависимости от типа поля
  • value — устанавливает value в зависимости от типа поля
  • field [name]— устанавливается для pointers полей и указывает как поел брать. Например name
  • prefix [object]— Префикс для имени полей
  • lock [bool]— Блокирует изменение поля в режиме редактирования
  • lookup — Указывается форма select. Только для lookup полей
  • lookupLink — Указывается ссылка выбранного элемента без id. Только для lookup полей
  • addurl — дополнительные параметры, которые добавляются в url select lookup modal. Только для lookup полей
  • checkFirstName — Добавляется к первому hidden полю в имени. Используется только для checkbox

Типы полей

Текстовые поля

1
[[field | name: name | type: text]]

field_text

1
[[field | name: email | type: email]]

field_text_email

1
[[field | name: icq | type: icq]]

field_text_icq

1
[[field | name: skype| type: skype]]

field_text_skype

1
[[field | name: phone| type: phone]]

field_text_phone

1
[[field | name: color| type: color]]

field_text_color

1
[[field | name: url| type: url]]

field_text_url

1
[[field | name: description| type: textarea]]

field_text_textarea

1
[[field | name: description| type: html]]

field_text_html

Числовые поля
Все числовые типы одинаковые, за исключением количества знаков после точки или запятой

1
[[field | name: name | type: number]]

field_number

Вот так можно переопределить поле и добавить своих валидаторов

Правило валидаторов описано в документации semantic-ui

1
[[field | name: name | maxLength: 3 | cls: ui-custom ui-integer | tags: validator-rules="integer[0..100]" validator-prompt="Значение должно быть от 0-100"]]

field_number_integer_100

Поля даты и времени

1
[[field | name: name | type: date]]

field_date

1
[[field | name: name | type: datetime]]

field_datetime

field_datetime1
field_datetime2
1
[[field | name: name | type: time]]

field_time

Поле checkbox

1
[[field | name: filter | type: checkbox]]

field_checkbox

Выпадающий список
Обычно по умолчанию выставляется у pointer, delayed, blind. Каждое такое поле имеет поиск

1
[[field | name: status | type: select]]

field_dropdown

Поле списка, зависящее от поля выбора

1
[[field | type: subSelect | master: owner | name: company_details]]

В поле master указываем поле выбора.

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

1
[[field | name: phone | accept: : company_details.phone]]

и в поле «Телефон» автоматически «подгрузятся» информация о телефоне выбранного «Юридического лица».

Поле выбора (Lookup field)
Обычно по умолчанию выставляется у pointer, delayed, blind. Каждое такое поле имеет поиск

1
[[field | name: employee | type: lookup | lookupLink: employees | addurl: owner=2&group_id=3 ]]

field_lookup

При клике на имени — в новом окне откроется lookupLink
При клике на многоточие — откроется модальное окно выбора по ссылке lookup/id/addurl

Поле, зависящее от поля Lookup

1
2
3
4
//lookup fields
[[field | name: address | loadData: hours,city,address,phone]]
//Обычное поле принимающее значение [phone], если до этого было пустое от address
[[field | name: address_phone | accept: address.phone]]

Табличные части

Таблицы в системе есть двух типов — Общая(выводится в формах list, select) и Динамическая (выводится в edit forms)

Таблица статическая

1
2
3
4
5
6
7
8
9
10
11
12
13
//name указывается как и в php
 
[[table | name: form]]
    [[column | table: form | name: date_start | width: 5% | tags:  nowrap center]]
    [[column | table: form | name: name | width: 20% | type: link | path: /task]]
    [[column | table: form | name: owner | width: 20% | type: link | path: /companies | align: left| tags:  nowrap]]
    [[column | table: form | name: status | align: center| width: 7% ]]   
    [[column | table: form | name: responsible | align: center | width: 15% ]]
    [[column | table: form | name: author | align: center | width: 15% ]]
    [[edit | table: form | path: /task]]
    [[delete | table: form]]
    [[restore | table: form]]
    [[wipe | table: form]]

В name пишется имя табличной части по которому можно будет обратится из php скрипта.
ID может понадобиться для динамического(JS) изменения таблицы, в key указывается поле, которое будет использоваться, как ключ для полей для использования при динамическом изменении.

Затем указываются столбцы:

1
[[column | table: products | name: product | width: 50% ]]

в table указывается имя таблицы к которой принадлежит столбец
В header указывается наименование шапки столбца, если не указан, то берется автоматически
Вот так выглядят кнопки на таблицу. Указывать нужно все. система сама автоматически вставит что нужно.

1
2
3
4
    [[edit | table: form | path: /task]]
    [[delete | table: form]]
    [[restore | table: form]]
    [[wipe | table: form]]

Вот так выглядит данный шаблон в программе:
table_list

Таблица динамическая

В Edit формах можно использовать динамические таблицы

Кнопки

Шаблонов кнопок не так много в системе, как полей. Однако вы можете использовать следующие шаблоны

[[save]] – создает кнопку «Сохранить»

buttonsave

У кнопок существует целая палитра цветов. Их вы найдете в библиотеки цветов.

Закладки

Вкладки представляют собой следующие элементы формы:
tabs

По сути — это простые ссылки на формы списков или редактирования «Объектов»

Для того чтобы объявить в шаблоне закладки необходимо сделать следующее:
Базовый шаблон Tab находится в base/tabs.tpl. При необходимости можно подключить через #include

В PHP-скрипте написать конструкцию вида:

1
$this->printTabs("Договор",["/companies/22/status_change/","Хронология событий"]);

То есть Вы передаете аргументы функции, если вкладка сейчас «Активна», то она идет без ссылки. Если же это не активная «Вкладка», то передаете массив, в котором первым аргументом указывается «ссылка», а вторым — «Название вкладки».

Работа с блоками

Хранение шаблонов

Директория для хранения шаблонов на сервере: /{PROJECT}/templates/.
Шаблоны хранятся в файлах с расширением «.tpl».
Шаблоны могут иметь иерархические названия, например companies/orders/edit.

При определении пути шаблона применяются следующие правила:

  • В пути к шаблонам с иерархическими названиями каждый шаг иерархии, кроме последнего, соответствует названию папки. Последний — названию файла. Пример: companies/orders/edit загружается из /{PROJECT}/templates/companies/orders/edit.tpl. При создании шаблонов из «Конфигуратора» пути формируются автоматически.
  • <Базовые шаблоны, не подчиненные иерархии, хранятся в директории: /{PROJECT}/templates/base/. Например, изменив их можно поменять форму отображения «поля», «таблицы», «кнопок» и т. д. Доступ к этим шаблонам из «Конфигуратора» программы отсутствует.

Вызов шаблонов

Шаблоны отправляются на «парсинг» методом display($template) класса Kernel\Http\Page (экземпляр которого хранится в $this->page).

Вызвать шаблон /{PROJECT}/templates/companies/list.tpl

1
$this-&gt;page-&gt;display("companies/list");

В одном сценарии можно вызывать любое количество шаблонов. Шаблоны добавляются друг за другом. Переменные и блоки передаются всем отображенным на момент вызова соответствующих функций шаблонам.

Описание шаблонов

Шаблоны представляют с собой HTML-разметку совмещенную с понятным для парсера шаблонным синтаксисом. Описанию этого синтаксиса посвящен данный раздел.

Блоки

Система блоков — основа шаблонизации. Блоком называется некоторая совокупность последовательного HTML-кода. Блоки могут быть вложенными (содержать другие блоки).

Система блоков выполняет следующие задачи:

  • Сокрытие и отображение определенных частей шаблона (определенных блоков). Все блоки по умолчанию скрыты (за исключением отмеченных специальными флагами, см. ниже). Другими словами, блоки вносят в шаблон древовидную иерархию.
  • Повторное отображение частей шаблона с иными параметрами и значениями. К примеру, при отображение списка на представление элемента может отводиться только один блок.
  • Изменение содержимого одних частей шаблона (точнее, его вывода) из других. То есть, поддержка нелинейности построения документа.
  • Структуризация шаблона (или набора шаблонов)
Базовый синтаксис

Блок обозначается своим названием в фигурных скобках. Блок должен быть ограничен открывающим и закрывающим тегами (закрывающий дополнительно отмечается символом «/» перед названием).
Тег блока всегда должен занимать отдельную строку.

Text 1

{BLOCK} ##начало блока

Text 2

Text 3

{/BLOCK} ##конец блока

Text 4

По умолчанию блоки скрыты. Другими словами, отображение шаблона выше выведет:


Text 1
Text 4

Чтобы сделать блок видимым, необходимо вызвать метод:

1
$this-&gt;page-&gt;block($blockName, $params = [])

$blockName — название блока
$params — переменные (см. ниже)

Например:

1
$this-&gt;page-&gt;block("BLOCK"); //Значение второго параметра см. ниже

Результат:


Text 1
Text 2
Text 3
Text 4

Повторный вызов выведет блок несколько раз подряд. (1, 2, 3, 2, 3, 2, 3 …, 4).

Блочные переменные

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

Отправленные приветствия:

{GREATING}

$date: Здравствуйте, $name$.

{/GREATING} Вернуться назад

Для передачи значения в блок используется второй аргумент метода block($blockName, $params = []) — ассоциативный массив, в котором ключ — название переменной, а значение — соответственно, значение.

1
$this-&gt;page-&gt;block("GREATING", ["date" =&gt; "18:20", "name" =&gt; "Августина Арчибальдовна"]);

Это выведет:

Отправленные приветствия:
18:20: Здравствуйте, Августина Арчибальдовна.

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

1
2
3
4
5
6
7
8
$this-&gt;page-&gt;block("GREATING", ["date" =&gt; date("H:i:s"),
                                "name" =&gt; "Августина Арчибальдовна"]);
 
$this-&gt;page-&gt;block("GREATING", ["date" =&gt; date("H:i:s", time() + 3600),
                                "name" =&gt; "Константин Игоревич"]);
 
$this-&gt;page-&gt;block("GREATING", ["date" =&gt; date("H:i:s", time() + 7200),
                                "name" =&gt; "Матильда Карловна"]);

Результат:

Отправленные приветствия:

17:25:15: Здравствуйте, Августина Арчибальдовна.
18:25:15: Здравствуйте, Константин Игоревич.
19:25:15: Здравствуйте, Матильда Карловна.

Вложенные блоки

Блоки могут быть вложены друг в друга. Имена блоков и переменных в нем при этом становятся иерархическими (иерархия отображает вложенность блоков). Для разделения используется точка (.).

Например, «Список сотрудников»:

1
{DEPARTMENT}
$name: {EMPLOYEE}

$name

{/EMPLOYEE} ===

{/DEPARTMENT}

У каждого блока свои пространства имен.

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

1
2
3
4
5
$this-&gt;page-&gt;block("DEPARTMENT", ["name" =&gt; "Отдел продаж"]);
$this-&gt;page-&gt;block("DEPARTMENT.EMPLOYEE", ["name" =&gt; "Виктория"]);
$this-&gt;page-&gt;block("DEPARTMENT.EMPLOYEE", ["name" =&gt; "Оксана"]);
$this-&gt;page-&gt;block("DEPARTMENT", ["name" =&gt; "IT отдел"]);
$this-&gt;page-&gt;block("DEPARTMENT.EMPLOYEE", ["name" =&gt; "Василий"]);

Вывод:

Список сотрудников:
Отдел продаж:
Виктория
Оксана
IT отдел:
Василий

Флаги

Блок может иметь один или несколько флагов. Флаги модифицируют поведение блока и/или его внутренние элементы.
Флаги указываются через пробел после названия блока в открывающем теге. В закрывающем теге флаги не указываются.

Флаги «show» и «invert»
Эти флаги модифицируют отображение блока.
Блок, отмеченный флагом show, отображается всегда.

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

Text 1

{BLOCK show}

Text 2: $variable

{/BLOCK}

Обе строки будут выведены, однако переменная будет иметь название BLOCK.variable и задаваться через set-синтаксис (см. ниже).
Флаг invert работает по тому же принципе, однако вызов метода block для него скроет блок (другими словами, вызовет обратное относительно обычного блока, поведение.

Флаги «prepend» и «append»
Блоки с такими флагами не являются полноценными блоками. Они могут задаваться только после одноименного блока без флага и просто добавляют к нему HTML-код: в начало (prepend) или в конец (append).

Добавленный код считается полноценной частью исходного блока.

1
2
3
4
5
6
7
8
9
10
11
12
Текст письма:
 
{LETTER}
Поздравляем, вы допущены до участия в нашем проекте.
{/LETTER}
{LETTER prepend}
Многоуважаемый $name!
{/LETTER}
{LETTER append}
 
Желаем удачи!
{/LETTER}$this-&gt;page-&gt;block("LETTER", ["name" =&gt; "Сергей"]);


Текст письма:

Многоуважаемый Сергей!
Поздравляем, вы допущены до участия в нашем проекте.
Желаем удачи!

Флаг «reorderable»

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

Пример шаблона:

1
{HEADS}
Орел!

{/HEADS} {TAILS}

Решка!

{/TAILS}

Пример PHP-сценария:

1
2
3
4
$this-&gt;page-&gt;block("HEADS");
$this-&gt;page-&gt;block("TAILS");
$this-&gt;page-&gt;block("TAILS");
$this-&gt;page-&gt;block("HEADS");

Выведет (вне зависимости от порядка обращений к методу block):


Орел!
Орел!
Решка!
Решка!

Это не всегда удобно (например, при отображение активных и неактивных пунктов меню).
Чтобы изменить это поведение, необходимо поместить блоки в родительский блок с флагом reorderable.

Блоки, вложенные в reorderable, отображаются в порядке вызова.

1
2
{FLIPS reorderable}
{HEADS}
Орел!

{/HEADS} {TAILS}

Решка!

{/TAILS} {/FLIPS}

Обратите внимание, название теперь отражает иерархию:

1
2
3
4
$this-&gt;page-&gt;block("FLIPS.HEADS");
$this-&gt;page-&gt;block("FLIPS.TAILS");
$this-&gt;page-&gt;block("FLIPS.TAILS");
$this-&gt;page-&gt;block("FLIPS.HEADS");

Выведет:


Орел!
Решка!
Решка!
Орел!

Флаг «static»

Статический блок — это шаблон внутри шаблона. Он недоступен для метода block, однако может быть вызван из любого места шаблона с использованием особого синтаксиса: названия блока, заключенного в двойные квадратные скобки. Например, [[SEPARATOR]].

1
2
3
{SEPARATOR static}
===
{/SEPARATOR}

Пример:

1
2
3
4
Позиция 1
Позиция 2
[[SEPARATOR]]
Позиция 3

Выведет:

Позиция 1
Позиция 2
===
Позиция 3

В статический блок можно передавать параметры. Параметры отделяются символом «|» и вводятся в порядке {КЛЮЧ}:{ЗНАЧЕНИЕ}. Внутри статического блока параметры обозначаются символом «#» со следующим за ним названием параметра. Названия параметров могут содержать только буквы.

1
2
3
4
5
6
7
{ITEM static}
Название: #name
Цена: #price руб.
 
{/ITEM}
[[ITEM | name: Пылесос Koshiba | price: 10 000]]
[[ITEM | name: Видеокамера Hamsung | price: 55 700]]

Выведет:


Название: Пылесос Koshiba
Цена: 10 000 руб.

Название: Видеокамера Hamsung
Цена: 55 700 руб.

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

Переменные

Из «PHP-сценария» можно передать переменные в «Шаблон». Переменные обозначаются при помощи символа $ (для переменных препарсинга внутри статического блока — #).

Присваивание переменных внутри блока происходит через синтаксис метода block. Этот метод, однако, не может быть применен к переменным вне каких-либо блоков, а также к переменным внутри блока с флагом show. Для таких случаев используется метод setобъекта $this->page внутри сценария.
Синтаксис параметра метода set полностью соответствует синтаксису второго параметра метода block (учтите иерархичность названия для переменных внутри блоков).

1
2
3
4
5
6
7
8
9
$var1
{BLOCK}
$var2
{/BLOCK}
{OTHER_BLOCK show}
$var3
{/OTHER_BLOCK}$this-&gt;page-&gt;block("BLOCK", ["var2" =&gt; 2]);
$this-&gt;page-&gt;set(["var1" =&gt; 1,
                  "OTHER_BLOCK.var3" =&gt; 3]);
Значение по умолчанию

Можно задавать переменным значение по-умолчанию. Для обычных переменных оно заключается в символы «~» сразу после название переменной. Для переменной препарсинга — в символы «*».

Пример шаблона:

1
2
3
4
5
6
7
8
{BLOCK}
Значение — $value~не определено~.
{/BLOCK}
{STATIC_BLOCK static}
Название: #name*неизвестно*.
{/STATIC_BLOCK}
[[STATIC_BLOCK | name: <strong>Песня про зайцев</strong>]]
[[STATIC_BLOCK]]$this-&gt;page-&gt;block("BLOCK");

Пример скрипта:

1
$this-&gt;page-&gt;block("BLOCK", ["value" =&gt; "42"]);

Вывод:


Значение — не определено.
Значение — 42.
Название: Песня про зайцев.
Название: неизвестно.

Шаблон отображения значения

Для переменных можно также указывать шаблон, в который подставляется значение переменной, в случае, если оно задано (не пусто) и является или может быть преобразовано к истине. Шаблон указывается сразу после названия переменной, заключается в символы «^^». Место в шаблоне, куда необходимо подставить переменную, обозначается символом «%».

Пример шаблона:

1
2
3
4
5
6
7
8
{ITEM}
Название: $name
$frequency^Частота: %GHz
^
$size^Размер: %Gb
^
===
{/ITEM}

Пример скрипта:

1
2
3
4
$this-&gt;page-&gt;block("ITEM", ["name" =&gt; "Intel Core i7",
                            "freq" =&gt; "3.40"]);
$this-&gt;page-&gt;block("ITEM", ["name" =&gt; "Seagate ST500",
                            "size" =&gt; "500"]);

Вывод:

Название: Intel Core i7
Частота: 3.40GHz
===
Название: Seagate ST500
Размер: 500Gb
===

Подключение вложенных шаблонов

Шаблоны можно вкладывать друг в друга средствами синтаксиса #include <{ИМЯ}>. Вложение равноценную повторному вызову display с точки зрения присваивания переменных и вывода блоков, однако имеет ряд преимуществ, таких как возможность вкладывать шаблоны внутрь блоков, порождая новые витки иерархии.

Примеры:

1
2
3
4
5
6
7
8
9
10
11
12
//файл "template1.tpl" 
Содержимое подключенного файла
 
 
 
//файл @template2.tpl"
{BLOCK}
Содержимое подключенного блока
{/BLOCK}
 
 
//файл template.tpl
1
2
3
4
5
#include 
{PARENT show}
Содержимое основного файла
#include 
{/PARENT}

Сценарий PHP:

1
2
$this->page->display("template");
$this->page>block("PARENT.BLOCK"); //Важно! Вложенные подключенные блоки

Вывод:
— Содержимое подключенного файла
— Содержимое основного файла
— Содержимое подключенного блока

Языковые константы

Языковые параметры подставляются на этапе препарсинга и вводятся при помощи конструкции #L:{ИМЯ}. По-умолчанию, для шаблона выбирается языковой файл, путь которого совпадает с путем до шаблона (но, разумеется, в иерархии иного типа). Если файл отсутствует, берется следующий в списке и так далее.

Языковые переменные находятся вне иерархий блоков.

Пример использования:

1
2
3
4
#L:PageTitle
{BLOCK}
#L:SomeWord
{/BLOCK}
Комментарии

В любое место шаблона можно добавить комментарий. Комментарии вводятся при помощи символов ## и не отображаются в HTML-выводе (этим и отличаясь от HTML-комментариев).
Комментарий может быть использован в любом месте кода, даже на одной строке с объявлением блоков. Комментировать можно также вывод столбцов в таблице или полей на форме.

Пример формы:

1
2
3
4
#include  ##Подключаем шаблон
{MAIN} ##Основной блок
... ##Просто текст
{/MAIN}
Стили (CSS)

В системе используются стандартные шаблоны оформления CSS на основе Bootstrap.

Подробнее: http://twitter.github.com/bootstrap/

Последние правки: 21.01.2019 14:55:24