Fix: Handle images with spaces on its src url

views/display.ejs

@@ -2,7 +2,7 @@
 <div class="chapterOverview" id="chapterOverview">
     <div class="flexBox" id="flexBox">
         <% for(var [index, img] of data.List.entries()){ %>
-            <img class="overview" id="img<%= index %>" src=<%= img.startsWith('.')?img.replace('.',''):img.replaceAll(' ','%20') %> onclick="_scrollTo('<%= '_img'+index%>')"  />    
+            <img class="overview" id="img<%= index %>" src=<%= img.startsWith('.')?img.replace('.','').replaceAll(' ', '%20'):img.replaceAll(' ','%20') %> onclick="_scrollTo('<%= '_img'+index%>')"  />    
         <% } %> 
     </div>
     <div class="expand" onclick="_toggle()">
@@ -24,7 +24,12 @@
         <button class="pullBackUp" onclick="pullUp()"> <span class="material-symbols-outlined chevronUp">expand_less</span></button>
         <div id="display">
             <% for(var [index, img] of data.List.entries()){ %>
-                <img class="_<%= img.split('.')[img.split('.').length-2].split('/')[img.split('.')[img.split('.').length-2].split('/').length-1]%>" id="_img<%= index %>" src=<%= img.startsWith('.')?img.replace('.',''):img.replaceAll(' ','%20') %>  alt="img<%= index %>"/> 
+                <img 
+                    class="_<%= img.split('.')[img.split('.').length-2].split('/')[img.split('.')[img.split('.').length-2].split('/').length-1]%>" 
+                    id="_img<%= index %>" 
+                    src=<%=img.startsWith('.')?img.replace('.','').replaceAll(' ', '%20'):img.replaceAll(' ','%20')%>  
+                    alt="img<%= index %>"
+                /> 
             <% } %> 
             <div id="last-image" 
             hx-post="/chapterRead/<%= data.scanlator %>/<%= encodeURIComponent(data.mangaLink)%>/<%= data.title %>/<%= data.chapterNum %>"
@@ -51,9 +56,9 @@
 </div>
 <script>
     checkPreview();
-    hasFinished()
     document.getElementById('lastImageRecordedAsRead').addEventListener('htmx:load', (event) =>
     {
+        if(hasFinished()) return
         let link = event.target.outerHTML.split('"')[1];
         let aux = link.split('.')[link.split('.').length-2].split('/');
         let id = '_'+aux[aux.length-1];
@@ -164,6 +169,7 @@
                 lastImage.click();
             }
         });
+        console.log(observer)
         observer.observe(lastImage);
     }
     function checkPreview()