Overview
This guide will demonstrate how to configure the player's track labels.
The Kaltura Player exposes the configuration and APIs that are used for controlling the tracks and tracks labels.
Every track label can be changed using the player customLabels which is configured on the player root-level configuration object.
Kaltura Player config Playkit config
customLabels: { //qualities: translateVideoQuality, qualities: function (videoTrack) { if (videoTrack.height > 500) { return 'High'; } return 'Low'; }, captions: translateLangCode, audio: translateLangCode }
Video Tracks Labels: translation function
Video Track has the following parameters which can be used for implementing the label logic
VideoTrack structure:
{ "active": false, "label": "360p", "language": "", "index": 1, "available": true, "bandwidth": 719794, "width": 640, "height": 360 }
const translateVideoQuality = (track) => { if (track.height > 500) { return 'High'; } return 'Low'; };
AudioText Tracks Labels: translation function
Audio/Text Tracks have the following parameters which can be used for implementing the labels logic
AudioTrack structure:
{ "id": 0, "active": false, "label": "English", "language": "en", "index": 0, "available": true }
TextTrack structure:
{ "id": 1, "active": true, "label": "Esp", "language": "es", "index": 1, "available": true, "kind": "subtitles", "default": false }
const translateLangCode = (track) => { if (track.language === "es" || track.language === "spa") { return 'Spanish'; } else if (track.language === "en" || track.language === "eng") { return 'English'; } return track.label; };
Tracks UI control
The tracks can be changed using the settings icon for video tracks and the globes icon for audio and text tracks
Example:
Tracks Documentation
