diff --git a/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.css b/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.css index ac598fe..575c4a9 100644 --- a/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.css +++ b/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.css @@ -995,3 +995,15 @@ .dots-container .slide-counter { margin: 0; } + +.layout-tv .video-backdrop { + top: -5%; + mask-image: linear-gradient(to top, + #fff0 2%, + rgb(0 0 0 / 0.5) 6%, + #000000 8%); + -webkit-mask-image: linear-gradient(to top, + #fff0 2%, + rgb(0 0 0 / 0.5) 6%, + #000000 8%); +} diff --git a/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js b/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js index 5da2a48..f174576 100644 --- a/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js +++ b/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js @@ -2237,6 +2237,16 @@ const SlideshowManager = { let previousVisibleSlide; try { const container = SlideUtils.getOrCreateSlidesContainer(); + + const activeElement = document.activeElement; + let focusSelector = null; + if (container.contains(activeElement)) { + if (activeElement.classList.contains('play-button')) focusSelector = '.play-button'; + else if (activeElement.classList.contains('detail-button')) focusSelector = '.detail-button'; + else if (activeElement.classList.contains('favorite-button')) focusSelector = '.favorite-button'; + else if (activeElement.classList.contains('trailer-button')) focusSelector = '.trailer-button'; + } + const totalItems = STATE.slideshow.totalItems; index = Math.max(0, Math.min(index, totalItems - 1)); @@ -2264,6 +2274,15 @@ const SlideshowManager = { } currentSlide.classList.add("active"); + + if (focusSelector) { + const target = currentSlide.querySelector(focusSelector); + if (target) { + requestAnimationFrame(() => { + target.focus(); + }); + } + } // Manage Video Playback: Stop others, Play current