feat (img): add fallback for cloudinary - (2/2))

28nitin07 · 28nitin07 · commit 9076009b050c · 2026-03-08T11:47:05.000+05:30
diff --git a/index.html b/index.html
@@ -6,13 +6,13 @@
   <title>Pawsitive | Ashoka University</title>
   <link href="https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;600;700&family=Klee+One:wght@400;600&display=swap" rel="stylesheet">
   <link rel="stylesheet" href="styles/main.css">
-  <link rel="icon" type="image/jpeg" href="/https://res.cloudinary.com/duij1lw6u/image/upload/f_auto,q_auto/public/logo/Paws Logo.jpg">
+  <link rel="icon" type="image/jpeg" href="https://res.cloudinary.com/duij1lw6u/image/upload/f_auto,q_auto/public/logo/Paws Logo.jpg">
 </head>
 <body>
 
 <nav>
   <div class="logo" onclick="showPage('home')">
-    <img src="/https://res.cloudinary.com/duij1lw6u/image/upload/f_auto,q_auto/public/logo/Paws Logo.jpg" alt="Pawsitive Logo" style="height:32px;vertical-align:middle;margin-right:8px;" onerror="_cldImgError(this)">
+    <img src="https://res.cloudinary.com/duij1lw6u/image/upload/f_auto,q_auto/public/logo/Paws Logo.jpg" alt="Pawsitive Logo" style="height:32px;vertical-align:middle;margin-right:8px;" onerror="_cldImgError(this)">
     pawsitive
   </div>
   <div class="nav-links" id="nav-links">
diff --git a/js/app.js b/js/app.js
@@ -9,6 +9,15 @@ function _cldImgError(img) {
   if (img.dataset.fallback) { img.src = img.dataset.fallback; delete img.dataset.fallback; }
 }
 
+/* ── Favicon fallback — <link rel="icon"> has no onerror, so probe via Image ── */
+(function () {
+  const link = document.querySelector('link[rel="icon"]');
+  if (!link) return;
+  const probe = new Image();
+  probe.onerror = function () { link.href = '/public/logo/Paws Logo.jpg'; };
+  probe.src = link.href;
+}());
+
 /* ── Shared scroll-lock utility (used by all modals) ── */
 function lockScroll() {
   document.body.style.overflow = 'hidden';
diff --git a/js/memoriam.js b/js/memoriam.js
@@ -81,7 +81,7 @@ function initMemorialPhotos() {
         applyMemorialOrientation(img);
         img.classList.add('loaded');
       });
-      img.addEventListener('error', () => { img.style.display = 'none'; });
+      img.addEventListener('error', () => { _cldImgError(img); });
     }
   });
 }
@@ -212,7 +212,7 @@ function openMemorialModal(card) {
 
     const photoSection = card.dataset.image
       ? `<div class="dog-modal-photo memorial-modal-photo-wrap">
-           <img src="${card.dataset.image}" alt="${card.dataset.name}" style="opacity:0;transition:opacity 0.3s" onload="this.style.opacity=1">
+           <img src="${card.dataset.image}" alt="${card.dataset.name}" style="opacity:0;transition:opacity 0.3s" onload="this.style.opacity=1" onerror="_cldImgError(this)">
          </div>`
       : `<div class="dog-modal-emoji" style="background:${bg}">
            <span style="font-size:7rem">${card.dataset.emoji || '🐕'}</span>
diff --git a/pages/donate.html b/pages/donate.html
@@ -15,7 +15,7 @@ <h3>where your money goes</h3>
       <div class="donate-card-head"><h3>📱 pay via UPI</h3><p>instant, zero-fee. scan the QR or copy the ID below.</p></div>
       <div class="donate-card-body">
         <div class="upi-qr-box">
-          <img src="../https://res.cloudinary.com/duij1lw6u/image/upload/f_auto,q_auto/public/donate/upi-qr.jpeg" alt="UPI QR Code" class="upi-qr-img" />
+          <img src="https://res.cloudinary.com/duij1lw6u/image/upload/f_auto,q_auto/public/donate/upi-qr.jpeg" alt="UPI QR Code" class="upi-qr-img" onerror="_cldImgError(this)" />
         </div>
         <div class="upi-id-row">
           <span class="upi-id-text" id="upiIdText">sendaveishaan1@okaxis</span>
