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>
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 [email protected]
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);
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
// 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
Was this helpful?