Thursday 5 November 2020

how to hide / mask data-plyr-provider from html code

I am using plyr to play YouTube videos. I would like to hide the data-plyr-provider definition from the html file. It is always going to be YouTube.

Currently I am using this code

<div class="container">
    <div id="player" data-plyr-provider="youtube" data-plyr-embed-id="somegoogleid"></div>
</div>
<script src='https://web.con/124141/users/plyr/plyr.min.js'></script>
<script>
const player = new Plyr('#player', {});
// Expose player so it can be used from the console
window.player = player;
</script>

What I want to hide is the code in the red box https://i.imgur.com/0BELK9V.png

I was thinking that I can modify plyr.min.js I am using and hardcode the string YouTube but when looking into the code I am not able to do so. I mean I cannot find the right place.

The only reference of data-plyr-provider in the .js I found is this line

attributes: { embed: { provider: "data-plyr-provider", id: "data-plyr-embed-id" } },

Can some one help? Where to modify the code or if there is any other way how to hide plyr.min.js



from how to hide / mask data-plyr-provider from html code

No comments:

Post a Comment