feat: Implemented launching and downloading of roms

This is just an initial implementation lots of kings to iron out

src/mainview/scripts/spatialNavigation.ts

@@ -1,25 +1,28 @@
 import
 {
+  getCurrentFocusKey,
   init,
   SpatialNavigation,
 } from "@noriginmedia/norigin-spatial-navigation";
+import { RefObject, useEffect } from "react";
 
 init({
   shouldFocusDOMNode: false,
-  throttle: 200,
+  throttle: 200
 });
 
 let addFocusable = SpatialNavigation.addFocusable.bind(SpatialNavigation);
 let removeFocusable = SpatialNavigation.removeFocusable.bind(SpatialNavigation);
+let setCurrentFocusedKey = SpatialNavigation.setCurrentFocusedKey.bind(SpatialNavigation);
 
 type SaveFocusType = "session" | "local";
 
-type HistorySourceType = "settings" | 'details';
+type HistorySourceType = "settings" | 'details' | 'launch';
 const historySourceMap = new Map<string, string>();
 
-export function SaveSource (id: HistorySourceType, url: string)
+export function SaveSource (id: HistorySourceType, url?: string)
 {
-  historySourceMap.set(id, url);
+  historySourceMap.set(id, url ?? location.hash.replace("#", ''));
 }
 
 export function HasSource (id: HistorySourceType)
@@ -29,11 +32,49 @@ export function HasSource (id: HistorySourceType)
 
 export function PopSource (id: HistorySourceType)
 {
+  if (!historySourceMap.has(id))
+  {
+    return undefined;
+  }
   const source = historySourceMap.get(id);
   historySourceMap.delete(id);
   return source;
 }
 
+export function GetFocusedElement (focusKey: string)
+{
+  return (SpatialNavigation as any).focusableComponents[focusKey]?.node as HTMLElement;
+}
+
+export function dispatchFocusedEvent (event: Event, override?: Element | Window)
+{
+  const focusedElement = GetFocusedElement(getCurrentFocusKey());
+  const finalTarget = override ?? focusedElement ?? window;
+  return finalTarget.dispatchEvent(event);
+}
+
+export interface FocusEventMap
+{
+  'focuschanged': Event;
+}
+
+export function useFocusEventListener<K extends keyof FocusEventMap, O extends HTMLElement> (eventName: K, handler: (event: FocusEventMap[K]) => void, element?: RefObject<O | null | undefined>): void
+{
+  useEffect(() =>
+  {
+    const finalElement = element ? element.current : window;
+    finalElement?.addEventListener(eventName, handler);
+
+    return () => finalElement?.removeEventListener(eventName, handler);
+  }, [eventName, handler, element?.current]);
+}
+
+SpatialNavigation.setCurrentFocusedKey = (newFocusKey, focusDetails) =>
+{
+  setCurrentFocusedKey(newFocusKey, focusDetails);
+  dispatchFocusedEvent(new Event('focuschanged', { bubbles: true }));
+};
+
 SpatialNavigation.addFocusable = (toAdd) =>
 {
   addFocusable(toAdd);