Using our new .NET SDK to help you build great apps on the Universal Windows Platform

We are pleased to announcethat we have released a .NET SDK that embeds our HTML5 Player for the Windows UWP Platform.

This tutorial will cover:

  1. How to setup your Universal Project so that you can communicate with our player
  2. What can we do with this SDK?
  3. What do we plan on adding to the SDK

Project Init()

First we start like all projects, we create a new one:
In Visual Studio: File -> New -> Project
Then Universal -> Blank App
http://i.imgur.com/2FzYuRz.png

You can find the list of parameters that the player supports here .

As the SDK is a wrapper of a Webview with our HTML5 player in it. We will need to allow the Webview to be able to communicate with our App. To do this open the Package.appxmanifest file, under the Content Uri tab and add the following rule:

Uri: https://*.dailymotion.com/
Rule: include
WinRT Access: All

It should look as follows:
http://i.imgur.com/OgKljKF.png

Then, you'll need to add the player to your view, in my main page I have a Grid element called MyRootGrid and once the page is loaded we will instantiate the class DMPlayerController. When you've done this, load a video using the Load(videoId) method and then add the DmVideoPlayer property to our Grid.

You should have something as follow:

<Page  
    x:Class="DMVideoPlayer_Sample.MainPage"
          xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:DMVideoPlayer_Sample"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006">
        <Grid
            x:Name="MyRootGrid"
            Width="450"
            Height="350" />
</Page>  

And on the C# side:

        public MainPage()
        {
            this.InitializeComponent();
            Loaded += MainPage_Loaded;
        }       

        private void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            //init Controller
            dmPlayerController = new DMPlayerController();

            //Load video without any parameters
            dmPlayerController.Load("xl1km0");

            //Adding Player to the page  
            MyRootGrid.Children
           .Add(dmPlayerController.DmVideoPlayer);
        } 

And there you have it you should be able to view videos without a hitch.

What you can do with this SDK

When initializing the class DMPlayerController you can pass a certain number of parameters when calling the Load method that will allow you to customize the video player. Customization options range from autoplay to hiding the end screen, calling private of hidden videos, hiding the controls and so on...
A full list of available customizations can be found here.

/// Load a video with ID and optional OAuth token
/// - Parameter videoId:        The video's XID
/// - Parameter accessToken:    An optional OAuth token. If provided it will be passed as Bearer token to the player.
/// - Parameter withParameters: The list of configuration parameters that are passed to the player.
public void Load(string videoId, string accessToken = "", IDictionary<string, string> withParameters = null)  

Passing the accessToken will allow you to see your private or hidden video.

Passing Parameters can allow you to customize the video player, here is an example of the customization:

var parameters = new Dictionary<string, string>();  
parameters["autoplay"] = "true";  
parameters["ui-logo"] = "false";  
parameters["endscreen-enable"] = "false";  
parameters["mute"] = "true";  
parameters["controls"] = "false";  

This would tell the player to auto start, hide the ui logo, hide the end screen, hide the controls and tell the player, and mute the video player. (of course I don't recommend this)

The player can send you events informing you what what is it current status, by listening to the OnDmWebViewMessageUpdated Action you will be able to receive all of the events that the player can fire:

 private void loadHtmlVideo(string videoId)
        {
          .... Code here
          dmPlayerController.OnDmWebViewMessageUpdated +=                                     
                    DmPlayer_OnDmWebViewMessageUpdated;
        }
        private void DmPlayer_OnDmWebViewMessageUpdated()
        {
            Debug.WriteLine(dmPlayerController.DmWebViewMessage);
        }

Here is a small dump of what you would see in the output windows of Visual Studio:

dmevent:event=apiready  
dmevent:event=start  
dmevent:event=qualitiesavailable&qualities%5B%5D=480&qualities%5B%5D=380&qualities%5B%5D=240  
dmevent:event=ad_start&type=linear&position=preroll  
dmevent:event=durationchange&duration=12.034  
dmevent:event=ad_play  
dmevent:event=ad_timeupdate&time=0.009999999999999786  
dmevent:event=timeupdate&time=24.6369265  
dmevent:event=pause  
dmevent:event=fullscreen_toggle_requested  
dmevent:event=seeking&time=24.6369265  
dmevent:event=menu_did_show  
dmevent:event=progress&time=169.998622  
dmevent:event=volumechange&volume=0.8181818181818182&muted=false  
dmevent:event=volumechange&volume=0.4090909090909091&muted=false  
dmevent:event=menu_did_hide  
dmevent:event=menu_did_show  
dmevent:event=progress&time=180.0086665  
dmevent:event=qualitychange&quality=720  
dmevent:event=menu_did_hide  

Next, we will see how you can handle the play and pause actions on the player. Thanks to the Play() and Pause() methods in the DMPlayerController class you can easily play or pause a video like this:

//init class
var dmPlayerController = new DMPlayerController();  
//init video with a video id

//start playing the video
  dmPlayerController?.Play();

//pausing the video
  dmPlayerController?.Pause();

Advanced: handling the events fired from the player SDK

Here's an example around handling the Share event from the player. This is actually pretty straightforward. All you need to do is listen to the action OnDmWebViewMessageUpdated and when it's invoked, check to see what the value of the property DmWebViewMessageis.

Here's a full list of the events the player can send.

The future for this SDK

As you can see the SDK currently only supports the Universal Windows Platform. However, if there's a demand for it, we'll look into making it compatible with Windows 8.x and Windows Phone 8.x

If you think that this SDK is missing something please don't hesitate to ask for a feature on Github.

We'll do our best to regularly update the SDK so that it supports all windows platforms (Xbox, HoloLens, Tablet, Desktop, and Mobile)

Happy coding!