fix:(game) GAME IS FIXED, CAN CONTINUE DEV SAFELY
parent
83d7e6c16b
commit
be364fca25
|
@ -7,7 +7,7 @@ import { shaderMaterial } from '@react-three/drei'
|
|||
import { extend, useFrame } from '@react-three/fiber'
|
||||
import { Color, DoubleSide, AdditiveBlending } from 'three'
|
||||
|
||||
export default function FakeFlame({ falloff = 3, glowInternalRadius = 1.0, glowColor = 'orange', glowSharpness = 1.0 }) {
|
||||
export default function FakeFlame({ falloff = 10, glowInternalRadius = 1.0, glowColor = 'orange', glowSharpness = 1.0 , isBoosting,}) {
|
||||
const FakeFlame = useMemo(() => {
|
||||
return shaderMaterial(
|
||||
{
|
||||
|
@ -15,7 +15,8 @@ export default function FakeFlame({ falloff = 3, glowInternalRadius = 1.0, glowC
|
|||
glowInternalRadius: glowInternalRadius,
|
||||
glowColor: new Color(glowColor),
|
||||
glowSharpness: glowSharpness,
|
||||
time: 0
|
||||
time: 0,
|
||||
isBoosting: isBoosting,
|
||||
},
|
||||
/*GLSL */
|
||||
`
|
||||
|
@ -38,11 +39,11 @@ export default function FakeFlame({ falloff = 3, glowInternalRadius = 1.0, glowC
|
|||
float glitchStrength = sin(glitchTime) + sin(glitchTime * .05) + sin(glitchTime * .36);
|
||||
glitchStrength /= 2.0;
|
||||
glitchStrength = smoothstep(0.2, 0.8, glitchStrength);
|
||||
glitchStrength *= 0.25;
|
||||
glitchStrength *= 0.;
|
||||
modelPosition.x += (random2D(modelNormal.xx + time) - 0.5) * glitchStrength;
|
||||
modelPosition.x += (random2D(modelNormal.xx - time) - 0.2) * glitchStrength;
|
||||
modelPosition.y += sin(smoothstep(0.3, vUv.y - 1.8, position.y) * 2.) * sin(time * 2.);
|
||||
modelPosition.z += sin(smoothstep(0., vUv.x - 0.8, position.z) * 2.) * sin(time * 2.) * .6;
|
||||
modelPosition.y += sin(smoothstep(0.3, vUv.y - 1.8, position.y) * 2.) * sin(time * 24.);
|
||||
modelPosition.z += sin(smoothstep(0., vUv.x - 0.8, position.z) * 2.) * sin(time * 24.) * .6;
|
||||
|
||||
gl_Position = projectionMatrix * viewMatrix * modelPosition;
|
||||
|
||||
|
@ -55,6 +56,7 @@ export default function FakeFlame({ falloff = 3, glowInternalRadius = 1.0, glowC
|
|||
uniform float glowSharpness;
|
||||
uniform float glowInternalRadius;
|
||||
uniform float time;
|
||||
uniform bool isBoosting;
|
||||
|
||||
varying vec2 vUv;
|
||||
|
||||
|
@ -123,13 +125,18 @@ export default function FakeFlame({ falloff = 3, glowInternalRadius = 1.0, glowC
|
|||
col = 0.85*col.yxz;
|
||||
#endif
|
||||
|
||||
gl_FragColor = vec4( col, 1.0);
|
||||
|
||||
if (isBoosting) {
|
||||
gl_FragColor = vec4(col, 1.0);
|
||||
} else {
|
||||
gl_FragColor = vec4(col, 0.0);
|
||||
}
|
||||
|
||||
#include <tonemapping_fragment>
|
||||
#include <colorspace_fragment>
|
||||
}`
|
||||
)
|
||||
}, [falloff, glowInternalRadius, glowColor, glowSharpness])
|
||||
}, [falloff, glowInternalRadius, glowColor, glowSharpness, isBoosting])
|
||||
|
||||
extend({ FakeFlame })
|
||||
|
||||
|
|
|
@ -259,9 +259,9 @@ export const PlayerController = () => {
|
|||
onCollisionEnter={(event) => {
|
||||
isOnFloor.current = true
|
||||
}}
|
||||
onCollisionExit={(event) => {
|
||||
isOnFloor.current = false
|
||||
}}
|
||||
// onCollisionExit={(event) => {
|
||||
// isOnFloor.current = false
|
||||
// }}
|
||||
|
||||
/>
|
||||
|
||||
|
@ -275,6 +275,7 @@ export const PlayerController = () => {
|
|||
<Mario
|
||||
currentSpeed={currentSpeed}
|
||||
steeringAngleWheels={steeringAngleWheels}
|
||||
isBoosting={isBoosting}
|
||||
/>
|
||||
<pointLight
|
||||
position={[0.6, 0.05, 0.5]}
|
||||
|
|
|
@ -9,20 +9,26 @@ import { useFrame } from '@react-three/fiber'
|
|||
import FakeGlowMaterial from '../FakeGlow/FakeGlowMaterial'
|
||||
import FakeFlame from '../FakeFlame/FakeFlame'
|
||||
|
||||
export function Mario({ currentSpeed, steeringAngleWheels, ...props }) {
|
||||
export function Mario({ currentSpeed, steeringAngleWheels, isBoosting, ...props }) {
|
||||
const { nodes, materials } = useGLTF('./models/mariokarttest.glb')
|
||||
|
||||
const frontLeftWheel = useRef()
|
||||
const frontRightWheel = useRef()
|
||||
const rearWheels = useRef()
|
||||
const frontWheels = useRef()
|
||||
const [scale, setScale] = React.useState(0)
|
||||
|
||||
useFrame(() => {
|
||||
useFrame((_,delta) => {
|
||||
const rotation = currentSpeed / 100
|
||||
frontLeftWheel.current.rotation.x += rotation
|
||||
frontRightWheel.current.rotation.x += rotation
|
||||
rearWheels.current.rotation.x += rotation
|
||||
frontWheels.current.rotation.y = steeringAngleWheels
|
||||
if (isBoosting){
|
||||
setScale(Math.min(scale + 0.1 * 144 * delta, 1))
|
||||
} else {
|
||||
setScale(Math.max(scale - 0.1 * 144 * delta, 0))
|
||||
}
|
||||
})
|
||||
return (
|
||||
<group
|
||||
|
@ -72,26 +78,46 @@ export function Mario({ currentSpeed, steeringAngleWheels, ...props }) {
|
|||
/>
|
||||
<Sphere
|
||||
position={[0, 0.6, -1.2]}
|
||||
scale={1.2}
|
||||
scale={scale * 1.2}
|
||||
>
|
||||
<FakeGlowMaterial />
|
||||
</Sphere>
|
||||
|
||||
<Cylinder
|
||||
args={[0.1, 0.5, 1, 128, 64, true]}
|
||||
args={[0.1, 0, 1, 128, 64, true]}
|
||||
position={[0.3, 0.6, -1.2]}
|
||||
rotation={[Math.PI / 1.5, 0, 0]}
|
||||
scale={scale}
|
||||
|
||||
>
|
||||
<FakeFlame />
|
||||
<FakeFlame isBoosting={isBoosting}/>
|
||||
</Cylinder>
|
||||
|
||||
<Cylinder
|
||||
args={[0.1, 0.5, 1, 128, 64, true]}
|
||||
args={[0.1, 0, 1, 128, 64, true]}
|
||||
position={[-0.3, 0.6, -1.2]}
|
||||
rotation={[Math.PI / 1.5, 0, 0]}
|
||||
scale={scale}
|
||||
>
|
||||
<FakeFlame />
|
||||
<FakeFlame isBoosting={isBoosting} />
|
||||
</Cylinder>
|
||||
<Cylinder
|
||||
args={[0.09, 0, 1, 128, 64, true]}
|
||||
position={[0.18, 0.7, -0.8]}
|
||||
rotation={[Math.PI / 1.5, 0, 0]}
|
||||
scale={scale}
|
||||
>
|
||||
<FakeFlame isBoosting={isBoosting} />
|
||||
</Cylinder>
|
||||
<Cylinder
|
||||
args={[0.09, 0, 1, 128, 64, true]}
|
||||
position={[-0.18, 0.7, -0.8]}
|
||||
rotation={[Math.PI / 1.5, 0, 0]}
|
||||
scale={scale}
|
||||
>
|
||||
<FakeFlame isBoosting={isBoosting}/>
|
||||
</Cylinder>
|
||||
|
||||
</group>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -11,12 +11,13 @@ body {
|
|||
overflow-x: none;
|
||||
|
||||
}
|
||||
/*
|
||||
|
||||
body::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.wheel{
|
||||
display: none;
|
||||
position:absolute;
|
||||
top:0;
|
||||
|
||||
|
@ -28,6 +29,14 @@ img{
|
|||
|
||||
}
|
||||
|
||||
.overlay{
|
||||
position:absolute;
|
||||
top:0;
|
||||
left:0;
|
||||
width:100vw;
|
||||
height:100vh;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.logo{
|
||||
position:absolute;
|
||||
|
@ -50,4 +59,4 @@ img{
|
|||
50% {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
} */
|
||||
}
|
Loading…
Reference in New Issue