Создание виджетов с помощью Rational Application Developer

При создании собственного виджета вы можете воспользоваться Rational Application Developer или Integration Designer.

1. С помощью веб-проекции создайте динамический веб-проект для пользовательского виджета и назначьте его EAR. Динамический веб-проект отображается в WAR, когда вы экспортируете EAR.
   Совет: Если вы планируете, что виджет будет искать ресурсы с помощью своего корневого контекста, то запишите корневой контекст веб-приложения. Вы можете оставить значение по умолчанию или изменить его. Изменить корневой контекст можно на следующей странице виджета.
2. В каталоге WebContent проекта (создаваемом автоматически как часть веб-проекта) создайте структуру каталогов для размещения кода виджета. Структура каталогов WebContent - это место хранения развертываемых ресурсов виджета, таких как файлы HTML и JSP. Любые ресурсы, размещенные вне структуры каталогов WebContent, считаются неразвертываемыми; это, например, файлы Java и SQL.
   Совет: Общие виджеты находятся в следующей структуре: iWidget/widgets/имя_виджета. Можно использовать этот путь, чтобы обеспечить согласованность, или создать собственную структуру.
3. В каталоге widget создайте файл определения iWidget для пользовательского виджета. ИД iWidget должен быть уникальным, а значение iScope - совпадать с именем класса JavaScript, определяющего поведение виджета. Более подробная информация приведена в разделе Создание iWidget справки по Rational Application Developer.
   Совет: Соглашение об именах для файла определения виджета - имя_виджета_iWidget.xml.
4. В редакторе iWidget определите виджет, указав следующую информацию:
   • Добавьте режимы, поддерживаемые виджетом, и данные или код для каждого режима.

     Вы должны определить режим view, поскольку требуется отображать информацию. Если вы хотите, чтобы пользователи могли изменять (с помощью пункта меню Изменить параметры) содержимое виджета, добавьте режим edit. Режим edit изменяет атрибуты (параметры) виджета в слое атрибутов Экземпляр. Если вы хотите, чтобы определенные пользователи (как правило, только администраторы) могли изменять значения по умолчанию, добавьте режим config. Режим config изменяет атрибуты виджета в слое Администрирование. Если вы хотите, чтобы пользователи могли настраивать способ отображения данных виджетом, и хотите применить это изменение только к некоторым пользователям, добавьте режим personalize. Режим personalize изменяет атрибуты виджета в слое Пользователь. Информация о том, что представляют собой слои атрибутов и как они работают, приведена в разделах Слои атрибутов виджета и Поддержка настройки и персонализации виджета.

   • Добавьте атрибуты виджета путем добавления набора элементов и его элементов. Эти атрибуты предоставляют значения по умолчанию для виджета. Например, если виджет отображает веб-сайт, добавьте атрибут url для хранения URL.

     Значения хранятся как строки, так что в реализации их может потребоваться преобразовать.

     Не забудьте добавить атрибут, поддерживающий каждый параметр или персонализацию, которые пользователи могут вставить в виджет. Например, если виджет содержит таблицу и вы хотите поддерживать персонализацию, определяющую столбец таблицы, по которому будет выполняться сортировка, то добавьте атрибут sort_column для хранения этой информации.

   • События, которые виджет публикует и обрабатывает путем добавления определения и описания каждого события.
   • Добавьте, как ресурс, относительный путь и имя файла, объявляющего iScope. iScope - это класс Dojo, служащий точкой входа в класс iContext во время выполнения. Эта точка входа является частью виджета, взаимодействующей со средой через класс iContext. Класс iContext играет центральную роль в среде выполнения виджета и предоставляет все службы среды: доступ к глобальным переменным, общее состояние, хранение локальных переменных, взаимодействие между виджетами посредством событий, удаленные службы, поддержку режимов и многие другие возможности.

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

   • Добавьте, как ресурсы, относительные пути и имена всех необходимых виджету файлов. Например, если виджет использует файл .css для форматирования, то добавьте путь и имя этого файла как ресурс. При добавлении ресурсов, однако, учтите, что слишком большое число запросов на ресурсы снижает производительность, поэтому в коде должно быть минимально возможное число файлов JavaScript, CSS и изображений. При проектировании виджета вы можете пользоваться различными технологиями, как-то: графические спрайты, объединение и минимизация файлов JavaScript и CSS, медленная загрузка ресурсов (ожидание загрузки ресурсов для режима edit, пока не произойдет событие onEdit).
   С помощью вкладки Источник можно добавить код или данные напрямую в файл XML. Дополнительная информация об определении виджета и его элементов и о iContext приведена в спецификации iWidget 2.1.
