Cleanup game.ts and dynamic terrain initialization (#9)

* in progress

* update readme

* cleaned up game.ts

README.md

@@ -16,12 +16,14 @@ You can always try the latest build here: https://thomasburgess2000.github.io/bo
 ## TODO:
 - [ ] Make perimetric LOD
 - [ ] Create new map data when the camera moves outside the current map
-- [x] Fix tree spawning
-- [ ] Add trees to the dynamic terrain
-- [ ] Add walkable player
-- [x] Make larger map
-- [ ] Clean up dynamic terrain system (move params to component)
+- [ ] Fix tree spawning in the middle of tracks
+- [ ] make the trees generate/dispose as you move
+- [ ] Add walkable player using Havok physics
 - [ ] Dispose far away track
 - [ ] Add wheels to train
-- [ ] Be able to lower maxSubZ without terrain clipping through track (fix flattening falloff probably?)
-- [ ] Make fog work with dynamic terrain shader
+- [ ] Be able to lower maxSubZ without terrain clipping through track and trees at wrong height (aspirational)
+- [ ] Make fog work with dynamic terrain shader
+- [x] Clean up game.ts
+- [x] Make larger map
+- [x] Clean up dynamic terrain system (move params to component)
+- [x] Add trees to the dynamic terrain

index.ts

@@ -1,3 +1,3 @@
-import { startGame } from "./src/game";
+import { startGame } from './src/game';
 
-startGame();
+startGame();

package.json

@@ -11,6 +11,7 @@
   "dependencies": {
     "@babylonjs/core": "^6.31.0",
     "@babylonjs/gui": "^6.35.0",
+    "@babylonjs/havok": "^1.3.1",
     "@babylonjs/inspector": "^6.31.0",
     "@babylonjs/loaders": "^6.31.0",
     "alea": "^1.0.1",

src/components/dynamicTerrain.component.ts

@@ -5,5 +5,12 @@ import { InitializationStatus } from '../utils/types';
 export class DynamicTerrainComponent {
   public dynamicTerrain: DynamicTerrain | null = null;
   public initializationStatus: InitializationStatus = InitializationStatus.NotInitialized;
+  public mapSubX = 1000;
+  public mapSubZ = 1000;
+  public seed = 0.3;
+  public noiseScale = 0.005;
+  public elevationScale = 2;
+  public flatRadius = 20;
+  public noiseResolution = 1.0;
   constructor(public flatPoints: Vector3[] = []) {}
 }

src/components/map.component.ts

@@ -0,0 +1,12 @@
+import { DynamicTerrain } from '../externals/babylon.dynamicTerrain_modular';
+import { InitializationStatus } from '../utils/types';
+import { DynamicTerrainComponent } from './dynamicTerrain.component';
+import { TrackComponent } from './track.component';
+
+export class MapComponent {
+  public InitializationStatus = InitializationStatus.NotInitialized;
+  constructor(
+    public dynamicTerrain: DynamicTerrainComponent,
+    public trees = true,
+  ) {}
+}

src/components/track.component.ts

@@ -4,10 +4,9 @@ import { InitializationStatus } from '../utils/types';
 export class TrackComponent {
   public initializationStatus: InitializationStatus = InitializationStatus.NotInitialized;
   public rotations: Quaternion[] = [];
-  constructor(
-    public points: Vector3[],
-    public sections: Section[],
-  ) {}
+  public points: Vector3[] = [];
+  public sections: Section[] = [];
+  constructor(public trackDefinition: string[]) {}
 }
 
 export class Section {

src/components/tree.component.ts

@@ -1,6 +1,8 @@
+import { TransformNode } from '@babylonjs/core';
 import { InitializationStatus } from '../utils/types';
 
 export class TreeComponent {
+  public treeInstance: TransformNode | null = null;
   public initializationStatus: InitializationStatus = InitializationStatus.NotInitialized;
   constructor() {}
 }

src/externals/babylon.dynamicTerrain_modular.ts

@@ -1216,22 +1216,23 @@ export class DynamicTerrain {
     options?: { normal: Vector3 },
     inverted?: boolean,
   ): number {
-    const x0 = mapData[0];
-    const z0 = mapData[2];
+    let x0 = mapData[0];
+    let z0 = mapData[2];
 
-    // reset x and z in the map space so they are between 0 and the map size
+    // Reset x and z in the map space so they are between 0 and the map size
     x = x - Math.floor((x - x0) / mapSizeX) * mapSizeX;
     z = z - Math.floor((z - z0) / mapSizeZ) * mapSizeZ;
 
-    const col1 = Math.floor(((x - x0) * mapSubX) / mapSizeX);
-    const row1 = Math.floor(((z - z0) * mapSubZ) / mapSizeZ);
-    const col2 = (col1 + 1) % mapSubX;
-    const row2 = (row1 + 1) % mapSubZ;
-    // starting indexes of the positions of 4 vertices defining a quad on the map
-    const idx1 = 3 * (row1 * mapSubX + col1);
-    const idx2 = 3 * (row1 * mapSubX + col2);
-    const idx3 = 3 * (row2 * mapSubX + col1);
-    const idx4 = 3 * (row2 * mapSubX + col2);
+    let col1 = Math.floor(((x - x0) * mapSubX) / mapSizeX);
+    let row1 = Math.floor(((z - z0) * mapSubZ) / mapSizeZ);
+    let col2 = (col1 + 1) % mapSubX;
+    let row2 = (row1 + 1) % mapSubZ;
+
+    // Starting indexes of the positions of 4 vertices defining a quad on the map
+    let idx1 = 3 * (row1 * mapSubX + col1);
+    let idx2 = 3 * (row1 * mapSubX + col2);
+    let idx3 = 3 * (row2 * mapSubX + col1);
+    let idx4 = 3 * (row2 * mapSubX + col2);
 
     const v1 = DynamicTerrain._v1;
     const v2 = DynamicTerrain._v2;
@@ -1242,47 +1243,47 @@ export class DynamicTerrain {
     v3.copyFromFloats(mapData[idx3], mapData[idx3 + 1], mapData[idx3 + 2]);
     v4.copyFromFloats(mapData[idx4], mapData[idx4 + 1], mapData[idx4 + 2]);
 
-    const vAvB = DynamicTerrain._vAvB;
-    const vAvC = DynamicTerrain._vAvC;
-    const norm = DynamicTerrain._norm;
-    const vA = v1;
-    let vB;
-    let vC;
-    let v;
-
-    const xv4v1 = v4.x - v1.x;
-    const zv4v1 = v4.z - v1.z;
-    if (xv4v1 == 0 || zv4v1 == 0) {
-      return v1.y;
-    }
-    const cd = zv4v1 / xv4v1;
-    const h = v1.z - cd * v1.x;
-    if (z < cd * x + h) {
-      vB = v4;
-      vC = v2;
-      v = vA;
+    // Determine if the point is in the upper or lower triangle of the quad
+    let isInUpperTriangle = (z - v1.z) / (v3.z - v1.z) < (x - v1.x) / (v2.x - v1.x);
+
+    // Perform barycentric interpolation to find the height at the point (x, z)
+    let height;
+    if (isInUpperTriangle) {
+      height = DynamicTerrain._BarycentricInterpolation(x, z, v1, v2, v4);
     } else {
-      vB = v3;
-      vC = v4;
-      v = vB;
-    }
-    vB.subtractToRef(vA, vAvB);
-    vC.subtractToRef(vA, vAvC);
-    Vector3.CrossToRef(vAvB, vAvC, norm);
-    norm.normalize();
-    if (inverted) {
-      norm.scaleInPlace(-1.0);
+      height = DynamicTerrain._BarycentricInterpolation(x, z, v1, v3, v4);
     }
+
+    // If a normal is requested, compute it using the cross product of two edges of the triangle
     if (options && options.normal) {
-      options.normal.copyFrom(norm);
-    }
-    const d = -(norm.x * v.x + norm.y * v.y + norm.z * v.z);
-    let y = v.y;
-    if (norm.y != 0.0) {
-      y = -(norm.x * x + norm.z * z + d) / norm.y;
+      const edge1 = DynamicTerrain._vAvB;
+      const edge2 = DynamicTerrain._vAvC;
+      const normal = DynamicTerrain._norm;
+      if (isInUpperTriangle) {
+        v2.subtractToRef(v1, edge1);
+        v4.subtractToRef(v1, edge2);
+      } else {
+        v3.subtractToRef(v1, edge1);
+        v4.subtractToRef(v1, edge2);
+      }
+      Vector3.CrossToRef(edge1, edge2, normal);
+      normal.normalize();
+      if (inverted) {
+        normal.scaleInPlace(-1.0);
+      }
+      options.normal.copyFrom(normal);
     }
 
-    return y;
+    return height;
+  }
+
+  // Helper function for barycentric interpolation
+  private static _BarycentricInterpolation(x: number, z: number, v1: Vector3, v2: Vector3, v3: Vector3): number {
+    let det = (v2.z - v3.z) * (v1.x - v3.x) + (v3.x - v2.x) * (v1.z - v3.z);
+    let l1 = ((v2.z - v3.z) * (x - v3.x) + (v3.x - v2.x) * (z - v3.z)) / det;
+    let l2 = ((v3.z - v1.z) * (x - v3.x) + (v1.x - v3.x) * (z - v3.z)) / det;
+    let l3 = 1 - l1 - l2;
+    return l1 * v1.y + l2 * v2.y + l3 * v3.y;
   }
 
   /**