Pull to refresh

xtDojoPlugin. Объединяем dojo с symfony framework

Reading time6 min
Views548
Здравствуй, %username%.

symfony + dojo = ?

Разрешите представить вам xtDojoPlugin для symfony framework версии 1.2 и выше. Плагин позволяет использовать возможности dojo в любом проекте, написанном на symfony framework. Идея создания этого плагина пришла после того как, найденные решения на сайте symfony не удовлетворили моих требований. На официальном сайте было найдено два плагина dgDojoPlugin и sfDojoPlugin.

Давайте кратко рассмотрим возможности имеющихся решений.

Начнем с dgDojoPlugin. Данный плагин меня не устроил по ряду причин, но основная, это использование хелперов и классов для вывода виджетов. С одной стороны это конечно может показаться удобным, не надо запоминать кучу атрибутов dojo, но с другой стороны в шаблонах получится слишком много PHP кода, что не всегда хорошо. Например вот такой получится код для того чтобы вывести BorderContainer и два ContentPane.
  1. <?php echo dojo_border( array( 'design' => 'headline', 'liveSplitters' => 'true' ) ) ?>
  2.     <?php echo dojo_content_pane( 'The Title', array( 'region' => 'top', 'minSize' => 50, 'splitter' => 'true', 'style' => 'height: 50px;' ) ) ?>
  3.         <h1>I'm content!</h1>
  4.     </div>
  5.     <?php echo dojo_content_pane( 'Another Pane', array( 'region' => 'center' ) ) ?>
  6.         <h1>I'm more content!</h1>
  7.     </div>
  8. </div>

Думаю многие согласятся, что скажем дизайнеру будет довольно сложно разбираться в таких шаблонах.

Перейдем к sfDojoPlugin. Этот плагин скажем относительно меня порадовал. В нем было несколько составляющих: фильтр для автоматического подключения и версионирования JS и CSS, консольные таски для выполнения определенных манипуляций с плагином через консоль и пара классов отвечающих за поведение dojo. К сожалению этого было недостаточно. Для примера приведу тот же самый участок кода, что и для плагина выше.
  1. <div dojotype="dijit.layout.BorderContainer" design="headline" liveSplitters="true">
  2.     <div dojoType="dijit.layout.ContentPane" title="The Title" region="top" minSize="50" splitter="true" style="height:50px;">
  3.         <h1>I'm content!</h1>
  4.     </div>
  5.     <div dojoType="dijit.layout.ContentPane" title="Another Pane" region="center">
  6.         <h1>I'm more content!</h1>
  7.     </div>
  8. </div>

С таким кодом верстальщику уже будет проще разобраться. Но по моему это тоже не очень правильное решение.

Таким образом не найдя ничего подходящего для себя (не буду спорить, может быть я плохо искал), было решено писать свой плагин удовлетворяющий всем требованиям. Были поставлены следующие ключевые цели. Итак, плагин должен:
  • уметь инициализировать начальную структуру директорий для своих нужд из консоли
  • иметь возможность компилировать dojo JS с нужными параметрами
  • автоматически встраиваться в нужные шаблоны и самостоятельно подключать нужные JS и CSS
  • иметь возможность работать в DEV и PROD режиме
  • уметь работать с шаблонами без/с использованием спец. атрибутов dojo

После установки всех целей и желаний, началась работа над плагином, которая к данному времени уже практически подошла к концу. Плагин проходит последние тестовые проверки, чтоб в скором времени предстать перед публикой. Все цели были полностью или частично реализованы. Код разделен на несколько функциональных блоков, это блоки настроек(config), обработчика(handler), заданий(task), фильтра(filter) и вспомогательных классов. Рассмотрим все более детально.
  1. Блок настроек — это основной конфигурационный файл, где указываются все пути к dojo JS файлам, а так же некоторые дополнительные параметры
  2. Блок обработчика — заключает в себе класс, предназначенный для обработки dojo.yml файлов, которые описывают виджеты и осуществляют привязку виджетов к элементам шаблона. Подробнее данный функционал будет описан ниже.
  3. Блок заданий — команды выполняющиеся через symfony cli. В данное время доступны две команды с минимумом параметров. Первая это symfony dojo:init инициализирует начальную структуру директорий и создает необходимые файлы. В будущем планируется удаленное получение исходных кодов dojo и распаковка их в нужную папку, на данном этапе делать это приходится вручную. Вторая команда symfony dojo:build отвечает за компилирование dojo JS для использования их в продакшине. На данном этапе для этой команды никаких параметров недоступно, все прописано вручную. В следующих версиях этот функционал будет развиваться
  4. Блок фильтра — обеспечивает автоматическое подключение всех нужных dojo файлов, вызывает обработчик и выбирает данные нужные для отображения страницы
  5. Вспомогательные классы выполняют сервисные функции для корректной работы плагина

