Развёртывание IBM Lotus Connections: Фирменное оформление и индивидуальная настройка

Опции документа Опции документа, требующие включения JavaScript, не отображаются Обсудить Выскажите мнение об этой странице Помогите нам улучшить содержание

Уровень сложности: средний

Юджин Луи, старший ИТ-специалист, IBM

06.05.2008

В пятой части нашей серии статей показывается, как создавать фирменное оформление и выполнять индивидуальную настройку пользовательского интерфейса IBM Lotus Connections. Узнайте, каким образом следует выполнять изменения, чтобы Lotus Connections приобрёл подходящий для вашего предприятия внешний вид и необходимые функции.

В IBM Lotus Connections имеется механизм, позволяющий выполнять специальную настройку навигационной панели, а также других компонентов продукта. В статье объясняются шаги, необходимые для изменения навигационной панели, и предлагаются примеры изменения содержимого существующих страниц. Статья предназначена ИТ-специалистам и ИТ-архитекторам, хорошо разбирающимся в HTML-тегах и имеющим некоторый опыт работы с Java и JSP.

Специальная настройка навигационной панели

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

Как устроена навигационная панель

Перед настройкой навигационной панели необходимо понять её устройство. Просмотрев исходный HTML-код сформированной страницы Lotus Connections, вы не увидите HTML-кода, лежащего в основе навигационной панели. Навигационная панель формируется на страницах Blogs при помощи следующего JavaScript:

<script type="text/javascript" language="Javascript" src="/blogs/nav/header.js">

Поделиться... Разместить на Digg Разместить на del.icio.us Разместить на Slashdot!

Необходимо помнить, что в комплекте с каждой функцией Lotus Connections идёт своя версия навигационной панели. Она располагается в том же каталоге по отношению к каталогу функции Lotus Connections. Например, приложение навигационной панели для функции Profiles можно найти в каталоге <was_profile_root>/installedApps/<cell_name>/Profiles.ear/sn-nav.war. Изучив отображения сервлетов в файле web.xml из sn-nav.war, расположенном в каталоге WEB-INF, можно увидеть классы, отвечающие за создание навигационной панели.

Изменение навигационной панели

Lotus Connections предоставляет лёгкий способ изменения содержимого, внешнего вида и функций навигационной панели. В Lotus Connections используется два шаблона навигационной панели по умолчанию, custom-styles.css и header.html, отвечающие за её стиль и содержимое. Выполните шаги, приведённые в разделе "Специальная настройка навигационной панели" Информационного центра по Lotus Connections, чтобы убедиться, что изменения навигационной панели отражаются в каждой из установленных функций Lotus Connections.

Роль header.html

Файл header.html определяет HTML-элементы, отображаемые в навигационной панели. Этот файл для функции Dogear расположен в каталоге <was_profile_root>/installedApps/<cell_name>/Dogear.ear/sn-nav.war/templates. Навигационная панель Lotus Connections по умолчанию содержит информацию об установленных функциях Lotus Connections, имя пользователя и кнопку выхода из системы (logout), как показано на рисунке 1.

ПРИМЕЧАНИЕ: Элемент, отображающей имя вошедшего в систему пользователя и ссылки на кнопки входа и выхода из системы, изменять не следует. В случае с функцией Profiles некоторые элементы запрашиваются с помощью вызовов Ajax после загрузки страницы, поскольку необходимо сделать некоторые страницы кэшируемыми.

Добавление ссылок

На навигационной панели можно размещать новые элементы, добавляя разметку к файлу header.html. Элементы в фигурных скобках заменяются динамическими данными при помощи сервлетов навигации. Например, текст {{application links}} заменяется на ссылки на функции Lotus Connections, а текст {{label.header.logout}} заменяется переведённым текстом из соответствующего пакета ресурсов. Создайте пункт меню, добавив ссылки к списку. В этом примере мы добавляем пункт меню, представляющий собой ссылку на домашнюю страницу Lotus.

Выполните следующие шаги:

1. Сделайте резервную копию header.html.
2. Откройте header.html в текстовом редакторе.
3. Добавьте выделенный жирным шрифтом текст из следующего примера кода после элемента {application links}.

   <ul class="inlinelist links"> {{application links: li }} <a href="http://www.lotus.com">Lotus Software</a> </ul>

   
   

