Пошаговое руководство. Создание видеосайта

Статья
09/18/2014

Дата последнего изменения: 19 апреля 2010 г.

Применимо к: SharePoint Server 2010

В этой статье
Структура контента
Настраиваемая форма просмотра видео
Скрытая веб-часть «Форма данных»
Доступность столбцов и скрытая веб-часть «Форма данных»

Чтобы создать социальный сайт общего доступа к мультимедиа со всеми надлежащими возможностями (такими, как отправка видео и извлечение эскизных изображений, оптимизация домашней страницы для просмотра видео и управления видеоконтентом, использование средств агрегирования, например каналов, для больших видеобиблиотек), необходимо сначала создать базовый сайт для видео. Создание видеосайта состоит из пяти основных шагов:

Настройка структуры контента, поддерживающей контент типа видео.
Создание настраиваемой формы для просмотра видео.
Создание скрытой веб-части DataFormWebPart и ее использование для получения параметров мультимедиа.
Создание универсального проигрывателя.
Используйте объектную модель ECMAScript (JavaScript, JScript) для доступа к объекту MediaWebPart.

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

Необходимые компоненты

Для работы с данным разделом необходимо наличие Microsoft Visual Studio 2010 и знание следующих технологий, связанных с SharePoint:

Microsoft SharePoint Designer 2010
Основы HTML
Основы программирования JavaScript
Разработка в Microsoft Silverlight
Основы XML и XSL

Структура контента

Чтобы подготовиться к созданию видеосайта, сначала настройте структуру контента, используя SharePoint Designer 2010 или пользовательский интерфейс браузера Microsoft SharePoint Server 2010. Структура контента определяет, какие возможности доступны на уровне сайта и на уровне семейства сайтов, какие типы контента следует активировать, и какие столбцы необходимо добавить для поддержки видеоконтента.

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

Важно!
При обновлении типов контента используйте Коллекцию типов контента сайта. Внесение изменений в Коллекцию типов контента сайта облегчит в будущем добавление библиотек с совместимыми типами контента. Избегайте обновления типов контента в отдельных библиотеках контента.

При обновлении типов контента используйте Коллекцию типов контента сайта. Внесение изменений в Коллекцию типов контента сайта облегчит в будущем добавление библиотек с совместимыми типами контента. Избегайте обновления типов контента в отдельных библиотеках контента.

Создайте две библиотеки Типы активов: Видео и Эскизы. Включите в библиотеку Видео тип контента «Видео» и удалите все остальные типы контента. Включите в библиотеку Эскизы тип контента «Изображение» и удалите все остальные типы контента. В данной серии пошаговых руководств библиотека Видео будет использоваться для хранения видеофайлов, а библиотека Эскизы — для хранения эскизных изображений, отправляемых на сайт.

Важно!
Добавьте в библиотеку «Видео» видеоклип, чтобы создать тег <img>, который будет впоследствии использоваться при добавлении веб-части «Форма данных» и настройке столбцов и фильтров.

Базовый видеосайт поддерживает стандартные функции работы с видео, а также возможности настройки связанных свойств мультимедиа, определенных для типа контента «Видео». В этот тип контента можно добавлять оценки, корпоративные ключевые слова, закладки, поддержку страниц каналов и другие свойства. Добавьте столбцы, перечисленные в таблице 1, из Коллекции столбцов сайта в тип контента Видео.

Таблица 1. Столбцы сайта, добавляемые в коллекцию столбцов сайта

Имя столбца	Тип столбца и связанные параметры
Закладки	Текст из нескольких строк («Тип»==«Обычный текст»; «Разрешить неограниченную длину в библиотеках документов»==«Да»)
Канал	Подстановка (источники информации: библиотека «Страницы», столбец «Название», «Разрешить несколько значений»==«Нет»)

Таблица 2. Столбцы типа контента «Видео»

Имя столбца	Используется для
Оценка (0-5)	Для оценки контента пользователями в форме просмотра
Корпоративные ключевые слова	Для связанных видеоклипов в форме просмотра

Имя столбца	Тип столбца и связанные параметры	Используется для
Закладки. Это поле будет содержать данные, необходимые для отображения закладок в видеоклипах большой продолжительности.
Канал	Подстановка (источник: библиотека «Страницы», столбец «Название», «Разрешить несколько значений»==«Нет»)	Страницы канала. Это поле используется для обозначения канала, по которому должно демонстрироваться видео.

Настраиваемая форма просмотра видео

Первым компонентом сайта общего доступа к видео является настраиваемая страница, используемая для просмотра видео. Большинство элементов этой страницы, включая Оценки и Закладки, представляют собой свойства, определяемые при создании столбцов для типа контента «Видео». На следующем шаге будет добавлен универсальный проигрыватель. Страница содержит следующие элементы:

Универсальный проигрыватель
Оценки
Закладки
Связанное видео
Свойства мультимедиа
Текст универсального проигрывателя
Комментарии

Создание новой формы просмотра в конструкторе SharePoint Designer

Запустите SharePoint Designer 2010 и откройте сайт SharePoint.
В левой области навигации щелкните Списки и библиотеки, а затем выберите библиотеку Видео.
В разделе Формы выберите Создать.
В диалоговом окне Создание формы списка выберите Тип формы и установите флажок Назначить формой, используемой по умолчанию для выбранного типа:
- Тип формы: Форма просмотра элемента
- Назначить формой, используемой по умолчанию для выбранного типа=Да
- Тип контента: Видео
В разделе Формы щелкните созданную форму правой кнопкой мыши, а затем выберите Изменить файл в расширенном режиме.

