Radiant Player Web
This guide is for integrating the MediaMelon Player SDK for the javascript based RadiantPlayer Web v7
Step 1: Add the MediaMelonPlayer SDK
Add the following lines to the web page before RadiantPlayer js files are loaded.
<script type="text/javascript" src="https://PATH_TO_MEDIAMELON_PLAYER_SDK/mmsmartstreaming_radiantplayer.min.js"></script>
// Include Radiant Media Player - here we use the optimised build for Shaka player
<script src="https://cdn.radiantmediatechs.com/rmp/7.10.0/js/rmp-shaka.min.js"></script>
// Include Radiant Media Player - here we use the optimised build for hls.js
// <script src="https://cdn.radiantmediatechs.com/rmp/7.10.0/js/rmp-hlsjs.min.js"></script>Step 2: Register and Initialize the MediaMelon Player SDK
After the player instance has been created, create a new Plugin object, register, report player Info and then initialize the plugin as shown below:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<title>Radiant Media Player - Example</title>
</head>
<body>
<script type='text/javascript' src='./mmsmartstreaming_radiantplayer.min.js'></script>
<!-- Include Radiant Media Player - here we use the optimised build for Shaka player -->
<script src="https://cdn.radiantmediatechs.com/rmp/7.10.0/js/rmp-shaka.min.js"></script>
<!-- Include Radiant Media Player - here we use the optimised build for hls.js -->
<!-- <script src="https://cdn.radiantmediatechs.com/rmp/5.3.5/js/rmp-hlsjs.min.js"></script> -->
<!-- Player container -->
<div id="rmpPlayer"></div>
<script>
var playlistData = [{
src: {
hls: "https://bitdash-a.akamaihd.net/content/MI201109210084_1/m3u8s/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.m3u8"
},
poster: "https://www.radiantmediaplayer.com/media/playlist/poster/item-1.jpg",
thumbnail: "https://www.radiantmediaplayer.com/media/playlist/poster/item-1-thumbnail.jpg",
adTagUrl: "https://www.radiantmediaplayer.com/vast/tags/inline-linear.xml",
contentTitle: "Playlist Item 1",
contentDescription: "Description for playlist item 1",
"mmVideoAssetInfo": {
"assetName": "ASSET_NAME",
"assetId": "ASSET_ID",
"videoId": "VIDEO_ID",
"contentType": "CONTENT_TYPE",
"genre": "GENRE",
"drmProtection": "DRM_PROTECTION",
"episodeNumber": "EPISODE_NUMBER",
"season": "SEASON",
"seriesTitle": "SERIES_TITLE",
"videoType": "VIDEO_TYPE",
"customTags": {
"key1": "VALUE_STRING1",
"key2": "VALUE_STRING2"
}
}
}];
var settings = {
licenseKey: 'ENTER_THE_LICENSE_KEY',
skin: 's1',
width: 640,
height: 360,
pathToRmpFiles: '../',
playlistUpNextAutoplay: true,
playlistEndedLoop: false,
playlistData: playlistData
};
// init player
var elementID = 'rmpPlayer';
var rmp = new RadiantMP(elementID);
rmp.init(settings);
// MediaMelon integration
var rmpPlugin = new mmRadiantJSAdapter();
if (rmpPlugin.getRegistrationStatus() === false) {
rmpPlugin.registerMMSmartStreaming("PLAYER_NAME", "CUSTOMER_ID", "SUBSCRIBER_ID", "DOMAIN_NAME", "SUBSCRIBER_TYPE", "SUBSCRIBER_TAG");
rmpPlugin.reportPlayerInfo("PLAYER_BRAND", "PLAYER_MODEL", "PLAYER_VERSION");
}
var isLive = false; //Set this to true for a live stream or false for a VOD stream
// If isLive is not set here, it will be handled internally by the SDK.
rmpPlugin.initialize(rmp, isLive);
</script>
</body>
</html>Last updated