feat(nds): add help button with hints for all physical buttons

app/stores/app.ts

@@ -51,6 +51,8 @@ export const useAppStore = defineStore("app", {
       screen: "home" as AppScreen,
       visitedGallery: false,
       camera: null as THREE.Camera | null,
+      hintsVisible: false,
+      hintsAllowed: false,
     };
   },
 
@@ -86,6 +88,24 @@ export const useAppStore = defineStore("app", {
       }
     },
 
+    allowHints() {
+      this.hintsAllowed = true;
+    },
+
+    disallowHints() {
+      this.hintsAllowed = false;
+      this.hintsVisible = false;
+    },
+
+    showHints() {
+      if (!this.hintsAllowed) return;
+      this.hintsVisible = true;
+    },
+
+    hideHints() {
+      this.hintsVisible = false;
+    },
+
     setCamera(camera: THREE.Camera) {
       this.camera = camera;
     },

app/stores/gallery.ts

@@ -35,6 +35,7 @@ export const useGalleryStore = defineStore("gallery", {
       this.isOutro = false;
 
       const app = useAppStore();
+      app.disallowHints();
 
       // Intro: Fade starts first (at 0), camera starts after with overlap
       const cameraDelay =
@@ -157,6 +158,7 @@ export const useGalleryStore = defineStore("gallery", {
       setTimeout(() => {
         this.isOutro = false;
         app.navigateTo("home");
+        app.allowHints();
       }, ANIMATION.NAVIGATE_DELAY);
     },
   },

app/stores/intro.ts

@@ -47,7 +47,11 @@ export const useIntroStore = defineStore("intro", {
             ease: "steps(" + (totalFrames - 1) + ")",
           },
           4.1,
-        );
+        )
+        .call(() => {
+          const app = useAppStore();
+          app.allowHints();
+        });
     },
 
     animateOutro() {