fix: fix canvas focusing

arianrhodsandlot · Oct 28, 2023 · 7b10739 · 7b10739
1 parent 4de2306
commit 7b10739
Showing 1 changed file with 6 additions and 0 deletions.
diff --git a/src/views/components/home-screen/game-menus/menu-entry-button.tsx b/src/views/components/home-screen/game-menus/menu-entry-button.tsx
@@ -1,13 +1,18 @@
 import { AnimatePresence, motion } from 'framer-motion'
 import { useAtomValue } from 'jotai'
 import { detectHasRunningGame } from '../../../../core'
+import { SpatialNavigation } from '../../../lib/spatial-navigation'
 import { isGameRunningAtom, showMenuOverlayAtom } from '../../atoms'
 import { useMouseMoving } from './hooks'
 
 function isTouchDevice() {
   return 'ontouchstart' in window || navigator.maxTouchPoints > 0
 }
 
+function focusCanvas() {
+  SpatialNavigation.focus('canvas')
+}
+
 export function MenuEntryButton({ onClick }: { onClick: () => void }) {
   const isGameRunning = useAtomValue(isGameRunningAtom)
   const showMenuOverlay = useAtomValue(showMenuOverlayAtom)
@@ -27,6 +32,7 @@ export function MenuEntryButton({ onClick }: { onClick: () => void }) {
           className='fixed inset-0 z-20 flex items-end justify-center bg-gradient-to-b from-transparent from-80% to-black/80'
           exit={{ opacity: 0 }}
           initial={{ opacity: 0 }}
+          onClick={focusCanvas}
           transition={{ duration: 0.1 }}
         >
           <div