Иван Хрипунов
Возможности MS Windows SharePoint Services
Часть 2
Windows SharePoint Services предоставляет удобный и простой интерфейс, с помощью которого вы можете создавать и изменять веб-страницы. А если требуется расширить функциональность этой технологии и улучшить внешний вид веб-узла?
В первой части статьи [1] вы познакомились с базовыми элементами Windows SharePoint Services. В качестве иллюстрации возможностей технологии мы создали веб-узел телефонного справочника, содержащий сведения о сотрудниках компании, а также их фотографии. Все изменения на веб-узле проводились с помощью обозревателя Internet Explorer. Эта функциональность WSS позволяет решать большинство задач по предоставлению информации.
Со временем вам, возможно, потребуются более гибкие настройки и расширенная функциональность. Например, вывести данные в формате, отличном от стандартного, или изменить расположение элементов на странице. В этом случае вам на помощь придет редактор, совместимый с технологиями SharePoint.
Microsoft Office FrontPage 2003
С момента выхода первой версии программы, которая была нацелена на использование в качестве наглядного (WYSIWYG, What You See Is What You Get) редактора HTML, во FrontPage 2003 многое изменилось. Помимо того, что стало удобнее редактировать HTML, XML, CSS и проч., теперь можно полноценно работать со службами SharePoint. А следующая версия, которая выйдет в начале 2007 года, будет именоваться Microsoft SharePoint Designer 2007. Это говорит о том, что программа ориентирована исключительно на работу с технологиями SharePoint.
В настоящий момент для пользователей и администраторов веб-узлов, использующих платформу WSS, во FrontPage доступны такие возможности:
- Дизайн. Если вы не знакомы с языком разметки HTML или не хотите работать с кодом, вы можете изменять веб-страницы в режиме конструктора (WYSIWYG). Добавляйте слои, динамические эффекты и панели навигации – это улучшит внешней вид веб-узлов WSS.
- Кодирование. Изменяйте веб-страницы в режиме кодирования с помощью профессионального редактора HTML, XML и CSS. Доступны функции автозавершения и проверки правильности кода, шаблоны поведения (Behaviors) и работа с элементами управления ASP.NET.
- Расширение функциональности. Вы можете работать с информацией из различных источников, создавая веб-узлы, управляемые данными. Создавайте и изменяйте цветовые схемы с помощью встроенного редактора. Анализируйте статистику использования веб-узла WSS в различных разрезах при помощи представления «Отчеты».
C помощью FrontPage вы можете выполнять задачи по обслуживанию и управлению веб-узлами:
- Создавать веб-узлы, списки, библиотеки документов, страницы веб-частей, используя мастера и шаблоны.
- Изменять основные параметры веб-узлов, списков, библиотек документов. В том числе добавлять и редактировать столбцы в списках и библиотеках. Появляется возможность изменить URL веб-узла, используя окно свойств.
- Изменять служебные файлы списков и библиотек документов, которые позволяют добавлять, редактировать и просмотривать элементы.
- Создавать и восстанавливать резервные копии веб-узлов.
Каталог источников данных
При работе с веб-узлами, основанными на технологии SharePoint, FrontPage позволяет получать данные из разнообразных источников:
- Списков и библиотек документов данного узла.
- Баз данных, совместимых с OLEDB, например, Microsoft SQL Server.
- Веб-сервисов.
- XML-файлов.
Все используемые источники информации текущего веб-узла хранятся в так называемом каталоге данных. Физически этот каталог представлен в иерархии узла папкой, обычно _fpdatasources, где хранятся файлы в формате XML с описаниями подключений. Эта папка создается при первом обращении к каталогу источников данных во FrontPage. Вы можете добавлять каталоги других узлов и таким образом отображать данные списков, библиотек документов и т. д., расположенных за пределами текущего узла.
Основа для получения информации из перечисленных источников – механизм передачи данных (data retrieval service), одно из нововведений в WSS. Этот механизм позволяет обмениваться информацией между поставщиком и получателем данных по протоколу SOAP (Simple Object Access Protocol), используя XML, и является, по-сути, веб-сервисом.
Вывод информации из каталога
Чтобы отображать данные из каталога на веб-страницах, в составе WSS поставляется веб-часть «Представление данных» (DataView web part). Она выступает как клиент сервиса передачи данных, форматируя их с помощью XSLT (eXtensible Stylesheet Language for Transformations, расширяемый язык стилей для преобразований). Таблицы XSLT используются для описания преобразований структуры документов, посредством простых наборов правил.
FronPage – одна из первых программ, предоставляющих возможность наглядного редактирования XSLT. Это означает, что вы можете редактировать стили XSLT, не обладая глубокими знаниями о них. С другой стороны, если вы не новичок в работе с XSLT, вы можете использовать редактор кода FrontPage для самостоятельного создания необходимых преобразований.
Веб-часть «Представление данных» поддерживает все свойства, присущие этому элементу WSS, – изменение параметров, персонализация, соединения с другими веб-частями. Для добавления на веб-страницы данная веб-часть доступна только из FrontPage. Изменять ее настройки вы можете с помощью браузера или FrontPage.
Стандартные веб-части списков и библиотек документов вы можете трансформировать в «Представление данных» во FrontPage с помощью команды «Преобразовать в XSLT-представление данных». При этом сохраняется идентичный исходной веб-части внешний вид и функциональность, а также вам доступны средства, применимые к веб-части «Представление данных».
Используем FrontPage
Давайте на практике рассмотрим работу с веб-узлами во FrontPage. Вернемся к нашему телефонному справочнику, расположенному по адресу http://server01/phones/. На первой странице веб-узла, default.aspx, расположены две связанные между собой веб-части – одна отображает контактную информацию сотрудников компании, другая – их фотографии. Данные о сотрудниках и их фотографии хранятся в списке и библиотеке рисунков соответственно.
Откроем наш веб-узел во FrontPage: для этого запустите программу и выберите пункт «Открыть узел» в меню «Файл». Справа на панели представлены все каталоги открытого узла. Обратите внимание, что библиотеки файлов (в нашем случае – фотографий сотрудников) и списки (они находятся в директории Lists) отображаются в виде папок. Внутри каждого списка или библиотеки файлов (в папке «Forms») находятся вспомогательные файлы создания, редактирования и просмотра элемента, а также файлы веб-страниц представлений. Кроме того, в структуре узла присутствуют следующие служебные папки:
- _catalogs. Это скрытая системная папка. Отображается, если разрешен показ скрытых файлов и папок. Эта опция устанавливается в окне параметров узла. Содержит каталог шаблонов списков, узлов и веб-частей.
- _fpdatasources. Папка каталога источников данных. Создается при первом обращении к каталогу во FrontPage.
- _private. Это специальный скрытый каталог FrontPage, не видимый в обозревателе. Его можно использовать, например, для хранения информации, собранной с помощью форм.
- Images. Пустая папка для изображений, которые могут быть использованы при дизайне веб-страницы.
Также в структуре отображаются все файлы веб-страниц.
При изменении файлов вы можете выбирать представление, которое больше вам подходит. Это может быть представление «Конструктор», позволяющее редактировать страницу в визуальном редакторе, или представление «Код», для работы непосредственно над кодом веб-страницы. Одним из удобных является представление «С разделением», которое комбинирует вышеуказанные представления так, что вам доступны и изменение кода, и визуальный редактор. При этом обе части окна синхронизируются, то есть если вы добавили в таблицу код для создания нового столбца, это изменение будет отражено в визуальной части. А если вы выделите в визуальной части любой элемент, он будет подсвечен в области кода.
Найдите файл default.aspx и откройте его.
Для позиционирования элементов на странице используется сложная структура вложенных таблиц. Нас интересуют только две области, веб-зоны. Они расположены в центральной части страницы, называются «Left» и «Right». Используя FrontPage, вы можете добавлять новые веб-зоны или изменять свойства существующих. В представленных веб-зонах находятся веб-части списка сотрудников и веб-часть изображения.
Для нашего примера они нам не понадобятся, удалите их со страницы, освободив место для добавления новых элементов. В визуальной части окна достаточно выделить веб-часть и нажать на клавиатуре кнопку «Delete».
Рисунок 1. Схема работы механизма передачи данных WSS
Добавляем представление данных
Перед вставкой веб-части выделите веб-зону, в которую она добавляется. Если добавить веб-часть на веб-страницу за пределы веб-зоны, она не будет доступна для изменения в обозревателе. Выделите левую веб-зону, кликнув на ее названии, и в меню «Данные» выберите пункт «Вставить представление данных». В правой части окна, на панели области задач открывается каталог источников данных, где перечислены все имеющиеся поставщики, сгруппированные по типам и месту расположения. Изначально в качестве места расположения указан текущий веб-узел, но вы можете добавлять сюда каталоги источников данных других узлов с помощью команды «Управление каталогом», которая находится в нижней части панели задач.
Подключения данных для списков и библиотек SharePoint формируются автоматически при создании этих элементов на веб-узле. Для всех остальных типов источников данных вы должны добавлять подключения вручную, с помощью команды «Добавить в каталог», которая расположена в каждой группе источников данных.
Раскройте группу «Списки Share Point». Здесь представлен единственный созданный нами список – «Сотрудники». Его можно «перетащить» в нужную веб-зону по аналогии с веб-частями или, нажав правую кнопку мыши, выбрать из меню пункт «Добавить представление данных». После этого будет добавлена веб-часть с данными из списка сотрудников. По умолчанию она содержит несколько основных полей расположенных в таблице. Так как в нашем списке было всего три записи, таблица содержит заголовок и три строки с данными. Стиль представления элементов вы можете выбирать из десятка стандартных шаблонов – на основе таблиц, списков и других элементов HTML. Если вы знакомы с XSLT, то легко можете создать свой шаблон вывода данных, написав необходимый код.
Заметьте, после добавления веб-части на страницу, на панели задач открылось окно «Сведения о представлении данных». Здесь представлены команды для настройки веб-части, а также отображены данные списка в виде древовидной структуры.
Рисунок 2. Открытый веб-узел во FrontPage 2003
Настраиваем внешний вид
Давайте для начала добавим необходимые для списка контактов поля – те что в данный момент отображаются, не несут в себе достаточной информации. Удалите названия полей из заголовка таблицы. Каждый столбец списка отображается в данной веб-части полем. Эти поля необходимо выделить и удалить. Вы можете работать с любой строкой – при удалении поля из одной строки, удаляются все поля в столбце. Это происходит из-за того, что вы работаете непосредственно с шаблоном XSLT. Мы продолжим работать с табличным стилем, и нам потребуется добавить столбцы в таблицу по количеству полей, которые будут отображаться. В режиме конструктора это не сложнее, чем такая же операция в Microsoft Word.
Добавить поля в таблицу вы можете, просто «перетащив» их в нужные колонки с панели «Сведения о представлении данных». Давайте добавим следующие столбцы: «Фамилия», «Имя», «Отдел», «Рабочий телефон», «Сотовый телефон», «Адрес электронной почты». Не забудьте, что самая первая строка таблицы – это заголовок, поэтому внесите сюда названия полей.
После того как необходимые поля добавлены, можно приступить к их форматированию. Все поля у нас имеют текстовый формат и отображаются верно, кроме поля с адресом электронной почты. Это поле неплохо было бы отображать в виде гиперссылки. Выделите это поле в конструкторе и, используя меню «Данные», выберите пункт «Форматировать элемент как…». Из открывшегося меню нас интересует пункт «Гиперссылка». Если вы применяете такое форматирование к элементу «Адрес электронной почты», он отображается на веб-странице в виде гиперссылки. Но, к сожалению, текущая версия FrontPage не позволяет выбрать тип ссылки (обычная, сообщение электронной почты, ссылка в документе). В код автоматически вставляется ссылка на страницу. Такая ссылка не будет работать для отправки сообщений электронной почты, и это придется исправить в коде вручную.
Если вы уже работали с языком разметки, то знаете, что для ссылок на адреса электронной почты параметр href тега <A> должен содержать строку «mailto:[e-mail]». Выделите в визуальной части окна элемент с адресом и найдите в выделенном фрагменте вот такой код:
<td class="ms-vb">
<a>
<xsl:attribute name="href">
<xsl:value-of select="@Email"/>
</xsl:attribute>
<xsl:value-of select="@Email"/>
</a>
</td>
В описании XSL-атрибута href для тега <A> (строка 4) измените значение на «mailto:<xsl:value-of select=”@Email”/>». Теперь гиперссылка будет работать правильно – при выборе ее будет создаваться сообщение электронной почты. Вы не забываете сохранять изменения?
Данная ситуация исправлена в новой версии FrontPage – SharePoint Designer 2007. Во второй бета-версии, доступной для публичного тестирования, при форматировании элемента как гиперссылки открывается стандартное окно «Выбор гиперссылки». Все остальные поля пока оставим без изменений форматирования.
Используем условное форматирование
Можно немного оживить наш список – добавить условное форматирование. С помощью этой опции FrontPage вы можете, например, изменять форматирование (цвета, шрифт, отображение) в зависимости от выполнения какого-либо условия. С веб-частью списка сделать это нельзя, а вот для «Представления данных» это не сложно.
Давайте для примера будем изменять цвет фона каждой нечетной строки на серый. Для создания правила условного форматирования выделите строку таблицы и на панели «Сведения о представлении данных» выберите команду «Условное форматирование». Создайте правило применения форматирования, в качестве поля укажите [номер строки] – нечетный. В окне изменения стилей («Формат» -> «Граница» -> «Заливка» ) укажите цвет заливки – светло-серый. Если этот цвет из стандартного набора кажется темным, то, нажав «Другие цвета» в списке цветов, введите, например, значение «Hex={DF,DF,DF}».
Сортируем и группируем список
Используя веб-части списков вы можете сортировать, группировать и фильтровать данные – эти команды расположены на панели инструментов. К тому же, нажав на заголовок столбца, вы можете отсортировать строки. А что же «Представление данных»? Вся эта функциональность присутствует и в этой веб-части. Откройте окно «Типы представлений» с помощью команды «Стиль» на панели «Сведения о представлении данных». На закладке «параметры» вы можете изменить следующие настройки веб-части – показывать или нет панель инструментов, с помощью которой можно сортировать, фильтровать и группировать информацию; создать ссылки в заголовках столбцов для сортировки; выбрать отображение набора элементов и так далее.
Для нашего примера можно включить параметр для сортировки данных по заголовкам столбцов.
Фотографии сотрудников
Получившийся список контактов неплохо выглядит, но, в отличие от первой версии, на странице не отображается фотография.
Вы можете поступить уже известным вам способом [1] – соединить веб-часть представления данных с веб-частью изображения, используя в качестве адреса фотографии поле «Фото». Отличительная особенность «Представления данных» от веб-части списка в том, что создавать соединения можно по любым полям, вне зависимости, показаны они на странице или нет. Единственное условие – поле списка должно быть указано в запросе данных. Еще одна замечательная возможность «Представления данных» – настройка отправки первой строки всем присоединенным веб-частям. На практике это означает, что при начальном отображении страницы во всех связанных веб-частях будет отображаться информация. Изменить эту настройку вы можете в окне изменения параметров веб-части, в разделе «Разное».
Но раз уж мы ведем речь о «Представлении данных», сделаем вывод фотографий с помощью именно этой веб-части.
Повторите описанные выше шаги по добавлению представления данных списка «Сотрудники» на страницу, но в веб-зону «Right», расположенную в правой части страницы. Удалите всю информацию, оставив пустую таблицу, состоящую из одного столбца. Оставьте в таблице строку заголовка, а одну из строк, содержащих данные, разбейте на 7 строк. Последние пять строк разделите на две колонки. Теперь «перетащите» поля списка в полученный макет, введите названия и отформатируйте текст. Первые две строки – это поля «Фото» и «Полное имя».
Элемент, содержащий путь к фотографии сотрудника, отформатируйте как рисунок. Нажмите правую кнопку мыши и из меню «Отформатировать элемент как» выберите «Рисунок». На рис. 3 показано, что у вас должно получиться. Не забывайте сохранять страницу.
Рисунок 3. Результат изменений телефонного справочника
Соединение веб-частей
Мы сделали вывод дополнительной информации о сотруднике на одной странице – вместе с фотографией теперь доступны все необходимые поля. Осталось лишь связать список сотрудников с созданным информационным блоком, назовем его «Сотрудник – подробно».
Создание соединений между веб-частями такого типа доступно только во FrontPage. Выберите одно из представлений данных, нажмите правую кнопку и выберите «Соединения веб-частей» из меню. Если данный элемент уже имеет настроенные соединения, то вы увидите окно соединений. Здесь перечислены все соединения, любое из них вы можете отредактировать или удалить. Мы создаем первое соединение для веб-части, поэтому сразу открывается окно «Мастер соединения веб-частей». Не буду описывать подробно все шаги мастера, в процессе его работы даются достаточно подробные объяснения. Замечу лишь, что так как мы связываем две веб-части, основанные на одном списке, то в качестве связующего стоит использовать поле «Идентификатор». Хотелось обратить ваше внимание на предпоследний шаг мастера. На этом этапе вам предлагается выбрать поле веб-части источника, на котором будет создана ссылка для связи, и указать, какие поля будут участвовать в обозначении выделенного элемента. Выделенный элемент выделяется полужирным написанием. Выберите в качестве поля со ссылкой и поля обозначения столбец «Фамилия» нашего списка. Теперь сохраните страницу и откройте веб-узел в обозревателе.
Полезные мелочи
Посмотрите на получившуюся страницу – фактически она ничем не отличается от первой версии, созданной с использованием стандартных веб-частей списков и изображений. Но получившийся справочник содержит на одной веб-странице всю информацию о сотруднике, позволяет более гибко настраивать внешний вид. Несмотря на то что на разработку такой страницы уходит больше времени, результат того стоит.
Что можно еще улучшить? Например, добавить в XSLT-шаблон динамические эффекты с помощью тегов <xsl:attribute>. Таким образом вы можете описать DHTML-события OnClick, OnMouseOver и прочие. Например, используя событие OnClick, вы сможете выводить информацию о сотруднике по щелчку в любом месте строки.
Если список сотрудников достаточно большой, создайте еще один список, содержащий буквы алфавита. Добавьте в список сотрудников вычисляемое поле, в котором будет содержаться первая буква фамилии сотрудника. Сделать это можно, записав в поле формулу «=ЛЕВСИМВ([Фамилия];1)». Добавьте на страницу еще одну веб-часть «Представление данных» с буквами алфавита и соедините ее с веб-частью списка сотрудников. Вы получите удобную разбивку списка по алфавиту, и ориентироваться в таком справочнике будет удобнее.
Вам необходимо добавить ссылку на экспорт контактов в Outlook на страницу? Воспользуйтесь возможностями протокола stssync, реализованного в WSS. Подробнее об этом вы можете прочитать на страницах библиотеки MSDN (http://msdn.microsoft.com/library/en-us/spptsdk/html/tsstsync_SV01036546.asp)
Если вам потребуется выгрузка данных в Excel, создайте на странице ссылку на файл запроса данных. Получить такой файл вы можете на страницах представлений списка. Достаточно найти ссылку «Экспорт в электронную таблицу». При запросе необходимо сохранить файл *.iqy на ваш веб-узел.
И помните о том, что если при работе с «Представлением данных» вам не хватает функциональности, которая присутствует в стандартной веб-части списка или библиотеки, вы в любой момент можете преобразовать эту веб-часть в полностью настраиваемое XSLT-представление.
А как же остальные источники данных?
Все действия, описанные в статье, вы можете применять для данных, полученных из других поддерживаемых источников. Отличаться будет только запрос данных.
Используйте веб-сервисы, которые устанавливаются вместе с WSS, и те, что доступны на внешних узлах в Интернете. Подробное описание веб-сервисов для технологий SharePoint вы можете найти на сайте MSDN – http://msdn.microsoft.com/library/en-us/spptsdk/html/soapnsMicrosoftShare PointSoapServer2_SV01043862.asp.
Выгружайте на веб-узлы файлы в формате xml и выводите информацию из них на страницах веб-сайтов. Таким образом вы можете публиковать, например, курсы валют в удобном для вас формате. То же самое вы можете сделать и с потоками в формате RSS.
- Хрипунов И., Черневский А. Возможности технологии MS Windows SharePoint Services. //Системный администратор, №5, 2006 г. – C. 20-27. –http://www.samag.ru/cgi-bin/go.pl?q=articles;n=05.2006;a=04.
- http://www.sharepointcustomization.com – сайт, посвященный совместному использованию FrontPage и технологий SharePoint.
- http://www.microsoft.com/technet/prodtechnol/office/office2003/maintain/fp03wss.mspx – использование FrontPage для редактирования веб-узлов SharePoint.
- http://msdn.microsoft.com/library/default.asp?url=/library/en-us/odc_fp2003_ta/html/odc_fpbldgxmlwebs.asp – построение узлов, управляемых данными.
- http://www.sharepointcustomization.com/resources/whitepapers.htm – сборник документации.
- http://www.sharepointcustomization.com/resources/sdks.htm – Software Development Kits для FrontPage и WSS.
Все перечисленные интернет-ресурсы представлены на английском языке. Из русскоязычных ресурсов в ближыйшее время начнет функционировать блог, посвященный технологиям SharePoint. Найти его вы сможете по адресу http://blogs.technet.com/ruswss.