From 47fee17eb8087a8f8b00c7cbe0ca57be8c445014 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fe=CC=81lix=20Pe=CC=81ault?= <hello@flayks.com>
Date: Tue, 30 Nov 2021 18:13:58 +0100
Subject: [PATCH] Close Photo viewer when pressing Escape key

---
 src/routes/[country]/[location]/[photo].svelte | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/routes/[country]/[location]/[photo].svelte b/src/routes/[country]/[location]/[photo].svelte
index 6181a56..e8bf55b 100644
--- a/src/routes/[country]/[location]/[photo].svelte
+++ b/src/routes/[country]/[location]/[photo].svelte
@@ -62,6 +62,9 @@
         window.history.replaceState(null, '', $page.path.replace($page.params.photo, currentPhoto.slug))
     }
 
+    // Define previous URL
+    $: previousUrl = $previousPage ? $previousPage : `/${location.country.slug}/${location.slug}`
+
 
     /**
      * Photo navigation
@@ -71,17 +74,23 @@
         canGoPrev && currentIndex++
     }, 200)
 
-    // Fo to previous photo
+    // Go to previous photo
     const goToPrevious = throttle(() => {
         canGoNext && (currentIndex = Math.max(currentIndex - 1, 0))
     }, 200)
 
+    // Close viewer and go to previous page
+    const closeViewer = () => {
+        goto(previousUrl, { replaceState: false, noscroll: true, keepfocus: true })
+    }
+
     // Enable navigation with keyboard
     const handleKeydown = ({ key, defaultPrevented }: KeyboardEvent) => {
         if (defaultPrevented) return
         switch (key) {
             case 'ArrowLeft': goToPrevious(); break;
             case 'ArrowRight': goToNext(); break;
+            case 'Escape': closeViewer(); break;
             default: return;
         }
     }
@@ -221,7 +230,7 @@
 
         <ButtonCircle
             tag="a"
-            url={$previousPage ? $previousPage : `/${location.country.slug}/${location.slug}`}
+            url={previousUrl}
             color="purple"
             class="viewer-photo__close shadow-box-dark"
         >