Update manifest.json for release v1.7.1.10 [skip ci]

Bump version to 1.7.1.10 in project file and manifest
Enhance CSS styles for buttons and overlays, improving appearance and consistency
2026-03-08 21:36:22 +00:00 · 2026-03-08 22:35:35 +01:00 · 2026-03-08 22:35:31 +01:00 · 2026-03-08 20:58:25 +00:00 · 2026-03-08 21:57:41 +01:00 · 2026-03-08 21:57:22 +01:00
4 changed files with 48 additions and 65 deletions
--- a/Jellyfin.Plugin.MediaBarEnhanced/Jellyfin.Plugin.MediaBarEnhanced.csproj
+++ b/Jellyfin.Plugin.MediaBarEnhanced/Jellyfin.Plugin.MediaBarEnhanced.csproj
@@ -12,7 +12,7 @@
    <!-- <TreatWarningsAsErrors>false</TreatWarningsAsErrors> -->
    <Title>Jellyfin Media Bar Enhanced Plugin</Title>
    <Authors>CodeDevMLH</Authors>
-    <Version>1.7.1.7</Version>
+    <Version>1.7.1.10</Version>
    <RepositoryUrl>https://github.com/CodeDevMLH/jellyfin-plugin-media-bar-enhanced</RepositoryUrl>
  </PropertyGroup>

--- a/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.css
+++ b/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.css
@@ -201,6 +201,9 @@
  user-select: none;
  margin: 0;
  padding: 0;
