Is there a different approach that is more stable and works no matter whether it is j or h or anything else?
Can that part be written a different way in the code?
const iframe = player.h; https://jsfiddle.net/eo8s4zt9/
function onPlayerReady(event) {
player = event.target;
player.setVolume(100);
shufflePlaylist(player);
const iframe = player.h;
iframe.dispatchEvent(events.afterPlayerReady);
}
const iframe = player.h;
const eventHandler = eventHandlers.afterPlayerReady;
iframe.addEventListener("afterPlayerReady", eventHandler);
}
I was trying different things and found this that works.
Instead of using this: const iframe = player.h;
I can do this: https://jsfiddle.net/gobt8xe7/
Is this good?
const iframe = document.querySelector("iframe");
iframe.dispatchEvent(events.afterPlayerReady);
}
const iframe = document.querySelector("iframe");
const eventHandler = eventHandlers.afterPlayerReady;
iframe.addEventListener("afterPlayerReady", eventHandler);
}
Improving on that I can then do this: https://jsfiddle.net/z1kywacL/
function getIframe() {
return document.querySelector("iframe");
}
function shufflePlaylist(player) {
player.setShuffle(true);
player.playVideoAt(0);
player.stopVideo();
}
function onPlayerReady(event) {
player = event.target;
player.setVolume(100);
shufflePlaylist(player);
const iframe = getIframe();
iframe.dispatchEvent(events.afterPlayerReady);
}
function addPlayer(video) {
const playlist = "0dgNc5S8cLI,mnfmQe8Mv1g,-Xgi_way56U,CHahce95B1g";
const config = {
height: 360,
host: "https://www.youtube-nocookie.com",
width: 640
};
config.playerVars = {
autoplay: 0,
cc_load_policy: 0,
controls: 1,
disablekb: 1,
fs: 0,
iv_load_policy: 3,
loop: 1,
playlist,
rel: 0
};
config.events = {
"onReady": onPlayerReady
};
player = new YT.Player(video, config);
const iframe = getIframe();
const eventHandler = eventHandlers.afterPlayerReady;
iframe.addEventListener("afterPlayerReady", eventHandler);
}