Compare commits

...

6 Commits

Author SHA1 Message Date
CodeDevMLH
0682967591 Update manifest.json for release v1.6.1.28 [skip ci] 2026-02-14 14:38:41 +00:00
CodeDevMLH
7938728f8e Bump version to 1.6.1.28 in project file and manifest
All checks were successful
Auto Release Plugin / build-and-release (push) Successful in 53s
2026-02-14 15:37:50 +01:00
CodeDevMLH
a0773c66eb Refactor video playback logic to manage mute state more effectively and improve autoplay handling 2026-02-14 15:37:44 +01:00
CodeDevMLH
10f2a38add Update manifest.json for release v1.6.1.27 [skip ci] 2026-02-14 14:22:59 +00:00
CodeDevMLH
9bfa3ba5ea Bump version to 1.6.1.26
All checks were successful
Auto Release Plugin / build-and-release (push) Successful in 52s
2026-02-14 15:22:09 +01:00
CodeDevMLH
5c00c07b8a Refactor video playback logic and enhance slide management 2026-02-14 15:21:32 +01:00
3 changed files with 98 additions and 36 deletions

View File

@@ -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.6.1.25</Version> <Version>1.6.1.28</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>

View File

@@ -1709,13 +1709,6 @@ const SlideCreator = {
event.target._endTime = playerVars.end || undefined; event.target._endTime = playerVars.end || undefined;
event.target._videoId = videoId; event.target._videoId = videoId;
if (STATE.slideshow.isMuted) {
event.target.mute();
} else {
event.target.unMute();
event.target.setVolume(40);
}
if (typeof event.target.setPlaybackQuality === 'function') { if (typeof event.target.setPlaybackQuality === 'function') {
event.target.setPlaybackQuality(quality); event.target.setPlaybackQuality(quality);
} }
@@ -1725,6 +1718,14 @@ const SlideCreator = {
const isVideoPlayerOpen = document.querySelector('.videoPlayerContainer') || document.querySelector('.youtubePlayerContainer'); const isVideoPlayerOpen = document.querySelector('.videoPlayerContainer') || document.querySelector('.youtubePlayerContainer');
if (slide && slide.classList.contains('active') && !document.hidden && (!isVideoPlayerOpen || isVideoPlayerOpen.classList.contains('hide'))) { if (slide && slide.classList.contains('active') && !document.hidden && (!isVideoPlayerOpen || isVideoPlayerOpen.classList.contains('hide'))) {
// Set mute state only for active slide
if (STATE.slideshow.isMuted) {
event.target.mute();
} else {
event.target.unMute();
event.target.setVolume(40);
}
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)
@@ -1754,14 +1755,15 @@ const SlideCreator = {
if (CONFIG.waitForTrailerToEnd && STATE.slideshow.slideInterval) { if (CONFIG.waitForTrailerToEnd && STATE.slideshow.slideInterval) {
STATE.slideshow.slideInterval.stop(); STATE.slideshow.slideInterval.stop();
} }
} else {
event.target.mute();
} }
}, },
'onStateChange': (event) => { 'onStateChange': (event) => {
if (event.data === YT.PlayerState.ENDED) { if (event.data === YT.PlayerState.ENDED) {
if (CONFIG.waitForTrailerToEnd) { const slide = document.querySelector(`.slide[data-item-id="${itemId}"]`);
if (slide && slide.classList.contains('active')) {
SlideshowManager.nextSlide(); SlideshowManager.nextSlide();
} else {
event.target.playVideo(); // Loop if not waiting for end if trailer is shorter than slide duration
} }
} }
}, },
@@ -1804,15 +1806,23 @@ const SlideCreator = {
STATE.slideshow.videoPlayers[itemId] = backdrop; STATE.slideshow.videoPlayers[itemId] = backdrop;
backdrop.addEventListener('play', () => { backdrop.addEventListener('play', () => {
// backdrop.addEventListener('play', (event) => {
// const slide = document.querySelector(`.slide[data-item-id="${itemId}"]`);
// if (!slide || !slide.classList.contains('active')) {
// console.log(`Local video ${itemId} started playing but is not active, pausing.`);
// event.target.pause();
// event.target.currentTime = 0;
// return;
// }
if (CONFIG.waitForTrailerToEnd && STATE.slideshow.slideInterval) { if (CONFIG.waitForTrailerToEnd && STATE.slideshow.slideInterval) {
STATE.slideshow.slideInterval.stop(); STATE.slideshow.slideInterval.stop();
} }
}); });
backdrop.addEventListener('ended', () => { backdrop.addEventListener('ended', () => {
if (CONFIG.waitForTrailerToEnd) {
SlideshowManager.nextSlide(); SlideshowManager.nextSlide();
}
}); });
backdrop.addEventListener('error', () => { backdrop.addEventListener('error', () => {
@@ -2271,19 +2281,42 @@ const SlideshowManager = {
if (previousVisibleSlide) { if (previousVisibleSlide) {
previousVisibleSlide.classList.remove("active"); previousVisibleSlide.classList.remove("active");
previousVisibleSlide.setAttribute("inert", "");
previousVisibleSlide.setAttribute("tabindex", "-1");
} }
currentSlide.classList.add("active"); currentSlide.classList.add("active");
currentSlide.removeAttribute("inert");
currentSlide.setAttribute("tabindex", "0");
// Update Play/Pause Button State if it was paused
if (STATE.slideshow.isPaused) {
STATE.slideshow.isPaused = false;
const pauseButton = document.querySelector('.pause-button');
if (pauseButton) {
pauseButton.innerHTML = '<i class="material-icons">pause</i>';
const pauseLabel = LocalizationUtils.getLocalizedString('ButtonPause', 'Pause');
pauseButton.setAttribute("aria-label", pauseLabel);
pauseButton.setAttribute("title", pauseLabel);
}
}
// Manage Video Playback: Stop others, Play current // Manage Video Playback: Stop others, Play current
// 1. Pause all other YouTube players // 1. Pause and mute all other YouTube players
if (STATE.slideshow.videoPlayers) { if (STATE.slideshow.videoPlayers) {
Object.keys(STATE.slideshow.videoPlayers).forEach(id => { Object.keys(STATE.slideshow.videoPlayers).forEach(id => {
if (id !== currentItemId) { if (id !== currentItemId) {
const p = STATE.slideshow.videoPlayers[id]; const p = STATE.slideshow.videoPlayers[id];
if (p && typeof p.pauseVideo === 'function') { if (p) {
p.pauseVideo(); try {
if (typeof p.pauseVideo === 'function') {
p.pauseVideo();
if (typeof p.mute === 'function') {
p.mute();
}
}
} catch (e) { console.warn("Error pausing player", id, e); }
} }
} }
}); });
@@ -2293,6 +2326,7 @@ const SlideshowManager = {
document.querySelectorAll('video').forEach(video => { document.querySelectorAll('video').forEach(video => {
if (!video.closest(`.slide[data-item-id="${currentItemId}"]`)) { if (!video.closest(`.slide[data-item-id="${currentItemId}"]`)) {
video.pause(); video.pause();
video.muted = true;
} }
}); });
@@ -2318,8 +2352,8 @@ const SlideshowManager = {
videoBackdrop.play().catch(e => { videoBackdrop.play().catch(e => {
// 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(() => { setTimeout(() => {
if (videoBackdrop.paused) { if (videoBackdrop.paused && currentSlide.classList.contains('active')) {
console.warn(`Autoplay blocked for ${itemId}, attempting muted fallback`); console.warn(`Autoplay blocked for ${currentItemId}, attempting muted fallback`);
videoBackdrop.muted = true; videoBackdrop.muted = true;
videoBackdrop.play().catch(err => console.error("Muted fallback failed", err)); videoBackdrop.play().catch(err => console.error("Muted fallback failed", err));
} }
@@ -2328,12 +2362,28 @@ const SlideshowManager = {
} else if (STATE.slideshow.videoPlayers && STATE.slideshow.videoPlayers[currentItemId]) { } else if (STATE.slideshow.videoPlayers && STATE.slideshow.videoPlayers[currentItemId]) {
const player = STATE.slideshow.videoPlayers[currentItemId]; const player = STATE.slideshow.videoPlayers[currentItemId];
if (player && typeof player.loadVideoById === 'function' && player._videoId) { if (player && typeof player.loadVideoById === 'function' && player._videoId) {
// Use loadVideoById to enforce start and end times // If same video is already loaded, just seek and play (much faster)
player.loadVideoById({ let isAlreadyLoaded = false;
videoId: player._videoId, if (typeof player.getVideoData === 'function') {
startSeconds: player._startTime || 0, try {
endSeconds: player._endTime const data = player.getVideoData();
}); if (data && data.video_id === player._videoId) {
isAlreadyLoaded = true;
}
} catch (e) { /* player not fully ready */ }
}
if (isAlreadyLoaded) {
player.seekTo(player._startTime || 0);
player.playVideo();
} else {
// Full load needed (first time or different video)
player.loadVideoById({
videoId: player._videoId,
startSeconds: player._startTime || 0,
endSeconds: player._endTime
});
}
if (STATE.slideshow.isMuted) { if (STATE.slideshow.isMuted) {
player.mute(); player.mute();
@@ -2344,6 +2394,7 @@ const SlideshowManager = {
// Check if playback successfully started, otherwise fallback to muted // Check if playback successfully started, otherwise fallback to muted
setTimeout(() => { setTimeout(() => {
if (!currentSlide.classList.contains('active')) return;
if (player.getPlayerState && if (player.getPlayerState &&
player.getPlayerState() !== YT.PlayerState.PLAYING && player.getPlayerState() !== YT.PlayerState.PLAYING &&
player.getPlayerState() !== YT.PlayerState.BUFFERING) { player.getPlayerState() !== YT.PlayerState.BUFFERING) {
@@ -2394,7 +2445,8 @@ const SlideshowManager = {
this.updateDots(); this.updateDots();
// Only restart interval if we are NOT waiting for a video to end // 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') ||
(STATE.slideshow.videoPlayers && STATE.slideshow.videoPlayers[currentItemId]);
if (STATE.slideshow.slideInterval && !STATE.slideshow.isPaused) { if (STATE.slideshow.slideInterval && !STATE.slideshow.isPaused) {
if (CONFIG.waitForTrailerToEnd && hasVideo) { if (CONFIG.waitForTrailerToEnd && hasVideo) {
STATE.slideshow.slideInterval.stop(); STATE.slideshow.slideInterval.stop();
@@ -2454,20 +2506,24 @@ const SlideshowManager = {
const totalItems = STATE.slideshow.totalItems; const totalItems = STATE.slideshow.totalItems;
const preloadCount = Math.min(Math.max(CONFIG.preloadCount || 1, 1), 5); const preloadCount = Math.min(Math.max(CONFIG.preloadCount || 1, 1), 5);
const preloadedIds = new Set(); const preloadedIds = new Set();
// Preload next slides // Preload next slides
for (let i = 1; i <= preloadCount; i++) { for (let i = 1; i <= preloadCount; i++) {
const nextIndex = (currentIndex + i) % totalItems; const nextIndex = (currentIndex + i) % totalItems;
if (nextIndex === currentIndex) break; if (nextIndex === currentIndex) break;
const itemId = STATE.slideshow.itemIds[nextIndex]; const itemId = STATE.slideshow.itemIds[nextIndex];
if (!preloadedIds.has(itemId)) { if (!preloadedIds.has(itemId)) {
preloadedIds.add(itemId); preloadedIds.add(itemId);
SlideCreator.createSlideForItemId(itemId); SlideCreator.createSlideForItemId(itemId);
} }
} }
// Preload previous slides // Preload previous slides
for (let i = 1; i <= preloadCount; i++) { for (let i = 1; i <= preloadCount; i++) {
const prevIndex = (currentIndex - i + totalItems) % totalItems; const prevIndex = (currentIndex - i + totalItems) % totalItems;
if (prevIndex === currentIndex) break; if (prevIndex === currentIndex) break;
const prevItemId = STATE.slideshow.itemIds[prevIndex]; const prevItemId = STATE.slideshow.itemIds[prevIndex];
if (!preloadedIds.has(prevItemId)) { if (!preloadedIds.has(prevItemId)) {
preloadedIds.add(prevItemId); preloadedIds.add(prevItemId);
@@ -2724,18 +2780,24 @@ const SlideshowManager = {
const currentSlide = document.querySelector(`.slide[data-item-id="${currentItemId}"]`); const currentSlide = document.querySelector(`.slide[data-item-id="${currentItemId}"]`);
if (!currentSlide) return; if (!currentSlide) return;
// 1. Try YouTube Player // YouTube player: just resume, don't reload
const ytPlayer = STATE.slideshow.videoPlayers[currentItemId]; const ytPlayer = STATE.slideshow.videoPlayers?.[currentItemId];
if (ytPlayer && typeof ytPlayer.playVideo === 'function') { if (ytPlayer && typeof ytPlayer.playVideo === 'function') {
if (STATE.slideshow.isMuted) {
if (typeof ytPlayer.mute === 'function') ytPlayer.mute();
} else {
if (typeof ytPlayer.unMute === 'function') ytPlayer.unMute();
if (typeof ytPlayer.setVolume === 'function') ytPlayer.setVolume(40);
}
ytPlayer.playVideo(); ytPlayer.playVideo();
return;
} }
// 2. Try HTML5 Video // HTML5 video: just resume, don't reset currentTime
const html5Video = currentSlide.querySelector('video'); const html5Video = currentSlide.querySelector('video.video-backdrop');
if (html5Video) { if (html5Video) {
if (STATE.slideshow.isMuted) { html5Video.muted = STATE.slideshow.isMuted;
html5Video.muted = true; if (!STATE.slideshow.isMuted) html5Video.volume = 0.4;
}
html5Video.play().catch(e => console.warn("Error resuming HTML5 video:", e)); html5Video.play().catch(e => console.warn("Error resuming HTML5 video:", e));
} }
}, },

View File

@@ -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.6.1.25", "version": "1.6.1.28",
"changelog": "- fix tv mode issue\n- refactor video playback management", "changelog": "- fix tv mode issue\n- refactor video playback management",
"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.6.1.25/Jellyfin.Plugin.MediaBarEnhanced.zip", "sourceUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/releases/download/v1.6.1.28/Jellyfin.Plugin.MediaBarEnhanced.zip",
"checksum": "283886aa51ccd1d40f057b65617b7ea4", "checksum": "2b44f2ee7399b70c4bfdaae33ff80437",
"timestamp": "2026-02-14T02:21:14Z" "timestamp": "2026-02-14T14:38:40Z"
}, },
{ {
"version": "1.6.0.2", "version": "1.6.0.2",