5. Создайте файл JavaScript, объявляющий iScope, а затем начните определять iScope путем идентификации его интерфейса. Создайте реализацию для виджета с помощью JavaScript или любого другого языка программирования или сценария. Продолжайте разрабатывать iScope параллельно с разработкой реализации виджета.
   Совет: Если виджет прост и вы реализуете его с помощью JavaScript, то создайте его реализацию в самом файле iScope.
   1. Создайте обработчики для режимов, которые вы добавили в определение iWidget, и различных событий, определенных в интерфейсе, включая предопределенные события из спецификации iWidget. Для следующих предопределенных событий (из спецификации iWidget) существуют обработчики по умолчанию, которые при необходимости можно переопределить:
      • onLoad, вызываемый при первой загрузке виджета и при обновлении браузера. Виджет может инициализировать начальный вид в этом обработчике. Полезная нагрузка у события отсутствует. Извлечь значения элемента можно с помощью, например, следующего кода:

        var att = this.iContext.getiWidgetAttributes();
        this.name = att.getItemValue("name");

      • onReload, вызываемый при повторной загрузке виджета. Этот обработчик событий схож с onLoad, но вызывается при несколько иных обстоятельствах. Когда пользователь находится в режиме edit и нажимает одну из кнопок в нижней части окна параметров, обработчик событий onReload вызывается при обновлении режима просмотра. Это поведение незначительно отличается от применяемого спецификацией iWidget, поскольку спецификация предписывает вызывать это событие перед перезагрузкой, а не во время обновления режима edit содержимого iWidget. Полезная нагрузка у события отсутствует.
      • onUnload, вызываемый непосредственно перед выгрузкой виджета. Полезная нагрузка у события отсутствует.
        Важное замечание: Проследите за тем, чтобы все создаваемые виджеты Dojo очищались во время работы этого обработчика событий. Для очистки всех дочерних виджетов Dojo, в смысле использования памяти, необходимо вызвать <виджет>.destroyRecursive().
      • onRefreshNeeded, вызываемый в тот момент, когда iContext определяет, что данные виджета устарели. Это событие должно сигнализировать iWidget, что его данные нуждаются в обновлении, если это действительно так.
   2. Для каждого режима, указанного в атрибуте supportedModes в определении виджета, создайте обработчик режима. Например, если в виджете настроены режимы view и edit, то создайте методы onView и onEdit. Метод onView можно запрограммировать так:

      onView: function(){
      ... 
      }

   3. Создайте обработчик для события onSizeChanged. У события есть полезная нагрузка, содержащая значения атрибутов newWidth и newHeight. Обработчик использует эту информацию для изменения размера виджета до указанных значений ширины и высоты. Если пользователь минимизировал виджет, то эти атрибуты будут нулевыми.

      Следующий фрагмент кода демонстрирует, как использовать обработчик onSizeChanged:

      onSizeChanged: function(iEvent) { 
            var data = iEvent.payload; 
            if (data) { 
               alert("new height: " + data.newHeight); 
               alert("new width: " + data.newWidth); 
            } 
         }

   4. Необязательно: Если виджет обращается к данным посредством API REST, то в коде следует использовать Универсальные идентификаторы ресурсов (URI), как в следующем примере:

      dojo.xhrGet({ 
        url: this.iContext.io.rewriteURI(uri), 
        load: handler 
      }); 

      Схожий подход применим к действиям HTTP, таким как PUT, POST и DELETE.

