Initial NavMesh (this is so bad)

package.json

@@ -12,6 +12,7 @@
 	},
 	"dependencies": {
 		"@neutralinojs/lib": "^5.3.0",
+		"navmesh": "^2.3.1",
 		"phaser": "^3.80.1",
 		"phaser3-rex-plugins": "^1.80.6"
 	},

src/components/Board.ts

@@ -1,8 +1,15 @@
 import { GameScene } from "@/scenes/GameScene";
 
+export type GridPoint = {
+	gridX: number,
+	gridY: number
+};
+
 export class Board extends Phaser.GameObjects.Container {
 	public scene: GameScene;
 	public size: number;
+	public width: number;
+	public height: number;
 
 	private grid: Phaser.GameObjects.Grid;
 	private things: any[];
@@ -21,6 +28,9 @@ export class Board extends Phaser.GameObjects.Container {
 
 		// this.size = scene.H / (height + 2);
 		this.size = cellSize;
+		this.width = width;
+		this.height = height
+
 		this.grid = this.scene.add.grid(
 			0,
 			0,
@@ -44,6 +54,8 @@ export class Board extends Phaser.GameObjects.Container {
 	resize(width: number, height: number, cellSize: number) {
 		// this.size = this.scene.H / height;
 		this.size = cellSize;
+		this.width = width;
+		this.height = height
 
 		this.grid.destroy();
 		this.grid = this.scene.add.grid(
@@ -70,7 +82,7 @@ export class Board extends Phaser.GameObjects.Container {
 	}
 
 	// Return grid cell of the coordinates
-	coordToGrid(x: number, y: number) {
+	coordToGrid(x: number, y: number): GridPoint {
 		const gridX = Math.floor((x - this.x + this.grid.width / 2) / this.size);
 		const gridY = Math.floor((y - this.y + this.grid.height / 2) / this.size);
 		return { gridX, gridY };

src/scenes/GameScene.ts

@@ -1,5 +1,5 @@
 import { BaseScene } from "@/scenes/BaseScene";
-import { Board } from "@/components/Board";
+import { Board, GridPoint } from "@/components/Board";
 import { Employee } from "@/components/Employee";
 import { Customer } from "@/components/Customer";
 import { CustomerId } from "@/components/CustomerData";
@@ -20,13 +20,17 @@ import { TextEffect } from "@/components/TextEffect";
 import { BasicEffect } from "@/components/BasicEffect";
 import { Intermission, Mode } from "@/components/Intermission";
 
+import { NavMesh } from "navmesh";
+import { centerOnSubdividedCoord, GenerateNavMesh } from "@/utils/NavMeshHelper";
+
 enum GameState {
 	Cutscene,
 	Day,
 	Shopping,
 	Intermission,
 }
 
+
 export class GameScene extends BaseScene {
 	private background: Phaser.GameObjects.Image;
 	private board: Board;
@@ -45,6 +49,7 @@ export class GameScene extends BaseScene {
 	public activeItem: ItemButton;
 
 	public effects: Effect[];
+	private navmesh: NavMesh;
 
 	// Game stats
 	public state: GameState = GameState.Cutscene;
@@ -303,6 +308,8 @@ export class GameScene extends BaseScene {
 				}
 			}
 		}
+
+		this.navmesh = GenerateNavMesh(this.board, LevelData[id])
 	}
 
 	// Start a new day
@@ -569,7 +576,7 @@ export class GameScene extends BaseScene {
 			return;
 		}
 
-		let closestEmployee: any = null;
+		let closestEmployee: Employee = null as unknown as Employee;
 		let closestDistance = Infinity;
 
 		this.employees.forEach((employee) => {
@@ -595,6 +602,26 @@ export class GameScene extends BaseScene {
 
 			closestEmployee.setCustomer(customer);
 			closestEmployee.walkTo(x, y);
+
+			const [cx, cy] = centerOnSubdividedCoord(this.board, station, 7);
+			const posEmp = this.board.coordToGrid(closestEmployee.x, closestEmployee.y);
+			const posSta = this.board.coordToGrid(station.x, station.y);
+
+
+			const scale = ({gridX, gridY}: GridPoint) => {
+				return {x: gridX*7, y: gridY*7}
+			}
+
+			//this.navmesh.findPath({})
+
+			console.log(scale(posEmp))
+
+			const path = this.navmesh.findPath(scale(posEmp), scale(posSta));
+
+
+
+			console.log("path", path)
+
 			// Wait for employee.on("walkend")
 		}
 	}

src/utils/NavMeshHelper.ts

@@ -0,0 +1,92 @@
+import type { Board } from "@/components/Board";
+import { Level, BlockType } from "@/components/Levels";
+import { StationId } from "@/components/StationData";
+import type { Station } from "@/components/Station";
+import NavMesh, { buildPolysFromGridMap } from "navmesh";
+
+const subdivision = 7;
+
+const stationMask = [
+  [true,true,true,true,true,true,true],
+  [true,true,false,false,false,false,true],
+  [true,false,false,false,false,true,true],
+  [true,true,false,true,true,true,true],
+  [true,false,false,false,false,true,true],
+  [true,true,false,false,false,false,true],
+  [true,true,true,true,true,true,true], 
+];
+
+function stationToGrid(board: Board, station: Station) {
+  const {gridX, gridY} = board.coordToGrid(station.x, station.y);
+  return [gridX, gridY];
+}
+
+function Array2DFromGrid(board: Board, subdivision: number): boolean[][] {
+  console.log(board.height)
+  return new Array(board.width*subdivision).fill(true).map(() => new Array(board.height*subdivision).fill(true));
+}
+
+export function centerOnSubdividedCoord(board: Board, station: Station, subdivision: number) {
+  const [x, y] = stationToGrid(board, station);
+  const center = Math.floor(subdivision/2);
+  return [x+center, y+center];
+}
+
+const t = true;
+const f = false;
+
+function testNav() {
+
+  const mesh = [
+    [f, f, f, f, f],
+    [f, t, t, t, f],
+    [f, t, f, t, f],
+    [f, t, t, t, f],
+    [f, t, t, t, f],
+    [f, f, f, f, f],
+  ];
+
+  const polys = new NavMesh(buildPolysFromGridMap(mesh));
+  const path = polys.findPath(
+    {x: 1, y: 1},
+    {x: 3, y: 3}
+  )
+  console.log("new polys", )
+
+}
+
+export function GenerateNavMesh(board: Board, level: Level) {
+  testNav()
+  const nav = Array2DFromGrid(board, subdivision);
+
+  for (let y = 0; y < level.height; y++) {
+    for (let x = 0; x < level.width; x++) {
+      const block = level.grid[y][x];
+
+      switch (block) {
+        case BlockType.Wall:
+          for(let sx = 0; sx < stationMask.length; sx++) {
+            for(let sy = 0; sy < stationMask.length; sy++) {
+                nav[x*subdivision + sx][y*subdivision + sy] = false;
+            }
+          }
+          break;
+        case BlockType.HornAndNails:
+        case BlockType.ScalePolish:
+        case BlockType.GoldBath:
+          for(let sx = 0; sx < stationMask.length; sx++) {
+            for(let sy = 0; sy < stationMask.length; sy++) {
+              if(!stationMask[sx][sy]) {
+                nav[x*subdivision + sx][y*subdivision + sy] = false;
+              }
+            }
+          }
+        //case BlockType.CashRegister:
+          //this.addStation(x, y, StationId.CashRegister);
+          break;
+      }
+    }
+  }
+  console.log("nav", nav)
+  return new NavMesh(buildPolysFromGridMap(nav));
+}