From cfb4d987c53fd4c5ab5b8cba512a43a20b59bef3 Mon Sep 17 00:00:00 2001
From: foxster-mp4 <foxster.utube@gmail.com>
Date: Sun, 28 May 2023 10:50:43 -0700
Subject: [PATCH] Handle missing/non-existent images

---
 app.html     | 4 ++--
 js/apps.js   | 2 +-
 js/main.js   | 8 ++++++++
 js/shared.js | 4 ++--
 4 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/app.html b/app.html
index ffb4840..f6dd202 100644
--- a/app.html
+++ b/app.html
@@ -22,7 +22,7 @@
           Back
         </button>
         <div id="title" class="hidden">
-          <img src="img/generic_app.jpeg" alt="generic-app-icon">
+          <img id="app-icon" src="img/generic_app.jpeg" alt="generic-app-icon">
           <p>AltSource</p>
         </div>
         <a href="https://example.com" class="install hidden">
@@ -34,7 +34,7 @@
     <div class="item">
       <div class="app-header">
         <div class="content">
-          <img src="img/generic_app.jpeg" alt="generic-app-icon">
+          <img id="app-icon" src="img/generic_app.jpeg" alt="generic-app-icon">
           <div class="right">
             <div class="text">
               <p class="title">AltSource</p>
diff --git a/js/apps.js b/js/apps.js
index c299691..b8778b5 100644
--- a/js/apps.js
+++ b/js/apps.js
@@ -18,7 +18,7 @@ function main(json) {
         if (app.screenshotURLs) {
             html += `
             <div class="screenshots">`;
-            for (let i = 0; i < app.screenshotURLs.length, i < 2; i++) html += `
+            for (let i = 0; i < app.screenshotURLs.length, i < 2; i++) if (app.screenshotURLs[i]) html += `
                 <img src="${app.screenshotURLs[i]}" class="screenshot">`;
             html += `
             </div>`;
diff --git a/js/main.js b/js/main.js
index b11ee65..68663b5 100644
--- a/js/main.js
+++ b/js/main.js
@@ -35,6 +35,14 @@ function waitForAllImagesToLoad() {
         newImage.addEventListener("load", loaded);
         // Set src
         newImage.src = image.src;
+
+        // Unable to load image
+        image.addEventListener("error", (event) => {
+            if (event.target.id == "app-icon") {
+                event.target.src = "img/generic_app.jpeg";
+            } else event.target.remove()
+            loaded();
+        });
     });
 
     function loaded() {
diff --git a/js/shared.js b/js/shared.js
index d206137..666f0d0 100644
--- a/js/shared.js
+++ b/js/shared.js
@@ -1,5 +1,5 @@
 const urlSearchParams = new URLSearchParams(window.location.search);
-const sourceURL = urlSearchParams.get('source');
+const sourceURL = urlSearchParams.get('source').replaceAll("+", "%2B");
 // https://stackoverflow.com/a/8943487
 const urlRegex = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
 
@@ -33,7 +33,7 @@ const appHeaderHTML = app => app ? `
 <div class="item">
     <div class="app-header">
         <div class="content">
-            <img src="${app.iconURL}" alt="">
+            <img id="app-icon" src="${app.iconURL}" alt="">
             <div class="right">
                 <div class="text">
                     <p class="title">${app.name}</p>