ComStarter включает в себя два типа компонетнов:
Стандартные компоненты, присутствующие в ComStarter:
Класс: CS_comAccordion
Описание:
Отображает разворачивающийся контейнер для набора именнованного содержимого, работающий по принципу "аккордиона",
т.е. когда разворачивается один раздел, все остальные - сворачиваются. Развёрнутый в данный момент элемент сохраняется в хэше адресной строки.
Конфигурационные параметры:
Имя параметра | Описание |
---|---|
id | Обязательный параметр. Должен иметь уникальное значение. Служит для идентификации компонента среди прочих на странице. |
parts | Строковое представление отображаемых контейнером разделов, записываемое в следующем виде: [заголовок]|[имя шаблона],[заголовок]|[имя шаблона],... При этом заголовок может быть ключом перевода в случае поддержки многоязычности. Имя шаблона указывается относительно каталога app/views/ и может содержать поддиректории. |
divider | Определяет знак-разделитель между разделами, используемый в parts. По умолчанию - запятая. |
Пример использования в шаблоне:
<com:Accordion id="my_id" parts="Title1|view1; Title2|view2" divider=";"/>Результат:
Класс: CS_comAlert
Описание:
Универсальный компонент для отображения на странице информационных сообщений разного характера.
Конфигурационные параметры:
Имя параметра | Описание |
---|---|
text | Основной текст выводимого сообщения. |
title | Заголовок сообщения. Может отсутствовать. |
content | Если указано, то в качестве содержимого используется отдельный файл шаблона с данным именем. В этом случае параметры text и title игнорируются. |
style | Стиль оформления. Может принимать одно из следующих значений: 'success','info', 'warning', 'danger'. По умолчанию, info. |
dismissible | Если 'true', то сообщение может быть скрыто пользователем. |
sign | Название значка из набора glyphicons для отображения рядом с сообщением. По умолчанию отстуствует. |
Пример использования в шаблоне:
<com:Alert text="Example message is displayed successfully." title="Test message" style="success" dismissible="true" sign="flash"/>Результат:
Класс: CS_comBase
Описание:
Базовый компонент, предок всех компонентов фреймворка. Напрямую не используется. Имеет ряд методов и свойств, используемых всеми дочерними компонентами. См. Созднание собственных компонентов.
Конфигурационные параметры:
Имя параметра | Описание |
---|---|
config | Конфигурационный ini-файл с настройками компонента. Любой компонент может определять свои конфигурационные параметры (все либо часть) из специального файла, имя которого указано в этом параметре. Это удобно в случае идентичных настроек для целого ряда компонентов в проекте. |
id | Идентификатор компонента. Обязателен, если свойство $requiresId установлено в true. |
Класс: CS_comBasePage
Описание:
Базовый компонент для отображения web-страницы. Предок всех компонентов-контроллеров, чьи методы вызываются роутером напрямую.
Конфигурационные параметры: Как правило задаются через методы-сеттеры в коде контроллера либо через конфигурационные ini-файлы (в отличие от компонентов-блоков).
Имя параметра | Описание |
---|---|
pagetitle | Заголовок страницы, отображаемый браузером. |
description | Описание страницы для одноимённого мета-тега. |
keywords | Ключевые слова, предназначенные для одноимённого мета-тега. |
bootstrap | Выбранный стиль оформления для Bootstrap. Возможны любые значения, формирующие имя файла, хранящегося в папке css и начинающегося на 'bootstrap.min.', по умолчанию 'default'. |
css | Имена пользовательских css файлов, подключаемых к данной странице (через запятую). |
js | Имена пользовательских js файлов, подключаемых к данной странице (через запятую). |
content | Содержание страницы. Как правило, это имя шаблона, в котором хранится вся необходимая разметка. |
Пример использования:
В файле routes.ini:
GET @index: / = comMainPage->indexВ файле класса comMainPage, который наследуется от CS_comBasePage:
public function index($f3, $params) { $this->config('page_config'); // page_config.ini для установки вышеперечисленных параметров $this->setTitle('Простая страница'); $this->setContent('view1'); // имя шаблона для отображения $this->echoView(); // парсит и отображает страницу, все локальные компоненты-блоки создаются и отрисовываются здесь! }
Класс: CS_comColumn
Описание:
Компонент, помогающий сформировать структуру web-страницы, и представляющий собой колонку-контейнер с произвольным содержимым.
В основе данного компонента лежит div-контейнер с сеточными классами Bootstrap.
Конфигурационные параметры:
Имя параметра | Описание |
---|---|
width | Ширина колонки от 1 до 12, где 12 означает максимально допустимую ширину. При необходимости через запятую можно указать до 4-х различных величин, чтобы при разных размерах окна браузера использовать различную ширину данной колонки (указываается в следующем порядке: XS, SM, MD, LG) |
offset | Отступ колонки слева. Как и ширина может принимать значения от 1 до 12 и содержать до 4 величин (по тому же принципу). Для получения более подробной информации о данной методологии разметки см. официальную документацию по Bootstrap 3. |
class | Дополнительные пользовательские css-классы, применяемые к контейнеру (через пробел). |
content | Если указано, то в качестве содержимого колонки используется отдельный файл шаблона с данным именем. Альтернативный способ задать содержимое контейнера - указать его в теле тега компонента (см. пример ниже). |
Пример использования в шаблоне:
<div class="row"> <com:Column width="12" class="green text-justify"> Произвольный контент, здесь вы также можете размещать другие компоненты и использовать различные возможности шаблонизатора. </com:Column> </div> <div class="row"> <com:Column content="viewForColumn1" width="12,6,5,4" offset="0"/> <com:Column content="viewForColumn2" width="12,6,5,4" offset="0,0,2,4"/> </div>Результат:
Класс: CS_comHead
Описание:
Универсальный компонент для отображения содержимого блока head.
Используется практически всеми web-страницами.
Конфигурационные параметры: Как правило, задаются непосредственно в параметрах тега-компонента, либо через конфигурационные ini-файлы.
Имя параметра | Описание |
---|---|
pagetitle | Заголовок страницы, отображаемый браузером. |
description | Описание страницы для одноимённого мета-тега. |
keywords | Ключевые слова, предназначенные для одноимённого мета-тега. |
bootstrap | Выбранный стиль оформления для Bootstrap. Возможны любые значения, формирующие имя файла, хранящегося в папке css и начинающегося на 'bootstrap.min.', по умолчанию 'default'. |
css | Имена пользовательских css файлов, подключаемых к данной странице (через запятую). |
js | Имена пользовательских js файлов, подключаемых к данной странице (через запятую). |
Пример использования в шаблоне:
<com:Head pagetitle="Заголовок" description="О странице" keywords="ключевые слова" bootstrap="cosmo" css="my_style.css" js="file1.js,file2.js"/>Результат: В результате добавления данного тега после <html> и перед <body> в DOM будет добавлен блок head со всем необходимым содержимым: страница получит в строке браузера имя "Заголовок", описание "О странице", "ключевые слова", будет применён стиль bootstrap.min.cosmo.css и пользовательский стиль my_style.css, а также выполнены скрипты file1.js и file2.js.
The framework architecture List of topics Creating new components