Мультимедиа
Атрибут source и пользовательские кодеки
Элементы видео (и аудио) могут использовать атрибут HTML5 source (источник). В веб-приложениях элементы с множеством источников используются для предоставления альтернативных видеоформатов в том случае, если клиентская система не имеет кодека, необходимая для воспроизведения из основного источника. Учитывая, что список форматов, поддерживаемых Windows 8, хорошо известен (обратитесь снова к материалу "Поддерживаемые форматы звука и видео" ( http://msdn.microsoft.com/library/windows/apps/hh986969.aspx ), это не большая проблема для приложений Магазина Windows. Однакое, использование source все еще полезно, так как этот атрибут позволяет идентифицировать конкретный кодек для источника медиаданных:
<video controls loop autoplay> <source src="video1.vp8" type="video/webm" /> </video>
Это важно, когда вы хотите предоставить пользовательский кодек для приложения посредством Windows.Media.MediaExtensionManager, что описано в разделе "Пользовательские кодеры/декодеры и обработчики схем" ниже в этой лекции, так как кодек идентифицирует расширение для загрузки и применения при декодировании. Я показал здесь в качестве примера WebM, так как он не доступен напрямую приложениям для Магазина Windows (хотя присутствует в Internen Explorer). Когда исполняется хост-процесс, приложение для Магазина Windows, содержащее вышеописанный элемемент video, будет выполнять поиск подходящего декодера для заданного параметра type.
Применение видеоэффектов
Вышеприведенная таблица показывает, что у видеоэлемента есть методы msInsertVideoEffect и msInsertAudioEffect. WinRT предоставляет встроенный эффект стабилизации видео, который легко применить к элементу. Это показано в Сценарии 3 примера "Мультимедийные расширения" (), где одно и то же видео проигрывается с использованием эффекта и без него, у стабилизированного видео отключен звук:
vidStab.msClearEffects(); vidStab.muted = true; vidStab.msInsertVideoEffect(Windows.Media.VideoEffects.videoStabilization, true, null);
Пользовательские эффекты, как показано в Сценарии 4 примера, применяются в виде отдельных динамически связываемых библиотек (DLL), обычно написанных на C++ для лучшей производительности, и включенных в пакет приложения, так как приложения для Магазина Windows могут устанавливать DLL только для собственного использования, а не для общесистемного доступа. В примере вы найдете проекты DLL для перевода изображения в оттенки серого, инверсии и применения геометрических эффектов, где у последних есть три параметра – для эффекта "рыбьего глаза" (fisheye), сжатия (pinch) и деформации (warp). В файле js/customEffect.js вы можете видеть, как применяются эти эфекты, в первом параметре msInsertVideoEffect, который является строкой и идентифицирует эффект, экспортируемый DLL (смотрите, например, файл InvertTransform.idl в проекте InvertTransform):
vid.msInsertVideoEffect("GrayscaleTransform.GrayscaleEffect", true, null);
vid.msInsertVideoEffect("InvertTransform.InvertEffect", true, null);
Второй параметр msInsertVideoEffect, кстати, показывает, нужно ли применять эффект, обычно он имеет значение true. Третий параметр называется конфигурация (config), он содержит дополнительные сведения, которые передаются в эффект. В случае с геометрическими эффектами в примере, этот параметр задает конкретный вариант эффекта:
var effect = new Windows.Foundation.Collections.PropertySet();
effect["effect"] = effectName;
vid.msClearEffects();
vid.msInsertVideoEffect("PolarTransform.PolarEffect", true, effect);
Здесь effectName может принимать значения "Fisheye", "Pinch", или "Warp".
Аудиоэффекты, не показанные в примере, применяются так же, с помощью msInsertAudioEffect (с теми же параметрами). Обратите внимание на то, что каждый элемент может иметь не более двух эффектов в потоке. Элемент video может иметь два видеоэффекта и два аудиоэффекта, элемент audio может иметь два аудиоэффекта. Если вы попытаетесь добавить больше, метод выдаст исключение. Поэтому полезно вызывать msClearEffects перед добавлением эффектов.
Подробности об эффектах и других расширениях мультимедиа вы можете найти в материале "Применение расширений мультимедиа" (http://msdn.microsoft.com/library/windows/apps/hh700365.aspx).
Обзор мультимедиа-серверов
Во многих домашних хозяйствах, и в моем тоже, имеется один или большее количество мультимедиа-серверов, доступных в локальной сети, с которых приложения могут воспроизводить мультимедийные данные. Добраться до этих серверов можно с помощью еще одного свойства Windows.Storage.KnownFolders, о котором мы пока не упоминали: mediaServerDevices (http://msdn.microsoft.com/library/windows/apps/windows.storage.knownfolders.mediaserverdevices.aspx). Как и в слудчае с другими известными папками, это просто объект StorageFolder, посредством которого можно перечислять дополнительные папки и файлы или применять запросы к ним. В данном случае, если вы вызываете его метод getFoldersAsync, вы получаете список доступных серверов, каждый из которых представлен собственным объектом StorageFolder. Здесь вы можете использовать файловые запросы, как было описанов в "Состояния, параметры, файлы и документы" , для поиска мультимедийных да нных интересующих вас типов, или использовать критерии поиска, заданные пользователем. Вот пример, посвященный этому: "Клиент мультимедиа-сервера" (http://code.msdn.microsoft.com/windowsapps/Media-Server-sample-fffbe490).
Воспроизведение и микширование звука
Как и в случае с видеоданными, элемент audio предоставляет собственные возможности по воспроизведению, в том числе – элементы управления, циклическое воспроизведение и автовоспроизведение:
<audio src="media/SpringyBoing.mp3" controls loop autoplay></audio>
Опять же, как описано выше, одни и те же спецификации W3C применимы и к элементу video, и к элементу audio. Уже известный код для проигрывания лишь звуковой дорожки видеофайла, мы можем использовать для проигрывания аудиофайла:
var sound = new Audio("media/SpringyBoing.mp3");
sound1.msAudioCategory = "SoundEffect";
sound1.load(); //Для предварительной загрузки данных
sound1.play(); //В любое время позже
Как уже упомянуто ранее, создание объекта Audio без элементов управления и запуск воспроизведения не воздействует на макет, это обычно используется для воспроизведения звуковых эффектов в играх и в других приложениях.
Как и в случае с видео, для приложения, выполняющего воспроизведение звука, важно соответствующим образом реагировать на события, исходящие из объекта Windows.Media.MediaControl (http://msdn.microsoft.com/library/windows/apps/windows.media.mediacontrol.aspx), в особенности на события playpressed, pausepressed, stoppressed, и playpausetogglepressed. Это позволяет пользователю управлять воспроизведением с помощью аппаратных кнопок, которые можно использовать при воспроизведении музыки, например. Однако, вы можете не применять обработку этих событий, например, при воспроизведении игровых звуков.
Говоря о воспроизведении звука, интересно рассмотреть вопрос о смешивании нескольких звуков, что обычно нужно в играх. Важно понимать, что каждый элемент audio может воспроизводить лишь одну запись, у него есть лишь один и только один файл-источник. Однако, несколько элементов audio могут проигрывать звуки одновременно с автоматическим микшированиев в зависимости от их категорий (смотрите раздел "Средство управления воспроизведением и фоновое аудио" ниже). В этом упражнении, фоновая музыка проигрывается непрерывно (loop установлено в true, громкость установлена на половину), в то время, как другой звук воспроизводится в ответ на касания (смотрите упражнение AudioPlayback в дополнительных материалах к лекции):2И, конечно, я играю на гитаре и пою главную партию в этой живой записи, вместе с моим другом Тедом Катлером. Песня "Who is Sylvia?" написана другим моим другом, Дж. Дональдом Уолтерсом, на стихи Шекспира.
var sound1 = new Audio("media/SpringyBoing.mp3");
sound1.load(); //Для предварительной загрузки данных
//Фоновая музыка
var sound2 = new Audio();
sound2.msAudioCategory = "ForegroundOnlyMedia"; //Установим перед установкой src
sound2.src = "http://www.kraigbrockschmidt.com/mp3/WhoIsSylvia_PortlandOR_5-06.mp3";
sound2.loop = true;
sound2.volume = 0.5; //50%;
sound2.play();
document.getElementById("btnSound").addEventListener("click", function () {
//Сбрасываем позицию, если уже воспроизводим
sound1.currentTime = 0;
sound1.play();
});
Загрузив звук, воспроизводимый при касании, мы знаем, что можем воспроизвести его в любое время. При запуске воспроизведения, полезно сбросить currentTime в значение 0, таким образом, звук всегда будет воспроизводиться сначала.
Вопросы о микшировании, особенно в играх, касаются управления различными звуками без знания наперед времени, когда они будут смешиваться. Вам может быть нужно, например, наложить друг на друга воспроизведение одного и того же звука, с различным временем начала, но объявлять три аудиоэлемента с одним и тем же источником непрактично. Представленная техника касается использования "ротации каналов" ("rotating channels"), как описано здесь: http://ajaxian.com/archives/html5-audio-tutorial-rotating-channels. В итоге получается следующее:
- Объявляем элементы audio для каждого звука (с установкой preload="auto").
- Создаем пул (массив) объектов audio для необходимого количества каналов
- Для воспроизведения звука
- Получаем доступный объект Audio из пула.
- Устанавливаем его атрибут src в соответствии с одним из соответствующих элементов audio с предварительно загруженными данными.
- Вызываем метод play этого объекта из пула.
Как обнаружили звукорежиссеры фильмов, нет особенного смысла проигрывать одновременно слишком много звуков, так как звучание становится слишком "грязным". В итоге, вам не понадобится больше пары десятков каналов.
Подсказка. Нужны звуки для приложения? Загляните на http://www.freesound.org/.
Расширения API аудиоэлемента
Как и в случае с элементом video, и для элемента audio доступны некоторы расширения, в частности те, что можно использовать для управления эффектами (msInsertAudioEffect), DRM (msSetMediaProtectionManager), для воспроизведения на целевых объектах (msPlayToSource, и так далее.), msRealtime, и msAudioTracks, как перечислено раньше в разделе о расшираниях API для видеоэлемента. На самом деле, каждое расширение API для аудио существует и для видео, но два из них имеют особую важность для элементов audio: msAudioDeviceType позволяет приложению определить, на какое выходное устройство осуществляется отправка звука: "Console" (по умолчанию) и "Communications". Это способ, благодаря которому приложение знает, что оно участвует в сеансе связи (наподобие чата), что не связано с воспроизведением мультимедийных аудиоклипов.
msAudioCategory идентифицирует тип проигрываемой аудиозаписи (смотрите таблицу в следующем разделе). Это очень важно для идентификации того, следует ли продолжать воспроизведение музыки в фоновом режиме (тем самым предотвращая перевод приложения в приостановленный режим), как описано далее. Обратите внимание на то, что следует всегда устанавливать это свойство перед установкой src, и на то, что установка режима "Communications" так же устанавливает тип устройства на "Communications" и приводит к установке msRealtime в true.
Обратите внимание на то, что несмотря на схожесть значений в этих свойствах, msAudioDeviceType предназначено для выбора выходного устройства, в то время как msAudioCategory идентифицирует тип аудиозаписи, которая воспроизводится через любое устройство. Аудио с коммуникационной категорией, например, может воспроизводиться на консольном устройстве, а мультимедийное аудио – на коммуникационном устройстве. За этими двумя свойствами стоят разные концепции.