diff --git a/src/components/Experience.jsx b/src/components/Experience.jsx
index b5118e4..121c190 100644
--- a/src/components/Experience.jsx
+++ b/src/components/Experience.jsx
@@ -10,8 +10,8 @@ import { PlayerControllerAgain } from './PlayerControllerAgain'
export const Experience = () => {
return (
<>
- {/* */}
-
+
+ {/* */}
{
const kart = useRef();
const cam = useRef();
const initialSpeed = 0;
- const maxSpeed = 40;
- const boostSpeed = 60;
- const acceleration = 30;
- const decceleration = 50;
+ const maxSpeed = 30;
+ const boostSpeed = 50;
+ const acceleration = 0.1;
+ const decceleration = 0.2;
const damping = -0.1;
- const MaxSteeringSpeed = 1.1;
+ const MaxSteeringSpeed = 0.01;
const [currentSteeringSpeed, setCurrentSteeringSpeed] = useState(0);
const [currentSpeed, setCurrentSpeed] = useState(initialSpeed);
const camMaxOffset = 1;
@@ -66,21 +66,16 @@ export const PlayerController = () => {
let targetZPosition = 8;
const [steeringAngleWheels, setSteeringAngleWheels] = useState(0);
const engineSound = useRef();
- const cameraLerpFactor = 1;
- const marioLerpFactor = 5;
const [scale, setScale] = useState(0);
- let lastTime = performance.now();
- useFrame(({ pointer, clock}) => {
+ useFrame(({ pointer, clock }, delta) => {
const time = clock.getElapsedTime();
- const currentTime = performance.now();
- const deltaTime = (currentTime - lastTime) * 0.001; // Convert milliseconds to seconds
- lastTime = currentTime;
if (!body.current && !mario.current) return;
// HANDLING AND STEERING
- const kartRotation = kart.current.rotation.y - driftDirection.current * driftForce.current;
+ const kartRotation =
+ kart.current.rotation.y - driftDirection.current * driftForce.current;
const forwardDirection = new THREE.Vector3(
-Math.sin(kartRotation),
0,
@@ -119,45 +114,45 @@ export const PlayerController = () => {
if (upPressed && currentSpeed < maxSpeed) {
// Accelerate the kart within the maximum speed limit
- setCurrentSpeed(Math.min(currentSpeed + acceleration * deltaTime, maxSpeed));
+ setCurrentSpeed(Math.min(currentSpeed + acceleration * delta * 144, maxSpeed));
} else if (
upPressed &&
currentSpeed > maxSpeed &&
boostDuration.current > 0
) {
- setCurrentSpeed(Math.max(currentSpeed - decceleration * deltaTime, maxSpeed));
+ setCurrentSpeed(Math.max(currentSpeed - decceleration * delta * 144, maxSpeed));
}
if (upPressed) {
if (currentSteeringSpeed < MaxSteeringSpeed) {
setCurrentSteeringSpeed(
- Math.min(currentSteeringSpeed + 1 * deltaTime, MaxSteeringSpeed)
+ Math.min(currentSteeringSpeed + 0.0001 * delta * 144, MaxSteeringSpeed)
);
}
}
// REVERSING
if (downPressed && currentSpeed < -maxSpeed) {
- setCurrentSpeed(Math.max(currentSpeed - acceleration, -maxSpeed));
+ setCurrentSpeed(Math.max(currentSpeed - acceleration * delta * 144, -maxSpeed));
}
// DECELERATING
else if (!upPressed && !downPressed) {
if (currentSteeringSpeed > 0) {
- setCurrentSteeringSpeed(Math.max(currentSteeringSpeed - 1 * deltaTime, 0));
+ setCurrentSteeringSpeed(Math.max(currentSteeringSpeed - 0.00005 * delta * 144, 0));
} else if (currentSteeringSpeed < 0) {
- setCurrentSteeringSpeed(Math.min(currentSteeringSpeed + 1 * deltaTime, 0));
+ setCurrentSteeringSpeed(Math.min(currentSteeringSpeed + 0.00005 * delta * 144, 0));
}
- setCurrentSpeed(Math.max(currentSpeed - decceleration * deltaTime, 0));
+ setCurrentSpeed(Math.max(currentSpeed - decceleration * delta * 144, 0));
}
- console.log(currentSteeringSpeed)
// Update the kart's rotation based on the steering angle
- kart.current.rotation.y += steeringAngle * deltaTime;
+ kart.current.rotation.y += steeringAngle * delta * 144;
+ // Apply damping to simulate slowdown when no keys are pressed
body.current.applyImpulse(
{
- x: -body.current.linvel().x,
+ x: -body.current.linvel().x * (1 - damping) * delta * 144,
y: 0,
- z: -body.current.linvel().z,
+ z: -body.current.linvel().z * (1 - damping) * delta * 144,
},
true
);
@@ -170,13 +165,13 @@ export const PlayerController = () => {
// JUMPING
if (jumpPressed && isOnFloor.current && !jumpIsHeld.current) {
- jumpForce.current += 10;
+ jumpForce.current += 10 ;
isOnFloor.current = false;
jumpIsHeld.current = true;
}
if (!isOnFloor.current && jumpForce.current > 0) {
- jumpForce.current -= 1;
+ jumpForce.current -= 1 * delta * 144;
}
if (!jumpPressed) {
jumpIsHeld.current = false;
@@ -189,7 +184,7 @@ export const PlayerController = () => {
if (
jumpIsHeld.current &&
currentSteeringSpeed > 0 &&
- pointer.x < -0.24 &&
+ pointer.x < -0.1 &&
!driftRight.current
) {
driftLeft.current = true;
@@ -197,7 +192,7 @@ export const PlayerController = () => {
if (
jumpIsHeld.current &&
currentSteeringSpeed > 0 &&
- pointer.x > 0.24 &&
+ pointer.x > 0.1 &&
!driftLeft.current
) {
driftRight.current = true;
@@ -207,7 +202,7 @@ export const PlayerController = () => {
mario.current.rotation.y = THREE.MathUtils.lerp(
mario.current.rotation.y,
0,
- 0.0001
+ 0.0001 * delta * 144
);
setTurboColor(0xffffff);
accumulatedDriftPower.current = 0;
@@ -218,29 +213,26 @@ export const PlayerController = () => {
driftForce.current = 0.4;
mario.current.rotation.y = THREE.MathUtils.lerp(
mario.current.rotation.y,
- steeringAngle * 0.5,
- marioLerpFactor * deltaTime
+ steeringAngle * 50 + 0.5,
+ 0.05 * delta * 144
);
- accumulatedDriftPower.current += 0.1 * (steeringAngle + 1);
+ accumulatedDriftPower.current += 0.1 * (steeringAngle + 1) * delta * 144;
}
if (driftRight.current) {
driftDirection.current = -1;
driftForce.current = 0.4;
mario.current.rotation.y = THREE.MathUtils.lerp(
mario.current.rotation.y,
- -(-steeringAngle) * 0.5,
- marioLerpFactor * deltaTime
-
+ -(-steeringAngle * 50 + 0.5),
+ 0.05 * delta * 144
);
- accumulatedDriftPower.current += 0.1 * (steeringAngle + 1);
+ accumulatedDriftPower.current += 0.1 * (-steeringAngle + 1) * delta * 144 ;
}
- console.log(steeringAngle)
if (!driftLeft.current && !driftRight.current) {
mario.current.rotation.y = THREE.MathUtils.lerp(
mario.current.rotation.y,
- steeringAngle * 0.5,
- marioLerpFactor * deltaTime
-
+ steeringAngle * 30,
+ 0.05 * delta * 144
);
setScale(0);
}
@@ -258,7 +250,7 @@ export const PlayerController = () => {
}
if (driftLeft.current || driftRight.current) {
- const oscillation = Math.sin(time * 1000) * 0.1;
+ const oscillation = Math.sin(time * 1000) * 0.1 ;
const vibration = oscillation + 0.9;
@@ -271,19 +263,15 @@ export const PlayerController = () => {
// RELEASING DRIFT
if (boostDuration.current > 1 && !jumpIsHeld.current) {
+ setCurrentSpeed(boostSpeed);
+ boostDuration.current -= 1 * delta * 144;
+ targetZPosition = 10;
setIsBoosting(true);
-
- } else if (boostDuration.current <= 1 && !jumpIsHeld.current) {
+ } else if (boostDuration.current <= 1 ) {
targetZPosition = 8;
setIsBoosting(false);
}
- if(isBoosting){
- setCurrentSpeed(boostSpeed);
- boostDuration.current -= Math.floor(deltaTime * 1000);
- targetZPosition = 10;
- setIsBoosting(true);
- }
// CAMERA WORK
cam.current.updateMatrixWorld();
@@ -291,30 +279,31 @@ export const PlayerController = () => {
cam.current.position.x = THREE.MathUtils.lerp(
cam.current.position.x,
targetXPosition,
- cameraLerpFactor * deltaTime
+ 0.01 * delta * 144
);
cam.current.position.z = THREE.MathUtils.lerp(
cam.current.position.z,
targetZPosition,
- cameraLerpFactor * deltaTime
+ 0.01 * delta * 144
);
body.current.applyImpulse(
{
- x: forwardDirection.x * currentSpeed * 50 * deltaTime,
- y: 0 + jumpForce.current,
- z: forwardDirection.z * currentSpeed * 50 * deltaTime,
+ x: forwardDirection.x * currentSpeed * delta * 144,
+ y: 0 + jumpForce.current * delta * 144,
+ z: forwardDirection.z * currentSpeed * delta * 144,
},
true
);
// Update the kart's rotation based on the steering angle
- setSteeringAngleWheels(steeringAngle * 0.1);
+ setSteeringAngleWheels(steeringAngle * 25);
// SOUND WORK
+ console.log(body.current.translation())
});
return (
@@ -392,7 +381,7 @@ export const PlayerController = () => {
{/* */}
@@ -400,4 +389,4 @@ export const PlayerController = () => {
);
-};
+};
\ No newline at end of file
diff --git a/src/components/PointParticle.jsx b/src/components/PointParticle.jsx
index 46e7fc6..72f3669 100644
--- a/src/components/PointParticle.jsx
+++ b/src/components/PointParticle.jsx
@@ -23,13 +23,13 @@ export const PointParticle = ({ position, png, turboColor }) => {
setOpacity(1);
}, [turboColor]);
- useFrame(() => {
+ useFrame((_, delta) => {
if (turboColor === 0xffffff) return;
if (size < 3) {
- setSize((size) => size + 0.5);
+ setSize((size) => size + 0.5 * delta * 144);
} else if (opacity > 0) {
- setOpacity((opacity) => opacity - 0.05);
- setSize((size) => size + 0.2);
+ setOpacity((opacity) => opacity - 0.05 * delta * 144);
+ setSize((size) => size + 0.2 * delta * 144);
}
});