4. Сохраните файл и перезапустите Dogear.

Новая навигационная панель показана на рисунке 2.

Использование JavaScript в навигационной панели

Помимо HTML-разметки к навигационной панели можно добавлять динамическое содержимое при помощи вложенного JavaScript. Например, с помощью JavaScript можно добавить текущую дату в правую часть навигационной панели.

Чтобы это сделать, выполните следующие шаги:

1. Сделайте резервную копию header.html.
2. Откройте header.html в текстовом редакторе.
3. Добавьте выделенный жирным шрифтом код из листинга 1.
4. Сохраните файл и перезапустите Dogear.

<!-- Copyright IBM Corp. 2007  All Rights Reserved. -->
<div id="headerInner">  
    <a href="#mainContent" accesskey="S" class="hidden"><img src="{{images}}/blank.gif" 
    alt="Skip to main content link. Accesskey S"></a>
    <h1 style="display: none;">Lotus Connections</h1>
     <ul class="inlinelist links"> 
         {{application links: li }}
     </ul>
    <ul class="userlist">
        <li class="first" id="headerUserText" style="display:none">
        <span id="headerUserName"><em>unknown user
        </em></span></li>
        <li class="divide" id="logoutLi" ><a href="#" id="logoutLink" >
        {{ label.header.logout }}</a></li>
        <script type="text/javascript">
                var currentTime = new Date();
                var month=currentTime.getMonth()+1;
                var day=currentTime.getDate();
                var year=currentTime.getFullYear();
                document.write(month + "/" + day + "/" +year);
        </script>
    </ul>
</div>

Новая навигационная панель показана на рисунке 3.

Роль custom-styles.css

Файл custom-styles.css - это каскадная таблица стилей (CSS) навигационной панели. Помимо всего прочего, в этом файле определяются шрифты, цвета и фоновое изображение, используемые в навигационной панели. Этот CSS-файл для функции Dogear расположен в каталоге <was_profile_root>/installedApps/<cell_name>/Dogear.ear/sn-nav.war/templates.

Применение существующего стиля

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

Чтобы это сделать, выполните следующие шаги:

1. Сделайте резервную копию custom-styles.css.
2. Откройте custom-styles.css в текстовом редакторе.
3. Найдите следующую строку:

   <a href="http://www.lotus.com">Lotus Software</a>

   и замените её на:

   <li><a href="http://www.lotus.com">Lotus Software</a></li>

4. Сохраните файл и перезапустите Dogear.

Новая навигационная панель показана на рисунке 4. После того, как мы поместили новый пункт меню в тег <li>, он наследует стиль, назначенный для тега <li> в CSS-файле.

Создание нового стиля

Определять новые стили можно путём добавления стиля к custom-styles.css. В этом разделе приводится пример создания стиля пункта меню, в котором, в отличие от других пунктов, будет использоваться шрифт Courier New. Для этого следует определить в custom-styles.css новый стиль под названием myLinks:

1. Сделайте резервную копию custom-styles.css.
2. Откройте custom-styles.css в текстовом редакторе.
3. Вставьте следующий код в конец файла:

   #header .myLinks {font-family: Courier, "Courier New", monospace}

4. Сохраните и закройте файл.
5. Откройте header.html и найдите следующую строку:

   <li><A HREF="http://www.lotus.com>">Lotus Software</A></li>

   и замените её на:

   <li class="myLinks"><A HREF="http://www.lotus.com>">Lotus Software</A></li>

6. Сохраните и закройте файл.
7. Перезапустите Dogear.

Новая навигационная панель показана на рисунке 5.

Изменение фонового изображения навигационной панели

CSS также определяет фоновое изображение навигационной панели. Чтобы навигационная панель правильно отображалась при различной ширине окна браузера, фоновое изображение составляется из двух частей. Первое изображение отвечает за левую часть навигационной панели, а второе - за правую. Во избежание проблем при формировании изображения, размер левого изображения должен быть 1600x100, а правого - 300x100. Не забудьте скопировать новые фоновые изображения в подкаталог images каталога sn-nav.war.

Выполните следующие шаги для изменения фоновых изображений навигационной панели по умолчанию:

1. Сделайте резервную копию custom-styles.css.
2. Откройте custom-styles.css в текстовом редакторе.
3. Измените выделенный жирным шрифтом код из листинга 2, указав имена своих файлов.
4. Сохраните и закройте файл, а затем перезапустите Dogear.

