Compare commits
21 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
eed3ca1860 | ||
|
|
0f14577f5d | ||
|
|
9999d6a633 | ||
|
|
a935fd7d5d | ||
|
|
60293e81e1 | ||
|
|
f54e55fe04 | ||
|
|
b3c42e2100 | ||
|
|
20ddbb32c7 | ||
|
|
14a5075e22 | ||
|
|
accb316a81 | ||
|
|
51c5cdf5bf | ||
|
|
306eff757b | ||
|
|
b8f28a5735 | ||
|
|
0932d9611d | ||
|
|
5e616db0ae | ||
|
|
538b0f2110 | ||
|
|
e717c07c54 | ||
|
|
0fa2d01ca3 | ||
|
|
5299b2a9d5 | ||
|
|
4f244988b9 | ||
|
|
5635a8f05e |
@@ -12,7 +12,7 @@
|
|||||||
<!-- <TreatWarningsAsErrors>false</TreatWarningsAsErrors> -->
|
<!-- <TreatWarningsAsErrors>false</TreatWarningsAsErrors> -->
|
||||||
<Title>Jellyfin Media Bar Enhanced Plugin</Title>
|
<Title>Jellyfin Media Bar Enhanced Plugin</Title>
|
||||||
<Authors>CodeDevMLH</Authors>
|
<Authors>CodeDevMLH</Authors>
|
||||||
<Version>1.5.0.15</Version>
|
<Version>1.5.0.25</Version>
|
||||||
<RepositoryUrl>https://github.com/CodeDevMLH/jellyfin-plugin-media-bar-enhanced</RepositoryUrl>
|
<RepositoryUrl>https://github.com/CodeDevMLH/jellyfin-plugin-media-bar-enhanced</RepositoryUrl>
|
||||||
</PropertyGroup>
|
</PropertyGroup>
|
||||||
|
|
||||||
|
|||||||
@@ -161,7 +161,7 @@
|
|||||||
|
|
||||||
.homeSectionsContainer {
|
.homeSectionsContainer {
|
||||||
position: relative;
|
position: relative;
|
||||||
top: 65vh;
|
margin-top: 65vh;
|
||||||
z-index: 6;
|
z-index: 6;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -992,3 +992,8 @@
|
|||||||
.dots-container .slide-counter {
|
.dots-container .slide-counter {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Fix scrolling issue in TV mode - preserve space for slideshow */
|
||||||
|
.layout-tv html, .layout-tv body {
|
||||||
|
scroll-padding-top: 65vh;
|
||||||
|
}
|
||||||
@@ -85,6 +85,7 @@ const STATE = {
|
|||||||
isMuted: CONFIG.startMuted,
|
isMuted: CONFIG.startMuted,
|
||||||
customTrailerUrls: {},
|
customTrailerUrls: {},
|
||||||
ytPromise: null,
|
ytPromise: null,
|
||||||
|
autoplayTimeouts: [],
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -605,7 +606,10 @@ const SlideUtils = {
|
|||||||
getOrCreateSlidesContainer() {
|
getOrCreateSlidesContainer() {
|
||||||
let container = document.getElementById("slides-container");
|
let container = document.getElementById("slides-container");
|
||||||
if (!container) {
|
if (!container) {
|
||||||
container = this.createElement("div", { id: "slides-container" });
|
container = this.createElement("div", {
|
||||||
|
id: "slides-container",
|
||||||
|
className: "noautofocus"
|
||||||
|
});
|
||||||
document.body.appendChild(container);
|
document.body.appendChild(container);
|
||||||
}
|
}
|
||||||
return container;
|
return container;
|
||||||
@@ -1413,6 +1417,24 @@ class SlideTimer {
|
|||||||
*/
|
*/
|
||||||
const VisibilityObserver = {
|
const VisibilityObserver = {
|
||||||
updateVisibility() {
|
updateVisibility() {
|
||||||
|
const videoPlayer = document.querySelector('.videoPlayerContainer');
|
||||||
|
const trailerPlayer = document.querySelector('.youtubePlayerContainer');
|
||||||
|
|
||||||
|
// If a full screen video player is active, hide slideshow and stop playback
|
||||||
|
if ((videoPlayer && !videoPlayer.classList.contains('hide')) || (trailerPlayer && !trailerPlayer.classList.contains('hide'))) {
|
||||||
|
const container = document.getElementById("slides-container");
|
||||||
|
if (container) {
|
||||||
|
container.style.display = "none";
|
||||||
|
container.style.visibility = "hidden";
|
||||||
|
container.style.pointerEvents = "none";
|
||||||
|
}
|
||||||
|
if (STATE.slideshow.slideInterval) {
|
||||||
|
STATE.slideshow.slideInterval.stop();
|
||||||
|
}
|
||||||
|
SlideshowManager.stopAllPlayback();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
const activeTab = document.querySelector(".emby-tab-button-active");
|
const activeTab = document.querySelector(".emby-tab-button-active");
|
||||||
const container = document.getElementById("slides-container");
|
const container = document.getElementById("slides-container");
|
||||||
|
|
||||||
@@ -1657,10 +1679,23 @@ const SlideCreator = {
|
|||||||
|
|
||||||
// Only play if this is the active slide
|
// Only play if this is the active slide
|
||||||
const slide = document.querySelector(`.slide[data-item-id="${itemId}"]`);
|
const slide = document.querySelector(`.slide[data-item-id="${itemId}"]`);
|
||||||
if (slide && slide.classList.contains('active')) {
|
const isVideoPlayerOpen = document.querySelector('.videoPlayerContainer') || document.querySelector('.youtubePlayerContainer');
|
||||||
|
|
||||||
|
if (slide && slide.classList.contains('active') && !document.hidden && (!isVideoPlayerOpen || isVideoPlayerOpen.classList.contains('hide'))) {
|
||||||
event.target.playVideo();
|
event.target.playVideo();
|
||||||
|
|
||||||
// Check if it actually started playing after a short delay (handling autoplay blocks)
|
// Check if it actually started playing after a short delay (handling autoplay blocks)
|
||||||
setTimeout(() => {
|
const timeoutId = setTimeout(() => {
|
||||||
|
// Re-check conditions before processing fallback
|
||||||
|
const isVideoPlayerOpenNow = document.querySelector('.videoPlayerContainer') || document.querySelector('.youtubePlayerContainer');
|
||||||
|
if (document.hidden || (isVideoPlayerOpenNow && !isVideoPlayerOpenNow.classList.contains('hide')) || !slide.classList.contains('active')) {
|
||||||
|
console.log(`Navigation detected during autoplay check for ${itemId}, stopping video.`);
|
||||||
|
try {
|
||||||
|
event.target.stopVideo();
|
||||||
|
} catch (e) { console.warn("Error stopping video in timeout:", e); }
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
if (event.target.getPlayerState() !== YT.PlayerState.PLAYING &&
|
if (event.target.getPlayerState() !== YT.PlayerState.PLAYING &&
|
||||||
event.target.getPlayerState() !== YT.PlayerState.BUFFERING) {
|
event.target.getPlayerState() !== YT.PlayerState.BUFFERING) {
|
||||||
console.warn(`Autoplay blocked for ${itemId}, attempting muted fallback`);
|
console.warn(`Autoplay blocked for ${itemId}, attempting muted fallback`);
|
||||||
@@ -1669,6 +1704,9 @@ const SlideCreator = {
|
|||||||
}
|
}
|
||||||
}, 1000);
|
}, 1000);
|
||||||
|
|
||||||
|
if (!STATE.slideshow.autoplayTimeouts) STATE.slideshow.autoplayTimeouts = [];
|
||||||
|
STATE.slideshow.autoplayTimeouts.push(timeoutId);
|
||||||
|
|
||||||
// Pause slideshow timer when video starts if configured
|
// Pause slideshow timer when video starts if configured
|
||||||
if (CONFIG.waitForTrailerToEnd && STATE.slideshow.slideInterval) {
|
if (CONFIG.waitForTrailerToEnd && STATE.slideshow.slideInterval) {
|
||||||
STATE.slideshow.slideInterval.stop();
|
STATE.slideshow.slideInterval.stop();
|
||||||
@@ -2544,15 +2582,26 @@ const SlideshowManager = {
|
|||||||
* Used when navigating away from the home screen
|
* Used when navigating away from the home screen
|
||||||
*/
|
*/
|
||||||
stopAllPlayback() {
|
stopAllPlayback() {
|
||||||
// 1. Pause all YouTube players
|
// Clear any pending autoplay timeouts
|
||||||
|
if (STATE.slideshow.autoplayTimeouts) {
|
||||||
|
STATE.slideshow.autoplayTimeouts.forEach(id => clearTimeout(id));
|
||||||
|
STATE.slideshow.autoplayTimeouts = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
// 1. Stop all YouTube players
|
||||||
if (STATE.slideshow.videoPlayers) {
|
if (STATE.slideshow.videoPlayers) {
|
||||||
Object.values(STATE.slideshow.videoPlayers).forEach(player => {
|
Object.values(STATE.slideshow.videoPlayers).forEach(player => {
|
||||||
try {
|
try {
|
||||||
if (player && typeof player.pauseVideo === 'function') {
|
if (player && typeof player.stopVideo === 'function') {
|
||||||
|
player.stopVideo();
|
||||||
|
if (typeof player.clearVideo === 'function') {
|
||||||
|
player.clearVideo();
|
||||||
|
}
|
||||||
|
} else if (player && typeof player.pauseVideo === 'function') {
|
||||||
player.pauseVideo();
|
player.pauseVideo();
|
||||||
}
|
}
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.warn("Error pausing YouTube player:", e);
|
console.warn("Error pausing/stopping YouTube player:", e);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -2655,29 +2704,64 @@ const SlideshowManager = {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const activeElement = document.activeElement;
|
||||||
|
const isTvDevice = window.browser && window.browser.tv;
|
||||||
|
const isTvLayout = window.layoutManager && window.layoutManager.tv;
|
||||||
|
const hasTvClass = document.documentElement.classList.contains('layout-tv') || document.body.classList.contains('layout-tv');
|
||||||
|
const isTvMode = isTvDevice || isTvLayout || hasTvClass;
|
||||||
|
|
||||||
|
// Check Focus State
|
||||||
|
const isBodyFocused = activeElement === document.body;
|
||||||
|
const hasDirectFocus = container.contains(activeElement) || activeElement === container;
|
||||||
|
|
||||||
|
// Determine if we should handle navigation keys (Arrows, Space, M)
|
||||||
|
// TV Mode: Strict focus required (must be on slideshow)
|
||||||
|
// Desktop Mode: Loose focus allowed (slideshow OR body/nothing focused)
|
||||||
|
const canControlSlideshow = isTvMode ? hasDirectFocus : (hasDirectFocus || isBodyFocused);
|
||||||
|
|
||||||
|
// Check for Input Fields (always ignore typing)
|
||||||
|
const isInputElement = activeElement && (activeElement.tagName === 'INPUT' || activeElement.tagName === 'TEXTAREA' || activeElement.isContentEditable);
|
||||||
|
if (isInputElement) return;
|
||||||
|
|
||||||
|
// Check active video players (ignore if video is playing/overlay is open)
|
||||||
|
const videoPlayer = document.querySelector('.videoPlayerContainer');
|
||||||
|
const trailerPlayer = document.querySelector('.youtubePlayerContainer');
|
||||||
|
const isVideoOpen = (videoPlayer && !videoPlayer.classList.contains('hide')) || (trailerPlayer && !trailerPlayer.classList.contains('hide'));
|
||||||
|
if (isVideoOpen) return;
|
||||||
|
|
||||||
switch (e.key) {
|
switch (e.key) {
|
||||||
case "ArrowRight":
|
case "ArrowRight":
|
||||||
|
if (canControlSlideshow) {
|
||||||
SlideshowManager.nextSlide();
|
SlideshowManager.nextSlide();
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
}
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "ArrowLeft":
|
case "ArrowLeft":
|
||||||
|
if (canControlSlideshow) {
|
||||||
SlideshowManager.prevSlide();
|
SlideshowManager.prevSlide();
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
}
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case " ": // Space bar
|
case " ": // Space bar
|
||||||
|
if (canControlSlideshow) {
|
||||||
this.togglePause();
|
this.togglePause();
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
}
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "m": // Mute toggle
|
case "m": // Mute toggle
|
||||||
case "M":
|
case "M":
|
||||||
|
if (canControlSlideshow) {
|
||||||
this.toggleMute();
|
this.toggleMute();
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
}
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "Enter":
|
case "Enter":
|
||||||
|
// Enter always requires direct focus on the slideshow to avoid conflicts
|
||||||
|
if (hasDirectFocus) {
|
||||||
const currentItemId = STATE.slideshow.itemIds[STATE.slideshow.currentSlideIndex];
|
const currentItemId = STATE.slideshow.itemIds[STATE.slideshow.currentSlideIndex];
|
||||||
if (currentItemId) {
|
if (currentItemId) {
|
||||||
if (window.Emby && window.Emby.Page) {
|
if (window.Emby && window.Emby.Page) {
|
||||||
@@ -2689,6 +2773,7 @@ const SlideshowManager = {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
}
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -9,12 +9,12 @@
|
|||||||
"imageUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/raw/branch/main/logo.png",
|
"imageUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/raw/branch/main/logo.png",
|
||||||
"versions": [
|
"versions": [
|
||||||
{
|
{
|
||||||
"version": "1.5.0.15",
|
"version": "1.5.0.25",
|
||||||
"changelog": "- fix: keyboard controls in TV mode\n- Add sorting options for content\n- Update mediaBarEnhanced.js and mediaBarEnhanced.css with version 4.0.1 from original repo",
|
"changelog": "- fix: Keyboard controls in TV mode\n- Add sorting options for content\n- Update mediaBarEnhanced.js and mediaBarEnhanced.css with version 4.0.1 from original repo",
|
||||||
"targetAbi": "10.11.0.0",
|
"targetAbi": "10.11.0.0",
|
||||||
"sourceUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/releases/download/v1.5.0.15/Jellyfin.Plugin.MediaBarEnhanced.zip",
|
"sourceUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/releases/download/v1.5.0.25/Jellyfin.Plugin.MediaBarEnhanced.zip",
|
||||||
"checksum": "92a6c27004e11f59cf68ea9f0442bb25",
|
"checksum": "42165f328f780ee3efac2dec23e02b09",
|
||||||
"timestamp": "2026-02-09T15:41:45Z"
|
"timestamp": "2026-02-10T00:07:05Z"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"version": "1.3.0.3",
|
"version": "1.3.0.3",
|
||||||
|
|||||||
Reference in New Issue
Block a user