Merge branch 'main' of https://github.com/pmndrs/xr

Author: bbohlender

.github/workflows/static.yml

@@ -6,12 +6,18 @@ on:
       - main
 
 jobs:
-  deploy-static-files:
+  docs:
+    uses: pmndrs/docs/.github/workflows/build.yml@main
+    with:
+      mdx: './docs'
+      libname: 'xr'
+      base_path: '/xr/docs'
+      icon: '🤳'
+      home_redirect: '/getting-started/introduction'
+
+  examples:
     runs-on: ubuntu-latest
-    permissions:
-      contents: write
     steps:
-
       - name: Checkout code
         uses: actions/checkout@v3
 
@@ -46,12 +52,56 @@ jobs:
           cp -r ./examples/watch/dist/* ./public/examples/watch
           cp -r ./examples/room-with-shadows/dist/* ./public/examples/room-with-shadows
 
-      # Deploy to GH Pages
-      - name: Add no jekyll
-        run: touch public/.nojekyll
+      - name: Upload Artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: examples
+          path: public/examples/
+
+  bundle-artifacts:
+    runs-on: ubuntu-latest
+    needs:
+      - docs
+      - examples
+    steps:
+      - name: Download Examples Artifiact
+        uses: actions/download-artifact@v4
+        with:
+          name: examples
+          path: ./examples
+
+      - name: Download Docs Artifiact
+        uses: actions/download-artifact@v4
+        with:
+          name: github-pages
+          path: ./docs
 
-      - name: Deploy
-        uses: JamesIves/github-pages-deploy-action@v4
+      - name: Extract Docs
+        run: tar -xf ./docs/artifact.tar -C ./docs/
+
+      - name: Create deploy.tar
+        run: tar -cf deploy.tar ./*
+
+      - name: Upload Artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: deploy
+          path: ./deploy.tar
+
+  deploy:
+    needs: bundle-artifacts
+    runs-on: ubuntu-latest
+    permissions:
+      pages: write # to deploy to Pages
+      id-token: write # to verify the deployment originates from an appropriate source
+
+    # Deploy to the github-pages environment
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+
+    steps:
+      - id: deployment
+        uses: actions/deploy-pages@v4
         with:
-          branch: gh-pages
-          folder: public
+          artifact_name: deploy

docs/advanced/pitfalls.md

@@ -41,3 +41,17 @@ If you cannot enter the VR or AR experience while the assets in your scene are l
 ## XRSpace
 
 If you are placing `<XRSpace>` components outside of the `<XROrigin>` while changing the transformation of the `<XROrigin>` (e.g. by setting `<XROrigin position={[0,1,0]} />`), the elements rendered inside of the `<XRSpace>` will not be transformed with the origin. If the transformations of the origin should be applied to the `<XRSpace>`, make sure to place those components inside the `<XROrigin>`. Not placing `<XRSpace>` components into the `<XROrigin>` can be useful in scenarios where you want to move the `<XROrigin>` independently from the `<XRSpace>`. For instance, building a virtual elevator where your actual room is duplicated into the x-axis so that you can use the elevator to travel between multiple instances of your room.
+
+## OrbitControls
+
+If you have OrbitControls in your scene, make sure to place an `<IfInSessionMode>` guard around them when in XR. Having OrbitControls enabled causes the VR camera to report false values and behave in strange ways.
+
+```tsx
+const OrbitControlsWrapper = () => {
+  return (
+    <IfInSessionMode deny={['immersive-ar', 'immersive-vr']} >
+        <OrbitControls />
+    </IfInSessionMode>
+  )
+}
+```

examples/minecraft/src/VRPlayerControl.tsx

@@ -26,30 +26,28 @@ export function VRPlayerControl({
 }) {
   const originRef = useRef<THREE.Group>(null)
 
-  const controllerLeft = useXRControllerState('right')
-  const controllerRight = useXRControllerState('left')
+  const controllerLeft = useXRControllerState('left')
+  const controllerRight = useXRControllerState('right')
 
   useFrame((state, delta) => {
-    if (controllerRight != null) {
-      const thumbstick = controllerRight.gamepad?.['xr-standard-thumbstick']
-      if (originRef.current != null && thumbstick?.xAxis != null && thumbstick.xAxis != 0) {
-        originRef.current.rotateY((thumbstick.xAxis < 0 ? 1 : -1) * TURN_SPEED * delta)
-      }
+    const thumbstickRight = controllerRight?.gamepad?.['xr-standard-thumbstick']
+    if (originRef.current != null && thumbstickRight?.xAxis != null && thumbstickRight.xAxis != 0) {
+      originRef.current.rotateY((thumbstickRight.xAxis < 0 ? 1 : -1) * TURN_SPEED * delta)
     }
 
-    if (controllerLeft?.gamepad?.['a-button']?.state === 'pressed') {
+    if (controllerRight?.gamepad?.['a-button']?.state === 'pressed') {
       playerJump?.()
     }
 
-    const thumbstick = controllerLeft?.gamepad['xr-standard-thumbstick']
-    if (thumbstick?.xAxis != null && thumbstick.yAxis != null) {
+    const thumbstickLeft = controllerLeft?.gamepad['xr-standard-thumbstick']
+    if (thumbstickLeft?.xAxis != null && thumbstickLeft.yAxis != null) {
       state.camera.getWorldQuaternion(helpers.quaternion)
 
       playerMove?.({
-        forward: thumbstick.yAxis < 0,
-        backward: thumbstick.yAxis > 0,
-        left: thumbstick.xAxis < -THUMBSTICK_X_WIGGLE,
-        right: thumbstick.xAxis > THUMBSTICK_X_WIGGLE,
+        forward: thumbstickLeft.yAxis < 0,
+        backward: thumbstickLeft.yAxis > 0,
+        left: thumbstickLeft.xAxis < -THUMBSTICK_X_WIGGLE,
+        right: thumbstickLeft.xAxis > THUMBSTICK_X_WIGGLE,
 
         // rotation: state.camera.rotation
         rotation: helpers.euler.setFromQuaternion(helpers.quaternion),