Update manifest.json for release v1.6.1.21 [skip ci]

Jellyfin.Plugin.MediaBarEnhanced/Jellyfin.Plugin.MediaBarEnhanced.csproj

@@ -12,7 +12,7 @@
     <!-- <TreatWarningsAsErrors>false</TreatWarningsAsErrors> -->
     <Title>Jellyfin Media Bar Enhanced Plugin</Title>
     <Authors>CodeDevMLH</Authors>
-    <Version>1.6.1.20</Version>
+    <Version>1.6.1.21</Version>
     <RepositoryUrl>https://github.com/CodeDevMLH/jellyfin-plugin-media-bar-enhanced</RepositoryUrl>
   </PropertyGroup>
 

Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js

@@ -1719,6 +1719,13 @@ const SlideCreator = {
                   if (iframe) {
                     iframe.setAttribute('tabindex', '-1');
                     iframe.setAttribute('inert', '');
+                    // Preserve video-backdrop class on the iframe (YT API replaces the original div)
+                    iframe.classList.add('backdrop', 'video-backdrop');
+                    if (CONFIG.fullWidthVideo) {
+                      iframe.classList.add('video-backdrop-full');
+                    } else {
+                      iframe.classList.add('video-backdrop-default');
+                    }
                   }
 
                   // Store start/end time and videoId for later use
@@ -2333,7 +2340,10 @@ const SlideshowManager = {
       // Manage Video Playback: Stop others, Play current
       this.pauseOtherVideos(currentItemId);
 
-      const hasVideoBackdrop = !!currentSlide.querySelector('.video-backdrop');
+      // Check for video backdrop (also check by YouTube player ID since YT replaces div with iframe)
+      const hasVideoBackdrop = !!(currentSlide.querySelector('.video-backdrop') || 
+        currentSlide.querySelector(`#youtube-player-${currentItemId}`) ||
+        (STATE.slideshow.videoPlayers && STATE.slideshow.videoPlayers[currentItemId]));
 
       // If paused and new slide has video, un-pause for video playback.
       // If paused and new slide has only images, stay paused.
@@ -2391,7 +2401,9 @@ const SlideshowManager = {
       this.updateDots();
 
       // Only restart interval if we are NOT waiting for a video to end
-      const hasVideo = currentSlide.querySelector('.video-backdrop');
+      const hasVideo = currentSlide.querySelector('.video-backdrop') || 
+        currentSlide.querySelector(`#youtube-player-${currentItemId}`) ||
+        (STATE.slideshow.videoPlayers && STATE.slideshow.videoPlayers[currentItemId]);
       if (STATE.slideshow.slideInterval && !STATE.slideshow.isPaused) {
         if (CONFIG.waitForTrailerToEnd && hasVideo) {
           STATE.slideshow.slideInterval.stop();
@@ -2653,7 +2665,9 @@ const SlideshowManager = {
       // Only restart interval if we are NOT waiting for a video to end
       const currentItemId = STATE.slideshow.itemIds[STATE.slideshow.currentSlideIndex];
       const currentSlide = document.querySelector(`.slide[data-item-id="${currentItemId}"]`);
-      const hasVideo = currentSlide && currentSlide.querySelector('.video-backdrop');
+      const hasVideo = currentSlide && (currentSlide.querySelector('.video-backdrop') || 
+        currentSlide.querySelector(`#youtube-player-${currentItemId}`) ||
+        (STATE.slideshow.videoPlayers && STATE.slideshow.videoPlayers[currentItemId]));
 
       if (!CONFIG.waitForTrailerToEnd || !hasVideo) {
         STATE.slideshow.slideInterval.start();
@@ -2712,15 +2726,22 @@ const SlideshowManager = {
    * @returns {boolean} Whether a video was found and playback attempted
    */
   playCurrentVideo(slide, itemId) {
-    const videoBackdrop = slide.querySelector('.video-backdrop');
+    // Try finding by class first, then fall back to YouTube player container by ID
+    let videoBackdrop = slide.querySelector('.video-backdrop');
+    if (!videoBackdrop) {
+      // YouTube API replaces the div with an iframe, which may not have the class yet
+      videoBackdrop = slide.querySelector(`#youtube-player-${itemId}`);
+    }
+    // Also check if a player exists in the registry even if no DOM element found
+    const hasRegisteredPlayer = !!(STATE.slideshow.videoPlayers && STATE.slideshow.videoPlayers[itemId]);
 
     // Update mute button visibility
     const muteButton = document.querySelector('.mute-button');
     if (muteButton) {
-      muteButton.style.display = videoBackdrop ? 'block' : 'none';
+      muteButton.style.display = (videoBackdrop || hasRegisteredPlayer) ? 'block' : 'none';
     }
 
-    if (!videoBackdrop) return false;
+    if (!videoBackdrop && !hasRegisteredPlayer) return false;
 
     if (videoBackdrop.tagName === 'VIDEO') {
       videoBackdrop.currentTime = 0;

manifest.json

@@ -9,12 +9,12 @@
     "imageUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/raw/branch/main/logo.png",
     "versions": [
       {
-        "version": "1.6.1.20",
+        "version": "1.6.1.21",
         "changelog": "- fix tv mode issue\n- refactor video playback management",
         "targetAbi": "10.11.0.0",
-        "sourceUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/releases/download/v1.6.1.20/Jellyfin.Plugin.MediaBarEnhanced.zip",
+        "sourceUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/releases/download/v1.6.1.21/Jellyfin.Plugin.MediaBarEnhanced.zip",
-        "checksum": "e3ed985f3e00f8124502faad46bd160d",
+        "checksum": "d61f34dc4012a52deea2e95389ae33e8",
-        "timestamp": "2026-02-14T00:10:57Z"
+        "timestamp": "2026-02-14T00:35:01Z"
       },
       {
         "version": "1.6.0.2",