Closed zkisaboss closed 1 month ago
I tried this and it's much snappier, gonna read some docs and see why.
window.addEventListener("focus", () => jwplayer().play());
window.addEventListener("blur", () => jwplayer().pause());
I always thought more eventlisteners was worse.
hianime.to blocks access to the dev console. Try something like this
document.addEventListener('canplay', fn)
document.addEventListener('play', fn)
document.addEventListener('playing', fn)
document.addEventListener('visibilitychange', () => {
console.log(document.hidden)
switch (document.visibilityState) {
case 'hidden':
jwplayer().pause();
break;
case 'visible':
jwplayer().play()
break;
}
});
there are different approaches. Perhaps the problem is in iframe + CORS
// Auto selects highest quality (requires CORS)
setTimeout(function() {
let iframe = document.querySelector("#iframe-embed");
let command = "jwplayer().setCurrentQuality(1)";
if (iframe) {
iframe.contentWindow.eval(command);
}
}, 3000);
Note! document.visibilityState
update after window.blur
event
I always thought more eventlisteners was worse.
it doesn’t matter, the problem is inheritance. But he will try to catch before others
document.addEventListener('play', fn, { capture: true, once: true }) // only once optional (doesn't work without capture) document.addEventListener('play', fn, { capture: true }) // before others
Also the event listeners for "blur" and "focus" apply to the iframe but not the tab focus, was there a different one for that? because right now it's just seeing if the iframe is focused and not the entire tab with:
document.addEventListener("focus", fn); document.addEventListener("blur", fn);
if i use 'blur' and 'focus' its way snappier and actually pauses instantly but also pauses if i click anything outside the iframe window.addEventListener('blur', ...); window.addEventListener('focus', ...);
if i use visibilitychange i get the intended functionality but with half a second of lag which completely breaks the seamlessness document.addEventListener('visibilitychange', () => { if (document.visibilityState === 'visible') { ... } else { ... } });
But for enabling the highest quality i can use the event listener with 'load' and that seems to work for my use case.
I'm not sure but try both methods just change this one
window.addEventListener("focus", () =>document.hidden || jwplayer().play());
window.addEventListener("blur", () => document.hidden && jwplayer().pause());
I hope you're doing well!