push

web/js/home.js

@@ -21,6 +21,36 @@
     return data && Array.isArray(data.results) ? data.results.map(SR.cards.normalizeItem) : [];
   }
 
+  function loadHeroLogos(section, items) {
+    const slides = section.querySelectorAll('.hero__slide');
+    items.forEach((item, i) => {
+      const slide = slides[i];
+      if (!slide || !item || item.tmdbId == null) return;
+      const titleEl = slide.querySelector('.hero__title');
+      if (!titleEl) return;
+      const logo = document.createElement('img');
+      logo.className = 'hero__logo';
+      logo.alt = item.name;
+      logo.hidden = true;
+      titleEl.insertAdjacentElement('beforebegin', logo);
+      SR.api.details(item.type, item.tmdbId)
+        .then((details) => {
+          const images = (details && details.images) || {};
+          const logos = images.logos || [];
+          const url = (logos.find((l) => l && l.url && String(l.iso_639_1 || '').toLowerCase() === 'en') || {}).url;
+          if (!url) return;
+          logo.onerror = () => {
+            logo.hidden = true;
+            titleEl.hidden = false;
+          };
+          logo.src = SR.util.tmdbResize(url, 'w500');
+          logo.hidden = false;
+          titleEl.hidden = true;
+        })
+        .catch(() => {});
+    });
+  }
+
   (async () => {
     const [movieRes, tvRes] = await Promise.allSettled([
       SR.api.trending('movie', 'day'),
@@ -38,7 +68,10 @@
         .filter((item) => item.backdrop && item.overview && item.name)
         .slice(0, 6);
       const hero = SR.cards.heroCarousel(heroData);
-      if (hero) heroSlot.appendChild(hero);
+      if (hero) {
+        heroSlot.appendChild(hero);
+        loadHeroLogos(hero, heroData);
+      }
     } catch (e) {
       SR.app.showError(e, 'could not load featured titles');
     }