Compare commits

...

9 Commits

Author SHA1 Message Date
CodeDevMLH
6df390fa18 Update manifest.json for release v1.7.0.3 [skip ci] 2026-03-05 23:23:07 +00:00
CodeDevMLH
d0c3d7ee4d Bump version to 1.7.0.3 (test 3)
All checks were successful
Auto Release Plugin / build-and-release (push) Successful in 52s
2026-03-06 00:22:14 +01:00
CodeDevMLH
bc621aacdf test 2026-03-06 00:21:54 +01:00
CodeDevMLH
73eb30d671 Update manifest.json for release v1.7.0.2 [skip ci] 2026-03-05 22:44:56 +00:00
CodeDevMLH
2cfbec95c9 Bump version to 1.7.0.2
All checks were successful
Auto Release Plugin / build-and-release (push) Successful in 50s
2026-03-05 23:44:05 +01:00
CodeDevMLH
08fc29cba3 Improve video backdrop handling: optimize autoplay logic for fresh loads and enhance Safari compatibility with loadedmetadata event 2026-03-05 23:43:52 +01:00
CodeDevMLH
0d6b835486 Update manifest.json for release v1.7.0.1 [skip ci] 2026-03-05 21:43:51 +00:00
CodeDevMLH
bf620e447f Bump version to 1.7.0.1
All checks were successful
Auto Release Plugin / build-and-release (push) Successful in 53s
2026-03-05 22:42:58 +01:00
CodeDevMLH
3117d627dd Enhance video playback handling: enable autoplay, adjust mute settings for Safari compatibility, and improve navigation checks during autoplay. 2026-03-05 22:42:40 +01:00
3 changed files with 76 additions and 52 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.7.0.0</Version> <Version>1.7.0.3</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

