Смена дизайна и расширение функциональности Microsoft SharePoint

Microsoft SharePoint (Википедия) – серверная технология, веб-ориентированная платформа для совместной работы и система управления документами, разработанная и продаваемая компанией Microsoft.

Это решение может использоваться для создания корпоративного веб-портала, на котором размещаются совместно используемые документы или специализированные приложения, такие как вики или блоги. Данные в SharePoint организованы в виде списков (например, задачи, обсуждения, календари) и библиотек документов.

Функциональность SharePoint представляется пользователю посредством веб-частей — элементов управления, показывающих списки и позволяющих редактировать их. Такие веб-части размещаются на страницах, которые, в свою очередь, размещаются на портале и доступны пользователю через браузер.

На самом деле, SharePoint является приложением ASP.NET 2.0, использующим IIS для отображения веб-страниц и SQL Server для хранения данных.

Семейство продуктов SharePoint

SharePoint представлен в виде двух основных продуктов — Windows SharePoint Services (WSS) и Microsoft Office SharePoint Server (MOSS). Помимо этого, предлагается инструментальное средство Microsoft Office SharePoint Designer (SPD).

Windows SharePoint Services (WSS) — бесплатное приложение к Windows Server. WSS предоставляет базовую инфраструктуру для совместной работы — редактирование, хранение документов, контроль версий и т. д. Так же он включает в себя такую функциональность, как «маршруты» движения документов (зачатки документооборота), списки заданий, напоминания, онлайн-дискуссии. Ранее WSS был известен как SharePoint Team Services.

Microsoft Office SharePoint Server (MOSS) — платный компонент для интеграции функциональности SharePoint в работу приложений MS Office. Он является надстройкой над WSS и расширяет его возможности. Включает в себя инструменты для бизнес аналитики — Excel Services, Business Data Catalog. MOSS позволяет получить доступ к Microsoft Project Server и к формам Microsoft Office InfoPath через браузер, централизовано, в соответствии с концепцией многомодульного портала. Поддерживает специальные библиотеки, такие как PowerPoint Template Libraries. MOSS ранее был известен как SharePoint Server и SharePoint Portal Server.

Microsoft Office SharePoint Designer (SPD) — HTML-редактор в стиле WYSIWYG, заточенный под создание SharePoint-страниц и управления документами для WSS сайтов. SPD дает возможность доступа к функциональности своего рендер-движка через Microsoft Expression Web и через среду разработки Microsoft Visual Studio 2008.

Далее речь пойдет преимущественно о MOSS.

Изменение дизайна SharePoint

В поставке out-of-the-box портал MOSS имеет весьма эргономичный стандартный бело-голубой дизайн.

Однако, не смотря на это, довольно часто возникает задача смены дизайна SharePoint. Основной причиной этого является требование соотвествия дизайна портала общему корпоратиному стилю оформления, цветам и шрифтам.

Существует несколько способов решения задачи смены дизайна SharePoint, отличающихся глубиной изменений и, соответственно, позволяющих добиться разной степени гибкости. Однако, все они основаны на переопределении стандартных CSS-стилей SharePoint и добавления новых.

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

Другой способ – изменение главных страниц (master pages) SharePoint. Этот способ позволяет полностью определить расположение элементов управления, добавление новых или удаление существующих стандартных элементов управления, и, конечно же, позволяет использовать шаблоны дизайна, принятые в компании. Таким образом, можно полностью изменить внешний вид SharePoint. Чтобы добиться более удобного представления информации, можно также изменять страницы содержания (content pages). Так, создание новых типов страниц публикации (publishing pages) в сочетании с новыми типами содержимого SharePoint (content types) позволяет реализовывать нестандартные сценарии использования технологии.

Кроме того, в дополнение можно использовать нестандартные либо специально разработанные элементы управления и дополнительно расширить функциональность на стороне клиента, применяя javascript-фреймворки, такие как jQuery.

Примером применения полной кастомизации в дизайне SharePoint является созданный мною внутренний портал Института нефтегазовой геологии и геофизики им. А.А. Трофимука СО РАН (ИНГГ СО РАН).

На скриншоте приведена начальная страница портала. Кроме изменения главной станицы и переопределения классов CSS, я заменил стандартный элемент управления меню AspMenu на специально разработанный. Этот элемент управления наследует .NET класс System.Web.UI.WebControls.Menu и генерирует дружественный к CSS (CSS-friendly) html-вывод, в отличие от стандартного, генерирующего html-вывод на основе таблиц. Это позволило разместить меню не слева, как в стандартном дизайне, а снизу и распологать элементы меню по горизонтали с вертикальными подменю.

Представление стандартного верхнего горизонтального меню было изменено с применением CSS и настроено для вывода только одного уровня иерархии.

Переопредением CSS-стилей были я изменил представления веб-частей, списков, календарей и других элементов SharePoint.

Расширение функциональности Microsoft SharePoint

