Ir 2564 fix fog (#10394)

* fix main error * fix shaders * forgot fog shaders * remove console logs --------- Co-authored-by: David Gordon <[email protected]> Co-authored-by: David Gordon <[email protected]>
EtherealEngine · Jun 15, 2024 · 305d40a · 305d40a
1 parent 9c38340
commit 305d40a
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 14 deletions.
diff --git a/packages/spatial/src/renderer/FogSystem.tsx b/packages/spatial/src/renderer/FogSystem.tsx
@@ -79,7 +79,7 @@ function FogGroupReactor(props: { fogEntity: Entity }) {
   useEffect(() => {
     const customShader = fogComponent.type.value === FogType.Brownian || fogComponent.type.value === FogType.Height
     if (customShader) {
-      const objs = [...group]
+      const objs = [...group.value]
       for (const obj of objs) addFogShaderPlugin(obj as any)
       return () => {
         for (const obj of objs) removeFogShaderPlugin(obj as any)

diff --git a/packages/spatial/src/renderer/components/FogSettingsComponent.ts b/packages/spatial/src/renderer/components/FogSettingsComponent.ts
@@ -37,6 +37,7 @@ import { useEntityContext } from '@etherealengine/ecs/src/EntityFunctions'
 import { FogComponent } from '@etherealengine/spatial/src/renderer/components/SceneComponents'
 
 import { FogShaders } from '../FogSystem'
+import { initBrownianMotionFogShader, initHeightFogShader, removeFogShader } from './FogShaders'
 
 export enum FogType {
   Disabled = 'disabled',
@@ -95,22 +96,27 @@ export const FogSettingsComponent = defineComponent({
       switch (fogData.type) {
         case FogType.Linear:
           setComponent(entity, FogComponent, new Fog(fogData.color, fogData.near, fogData.far))
+          removeFogShader()
           break
 
         case FogType.Exponential:
           setComponent(entity, FogComponent, new FogExp2(fogData.color, fogData.density))
+          removeFogShader()
           break
 
         case FogType.Brownian:
           setComponent(entity, FogComponent, new FogExp2(fogData.color, fogData.density))
+          initBrownianMotionFogShader()
           break
 
         case FogType.Height:
           setComponent(entity, FogComponent, new FogExp2(fogData.color, fogData.density))
+          initHeightFogShader()
           break
 
         default:
           removeComponent(entity, FogComponent)
+          removeFogShader()
           break
       }
     }, [fog.type])
@@ -138,15 +144,15 @@ export const FogSettingsComponent = defineComponent({
       const fogComponent = getOptionalComponent(entity, FogComponent)
       if (fogComponent && (fog.type.value === FogType.Brownian || fog.type.value === FogType.Height))
         for (const s of FogShaders) s.uniforms.heightFactor.value = fog.height.value
-    }, [fog.timeScale])
+    }, [fog.height])
 
     useEffect(() => {
       const fogComponent = getOptionalComponent(entity, FogComponent)
       if (fogComponent && fog.type.value === FogType.Brownian)
         for (const s of FogShaders) {
           s.uniforms.fogTimeScale.value = fog.timeScale.value
         }
-    }, [fog.height])
+    }, [fog.timeScale])
 
     return null
   }

diff --git a/.../engine/src/scene/functions/FogShaders.ts → ...ial/src/renderer/components/FogShaders.ts b/.../engine/src/scene/functions/FogShaders.ts → ...ial/src/renderer/components/FogShaders.ts
@@ -103,10 +103,10 @@ const FogShaders = {
     default: ShaderChunk.fog_fragment,
     brownianMotionFog: `#ifdef USE_FOG
         vec3 fogOrigin = cameraPosition;
-        vec3 fogDirection = normalize(vWorldPosition - fogOrigin);
-        float fogDepth = distance(vWorldPosition, fogOrigin);
+        vec3 fogDirection = normalize(fogWorldPosition - fogOrigin);
+        float fogDepth = myDistance(fogWorldPosition, fogOrigin);
         // f(p) = fbm( p + fbm( p ) )
-        vec3 noiseSampleCoord = vWorldPosition * 0.00025 + vec3(
+        vec3 noiseSampleCoord = fogWorldPosition * 0.00025 + vec3(
             0.0, 0.0, fogTime * fogTimeScale * 0.025);
         float noiseSample = FBM(noiseSampleCoord + FBM(noiseSampleCoord)) * 0.5 + 0.5;
         fogDepth *= mix(noiseSample, 1.0, saturate((fogDepth - 5000.0) / 5000.0));
@@ -119,8 +119,8 @@ const FogShaders = {
     heightFog: `
       #ifdef USE_FOG
         vec3 fogOrigin = cameraPosition;
-        vec3 fogDirection = normalize(vWorldPosition - fogOrigin);
-        float fogDepth = distance(vWorldPosition, fogOrigin);
+        vec3 fogDirection = normalize(fogWorldPosition - fogOrigin);
+        float fogDepth = myDistance(fogWorldPosition, fogOrigin);
 
         float fogFactor = heightFactor * exp(-fogOrigin.y * fogDensity) * (
             1.0 - exp(-fogDepth * fogDirection.y * fogDensity)) / fogDirection.y;
@@ -133,11 +133,14 @@ const FogShaders = {
     brownianMotionFog:
       _NOISE_GLSL +
       `
+      float myDistance(vec3 a, vec3 b) {
+        return length(a - b);
+      } 
       #ifdef USE_FOG
         uniform float fogTime;
         uniform float fogTimeScale;
         uniform vec3 fogColor;
-        varying vec3 vWorldPosition;
+        varying vec3 fogWorldPosition;
         #ifdef FOG_EXP2
           uniform float fogDensity;
           uniform float heightFactor;
@@ -147,9 +150,12 @@ const FogShaders = {
         #endif
       #endif`,
     heightFog: `
+      float myDistance(vec3 a, vec3 b) {
+        return length(a - b);
+      }
       #ifdef USE_FOG
         uniform vec3 fogColor;
-        varying vec3 vWorldPosition;
+        varying vec3 fogWorldPosition;
         #ifdef FOG_EXP2
           uniform float fogDensity;
           uniform float heightFactor;
@@ -163,22 +169,22 @@ const FogShaders = {
     default: ShaderChunk.fog_vertex,
     brownianMotionFog: `
       #ifdef USE_FOG
-        vWorldPosition = (modelMatrix * vec4(position, 1.0)).xyz; // From local position to global position
+        fogWorldPosition = (modelMatrix * vec4(position, 1.0)).xyz; // From local position to global position
       #endif`,
     heightFog: `
       #ifdef USE_FOG
-        vWorldPosition = (modelMatrix * vec4(position, 1.0)).xyz; // From local position to global position
+        fogWorldPosition = (modelMatrix * vec4(position, 1.0)).xyz; // From local position to global position
       #endif`
   },
   fog_pars_vertex: {
     default: ShaderChunk.fog_pars_vertex,
     brownianMotionFog: `
       #ifdef USE_FOG
-        varying vec3 vWorldPosition;
+        varying vec3 fogWorldPosition;
       #endif`,
     heightFog: `
       #ifdef USE_FOG
-        varying vec3 vWorldPosition;
+        varying vec3 fogWorldPosition;
       #endif`
   }
 }