Terrain (#7)

* Dynamic terrain getting started

* infinite dynamic terrain

* working without fog

* Cleaned up shader loading

* done

package.json

@@ -13,8 +13,10 @@
     "@babylonjs/gui": "^6.35.0",
     "@babylonjs/inspector": "^6.31.0",
     "@babylonjs/loaders": "^6.31.0",
+    "alea": "^1.0.1",
     "eslint": "^8.54.0",
     "prettier": "^3.1.0",
+    "simplex-noise": "^4.0.1",
     "tick-knock": "^4.2.0"
   }
 }

src/assets/shaders/terrain/terrainFragmentShader.glsl

@@ -0,0 +1,26 @@
+#ifdef GL_ES
+precision highp float;
+#endif
+varying float vHeight;
+uniform float lowestPoint;
+uniform float highestPoint;
+uniform float seaLevel;
+uniform float mountainLevel;
+varying vec2 vUV;
+uniform sampler2D noiseTexture;
+
+void main(void) {
+    vec3 color;
+    float noise = texture2D(noiseTexture, vUV).r;
+    if (vHeight <= seaLevel) {
+        float depthFactor = (vHeight - lowestPoint) / (seaLevel - lowestPoint);
+        color = mix(vec3(0.0, 0.0, 0.3), vec3(0.0, 0.0, 1.0), depthFactor);
+    } else if (vHeight <= mountainLevel) {
+        float noiseFactor = mix(0.4, 0.6, noise); 
+        color = vec3(0.0, noiseFactor, 0.0);
+        } else {
+        color = vec3(1.0, 1.0, 1.0);
+    }
+
+    gl_FragColor = vec4(color, 1.0);
+}

src/assets/shaders/terrain/terrainVertexShader.glsl

@@ -0,0 +1,15 @@
+precision highp float;
+
+attribute vec3 position;
+attribute vec2 uv;
+
+uniform mat4 worldViewProjection;
+
+varying float vHeight;
+varying vec2 vUV;
+
+void main() {
+    vHeight = position.y;
+    vUV = uv;
+    gl_Position = worldViewProjection * vec4(position, 1.0);
+}

src/assets/shaders/tree/treeFragmentShader.glsl

@@ -0,0 +1,48 @@
+precision highp float;
+
+// Varying variables for lighting calculations
+varying vec2 vUV;
+varying vec3 vPositionW;
+varying vec3 vNormalW;
+
+// Uniforms
+uniform sampler2D textureSampler;
+uniform vec3 u_color;
+uniform vec3 vLightPosition; // Add a light position uniform
+
+void main(void) {
+    // Toon shader thresholds and brightness levels
+    float ToonThresholds[4];
+    ToonThresholds[0] = 0.95;
+    ToonThresholds[1] = 0.5;
+    ToonThresholds[2] = 0.2;
+    ToonThresholds[3] = 0.03;
+
+    float ToonBrightnessLevels[5];
+    ToonBrightnessLevels[0] = 1.0;
+    ToonBrightnessLevels[1] = 0.8;
+    ToonBrightnessLevels[2] = 0.6;
+    ToonBrightnessLevels[3] = 0.35;
+    ToonBrightnessLevels[4] = 0.2;
+
+    // Light calculation
+    vec3 lightVectorW = normalize(vPositionW - vLightPosition);
+    float ndl = max(0., dot(vNormalW, lightVectorW));
+
+    // Apply toon shading
+    vec3 color = texture2D(textureSampler, vUV).rgb;
+    for (int i = 0; i < 4; i++) {
+        if (ndl > ToonThresholds[i]) {
+            color *= ToonBrightnessLevels[i];
+            break;
+        }
+    }
+
+    // Original luminance and transparency logic
+    float luminance = dot(color, vec3(0.299, 0.587, 0.114));
+    if (luminance < 0.75) {
+        discard;
+    }
+
+    gl_FragColor = vec4(u_color * color, luminance);
+  }

src/assets/shaders/tree/treeVertexShader.glsl

@@ -0,0 +1,50 @@
+attribute vec3 position;
+attribute vec2 uv;
+attribute vec3 normal;
+
+#include<instancesDeclaration>
+uniform mat4 view;
+uniform float u_effectBlend;
+uniform float u_remap;
+uniform float u_normalize;
+uniform mat4 projection;
+
+varying vec2 vUV;
+varying vec3 vPositionW;
+varying vec3 vNormalW;
+
+float inverseLerp(float v, float minValue, float maxValue) {
+    return (v - minValue) / (maxValue - minValue);
+}
+
+float remap(float v, float inMin, float inMax, float outMin, float outMax) {
+    float t = inverseLerp(v, inMin, inMax);
+    return mix(outMin, outMax, t);
+}
+
+void main() {
+    #include<instancesVertex>
+    vec2 vertexOffset = vec2(
+    remap(uv.x, 0.0, 1.0, -u_remap, 1.0),
+    remap(uv.y, 0.0, 1.0, -u_remap, 1.0)
+    );
+
+    vertexOffset *= vec2(-1.0, 1.0);
+
+    if (u_remap == 1.0) {
+    vertexOffset = mix(vertexOffset, normalize(vertexOffset), u_normalize);
+    }
+
+    vec4 worldPosition = finalWorld * vec4(position, 1.0);
+    vPositionW = worldPosition.xyz;
+
+    vNormalW = normalize(vec3(finalWorld * vec4(normal, 0.0)));
+
+    vec4 worldViewPosition = view * finalWorld * vec4(position, 1.0);
+
+    worldViewPosition += vec4(mix(vec3(0.0), vec3(vertexOffset, 1.0), u_effectBlend), 0.0);
+
+    vUV = uv;
+
+    gl_Position = projection * worldViewPosition;
+}

src/components/dynamicTerrain.component.ts

@@ -0,0 +1,9 @@
+import { Vector3 } from '@babylonjs/core';
+import { DynamicTerrain } from '../externals/babylon.dynamicTerrain_modular';
+import { InitializationStatus } from '../utils/types';
+
+export class DynamicTerrainComponent {
+  public dynamicTerrain: DynamicTerrain | null = null;
+  public initializationStatus: InitializationStatus = InitializationStatus.NotInitialized;
+  constructor(public flatPoints: Vector3[] = []) {}
+}

src/components/locomotive/locomotive.component.ts

@@ -5,11 +5,11 @@ export class LocomotiveComponent {
   public initializationStatus: InitializationStatus = InitializationStatus.NotInitialized;
   public mesh: Nullable<Mesh> = null;
   public positionOnTrack: number = 0;
-  public speed: number = 0;
+  public speed: number = 26.8224;
   public acceleration: number = 5;
   public deceleration: number = 10;
   public maxSpeed: number = 26.8224;
-  public width: number = 16.891
+  public width: number = 16.891;
   public depth: number = 3.2258;
   public height: number = 3.048;
   constructor() {}

src/components/tree.component.ts

@@ -2,5 +2,6 @@ import { InitializationStatus } from '../utils/types';
 
 export class TreeComponent {
   public initializationStatus: InitializationStatus = InitializationStatus.NotInitialized;
+  public masterTreeInitializationStatus: InitializationStatus = InitializationStatus.NotInitialized;
   constructor() {}
 }