feat(nds): use custom NDS_ keys in events

app/components/NDS.vue

@@ -101,31 +101,35 @@ const { onRender } = useLoop();
 const physicalButtonsDown = new Set<string>();
 let mousePressedButton: string | null = null;
 
-const keyButtonMappings: [key: string, physicalButton: string][] = [
-  // D-pad
-  ["ArrowUp", "UP"],
-  ["ArrowDown", "DOWN"],
-  ["ArrowLeft", "LEFT"],
-  ["ArrowRight", "RIGHT"],
-  ["d", "A"],
-  ["s", "B"],
-  ["w", "X"],
-  ["a", "Y"],
-  [" ", "SELECT"],
-  ["Enter", "START"],
-];
-
-const keyToButton = new Map(keyButtonMappings);
-const buttonToKey = new Map(keyButtonMappings.map(([k, b]) => [b, k]));
+const keyToButton: Record<string, string> = {
+  ArrowUp: "UP",
+  ArrowDown: "DOWN",
+  ArrowLeft: "LEFT",
+  ArrowRight: "RIGHT",
+  d: "A",
+  s: "B",
+  w: "X",
+  a: "Y",
+  " ": "SELECT",
+  Enter: "START",
+};
 
 useKeyDown((key) => {
-  const button = keyToButton.get(key);
-  if (button) physicalButtonsDown.add(button);
+  const button = keyToButton[key];
+  if (button) {
+    physicalButtonsDown.add(button);
+    window.dispatchEvent(
+      new KeyboardEvent("keydown", { key: `NDS_${button}` }),
+    );
+  }
 });
 
 useKeyUp((key) => {
-  const button = keyToButton.get(key);
-  if (button) physicalButtonsDown.delete(button);
+  const button = keyToButton[key];
+  if (button) {
+    physicalButtonsDown.delete(button);
+    window.dispatchEvent(new KeyboardEvent("keyup", { key: `NDS_${button}` }));
+  }
 });
 
 onRender(({ delta }) => {
@@ -176,19 +180,15 @@ onRender(({ delta }) => {
 const pressButton = (button: string) => {
   if (mousePressedButton) {
     physicalButtonsDown.delete(mousePressedButton);
-    const prevKey = buttonToKey.get(mousePressedButton);
-    if (prevKey) {
-      window.dispatchEvent(new KeyboardEvent("keyup", { key: prevKey }));
-    }
+    window.dispatchEvent(
+      new KeyboardEvent("keyup", { key: `NDS_${mousePressedButton}` }),
+    );
   }
 
   physicalButtonsDown.add(button);
   mousePressedButton = button;
 
-  const key = buttonToKey.get(button);
-  if (key) {
-    window.dispatchEvent(new KeyboardEvent("keydown", { key }));
-  }
+  window.dispatchEvent(new KeyboardEvent("keydown", { key: `NDS_${button}` }));
 };
 
 const handleClick = (event: MouseEvent) => {
@@ -285,10 +285,9 @@ const handleMouseUp = () => {
   if (mousePressedButton) {
     physicalButtonsDown.delete(mousePressedButton);
 
-    const key = buttonToKey.get(mousePressedButton);
-    if (key) {
-      window.dispatchEvent(new KeyboardEvent("keyup", { key }));
-    }
+    window.dispatchEvent(
+      new KeyboardEvent("keyup", { key: `NDS_${mousePressedButton}` }),
+    );
 
     mousePressedButton = null;
   }

app/components/Projects/BottomScreen/Buttons.vue

@@ -41,10 +41,10 @@ useScreenMouseWheel((dy) => {
 
 useKeyDown((key) => {
   switch (key) {
-    case "ArrowLeft":
+    case "NDS_LEFT":
       store.scrollProjects("left");
       break;
-    case "ArrowRight":
+    case "NDS_RIGHT":
       store.scrollProjects("right");
       break;
   }