Updated the avatar radius and camera rotation (#10118)

* updated the avatar radius to be the sum of the eyeOffset and the camera Near values
updated the camera rotation to use the world rotation

* removed the camera component near value as a const that is exported.
spawn avatar fetches camera's near value from camera component

* made the avatar radius part of the collider update and connected to the Avatar Controller Component

* removed dev log

* made adjustment requested in PR

---------

Co-authored-by: Josh Field <joshfield999@gmail.com>

packages/engine/src/avatar/components/AvatarControllerComponent.ts

@@ -43,6 +43,8 @@ import { TargetCameraRotationComponent } from '@etherealengine/spatial/src/camer
 import { PhysicsState } from '@etherealengine/spatial/src/physics/state/PhysicsState'
 import { XRControlsState } from '@etherealengine/spatial/src/xr/XRState'
 import { useEffect } from 'react'
+import { CameraComponent } from '../../../../spatial/src/camera/components/CameraComponent'
+import { setAvatarColliderTransform } from '../functions/spawnAvatarReceptor'
 import { AvatarComponent } from './AvatarComponent'
 
 export const AvatarControllerComponent = defineComponent({
@@ -100,19 +102,17 @@ export const AvatarControllerComponent = defineComponent({
     const avatarComponent = useComponent(entity, AvatarComponent)
     const avatarControllerComponent = useComponent(entity, AvatarControllerComponent)
     const isCameraAttachedToAvatar = useHookstate(getMutableState(XRControlsState).isCameraAttachedToAvatar)
+    const camera = useComponent(Engine.instance.cameraEntity, CameraComponent)
 
     useEffect(() => {
-      /** @todo fix this */
-      // getState(PhysicsState).physicsWorld.removeCollider(avatarControllerComponent.bodyCollider.value, false)
-      // const collider = createAvatarCollider(entity)
-      // avatarControllerComponent.bodyCollider.set(collider)
+      setAvatarColliderTransform(entity)
 
       const cameraEntity = avatarControllerComponent.cameraEntity.value
       if (cameraEntity && entityExists(cameraEntity) && hasComponent(cameraEntity, FollowCameraComponent)) {
         const cameraComponent = getComponent(cameraEntity, FollowCameraComponent)
         cameraComponent.offset.set(0, avatarComponent.eyeHeight.value, 0)
       }
-    }, [avatarComponent.avatarHeight])
+    }, [avatarComponent.avatarHeight, camera.near])
 
     useEffect(() => {
       if (isCameraAttachedToAvatar.value) {

packages/engine/src/avatar/functions/spawnAvatarReceptor.ts

@@ -30,6 +30,7 @@ import {
   UUIDComponent,
   createEntity,
   getComponent,
+  getOptionalComponent,
   setComponent
 } from '@etherealengine/ecs'
 import { getState } from '@etherealengine/hyperflux'
@@ -62,7 +63,8 @@ import { AvatarAnimationComponent, AvatarRigComponent } from '../components/Avat
 import { AvatarComponent } from '../components/AvatarComponent'
 import { AvatarColliderComponent, AvatarControllerComponent } from '../components/AvatarControllerComponent'
 
-export const avatarRadius = 0.125
+import { CameraComponent } from '../../../../spatial/src/camera/components/CameraComponent'
+import { eyeOffset } from '../systems/AvatarTransparencySystem'
 
 export const spawnAvatarReceptor = (entityUUID: EntityUUID) => {
   const entity = UUIDComponent.getEntityByUUID(entityUUID)
@@ -124,21 +126,33 @@ export const createAvatarCollider = (entity: Entity) => {
   const colliderEntity = createEntity()
   setComponent(entity, AvatarColliderComponent, { colliderEntity })
 
-  const avatarComponent = getComponent(entity, AvatarComponent)
-  const halfHeight = avatarComponent.avatarHeight * 0.5
-
+  setAvatarColliderTransform(colliderEntity)
   setComponent(colliderEntity, EntityTreeComponent, { parentEntity: entity })
-  setComponent(colliderEntity, TransformComponent, {
-    position: new Vector3(0, halfHeight + 0.25, 0),
-    scale: new Vector3(avatarRadius, halfHeight - avatarRadius - 0.25, avatarRadius)
-  })
   setComponent(colliderEntity, ColliderComponent, {
     shape: Shapes.Capsule,
     collisionLayer: CollisionGroups.Avatars,
     collisionMask: AvatarCollisionMask
   })
 }
 
+const avatarCapsuleOffset = 0.25
+export const setAvatarColliderTransform = (entity: Entity) => {
+  const avatarCollider = getOptionalComponent(entity, AvatarColliderComponent)
+  if (!avatarCollider) {
+    return
+  }
+  const colliderEntity = avatarCollider.colliderEntity
+  const camera = getComponent(Engine.instance.cameraEntity, CameraComponent)
+  const avatarRadius = eyeOffset + camera.near
+  const avatarComponent = getComponent(entity, AvatarComponent)
+  const halfHeight = avatarComponent.avatarHeight * 0.5
+
+  setComponent(colliderEntity, TransformComponent, {
+    position: new Vector3(0, halfHeight + avatarCapsuleOffset, 0),
+    scale: new Vector3(avatarRadius, halfHeight - avatarRadius - avatarCapsuleOffset, avatarRadius)
+  })
+}
+
 export const createAvatarController = (entity: Entity) => {
   const transform = getComponent(entity, TransformComponent)
 

packages/engine/src/avatar/systems/AvatarTransparencySystem.ts

@@ -43,7 +43,7 @@ import { AvatarComponent } from '../components/AvatarComponent'
 import { AvatarHeadDecapComponent } from '../components/AvatarIKComponents'
 import { TransparencyDitheringComponent } from '../components/TransparencyDitheringComponent'
 
-const eyeOffset = 0.25
+export const eyeOffset = 0.25
 const execute = () => {
   const selfAvatarEntity = AvatarComponent.getSelfAvatarEntity()
   const deltaSeconds = getState(ECSState).deltaSeconds

packages/spatial/src/camera/systems/CameraSystem.tsx

@@ -187,7 +187,7 @@ const computeCameraFollow = (cameraEntity: Entity, referenceEntity: Entity) => {
 
   targetPosition
     .copy(followCamera.offset)
-    .applyQuaternion(targetTransform.rotation)
+    .applyQuaternion(TransformComponent.getWorldRotation(referenceEntity, targetTransform.rotation))
     .add(TransformComponent.getWorldPosition(referenceEntity, new Vector3()))
 
   // Run only if not in first person mode