6. Создайте файлы изображений, которые будут служить изображениями предварительного просмотра и значков для пользовательского виджета, и поместите их куда-нибудь в каталог WebContent. Изображение значка должно быть размером 28 на 28 пикселов, изображение предварительного просмотра - 160 пикселов в ширину и 128 пикселов в высоту.
7. Необязательно: Если вы планируете снабдить пользовательский виджет интерактивной справкой, то создайте один или несколько файлов HTML, в которых будет храниться справочный текст. Вы можете упаковать эти файлы вместе с виджетом или создать модуль документации и поместить в него справочные файлы. (См. раздел Создание модуля документации.)
8. Для того чтобы зарегистрировать пользовательский виджет, создайте его определение в файле-каталоге. Вы можете поместить запись в существующий файл-каталог или создать новый файл-каталог. Инструкции по созданию файла-каталога и определения регистрации виджета приведены в разделе Регистрация пользовательских виджетов с помощью файлов-каталогов. Если вы создаете файл-каталог, то поместите его в каталог catalog вне каталога WebContent.
   Совет: Соглашение об именах для файла регистрации виджета - catalog_имя_каталога.xml.
9. Упакуйте и разверните пользовательский виджет. Если профайл, содержащий приложения BSpace*, нелокальный, то воспользуйтесь инструментом wsadmin на сервере приложений, как описано в разделе Упаковка и развертывание пользовательских виджетов. Приложения BSpace* содержат структурный код для сводных панелей монитора. Если профайл локальный, то вы можете выполнять команды в среде разработки, используя следующую процедуру:
   1. Экспортируйте каталог catalog в файл JAR и укажите расширение файла .zip. Файл .zip должен содержать файл-каталог в каталоге catalog.
   2. Создайте каталог для хранения сценария упаковки и развертывания. Убедитесь, что каталог сценария не содержится в каталоге WebContent или его подкаталогах.
   3. Создайте файл сценария Jython в каталоге сценариев и назовите его installBSpaceWidget.py или аналогично.
   4. Добавьте следующий код в файл сценария:

      AdminTask.installBusinessSpaceWidgets('[-nodeName имя_узла
      -serverName имя_сервера -widgets
      путь/файл-каталог.zip]')

   5. Сохраните и закройте файл.
   6. На панели структуры щелкните правой кнопкой мыши на сценарии и выберите Выполнить как > Административный сценарий.
   7. В окне Изменить конфигурацию добавьте следующую информацию:
      • В качестве среды выполнения сценария укажите тип сервера приложений.
      • В качестве имени профайла укажите профайл, содержащий приложения BSpace*.
      • В качестве аргументов команды wsadmin введите -conntype NONE.
      • Если включена защита, укажите ИД пользователя и пароль администратора.
      Отслеживать ход выполнения сценария можно на панели Консоль. В зависимости от сервера, выполнение сценария может занять несколько минут.
10. Протестируйте виджет, выполнив следующие действия:
    1. На панели Сервер щелкните правой кнопкой мыши и выберите Создать.
    2. С помощью мастера Создать сервер создайте панель, указывающую на профайл с приложениями BSpace*.
    3. Добавьте проект EAR для виджета на созданный сервер. Теперь, когда вы подключили среду разработки к приложениям BSpace*, вы можете протестировать и разработать виджет. Повторно упаковывать и развертывать виджет требуется лишь в том случае, если вы изменяли его файл-каталог или его модуль документации.
    4. В веб-браузере введите URL сводной панели. URL будет выглядеть примерно так: http://localhost:9080/BusinessSpace.
    5. Подключитесь к сводной панели монитора и протестируйте виджеты.