#header { 
	/*font: normal .75em/1.5em Helvetica, Arial, Verdana, sans-serif; */
	background: transparent url("{{images}}/yellowBanner_left.gif")
	 bottom left no-repeat;
	color: #5b3feb;
	/*height: 4.0em; */
	height: 47px;
	padding: 0;
	text-align:right;
	/*font-size: .9em;*/
}

#header #headerInner {
	/*height: 3.75em;	*/
	height: 47px;
	background: transparent url("{{images}}/yellowBanner_right.gif")
	 bottom right no-repeat;
}

На рисунке 6 показана новая навигационная панель.

В начало

Специальная настройка страниц Lotus Connections

Для настройки Lotus Connections необходимо понимать, как формируются страницы. Lotus Connections основан на среде Struts. Struts - это открытая среда из проекта Apache Jakarta для разработки Web-приложений с помощью шаблона разработки Модель-Представление-Контроллер (MVC). Среда Struts выходит за рамки нашей статьи, однако мы будем знакомить читателя с базовыми концепциями Struts по мере необходимости. Более подробную информацию по Struts см. на сайте Apache Struts.

В следующих примерах вы узнаете, как изменять метки полей и сообщения об ошибках, а также как настраивать компонент Profiles, добавляя к нему необходимое поле.

ПРИМЕЧАНИЕ: Изменять конфигурационные файлы должны только опытные пользователи.

Настройка текста, меток полей и сообщений об ошибках

Lotus Connections хранит метки, сообщения об ошибках и другие текстовые сообщения в файлах свойств, специфичных для каждого набора локальных настроек. Можно добавлять или изменять записи в файле свойств для создания или изменения меток полей и сообщений об ошибках. В файлах свойств используется формат ключ=значение, где ключ представляет собой значение, указанное либо в JSP, либо в атрибуте тега, а значение - это отображаемый текст.

Каждый компонент Lotus Connections имеет собственный набор файлов свойств с расширением PROPERTIES. В таблице 1 приведены пути к этим файлам свойств.

Для редактирования файлов свойств выполните следующие шаги:

1. Разархивируйте JAR-файл, содержащий файлы свойств (например, peoplepages.web.jar), во временный каталог.
2. Сделайте резервную копию файла свойств, который необходимо отредактировать.
3. Откройте соответствующий файл свойств в текстовом редакторе.
4. Выполните необходимые изменения.
5. Сохраните и закройте файл.
6. Добавьте изменённые файлы в архив.
7. Перезапустите соответствующую функцию Lotus Connections.

Добавление поля к функции Profiles

В функции Profiles отображается набор полей по умолчанию, но поскольку структура каждой организации уникальна, функция Profiles обеспечивает возможность дополнения приложения тремя пользовательскими расширениями, property1, property2 и property3. В этом примере мы добавляем поле Mentor (наставник) в функцию Profiles с помощью пользовательских расширений.

Чтобы можно было использовать дополнительные поля расширения, необходимо, чтобы для каждого пользователя в таблице Profile_Extension базы данных Profiles имелась специальная строка. В версии 1.0 функции Profiles в таблице Profile_Extension отсутствуют данные, вносимые туда скриптами IBM Tivoli Directory Integrator. Эта проблема будет решена в версии 1.0.1. Нижеприведённый пример основан на этой версии.

Включение свойств пользовательских расширений

Для включения свойств пользовательских расширений выполните следующие шаги:

1. Измените файл profiles_extensions.properties в каталоге Tivoli Directory Integrator, указав расширяемое свойство, имя свойства, тип данных и ключ, как показано в следующем примере кода:

   PROPERTY_IDS=property1 PROF_NAME.property1=Mentor PROF_DATA_TYPE.property1=String PROF_KEY.property1=Mentor

   
   

2. Отредактируйте файл map_dbrepos_from_source.properties, чтобы в нём отображались пользовательские расширения для поля в исходном LDAP-каталоге, например: PROF_VALUE.property1=property1.

Более подробную информацию см. в разделе "Отображение полей" Руководства по установке Lotus Connections 1.0.

После запуска скрипта Tivoli Directory Integrator для импорта данных, в таблицу Profile_Extensions базы данных Profiles будет внесена информация.

