Bitmovin Web (Nowtilus SSAI)

Step 1: Add MediaMelon SDK

Integrate the MediaMelon SmartStreaming SDK with the Bitmovin JS Player. Include the following line to the web page before bitmovinplayer.js is loaded

<script type="text/javascript" src="path-to/mmsmartstreaming-bitmovin-ssai.js" ></script>
<script type="text/javascript" src="path-to/bitmovinplayer.js"></script>

This MediaMelon SDK has been verified for Bitmovin Web v8.45.1 and v8.57.0

Step 2: Register and Initialize MediaMelon SDK

Note: <customer_id> is your MediaMelon-assigned Customer ID. If you do not know your Customer ID contact MediaMelon at support@mediamelon.com

Create a new plugin object and after the player instance has been created, register it, report player information, and then initialize the SmartSight plugin as shown below:

var MMBitmovinPlugin= new BitmovinPlayerMMSSIntgr();
  const config = {
      key: 'Bitmovin_license',
      adaptation: {
          desktop: {
              onVideoAdaptation: MMBitmovinPlugin.onVideoAdaptationMediaMelon,
           },
           mobile: {
              onVideoAdaptation: MMBitmovinPlugin.onVideoAdaptationMediaMelon,
          },
      }
  };

  var container = document.getElementById('my-player');
  var player = new bitmovin.player.Player(container, config);
  MMBitmovinPlugin.registerMMSmartStreaming(<player_name>, <customer_id>, <subscriber_id>, <domain_name>, <subscriber_type> , <subscriber_tag>);
  MMBitmovinPlugin.reportPlayerInfo(<player_brand>, <player_model>, <player_version>);
  MMBitmovinPlugin.initialize(player); // Please do not initialize if you want to use Ad events, Please follow intialize player in Step 5

Please do not initialize the MediaMelon SDK right now if you are going to subscribe to Ad Events

Step 3: Report Player load error

Notify Bitmovin load failure using reportPlayerError api as shown below:

player.load(source).then(function () {
     // Success
  },function (reason) {
      // Error!
      MMBitmovinPlugin.reportPlayerError(reason, source);
  });

Step 4: Providing Content Metadata and Custom Tags

You can also provide the Content Metadata and Custom Tags as shown below in html/js while setting source information. Please use the mmVideoAssetInfo structure to provide this information.

 var source = {
 dash: 'https://bitmovin-a.akamaihd.net/content/MI201109210084_1/mpds/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.mpd',
 hls: 'https://bitmovin-a.akamaihd.net/content/MI201109210084_1/m3u8s/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.m3u8',
 progressive: 'https://bitmovin-a.akamaihd.net/content/MI201109210084_1/MI201109210084_mpeg-4_hd_high_1080p25_10mbits.mp4',
 poster: 'https://bitmovin-a.akamaihd.net/content/MI201109210084_1/poster.jpg',
 mmVideoAssetInfo: {
     "assetName":"ASSETNAME_STRING/Episode Name",
     "assetId": "ASSETID_STRING",
     "videoId": "VIDEOID_STRING",
     "contentType": "Genre of the content (episode, movies, etc)",
     "drmProtection": "DRM type used (Widevine, Playready, etc)",
     "episodeNumber": "Episode Number, e.g., 2 or E2",
     "season":"Season number of the Series Title, e.g, 2 or S2",
     "seriesTitle": "Series Title",
     "customTags":{
         "key1": "VALUE_STRING1",
         "key2": "VALUE_STRING2",
         "key3": "VALUE_STRING3"
         }
     }
  };

Step 5: Registering for Ad events for disabling Player controls

var NowtilusAdPlugin =new mmNowtilusSSAIPlugin(player)

NowtilusAdPlugin.addListener('start', function(adinfo){
        console.log("AD start");
        //** Application to Disable Player Controls here **
    });
NowtilusAdPlugin.addListener('complete', function(adinfo){
        console.log("AD complete");
        //** Application to Enable Player Controls here **
    });
MMBitmovinPlugin.initialize(player,undefined,NowtilusAdPlugin);

Remember to initialize MediaMelon SDK

MMBitmovinPlugin.initialize(player,undefined,NowtilusAdPlugin);

Step 6: Update Asset Info

If Asset Information needs to be updated dynamically during the live session without re-initiating the player, then the updateAssetInfo API can be used to update the new AssetInfo

Note

  • This API must be called for updating asset info for the live streams only

  • This API must be called after the Player has started the playback of the live stream

  • New Asset Info Object will override the previous values, Hence set all the fields that are required every time calling this API

// Create a new assetInfo object with the values need to be updated
var newAssetInfo =  { 
     "assetName":"ASSETNAME_STRING/Episode Name",
     "assetId": "ASSETID_STRING",
     "videoId": "VIDEOID_STRING",
     "contentType": "Genre of the content (episode, movies, etc)",
     "drmProtection": "DRM type used (Widevine, Playready, etc)",
     "episodeNumber": "Episode Number, e.g., 2 or E2",
     "season":"Season number of the Series Title, e.g, 2 or S2",
     "seriesTitle": "Series Title",
     "customTags":{
         "key1": "VALUE_STRING1",
         "key2": "VALUE_STRING2",
         "key3": "VALUE_STRING3"              
             }          
         }
// Update the new assetInfo

Last updated