Manually adding UI creates duplicate video and controls elements

[gscragg]

If I use the Overlay constructor to add a shaka.ui.Overlay to an existing player instance at page load, then the auto scanning code runs on the already UI-ed player (and container).

Example player

Possible fixes:

1. Provide a way to stop the auto scanning code from running.
2. Make the auto scanning code check if the container already has a UI element attached:

if (typeof container['ui'] != 'undefined'){
  break;
}

[ismena]

Hi, @gscragg, thanks for reporting!
The autoscan code only adds UI to your page if you mark the container and/or video with shaka data attributes: data-shaka-player-container and data-shaka-player.
If we see that, we assume you want auto-setup.

If you're creating the UI object yourself, don't add the data attributes and the auto scan code won't touch it!

Are you creating the object yourself because you have a custom layout?
If that's the case, you can also change the auto-created layout by calling ui.configure(). that might be a bit less work than creating the object yourself.

Does this help? Let me know if you have any questions :)

[gscragg]

Based on the example I posted, I am not using data-shaka-player attributes, but the call to new shaka.ui.Overlay adds one to the container regardless (https://github.com/google/shaka-player/blob/master/ui/ui.js#L48)

Is using the Overlay constructor considered bad form? Is their a better way to programmatically add shaka UI to a player?

[joeyparrish]

You're right. I remember adding the attributes as part of the autoscan process to facilitate mass cleanup of the DOM in our automated tests.

[joeyparrish]

@ismena, would it be preferable to use the programmatic setup after the 'shaka-ui-loaded' event fires on document?

[ismena]

Oh! Sorry, the code base changed on me!
I'll fix it :)

You might want to wait until the 'shaka-ui-loaded' event has fired to create your UI object, though. It will ensure that shaka library has fully loaded and all the polyfills have been installed.

[gscragg]

Ok, I can probably do that. Thank you both for your responses.