Это старая версия AltLinux/Sisyphus/Alterator/rails за 2008-03-18 14:39:09..

Form based interface

Разделение сущностей

Как показал опыт эксплуатации alterator, главная проблема с которой сталкивается пользователь этой системы – создание динамического интерфейса. Бакенд пишется мгновенно, а как только требуется изобразить что-то на экране – возникает полное непонимание того как:

нарисовать виджет
разместить виджеты на форме
добавить различные реакции на нажатие кнопок, смену текущего элемента и т. д.

Проект FBI (сокращение от Form Based Interface) призван решить эту проблему. Типичный модуль конфигуратора делится на следующие составляющие:

шаблон формы — файл в формате html, содержащий заготовку для формы.
дизайн — таблицы стилей CSS, изображения.
бакенд — скрипт или программа на любом известном разработчику языке программирования
заполнение формы (workflow) — указания того как должно осуществляться заполнение шаблона и при каких условиях будет происходить переход между формами.
визуальные эффекты — активизация/деактивизация, сокрытие части формы, изменение содержимого «на лету», в зависимости от состояния виджетов. Для web-интерфейса эту часть работы осуществляют библиотеки функций на Javascript, выполняемые на стороне браузера.

Дизайн

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

Workflow

Большинство диалогов имеют одну и ту же логику заполнения шаблона, часть особенных случаев решается заданием дополнительных параметров. Вместе с FBI поставляется набор самых распространённых workflow, таких как: form (форма) и card-index (картотека).

Визуальные эффекты

Эффекты также повторяются от формы к форме. На лицо сильное повторное использование компонент. Большую часть работы (за исключением написания бакенда) для автора модуля уже сделали другие разработчики. Вместе с FBI поставляется набор самых распространённых визуальных эффектов. Например возможно добавить возможности AJAX при работе с card-index и тем самым сильно приблизить поведение web-приложения к традиционному GUI.

Первый модуль

Сделаем простейший модуль, который будет считывать и записывать два параметра в некоторый конфигурационный файл.

Рабочий каталог

Все модули alterator имеют единую внутреннюю структуру. В принципе никто не запрещает вольностей, но при использовании стандартной раскладки, можно воспользоваться удобными функциями отладки модуля и готовыми правилами для make.
В нашем примере используются следующие каталоги:

backend3 – внешние бакенды alterator
backend2 – внутренние бакенды alterator
design – всё что относится к дизайну
templates – шаблоны форм.

Бакенд

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

#!/bin/sh #backend3/foo . alterator-sh-functions . shell-config foo_file="/tmp/foo.conf" on_message() { case "$in_action" in read) echo '(' printf 'a "%s"' "$(shell_config_get "$foo_file" a)" printf 'b "%s"' "$(shell_config_get "$foo_file" b)" echo ')' ;; write) [ -n "$in_a" ] && shell_config_set "$foo_file" a "$in_a" [ -n "$in_b" ] && shell_config_set "$foo_file" b "$in_b" write_nop ;; *) echo '#f' ;; esac } message_loop

Находясь в рабочем каталоге убеждаемся что бакенд работает:
$ alterator-cmdline -l /foo action read (("/foo" a "" b "")) $ alterator-cmdline -l /foo action write a 3 b 4 () $ alterator-cmdline -l /foo action read (("/foo" a "3" b "4"))

Шаблон

Теперь давайте нарисуем шаблон формы.
Внешне она выглядит так:

А html-код продемонстрирован ниже:
 <html> <head> <title>Alterator-FBI:General network settings</title> <link type="text/css" rel="stylesheet" href="/fbi/net-general.css"/> <meta http-equiv="Cache-Control" value="no-cache"/> <meta http-equiv="Content-Type" value="text/html;charset=utf-8"/> </head> <body> <div class="title"> <img src="/fbi/alterator-network.gif"/> General Network Options </div> <form method="POST"> <input type="hidden" name="dhcp"/> <div class="hostname_auto"> <input type="checkbox" name="hostname_auto"/> <span class="label" translate="_">Get hostname from DHCP</span> </div> <div class="hostname"> <span class="label" translate="_">Hostname:</span> <input name="hostname" type="text"/> </div> <div class="dns_auto"> <input type="checkbox" name="dns_auto"/> <span class="label" translate="_">Get resolver configuration from DHCP</span> </div> <table> <tbody> <tr> <td> <div class="search"> <p><span class="label" translate="_">Search Domains</span></p> <textarea name="search" cols="40" rows="5"></textarea> </div> </td> <td> <div class="dns"> <p><span class="label" translate="_">Domain Name Servers (DNS)</span></p> <textarea name="dns" cols="40" rows="5"></textarea> </div> </td> </tr> </tbody> </table> <p> <input class="button" type="submit"/> <input class="button" type="reset"/> </p> </form> </body> </html>

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

Шаг 3. Фронтенд.

Данный пример замечательно подходит под модель «форма», то есть пользователь проводит изменения, нажимает на кпопку submit и в системе модифицируются сетевые настройки.

Связывание backend и frontend происходит с помощью вспомогательного бакенда, который отвечает на запрос template сдедующее:

$ alterator-cmdline -l /template-net-general action template (("/template-net-general" template "form" url "/var/www/html/fbi/net-general.html"))

Этим сказано, что бакенд /net-general желает иметь интерфес с логикой работы типа “form” (или говоря правильными терминами frontend по имени form) и предлагает использовать html-файл, размещённый по указанному адресу в качестве «затравки» ( не исключаю что возможны frontend с элементами искуственного интеллекта, которым можно передать текстовый файл с перечилением идей).

Замечание: вспомогательный бакенд существует отдельно по одной единственной причине, чтобы отделить логику представления от логики работы. Если вам лень городить дополнительные файлы, то можно сделать символическую ссылку template-<backend> на <backend> и научить свой бакенд отвечать на вопрос template.

Шаг 4. Браузер.

Ну вот собственно и всё. Запускаем fbi, запускаем браузер, идём по адресу http://hostname/fbi-bin/alterator-template.scm/net-general и наблюдаем результат:

Вот и собственно и всё ... форма заполнилась данными, подключились constraints (требуемое поле выделенно звёздочкой, ненужные поля погашены). Можно переходить к написанию следующих конфигураторов.