+  -webkit-appearance: none;
+  appearance: none;
+  border: none;
 }

 .arrow i {
@@ -238,6 +241,9 @@
  opacity: 0.3;
  transition: opacity 0.3s ease;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
+  -webkit-appearance: none;
+  appearance: none;
+  border: none;
 }

 .pause-button i {
@@ -274,6 +280,9 @@
  opacity: 0.3;
  transition: opacity 0.3s ease;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
+  -webkit-appearance: none;
+  appearance: none;
+  border: none;
 }

 .mute-button i {
@@ -353,14 +362,8 @@
  right: 0%;
  width: 100%;
  height: 100%;
-  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%);
+  mask-image: linear-gradient(to top, rgba(255,255,255,0) 2%, rgba(0,0,0,0.5) 6%, #000000 8%);
+  -webkit-mask-image: linear-gradient(to top, rgba(255,255,255,0) 2%, rgba(0,0,0,0.5) 6%, #000000 8%);
 }

 .backdrop-container.full-width-video {
@@ -383,14 +386,8 @@
  object-position: center 20%;
  border-radius: 5px;
  z-index: 3;
-  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%);
+  mask-image: linear-gradient(to top, rgba(255,255,255,0) 2%, rgba(0,0,0,0.5) 6%, #000000 8%);
+  -webkit-mask-image: linear-gradient(to top, rgba(255,255,255,0) 2%, rgba(0,0,0,0.5) 6%, #000000 8%);
 }

 .backdrop-overlay {
@@ -402,14 +399,8 @@
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 5px;
  z-index: 4;
-  mask-image: linear-gradient(to top,
-      #fff0 2%,
-      rgb(0 0 0 / 0.5) 4%,
-      #000000 6%);
-  -webkit-mask-image: linear-gradient(to top,
-      #fff0 2%,
-      rgb(0 0 0 / 0.5) 4%,
-      #000000 6%);
+  mask-image: linear-gradient(to top, rgba(255,255,255,0) 2%, rgba(0,0,0,0.5) 4%, #000000 6%);
+  -webkit-mask-image: linear-gradient(to top, rgba(255,255,255,0) 2%, rgba(0,0,0,0.5) 4%, #000000 6%);
 }

 .gradient-overlay {
@@ -423,14 +414,8 @@
      rgba(29, 29, 29, 0.35) 30%,
      rgba(29, 29, 29, 0) 100%);
  z-index: 4;
-  mask-image: linear-gradient(to top,
-      #fff0 2%,
-      rgb(0 0 0 / 0.5) 4%,
-      #000000 6%);
-  -webkit-mask-image: linear-gradient(to top,
-      #fff0 2%,
-      rgb(0 0 0 / 0.5) 4%,
-      #000000 6%);
+  mask-image: linear-gradient(to top, rgba(255,255,255,0) 2%, rgba(0,0,0,0.5) 4%, #000000 6%);
+  -webkit-mask-image: linear-gradient(to top, rgba(255,255,255,0) 2%, rgba(0,0,0,0.5) 4%, #000000 6%);
 }

 .gradient-overlay.full-width-video {
@@ -531,6 +516,8 @@
  gap: 6px;
  -webkit-tap-highlight-color: #fff0;
  border-radius: 8px;
+  -webkit-appearance: none;
+  appearance: none;
 }

 .detail-button {
@@ -543,6 +530,8 @@
  cursor: pointer;
  transition: color 0.2s;
  -webkit-tap-highlight-color: #fff0;
+  -webkit-appearance: none;
+  appearance: none;
 }

 .favorite-button {
@@ -555,6 +544,8 @@
  cursor: pointer;
  transition: color 0.2s;
  -webkit-tap-highlight-color: #fff0;
+  -webkit-appearance: none;
+  appearance: none;
 }

 .favorite-button.favorited {
@@ -662,7 +653,7 @@
  display: flex;
  align-items: center;
  border-radius: 5px;
-  background: rgb(255 255 255 / 0.8);
+  background: rgba(255, 255, 255, 0.8);
  color: #000;
  border: none;
  font-weight: 600;
@@ -711,14 +702,8 @@
    object-fit: cover;
    object-position: center 20%;
    z-index: 3;
-    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%);
+    mask-image: linear-gradient(to top, rgba(255,255,255,0) 2%, rgba(0,0,0,0.5) 6%, #000000 8%);
+    -webkit-mask-image: linear-gradient(to top, rgba(255,255,255,0) 2%, rgba(0,0,0,0.5) 6%, #000000 8%);
  }

  .gradient-overlay {
@@ -727,17 +712,11 @@
    left: 0;
    width: 100%;
    height: 100%;
-    background: rgb(0 0 0 / 0.25);
+    background: rgba(0, 0, 0, 0.25);
    z-index: 4;
    pointer-events: none;
-    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%);
+    mask-image: linear-gradient(to top, rgba(255,255,255,0) 2%, rgba(0,0,0,0.5) 6%, #000000 8%);
+    -webkit-mask-image: linear-gradient(to top, rgba(255,255,255,0) 2%, rgba(0,0,0,0.5) 6%, #000000 8%);
  }

  .dots-container {
--- a/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js
+++ b/Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js
@@ -836,7 +836,7 @@ const LocalizationUtils = {
      }
    }

-    if (window.ApiClient && STATE.jellyfinData?.accessToken) {
+    if (window.ApiClient && STATE.jellyfinData && STATE.jellyfinData.accessToken) {
      try {
        const userId = window.ApiClient.getCurrentUserId();
        if (userId) {
@@ -846,7 +846,7 @@ const LocalizationUtils = {
          });
          if (userResponse.ok) {
            const userData = await userResponse.json();
-            if (userData.Configuration?.AudioLanguagePreference) {
+            if (userData.Configuration && userData.Configuration.AudioLanguagePreference) {
              locale = userData.Configuration.AudioLanguagePreference.toLowerCase();
            }
          }
@@ -856,7 +856,7 @@ const LocalizationUtils = {
      }
    }

-    if (!locale && window.ApiClient && STATE.jellyfinData?.accessToken) {
+    if (!locale && window.ApiClient && (STATE.jellyfinData && STATE.jellyfinData.accessToken)) {
      try {
        const configUrl = window.ApiClient.getUrl('System/Configuration');
        const configResponse = await fetch(configUrl, {
@@ -1031,7 +1031,7 @@ const LocalizationUtils = {
   */
  getLocalizedString(key, fallback, ...args) {
    const locale = this.cachedLocale || 'en-us';
-    let translated = this.translations[locale]?.[key] || fallback;
+    let translated = (this.translations[locale] && this.translations[locale][key]) || fallback;

    if (args.length > 0) {
      for (let i = 0; i < args.length; i++) {
@@ -1776,9 +1776,12 @@ const SlideCreator = {
      }

      const isLowPower = isLowPowerDevice();
+      const isIOSApp = /iPhone|iPad|iPod/i.test(navigator.userAgent);
+      const limitVideos = isLowPower || isIOSApp;
      const itemIndex = STATE.slideshow.itemIds ? STATE.slideshow.itemIds.indexOf(itemId) : -1;
      const isActiveSlide = itemIndex !== -1 && itemIndex === STATE.slideshow.currentSlideIndex;
-      const shouldCreateVideo = !isLowPower || isActiveSlide;
+      // Limit YouTube iframe bulk creation on low power devices OR iOS (which kills the WebProcess on OOM)
+      const shouldCreateVideo = !limitVideos || isActiveSlide;

      if (isYoutube && videoId && shouldCreateVideo) {
        isVideo = true;
@@ -2454,6 +2457,7 @@ const SlideshowManager = {
        previousVisibleSlide.classList.remove("active");
      }

+      void currentSlide.offsetWidth;
      currentSlide.classList.add("active");

      // Manage Video Playback: Stop others, Play current
@@ -2731,9 +2735,9 @@ const SlideshowManager = {

      const totalItems = STATE.slideshow.itemIds.length;
      let distance = Math.abs(index - currentIndex);
-      if (totalItems > keepRange * 2) {
-          distance = Math.min(distance, totalItems - distance);
-      }
+      
+      // Always calculate circular distance for slideshow
+      distance = Math.min(distance, totalItems - distance);

      if (distance > keepRange) {
        // Destroy video player if exists
@@ -2803,7 +2807,7 @@ const SlideshowManager = {

    if (currentItemId) {
      const currentSlide = document.querySelector(`.slide[data-item-id="${currentItemId}"]`);
-      const video = currentSlide?.querySelector('video');
+      const video = currentSlide ? currentSlide.querySelector('video') : null;

      if (video) {
        video.muted = STATE.slideshow.isMuted;
@@ -2963,7 +2967,7 @@ const SlideshowManager = {
    if (!currentSlide) return;

    // YouTube player: just resume, don't reload
-    const ytPlayer = STATE.slideshow.videoPlayers?.[currentItemId];
+    const ytPlayer = (STATE.slideshow.videoPlayers && STATE.slideshow.videoPlayers[currentItemId]) ? STATE.slideshow.videoPlayers[currentItemId] : undefined;
    if (ytPlayer && typeof ytPlayer.playVideo === 'function') {
      if (STATE.slideshow.isMuted) {
        if (typeof ytPlayer.mute === 'function') ytPlayer.mute();
--- a/manifest.json
+++ b/manifest.json
@@ -9,12 +9,12 @@
    "imageUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/raw/branch/main/logo.png",
    "versions": [
      {
-        "version": "1.7.1.7",
+        "version": "1.7.1.10",
        "changelog": "- feat: add option to disable pagination dots/counter\n- feat: add exclude seasonal content from random fetching option\n- Add hide arrows on mobile option \n- fix button issue on mobile when using ElegantFin Theme",
        "targetAbi": "10.11.0.0",
-        "sourceUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/releases/download/v1.7.1.7/Jellyfin.Plugin.MediaBarEnhanced.zip",
-        "checksum": "2ed5fe25cdce41fa44c159649c8a7898",
-        "timestamp": "2026-03-08T19:15:10Z"
+        "sourceUrl": "https://git.mahom03-spacecloud.de/CodeDevMLH/jellyfin-plugin-media-bar-enhanced/releases/download/v1.7.1.10/Jellyfin.Plugin.MediaBarEnhanced.zip",
+        "checksum": "97e83bbdd363ad11174ffac651ee8bd3",
+        "timestamp": "2026-03-08T21:36:22Z"
      },
      {
        "version": "1.7.0.14",
Author	SHA1	Message	Date
CodeDevMLH	5f296f3c88	Update manifest.json for release v1.7.1.10 [skip ci]	2026-03-08 21:36:22 +00:00
CodeDevMLH	a14b3ca8b5	Bump version to 1.7.1.10 in project file and manifest All checks were successful Auto Release Plugin / build-and-release (push) Successful in 45s Details	2026-03-08 22:35:35 +01:00
CodeDevMLH	4d12e34d01	Enhance CSS styles for buttons and overlays, improving appearance and consistency	2026-03-08 22:35:31 +01:00
CodeDevMLH	59fe6f7083	Update manifest.json for release v1.7.1.9 [skip ci]	2026-03-08 20:58:25 +00:00
CodeDevMLH	dcb2164ea1	Bump version to 1.7.1.9 All checks were successful Auto Release Plugin / build-and-release (push) Successful in 44s Details	2026-03-08 21:57:41 +01:00
CodeDevMLH	2f71f7b46b	Improve null checks and conditionals for better stability in localization and slideshow management Some checks failed Auto Release Plugin / build-and-release (push) Has been cancelled Details	2026-03-08 21:57:22 +01:00
CodeDevMLH	70b0a2a192	Update manifest.json for release v1.7.1.8 [skip ci]	2026-03-08 19:29:25 +00:00
CodeDevMLH	300c76890b	Bump version to 1.7.1.8 in project file and manifest All checks were successful Auto Release Plugin / build-and-release (push) Successful in 46s Details	2026-03-08 20:28:38 +01:00
CodeDevMLH	64e5441aff	Optimize slideshow distance calculation for circular navigation	2026-03-08 20:28:20 +01:00