From f0f13521bd85070f2adc45d3728a33bdb97b9984 Mon Sep 17 00:00:00 2001
From: Santtu Pajukanta <santtu@pajukanta.fi>
Date: Fri, 27 Sep 2024 19:52:30 +0300
Subject: [PATCH] feat(PictureView): press S to start slideshow

---
 frontend/src/components/PictureView/index.tsx | 20 ++++++++++++++++---
 1 file changed, 17 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/PictureView/index.tsx b/frontend/src/components/PictureView/index.tsx
index 7a5edac..544d1c5 100644
--- a/frontend/src/components/PictureView/index.tsx
+++ b/frontend/src/components/PictureView/index.tsx
@@ -38,7 +38,7 @@ function PictureView({ album, picture, fromAlbumView, history }: PictureViewProp
   const [isContactDialogOpen, setContactDialogOpen] = React.useState(false);
 
   const goTo = React.useCallback(
-    (direction: Direction) => () => {
+    (direction: Direction, state: unknown = undefined) => () => {
       // TODO hairy due to refactoring .album away from picture, ameliorate
       const destination = direction === 'album' ? album : picture[direction];
       if (destination) {
@@ -49,10 +49,10 @@ function PictureView({ album, picture, fromAlbumView, history }: PictureViewProp
             history.goBack();
           } else {
             // arrived using direct link
-            history.push(destination.path);
+            history.push(destination.path, state);
           }
         } else {
-          history.replace(destination.path);
+          history.replace(destination.path, state);
         }
       }
     },
@@ -72,6 +72,9 @@ function PictureView({ album, picture, fromAlbumView, history }: PictureViewProp
       if (event.key === 'r' || event.key === 'R') {
         history.push('/random');
         return;
+      } else if (event.key === 's' || event.key === 'S') {
+        startSlideshow();
+        return;
       }
 
       const direction = keyMap[event.code];
@@ -120,9 +123,20 @@ function PictureView({ album, picture, fromAlbumView, history }: PictureViewProp
     window.open(picture.original.src);
   }, [picture]);
 
+  const startSlideshow = React.useCallback(() => {
+    setTimeout(() => {
+      goTo('next', { slideshow: true })();
+    }, 5000);
+  }, [goTo]);
+
   React.useEffect(() => {
     preloadPreviousAndNext(picture);
     document.addEventListener('keydown', onKeyDown);
+
+    if ((history.location.state as any).slideshow) {
+      startSlideshow();
+    }
+
     return () => {
       document.removeEventListener('keydown', onKeyDown);
     };