ok

src/config/gameConfig.js

@@ -164,23 +164,50 @@ export const GRID_CELL_SIZE = 2;
 // from edges to keep tower placement meaningful across the board.
 const HALF = GROUND_SIZE / 2;
 const PATH_MARGIN = 4 * GRID_CELL_SIZE; // 4 squares (8 units)
+// Legacy single path kept for backward-compat. Now we support branching paths.
+// Center lane mirrors the middle branch of PATHS below.
+const SPLIT_Z = HALF - 12; // branch a bit further from edge (12u)
+const REJOIN_Z = -HALF + 12; // rejoin a bit further from edge (12u)
+const LANE_OFFSET_X = 20; // slightly narrower than before
+
 export const PATH_POINTS = [
-  // Start at top edge (slightly left of center)
-  new THREE.Vector3(-6 * GRID_CELL_SIZE, 0, HALF), // (-12, 36)
-  // Move inside from top edge
-  new THREE.Vector3(-6 * GRID_CELL_SIZE, 0, HALF - PATH_MARGIN), // (-12, 28)
-  // Horizontal to right (top band), reduced width
-  new THREE.Vector3(8 * GRID_CELL_SIZE, 0, HALF - PATH_MARGIN), // (16, 28)
-  // Down to upper-middle (tighter vertical spacing)
-  new THREE.Vector3(8 * GRID_CELL_SIZE, 0, 4 * GRID_CELL_SIZE), // (16, 8)
-  // Back left (first U-turn), reduced width
-  new THREE.Vector3(-5 * GRID_CELL_SIZE, 0, 4 * GRID_CELL_SIZE), // (-10, 8)
-  // Down to lower-middle (tighter)
-  new THREE.Vector3(-5 * GRID_CELL_SIZE, 0, -5 * GRID_CELL_SIZE), // (-10, -10)
-  // Across right (second U-turn), reduced width
-  new THREE.Vector3(7 * GRID_CELL_SIZE, 0, -5 * GRID_CELL_SIZE), // (14, -10)
-  // Exit on bottom edge
-  new THREE.Vector3(7 * GRID_CELL_SIZE, 0, -HALF), // (14, -36)
+  // Entry straight down the middle
+  new THREE.Vector3(0, 0, HALF), // (0, 36)
+  new THREE.Vector3(0, 0, SPLIT_Z),
+  // Middle lane continues straight through the split area
+  new THREE.Vector3(0, 0, REJOIN_Z),
+  // Exit to bottom edge
+  new THREE.Vector3(0, 0, -HALF), // (0, -36)
+];
+
+// New 3-lane path layout: long split zone and wide lateral separation.
+// Enemies will be assigned one of these at spawn.
+export const PATHS = [
+  // Left lane: go left at split, travel down, then rejoin center
+  [
+    new THREE.Vector3(0, 0, HALF), // start top center
+    new THREE.Vector3(0, 0, SPLIT_Z), // approach split
+    new THREE.Vector3(-LANE_OFFSET_X, 0, SPLIT_Z), // branch left
+    new THREE.Vector3(-LANE_OFFSET_X, 0, REJOIN_Z), // long split zone
+    new THREE.Vector3(0, 0, REJOIN_Z), // rejoin center
+    new THREE.Vector3(0, 0, -HALF), // exit bottom center
+  ],
+  // Middle lane: continue straight through the split
+  [
+    new THREE.Vector3(0, 0, HALF),
+    new THREE.Vector3(0, 0, SPLIT_Z),
+    new THREE.Vector3(0, 0, REJOIN_Z),
+    new THREE.Vector3(0, 0, -HALF),
+  ],
+  // Right lane: go right at split, travel down, then rejoin center
+  [
+    new THREE.Vector3(0, 0, HALF),
+    new THREE.Vector3(0, 0, SPLIT_Z),
+    new THREE.Vector3(LANE_OFFSET_X, 0, SPLIT_Z), // branch right
+    new THREE.Vector3(LANE_OFFSET_X, 0, REJOIN_Z), // long split zone
+    new THREE.Vector3(0, 0, REJOIN_Z), // rejoin center
+    new THREE.Vector3(0, 0, -HALF),
+  ],
 ];
 
 // Visual settings