Microsoft SharePoint Server сразу после установки предоставляет обширные возможности для использования его в качестве веб-ориентированной платформы. Однако, почти всегда возникают задачи, которые либо очень неудобно, либо просто невозможно решить стандарными средствами SharePoint. Далее речь пойдет о расширении функциональности SharePoint с точки зрения WCM (Web Content Management, управление веб-контентом).

Очень часто при создании портала (или просто сайта) компании стоит задача публикации новостей. Это могут быть как внутренние новости компании, так и новости индустрии. Кроме этого, часто необходимо публиковать не только новости, но и объявления о разного рода событиях и иметь возможность отображения этой информации в виде отдельных блоков на страницах. Ввиду того, что портал развертывается и функционирует внутри организации иногда полезно иметь возможность добавления комментариев к новости сотрудниками этой организации. Также иногда полезно иметь возможность приложить к новости какие-либо дополнительные файлы (документы, изображения, медиафайлы).

Для реализации этих требований я создал решение IPGG.CustomPages для SharePoint. Это решение основано на создании нового типа содержимого (content type), основанного на стандартном типе содержимого «Страница статьи» («Article page»). С этим типом содежимого связана страница публикации (publishing page), расширенная дополнительными веб-частями (web-parts) для отображения прикрепленных документов и комментариев к новости.

Возможность комментирования новостей

При проектировании этой части решения было определено, что сразу после создания страницы новости необходимо иметь возможность добавления комментариев, без дополнительных настроек страницы. Для просмотра и добавления комментария должны быть предусмотрены соовествующие блоки на странице. Это означает, что не нужно покидать страницу новости, чтобы оставить комментарий. Сами комментарии должны хранится в списке на узле, на котором размещается новость. От пользователя должно быть скрыто храниние комментариев и названия полей в списке. Для реализации этой части решения был создан тип содежимого (content type) для описания сущности «комментарий», а также список, основанный на этом типе содержимого. Для отображения списка комментариев и элементов управления для добавления комментариев была разработана веб-часть (web-part), представляющая собой обертку для пользовательского элемента управления (user control).

При разработке этого пользовательского элемента управления я использовал паттерны MVP (Model-View-Presenter) и Repository, позволяющие разделить логику поведения (модель), представление и взаимодействие с хранилищем данных. Таким образом, для взаимодействия со списками SharePoint было создано расширяемое решение.

Для отображения и добавления комментариев класс представления передает свой экземляр presenter-классу, который в, свою очередь, содержить ссылку на соответсвующий класс репозитория. Эта ссылка инициализируется посредством паттерна Service Locator. Передача экземпляра класса представления presenter-классу осуществляется за счет реализации классом представления заранее определенного интерфейса. Presenter-класс содежит поле этого интерфейсного типа и инициализирует его в конструкторе.

Внешне страница с комментариями в кастомизированном дизайне имеет такой вид:

Возможность прикрепления файлов к странице новости

При проектировании этой части решения было также определено, что сразу после создания страницы новости необходимо иметь возможность прикрепления файлов, без дополнительных настроек страницы. Прикрепленные файлы должны быть представлены на странице в виде перечисления с возможностью скачать необходимый файл. Загруженные файлы должны хранится в библиотеке документов на узле, на котором размещается новость, и должны быть разнесены по папкам. Таким образом, для каждой новости должна быть создана папка, в которую будут помещаться прикрепляемые файлы. Храниние и загрузка файлов в библиотеку документа должны быть скрыты от пользователя.

Для реализации этой части решения был создан тип содежимого (content type) для описания сущности «прикрепляемый документ», а также список, основанный на этом типе содержимого. В остальном эта часть решения в архитектурном плане повторяет предыдущую.

Особенностью этой части решения является реализация Feature Receiver, что дает возможность выполнения каких-либо действий в момент активации, деактивании, установки или удаления Feature и реализация Item Event Receiver, что позволяет выполнять каких-либо действия до или в момент создания, редактирования или удаления элементов списка. Таким образом, в момент активации Feature выполняется код, обеспечивающий подключение обработчика событий к элементам (Item Event Receiver) в стандартной библиотеки SharePoint «Страницы» («Pages»). Это необходимо для создания папок для каждой новости в библиотеке прикрепляемых документов. То есть в момент создания новости (элемента в библиотеке «Страницы» («Pages»)) выполняется код, обеспечивающий создания папки в библиотеке прикрепляемых документов.

Для реализации плавного скрытия и отображения html-блоков на странице на стороне клиента был использован jQuery.

Внешне страница с комментариями и прикрепленными документами в кастомизированном дизайне имеет такой вид:

Использованные технологии и методики

• Microsoft ASP.NET (.NET Framework)
• SharePoint API
• CAML
• patterns & practices SharePoint Guide
• MVP, Repository, Service Locator (Dependency Injection) patterns
• jQuery

Ключевые слова: css, master page, content page, publishing page, custom fields, content type, web part, user control, web server control, feature receiver, item event receiver, design patterns.