feat: disable control

Author: ErdongChen-Andrew

example/Experience.tsx

@@ -31,8 +31,9 @@ export default function Experience() {
   /**
    * Debug settings
    */
-  const { physics, disableFollowCam } = useControls("World Settings", {
+  const { physics, disableControl, disableFollowCam } = useControls("World Settings", {
     physics: false,
+    disableControl: false,
     disableFollowCam: false,
   });
 
@@ -80,6 +81,7 @@ export default function Experience() {
             autoBalanceDampingC={0.04}
             autoBalanceSpringOnY={0.7}
             autoBalanceDampingOnY={0.05}
+            disableControl={disableControl}
             disableFollowCam={disableFollowCam}
           >
             {/* Replace your model here */}

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "ecctrl",
-  "version": "1.0.88",
+  "version": "1.0.89",
   "author": "Erdong Chen",
   "license": "MIT",
   "description": "A floating rigibody character controller for R3F",

package.json

@@ -104,6 +104,7 @@ EcctrlProps: {
   floatHeight: 0.3, // Height of the character when floating
   characterInitDir: 0, // Character initial facing direction (in rad)
   followLight: false, // Enable follow light mode (name your light "followLight" before turn this on)
+  disableControl: false, // Disable the ecctrl control feature
   disableFollowCam: false, // Disable follow camera feature
   disableFollowCamPos: { x: 0, y: 0, z: -5 }, // Camera position when the follow camera feature is disabled
   disableFollowCamTarget: { x: 0, y: 0, z: 0 }, // Camera lookAt target when the follow camera feature is disabled

readme.md

@@ -54,9 +54,10 @@ const Ecctrl: ForwardRefRenderFunction<RapierRigidBody, EcctrlProps> = ({
   floatHeight = 0.3,
   characterInitDir = 0, // in rad
   followLight = false,
+  disableControl = false,
   disableFollowCam = false,
-  disableFollowCamPos = { x: 0, y: 0, z: -5 },
-  disableFollowCamTarget = { x: 0, y: 0, z: 0 },
+  disableFollowCamPos = null,
+  disableFollowCamTarget = null,
   // Follow camera setups
   camInitDis = -5,
   camMaxDis = -7,
@@ -134,14 +135,13 @@ const Ecctrl: ForwardRefRenderFunction<RapierRigidBody, EcctrlProps> = ({
   let isModePointToMove: boolean = false
   let functionKeyDown: boolean = false
   let isModeFixedCamera: boolean = false
+  let isModeCameraBased: boolean = false
   const setMoveToPoint = useGame((state) => state.setMoveToPoint)
-  const setCameraBased = useGame((state) => state.setCameraBased);
-  const getCameraBased = useGame((state) => state.getCameraBased);
   const findMode = (mode: string, modes: string) => modes.split(" ").some(m => m === mode)
   if (mode) {
     if (findMode("PointToMove", mode)) isModePointToMove = true
     if (findMode("FixedCamera", mode)) isModeFixedCamera = true
-    if (findMode("CameraBasedMovement", mode)) setCameraBased(true)
+    if (findMode("CameraBasedMovement", mode)) isModeCameraBased = true
   }
 
   /** 
@@ -775,7 +775,7 @@ const Ecctrl: ForwardRefRenderFunction<RapierRigidBody, EcctrlProps> = ({
     bodyBalanceVecOnZ.set(bodyBalanceVec.x, bodyBalanceVec.y, 0)
 
     // Check if is camera based movement
-    if (getCameraBased().isCameraBased) {
+    if (isModeCameraBased) {
       modelEuler.y = pivot.rotation.y
       pivot.getWorldDirection(modelFacingVec)
       // Update slopeRayOrigin to new positon
@@ -1023,6 +1023,32 @@ const Ecctrl: ForwardRefRenderFunction<RapierRigidBody, EcctrlProps> = ({
       dirLight.target = characterModelRef.current;
     }
 
+    /**
+     * Camera movement
+     */
+    pivotPosition.set(
+      currentPos.x + camTargetPos.x,
+      currentPos.y + (camTargetPos.y || (capsuleHalfHeight + capsuleRadius / 2)),
+      currentPos.z + camTargetPos.z
+    );
+    pivot.position.lerp(pivotPosition, 1 - Math.exp(-camFollowMult * delta));
+
+    if (!disableFollowCam) {
+      followCam.getWorldPosition(followCamPosition);
+      state.camera.position.lerp(followCamPosition, 1 - Math.exp(-camLerpMult * delta));
+      state.camera.lookAt(pivot.position);
+    }
+
+    /**
+     * Camera collision detect
+     */
+    camCollision && cameraCollisionDetect(delta);
+
+    /**
+     * If disableControl is true, skip all following features 
+     */
+    if (disableControl) return;
+
     /**
      * Getting all gamepad control values
      */
@@ -1097,29 +1123,13 @@ const Ecctrl: ForwardRefRenderFunction<RapierRigidBody, EcctrlProps> = ({
 
     // If autobalance is off, rotate character model itself
     if (!autoBalance) {
-      if (getCameraBased().isCameraBased) {
+      if (isModeCameraBased) {
         characterModelRef.current.quaternion.copy(pivot.quaternion)
       } else {
         characterModelRef.current.quaternion.copy(characterModelIndicator.quaternion)
       }
     }
 
-    /**
-     *  Camera movement
-     */
-    pivotPosition.set(
-      currentPos.x + camTargetPos.x,
-      currentPos.y + (camTargetPos.y || (capsuleHalfHeight + capsuleRadius / 2)),
-      currentPos.z + camTargetPos.z
-    );
-    pivot.position.lerp(pivotPosition, 1 - Math.exp(-camFollowMult * delta));
-
-    if (!disableFollowCam) {
-      followCam.getWorldPosition(followCamPosition);
-      state.camera.position.lerp(followCamPosition, 1 - Math.exp(-camLerpMult * delta));
-      state.camera.lookAt(pivot.position);
-    }
-
     /**
      * Ray casting detect if on ground
      */
@@ -1381,11 +1391,6 @@ const Ecctrl: ForwardRefRenderFunction<RapierRigidBody, EcctrlProps> = ({
      */
     if (autoBalance && characterRef.current) autoBalanceCharacter();
 
-    /**
-     * Camera collision detect
-     */
-    camCollision && cameraCollisionDetect(delta);
-
     /**
      * Point to move feature
      */
@@ -1504,6 +1509,7 @@ export interface EcctrlProps extends RigidBodyProps {
   floatHeight?: number;
   characterInitDir?: number;
   followLight?: boolean;
+  disableControl?: boolean;
   disableFollowCam?: boolean;
   disableFollowCamPos?: { x: number, y: number, z: number };
   disableFollowCamTarget?: { x: number, y: number, z: number };

src/Ecctrl.tsx

@@ -234,13 +234,11 @@ export const useFollowCam = function (props: UseFollowCamProps) {
     followCam.rotation.x = camInitDir.x
   }, [])
 
-  // Set camera position to (0,0,0), if followCam is disabled set to disableFollowCamPos (default 0,0,-5)
+  // If followCam is disabled set to disableFollowCamPos, target to disableFollowCamTarget
   useEffect(() => {
     if (disableFollowCam) {
-      camera.position.set(disableFollowCamPos.x, disableFollowCamPos.y, disableFollowCamPos.z)
-      camera.lookAt(new THREE.Vector3(disableFollowCamTarget.x, disableFollowCamTarget.y, disableFollowCamTarget.z))
-    } else {
-      camera.position.set(0, 0, 0)
+      if (disableFollowCamPos) camera.position.set(disableFollowCamPos.x, disableFollowCamPos.y, disableFollowCamPos.z)
+      if (disableFollowCamTarget) camera.lookAt(new THREE.Vector3(disableFollowCamTarget.x, disableFollowCamTarget.y, disableFollowCamTarget.z))
     }
   }, [disableFollowCam]);
 

src/hooks/useFollowCam.tsx

@@ -10,11 +10,6 @@ export const useGame = /* @__PURE__ */ create(
        */
       moveToPoint: null as THREE.Vector3,
 
-      /**
-       * Check is camera based movement
-       */
-      isCameraBased: false as boolean,
-
       /**
        * Character animations state manegement
        */
@@ -164,21 +159,6 @@ export const useGame = /* @__PURE__ */ create(
           moveToPoint: get().moveToPoint,
         };
       },
-
-      /**
-       * Set/get camera based movement
-       */
-      setCameraBased: (isCameraBased: boolean) => {
-        set(() => {
-          return { isCameraBased: isCameraBased };
-        });
-      },
-
-      getCameraBased: () => {
-        return {
-          isCameraBased: get().isCameraBased,
-        };
-      },
     };
   })
 );
@@ -200,7 +180,6 @@ export type AnimationSet = {
 
 type State = {
   moveToPoint: THREE.Vector3;
-  isCameraBased: boolean;
   curAnimation: string;
   animationSet: AnimationSet;
   initializeAnimationSet: (animationSet: AnimationSet) => void;
@@ -209,10 +188,6 @@ type State = {
   getMoveToPoint: () => {
     moveToPoint: THREE.Vector3;
   }
-  setCameraBased: (isCameraBased: boolean) => void;
-  getCameraBased: () => {
-    isCameraBased: boolean;
-  }
 } & {
   [key in keyof AnimationSet]: () => void;
 };