From 5893afe42aeee735e14fc09722e6d22f57104431 Mon Sep 17 00:00:00 2001 From: math-pixel <59537610+math-pixel@users.noreply.github.com> Date: Tue, 19 May 2026 16:34:48 +0200 Subject: [PATCH] working move kikle --- src/components/ebike/Ebike.tsx | 30 +++++++++++++++++---------- src/world/player/PlayerController.tsx | 13 +++++++++--- 2 files changed, 29 insertions(+), 14 deletions(-) diff --git a/src/components/ebike/Ebike.tsx b/src/components/ebike/Ebike.tsx index d9d526e..fce55d7 100644 --- a/src/components/ebike/Ebike.tsx +++ b/src/components/ebike/Ebike.tsx @@ -1,11 +1,11 @@ import { useEffect, useRef } from "react"; import * as THREE from "three"; -import { useFrame } from "@react-three/fiber"; +import { useFrame, useThree } from "@react-three/fiber"; import { InteractableObject } from "@/components/three/interaction/InteractableObject"; import { useLoggedGLTF } from "@/hooks/three/useLoggedGLTF"; import { useClonedObject } from "@/hooks/three/useClonedObject"; import { useDebugFolder } from "@/hooks/debug/useDebugFolder"; -import { animateCameraTransition, animateCameraTransformTransition } from "@/world/GameCinematics"; +import { animateCameraTransformTransition } from "@/world/GameCinematics"; import { useGameStore } from "@/managers/stores/useGameStore"; import { PLAYER_EYE_HEIGHT } from "@/data/player/playerConfig"; import type { Vector3Tuple } from "@/types/three/three"; @@ -23,7 +23,7 @@ export const EBIKE_CAMERA_TRANSFORM: CameraTransform = { }; const EBIKE_DROP_PLAYER_TRANSFORM: CameraTransform = { - position: [3, 1.5, 0], + position: [0, 1.5, 3], rotation: [0, 0, 0], }; @@ -39,8 +39,13 @@ export function Ebike({ position }: EbikeProps): React.JSX.Element { }); const model = useClonedObject(scene); const movementMode = useGameStore((state) => state.player.movementMode); + const camera = useThree((state) => state.camera); - const restingPosition = useRef(position); + const restingPosition = useRef([ + position[0], + position[1] - PLAYER_EYE_HEIGHT, + position[2], + ]); const restingRotation = useRef(0); useEffect(() => { @@ -116,13 +121,16 @@ export function Ebike({ position }: EbikeProps): React.JSX.Element { currentPos.y + EBIKE_DROP_PLAYER_TRANSFORM.position[1], currentPos.z + EBIKE_DROP_PLAYER_TRANSFORM.position[2], ]; - const targetLookAt: Vector3Tuple = [ - currentPos.x, - currentPos.y + 1, - currentPos.z, + + // Get camera's current rotation in degrees so we keep the exact orientation during dismount + const currentEuler = new THREE.Euler().setFromQuaternion(camera.quaternion, "YXZ"); + const targetRotation: Vector3Tuple = [ + THREE.MathUtils.radToDeg(currentEuler.x), + THREE.MathUtils.radToDeg(currentEuler.y), + THREE.MathUtils.radToDeg(currentEuler.z), ]; - animateCameraTransition(targetCamPos, targetLookAt, 1, () => { + animateCameraTransformTransition(targetCamPos, targetRotation, 1, () => { useGameStore.getState().setPlayerMovementMode("walk"); }); } @@ -165,8 +173,8 @@ export function Ebike({ position }: EbikeProps): React.JSX.Element { onPress={handleInteract} > - - + + diff --git a/src/world/player/PlayerController.tsx b/src/world/player/PlayerController.tsx index 3b4840d..2e85615 100644 --- a/src/world/player/PlayerController.tsx +++ b/src/world/player/PlayerController.tsx @@ -120,15 +120,22 @@ export function PlayerController({ useEffect(() => { if (movementMode === "ebike") { // Teleport player capsule to the bike's current parked position - const targetPos: Vector3Tuple = (window as any).ebikeParkedPosition || [0, 10, 0]; + const targetPos: Vector3Tuple = (window as any).ebikeParkedPosition || [0, 8.2, 0]; const targetRot: number = (window as any).ebikeParkedRotation || 0; + const headY = targetPos[1] + PLAYER_EYE_HEIGHT; + const bottomY = targetPos[1] + PLAYER_CAPSULE_RADIUS; + capsule.current.start.set( targetPos[0], - targetPos[1] - PLAYER_EYE_HEIGHT + PLAYER_CAPSULE_RADIUS, + bottomY, + targetPos[2], + ); + capsule.current.end.set( + targetPos[0], + headY, targetPos[2], ); - capsule.current.end.set(...targetPos); velocity.current.set(0, 0, 0); onFloor.current = false; wantsJump.current = false;