From 08fc29cba3b96d142096693906e4ae315e8b68bd Mon Sep 17 00:00:00 2001
From: CodeDevMLH <145071728+CodeDevMLH@users.noreply.github.com>
Date: Thu, 5 Mar 2026 23:43:52 +0100
Subject: [PATCH] Improve video backdrop handling: optimize autoplay logic for
 fresh loads and enhance Safari compatibility with loadedmetadata event

---
 .../Web/mediaBarEnhanced.js                   | 43 ++++++++++++-------
 1 file changed, 27 insertions(+), 16 deletions(-)

diff --git a/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js b/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js
index 2faf690..0bf311c 100644
--- a/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js
+++ b/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js
@@ -2467,28 +2467,39 @@ const SlideshowManager = {
         if (videoBackdrop.tagName === 'VIDEO') {
           // Restore src from data-src if it was deactivated to release connections
           const lazySrc = videoBackdrop.getAttribute('data-src');
-          if (lazySrc && !videoBackdrop.src) {
-            videoBackdrop.src = lazySrc;
-            videoBackdrop.load();
-          }
-
-          videoBackdrop.currentTime = 0;
+          const isFreshLoad = lazySrc && !videoBackdrop.src;
 
           videoBackdrop.muted = STATE.slideshow.isMuted;
           if (!STATE.slideshow.isMuted) {
             videoBackdrop.volume = 0.4;
           }
 
-          videoBackdrop.play().catch(e => {
-            // Check if it actually started playing after a short delay (handling autoplay blocks)
-            setTimeout(() => {
-              if (videoBackdrop.paused && currentSlide.classList.contains('active')) {
-                console.warn(`Autoplay blocked for ${currentItemId}, attempting muted fallback`);
-                videoBackdrop.muted = true;
-                videoBackdrop.play().catch(err => console.error("Muted fallback failed", err));
-              }
-            }, 1000);
-          });
+          const doPlay = () => {
+            if (!currentSlide.classList.contains('active')) return;
+            videoBackdrop.play().catch(e => {
+              setTimeout(() => {
+                if (videoBackdrop.paused && currentSlide.classList.contains('active')) {
+                  console.warn(`Autoplay blocked for ${currentItemId}, attempting muted fallback`);
+                  videoBackdrop.muted = true;
+                  videoBackdrop.play().catch(err => console.error("Muted fallback failed", err));
+                }
+              }, 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]) {
           const player = STATE.slideshow.videoPlayers[currentItemId];
           if (player && typeof player.loadVideoById === 'function' && player._videoId) {