Благодаря обработчику и фильтру удалось добиться чистого кода в шаблонах и вынести все описания элементов и виджетов в отдельный dojo.yml файл. Для правильно работы плагина необходим один основной dojo.yml в директории config приложения symfony и в зависимости от надобности в папках модулей, которые могут находиться как в папке с приложением, так и в папках других плагинов.
Основной файл dojo.yml имеет следующую структуру:
  1. # <project_dir>/apps/<app_name>/config/dojo.yml
  2. default: # идентификатор, указывающий на основную структуру документа
  3.   theme: # блок настроек связанный с темой dojo
  4.     name: 'dojo theme' # наименование темы используемой для отображения
  5.     css:  ['css_file', 'another_css_file'] # необязательный элемент указывающей дополнительные css файлы требуемые для dojo
  6.   actions: # блок настроек акшинов в которых будут использоваться блоки dijit'ов
  7.     all: [group_name, another_group_name] # обязательный элемент указывающий какие блоки будут присутствовать во всех экшинах
  8.     action_name: [group_name] # группы dijit'ов которые будут использоваться строго в определенном акшине
  9.   dijits: # блок настроек групп dijit'ов
  10.     group_name: # наименование группы dijit'ов
  11.       block_id: {dojotype: 'нужный dojoType'} # связка ID блока в шаблоне и аттрибутов
  12.       another_block_id: {dojotype: 'нужный dojoType'} # связка ID блока в шаблоне и аттрибутов
  13.     another_group_name: # наименование группы dijit'ов

Дополнительный dojo.yml используется для определения структуры меняющейся от модуля к модулю и имеет следующую структуру:
  1. # <project_dir>/apps/<app_name>/modules/<module_name>/config/dojo.yml
  2. default: # аналогично основному файлу используется для переопределения описания документа, не обязателен
  3. all: # аналогично блоку default, отсутствует блок управления темой. конфигурация из этого блока добавляется к основному не переопределяя его.

Таким образом, используя такой способ определения структуры, мы избавляемся от надобности писать dojo атрибуты в шаблонах и код, приводимый мной выше, будет выглядеть так:
  1. <div id="borderConteiner">
  2.     <div id="topPane" title="The Title">
  3.         <h1>I'm content!</h1>
  4.     </div>
  5.     <div id="centerPane">
  6.         <h1>I'm more content!</h1>
  7.     </div>
  8. </div>

и потребуется следующее определение в dojo.yml файле:
  1. default:
  2.   theme: 'tundra'
  3.   actions:
  4.     all: ['layout']
  5.   dijits:
  6.     layout:
  7.       borderConteiner: {dojoType: 'dijit.layout.BorderContainer', design: 'headline', liveSplitters: 'true'}
  8.       topPane: {dojoType: 'dijit.layout.ContentPane', region: 'top', minSize: '50', splitter: 'true', style: 'height:50px'}
  9.       centerPane: {dojoType: 'dijit.layout.ContentPane', region: 'center', title: 'Another Pane'}

К сожалению, это решение не избавляет полностью от атрибутов dojo в шаблонах. Бывают моменты, например с динамическим кодом, где на данном этапе приходится использовать обычное определение, но думаю, в будущем мы сможем решить и этот вопрос. Что касается производительности данного решения, субъективно оно на достаточно высоком уровне, скоро плагин будет доступен общественности и любой желающий сможет оценить преимущества и недостатки самостоятельно.

Вместо заключения: В течение пары дней будет подготовлен, так скажем релизный вариант плагина, будет почищен и слегка оптимизирован код. После чего плагин можно будет попробовать. Изначально планирует поместить его на github.com, чуть позже он будет доступен через репозитарий symfony.

UPD:
Для ознакомления плагин доступен на github.com
Смотреть плагин
UPD2:
так же теперь плагин доступен с сайта symfony
xtDojoPlugin

Спасибо за внимание.
Tags:
Hubs:
Total votes 2: ↑0 and ↓2-2
Comments2

Articles