From 9bb7f8d1471bf5cbc4fc99245e520f468a37f31d Mon Sep 17 00:00:00 2001
From: Chandler Swift <chandler@chandlerswift.com>
Date: Wed, 18 Feb 2026 20:37:13 -0600
Subject: [PATCH] Turn off barcode reader after 15m timeout

A future enhancement would be to make sure it only times out 15m after
an album is done playing (possibly by ignoring signals while an album is
playing, and then at the end of the album set the timer again?) but that
wasn't something I've implemented yet.
---
 src/App.tsx | 20 ++++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 21fe836..37db27c 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -62,6 +62,22 @@ function App() {
   const [currentTime, setCurrentTime] = useState(0);
   const [duration, setDuration] = useState(0);
   const audioRef = useRef<HTMLAudioElement | null>(null);
+  const [lastClicked, setLastClicked] = useState(new Date);
+
+  const click = () => setLastClicked(new Date);
+
+  useEffect(() => {
+    const IDLE_TIMEOUT_MS = 15 * 60 * 1000; // 15 minutes
+    window.setTimeout(() => {
+      setDisplayText("Asleep. Tap screen to scan.");
+      fetch('/api/reader/auto', { method: 'POST' });
+    }, lastClicked.getTime() + IDLE_TIMEOUT_MS - new Date().getTime());
+
+    return () => {
+      setDisplayText(WELCOME_TEXT);
+      fetch('/api/reader/on', { method: 'POST' });
+    }
+  }, [lastClicked]);
 
   const handleEnded = () => {
     if ((album?.tracks?.length ?? 0) > nowPlaying + 1) { // if there's a next track
@@ -216,7 +232,7 @@ function App() {
       <p className='welcome' style={{ gridColumn: 'span 2' }}>This album cannot be played, as Chandler doesn't own a copy.</p>
     );
     return (
-      <div className="app">
+      <div className="app" onPointerDown={click}>
         <audio
           ref={audioRef}
           src={album.tracks[nowPlaying].source}
@@ -234,7 +250,7 @@ function App() {
       </div>
     )
   } else {
-    return (<div className="welcome">{displayText}</div>);
+    return (<div className="welcome" onPointerDown={click}>{displayText}</div>);
   }
 }