Technologie Silverlight přináší nové světlo do tvorby webových aplikací. Kromě podpory XAML kódu pro definici uživatelského prostředí či podpory .NET jazyků (Silverlight verze 1.1) obsahuje též nativně podporu pro streamování. Silverlight je optimalizován pro VC-1 kodek (není nutná žádná separátní instalace kodeku, je součástí plug-inu pro prohlížeče). Aby byla tvorba vlastních streamovaných videí co nejjednodušší máme k dispozici nástroje, které nám tuto práci ulehčí a též (A TO JE TO HLAVNÍ) je k dispozici streamovací server, kam můžeme ZDARMA svá videa ukládat!!!

Na stránkách http://silverlight.live.com je k dispozici prostor 4GB (ano opravdu tak hodně) pro ukládání videí pro streamování. Velikost jednoho videa je omezena na 22mb, což je pro HDTV cca 1 minuta. Proč zrovna HDTV? Protože Silverlight HDTV umí a to sakramentsky dobře :) Pro získání vlastních 4GB musíme mít vlastní Live ID, nic víc nic míň.

Pro vytvoření a umístění videa použijeme nástroj Microsoft Expression Encoder, který je k dispozici v 60-ti denní trial verzi (což je dosti dlouhá doba na vytvoření co největšího množství videí).

Převod videa do streamované podoby je vlastně pouze nudná manuální práce, kterou zvládne i takový audio/video analfabet jako jsem já :)

1) Import videa do Expression Blendu provedeme položkou File -> Import

2) Poté musíme nastavit v části Settings kvalitu Videa a Audia. Během nastavování této kvaliti je ihned zobrazována pravděpodobná velikost výsledného souboru, takže ihned vidíme, zda bude video dostatečně "malé" pro umístění na http://silverlight.live.com. Je k dispozici hned několik možných nastavení např. pro Silverlight, WebServery, Zune atd. a též různě velké bitrates výsledného videa.

image

3) Na záložce output si vybereme typ Silverlight přehrávače, který se nám bude líbit.

image

4) Spustíme proces Encodování...velké tlačítko Encode a nebo Ctrl+E a nebo to je taky v menu File. Počkáme na doběhnutí procesu a tím je hotová část přípravy videa pro streamování. Pokud jsme nechali defaultní nastavení, tak se nám po doběhnutí automaticky zobrazí výsledné video v prohlížeči a samozřejmě, že se bude přehrávat v námi vybraném Silverlight prohlížeči. Tento prohlížeč lze libovolně měnit např. pomocí Expression Blend či VS či jiným libovolným textovým nástrojem.

5) Nyní nás čeká nahrání videa na http://silverlight.live.com. Znovu opakuji, musíme mít Live ID, abych se sem mohl přihlásit. Všechny možné a nemožné způsoby vytvoření a nahrání videa jsou popsány v Silverlight Streaming SDK, vybírám jenom to nejdůležitější a nejrychlejší.

6) Přejdeme do adresáře kam se nám vygenerovalo video. Cesta se nastavuje v Expression Encoderu hned pod vybraným typem Silverlight prohlížeče. Zde musíme vytvořit soubor manifest.xml a do něho v nezměněnné podobě umístíme:

<SilverlightApp>
 <version>1.0</version> 
 <loadFunction>StartWithParent</loadFunction> 
 <jsOrder>
   <js>MicrosoftAjax.js</js> 
   <js>BasePlayer.js</js> 
   <js>PlayerStrings.js</js> 
   <js>player.js</js> 
   <js>StartPlayer.js</js> 
 </jsOrder>
</SilverlightApp>

7) Nyní zabalíme obsah celého adresáře do .ZIPu. ZIP nesmí obsahovat soubory s příponou .html a .csproj. Pokud je tam necháme, budeme na to při uploadu upozorněni a zip se stejně nenahraje. Více info např. zde: http://dev.live.com/silverlight/quickstart01.aspx

8) Přejdeme na stránky http://silverligt.live.com do části Manage Applications, kde je položka Upload a Silverlight Application.

image 

9) Po vybrání této položky na další stránce zadáme jméno, pod kterým bude naše video uloženo na server a samozřejmě cestu na .zip obsahující video, silverlight aplikaci, manifest a další. Stiskem tlačítka upload video nahrajeme na server.

image 

10) Po nahrání bude video vidět v části Manage Applications a bude k dispozici pro další práci (smazání, změna jména aplikace, ..) pod zvoleným názvem (v našem případě Gears).

11) Posledním krokem je přístup k videu. Máme dvě možnosti, buď vložit streaming pomocí iframe a tam kde to není možné, tak pomocí javascriptů (potřebné kusy kódů získáme na webu když přistoupíme na vlastnosti uploadovaného videa v části Manage Applications). Přístup na video pro iframe je velmi jednoduché. Vložené video lze přehrát přímo zadáním URL adresy: http://silverlight.services.live.com/invoke/ACCOUNT_ID/APP_NAME/iframe.html, kde Account_ID najdeme pod položkou Manage Account a APP_NAME je jméno videa/aplikace.

image 

V našem případě bude adresa na video tato: http://silverlight.services.live.com/invoke/19915/Gears/iframe.html

PS: double-clickem do videa se zobrazí ve full-screen