DashJS – MPEG Rockstar player

DashJS is one of powerful video player in web that i came across, the beauty is it need nothing more than video tag, No more bunch of DIV tags and CSS. The requirement of client is to play DRM protected video’s, so DashJS is the one stop solution for us and its managed by MPEG foundation so people who develop these are know what they are doing. Let me split down the DashJS,

Pre-Requirement:

  1. Simple video tag [Source is not required]<video> </video>tag
  2. dash.all.js library [Obviously]
    3.Internet Explore 11 or Latest chrome browser
    [Unfortunately firefox is not supported yet]

Stream video:

As the Dash player that uses .mpd that is nothing but a configuration for the video stream as

  • Bitrate’s available for the streaming video [480p,720p,1080p]
  • Audio & video file reference
  • Caption in format like VTT & TTML which can be parsed internally by the library.
  • Video location [Obviously]
    You may guessed plugin will parse the XML and get required data. So there is the less code in your page and less bugs.

Caption in DashJS:

As we provide caption along with video DashJS can read and parse it and showing it along with video using track that available along with video tag, that means no extra DIV and CSS that overloaded in DOM.

Using DashJS:

The below code will process the stream and play video using video tag that we have added in body.

    var url = &quot;http://dash.edgesuite.net/akamai/test/caption_test/ElephantsDream/elephants_dream_480p_heaac5_1.mpd&quot;;
    var context = new Dash.di.DashContext();
    var player = new MediaPlayer(context);
    player.startup();
    player.attachView(document.querySelector(&quot;#dashPlayer&quot;));
    player.attachSource(url);

Reference:
DashJS
DashJS Player Demo

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s