diff --git a/src/app/fear/page.tsx b/src/app/fear/page.tsx index fef768d..7429af6 100644 --- a/src/app/fear/page.tsx +++ b/src/app/fear/page.tsx @@ -28,7 +28,7 @@ function PostProcessing() { }, []); return ( - + + {/* */} diff --git a/src/app/fear/scene-components/finale-text.tsx b/src/app/fear/scene-components/finale-text.tsx index 9fc0220..85718ce 100644 --- a/src/app/fear/scene-components/finale-text.tsx +++ b/src/app/fear/scene-components/finale-text.tsx @@ -15,7 +15,6 @@ export default function FinaleText() { return () => unsubscribe(); }); - let elementCount = (FEAR_SETTINGS.EVENT_FINALE_TEXT_COUNT / FEAR_SETTINGS.EVENT_FINALE_DURATION) * progression; let testElements: Array = []; diff --git a/src/app/fear/scene-components/hallway.tsx b/src/app/fear/scene-components/hallway.tsx index 984b72e..c84aabb 100644 --- a/src/app/fear/scene-components/hallway.tsx +++ b/src/app/fear/scene-components/hallway.tsx @@ -5,6 +5,64 @@ import { useTexture, PositionalAudio } from "@react-three/drei"; import * as THREE from "three"; import { useFrame } from "@react-three/fiber"; +function ShaderPatch(shader: { vertexShader: string, fragmentShader: string, uniforms: Object }) { + shader.vertexShader = ` + varying float vDepth; + #ifdef USE_MAP + varying vec2 vAffineUv; + #endif + ${shader.vertexShader} + `; + + shader.vertexShader = shader.vertexShader.replace( + `#include `, + ` + vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 ); + gl_Position = projectionMatrix * mvPosition; + + float precisionModifier = 200.0; + gl_Position.xy /= gl_Position.w; + gl_Position.xy = floor(gl_Position.xy * precisionModifier) / precisionModifier; + gl_Position.xy *= gl_Position.w; + + vDepth = gl_Position.w; + + #ifdef USE_MAP + vAffineUv = vMapUv * gl_Position.w; + #endif + ` + ); + + shader.fragmentShader = ` + varying float vDepth; + #ifdef USE_MAP + varying vec2 vAffineUv; + #endif + ${shader.fragmentShader} + `; + + shader.fragmentShader = shader.fragmentShader.replace( + `#include `, + ` + #ifdef USE_MAP + vec2 flatAffineUV = vAffineUv / max(vDepth, 0.001); + + vec2 warpDiff = flatAffineUV - vMapUv; + float warpDist = length(warpDiff); + + float maxDistortion = 0.25; + + float falloff = maxDistortion / (maxDistortion + warpDist); + + vec2 finalUV = vMapUv + (warpDiff * falloff); + + vec4 texelColor = texture2D( map, finalUV ); + diffuseColor *= texelColor; + #endif + ` + ); +} + interface DoorProps { position: [number, number, number]; rotation: [number, number, number]; @@ -283,6 +341,7 @@ export default function Hallway() { emissive="#a8a1a1" emissiveIntensity={0.8} roughness={0.9} + onBeforeCompile={ShaderPatch} /> @@ -293,12 +352,11 @@ export default function Hallway() { rotation={[-Math.PI / 2, 0, 0]} position={[0, 0, -FEAR_SETTINGS.HALLWAY_LENGTH / 2]} > - + { if (el) floorMaterialsRef.current.push(el); }} map={floorTex} - roughness={0.8} - metalness={0.2} + onBeforeCompile={ShaderPatch} /> @@ -308,24 +366,22 @@ export default function Hallway() { rotation={[Math.PI / 2, 0, 0]} position={[0, FEAR_SETTINGS.HALLWAY_HEIGHT, -FEAR_SETTINGS.HALLWAY_LENGTH / 2]} > - + { if (el) floorMaterialsRef.current.push(el); }} map={floorTex} - roughness={0.8} - metalness={0.2} + onBeforeCompile={ShaderPatch} /> {/* left wall */} - + { if (el) wallMaterialsRef.current.push(el); }} map={wallTex} - roughness={0.7} - metalness={0.1} + onBeforeCompile={ShaderPatch} /> {!isRustActive && ( @@ -339,12 +395,11 @@ export default function Hallway() { {/* right wall */} - + { if (el) wallMaterialsRef.current.push(el); }} map={wallTex} - roughness={0.7} - metalness={0.1} + onBeforeCompile={ShaderPatch} /> {!isRustActive && ( @@ -366,6 +421,7 @@ export default function Hallway() { color="#a5aca8" roughness={0.0} metalness={0.4} + onBeforeCompile={ShaderPatch} /> ))} @@ -385,6 +441,7 @@ export default function Hallway() { color="#a5aca8" roughness={0.0} metalness={0.4} + onBeforeCompile={ShaderPatch} /> );