diff --git a/public/fonts/HK.ttf b/public/fonts/HK.ttf
new file mode 100644
index 0000000..59eb24c
Binary files /dev/null and b/public/fonts/HK.ttf differ
diff --git a/src/App.jsx b/src/App.jsx
index c4aeb19..9aea028 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -39,6 +39,7 @@ function App() {
actions.addPlayer(state);
console.log('player joined', state);
actions.setId(state.id);
+ console.log(state)
state.onQuit(() => {
actions.removePlayer(state);
diff --git a/src/components/PlayerController.jsx b/src/components/PlayerController.jsx
index 7763e20..85e5fe1 100644
--- a/src/components/PlayerController.jsx
+++ b/src/components/PlayerController.jsx
@@ -3,13 +3,9 @@ import { BallCollider, RigidBody, useRapier, vec3 } from "@react-three/rapier";
import {
useKeyboardControls,
PerspectiveCamera,
- ContactShadows,
- Sphere,
- OrbitControls,
- Trail,
PositionalAudio,
} from "@react-three/drei";
-import { useFrame, useThree } from "@react-three/fiber";
+import { useFrame, useThree, extend } from "@react-three/fiber";
import { useRef, useState, useEffect, useCallback } from "react";
import * as THREE from "three";
@@ -26,10 +22,17 @@ import FakeGlowMaterial from "./ShaderMaterials/FakeGlow/FakeGlowMaterial";
import { HitParticles } from "./Particles/hits/HitParticles";
import { CoinParticles } from "./Particles/coins/CoinParticles";
import { ItemParticles } from "./Particles/items/ItemParticles";
-import { isHost } from "playroomkit";
-
-export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNetworkShells, networkBananas, networkShells }) => {
+import { geometry } from "maath";
+extend(geometry);
+export const PlayerController = ({
+ player,
+ userPlayer,
+ setNetworkBananas,
+ setNetworkShells,
+ networkBananas,
+ networkShells,
+}) => {
const upPressed = useKeyboardControls((state) => state[Controls.up]);
const downPressed = useKeyboardControls((state) => state[Controls.down]);
const leftPressed = useKeyboardControls((state) => state[Controls.left]);
@@ -37,7 +40,7 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
const jumpPressed = useKeyboardControls((state) => state[Controls.jump]);
const shootPressed = useKeyboardControls((state) => state[Controls.shoot]);
const resetPressed = useKeyboardControls((state) => state[Controls.reset]);
-
+
const [isOnGround, setIsOnGround] = useState(false);
const body = useRef();
const kart = useRef();
@@ -85,13 +88,13 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
const downDirection = new THREE.Vector3(0, -1, 0);
const [shouldLaunch, setShouldLaunch] = useState(false);
const effectiveBoost = useRef(0);
+ const text = useRef();
-
- const { actions, shouldSlowDown, item, bananas, coins, id} = useStore();
+ const { actions, shouldSlowDown, item, bananas, coins, id } = useStore();
const slowDownDuration = useRef(1500);
-
+
useFrame(({ pointer, clock }, delta) => {
- if(player.id !== id) return;
+ if (player.id !== id) return;
const time = clock.getElapsedTime();
if (!body.current && !mario.current) return;
engineSound.current.setVolume(currentSpeed / 300 + 0.2);
@@ -123,8 +126,6 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
targetXPosition = 0;
1;
}
-
-
// mouse steering
@@ -132,15 +133,14 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
steeringAngle = currentSteeringSpeed * -pointer.x;
targetXPosition = -camMaxOffset * -pointer.x;
} else if (driftLeft.current && !driftRight.current) {
- steeringAngle = currentSteeringSpeed * -(pointer.x - 0.5);
+ steeringAngle = currentSteeringSpeed * -(pointer.x - 1);
targetXPosition = -camMaxOffset * -pointer.x;
} else if (driftRight.current && !driftLeft.current) {
- steeringAngle = currentSteeringSpeed * -(pointer.x + 0.5);
+ steeringAngle = currentSteeringSpeed * -(pointer.x + 1);
targetXPosition = -camMaxOffset * -pointer.x;
}
// ACCELERATING
const shouldSlow = actions.getShouldSlowDown();
-
if (upPressed && currentSpeed < maxSpeed) {
// Accelerate the kart within the maximum speed limit
@@ -168,7 +168,9 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
}
}
if (shouldSlow) {
- setCurrentSpeed(Math.max(currentSpeed - decceleration * 2 * delta * 144, 0));
+ setCurrentSpeed(
+ Math.max(currentSpeed - decceleration * 2 * delta * 144, 0)
+ );
setCurrentSteeringSpeed(0);
slowDownDuration.current -= 1500 * delta;
setShouldLaunch(true);
@@ -177,12 +179,8 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
slowDownDuration.current = 1500;
setShouldLaunch(false);
}
-
-
}
-
-
// REVERSING
if (downPressed && currentSpeed < -maxSpeed) {
setCurrentSpeed(
@@ -239,7 +237,7 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
if (isOnFloor.current && jumpForce.current > 0) {
landingSound.current.play();
}
- if (!isOnGround && jumpForce.current > 0 ) {
+ if (!isOnGround && jumpForce.current > 0) {
jumpForce.current -= 1 * delta * 144;
}
if (!jumpPressed) {
@@ -286,7 +284,7 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
driftForce.current = 0.4;
mario.current.rotation.y = THREE.MathUtils.lerp(
mario.current.rotation.y,
- steeringAngle * 50 + 0.5,
+ steeringAngle * 25 + 0.4,
0.05 * delta * 144
);
accumulatedDriftPower.current += 0.1 * (steeringAngle + 1) * delta * 144;
@@ -296,7 +294,7 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
driftForce.current = 0.4;
mario.current.rotation.y = THREE.MathUtils.lerp(
mario.current.rotation.y,
- -(-steeringAngle * 50 + 0.5),
+ -(-steeringAngle * 25 + 0.4),
0.05 * delta * 144
);
accumulatedDriftPower.current += 0.1 * (-steeringAngle + 1) * delta * 144;
@@ -330,7 +328,7 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
if (driftLeft.current || driftRight.current) {
const oscillation = Math.sin(time * 1000) * 0.1;
const vibration = oscillation + 0.9;
- if (turboColor === 0xffffff) {
+ if (turboColor === 0xffffff) {
setScale(vibration * 0.8);
} else {
setScale(vibration);
@@ -356,7 +354,7 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
setCurrentSpeed(boostSpeed);
effectiveBoost.current -= 1 * delta * 144;
targetZPosition = 10;
- if(!turboSound.current.isPlaying) turboSound.current.play();
+ if (!turboSound.current.isPlaying) turboSound.current.play();
driftTwoSound.current.play();
driftBlueSound.current.stop();
driftOrangeSound.current.stop();
@@ -399,10 +397,10 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
// MISC
- if(resetPressed) {
- body.current.setTranslation({x: 8, y: 2, z: -119});
- body.current.setLinvel({x: 0, y: 0, z: 0});
- body.current.setAngvel({x: 0, y: 0, z: 0});
+ if (resetPressed) {
+ body.current.setTranslation({ x: 8, y: 2, z: -119 });
+ body.current.setLinvel({ x: 0, y: 0, z: 0 });
+ body.current.setAngvel({ x: 0, y: 0, z: 0 });
setCurrentSpeed(0);
setCurrentSteeringSpeed(0);
setIsBoosting(false);
@@ -413,17 +411,16 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
kart.current.rotation.y = Math.PI / 2;
}
+ // ITEMS
+ if (shootPressed && item === "banana") {
+ const distanceBehind = 2;
+ const scaledBackwardDirection =
+ forwardDirection.multiplyScalar(distanceBehind);
- // ITEMS
-
- if(shootPressed && item === "banana") {
- const distanceBehind = 2;
- const scaledBackwardDirection = forwardDirection.multiplyScalar(distanceBehind);
-
-
- const kartPosition = new THREE.Vector3(...vec3(body.current.translation()));
-
+ const kartPosition = new THREE.Vector3(
+ ...vec3(body.current.translation())
+ );
const bananaPosition = kartPosition.sub(scaledBackwardDirection);
const newBanana = {
@@ -436,48 +433,44 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
actions.useItem();
}
- if(shootPressed && item === "shell") {
+ if (shootPressed && item === "shell") {
const distanceBehind = -2;
- const scaledBackwardDirection = forwardDirection.multiplyScalar(distanceBehind);
-
+ const scaledBackwardDirection =
+ forwardDirection.multiplyScalar(distanceBehind);
+
const kartPosition = new THREE.Vector3(
body.current.translation().x,
body.current.translation().y,
body.current.translation().z
);
-
+
const shellPosition = kartPosition.sub(scaledBackwardDirection);
const newShell = {
id: Math.random() + "-" + +new Date(),
position: shellPosition,
player: true,
- rotation: kartRotation
+ rotation: kartRotation,
};
setNetworkShells([...networkShells, newShell]);
actions.useItem();
-
}
- if(shootPressed && item === "mushroom") {
+ if (shootPressed && item === "mushroom") {
setIsBoosting(true);
effectiveBoost.current = 300;
actions.useItem();
}
-
-
- player.setState("position", body.current.translation());
- player.setState("rotation", kartRotation + mario.current.rotation.y);
- player.setState("isBoosting", isBoosting);
- player.setState("shouldLaunch", shouldLaunch);
- player.setState("turboColor", turboColor);
- player.setState("scale", scale);
- player.setState("bananas", bananas);
-
-
+ player.setState("position", body.current.translation());
+ player.setState("rotation", kartRotation + mario.current.rotation.y);
+ player.setState("isBoosting", isBoosting);
+ player.setState("shouldLaunch", shouldLaunch);
+ player.setState("turboColor", turboColor);
+ player.setState("scale", scale);
+ player.setState("bananas", bananas);
});
- return player.id === id ?(
+ return player.id === id ? (
{
+ onCollisionEnter={({ other }) => {
isOnFloor.current = true;
setIsOnGround(true);
}}
- onCollisionExit={({other}) => {
+ onCollisionExit={({ other }) => {
isOnFloor.current = false;
setIsOnGround(false);
}}
-
/>
@@ -512,8 +504,8 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
isBoosting={isBoosting}
shouldLaunch={shouldLaunch}
/>
-
-
+
+
-
{/* */}
@@ -576,7 +567,7 @@ export const PlayerController = ( { player, userPlayer, setNetworkBananas, setNe
png="./particles/star.png"
turboColor={turboColor}
/>
-
+
{/* */}
diff --git a/src/components/PlayerDummies.jsx b/src/components/PlayerDummies.jsx
index cc548b3..3eb7c1e 100644
--- a/src/components/PlayerDummies.jsx
+++ b/src/components/PlayerDummies.jsx
@@ -8,6 +8,8 @@ import {
OrbitControls,
Trail,
PositionalAudio,
+ Text,
+ Billboard,
} from "@react-three/drei";
import { useFrame, useThree } from "@react-three/fiber";
import { useRef, useState, useEffect, useCallback } from "react";
@@ -113,6 +115,9 @@ export const PlayerDummies = ( { player, userPlayer }) => {
return player.id != id? (
<>
+
+ {player.state.profile.name}
+
{
const velocity = {
diff --git a/src/components/store.jsx b/src/components/store.jsx
index 22ee87a..bf1649a 100644
--- a/src/components/store.jsx
+++ b/src/components/store.jsx
@@ -20,7 +20,7 @@ export const useStore = create((set, get) => ({
pastPositions: [],
shouldSlowdown: false,
bananas: [],
- items: ["mushroom"],
+ items: ["mushroom", "shell", "banana"],
item: "",
shells: [],
skids: [],
diff --git a/src/index.css b/src/index.css
index 6db33c0..22284aa 100644
--- a/src/index.css
+++ b/src/index.css
@@ -110,3 +110,14 @@ body::-webkit-scrollbar {
transform: scale(1.2);
}
}
+
+.annotation{
+ display:flex;
+ justify-content: center;
+ align-items: center;
+
+ background:none;
+ backdrop-filter: blur(10px);
+ pointer-events: none;
+
+}
\ No newline at end of file