pause btn

src/components/recenter.js

@@ -2,6 +2,10 @@
  * Pivot the scene when user enters VR to face the links.
  */
 AFRAME.registerComponent('recenter', {
+  schema: {
+    enabled: {default: true}
+  },
+
   init: function() {
     var sceneEl = this.el.sceneEl;
     this.matrix = new THREE.Matrix4();
@@ -18,9 +22,11 @@ AFRAME.registerComponent('recenter', {
     });
     // User can also recenter the menu manually.
     sceneEl.addEventListener('menudown', () => {
+      if (!this.data.enabled) { return; }
       this.recenter();
     });
     sceneEl.addEventListener('thumbstickdown', () => {
+      if (!this.data.enabled) { return; }
       this.recenter();
     });
   },

src/components/song-preview.js

@@ -47,7 +47,7 @@ AFRAME.registerComponent('song-preview-system', {
     this.audioStore[challengeId] = audio;
 
     if (this.preloadQueue.length === 0) {
-      preloadMetatata(audio);
+      this.preloadMetadata(audio);
     } else {
       this.preloadQueue.push(audio);
     }
@@ -56,7 +56,7 @@ AFRAME.registerComponent('song-preview-system', {
   preloadMetadata: function (audio) {
     audio.addEventListener('loadedmetadata', () => {
       if (this.preloadQueue.length) {
-        preloadMetadata(this.preloadQueue[0]);
+        this.preloadMetadata(this.preloadQueue[0]);
       }
     });
     audio.preload = 'metadata';

src/index.html

@@ -23,7 +23,7 @@
         <a-mixin id="textFont" text="font: exo2semibold; letterSpacing: -1"></a-mixin>
       </a-assets>
 
-      <a-entity id="container" recenter>
+      <a-entity id="container" bind__recenter="enabled: menu.active">
         {% include './templates/environment.html' %}
         {% include './templates/gameUi.html' %}
         {% include './templates/menu.html' %}
@@ -31,8 +31,16 @@
 
       <a-entity id="cameraRig">
         <a-entity id="camera" camera look-controls="enabled: false" orbit-controls="target: 0 1.6 -0.5; maxDistance: 20; initialPosition: 0 1.6 0"></a-entity>
-        <a-entity id="leftHand" controller="hand: left"></a-entity>
-        <a-entity id="rightHand" controller="hand: right"></a-entity>
+        <a-entity id="leftHand"
+          controller="hand: left"
+          proxy-event__pause="event: menudown; to: a-scene; as: pause"
+          proxy-event__pauserifta="event: abuttondown; to: a-scene; as: pause"
+          proxy-event__pauseriftb="event: bbuttondown; to: a-scene; as: pause"></a-entity>
+        <a-entity id="rightHand"
+          controller="hand: right"
+          proxy-event__pause="event: menudown; to: a-scene; as: pause"
+          proxy-event__pauseriftx="event: xbuttondown; to: a-scene; as: pause"
+          proxy-event__pauserifty="event: ybuttondown; to: a-scene; as: pause"></a-entity>
       </a-entity>
 
       <a-entity id="mouseCursor" mixin="raycaster" cursor="rayOrigin: mouse" debug-cursor

src/state/index.js

@@ -82,6 +82,10 @@ AFRAME.registerState({
       state.menuSelectedChallenge.difficulty = difficulty;
     },
 
+    pause: (state) => {
+      state.menu.active = true;
+    },
+
     /**
      * Start challenge.
      * Transfer staged challenge to the active challenge.
@@ -131,10 +135,6 @@ AFRAME.registerState({
       computeSearchPagination(state);
     },
 
-    togglemenu: (state) => {
-      state.menu.active = !state.menu.active;
-    },
-
     'enter-vr': (state) => {
       state.inVR = true;
     },