update aframe-extras

public/app.js

@@ -1404,15 +1404,15 @@ class App {
 
     await loadjs([
       '/vwf/model/aframe/aframe-master.min.js',
-      '/vwf/model/aframe/extras/aframe-extras.loaders.js',
-      '/vwf/model/aframe/extras/aframe-extras.controls.min.js',
-      '/vwf/model/aframe/kframe/aframe-aabb-collider-component.min.js',
-      '/vwf/model/aframe/addon/aframe-interpolation.js',
-      '/vwf/model/aframe/addon/aframe-sun-sky.js',
       '/vwf/model/aframe/addon/SkyShader.js',
       '/vwf/model/aframe/addon/BVHLoader.js',
       '/vwf/model/aframe/addon/TransformControls.js',
       '/vwf/model/aframe/addon/THREE.MeshLine.js',
+      '/vwf/model/aframe/addon/aframe-sun-sky.min.js',
+      '/vwf/model/aframe/extras/aframe-extras.loaders.min.js',
+      '/vwf/model/aframe/extras/aframe-extras.controls.min.js',
+      '/vwf/model/aframe/kframe/aframe-aabb-collider-component.min.js',
+      '/vwf/model/aframe/addon/aframe-interpolation.js',
       '/vwf/model/aframe/addon/aframe-components.js'
       //'/vwf/view/arjs/aframe-ar.js' //load in aframe-ar-driver
     ], {

public/vwf/model/aframe/addon/aframe-components.js

@@ -42,7 +42,7 @@ AFRAME.registerComponent('scene-utils', {
             //vwf_view.kernel.callMethod(vwf.application(), "exitVR");
             let avatarEl = document.querySelector('#avatarControlParent');
             let avatarID = 'avatar-' + vwf_view.kernel.moniker();
-            
+
             if (AFRAME.utils.device.isMobileVR()) {
                 //avatarEl.setAttribute('position', '0 0 0');
 

public/vwf/model/aframe/extras/aframe-extras.controls.js

@@ -898,6 +898,11 @@ var GamepadButton = require('../../lib/GamepadButton'),
 
 var JOYSTICK_EPS = 0.2;
 
+var Joystick = {
+  MOVEMENT: 1,
+  ROTATION: 2
+};
+
 module.exports = AFRAME.registerComponent('gamepad-controls', {
 
   /*******************************************************************
@@ -935,7 +940,10 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
    * Called once when component is attached. Generally for initial setup.
    */
   init: function init() {
-    var scene = this.el.sceneEl;
+    var sceneEl = this.el.sceneEl;
+
+    this.system = sceneEl.systems['tracked-controls-webxr'] || { controllers: [] };
+
     this.prevTime = window.performance.now();
 
     // Button state
@@ -950,7 +958,11 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
     this.yaw.rotation.y = THREE.Math.degToRad(rotation.y);
     this.yaw.add(this.pitch);
 
-    scene.addBehavior(this);
+    this._lookVector = new THREE.Vector2();
+    this._moveVector = new THREE.Vector2();
+    this._dpadVector = new THREE.Vector2();
+
+    sceneEl.addBehavior(this);
   },
 
   /**
@@ -982,20 +994,28 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
   isVelocityActive: function isVelocityActive() {
     if (!this.data.enabled || !this.isConnected()) return false;
 
-    var dpad = this.getDpad(),
-        joystick0 = this.getJoystick(0),
-        inputX = dpad.x || joystick0.x,
-        inputY = dpad.y || joystick0.y;
+    var dpad = this._dpadVector;
+    var joystick = this._moveVector;
+
+    this.getDpad(dpad);
+    this.getJoystick(Joystick.MOVEMENT, joystick);
+
+    var inputX = dpad.x || joystick.x;
+    var inputY = dpad.y || joystick.y;
 
     return Math.abs(inputX) > JOYSTICK_EPS || Math.abs(inputY) > JOYSTICK_EPS;
   },
 
   getVelocityDelta: function getVelocityDelta() {
-    var dpad = this.getDpad(),
-        joystick0 = this.getJoystick(0),
-        inputX = dpad.x || joystick0.x,
-        inputY = dpad.y || joystick0.y,
-        dVelocity = new THREE.Vector3();
+    var dpad = this._dpadVector;
+    var joystick = this._moveVector;
+
+    this.getDpad(dpad);
+    this.getJoystick(Joystick.MOVEMENT, joystick);
+
+    var inputX = dpad.x || joystick.x;
+    var inputY = dpad.y || joystick.y;
+    var dVelocity = new THREE.Vector3();
 
     if (Math.abs(inputX) > JOYSTICK_EPS) {
       dVelocity.x += inputX;
@@ -1014,9 +1034,11 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
   isRotationActive: function isRotationActive() {
     if (!this.data.enabled || !this.isConnected()) return false;
 
-    var joystick1 = this.getJoystick(1);
+    var joystick = this._lookVector;
 
-    return Math.abs(joystick1.x) > JOYSTICK_EPS || Math.abs(joystick1.y) > JOYSTICK_EPS;
+    this.getJoystick(Joystick.ROTATION, joystick);
+
+    return Math.abs(joystick.x) > JOYSTICK_EPS || Math.abs(joystick.y) > JOYSTICK_EPS;
   },
 
   updateRotation: function updateRotation(dt) {
@@ -1034,7 +1056,9 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
       yaw.rotation.copy(lookControls.yawObject.rotation);
     }
 
-    var lookVector = this.getJoystick(1);
+    var lookVector = this._lookVector;
+
+    this.getJoystick(Joystick.ROTATION, lookVector);
 
     if (Math.abs(lookVector.x) <= JOYSTICK_EPS) lookVector.x = 0;
     if (Math.abs(lookVector.y) <= JOYSTICK_EPS) lookVector.y = 0;
@@ -1095,10 +1119,12 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
    * @return {Gamepad}
    */
   getGamepad: function getGamepad() {
-    var localGamepad = navigator.getGamepads && navigator.getGamepads()[this.data.controller],
+    var stdGamepad = navigator.getGamepads && navigator.getGamepads()[this.data.controller],
+        xrController = this.system.controllers[this.data.controller],
+        xrGamepad = xrController && xrController.gamepad,
         proxyControls = this.el.sceneEl.components['proxy-controls'],
         proxyGamepad = proxyControls && proxyControls.isConnected() && proxyControls.getGamepad(this.data.controller);
-    return proxyGamepad || localGamepad;
+    return proxyGamepad || xrGamepad || stdGamepad;
   },
 
   /**
@@ -1121,32 +1147,43 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
   },
 
   /**
-   * Returns the state of the given joystick (0 or 1) as a THREE.Vector2.
-   * @param  {number} id The joystick (0, 1) for which to find state.
+   * Returns the state of the specified joystick as a THREE.Vector2.
+   * @param  {Joystick} role
+   * @param  {THREE.Vector2} target
    * @return {THREE.Vector2}
    */
-  getJoystick: function getJoystick(index) {
+  getJoystick: function getJoystick(index, target) {
     var gamepad = this.getGamepad();
-    switch (index) {
-      case 0:
-        return new THREE.Vector2(gamepad.axes[0], gamepad.axes[1]);
-      case 1:
-        return new THREE.Vector2(gamepad.axes[2], gamepad.axes[3]);
-      default:
-        throw new Error('Unexpected joystick index "%d".', index);
+    if (gamepad.mapping === 'xr-standard') {
+      // See: https://github.com/donmccurdy/aframe-extras/issues/307
+      switch (index) {
+        case Joystick.MOVEMENT:
+          return target.set(gamepad.axes[2], gamepad.axes[3]);
+        case Joystick.ROTATION:
+          return target.set(gamepad.axes[0], gamepad.axes[1]);
+      }
+    } else {
+      switch (index) {
+        case Joystick.MOVEMENT:
+          return target.set(gamepad.axes[0], gamepad.axes[1]);
+        case Joystick.ROTATION:
+          return target.set(gamepad.axes[2], gamepad.axes[3]);
+      }
     }
+    throw new Error('Unexpected joystick index "%d".', index);
   },
 
   /**
    * Returns the state of the dpad as a THREE.Vector2.
+   * @param {THREE.Vector2} target
    * @return {THREE.Vector2}
    */
-  getDpad: function getDpad() {
+  getDpad: function getDpad(target) {
     var gamepad = this.getGamepad();
     if (!gamepad.buttons[GamepadButton.DPAD_RIGHT]) {
-      return new THREE.Vector2();
+      return target.set(0, 0);
     }
-    return new THREE.Vector2((gamepad.buttons[GamepadButton.DPAD_RIGHT].pressed ? 1 : 0) + (gamepad.buttons[GamepadButton.DPAD_LEFT].pressed ? -1 : 0), (gamepad.buttons[GamepadButton.DPAD_UP].pressed ? -1 : 0) + (gamepad.buttons[GamepadButton.DPAD_DOWN].pressed ? 1 : 0));
+    return target.set((gamepad.buttons[GamepadButton.DPAD_RIGHT].pressed ? 1 : 0) + (gamepad.buttons[GamepadButton.DPAD_LEFT].pressed ? -1 : 0), (gamepad.buttons[GamepadButton.DPAD_UP].pressed ? -1 : 0) + (gamepad.buttons[GamepadButton.DPAD_DOWN].pressed ? 1 : 0));
   },
 
   /**

public/vwf/model/aframe/extras/aframe-extras.js

@@ -8838,6 +8838,11 @@ var GamepadButton = require('../../lib/GamepadButton'),
 
 var JOYSTICK_EPS = 0.2;
 
+var Joystick = {
+  MOVEMENT: 1,
+  ROTATION: 2
+};
+
 module.exports = AFRAME.registerComponent('gamepad-controls', {
 
   /*******************************************************************
@@ -8875,7 +8880,10 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
    * Called once when component is attached. Generally for initial setup.
    */
   init: function init() {
-    var scene = this.el.sceneEl;
+    var sceneEl = this.el.sceneEl;
+
+    this.system = sceneEl.systems['tracked-controls-webxr'] || { controllers: [] };
+
     this.prevTime = window.performance.now();
 
     // Button state
@@ -8890,7 +8898,11 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
     this.yaw.rotation.y = THREE.Math.degToRad(rotation.y);
     this.yaw.add(this.pitch);
 
-    scene.addBehavior(this);
+    this._lookVector = new THREE.Vector2();
+    this._moveVector = new THREE.Vector2();
+    this._dpadVector = new THREE.Vector2();
+
+    sceneEl.addBehavior(this);
   },
 
   /**
@@ -8922,20 +8934,28 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
   isVelocityActive: function isVelocityActive() {
     if (!this.data.enabled || !this.isConnected()) return false;
 
-    var dpad = this.getDpad(),
-        joystick0 = this.getJoystick(0),
-        inputX = dpad.x || joystick0.x,
-        inputY = dpad.y || joystick0.y;
+    var dpad = this._dpadVector;
+    var joystick = this._moveVector;
+
+    this.getDpad(dpad);
+    this.getJoystick(Joystick.MOVEMENT, joystick);
+
+    var inputX = dpad.x || joystick.x;
+    var inputY = dpad.y || joystick.y;
 
     return Math.abs(inputX) > JOYSTICK_EPS || Math.abs(inputY) > JOYSTICK_EPS;
   },
 
   getVelocityDelta: function getVelocityDelta() {
-    var dpad = this.getDpad(),
-        joystick0 = this.getJoystick(0),
-        inputX = dpad.x || joystick0.x,
-        inputY = dpad.y || joystick0.y,
-        dVelocity = new THREE.Vector3();
+    var dpad = this._dpadVector;
+    var joystick = this._moveVector;
+
+    this.getDpad(dpad);
+    this.getJoystick(Joystick.MOVEMENT, joystick);
+
+    var inputX = dpad.x || joystick.x;
+    var inputY = dpad.y || joystick.y;
+    var dVelocity = new THREE.Vector3();
 
     if (Math.abs(inputX) > JOYSTICK_EPS) {
       dVelocity.x += inputX;
@@ -8954,9 +8974,11 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
   isRotationActive: function isRotationActive() {
     if (!this.data.enabled || !this.isConnected()) return false;
 
-    var joystick1 = this.getJoystick(1);
+    var joystick = this._lookVector;
 
-    return Math.abs(joystick1.x) > JOYSTICK_EPS || Math.abs(joystick1.y) > JOYSTICK_EPS;
+    this.getJoystick(Joystick.ROTATION, joystick);
+
+    return Math.abs(joystick.x) > JOYSTICK_EPS || Math.abs(joystick.y) > JOYSTICK_EPS;
   },
 
   updateRotation: function updateRotation(dt) {
@@ -8974,7 +8996,9 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
       yaw.rotation.copy(lookControls.yawObject.rotation);
     }
 
-    var lookVector = this.getJoystick(1);
+    var lookVector = this._lookVector;
+
+    this.getJoystick(Joystick.ROTATION, lookVector);
 
     if (Math.abs(lookVector.x) <= JOYSTICK_EPS) lookVector.x = 0;
     if (Math.abs(lookVector.y) <= JOYSTICK_EPS) lookVector.y = 0;
@@ -9035,10 +9059,12 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
    * @return {Gamepad}
    */
   getGamepad: function getGamepad() {
-    var localGamepad = navigator.getGamepads && navigator.getGamepads()[this.data.controller],
+    var stdGamepad = navigator.getGamepads && navigator.getGamepads()[this.data.controller],
+        xrController = this.system.controllers[this.data.controller],
+        xrGamepad = xrController && xrController.gamepad,
         proxyControls = this.el.sceneEl.components['proxy-controls'],
         proxyGamepad = proxyControls && proxyControls.isConnected() && proxyControls.getGamepad(this.data.controller);
-    return proxyGamepad || localGamepad;
+    return proxyGamepad || xrGamepad || stdGamepad;
   },
 
   /**
@@ -9061,32 +9087,43 @@ module.exports = AFRAME.registerComponent('gamepad-controls', {
   },
 
   /**
-   * Returns the state of the given joystick (0 or 1) as a THREE.Vector2.
-   * @param  {number} id The joystick (0, 1) for which to find state.
+   * Returns the state of the specified joystick as a THREE.Vector2.
+   * @param  {Joystick} role
+   * @param  {THREE.Vector2} target
    * @return {THREE.Vector2}
    */
-  getJoystick: function getJoystick(index) {
+  getJoystick: function getJoystick(index, target) {
     var gamepad = this.getGamepad();
-    switch (index) {
-      case 0:
-        return new THREE.Vector2(gamepad.axes[0], gamepad.axes[1]);
-      case 1:
-        return new THREE.Vector2(gamepad.axes[2], gamepad.axes[3]);
-      default:
-        throw new Error('Unexpected joystick index "%d".', index);
+    if (gamepad.mapping === 'xr-standard') {
+      // See: https://github.com/donmccurdy/aframe-extras/issues/307
+      switch (index) {
+        case Joystick.MOVEMENT:
+          return target.set(gamepad.axes[2], gamepad.axes[3]);
+        case Joystick.ROTATION:
+          return target.set(gamepad.axes[0], gamepad.axes[1]);
+      }
+    } else {
+      switch (index) {
+        case Joystick.MOVEMENT:
+          return target.set(gamepad.axes[0], gamepad.axes[1]);
+        case Joystick.ROTATION:
+          return target.set(gamepad.axes[2], gamepad.axes[3]);
+      }
     }
+    throw new Error('Unexpected joystick index "%d".', index);
   },
 
   /**
    * Returns the state of the dpad as a THREE.Vector2.
+   * @param {THREE.Vector2} target
    * @return {THREE.Vector2}
    */
-  getDpad: function getDpad() {
+  getDpad: function getDpad(target) {
     var gamepad = this.getGamepad();
     if (!gamepad.buttons[GamepadButton.DPAD_RIGHT]) {
-      return new THREE.Vector2();
+      return target.set(0, 0);
     }
-    return new THREE.Vector2((gamepad.buttons[GamepadButton.DPAD_RIGHT].pressed ? 1 : 0) + (gamepad.buttons[GamepadButton.DPAD_LEFT].pressed ? -1 : 0), (gamepad.buttons[GamepadButton.DPAD_UP].pressed ? -1 : 0) + (gamepad.buttons[GamepadButton.DPAD_DOWN].pressed ? 1 : 0));
+    return target.set((gamepad.buttons[GamepadButton.DPAD_RIGHT].pressed ? 1 : 0) + (gamepad.buttons[GamepadButton.DPAD_LEFT].pressed ? -1 : 0), (gamepad.buttons[GamepadButton.DPAD_UP].pressed ? -1 : 0) + (gamepad.buttons[GamepadButton.DPAD_DOWN].pressed ? 1 : 0));
   },
 
   /**

public/vwf/view/aframe.js

@@ -785,7 +785,9 @@ define(["module", "vwf/view"], function (module, view) {
 
 
         if (AFRAME.utils.device.isMobileVR()) {
+            //avatarEl.setAttribute('gearvr-controls', {}); 
             avatarEl.setAttribute('movement-controls', {});//{'controls': 'gamepad'});
+           // avatarEl.setAttribute("gamepad-controls", {});
             //avatarEl.setAttribute('position', '0 0 0');
         }
 
@@ -821,8 +823,6 @@ define(["module", "vwf/view"], function (module, view) {
         cursorEl.setAttribute('raycaster', 'objects', '.clickable');
         cursorEl.setAttribute('raycaster', 'showLine', false);
 
-        if (AFRAME.utils.device.isMobileVR()) { }
-
         // cursorEl.setAttribute('raycaster', {objects: '.intersectable', showLine: true, far: 100});
         // cursorEl.setAttribute('raycaster', 'showLine', true);
         controlEl.appendChild(cursorEl);