Проигрыватель в стиле Channel 9
Зашел как-то на Channel 9, чтобы посмотреть ролик о CardSpace http://channel9.msdn.com/showpost.aspx?postid=375041 и очень мне захотелось иметь такой же проигрыватель как у них.
Больше всего поразил тот факт, что у них проигрыватель отображает продолжительность ролика, и при этом не происходит полной загрузки. Особенность элемента MediaElement заключается в том, что после задания источника видео в свойстве Source, начинается загрузка ролика. А это не очень хорошо, особенно если на странице много таких роликов. Поэтому хотелось бы устранить эту неприятность, с сохранением остальной функциональности. При этом за основу хотелось взять стандартный шаблон Expression Encoder.
Посмотрел как у них сделано. Оказалось все просто - они используют Media Services и протокол mms. При передаче в MediaElement ссылки на такой источник, вычитывается только служебная информация, а вот полной загрузки ролика не происходит. Меня такой вариант не устраивает, так как я пользуюсь службой Silverlight Streaming http://sliverlight.live.com для публикации своих творений. Поэтому, возникла следующая задача:
1. Необходимо реализовать проигрыватель, используя стандартный шаблон Expression Encoder, который не осуществляет полную загрузку ролика.
2. Необходимо выполнить первую задачу с минимальными затратами вермени.
3. Необходимо сделать с минимальными изменениями стандартных скриптов JavaScript.
4. Шаблон должен поддерживать только стандартные возможности, чтобы обеспечить возможность автоматической публикации из Expression Encoder.
Как бывший пионер, решил не сдаваться. Выбрал тактику "вызревания", которую использую еще со времен учебы в институте. Вызревал неделю. Почитал статью как сделать свой шаблон:
Creating silverlight player templates
Ковырять xaml из стандартного шаблоне не хотел. Продолжал думать, и пришел к следующему решению - необходимо отображать картинку, с изображением проигрывателя. При нажатии на кнопку Play, заменить картинку проигрывателем. Данную идею вчера реализовал в виде тестовой публикации ролика:
Новый проигрыватель
К сожалению, данный подход не полностью автоматизированный, и требуется создание скриншота, для отображения вместо проигрывателя. В качестве картинки по умолчанию я создал следующий вариант:
После созданий решения в Expression Encoder его можно заменить на собственный.
Как установить такой шаблон.
Скачиваем шалон Шаблон для Microsoft Expression Encoder
Разворачиваем его в папку <>:\Program Files\Microsoft Expression\Encoder 1.0\Templates\en
Запускаем Expression Encoder и на вкладке Output выбираем шаблон c9.
Наслаждаемся.