Включение поля Mentor на вкладке Edit My Profile

Поля, отображаемые на вкладке My Profiles определяются в файле profiles-config.xml, расположенном в каталоге <was_profile_root>/config/cells/<cell_name>/nodes/<node_name>/LotusConnections-config. В общем, изменять файл profiles-config.xml следует при помощи скриптового интерфейса клиента wsadmin. Но поскольку команды wsadmin, изменяющие profilesDataModel, отсутствуют, можно изменять profilesDataModel с помощью текстового редактора.

Перед внесением изменений в файл используйте команду wsadmin checkout. Аналогично следует использовать команду wsadmin checkin после выполнения изменений. Процессы checkout и checkin выполняют проверку схемы в соответствии с конфигурационным файлом. Более подробную информацию по скриптовому интерфейсу wsadmin см. в разделе "Настройки функции редактирования с помощью клиента wsadmin" Информационного центра по Lotus Connections.

В элементе profileDataModel имеются три дочерних элемента, соответствующих трём разделам вкладки My Profile: Job Information, Contact Information и Associated Information. Порядок следования этих полей в конфигурационном файле отражает порядок их отображения в форме. Следовательно, можно очень легко изменить порядок следования атрибутов, не модифицируя JSP-файлы.

Для добавления поля Mentor в раздел Contact Information вкладки My Profile выполните следующие шаги:

1. Сделайте копию файла profiles-config.xml.
2. Откройте файл в текстовом редакторе.
3. Добавьте следующую строку как дочерний элемент к элементу contactInformation element, как показано жирным шрифтом в листинге 3:

   <editableAttribute showLabel="true" hideIfEmpty="true" hcard="true">property1</editableAttribute>

4. Сохраните и закройте файл.
5. Перезапустите Profiles, чтобы применить изменения.

<!-- <editableAttribute showLabel="true" link="true">calendarUrl</editableAttribute> -->
<!-- <editableAttribute showLabel="true" link="true">freeBusyUrl</editableAttribute> -->
<editableAttribute showLabel="true" 
hideIfEmpty="true" hcard="true">property1</editableAttribute>
</contactInformation>

Атрибут hcard отвечает за функцию опережающего ввода имени. Более подробную информацию, касающуюся элемента editableAttribute его атрибутов, см. в разделе "Определение атрибутов для Profiles" Информационного центра по Lotus Connections.

Метка поля определяется в файле resources-attributeLabels.properties из peoplepages.web.jar. Ключевое значение свойства, используемое для отображения метки, представляет собой соединение метки слова, раздела страницы и текста из тега. В нашем примере ключ файла свойств - label.contactInformation.property1. Чтобы убедиться, что метка отображается правильно, добавьте следующий код к файлу resources-attributelabels.properties:

label.contactInformation.property1=Mentor:

Перезапустите компонент Profiles и нажмите на вкладку Edit My Profile. Поле Mentor появится в разделе Contact вкладки Edit My Profile, как показано на рисунке 7, а также на вкладке My Profile, как показано на рисунке 8.

Определение обязательного поля

Так как Lotus Connections основан на Struts, можно применить среду валидации Struts (Struts validation framework) для валидации данных форм. Validation.xml и validation-rules.xml - компоненты среды валидации Struts. Validation.xml определяет типы валидации, применяемые к полям; в validator-rules.xml определяется набор стандартных процедур валидации. Процедуры валидации, например, обязательная и максимальная длина, входят в среду валидации. Более подробную информацию по среде валидации Struts см. в Руководстве по валидатору Apache Struts.

В нашем примере мы объявляем поле Mentor обязательным. Чтобы это сделать, выполните следующие шаги:

1. Сделайте копию файла <was_profile_root>\installedApps\<cell_name>\profiles.ear\
   peoplepages.war\WEB-INF\validation.xml.
2. Откройте файл в текстовом редакторе.
3. Добавьте в файл код, выделенный жирным шрифтом в листинге 4.
4. Сохраните и закройте файл.
5. Перезапустите Profiles, чтобы изменения вступили в силу.

<form-validation>
  <formset>
    <form name="editProfileForm">
      <field property="attribute(contactInformation.property1)" depends="required">
        <msg name="required" key="errors.requiredfield" />
      </field>
      <field property="attribute(associatedInformation.description)" depends="maxlength">
        <msg name="maxlength" key="errors.aboutMe" />
          <var>
	    <var-name>maxlength</var-name>
	    <var-value>1500</var-value>
	  </var>
       </field>
       

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

