♿ click comic to navigate

static/js/comic-nav.js

@@ -34,12 +34,16 @@
         // Update date
         document.querySelector('.comic-date').textContent = comic.date;
 
-        // Update image
-        const img = document.querySelector('.comic-image img');
+        // Update image and its link
+        const comicImageDiv = document.querySelector('.comic-image');
+        const img = comicImageDiv.querySelector('img');
         img.src = `/static/images/comics/${comic.filename}`;
         img.alt = title;
         img.title = comic.alt_text;
 
+        // Update or create/remove the link wrapper
+        updateComicImageLink(comic.number);
+
         // Update author note
         const transcriptDiv = document.querySelector('.comic-transcript');
         if (comic.author_note) {
@@ -66,6 +70,30 @@
         history.pushState({ comicId: comic.number }, '', `/comic/${comic.number}`);
     }
 
+    // Update comic image link for click navigation
+    function updateComicImageLink(currentNumber) {
+        const comicImageDiv = document.querySelector('.comic-image');
+        const img = comicImageDiv.querySelector('img');
+
+        // Remove existing link if present
+        const existingLink = comicImageDiv.querySelector('a');
+        if (existingLink) {
+            existingLink.replaceWith(img);
+        }
+
+        // Add link if there's a next comic
+        if (currentNumber < totalComics) {
+            const link = document.createElement('a');
+            link.href = `/comic/${currentNumber + 1}`;
+            link.onclick = (e) => {
+                e.preventDefault();
+                loadComic(currentNumber + 1);
+            };
+            img.parentNode.insertBefore(link, img);
+            link.appendChild(img);
+        }
+    }
+
     // Update navigation button states
     function updateNavButtons(currentNumber) {
         const navButtons = document.querySelector('.nav-buttons');
@@ -129,6 +157,7 @@
 
         if (currentNumber && totalComics) {
             updateNavButtons(currentNumber);
+            updateComicImageLink(currentNumber);
         }
 
         // Handle browser back/forward