Oculus controller joystick - camera fly

How to fly the camera with oculus controller joystick in the direction the controller is facing

ping @RaananW

@cosmos If you can provide a playground with what you have so far that would be helpful. Did you try to get the transform of the controller?

1 Like

Wanted to add on top of that - I am not sure what “fly the camera” means. We have teleportation, this technically allows you to “fly” to a different location, based on the controller direction. We also have movement module(s) that allow you to walk in a specific direction. I assume one of those can help you?

from fly camera i meant a free camera movement we have with keyboard. I do not want to teleport want a smooth movement.
can u please link example of the movement modules you have mentioned.

const attachControllers = (xrHelper: WebXRExperienceHelper) => {
    const controllers = new WebXRInput(
      xrHelper.sessionManager,
      xrHelper.camera
    );
    const xrayPointer = new WebXRControllerPointerSelection(
      xrHelper.sessionManager,
      {
        disablePointerUpOnTouchOut: false,
        disableScenePointerVectorUpdate: false,
        forceGazeMode: false,
        xrInput: controllers,
      }
    );
    xrayPointer.displayLaserPointer = true;
    xrayPointer.attach();
    return controllers;
  };

  useEffect(() => {
    const enableXR = async () => {
      if (isVREnabled && scene != null) {
        const xrHelper = await WebXRExperienceHelper.CreateAsync(scene);
        const xr = attachControllers(xrHelper);
        await xrHelper.enterXRAsync(
          'immersive-vr',
          'local-floor',
          undefined,
          {}
        );
        const featureManager = xrHelper.featuresManager
        featureManager.disableFeature(BABYLON.WebXRFeatureName.TELEPORTATION);
        featureManager.enableFeature(BABYLON.WebXRFeatureName.MOVEMENT, "latest", {

          xrInput: xr,
          
          });
      }
    };
    enableXR();
  }, [isVREnabled]);

I m using the above code to enable webvr, controllers and movement.
but doesn’t seem to move can u help with what m i doing wrong

return (
    <>
      <universalCamera
        name="universal"
        target={new Vector3(0, 0, 0)}
        position={new Vector3(0, 0, 0)}
        rotation={new Vector3(0, 0, 0)}
        speed={1}
        angularSensibility={1800}
        fov={1}
        touchAngularSensibility={1000}
        touchMoveSensibility={0}
        ref={cameraRef}
      />
      <hemisphericLight name="light1" intensity={10} direction={Vector3.Up()} />
      <box
      name='box 1'
      size={2}
      position={new Vector3(0, 0, -999999)}
    >
      <standardMaterial
        name='box mat'
        diffuseColor={Color3.Red()}
        specularColor={Color3.Black()}
      />
    </box>
      { <Suspense
        fallback={
          <box
            name="left"
            height={0}
            width={0}
            position={new Vector3(0, 0, 0)}
          ></box>
        }
      >
        {sceneURL !== '' && sceneName !== '' ? (
          <Model
            name={sceneName.split('.')[0]}
            reportProgress
            position={new Vector3(0, 0, 0)}
            rootUrl='models/'
            sceneFilename='venue16x9_Screen_V1.glb'
            scaleToDimension={400.0}
            onModelLoaded={(model) => onLoaded(model)}
          />
        ) : (
          <box
            name="left"
            height={0}
            width={0}
            position={new Vector3(0, 0, 0)}
          ></box>
        )}
      </Suspense> }
    </>
  );

I added a dummy box in the scene and the movement seems to work now, remove that box and the movement doesn’t work, any idea why this might be happening @RaananW

Feels very odd, but I won’t be able to test that without a working reproduction. This code seems to be a react code with no context or project setup, so it is very hard for me to understand the code. A playground would be great.