Наконец, создадим пользовательское сообщение об ошибке, отображаемое при неудачной валидации, создав новую запись в файле resources-general.properties функции Profiles. Создадим запись в файле свойств с ключом, указанном в ключевом атрибуте элемента msg.

errors.requiredfield=Mentor value is missing.

В результате, если пользователь не введёт имя руководителя при записи профиля, будет выведено сообщение "Mentor value is missing" (Значение Mentor отсутствует).

В начало

Примеры JSP-файлов и их функции

В таблице 3 приведены адреса и имена различных JSP-файлов и их функции.

ПРИМЕЧАНИЕ: Пользовательские изменения JSP-файлов не поддерживаются. Есть несколько файлов, изменения в которые вносятся чаще всего. Они должны помочь вам определить, где именно следует выполнять необходимые изменения. Редактировать такие файлы должны только опытные пользователи.

*Обновить файл можно, сделав в нём небольшое изменение, например, добавив к тегу пробел и сохранив изменения.

В начало

Заключение

Эта статья служит введением в фирменное оформление и специальную настройку развёрнутой системы Lotus Connections. Для пояснения в статье приводится несколько примеров специальной настройки Lotus Connections. Мы изменили стиль и добавили на навигационную панель новое содержимое. Кроме того, мы добавили обязательное поле на вкладку Edit My Profile с помощью одного из пользовательских расширений, а также познакомились с процессом изменения меток полей и сообщений об ошибках за счёт модификации файлов свойств.

Ресурсы

• Оригинал статьи: Deploying IBM Lotus Connections: Branding and Customisation (EN).
  
  
• Прочтите статью developerWorks: Развёртывание IBM Lotus Connections: Вопросы планирования и архитектуры.
  
  
• Прочтите статью developerWorks: Развёртывание IBM Lotus Connections: Настройка после установки.
  
  
• Прочтите статью developerWorks: Развёртывание IBM Lotus Connections: Обслуживание .
  
  
• Прочтите статью developerWorks: Развёртывание IBM Lotus Connections: Поиск и устранение неисправностей .
  
  
• Прочтите статью developerWorks: Развёртывание IBM Lotus Connections: Интеграция с другими системами (EN).
  
  
• Прочтите статью developerWorks: Развёртывание IBM Lotus Connections: Прикладной программный интерфейс (EN).
  
  
• Прочтите статью developerWorks: IBM Lotus Connections: повышение эффективности работы при помощи социально-ориентированных компьютерных технологий.
  
  
• Посетите страницу, посвящённую Lotus Connections, на developerWorks.
  
  
• Прочтите Руководство по Lotus Connections V1.0.
  
  
• Посетите Информационный центр по Lotus Connections, где можно найти подробную информацию по установке, настройке и администрированию Lotus Connections.
  
  
• Ознакомьтесь более подробно с Apache Struts Framework.
  
  
• Ознакомьтесь более подробно с Apache Struts Tiles Reference.
  
  
• Ознакомьтесь с Руководством по валидатору Apache Struts.
  
  
• Ознакомьтесь со справочником по HTML-тегам Apache Struts.
  
  

• Примите участие в обсуждении материала на форуме.
  
  
• Читайте блог группы Lotus на developerWorks.

Об авторе

		Юджин Луи (Eugene Louie) - старший ИТ-специалист в IBM Software Services for Lotus. С момента прихода в команду в конце 2006 года он занимается проектами IBM Lotus Connections и IBM Lotus Sametime V7.5.1. До этого Юджин работал инженером-программистом в группе Lotus Component Designer в Вестфорде, Массачусетс. Связаться с Юджином можно по адресу eugene_louie@us.ibm.com.

Выскажите мнение об этой странице

Пожалуйста, найдите минутку и заполните форму, чтобы повысить уровень сервиса. Помогла ли данная информация достичь Вашей цели? Да Нет Не знаю   Пожалуйста, напишите комментарий, чтобы мы могли улучшить данную страницу:   Насколько полезна эта информация? (1 = Бесполезна, 5 = Очень полезна) 1 2 3 4 5

Поделиться этой статьей: забобрить сохранить в memori

В начало