Subtitles icon when loading with javascript

[Solved]

Michael 2 years, 1 month ago
Hi,
when we use WP shortcode with subtitles

[fvplayer subtitles=""]

it loads the video and there is a subtitles icon on the player.

But when we use javascript to load a new video with this code:
```
flowPlayer = jQuery(".flowplayer").data('flowplayer');
flowPlayer.load([{mpegurl: url}]);
```
And this event that loads the subtitles, we can see the subtitles active, but there is no icon on the player to turn it off.
```
flowplayer( function(api,root) {
  api.on('ready', function(e,api,time) {
    let subTitles = "https://cdn.foliovision.com/wp-content/themes/subtitles/lectures/example.vtt"; 
    let subtitle_list = [
      {
        label: "English",
        lang: "en",
        src: subTitles
      }
    ];
    api.video.subtitles = subtitle_list;
    api.loadSubtitles(0); // subtitle index
  });
});
```

Viewing 2 replies - 1 through 2 (of 2 total)

Martin 2 years ago

Hello Michael,

the subtitle menu is also created on the ready event, so it’s probably too late. Try moving your code to the load event and it might just work.

Other than that I’m not sure why not simply provide the subtitles configuration in the load() call. I added a code sample to https://foliovision.com/player/developers/api-programming#js-usage -> “Here’s the code if you also need subtitles:”

Thanks,
Martin

Michael 2 years ago

Hi Martin, Thanks that worked.

We didn’t know the exact parameter structure to use in the load() function, but with your example we made it work.

Viewing 2 replies - 1 through 2 (of 2 total)