diff --git a/package-lock.json b/package-lock.json index 68ba97a..9a53cfb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,15 +8,16 @@ "name": "vite-starter", "version": "0.0.0", "dependencies": { - "@react-three/drei": "^9.93.0", - "@react-three/fiber": "^8.15.13", + "@react-three/drei": "^9.96.4", + "@react-three/fiber": "^8.15.15", "@react-three/postprocessing": "^2.15.11", "@react-three/rapier": "^1.2.1", "gsap": "^3.12.5", "leva": "^0.9.35", "react": "^18.2.0", "react-dom": "^18.2.0", - "three": "^0.160.0", + "react-gamepad": "^1.0.3", + "three": "^0.160.1", "zustand": "^4.5.0" }, "devDependencies": { @@ -932,9 +933,9 @@ "integrity": "sha512-POu8Mk0hIU3lRXB3bGIGe4VHIwwDsQyoD1F394OK7STTiX9w4dG3cTLljjYswkQN+hDSHRrj4O36kuVa7KPU8Q==" }, "node_modules/@react-three/drei": { - "version": "9.93.0", - "resolved": "https://registry.npmjs.org/@react-three/drei/-/drei-9.93.0.tgz", - "integrity": "sha512-G59IZqPzpIZPvVLmzdCITXJQB+mnKMtFv7FvSRFogeelLzOFkyfnkED9QiY0WQCBMFOFLnSx6vb5xzmbQjHyQA==", + "version": "9.96.4", + "resolved": "https://registry.npmjs.org/@react-three/drei/-/drei-9.96.4.tgz", + "integrity": "sha512-Zmy5felOamD7DkD5EeLfijNkohDxHNtXomGAf3C/0G6ml/ocf1+VrJ6mLDQRE+DhRnF1RDHV+WC6nuvpPPkx1w==", "dependencies": { "@babel/runtime": "^7.11.2", "@mediapipe/tasks-vision": "0.10.8", @@ -944,9 +945,6 @@ "cross-env": "^7.0.3", "detect-gpu": "^5.0.28", "glsl-noise": "^0.0.0", - "lodash.clamp": "^4.0.3", - "lodash.omit": "^4.5.0", - "lodash.pick": "^4.4.0", "maath": "^0.10.7", "meshline": "^3.1.6", "react-composer": "^5.0.3", @@ -954,12 +952,13 @@ "stats-gl": "^2.0.0", "stats.js": "^0.17.0", "suspend-react": "^0.1.3", - "three-mesh-bvh": "^0.6.7", - "three-stdlib": "^2.28.0", + "three-mesh-bvh": "^0.7.0", + "three-stdlib": "^2.29.4", "troika-three-text": "^0.47.2", + "tunnel-rat": "^0.1.2", "utility-types": "^3.10.0", "uuid": "^9.0.1", - "zustand": "^3.5.13" + "zustand": "^3.7.1" }, "peerDependencies": { "@react-three/fiber": ">=8.0", @@ -990,9 +989,9 @@ } }, "node_modules/@react-three/fiber": { - "version": "8.15.13", - "resolved": "https://registry.npmjs.org/@react-three/fiber/-/fiber-8.15.13.tgz", - "integrity": "sha512-FS6F/k69q2KEf7nxdce1Rzd5qyp6VHtTgjouTMfiotWNiNwlhfQQeAxfcnDg0i2XVaOUGkLaD9BK8LBVnpfzUA==", + "version": "8.15.15", + "resolved": "https://registry.npmjs.org/@react-three/fiber/-/fiber-8.15.15.tgz", + "integrity": "sha512-Z5POnzgpYxrgnYuiCv+8t7lpynEcGcn0/323kV1NtE7Cwq16aMqEuC6nF2Y/tK+crJpKNEqsRtvng/eJy0xxOA==", "dependencies": { "@babel/runtime": "^7.17.8", "@types/react-reconciler": "^0.26.7", @@ -2194,21 +2193,6 @@ "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" }, - "node_modules/lodash.clamp": { - "version": "4.0.3", - "resolved": "https://registry.npmjs.org/lodash.clamp/-/lodash.clamp-4.0.3.tgz", - "integrity": "sha512-HvzRFWjtcguTW7yd8NJBshuNaCa8aqNFtnswdT7f/cMd/1YKy5Zzoq4W/Oxvnx9l7aeY258uSdDfM793+eLsVg==" - }, - "node_modules/lodash.omit": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/lodash.omit/-/lodash.omit-4.5.0.tgz", - "integrity": "sha512-XeqSp49hNGmlkj2EJlfrQFIzQ6lXdNro9sddtQzcJY8QaoC2GO0DT7xaIokHeyM+mIT0mPMlPvkYzg2xCuHdZg==" - }, - "node_modules/lodash.pick": { - "version": "4.4.0", - "resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz", - "integrity": "sha512-hXt6Ul/5yWjfklSGvLQl8vM//l3FtyHZeuelpzK6mm99pNvN9yTDruNZPEJZD1oWrqo+izBmB7oUfWgcCX7s4Q==" - }, "node_modules/loose-envify": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", @@ -2599,6 +2583,14 @@ "react": ">= 16.8" } }, + "node_modules/react-gamepad": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/react-gamepad/-/react-gamepad-1.0.3.tgz", + "integrity": "sha512-gMwITmfoHtCaMFpDaEshcjeibHAgynXD28NnS2pa+dG+stwNoN66YDVizN7GfyIrYiW5Ft1ubRxs6/2xW9sRhQ==", + "peerDependencies": { + "react": ">=15.0.0" + } + }, "node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", @@ -2893,22 +2885,22 @@ } }, "node_modules/three": { - "version": "0.160.0", - "resolved": "https://registry.npmjs.org/three/-/three-0.160.0.tgz", - "integrity": "sha512-DLU8lc0zNIPkM7rH5/e1Ks1Z8tWCGRq6g8mPowdDJpw1CFBJMU7UoJjC6PefXW7z//SSl0b2+GCw14LB+uDhng==" + "version": "0.160.1", + "resolved": "https://registry.npmjs.org/three/-/three-0.160.1.tgz", + "integrity": "sha512-Bgl2wPJypDOZ1stAxwfWAcJ0WQf7QzlptsxkjYiURPz+n5k4RBDLsq+6f9Y75TYxn6aHLcWz+JNmwTOXWrQTBQ==" }, "node_modules/three-mesh-bvh": { - "version": "0.6.8", - "resolved": "https://registry.npmjs.org/three-mesh-bvh/-/three-mesh-bvh-0.6.8.tgz", - "integrity": "sha512-EGebF9DZx1S8+7OZYNNTT80GXJZVf+UYXD/HyTg/e2kR/ApofIFfUS4ZzIHNnUVIadpnLSzM4n96wX+l7GMbnQ==", + "version": "0.7.0", + "resolved": "https://registry.npmjs.org/three-mesh-bvh/-/three-mesh-bvh-0.7.0.tgz", + "integrity": "sha512-Hj0Z1Rp02yy5H+/xtMBu/dYAeRsSONaBaVLZoST9sMpZxycHypRiUeMHucPOLWFHnpc5hwelOnONcLpkfhDg0Q==", "peerDependencies": { "three": ">= 0.151.0" } }, "node_modules/three-stdlib": { - "version": "2.28.12", - "resolved": "https://registry.npmjs.org/three-stdlib/-/three-stdlib-2.28.12.tgz", - "integrity": "sha512-6ZAomFjrtDVNxI56F3QNgV7uVn8JlEZVgzZP+UE9h/zpKmeD3pIZvmWymw9sYPoteof0hLDFom3cETRhErQh3g==", + "version": "2.29.4", + "resolved": "https://registry.npmjs.org/three-stdlib/-/three-stdlib-2.29.4.tgz", + "integrity": "sha512-XNzGCrz/uAk9XoLwd35eN7dQyI4ggXZTeqjcN034YdYBpBlNO9kmLHehl/0Nw9jCelblB7jla+unHAOIyLyV6Q==", "dependencies": { "@types/draco3d": "^1.4.0", "@types/offscreencanvas": "^2019.6.4", @@ -2966,6 +2958,14 @@ "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" }, + "node_modules/tunnel-rat": { + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/tunnel-rat/-/tunnel-rat-0.1.2.tgz", + "integrity": "sha512-lR5VHmkPhzdhrM092lI2nACsLO4QubF0/yoOhzX7c+wIpbN1GjHNzCc91QlpxBi+cnx8vVJ+Ur6vL5cEoQPFpQ==", + "dependencies": { + "zustand": "^4.3.2" + } + }, "node_modules/type-is": { "version": "1.6.18", "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz", @@ -3006,9 +3006,9 @@ } }, "node_modules/utility-types": { - "version": "3.10.0", - "resolved": "https://registry.npmjs.org/utility-types/-/utility-types-3.10.0.tgz", - "integrity": "sha512-O11mqxmi7wMKCo6HKFt5AhO4BwY3VV68YU07tgxfz8zJTIxr4BpsezN49Ffwy9j3ZpwwJp4fkRwjRzq3uWE6Rg==", + "version": "3.11.0", + "resolved": "https://registry.npmjs.org/utility-types/-/utility-types-3.11.0.tgz", + "integrity": "sha512-6Z7Ma2aVEWisaL6TvBCy7P8rm2LQoPv6dJ7ecIaIixHcwfbJ0x7mWdbcwlIM5IGQxPZSFYeqRCqlOOeKoJYMkw==", "engines": { "node": ">= 4" } @@ -3047,9 +3047,9 @@ } }, "node_modules/vite": { - "version": "4.5.1", - "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.1.tgz", - "integrity": "sha512-AXXFaAJ8yebyqzoNB9fu2pHoo/nWX+xZlaRwoeYUxEqBO+Zj4msE5G+BhGBll9lYEKv9Hfks52PAF2X7qDYXQA==", + "version": "4.5.2", + "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.2.tgz", + "integrity": "sha512-tBCZBNSBbHQkaGyhGCDUGqeo2ph8Fstyp6FMSvTtsXeZSPpSMGlviAOav2hxVTqFcx8Hj/twtWKsMJXNY0xI8w==", "dev": true, "dependencies": { "esbuild": "^0.18.10", diff --git a/package.json b/package.json index 9eab699..110a1e7 100644 --- a/package.json +++ b/package.json @@ -9,15 +9,16 @@ "preview": "vite preview" }, "dependencies": { - "@react-three/drei": "^9.93.0", - "@react-three/fiber": "^8.15.13", + "@react-three/drei": "^9.96.4", + "@react-three/fiber": "^8.15.15", "@react-three/postprocessing": "^2.15.11", "@react-three/rapier": "^1.2.1", "gsap": "^3.12.5", "leva": "^0.9.35", "react": "^18.2.0", "react-dom": "^18.2.0", - "three": "^0.160.0", + "react-gamepad": "^1.0.3", + "three": "^0.160.1", "zustand": "^4.5.0" }, "devDependencies": { diff --git a/public/models/mariokarttest-transformed.glb b/public/models/characters/mariokarttest-transformed.glb similarity index 100% rename from public/models/mariokarttest-transformed.glb rename to public/models/characters/mariokarttest-transformed.glb diff --git a/public/models/mariokarttest.glb b/public/models/characters/mariokarttest.glb similarity index 100% rename from public/models/mariokarttest.glb rename to public/models/characters/mariokarttest.glb diff --git a/public/models/front_wheel.glb b/public/models/front_wheel.glb deleted file mode 100644 index 55271b8..0000000 Binary files a/public/models/front_wheel.glb and /dev/null differ diff --git a/public/models/mario_kart-transformed.glb b/public/models/mario_kart-transformed.glb deleted file mode 100644 index f9721ad..0000000 Binary files a/public/models/mario_kart-transformed.glb and /dev/null differ diff --git a/public/models/mario_kart.glb b/public/models/mario_kart.glb deleted file mode 100644 index 1653d96..0000000 Binary files a/public/models/mario_kart.glb and /dev/null differ diff --git a/public/models/mariokart-transformed.glb b/public/models/mariokart-transformed.glb deleted file mode 100644 index a1e15a9..0000000 Binary files a/public/models/mariokart-transformed.glb and /dev/null differ diff --git a/public/models/mariokart.glb b/public/models/mariokart.glb deleted file mode 100644 index 15ee576..0000000 Binary files a/public/models/mariokart.glb and /dev/null differ diff --git a/public/models/racing_kart-transformed.glb b/public/models/racing_kart-transformed.glb deleted file mode 100644 index c26d66b..0000000 Binary files a/public/models/racing_kart-transformed.glb and /dev/null differ diff --git a/public/models/racing_kart.glb b/public/models/racing_kart.glb deleted file mode 100644 index 9ac78c6..0000000 Binary files a/public/models/racing_kart.glb and /dev/null differ diff --git a/public/models/racing_kart_test-transformed.glb b/public/models/racing_kart_test-transformed.glb deleted file mode 100644 index dc39ccf..0000000 Binary files a/public/models/racing_kart_test-transformed.glb and /dev/null differ diff --git a/public/models/racing_kart_test.glb b/public/models/racing_kart_test.glb deleted file mode 100644 index 6c969f4..0000000 Binary files a/public/models/racing_kart_test.glb and /dev/null differ diff --git a/public/models/rear_wheels.glb b/public/models/rear_wheels.glb deleted file mode 100644 index 79cf991..0000000 Binary files a/public/models/rear_wheels.glb and /dev/null differ diff --git a/public/models/spafrancorchamps-REALISTIC.glb b/public/models/spafrancorchamps-REALISTIC.glb deleted file mode 100644 index b70e756..0000000 Binary files a/public/models/spafrancorchamps-REALISTIC.glb and /dev/null differ diff --git a/public/models/spafrancorchamps-transformed.glb b/public/models/spafrancorchamps-transformed.glb deleted file mode 100644 index 06b3351..0000000 Binary files a/public/models/spafrancorchamps-transformed.glb and /dev/null differ diff --git a/public/models/spafrancorchamps.glb b/public/models/spafrancorchamps.glb deleted file mode 100644 index 89e0fe4..0000000 Binary files a/public/models/spafrancorchamps.glb and /dev/null differ diff --git a/public/models/tour_paris_promenade-transformed.glb b/public/models/tracks/tour_paris_promenade-transformed.glb similarity index 100% rename from public/models/tour_paris_promenade-transformed.glb rename to public/models/tracks/tour_paris_promenade-transformed.glb diff --git a/public/models/tour_paris_promenade.glb b/public/models/tracks/tour_paris_promenade.glb similarity index 100% rename from public/models/tour_paris_promenade.glb rename to public/models/tracks/tour_paris_promenade.glb diff --git a/src/components/Experience.jsx b/src/components/Experience.jsx index 4ccad88..3612092 100644 --- a/src/components/Experience.jsx +++ b/src/components/Experience.jsx @@ -1,19 +1,15 @@ import { Environment, OrbitControls, PerspectiveCamera, Lightformer } from '@react-three/drei' import { Ground } from './Ground' -import { RigidBody } from '@react-three/rapier' import { PlayerController } from './PlayerController' -import { Track } from './models/Spafrancorchamps-REALISTIC' -import { Paris } from './models/Tour_paris_promenade' -import { EffectComposer, N8AO, Bloom, DepthOfField, TiltShift2, HueSaturation, SMAA, ChromaticAberration, Vignette } from '@react-three/postprocessing' -import { PlayerControllerAgain } from './PlayerControllerAgain' +import { Paris } from './models/tracks/Tour_paris_promenade' +import { EffectComposer, N8AO, Bloom, TiltShift2, HueSaturation, SMAA, ChromaticAberration, Vignette } from '@react-three/postprocessing' import { Skid } from './Skid' export const Experience = () => { return ( <> - - {/* */} + {/* */} { castShadow /> - {/* */} - {/* */} { luminanceSmoothing={0.01} intensity={0.5} /> - {/* */} + diff --git a/src/components/DriftParticlesLeft.jsx b/src/components/Particles/DriftParticlesLeft.jsx similarity index 100% rename from src/components/DriftParticlesLeft.jsx rename to src/components/Particles/DriftParticlesLeft.jsx diff --git a/src/components/DriftParticlesRight.jsx b/src/components/Particles/DriftParticlesRight.jsx similarity index 100% rename from src/components/DriftParticlesRight.jsx rename to src/components/Particles/DriftParticlesRight.jsx diff --git a/src/components/FlameParticle.jsx b/src/components/Particles/FlameParticle.jsx similarity index 100% rename from src/components/FlameParticle.jsx rename to src/components/Particles/FlameParticle.jsx diff --git a/src/components/FlameParticles.jsx b/src/components/Particles/FlameParticles.jsx similarity index 100% rename from src/components/FlameParticles.jsx rename to src/components/Particles/FlameParticles.jsx diff --git a/src/components/Particles1.jsx b/src/components/Particles/Particles1.jsx similarity index 100% rename from src/components/Particles1.jsx rename to src/components/Particles/Particles1.jsx diff --git a/src/components/Particles2.jsx b/src/components/Particles/Particles2.jsx similarity index 100% rename from src/components/Particles2.jsx rename to src/components/Particles/Particles2.jsx diff --git a/src/components/Particles3.jsx b/src/components/Particles/Particles3.jsx similarity index 100% rename from src/components/Particles3.jsx rename to src/components/Particles/Particles3.jsx diff --git a/src/components/Particles4.jsx b/src/components/Particles/Particles4.jsx similarity index 100% rename from src/components/Particles4.jsx rename to src/components/Particles/Particles4.jsx diff --git a/src/components/PointParticle.jsx b/src/components/Particles/PointParticle.jsx similarity index 100% rename from src/components/PointParticle.jsx rename to src/components/Particles/PointParticle.jsx diff --git a/src/components/PlayerController.jsx b/src/components/PlayerController.jsx index c5de690..b1f1d06 100644 --- a/src/components/PlayerController.jsx +++ b/src/components/PlayerController.jsx @@ -12,19 +12,14 @@ import { import { useFrame, useThree } from "@react-three/fiber"; import { useRef, useState, useEffect, useCallback } from "react"; import * as THREE from "three"; -import { Model } from "./models/Racing_kart"; -import { FrontRightWheel } from "./models/Front_Right_Wheel"; -import { FrontLeftWheel } from "./models/Front_Left_Wheel"; -import { RearWheels } from "./models/Rear_wheels"; -import gsap from "gsap"; -import { Mario } from "./models/Mario_kart"; -import { Particles1 } from "./Particles1"; -import { DriftParticlesLeft } from "./DriftParticlesLeft"; -import { DriftParticlesRight } from "./DriftParticlesRight"; -import FakeGlowMaterial from "./FakeGlow/FakeGlowMaterial"; -import { PointParticle } from "./PointParticle"; -import { FlameParticle } from "./FlameParticle"; -import { FlameParticles } from "./FlameParticles"; + +import { Mario } from "./models/characters/Mario_kart"; +import { DriftParticlesLeft } from "./Particles/DriftParticlesLeft"; +import { DriftParticlesRight } from "./Particles/DriftParticlesRight"; + +import { PointParticle } from "./Particles/PointParticle"; + +import { FlameParticles } from "./Particles/FlameParticles"; import { useStore } from "./store"; import { Cylinder } from "@react-three/drei"; diff --git a/src/components/PlayerControllerAgain.jsx b/src/components/PlayerControllerAgain.jsx deleted file mode 100644 index db18206..0000000 --- a/src/components/PlayerControllerAgain.jsx +++ /dev/null @@ -1,417 +0,0 @@ -import { Controls } from "../App"; -import { BallCollider, RigidBody, useRapier } from "@react-three/rapier"; -import { - useKeyboardControls, - PerspectiveCamera, - ContactShadows, - Sphere, - OrbitControls, - Trail, - PositionalAudio, -} from "@react-three/drei"; -import { useFrame, useThree } from "@react-three/fiber"; -import { useRef, useState, useEffect, useCallback } from "react"; -import * as THREE from "three"; -import { Model } from "./models/Racing_kart"; -import { FrontRightWheel } from "./models/Front_Right_Wheel"; -import { FrontLeftWheel } from "./models/Front_Left_Wheel"; -import { RearWheels } from "./models/Rear_wheels"; -import gsap from "gsap"; -import { Mario } from "./models/Mario_kart"; -import { Particles1 } from "./Particles1"; -import { DriftParticlesLeft } from "./DriftParticlesLeft"; -import { DriftParticlesRight } from "./DriftParticlesRight"; -import FakeGlowMaterial from "./FakeGlow/FakeGlowMaterial"; -import { PointParticle } from "./PointParticle"; -import { FlameParticle } from "./FlameParticle"; -import { FlameParticles } from "./FlameParticles"; - -export const PlayerControllerAgain = () => { - const upPressed = useKeyboardControls((state) => state[Controls.up]); - const downPressed = useKeyboardControls((state) => state[Controls.down]); - const leftPressed = useKeyboardControls((state) => state[Controls.left]); - const rightPressed = useKeyboardControls((state) => state[Controls.right]); - const jumpPressed = useKeyboardControls((state) => state[Controls.jump]); - const [isOnGround, setIsOnGround] = useState(false); - const body = useRef(); - const kart = useRef(); - const cam = useRef(); - const initialSpeed = 0; - const maxSpeed = 45; - const boostSpeed = 70; - const acceleration = 30; - const decceleration = 50; - const damping = 90; - const MaxSteeringSpeed = 1.1; - const [currentSteeringSpeed, setCurrentSteeringSpeed] = useState(0); - const [currentSpeed, setCurrentSpeed] = useState(initialSpeed); - const camMaxOffset = 1; - let steeringAngle = 0; - const isOnFloor = useRef(false); - const jumpForce = useRef(0); - const jumpIsHeld = useRef(false); - const driftDirection = useRef(0); - const driftLeft = useRef(false); - const driftRight = useRef(false); - const driftForce = useRef(0); - const mario = useRef(); - const accumulatedDriftPower = useRef(0); - const blueTurboThreshold = 10; - const orangeTurboThreshold = 30; - const purpleTurboThreshold = 60; - const [turboColor, setTurboColor] = useState(0xffffff); - const boostDuration = useRef(0); - const [isBoosting, setIsBoosting] = useState(false); - let targetXPosition = 0; - let targetZPosition = 8; - const [steeringAngleWheels, setSteeringAngleWheels] = useState(0); - const engineSound = useRef(); - const cameraLerpFactor = 2; - const marioLerpFactor = 5; - - const [scale, setScale] = useState(0); - let lastTime = performance.now(); - - useFrame(({ pointer, clock }) => { - const time = clock.getElapsedTime(); - const currentTime = performance.now(); - const deltaTime = (currentTime - lastTime) * 0.001; - lastTime = currentTime; - if (!body.current && !mario.current) return; - - // HANDLING AND STEERING - const kartRotation = - kart.current.rotation.y - driftDirection.current * driftForce.current; - const forwardDirection = new THREE.Vector3( - -Math.sin(kartRotation), - 0, - -Math.cos(kartRotation) - ); - body.current.applyImpulse( - { - x: forwardDirection.x * currentSpeed * 50 * deltaTime, - y: 0 + jumpForce.current, - z: forwardDirection.z * currentSpeed * 50 * deltaTime, - }, - true - ); - - // ACCELERATING - if (upPressed && currentSpeed < maxSpeed) { - - setCurrentSpeed( - Math.min(currentSpeed + acceleration * deltaTime, maxSpeed) - ); - } - if (!upPressed) { - if (currentSpeed > 0) { - setCurrentSpeed(Math.max(currentSpeed - decceleration * deltaTime, 0)); - } - if (currentSteeringSpeed > 0) { - setCurrentSteeringSpeed( - Math.max(currentSteeringSpeed - 1 * deltaTime, 0) - ); - } - } - - if (upPressed) { - if (currentSteeringSpeed < MaxSteeringSpeed) { - setCurrentSteeringSpeed( - Math.min(currentSteeringSpeed + 1 * deltaTime, MaxSteeringSpeed) - ); - } - } - if (leftPressed && currentSpeed > 0) { - steeringAngle = currentSteeringSpeed; - targetXPosition = -camMaxOffset; - } else if (rightPressed && currentSpeed > 0) { - steeringAngle = -currentSteeringSpeed; - targetXPosition = camMaxOffset; - } else { - steeringAngle = 0; - targetXPosition = 0; - 1; - } - - if (!driftLeft.current && !driftRight.current) { - steeringAngle = currentSteeringSpeed * -pointer.x; - targetXPosition = -camMaxOffset * -pointer.x; - } else if (driftLeft.current && !driftRight.current) { - steeringAngle = currentSteeringSpeed * -(pointer.x - 0.8); - targetXPosition = -camMaxOffset * -pointer.x; - } else if (driftRight.current && !driftLeft.current) { - steeringAngle = currentSteeringSpeed * -(pointer.x + 0.8); - targetXPosition = -camMaxOffset * -pointer.x; - } - kart.current.rotation.y += steeringAngle * deltaTime; - body.current.applyImpulse( - { - x: -body.current.linvel().x * damping * deltaTime, - y: 0, - z: -body.current.linvel().z * damping * deltaTime, - }, - true - ); - body.current.applyImpulse( - { - x: forwardDirection.x * currentSpeed * 50 * deltaTime, - y: 0 + jumpForce.current, - z: forwardDirection.z * currentSpeed * 50 * deltaTime, - }, - true - ); - - const bodyPosition = body.current.translation(); - kart.current.position.set( - bodyPosition.x, - bodyPosition.y - 0.5, - bodyPosition.z - ); - - // JUMPING - if (jumpPressed && isOnFloor.current && !jumpIsHeld.current) { - jumpForce.current += 7; - isOnFloor.current = false; - jumpIsHeld.current = true; - } - - if (!isOnFloor.current && jumpForce.current > 0) { - jumpForce.current -= 1; - } - if (!jumpPressed) { - jumpIsHeld.current = false; - driftDirection.current = 0; - driftForce.current = 0; - driftLeft.current = false; - driftRight.current = false; - } - - // DRIFTING - if ( - jumpIsHeld.current && - currentSteeringSpeed > 0 && - pointer.x < -0.1 && - !driftRight.current - ) { - driftLeft.current = true; - } - if ( - jumpIsHeld.current && - currentSteeringSpeed > 0 && - pointer.x > 0.1 && - !driftLeft.current - ) { - driftRight.current = true; - } - - if (driftLeft.current) { - driftDirection.current = 1; - driftForce.current = 0.15; - mario.current.rotation.y = THREE.MathUtils.lerp( - mario.current.rotation.y, - steeringAngle * 0.5, - marioLerpFactor * deltaTime - ); - accumulatedDriftPower.current += 10 * (steeringAngle + 1) * deltaTime; - } - if (driftRight.current) { - driftDirection.current = -1; - driftForce.current = 0.15; - mario.current.rotation.y = THREE.MathUtils.lerp( - mario.current.rotation.y, - -(-steeringAngle) * 0.5, - marioLerpFactor * deltaTime - ); - accumulatedDriftPower.current += 10 * (-steeringAngle + 1) * deltaTime; - } - - // console.log(steeringAngle) - if (!driftLeft.current && !driftRight.current) { - mario.current.rotation.y = THREE.MathUtils.lerp( - mario.current.rotation.y, - steeringAngle * 0.2, - marioLerpFactor * deltaTime - ); - setScale(0); - accumulatedDriftPower.current = 0; - setTurboColor(0xffffff); - - } - - - if (accumulatedDriftPower.current > blueTurboThreshold) { - setTurboColor(0x00ffff); - boostDuration.current = 50; - } - if (accumulatedDriftPower.current > orangeTurboThreshold) { - setTurboColor(0xffcf00); - boostDuration.current = 100; - } - if (accumulatedDriftPower.current > purpleTurboThreshold) { - setTurboColor(0xff00ff); - boostDuration.current = 250; - } - - if (driftLeft.current || driftRight.current) { - const oscillation = Math.sin(time * 1000) * 0.1; - - const vibration = oscillation + 0.9; - - if (turboColor === 0xffffff) { - setScale(vibration * 0.8); - } else { - setScale(vibration); - } - } - - // RELEASING DRIFT - if (isBoosting) { - setCurrentSpeed(boostSpeed); - boostDuration.current -= deltaTime * 200; - targetZPosition = 10; - - if (boostDuration.current <= 0) { - setIsBoosting(false); - targetZPosition = 8; - } - } else if (boostDuration.current > 0 && !jumpIsHeld.current) { - setIsBoosting(true); - } - - if (!isBoosting && currentSpeed === boostSpeed) { - setCurrentSpeed(maxSpeed); - } - - - if (!isBoosting) { - if (upPressed && currentSpeed < maxSpeed) { - setCurrentSpeed(Math.min(currentSpeed + acceleration * deltaTime, maxSpeed)); - } else if (!upPressed && currentSpeed > 0) { - setCurrentSpeed(Math.max(currentSpeed - decceleration * deltaTime, 0)); - } - } - - // Debug logging - // console.log(`Speed: ${currentSpeed}, Boosting: ${isBoosting}, Boost Duration: ${boostDuration.current}`); - - // CAMERA WORK - - cam.current.position.x = THREE.MathUtils.lerp( - cam.current.position.x, - targetXPosition, - cameraLerpFactor * deltaTime - ); - - cam.current.position.z = THREE.MathUtils.lerp( - cam.current.position.z, - targetZPosition, - cameraLerpFactor * deltaTime - ); - - cam.current.updateMatrixWorld(); - - setSteeringAngleWheels(steeringAngle * 0.1); - //misc / debug - - // SOUND WORK - }); - - return ( - - - { - isOnFloor.current = true; - }} - /> - onCollisionEnter= - {(event) => { - isOnFloor.current = false; - }} - - - - - - - - - - - - - - - - - {/* */} - - - - - - - - - - {/* */} - - {/* */} - - - ); -}; diff --git a/src/components/FakeFlame/FakeFlame.jsx b/src/components/ShaderMaterials/FakeFlame/FakeFlame.jsx similarity index 100% rename from src/components/FakeFlame/FakeFlame.jsx rename to src/components/ShaderMaterials/FakeFlame/FakeFlame.jsx diff --git a/src/components/FakeGlow/FakeGlowMaterial.jsx b/src/components/ShaderMaterials/FakeGlow/FakeGlowMaterial.jsx similarity index 100% rename from src/components/FakeGlow/FakeGlowMaterial.jsx rename to src/components/ShaderMaterials/FakeGlow/FakeGlowMaterial.jsx diff --git a/src/components/models/Front_Left_Wheel.jsx b/src/components/models/Front_Left_Wheel.jsx deleted file mode 100644 index 0edb0a2..0000000 --- a/src/components/models/Front_Left_Wheel.jsx +++ /dev/null @@ -1,73 +0,0 @@ -import React, { useEffect, useRef } from "react"; -import { useGLTF } from "@react-three/drei"; -import gsap from "gsap"; - -export function FrontLeftWheel({ - currentSpeed, - left, - right, - ...props -}) { - const { nodes, materials } = useGLTF("./models/front_wheel.glb"); - const wheel = useRef(); - - - useEffect(() => { - if (!wheel.current) return; - if(left){ - gsap.to(wheel.current.rotation, { - duration: 0.5, - y: Math.PI + Math.PI / 8, - ease: "power2.inOut", - }); - gsap.to(wheel.current.position, { - duration: 0.5, - z: 0.075, - ease: "power2.inOut", - }); - } else if(right){ - gsap.to(wheel.current.rotation, { - duration: 0.5, - y: Math.PI - Math.PI / 8, - ease: "power2.inOut", - }); - gsap.to(wheel.current.position, { - duration: 0.5, - z: -0.075, - ease: "power2.inOut", - }); - } else if(!left && !right){ - gsap.to(wheel.current.rotation, { - duration: 0.2, - y: Math.PI, - ease: "power2.inOut", - }); - gsap.to(wheel.current.position, { - duration: 0.2, - z: 0, - ease: "power2.inOut", - }); - } - - }, [left, right]); - return ( - - - - - - - - ); -} - -useGLTF.preload("./models/front_wheel.glb"); \ No newline at end of file diff --git a/src/components/models/Front_Right_Wheel.jsx b/src/components/models/Front_Right_Wheel.jsx deleted file mode 100644 index 4cceb2c..0000000 --- a/src/components/models/Front_Right_Wheel.jsx +++ /dev/null @@ -1,74 +0,0 @@ -import React, { useEffect, useRef } from "react"; -import { useGLTF } from "@react-three/drei"; -import gsap from "gsap"; - -export function FrontRightWheel({ - currentSpeed, - left, - right, - ...props -}) { - const { nodes, materials } = useGLTF("./models/front_wheel.glb"); - const wheel = useRef(); - - - useEffect(() => { - if (!wheel.current) return; - if(left){ - gsap.to(wheel.current.rotation, { - duration: 0.5, - y: Math.PI / 8, - ease: "power2.inOut", - }); - gsap.to(wheel.current.position, { - duration: 0.5, - z: -0.075, - ease: "power2.inOut", - }); - - } else if(right){ - gsap.to(wheel.current.rotation, { - duration: 0.5, - y: - Math.PI / 8, - ease: "power2.inOut", - }); - gsap.to(wheel.current.position, { - duration: 0.5, - z: 0.075, - ease: "power2.inOut", - }); - } else if(!left && !right) { - gsap.to(wheel.current.rotation, { - duration: 0.2, - y: 0, - ease: "power2.inOut", - }); - gsap.to(wheel.current.position, { - duration: 0.2, - z: 0, - ease: "power2.inOut", - }); - } - - }, [left, right]); - return ( - - - - - - - - ); -} - -useGLTF.preload("./models/front_wheel.glb"); \ No newline at end of file diff --git a/src/components/models/Front_wheel.jsx b/src/components/models/Front_wheel.jsx deleted file mode 100644 index 5dc9282..0000000 --- a/src/components/models/Front_wheel.jsx +++ /dev/null @@ -1,44 +0,0 @@ -/* -Auto-generated by: https://github.com/pmndrs/gltfjsx -Command: npx gltfjsx@6.2.16 .\front_wheel.glb -*/ - -import React, { useEffect, useRef } from "react"; -import { useGLTF } from "@react-three/drei"; -import gsap from "gsap"; - -export function FrontWheel({ - isLeftWheel, - currentSpeed, - left, - right, - ...props -}) { - const { nodes, materials } = useGLTF("./models/front_wheel.glb"); - const wheel = useRef(); - const rotation = isLeftWheel ? [0, Math.PI, 0] : [0, 0, 0]; - - useEffect(() => { - - }, [currentSpeed, left, right]); - return ( - - - - - - - - ); -} - -useGLTF.preload("./models/front_wheel.glb"); diff --git a/src/components/models/Racing_kart.jsx b/src/components/models/Racing_kart.jsx deleted file mode 100644 index 42566fa..0000000 --- a/src/components/models/Racing_kart.jsx +++ /dev/null @@ -1,111 +0,0 @@ -/* -Auto-generated by: https://github.com/pmndrs/gltfjsx -Command: npx gltfjsx@6.2.16 .\racing_kart.glb --transform -Files: .\racing_kart.glb [1.83MB] > C:\Users\mouli\dev\r3f-vite-starter\public\models\racing_kart-transformed.glb [150.05KB] (92%) -Author: scailman (https://sketchfab.com/scailman) -License: CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/) -Source: https://sketchfab.com/3d-models/racing-kart-f48f8e66bba6492eadc000d2585b6a32 -Title: Racing Kart -*/ - -import React, { useEffect, useRef } from "react"; -import { useGLTF } from "@react-three/drei"; -import gsap from "gsap"; - -export function Model({ steeringAngle, speed, left, right, ...props }) { - const { nodes, materials } = useGLTF("./models/racing_kart-transformed.glb"); - - - return ( - - - - - - - - - - - - {/* - */} - - - - - - ); -} - -useGLTF.preload("./models/racing_kart-transformed.glb"); diff --git a/src/components/models/Rear_wheels.jsx b/src/components/models/Rear_wheels.jsx deleted file mode 100644 index 5fb6d82..0000000 --- a/src/components/models/Rear_wheels.jsx +++ /dev/null @@ -1,33 +0,0 @@ -/* -Auto-generated by: https://github.com/pmndrs/gltfjsx -Command: npx gltfjsx@6.2.16 .\rear_wheels.glb -*/ - -import React, { useRef } from 'react' -import { useGLTF } from '@react-three/drei' - -export function RearWheels(props) { - const { nodes, materials } = useGLTF('./models/rear_wheels.glb') - return ( - - - - - - - - - - - - - - - - - - - ) -} - -useGLTF.preload('./models/rear_wheels.glb') diff --git a/src/components/models/Spafrancorchamps-REALISTIC.jsx b/src/components/models/Spafrancorchamps-REALISTIC.jsx deleted file mode 100644 index e254e96..0000000 --- a/src/components/models/Spafrancorchamps-REALISTIC.jsx +++ /dev/null @@ -1,21 +0,0 @@ -/* -Auto-generated by: https://github.com/pmndrs/gltfjsx -Command: npx gltfjsx@6.2.16 .\spafrancorchamps-REALISTIC.glb -*/ - -import React, { useRef } from 'react' -import { useGLTF } from '@react-three/drei' -import { RigidBody } from '@react-three/rapier' - -export function Track(props) { - const { nodes, materials } = useGLTF('./models/spafrancorchamps-REALISTIC.glb') - return ( - - - - - - ) -} - -useGLTF.preload('./models/spafrancorchamps-REALISTIC.glb') diff --git a/src/components/models/Mario_kart.jsx b/src/components/models/characters/Mario_kart.jsx similarity index 92% rename from src/components/models/Mario_kart.jsx rename to src/components/models/characters/Mario_kart.jsx index 7e8460c..c8469b5 100644 --- a/src/components/models/Mario_kart.jsx +++ b/src/components/models/characters/Mario_kart.jsx @@ -6,11 +6,11 @@ Command: npx gltfjsx@6.2.16 .\mariokarttest.glb --shadows import React, { useRef } from 'react' import { Cylinder, OrbitControls, Sphere, useGLTF } from '@react-three/drei' import { useFrame } from '@react-three/fiber' -import FakeGlowMaterial from '../FakeGlow/FakeGlowMaterial' -import FakeFlame from '../FakeFlame/FakeFlame' +import FakeGlowMaterial from '../../ShaderMaterials/FakeGlow/FakeGlowMaterial' +import FakeFlame from '../../ShaderMaterials/FakeFlame/FakeFlame' export function Mario({ currentSpeed, steeringAngleWheels, isBoosting, ...props }) { - const { nodes, materials } = useGLTF('./models/mariokarttest.glb') + const { nodes, materials } = useGLTF('./models/characters/mariokarttest.glb') const frontLeftWheel = useRef() const frontRightWheel = useRef() @@ -123,4 +123,4 @@ export function Mario({ currentSpeed, steeringAngleWheels, isBoosting, ...props ) } -useGLTF.preload('./models/mariokarttest.glb') +useGLTF.preload('./models/characters/mariokarttest.glb') diff --git a/src/components/models/Tour_paris_promenade.jsx b/src/components/models/tracks/Tour_paris_promenade.jsx similarity index 94% rename from src/components/models/Tour_paris_promenade.jsx rename to src/components/models/tracks/Tour_paris_promenade.jsx index 172a542..6d43456 100644 --- a/src/components/models/Tour_paris_promenade.jsx +++ b/src/components/models/tracks/Tour_paris_promenade.jsx @@ -13,7 +13,7 @@ import { useGLTF } from '@react-three/drei' import { RigidBody } from '@react-three/rapier' export function Paris(props) { - const { nodes, materials } = useGLTF('./models/tour_paris_promenade-transformed.glb') + const { nodes, materials } = useGLTF('./models/tracks/tour_paris_promenade-transformed.glb') materials.M_Cmn_ShadowCollision.opacity = 0 materials.M_Cmn_ShadowCollision.transparent = true return ( @@ -35,4 +35,4 @@ export function Paris(props) { ) } -useGLTF.preload('./models/tour_paris_promenade-transformed.glb') +useGLTF.preload('./models/tracks/tour_paris_promenade-transformed.glb')