ComStarter включает в себя два типа компонетнов:

  • Компоненты-контроллеры - это компоненты, которые занимаются непосредственным отображением web-страниц и обработкой HTTP-запросов. Они все наследуются от компонента BasePage. Обычно роутер напрямую передаёт управление методам таких компонентов для отображения web-страниц целиком.
  • Компоненты-блоки - это "локальные" визуальные компоненты, которые добавляются в проект с помощью специальных тегов. Это большие и малые кирпичики, которые формируют облик и функционал вашего проекта. Именно они представляют наибольший интерес.

Стандартные компоненты, присутствующие в ComStarter:

Класс: CS_comAccordion

Описание:
Отображает разворачивающийся контейнер для набора именнованного содержимого, работающий по принципу "аккордиона", т.е. когда разворачивается один раздел, все остальные - сворачиваются. Развёрнутый в данный момент элемент сохраняется в хэше адресной строки.

Конфигурационные параметры:
Имя параметра Описание
id Обязательный параметр. Должен иметь уникальное значение. Служит для идентификации компонента среди прочих на странице.
parts Строковое представление отображаемых контейнером разделов, записываемое в следующем виде:
[заголовок]|[имя шаблона],[заголовок]|[имя шаблона],...
При этом заголовок может быть ключом перевода в случае поддержки многоязычности. Имя шаблона указывается относительно каталога app/views/ и может содержать поддиректории.
divider Определяет знак-разделитель между разделами, используемый в parts. По умолчанию - запятая.

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

<com:Accordion id="my_id" parts="Title1|view1; Title2|view2" divider=";"/>
Результат:
view1.html
view2.html

Класс: 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>
Результат:
Контейнер на всю ширину с произвольным контентом, здесь вы также можете размещать другие компоненты и использовать различные возможности шаблонизатора. Попробуйте поменять размеры окна браузера и понаблюдайте, как меняется взаимное расположение колонок ниже друг относительно друга.
viewForColumn1.html
viewForColumn2.html

Документация по данному разделу находится в разработке...
Документация по данному разделу находится в разработке...

Класс: 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

© 2024 ComStarter. Все права защищены.