Update manifest.json for release v1.6.6.2 [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.6.0</Version>
+    <Version>1.6.6.2</Version>
     <RepositoryUrl>https://github.com/CodeDevMLH/jellyfin-plugin-media-bar-enhanced</RepositoryUrl>
   </PropertyGroup>
 

Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js

@@ -1723,11 +1723,19 @@ const SlideCreator = {
         // Create container for YouTube API
         const videoClass = CONFIG.fullWidthVideo ? "video-backdrop-full" : "video-backdrop-default";
 
+        // Create a wrapper for opacity transition
         videoBackdrop = SlideUtils.createElement("div", {
-          className: `backdrop video-backdrop ${videoClass}`,
-          id: `youtube-player-${itemId}`
+            className: `backdrop video-backdrop ${videoClass}`,
+            style: "opacity: 0; transition: opacity 1.2s ease-in-out;" // Start interrupted/transparent
         });
 
+        const ytPlayerDiv = SlideUtils.createElement("div", {
+          id: `youtube-player-${itemId}`,
+          style: "width: 100%; height: 100%;"
+        });
+        
+        videoBackdrop.appendChild(ytPlayerDiv);
+
         // Initialize YouTube Player
         SlideUtils.loadYouTubeIframeAPI().then(() => {
           // Fetch SponsorBlock data
@@ -1783,6 +1791,9 @@ const SlideCreator = {
                   event.target._startTime = playerVars.start || 0;
                   event.target._endTime = playerVars.end || undefined;
                   event.target._videoId = videoId;
+                  
+                  // Store reference to wrapper for fading
+                  event.target._wrapperDiv = videoBackdrop;
 
                   if (STATE.slideshow.isMuted) {
                     event.target.mute();
@@ -1832,6 +1843,13 @@ const SlideCreator = {
                   }
                 },
                 'onStateChange': (event) => {
+                  // Fade in when playing
+                  if (event.data === YT.PlayerState.PLAYING) {
+                      if (event.target._wrapperDiv) {
+                          event.target._wrapperDiv.style.opacity = "1";
+                      }
+                  }
+                  
                   if (event.data === YT.PlayerState.ENDED) {
                     const slide = document.querySelector(`.slide[data-item-id="${itemId}"]`);
                     if (slide && slide.classList.contains('active')) {
@@ -1861,7 +1879,7 @@ const SlideCreator = {
           preload: "none",
           disablePictureInPicture: true,
           "data-src": videoSrc,
-          style: "object-fit: cover; object-position: center center; width: 100%; height: 100%; position: absolute; top: 0; left: 0; pointer-events: none;"
+          style: "object-fit: cover; object-position: center center; width: 100%; height: 100%; position: absolute; top: 0; left: 0; pointer-events: none; opacity: 0; transition: opacity 1.2s ease-in-out;"
         };
 
         videoAttributes.muted = "";
@@ -1879,6 +1897,10 @@ const SlideCreator = {
             event.target.currentTime = 0;
             return;
           }
+          
+          // Fade in
+          event.target.style.opacity = "1";
+          
           if (CONFIG.waitForTrailerToEnd && STATE.slideshow.slideInterval) {
             STATE.slideshow.slideInterval.stop();
           }
@@ -2371,30 +2393,32 @@ const SlideshowManager = {
 
       // Manage Video Playback: Stop others, Play current
       // 1. Stop all other YouTube players and local video elements, release connections
-      if (STATE.slideshow.videoPlayers) {
-        Object.keys(STATE.slideshow.videoPlayers).forEach(id => {
-          if (id !== currentItemId) {
-            const p = STATE.slideshow.videoPlayers[id];
-            if (!p) return;
-            // YouTube player
-            if (typeof p.pauseVideo === 'function') {
-              p.pauseVideo();
-            }
-            // HTML5 <video> element (local trailers), release HTTP connection
-            if (p instanceof HTMLVideoElement) {
-              p.pause();
-              p.muted = true;
-              p.currentTime = 0;
-              // Save src to data-src and release the HTTP streaming connection
-              if (p.src && !p.getAttribute('data-src')) {
-                p.setAttribute('data-src', p.src);
+      setTimeout(() => {
+        if (STATE.slideshow.videoPlayers) {
+          Object.keys(STATE.slideshow.videoPlayers).forEach(id => {
+            if (id !== currentItemId) {
+              const p = STATE.slideshow.videoPlayers[id];
+              if (!p) return;
+              // YouTube player
+              if (typeof p.pauseVideo === 'function') {
+                p.pauseVideo();
+              }
+              // HTML5 <video> element (local trailers), release HTTP connection
+              if (p instanceof HTMLVideoElement) {
+                p.pause();
+                p.muted = true;
+                p.currentTime = 0;
+                // Save src to data-src and release the HTTP streaming connection
+                if (p.src && !p.getAttribute('data-src')) {
+                  p.setAttribute('data-src', p.src);
+                }
+                p.removeAttribute('src');
+                p.load();
               }
-              p.removeAttribute('src');
-              p.load();
             }
-          }
-        });
-      }
+          });
+        }
+      }, CONFIG.fadeTransitionDuration);
 
       // 2. Pause all other HTML5 videos e.g. local trailers
       document.querySelectorAll('video').forEach(video => {

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.6.0",
+        "version": "1.6.6.2",
         "changelog": "- feat: add static backdrop also for video backdrops\n- fix: renaming issue of settings (avoiding conflict with other plugins)",
         "targetAbi": "10.11.0.0",
-        "sourceUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/releases/download/v1.6.6.0/Jellyfin.Plugin.MediaBarEnhanced.zip",
-        "checksum": "af624d779b5e43cc6e21899eb24db26d",
-        "timestamp": "2026-02-19T01:01:20Z"
+        "sourceUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/releases/download/v1.6.6.2/Jellyfin.Plugin.MediaBarEnhanced.zip",
+        "checksum": "5672ad96720adf049e780c85174a88bc",
+        "timestamp": "2026-02-19T02:36:41Z"
       },
       {
         "version": "1.6.5.2",