src/main.js

@@ -8,6 +8,7 @@ import { Tower } from "./entities/Tower.js";
 import {
   TOWER_TYPES,
   PATH_POINTS,
+  PATHS,
   PROJECTILE_SPEED,
   GRID_CELL_SIZE,
 } from "./config/gameConfig.js";
@@ -244,11 +245,17 @@ function resetGame() {
 }
 
 function spawnEnemy(wave) {
+  // Choose a random path if branching paths are defined; otherwise use legacy PATH_POINTS
+  let path = PATH_POINTS;
+  if (Array.isArray(PATHS) && PATHS.length > 0) {
+    const idx = Math.floor(Math.random() * PATHS.length);
+    path = PATHS[idx];
+  }
   const enemy = new Enemy(
     wave.hp,
     wave.speed,
     wave.reward,
-    PATH_POINTS,
+    path,
     sceneSetup.scene
   );
   gameState.addEnemy(enemy);

src/scene/PathBuilder.js

@@ -1,6 +1,7 @@
 import * as THREE from "three";
 import {
   PATH_POINTS,
+  PATHS,
   ROAD_HALF_WIDTH,
   GRID_CELL_SIZE,
 } from "../config/gameConfig.js";
@@ -8,15 +9,18 @@ import {
 export class PathBuilder {
   constructor(scene) {
     this.scene = scene;
-    // Clone and snap path points to the grid to ensure alignment
-    this.pathPoints = PATH_POINTS.map((p) => {
-      const snapped = p.clone
-        ? p.clone()
-        : new THREE.Vector3(p.x, p.y ?? 0, p.z);
-      snapped.x = Math.round(snapped.x / GRID_CELL_SIZE) * GRID_CELL_SIZE;
-      snapped.z = Math.round(snapped.z / GRID_CELL_SIZE) * GRID_CELL_SIZE;
-      return snapped;
-    });
+    // Prepare one or many paths, snapping points to grid
+    const snap = (v) => {
+      const out = v.clone ? v.clone() : new THREE.Vector3(v.x, v.y ?? 0, v.z);
+      out.x = Math.round(out.x / GRID_CELL_SIZE) * GRID_CELL_SIZE;
+      out.z = Math.round(out.z / GRID_CELL_SIZE) * GRID_CELL_SIZE;
+      out.y = 0;
+      return out;
+    };
+    const hasBranches = Array.isArray(PATHS) && PATHS.length > 0;
+    this.paths = hasBranches
+      ? PATHS.map((path) => path.map(snap))
+      : [PATH_POINTS.map(snap)];
     this.roadMeshes = [];
 
     // Materials
@@ -28,44 +32,68 @@ export class PathBuilder {
   }
 
   buildPath() {
-    // Visualize path line
-    this.createPathLine();
+    // Visualize path lines
+    this.createPathLines();
 
-    // Build straight road segments only (no bevels or rounded corners)
-    for (let i = 0; i < this.pathPoints.length - 1; i++) {
-      this.addSegment(this.pathPoints[i], this.pathPoints[i + 1]);
-    }
+    // Deduplicate segments across paths
+    const segKey = (a, b) => {
+      // direction-agnostic key
+      const ax = a.x.toFixed(4);
+      const az = a.z.toFixed(4);
+      const bx = b.x.toFixed(4);
+      const bz = b.z.toFixed(4);
+      return ax < bx || (ax === bx && az <= bz)
+        ? `${ax},${az}|${bx},${bz}`
+        : `${bx},${bz}|${ax},${az}`;
+    };
 
-    // Add square fill tiles at right-angle corners for perfect joins
-    for (let i = 1; i < this.pathPoints.length - 1; i++) {
-      const prev = this.pathPoints[i - 1];
-      const cur = this.pathPoints[i];
-      const next = this.pathPoints[i + 1];
+    const seenSegs = new Set();
+    for (const pts of this.paths) {
+      for (let i = 0; i < pts.length - 1; i++) {
+        const a = pts[i];
+        const b = pts[i + 1];
+        const key = segKey(a, b);
+        if (!seenSegs.has(key)) {
+          seenSegs.add(key);
+          this.addSegment(a, b);
+        }
+      }
+    }
 
-      const v1 = new THREE.Vector3().subVectors(cur, prev);
-      const v2 = new THREE.Vector3().subVectors(next, cur);
-      // Consider only x/z for pathing (top-down)
-      v1.y = 0;
-      v2.y = 0;
+    // Corner tiles at turns; deduplicate by center
+    const seenCorners = new Set();
+    for (const pts of this.paths) {
+      for (let i = 1; i < pts.length - 1; i++) {
+        const prev = pts[i - 1];
+        const cur = pts[i];
+        const next = pts[i + 1];
 
-      // Normalize direction to axis-aligned unit vectors when possible
-      const isV1H = Math.abs(v1.x) > Math.abs(v1.z);
-      const isV2H = Math.abs(v2.x) > Math.abs(v2.z);
-      const isTurn = (isV1H && !isV2H) || (!isV1H && isV2H);
-      if (isTurn) {
-        this.addCornerTile(cur);
+        const v1 = new THREE.Vector3().subVectors(cur, prev);
+        const v2 = new THREE.Vector3().subVectors(next, cur);
+        v1.y = 0;
+        v2.y = 0;
+        const isV1H = Math.abs(v1.x) > Math.abs(v1.z);
+        const isV2H = Math.abs(v2.x) > Math.abs(v2.z);
+        const isTurn = (isV1H && !isV2H) || (!isV1H && isV2H);
+        if (isTurn) {
+          const key = `${cur.x.toFixed(4)},${cur.z.toFixed(4)}`;
+          if (!seenCorners.has(key)) {
+            seenCorners.add(key);
+            this.addCornerTile(cur);
+          }
+        }
       }
     }
   }
 
-  createPathLine() {
+  createPathLines() {
     const pathLineMat = new THREE.LineBasicMaterial({ color: 0xffff00 });
-    const pathLineGeo = new THREE.BufferGeometry().setFromPoints(
-      this.pathPoints
-    );
-    const pathLine = new THREE.Line(pathLineGeo, pathLineMat);
-    pathLine.position.y = 0.01;
-    this.scene.add(pathLine);
+    for (const pts of this.paths) {
+      const pathLineGeo = new THREE.BufferGeometry().setFromPoints(pts);
+      const pathLine = new THREE.Line(pathLineGeo, pathLineMat);
+      pathLine.position.y = 0.01;
+      this.scene.add(pathLine);
+    }
   }
 
   addSegment(a, b) {

src/utils/utils.js

@@ -1,5 +1,5 @@
 import * as THREE from "three";
-import { PATH_POINTS, GRID_CELL_SIZE } from "../config/gameConfig.js";
+import { PATH_POINTS, PATHS, GRID_CELL_SIZE } from "../config/gameConfig.js";
 
 // Snap value to grid (to nearest grid line)
 export function snapToGrid(value, size = GRID_CELL_SIZE) {
@@ -22,6 +22,18 @@ export function cellToWorldCenter(col, row, size = GRID_CELL_SIZE) {
 // Check if point is on road
 export function isOnRoad(p, pathPoints = PATH_POINTS) {
   const halfWidth = 1.6;
+  // If branching paths are defined, check against all of them
+  if (Array.isArray(PATHS) && PATHS.length > 0) {
+    for (const pts of PATHS) {
+      for (let i = 0; i < pts.length - 1; i++) {
+        if (pointSegmentDistance2D(p, pts[i], pts[i + 1]) <= halfWidth) {
+          return true;
+        }
+      }
+    }
+    return false;
+  }
+  // Fallback to single path
   for (let i = 0; i < pathPoints.length - 1; i++) {
     const a = pathPoints[i];
     const b = pathPoints[i + 1];