CodeDevMLH/jellyfin-plugin-media-bar-enhanced
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 24 Wiki Activity

Improve video backdrop handling: optimize autoplay logic for fresh loads and enhance Safari compatibility with loadedmetadata event

Browse Source
This commit is contained in:
CodeDevMLH
2026-03-05 23:43:52 +01:00
parent 0d6b835486
commit 08fc29cba3
1 changed files with 27 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js
View File

@@ -2467,28 +2467,39 @@ const SlideshowManager = {
if (videoBackdrop.tagName === 'VIDEO') { if (videoBackdrop.tagName === 'VIDEO') {
// Restore src from data-src if it was deactivated to release connections // Restore src from data-src if it was deactivated to release connections
const lazySrc = videoBackdrop.getAttribute('data-src'); const lazySrc = videoBackdrop.getAttribute('data-src');
if (lazySrc && !videoBackdrop.src) { const isFreshLoad = lazySrc && !videoBackdrop.src;
videoBackdrop.src = lazySrc;
videoBackdrop.load();
}
videoBackdrop.currentTime = 0;
videoBackdrop.muted = STATE.slideshow.isMuted; videoBackdrop.muted = STATE.slideshow.isMuted;
if (!STATE.slideshow.isMuted) { if (!STATE.slideshow.isMuted) {
videoBackdrop.volume = 0.4; videoBackdrop.volume = 0.4;
} }
videoBackdrop.play().catch(e => { const doPlay = () => {
// Check if it actually started playing after a short delay (handling autoplay blocks) if (!currentSlide.classList.contains('active')) return;
setTimeout(() => { videoBackdrop.play().catch(e => {
if (videoBackdrop.paused && currentSlide.classList.contains('active')) { setTimeout(() => {
console.warn(`Autoplay blocked for ${currentItemId}, attempting muted fallback`); if (videoBackdrop.paused && currentSlide.classList.contains('active')) {
videoBackdrop.muted = true; console.warn(`Autoplay blocked for ${currentItemId}, attempting muted fallback`);
videoBackdrop.play().catch(err => console.error("Muted fallback failed", err)); videoBackdrop.muted = true;
} videoBackdrop.play().catch(err => console.error("Muted fallback failed", err));
}, 1000); }
}); }, 1000);
});
};
if (isFreshLoad) {
// Safari: set src, then wait for loadedmetadata before seeking/playing
videoBackdrop.src = lazySrc;
videoBackdrop.load();
videoBackdrop.addEventListener('loadedmetadata', () => {
videoBackdrop.currentTime = 0;
doPlay();
}, { once: true });
} else {
// src already set (e.g. paused slide resuming)
videoBackdrop.currentTime = 0;
doPlay();
}
} else if (STATE.slideshow.videoPlayers && STATE.slideshow.videoPlayers[currentItemId]) { } else if (STATE.slideshow.videoPlayers && STATE.slideshow.videoPlayers[currentItemId]) {
const player = STATE.slideshow.videoPlayers[currentItemId]; const player = STATE.slideshow.videoPlayers[currentItemId];
if (player && typeof player.loadVideoById === 'function' && player._videoId) { if (player && typeof player.loadVideoById === 'function' && player._videoId) {