Теперь стала доступна новая Форма просмотра элемента, которую можно настраивать. Она будет открываться по умолчанию, когда пользователь выберет команду Свойства представления для видео.

Скрытая веб-часть «Форма данных»

Создайте скрытую веб-часть DataFormWebPart и используйте ее для получения параметров мультимедиа. Большинство функций, включенных в Форму просмотра элемента (такие, как универсальный проигрыватель и закладки), предоставляются средствами JavaScript. В объектной модели JavaScript используются значения входных параметров, хранящиеся в столбцах демонстрируемого видео. Для настройки Формы просмотра элемента сначала добавьте веб-часть DataFormWebPart на страницу. После скрытия веб-часть Форма данных будет содержать все данные, необходимые для включения требуемых функций JavaScript.

Таблица 3. Параметры DataFormWebPart

Столбец	Используется для	Имя XSL в веб-части «Форма данных»	Предлагаемое имя привязки
Название	Универсальный проигрыватель	@Title	TitleFieldValue
URL-путь	Универсальный проигрыватель	@FileRef	UrlFieldValue
PreviewImageUrl	Универсальный проигрыватель	@AlternateThumbnailUrl	PreviewsImageUrlFieldValue
Закладки	Закладки	@Bookmarks	BookmarksFieldValue
Корпоративные ключевые слова	Связанное видео	@TaxKeyword	KeywordsFieldValue

Чтобы добавить веб-часть «Форма данных» и настроить столбцы и фильтры

Выберите Форму просмотра элемента на ленте вставки, а затем выберите в раскрывающемся меню библиотеку Видео.
Нажмите кнопку Добавление и удаление столбцов на контекстной ленте Работа с представлениями данных — параметры и добавьте поля, перечисленные в таблице 3, в группу Отображаемые столбцы.
Щелкните правой кнопкой мыши тег <img>, который в данный момент отображается для столбца PreviewImageUrl, и с помощью команды Форматирование элемента измените формат на «Текст».
Щелкните правой кнопкой мыши гиперссылку, показанную для столбца URL-путь, и с помощью команды Форматирование элемента измените формат на «Текст».
На контекстной ленте Параметры нажмите кнопку Параметры и добавьте в раздел Параметры представления данныхНовый параметрID со следующими атрибутами:
1. Источник параметра: Строка запроса
2. Переменная строки запроса: ID
3. Значение по умолчанию: 1
На контекстной ленте Параметры нажмите кнопку Фильтр и добавьте условие фильтра: <Field Name:ID>Equals[ID]

Последние два шага выполняются для того, чтобы в DataFormWebPart всегда отображались значения метаданных для элемента, просматриваемого пользователем в данный момент.

Доступность столбцов и скрытая веб-часть «Форма данных»

Значения в объекте DataFormWebPart по умолчанию недоступны для адресации в JavaScript. Необходимо настроить каждое значение, отображаемое в DataFormWebPart, чтобы оно стало адресуемым в JavaScript. Настройка значений производится по единой схеме. Чтобы выполнить ее, необходимо иметь возможность просматривать код HTML для каждой страницы. Поэтому переключитесь в Комбинированный режим в SharePoint Designer 2010, прежде чем приступать к процедуре.

Сделав значения DataFormWebPart адресуемыми из JavaScript, скройте веб-часть, чтобы она не отображалась на странице Форма просмотра элемента во время ее просмотра. Задав теги привязки с известными именами для каждого параметра, можно обращаться к любому из значений, используя одну строку кода JavaScript.

Чтобы сделать столбцы доступными для использования в ECMAScript

Запустите SharePoint Designer 2010 и переключитесь в Комбинированный режим, чтобы видеть HTML-код для каждой страницы.
Просмотрите веб-часть Форма данных.
В представлении кода найдите инструкцию <xsl:value-of>, используемую для генерации правильного значения.

Совет

Например, код поля Название имеет вид <xsl:value-of select=”@Title”/>.
Заключите инструкцию <xsl:value-of> в теги <a>, а затем выберите атрибут name для элемента <a>, например: <a name="TitleFieldValue"> <xsl:value-of select="@Title" /></a>.

Совет
Например, код поля Название имеет вид <xsl:value-of select=”@Title”/>.

Чтобы скрыть веб-часть «Форма данных»

Найдите элемент <WebPartPages:DataFormWebPart> в HTML-коде страницы Форма просмотра элемента.
Поставьте перед этим элементом и после него элемент <div> с атрибутом style="display:none;" .

Для доступа к любым значениям объекта DataFormWebPart используйте следующую строку кода JavaScript:(document.getElementsByName(‘Title’))[0].innerText;

Примечание
Используйте в этом фрагменте кода Предлагаемое имя привязки, указанное в таблице 3, вместо значения Название.

Итак, в этом разделе сайт SharePoint Server 2010 был настроен как сайт публикации с включенными оценками, были созданы две библиотеки типов активов (для видеофайлов и для файлов эскизных изображений), был задан тип контента «Видео» и определены доступные для него свойства мультимедиа, была создана Форма просмотра элемента для отображения параметров мультимедиа и универсального проигрывателя, был добавлен объект DataFormWebPart, использующий значения входных параметров из столбцов просматриваемого видео, значения объекта DataFormWebPart были сделаны доступными для объектной модели JavaScript, а объект DataFormWebPart был скрыт от пользователей в Форме просмотра элемента, служащей основным местом просмотра содержимого видеосайта.

В следующем пошаговом руководстве будет показано, как добавить объект MediaWebPart в Форму просмотра элемента, используемую для демонстрации видео, как отобразить свойства мультимедиа в форме и как заполнить данными остальные параметры мультимедиа для типа контента «Видео», такие как оценки, связанное видео и комментарии.