@@ -1403,7 +1403,9 @@ const ApiUtils = {
return { return {
id: trailer.Id, id: trailer.Id,
url: `${STATE.jellyfinData.serverAddress}/Videos/${trailer.Id}/stream.mp4?mediaSourceId=${mediaSourceId}&api_key=${STATE.jellyfinData.accessToken}` // static=true forces Jellyfin to direct-stream (no transcoding) which enables
// HTTP Range Requests (Accept-Ranges: bytes) — required by Safari for video playback
url: `${STATE.jellyfinData.serverAddress}/Videos/${trailer.Id}/stream.mp4?mediaSourceId=${mediaSourceId}&api_key=${STATE.jellyfinData.accessToken}&static=true`
}; };
} }
return null; return null;
@@ -1749,8 +1751,8 @@ const SlideCreator = {
// Fetch SponsorBlock data // Fetch SponsorBlock data
ApiUtils.fetchSponsorBlockData(videoId).then(segments => { ApiUtils.fetchSponsorBlockData(videoId).then(segments => {
const playerVars = { const playerVars = {
autoplay: 0, autoplay: 1,
mute: STATE.slideshow.isMuted ? 1 : 0, mute: 1, // need to be muted for Safari, because apple makes life difficult...
controls: 0, controls: 0,
disablekb: 1, disablekb: 1,
fs: 0, fs: 0,
@@ -1798,6 +1800,8 @@ const SlideCreator = {
const iframe = event.target.getIframe(); const iframe = event.target.getIframe();
if (iframe) { if (iframe) {
iframe.setAttribute('referrerpolicy', 'strict-origin-when-cross-origin'); iframe.setAttribute('referrerpolicy', 'strict-origin-when-cross-origin');
// Full allow attribute matching what YouTube sets on their own embed pages
iframe.setAttribute('allow', 'accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share');
} }
// Store start/end time and videoId for later use // Store start/end time and videoId for later use
@@ -1808,9 +1812,8 @@ const SlideCreator = {
// Store reference to wrapper for fading // Store reference to wrapper for fading
event.target._wrapperDiv = videoBackdrop; event.target._wrapperDiv = videoBackdrop;
if (STATE.slideshow.isMuted) { // Unmute now if user wants sound.
event.target.mute(); if (!STATE.slideshow.isMuted) {
} else {
event.target.unMute(); event.target.unMute();
event.target.setVolume(40); event.target.setVolume(40);
} }
@@ -1819,28 +1822,34 @@ const SlideCreator = {
event.target.setPlaybackQuality(quality); event.target.setPlaybackQuality(quality);
} }
// Only play if this is the active slide // Stop playback if slide was navigated away from
const slide = document.querySelector(`.slide[data-item-id="${itemId}"]`); const slide = document.querySelector(`.slide[data-item-id="${itemId}"]`);
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'))) {
event.target.playVideo(); event.target.stopVideo();
} else {
// Pause slideshow timer when video starts if configured
if (CONFIG.waitForTrailerToEnd && STATE.slideshow.slideInterval) {
STATE.slideshow.slideInterval.stop();
}
// Check if it actually started playing after a short delay (handling autoplay blocks) // Safety check after 1s: handle navigation-away during the window,
// and fallback to muted play if autoplay failed for any reason.
const timeoutId = setTimeout(() => { const timeoutId = setTimeout(() => {
// Re-check conditions before processing fallback
const isVideoPlayerOpenNow = document.querySelector('.videoPlayerContainer') || document.querySelector('.youtubePlayerContainer'); const isVideoPlayerOpenNow = document.querySelector('.videoPlayerContainer') || document.querySelector('.youtubePlayerContainer');
if (document.hidden || (isVideoPlayerOpenNow && !isVideoPlayerOpenNow.classList.contains('hide')) || !slide.classList.contains('active')) { if (document.hidden || (isVideoPlayerOpenNow && !isVideoPlayerOpenNow.classList.contains('hide')) || !slide.classList.contains('active')) {
console.log(`Navigation detected during autoplay check for ${itemId}, stopping video.`); console.log(`Navigation detected during autoplay check for ${itemId}, stopping video.`);
try { try {
event.target.stopVideo(); event.target.stopVideo();
} catch (e) { console.warn("Error stopping video in timeout:", e); } } catch (e) { console.warn("Error stopping video:", e); }
return; return;
} }
if (event.target.getPlayerState() !== YT.PlayerState.PLAYING && // If somehow not playing/buffering yet, force muted fallback
event.target.getPlayerState() !== YT.PlayerState.BUFFERING) { const state = event.target.getPlayerState();
console.warn(`Autoplay blocked for ${itemId}, attempting muted fallback`); if (state !== YT.PlayerState.PLAYING && state !== YT.PlayerState.BUFFERING) {
console.warn(`Autoplay stalled for ${itemId}, attempting muted fallback`);
event.target.mute(); event.target.mute();
event.target.playVideo(); event.target.playVideo();
} }
@@ -1848,11 +1857,6 @@ const SlideCreator = {
if (!STATE.slideshow.autoplayTimeouts) STATE.slideshow.autoplayTimeouts = []; if (!STATE.slideshow.autoplayTimeouts) STATE.slideshow.autoplayTimeouts = [];
STATE.slideshow.autoplayTimeouts.push(timeoutId); STATE.slideshow.autoplayTimeouts.push(timeoutId);
// Pause slideshow timer when video starts if configured
if (CONFIG.waitForTrailerToEnd && STATE.slideshow.slideInterval) {
STATE.slideshow.slideInterval.stop();
}
} }
}, },
'onStateChange': (event) => { 'onStateChange': (event) => {
@@ -1896,6 +1900,7 @@ const SlideCreator = {
}; };
videoAttributes.muted = ""; videoAttributes.muted = "";
videoAttributes.playsinline = ""; // again Safari needs extra treatment...
videoBackdrop = SlideUtils.createElement("video", videoAttributes); videoBackdrop = SlideUtils.createElement("video", videoAttributes);
videoBackdrop.volume = 0.4; videoBackdrop.volume = 0.4;
@@ -1927,7 +1932,10 @@ const SlideCreator = {
}); });
videoBackdrop.addEventListener('error', (event) => { videoBackdrop.addEventListener('error', (event) => {
console.warn(`Local video error for item ${itemId}`); const src = event.target.src || event.target.getAttribute('data-src') || 'unknown';
const errCode = event.target.error ? event.target.error.code : 'n/a';
const errMsg = event.target.error ? event.target.error.message : 'n/a';
console.warn(`Local video error for item ${itemId} | code=${errCode} | msg=${errMsg} | url=${src}`);
const slide = event.target.closest('.slide'); const slide = event.target.closest('.slide');
if (slide && slide.classList.contains('active')) { if (slide && slide.classList.contains('active')) {
SlideshowManager.nextSlide(); SlideshowManager.nextSlide();
@@ -2466,19 +2474,16 @@ const SlideshowManager = {
if (videoBackdrop.tagName === 'VIDEO') { if (videoBackdrop.tagName === 'VIDEO') {
// Restore src from data-src if it was deactivated to release connections // Restore src from data-src if it was deactivated to release connections
const lazySrc = videoBackdrop.getAttribute('data-src'); const lazySrc = videoBackdrop.getAttribute('data-src');
if (lazySrc && !videoBackdrop.src) { const isFreshLoad = lazySrc && !videoBackdrop.src;
videoBackdrop.src = lazySrc;
}
videoBackdrop.currentTime = 0;
videoBackdrop.muted = STATE.slideshow.isMuted; videoBackdrop.muted = STATE.slideshow.isMuted;
if (!STATE.slideshow.isMuted) { if (!STATE.slideshow.isMuted) {
videoBackdrop.volume = 0.4; videoBackdrop.volume = 0.4;
} }
const doPlay = () => {
if (!currentSlide.classList.contains('active')) return;
videoBackdrop.play().catch(e => { videoBackdrop.play().catch(e => {
// Check if it actually started playing after a short delay (handling autoplay blocks)
setTimeout(() => { setTimeout(() => {
if (videoBackdrop.paused && currentSlide.classList.contains('active')) { if (videoBackdrop.paused && currentSlide.classList.contains('active')) {
console.warn(`Autoplay blocked for ${currentItemId}, attempting muted fallback`); console.warn(`Autoplay blocked for ${currentItemId}, attempting muted fallback`);
@@ -2487,22 +2492,41 @@ const SlideshowManager = {
} }
}, 1000); }, 1000);
}); });
};
if (isFreshLoad) {
// Safari: set src, then wait for loadedmetadata before seeking/playing
videoBackdrop.src = lazySrc;
videoBackdrop.load();
videoBackdrop.addEventListener('loadedmetadata', () => {
videoBackdrop.currentTime = 0;
doPlay();
}, { once: true });
} else {
// src already set (e.g. paused slide resuming)
videoBackdrop.currentTime = 0;
doPlay();
}
} 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 // Use loadVideoById to enforce start and end times
// load always starts muted first, then unmute if needed
player.loadVideoById({ player.loadVideoById({
videoId: player._videoId, videoId: player._videoId,
startSeconds: player._startTime || 0, startSeconds: player._startTime || 0,
endSeconds: player._endTime endSeconds: player._endTime
}); });
if (STATE.slideshow.isMuted) {
player.mute(); player.mute();
} else { if (!STATE.slideshow.isMuted) {
setTimeout(() => {
// Only unmute if still on the same slide
if (currentSlide.classList.contains('active')) {
player.unMute(); player.unMute();
player.setVolume(40); player.setVolume(40);
} }
}, 600);
}
// Check if playback successfully started, otherwise fallback to muted // Check if playback successfully started, otherwise fallback to muted
setTimeout(() => { setTimeout(() => {

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.7.0.0", "version": "1.7.0.3",
"changelog": "- Add YouTube no-cookie host and referrer policy for iframe security to fix playback issues on iOS/MacOS", "changelog": "- Add YouTube no-cookie host and referrer policy for iframe security to fix playback issues on iOS/MacOS",
"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.7.0.0/Jellyfin.Plugin.MediaBarEnhanced.zip", "sourceUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/releases/download/v1.7.0.3/Jellyfin.Plugin.MediaBarEnhanced.zip",
"checksum": "d126fd4b76c49bdcca257919fd3db8a5", "checksum": "b4f35ff869129d43c075948e5430b199",
"timestamp": "2026-03-05T01:05:37Z" "timestamp": "2026-03-05T23:23:07Z"
}, },
{ {
"version": "1.6.6.4", "version": "1.6.6.4",