Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Code Block
languagetext
linenumberstrue
<!DOCTYPE html>
<html>
<head>
</head>
<body>

<div id="player_container"></div>

<script type="text/javascript">

	//select subtitle track from available tracks
	function getEnSubTrackId(textTracks) {
    	for(var i = 0; i < textTracks.length; i++)
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Page Title</title>
    <script>
      window.addEventListener("load", (event) => {
        setTimeout(function () {
            var trackplayer = textTracks[i]VideoPlayer.Collection.getPlayerById("user-defined-id");
          var tracks = if(track['language'] == 'en')
player.getTextTracks() || [];
          if (tracks[0] && tracks[0].id) {
                return track['id'];
  player.setTextTrack(tracks[0].id)
          }
        }, 2000);
      });
   return ""; </script>
  </head>
  }<body>
    <div
    //create a new player instance (vmpro)
	function createPlayer() {
		var initPlayer = {
			success: function (playerApi) {
				var enTrack = getEnSubTrackId(playerApi.getTextTracks()); mi24-video-player
      id="user-defined-id"
      video-id="video-id"
      player-id="player-id"
      	playerApi.setTextTrack(enTrack);
			},
			parameters: {
				configType: 'vmpro',
				playerId: '<PlayerID>',
				videoId: '<VideoID>',
				apiUrl: '//dchannel-id="channel-id"
      config-type="vmpro"
      flash-path="//e.video-cdn.net/v2/play',
				flashPath: '//e"
      api-url="//d.video-cdn.net/v2/'
			}
		};

		VideoPlayer.Collection.addPlayerById('player_container', initPlayer);
	}

	//add the player
	var head = document.getElementsByTagName('head')[0];
	var script = document.createElement('script');
	script.type = 'text/javascript';
	script.src = 'play"
    ></div>
    <script src="//e.video-cdn.net/v2/embed.js';
	head.appendChild(script);
	
	script.onload = (function () {
		createPlayer();
	});

</script>

"></script>
  </body>
</html>


The example above gets a list of track objects (using the API's "getTextTracks" function on line 28) and passes it into a new function, "getEnSubTrackId" (defined starting on line 12). This function finds the preferred subtitle track in the available tracks and either outputs its ID, or outputs an empty string if it can't find it. This example looks for the English subtitles track but there are many ways a preferred track can be selected; adjust the function to fit your needs. With the preferred track ID, the "setTextTrack" function is called (on line 29) to automatically enable these subtitles. Now when the video plays, the selected subtitles will play with the video). If there are text tracks present, it enables the first one automatically.
We added a 2000ms timeout for convenience (to give the player time to load). Feel free to modify this logic, as it is not related to the subtitles functionality.