From ca036ad6edf2f273ecefe117c3f8232ee53b0e56 Mon Sep 17 00:00:00 2001
From: Benjamin Wiegand <ben@noreply.git.wiegand.pw>
Date: Sun, 8 Sep 2024 12:45:17 -0700
Subject: [PATCH] close image viewer on escape key

---
 www/image-modal.js | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/www/image-modal.js b/www/image-modal.js
index bdd696c..83705fd 100644
--- a/www/image-modal.js
+++ b/www/image-modal.js
@@ -5,6 +5,7 @@ for (const image of images) {
     const close = image.querySelector('.close')
     const lazy_image = image.querySelector('.lazy-image')
     const zoom = modal.querySelector('input')
+    const open = image.querySelector('input');
     
     // for pan
     let grabbed = false;
@@ -22,18 +23,18 @@ for (const image of images) {
     lazy_image.addEventListener('mouseup', () => {
         grabbed = false;
     });
-    lazy_image.addEventListener('mousedown', (e) => {
+    lazy_image.addEventListener('mousedown', e => {
         grabbed = true;
         startX =  modal.scrollLeft + e.pageX;
         startY =  modal.scrollTop + e.pageY;
-        
+
         // set stuff for zoom
         clickX = e.clientX - lazy_image.offsetLeft;
         clickY = e.clientY - lazy_image.offsetTop;
         initW = lazy_image.clientWidth;
         initH = lazy_image.clientHeight;
     });
-    lazy_image.addEventListener('mousemove', (e) => {
+    lazy_image.addEventListener('mousemove', e => {
         if(!grabbed) return;
         modal.scrollLeft = startX - e.pageX;
         modal.scrollTop = startY - e.pageY;
@@ -51,12 +52,17 @@ for (const image of images) {
                 lazy_image.clientWidth / initW,
                 lazy_image.clientHeight / initH
             );
-            console.log(zoom_factor);
             x = clickX * zoom_factor - (window.innerWidth / 2);
             y = clickY * zoom_factor - (window.innerHeight / 2);
-            console.log('zoom 2 ' + x + ', ' + y);
             modal.scrollLeft = x;
             modal.scrollTop = y;
         }
     })
-}
\ No newline at end of file
+
+    // close image on escape key
+    document.addEventListener('keydown', e => {
+        if (e.key == 'Escape') open.checked = false;
+    });
+}
+
+