From 89b411863b452fdab9d2b4a0cfd0e9d79d991f72 Mon Sep 17 00:00:00 2001 From: Silas Bartha Date: Mon, 10 Feb 2025 16:50:19 -0500 Subject: Reading messages from DB + clicking to place new messages --- src/components/player.jsx | 46 ++++++++++++++++++++++++++++++++++++---------- 1 file changed, 36 insertions(+), 10 deletions(-) (limited to 'src/components/player.jsx') diff --git a/src/components/player.jsx b/src/components/player.jsx index bd8e392..a9ddad0 100644 --- a/src/components/player.jsx +++ b/src/components/player.jsx @@ -1,29 +1,47 @@ -import { Capsule, PerspectiveCamera, PointerLockControls } from "@react-three/drei"; -import { useFrame } from "@react-three/fiber"; +import { PerspectiveCamera, PointerLockControls } from "@react-three/drei"; +import { useFrame, useThree } from "@react-three/fiber"; import { useContext, useEffect, useRef } from "react"; import { AppContext } from "../App"; -import { CapsuleCollider, RapierCollider, RapierRigidBody, RigidBody, useRapier, vec3 } from "@react-three/rapier"; -import { quat } from "@react-three/rapier"; -import { Euler, Object3D, Vector3 } from "three"; +import { CapsuleCollider, RigidBody, useRapier, vec3 } from "@react-three/rapier"; +import { Vector3 } from "three"; import { useBeforePhysicsStep } from "@react-three/rapier"; +import { Raycaster } from "three"; const _movespeed = 3.0; export default function Player() { const controlsRef = useRef(); - const { keys } = useContext(AppContext); + const { keys, setMessages } = useContext(AppContext); const rapier = useRapier(); const controller = useRef(); const collider = useRef(); const rigidbody = useRef(); const camera = useRef(); + const raycaster = useRef(new Raycaster()); + const { scene, pointer } = useThree(); const refState = useRef({ grounded: false, - jumping: false, velocity: vec3(), }); + const onClick = (_) => { + raycaster.current.setFromCamera(pointer, camera.current); + const intersect = raycaster.current.intersectObjects(scene.children).at(0); + if (intersect && intersect.object.name === 'ground' && intersect.distance < 10 && controlsRef.current.isLocked) { + const message = prompt(); + if (message) { + setMessages(messages => [...messages, { position: intersect.point, message: message}]); + } + controlsRef.current.lock(); + } + }; + + useEffect(() => { + window.addEventListener("click", onClick); + return () => window.removeEventListener("click", onClick); + }, []); + useEffect(() => { const c = rapier.world.createCharacterController(0.1); c.setApplyImpulsesToDynamicBodies(true); @@ -31,10 +49,18 @@ export default function Player() { controller.current = c; }, [rapier]); + useFrame((_, delta) => { + const fov_axis = +(keys.current.includes('Minus')) - +(keys.current.includes('Equal')); + if (fov_axis != 0) { + camera.current.fov += 45 * fov_axis * delta; + camera.current.updateProjectionMatrix(); + } + }); + useBeforePhysicsStep((world) => { if (controller.current && rigidbody.current && collider.current) { - const move_axis_x = +(keys.includes('KeyD')) - +(keys.includes('KeyA')); - const move_axis_z = +(keys.includes('KeyW')) - +(keys.includes('KeyS')); + const move_axis_x = +(keys.current.includes('KeyD')) - +(keys.current.includes('KeyA')); + const move_axis_z = +(keys.current.includes('KeyW')) - +(keys.current.includes('KeyS')); const { velocity } = refState.current; const position = vec3(rigidbody.current.translation()); @@ -69,7 +95,7 @@ export default function Player() { return ( - + -- cgit v1.2.3