Close Photo viewer when pressing Escape key

This commit is contained in:
2021-11-30 18:13:58 +01:00
parent f8fe141505
commit 47fee17eb8

View File

@@ -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"
>