Shaka-player: External Subtitles don't get displayed

Created on 24 Sep 2018 · 8Comments · Source: google/shaka-player

Have you read the FAQ and checked for duplicate open issues?:
Yes
What version of Shaka Player are you using?:
2.4.4, 2.5.0-beta
Can you reproduce the issue with our latest release version?:
Yes
Can you reproduce the issue with the latest code from master?:
Have not tried
Are you using the demo app or your own custom app?:
Custom
If custom app, can you reproduce the issue using our demo app?:
Unsure how
What browser and OS are you using?:
Chrome 69.0.3497.100
Windows 10
What are the manifest and license server URIs?:
Any
What did you do?
Added subtitle track via addTextTrack, but is not shown or selectable via the UI

    player.load(manifestUri).then(function() {
        player.addTextTrack('/darkroom_timer.vtt', 'eng', 'subtitle', 'text/vtt', '',  'English')
    }).catch(onError);

What did you expect to happen?

When hitting the CC button, to have the option of a 'English' subtitle. This works if adding it in the section of the HTML manually.

What actually happened?

Hitting CC only showed the usual 'Shaka Player TextTrack' and selecting it did nothing.

shaka

* Additional *

I am very new to using this, so it is probably user error, but have tried for a few days to no avail. Any help would be appreciated!

WebVTT file

WEBVTT

00:01.000 --> 00:03.000
This is a custom darkroom timer

00:04.000 --> 00:07.000
Created with a raspberry pi

HTML File

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/2.5.0-beta/shaka-player.compiled.debug.js" type="application/javascript"></script>
</head>
<body>
<video id="video"
       width="640"
       controls autoplay>
    <!--<track label="English" kind="subtitles" srclang="eng" src="/darkroom_timer.vtt" type="text/vtt" >-->

</video>

<script>
  var manifestUri = '/output/stream.mpd';

  function initApp() {
    shaka.polyfill.installAll();
    if (shaka.Player.isBrowserSupported()) {
      initPlayer();
    } else {
      console.error('Browser not supported!');
    }
  }

  function initPlayer() {
    var video = document.getElementById('video');
    var player = new shaka.Player(video);
    player.configure({
          drm: {
            clearKeys: {
              '11111111111111111111111111111111': '11111111111111111111111111111111',
            }
          },
          preferredTextLanguage: 'eng',
          preferredAudioLanguage: 'eng',
          streaming: {
            bufferingGoal: 120
          }
        }
    );
    window.player = player;
    player.addEventListener('error', onErrorEvent);
    player.load(manifestUri).then(function() {
        player.addTextTrack('/darkroom_timer.vtt', 'eng', 'subtitle', 'text/vtt', '',  'English')
        console.log('The video has now been loaded!');
    }).catch(onError);
  }

  function onErrorEvent(event) {
    onError(event.detail);
  }

  function onError(error) {
    console.error('Error code', error.code, 'object', error);
  }

  document.addEventListener('DOMContentLoaded', initApp);

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

archived bug

Source

cdgriffith

All 8 comments

Hi @cdgriffith, thanks for reaching out!
Could you give us the link to your manifest and subtitles, so we can repro?
(You can send them privately to [email protected], if you'd like)

I have a couple of theories on what might be going on, but want to check with your content, if possible.

ismena on 25 Sep 2018

Sure, everything should be attached in a zip file. I just serve the directory with python -m http.server

subtitle_error.zip

cdgriffith on 25 Sep 2018

Thanks for the content!

The player seems to think the list of text cues id empty. I'll investigate.

As an aside (for the team), we don't communicate the text streams' information to the native controls. As a result, any content with subtitles, regardless how many tracks, results in a single "Shaka embedded track" entry. We should consider explicitly adding track objects to the video element, so they're accessible to native controls users.

ismena on 25 Sep 2018

👍1

Okay, the latest master should be good now.

I noticed that you're using Chrome's native media controls.
Please note that although subtitles will be displayed when captions button is pressed, the native UI will still say "Shaka Embedded track". That's because we don't pass tracks info to the native controls. We probably should, but at this point I'm not sure how much work is needed to accomplish that, so more research is needed.

ismena on 26 Sep 2018

Tested and confirmed working for me, thanks for the fast fix!

Just as a heads up to anyone else using it, this method currently only supports a single track (as @ismena stated) and will always be the last one added, regardless if it is labeled 'caption' or 'subtitle'.

cdgriffith on 26 Sep 2018

The one native track represents what is currently streaming from Shaka Player. You can change what we stream using player.selectTextLanguage or player.selectTextTrack; you can query languages and tracks with player.getTextLanguages and player.getTextTracks respectively. By default we play the latest added, but you can change this later.

Also note that if you are using native controls, you may need to set the streaming.alwaysStreamText configuration to ensure we play it. We have no way of detecting when the text track is showing. By default we only download text streams when they are visible. So if you change the native track's visibility without using the player (player.setTextTrackVisbility), then we won't stream it. You can set to always stream text with player.configure('streaming.alwaysStreamText', true).

As for why we only have one native track, it is because we want to stream only what is being displayed. If we had multiple native tracks for different languages, we would have to download all of them since it would be hard (or impossible) to determine which is currently displayed and get events when it changes. So we reuse the same native track and handle buffering and changing languages internally.

TheModMaker on 26 Sep 2018

👍1

FYI, we are currently working on a UI layer for the player, that will allow for text track selection from the UI, listing all the text tracks available.

ismena on 26 Sep 2018

👍1

Fix cherry-picked to v2.4.5.