|
|
|
|
@@ -163,6 +163,14 @@ const isUserLoggedIn = () => {
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Detects if the current device is a low-power device (Smart TVs, etc.)
|
|
|
|
|
* @returns {boolean} True if running on a low-power device
|
|
|
|
|
*/
|
|
|
|
|
const isLowPowerDevice = () => {
|
|
|
|
|
return /webOS|LG Browser|SMART-TV|SmartTV|Tizen|Viera|NetCast|Roku|VIDAA/i.test(navigator.userAgent);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Initializes Jellyfin data from ApiClient
|
|
|
|
|
* @param {Function} callback - Function to call once data is initialized
|
|
|
|
|
@@ -734,17 +742,21 @@ const SlideUtils = {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (isYoutube && videoId) {
|
|
|
|
|
const playerDiv = this.createElement('div', { id: 'modal-yt-player' });
|
|
|
|
|
contentContainer.appendChild(playerDiv);
|
|
|
|
|
const ytIframe = this.createElement('iframe', {
|
|
|
|
|
id: 'modal-yt-player',
|
|
|
|
|
src: `https://www.youtube-nocookie.com/embed/${videoId}?enablejsapi=1&origin=${encodeURIComponent(window.location.origin)}`,
|
|
|
|
|
allow: 'autoplay; encrypted-media',
|
|
|
|
|
style: 'width: 100%; height: 100%; border: none;',
|
|
|
|
|
referrerpolicy: 'strict-origin-when-cross-origin',
|
|
|
|
|
allowfullscreen: 'true'
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
contentContainer.appendChild(ytIframe);
|
|
|
|
|
overlay.append(closeButton, contentContainer);
|
|
|
|
|
document.body.appendChild(overlay);
|
|
|
|
|
|
|
|
|
|
this.loadYouTubeIframeAPI().then(() => {
|
|
|
|
|
new YT.Player('modal-yt-player', {
|
|
|
|
|
height: '100%',
|
|
|
|
|
width: '100%',
|
|
|
|
|
videoId: videoId,
|
|
|
|
|
host: 'https://www.youtube-nocookie.com',
|
|
|
|
|
new YT.Player(ytIframe, {
|
|
|
|
|
playerVars: {
|
|
|
|
|
autoplay: 1,
|
|
|
|
|
controls: 1,
|
|
|
|
|
@@ -753,14 +765,6 @@ const SlideUtils = {
|
|
|
|
|
playsinline: 1,
|
|
|
|
|
origin: window.location.origin,
|
|
|
|
|
enablejsapi: 1
|
|
|
|
|
},
|
|
|
|
|
events: {
|
|
|
|
|
'onReady': (event) => {
|
|
|
|
|
const iframe = event.target.getIframe();
|
|
|
|
|
if (iframe) {
|
|
|
|
|
iframe.setAttribute('referrerpolicy', 'strict-origin-when-cross-origin');
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
@@ -1696,7 +1700,7 @@ const SlideCreator = {
|
|
|
|
|
console.log(`Using local trailer fallback for ${itemId}: ${trailerUrl}`);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
|
|
|
|
|
const isMobile = /Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
|
|
|
|
|
|
|
|
|
|
// Client Setting Overrides
|
|
|
|
|
const enableVideo = MediaBarEnhancedSettingsManager.getSetting('videoBackdrops', CONFIG.enableVideoBackdrop);
|
|
|
|
|
@@ -1726,7 +1730,12 @@ const SlideCreator = {
|
|
|
|
|
console.warn("Invalid trailer URL:", trailerUrl);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (isYoutube && videoId) {
|
|
|
|
|
const isLowPower = isLowPowerDevice();
|
|
|
|
|
const itemIndex = STATE.slideshow.itemIds ? STATE.slideshow.itemIds.indexOf(itemId) : -1;
|
|
|
|
|
const isActiveSlide = itemIndex !== -1 && itemIndex === STATE.slideshow.currentSlideIndex;
|
|
|
|
|
const shouldCreateVideo = !isLowPower || isActiveSlide;
|
|
|
|
|
|
|
|
|
|
if (isYoutube && videoId && shouldCreateVideo) {
|
|
|
|
|
isVideo = true;
|
|
|
|
|
// Create container for YouTube API
|
|
|
|
|
const videoClass = CONFIG.fullWidthVideo ? "video-backdrop-full" : "video-backdrop-default";
|
|
|
|
|
@@ -1737,12 +1746,17 @@ const SlideCreator = {
|
|
|
|
|
style: "opacity: 0; transition: opacity 1.2s ease-in-out;" // Start interrupted/transparent
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
const ytPlayerDiv = SlideUtils.createElement("div", {
|
|
|
|
|
// Create an iframe upfront
|
|
|
|
|
const ytPlayerIframe = SlideUtils.createElement("iframe", {
|
|
|
|
|
id: `youtube-player-${itemId}`,
|
|
|
|
|
style: "width: 100%; height: 100%;"
|
|
|
|
|
src: `https://www.youtube-nocookie.com/embed/${videoId}?enablejsapi=1&origin=${encodeURIComponent(window.location.origin)}`,
|
|
|
|
|
style: "width: 100%; height: 100%; border: none;",
|
|
|
|
|
allow: "autoplay; encrypted-media",
|
|
|
|
|
referrerpolicy: "strict-origin-when-cross-origin",
|
|
|
|
|
allowfullscreen: "true"
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
videoBackdrop.appendChild(ytPlayerDiv);
|
|
|
|
|
videoBackdrop.appendChild(ytPlayerIframe);
|
|
|
|
|
|
|
|
|
|
// Initialize YouTube Player
|
|
|
|
|
SlideUtils.loadYouTubeIframeAPI().then(() => {
|
|
|
|
|
@@ -1787,19 +1801,10 @@ const SlideCreator = {
|
|
|
|
|
console.info(`SponsorBlock outro detected for video ${videoId}: ending at ${playerVars.end}s`);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
STATE.slideshow.videoPlayers[itemId] = new YT.Player(`youtube-player-${itemId}`, {
|
|
|
|
|
height: '100%',
|
|
|
|
|
width: '100%',
|
|
|
|
|
videoId: videoId,
|
|
|
|
|
host: 'https://www.youtube-nocookie.com',
|
|
|
|
|
STATE.slideshow.videoPlayers[itemId] = new YT.Player(ytPlayerIframe, {
|
|
|
|
|
playerVars: playerVars,
|
|
|
|
|
events: {
|
|
|
|
|
'onReady': (event) => {
|
|
|
|
|
const iframe = event.target.getIframe();
|
|
|
|
|
if (iframe) {
|
|
|
|
|
iframe.setAttribute('referrerpolicy', 'strict-origin-when-cross-origin');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// Store start/end time and videoId for later use
|
|
|
|
|
event.target._startTime = playerVars.start || 0;
|
|
|
|
|
event.target._endTime = playerVars.end || undefined;
|
|
|
|
|
@@ -1883,7 +1888,7 @@ const SlideCreator = {
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// 2. Check for local video trailers in MediaSources if yt is not available
|
|
|
|
|
} else if (!isYoutube) {
|
|
|
|
|
} else if (!isYoutube && shouldCreateVideo) {
|
|
|
|
|
isVideo = true;
|
|
|
|
|
|
|
|
|
|
const videoSrc = (typeof trailerUrl === 'object' ? trailerUrl.url : trailerUrl);
|
|
|
|
|
@@ -2575,7 +2580,7 @@ const SlideshowManager = {
|
|
|
|
|
STATE.slideshow.isTransitioning = false;
|
|
|
|
|
|
|
|
|
|
if (previousVisibleSlide) {
|
|
|
|
|
const enableAnimations = MediaBarEnhancedSettingsManager.getSetting('slideAnimations', CONFIG.slideAnimationEnabled);
|
|
|
|
|
const enableAnimations = MediaBarEnhancedSettingsManager.getSetting('slideAnimations', CONFIG.slideAnimationEnabled) && !isLowPowerDevice();
|
|
|
|
|
if (enableAnimations) {
|
|
|
|
|
const prevBackdrop = previousVisibleSlide.querySelector(".backdrop");
|
|
|
|
|
const prevLogo = previousVisibleSlide.querySelector(".logo");
|
|
|
|
|
@@ -2616,7 +2621,9 @@ const SlideshowManager = {
|
|
|
|
|
*/
|
|
|
|
|
async preloadAdjacentSlides(currentIndex) {
|
|
|
|
|
const totalItems = STATE.slideshow.totalItems;
|
|
|
|
|
const preloadCount = Math.min(Math.max(CONFIG.preloadCount || 1, 1), 5);
|
|
|
|
|
let preloadCount = Math.min(Math.max(CONFIG.preloadCount || 1, 1), 5);
|
|
|
|
|
if (isLowPowerDevice()) preloadCount = 1; // Strict limit for TVs
|
|
|
|
|
|
|
|
|
|
const preloadedIds = new Set();
|
|
|
|
|
|
|
|
|
|
// Preload next slides
|
|
|
|
|
|
