To provide advanced video analytics with our player we support out-of-the-box integration with Mux Data platform. Our integration has been tested for Mux Data v4+. The following features are supported:
muxDataSettings: Object
Pass Mux
Data metadata to the player to enable Mux Data support. A env_key property for the
data object of the muxDataSettings object is required for Mux Data support to be enabled in our player. See below for a complete example. The
player_init_time property is automatically set by the player. Default:
{}.
muxDataUseListData: Boolean
Automatically emit data to Mux Data when a
source
change happens with our playlist/related layout. Only the video_title property will be updated. If you want to update more properties a custom implementation is required. See below for an example. Default:
true.
<!-- Include Mux Data library --> <script src="https://src.litix.io/core/4/mux.js"></script> <!-- Include Radiant Media Player library --> <script src="https://cdn.radiantmediatechs.com/rmp/8.4.10/js/rmp.min.js"></script> <div id="rmp"></div> <script> const src = { hls: 'https://your-hls-url.m3u8' }; // Define Mux Data settings const muxDataSettings = { debug: false, data: { env_key: 'your-mux-data-env-key', viewer_user_id: 'viewer-user-id', video_title: 'video-title', player_name: 'player-name', // if not provided will default to 'radiantmediaplayer' player_version: 'player-version' // if not provided will default to Radiant Media Player currently used version // player_init_time will automatically be set by player at run time } }; const settings = { licenseKey: 'your-license-key', src: src, width: 640, height: 360, contentMetadata: { poster: [ 'https://your-poster-url.jpg' ] }, // Pass Mux Data settings muxDataSettings: muxDataSettings }; const rmp = new RadiantMP('rmp'); rmp.init(settings); </script>
<!-- Include Mux Data library for Shaka player --> <script src="https://src.litix.io/shakaplayer/4/shakaplayer-mux.js"></script> <!-- Include Radiant Media Player library --> <script src="https://cdn.radiantmediatechs.com/rmp/8.4.10/js/rmp.min.js"></script> <div id="rmp"></div> <script> const src = { dash: 'https://your-hls-url.mpd' }; // Define Mux Data settings const muxDataSettings = { debug: false, data: { env_key: 'your-mux-data-env-key', viewer_user_id: 'viewer-user-id', video_title: 'video-title', player_name: 'player-name', // if not provided will default to 'radiantmediaplayer' player_version: 'player-version' // if not provided will default to Radiant Media Player currently used version // player_init_time will automatically be set by player at run time } }; const settings = { licenseKey: 'your-license-key', src: src, width: 640, height: 360, contentMetadata: { poster: [ 'https://your-poster-url.jpg' ] }, // Pass Mux Data settings muxDataSettings: muxDataSettings }; const rmp = new RadiantMP('rmp'); rmp.init(settings); </script>
For playlist and related the player will automatically
emit
source change data to Mux Data when the muxDataUseListData setting is set to true (this is default for playlist/related). By default only the video_title property will be updated as content changes in
the player. For custom integration of playlist/related with Mux Data or when using the setSrc API here is an example of source change handling with more metadata:
const elementID = 'rmp';
const rmp = new RadiantMP(elementID);
const rmpContainer = document.getElementById(elementID);
rmpContainer.addEventListener('srcchanging', () => {
// content starts changing in the player
// we signal this change to Mux Data
if (typeof window.mux !== 'undefined') {
window.mux.emit('#' + elementID + ' .rmp-video', 'videochange', {
video_id: 'new-video-id',
video_title: 'new-video-title',
video_series: 'new-video-series'
});
}
});
©2015-2022 Radiant Media Player. All Rights Reserved.