Radiant Media Player

Player labels



Introduction

HTML5 Flash

Customisable player labels is new with Radiant Media Player 3.0.0

You can translate or customise player labels (text written within the player UI) through the labels player settings. This option is only available for HTML5 video (i.e. not for Flash).


Example

The following player is displayed with player labels tuned for French.


Player setup

Player code for the above example:

<script src="https://cdn.radiantmediatechs.com/rmp/v3/latest/js/rmp.min.js"></script>
<!-- Set up your wrapper div with its unique id -->
<div id="rmpPlayer"></div>
<!-- Set up player configuration options -->
<script>
var ccFiles = [
  ['fr', 'Français', 'media/cc-fr.vtt', 'default'],
  ['en', 'Anglais', 'media/cc.vtt']

];
var bitrates = {
  mp4: [
    'https://rmpsite-1479.kxcdn.com/media/bbb-360p.mp4',
    'https://rmpsite-1479.kxcdn.com/media/bbb-720p.mp4'
  ]
};
// Here goes our labels
var labels = {
  bitrates: {
    renditions: ['Basse qualité', 'Haute qualité']
  },
  hint: {
    sharing: 'Partager',
    quality: 'Qualité',
    speed: 'Vitesse',
    captions: 'Sous-titres',
    cast: 'Caster'
  },
  captions: {
    off: 'Arrêt'
  }
};
// Player settings
var settings = {
  bitrates: bitrates,
  licenseKey: 'your-license-key',
  width: 640,
  height: 360,
  skin: 's4',
  nav: true,
  sharing: true,
  ccFiles: ccFiles,
  labels: labels,
  poster: 'https://www.radiantmediaplayer.com/images/poster-rmp-showcase.jpg'
};
// Create and init player
var elementID = 'rmpPlayer';
var rmp = new RadiantMP(elementID);
rmp.init(settings);
</script>

Available labels and default values

Below is a list of all customisable player labels:

HTML5 + Flash labels

labels: {
  bitrates: {
    auto: 'Auto'
  },
  hint: {
    live: 'Live'
  },
  ads: {
    controlBarCustomMessage: 'Ad'
  },
  captions: {
    off: 'Off'
  },
  error: {
    customErrorMessage: 'This content is currently unavailable.',
    noSupportMessage: 'No playback support',
    noSupportDownload: 'You may download video here.',
    noSupportInstallChrome: 'You may want to use the latest version of Google Chrome to view this content.'
  }
}

HTML5-only labels

labels: {
  bitrates: {
    renditions: ['Low', 'Med', 'High']
  },
  hint: {
    sharing: 'Share',
    quality: 'Quality',
    speed: 'Speed',
    captions: 'Captions',
    audio: 'Audio',
    cast: 'Cast'
    playlist: 'Playlist'
  }
}

Flash-only labels

labels: {
  flash: {
    defaultAudioLabel: 'English'
  }
}

This label is used for multi-audio HLS streams in Flash.


Hiding external player labels

If you do not want player external player labels to be shown within the player you can hide them with the hideExternalPlayerLabels setting. This setting must be Boolean either true or false. false is the default.


Support notes

Most labels should be self-explanatory.

The renditions label only applies for MP4 and WebM progressive download use cases in HTML5 video. For HLS or MPEG-DASH renditions information (rendition height and bitrate) are displayed instead. You can tune the auto label for HLS or MPEG-DASH in HTML5 or Flash video.

For HTML5 video labels are set using the JavaScript textContent property. Take this into account when using special characters.

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License.