Building Windows Store Apps with Smooth Streaming Client SDK Beta 2

Yesterday we announced the release of Smooth Streaming Client SDK Beta 2 for Windows Store Apps.The Smooth Streaming Client SDK Beta 2 for Windows Store Apps enables developers to build Windows Store applications that can play on-demand and live Smooth Streaming content with or without Microsoft PlayReady protection.

This blog is a walk-through for building a “Hello World” version of Smooth Streaming Windows Store Apps, using JavaScript and HTML5. This sample application uses Smooth Streaming Client SDKs directly. But we also recommend you to take a look at Microsoft Media Platform Player Framework for Windows 8, which is a player framework built on top of client SDKs. It is very easy to use for you to build rich video applications. If you are using earlier version of Client SDK, you could refer to this blog.

Prerequisites

  • • Windows 8 RTM (32 bits or 64 bits). You could get it via MSDN after Aug 15th 2012.
  • • You should have Visual Studio 2012 RTM installed. If you are using Visual Studio RC 2012 or VIsual Studio Express 2012 RC, I don’t guarantee the project compiled. But if you report your issue, I will help to look into it. 
  • • Install “Smooth Streaming Client SDK Beta 2″ from here

Create the JavaScript Windows Store Project

1. Click on File -> New ->Project and select Blank App under JavaScript Section Windows Store. It is the same as JavaScript Metro style application in RC but we no long use “Metro” this keyword.

2. Right click on Reference folder under the project tree in Solution Explorer. And Select Add Reference…

3. Adding the following references:

- Microsoft Smooth Streaming Client SDK Beta 2 for Windows 8

- Microsoft Visual C++ Runtime Package (The SDK depends on the Microsoft Visual C++ Runtime Package)

- Windows Library for JavaScript 1.0 (Noted: there are two here, RC is for VS RC JavaScript library, and 1.0 is for RTM)

4. Register Smooth Streaming Byte Stream Handler

Next, we must register the Smooth Streaming Byte Stream handler, which identifies the URL or MIME-type combination that is sent to the Smooth Streaming extension.

Add the following code in default.js:

5. Lastly we will add <video> to play Smooth Streaming video. Open default.html and add the following code into <body> section.

* Status of <video> for Adaptive Streaming support

Currently, <video> only supports progressive download in most of browsers. Only Safari implements Http-Live-Streaming (HLS) with <video> tag, but this is a non-standard implementation. None of the other browsers support Adaptive Streaming. This work is for IE browser in Metro Mode to support Adaptive Streaming (Smooth Streaming) , current IE (10) in desktop mode doesn’t have support for <Video> with Adaptive Streaming.

6. Change your platform type to x64, x86 or ARM depending on which platform you’re targeting, and then build your project.

Right click on Configuration Manager showed below.

Choose X64/X86/ARM depends on your target platform.

7. You should have your application up and running by pressing F5.

Now, enjoy big buck bunny! :) If you have any questions, let me know in comments. Thanks.

6 Responses to Building Windows Store Apps with Smooth Streaming Client SDK Beta 2
  1. [...] WCL332 Building Video Application on Windows 8 with Windows Azure Media Service Session Info: https://a... mingfeiy.com/windows-azure-media-services-teched-australia-2012
  2. [...] • Building Windows Store Apps with Smooth Streaming Client SDK Beta 2 (link) [...]... mingfeiy.com/building-video-application-on-windows-8-all-you-need-to-know
  3. Payday Loans from the smellybinman Reply

    We’re a group of volunteers and starting a brand new scheme in our community. Your website offered us with valuable info to work on. You have performed an impressive process and our entire community will likely be grateful to you.

  4. Karthik Reply

    The tutorial was very helpful. thank you very much. :)

    Is there any way of streaming non .ism video links?

    or a workaround to convert video URLs to .ism?

     

    Thanks in advance

    • mingfeiy Reply

      Hi Karthik, Which other streaming protocol you are looking for? We support HLS and DASH as well.

  5. Ram Reply

    Hi ,

    I was creating winRT class to use offline copy in javascript project. I was unable to find

    StreamState class, which namespace do I need to Add.

    Thanks

    Ram

Leave a Reply

Your email address will not be published. Please enter your name, email and a comment.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">