From a8c0ae8f18d56ffbc7de42d3bf787fe0cd487402 Mon Sep 17 00:00:00 2001
From: olcxja <olcxja@olcxja.ovh>
Date: Mon, 17 Aug 2026 12:08:38 +0200
Subject: [PATCH] fix banner view

---
 android/app/src/main/assets/public/main.js    | 12 +-----------
 android/app/src/main/assets/public/screens.js |  2 +-
 webroot/main.js                               | 12 +-----------
 webroot/screens.js                            |  2 +-
 4 files changed, 4 insertions(+), 24 deletions(-)

diff --git a/android/app/src/main/assets/public/main.js b/android/app/src/main/assets/public/main.js
index 8170cb93..6207779b 100644
--- a/android/app/src/main/assets/public/main.js
+++ b/android/app/src/main/assets/public/main.js
@@ -1891,17 +1891,7 @@ async function openProfile(accountId) {
         
         let bannerUrl = `${url}/user/storage/public/getentry?id=${accountId}&e=larp.profile.banner`;
         if (accountId === window.id && window.profileUpdateTimestamp) bannerUrl += `&t=${window.profileUpdateTimestamp}`;
-        let bannerHtml = `<img src="${bannerUrl}" class="profile-banner">`;
-        setTimeout(() => {
-            let bannerImg = document.querySelector("#profile-popup-inner .profile-banner");
-            if (bannerImg) {
-                bannerImg.addEventListener("error", function() {
-                    let div = document.createElement("div");
-                    div.className = "profile-banner";
-                    this.parentNode.replaceChild(div, this);
-                });
-            }
-        }, 50);
+        let bannerHtml = `<img src="${bannerUrl}" class="profile-banner" onerror="this.outerHTML='<div class=\\'profile-banner\\'></div>'">`;
         
         let bio = await fetchAsync(`${url}/user/storage/public/getentry?id=${accountId}&e=larp.profile.bio`);
         if (bio.startsWith("error:")) bio = "";
diff --git a/android/app/src/main/assets/public/screens.js b/android/app/src/main/assets/public/screens.js
index 02580348..2fc8d98c 100644
--- a/android/app/src/main/assets/public/screens.js
+++ b/android/app/src/main/assets/public/screens.js
@@ -359,7 +359,7 @@ var profileSettings = `
     <br>
     <div class="input-group" style="display: flex; flex-direction: row; align-items: stretch; justify-content: space-between; border: var(--border-width) solid var(--light-border-color); border-radius: 0.8rem; padding: 1rem; width: 100%; max-width: 30rem;">
         <div style="width: 12.4rem; aspect-ratio: 494 / 200; background: var(--main-bg-color); border-radius: 0.4rem; overflow: hidden; display: flex; align-items: center; justify-content: center; border: var(--border-width) solid rgba(255, 255, 255, 0.2);">
-            <img id="settings-banner-preview" src="" style="width: 100%; height: 100%; object-fit: cover;">
+            <img id="settings-banner-preview" src="" style="width: 100%; height: 100%; object-fit: cover;" onerror="this.style.display='none'" onload="this.style.display='block'">
         </div>
         <div style="display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; padding: 0.1rem 0;">
             <div style="font-weight: bold;"><blah>title.banner</blah></div>
diff --git a/webroot/main.js b/webroot/main.js
index 8170cb93..6207779b 100644
--- a/webroot/main.js
+++ b/webroot/main.js
@@ -1891,17 +1891,7 @@ async function openProfile(accountId) {
         
         let bannerUrl = `${url}/user/storage/public/getentry?id=${accountId}&e=larp.profile.banner`;
         if (accountId === window.id && window.profileUpdateTimestamp) bannerUrl += `&t=${window.profileUpdateTimestamp}`;
-        let bannerHtml = `<img src="${bannerUrl}" class="profile-banner">`;
-        setTimeout(() => {
-            let bannerImg = document.querySelector("#profile-popup-inner .profile-banner");
-            if (bannerImg) {
-                bannerImg.addEventListener("error", function() {
-                    let div = document.createElement("div");
-                    div.className = "profile-banner";
-                    this.parentNode.replaceChild(div, this);
-                });
-            }
-        }, 50);
+        let bannerHtml = `<img src="${bannerUrl}" class="profile-banner" onerror="this.outerHTML='<div class=\\'profile-banner\\'></div>'">`;
         
         let bio = await fetchAsync(`${url}/user/storage/public/getentry?id=${accountId}&e=larp.profile.bio`);
         if (bio.startsWith("error:")) bio = "";
diff --git a/webroot/screens.js b/webroot/screens.js
index 02580348..2fc8d98c 100644
--- a/webroot/screens.js
+++ b/webroot/screens.js
@@ -359,7 +359,7 @@ var profileSettings = `
     <br>
     <div class="input-group" style="display: flex; flex-direction: row; align-items: stretch; justify-content: space-between; border: var(--border-width) solid var(--light-border-color); border-radius: 0.8rem; padding: 1rem; width: 100%; max-width: 30rem;">
         <div style="width: 12.4rem; aspect-ratio: 494 / 200; background: var(--main-bg-color); border-radius: 0.4rem; overflow: hidden; display: flex; align-items: center; justify-content: center; border: var(--border-width) solid rgba(255, 255, 255, 0.2);">
-            <img id="settings-banner-preview" src="" style="width: 100%; height: 100%; object-fit: cover;">
+            <img id="settings-banner-preview" src="" style="width: 100%; height: 100%; object-fit: cover;" onerror="this.style.display='none'" onload="this.style.display='block'">
         </div>
         <div style="display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; padding: 0.1rem 0;">
             <div style="font-weight: bold;"><blah>title.banner</blah></div>