Add game source, converter pipeline, and web port

web/src/Arena.ts

@@ -0,0 +1,50 @@
+import * as THREE from 'three';
+
+export class Arena extends THREE.Group {
+  constructor() {
+    super();
+
+    const tileSize = 10;
+    const half = tileSize / 2;
+
+    for (let x = -45; x < 50; x += tileSize) {
+      for (let z = -45; z < 50; z += tileSize) {
+        const isDark = ((x / tileSize + z / tileSize) & 1) === 0;
+        const color = isDark ? 0x668866 : 0x557755;
+
+        const tileGeom = new THREE.BoxGeometry(9.5, 0.3, 9.5);
+        const tileMat = new THREE.MeshStandardMaterial({
+          color,
+          roughness: 0.7,
+          metalness: 0.0,
+        });
+
+        const tile = new THREE.Mesh(tileGeom, tileMat);
+        tile.position.set(x, -0.15, z);
+        tile.receiveShadow = true;
+        this.add(tile);
+      }
+    }
+
+    // Walls
+    const wallGeom = new THREE.BoxGeometry(tileSize - 0.5, 2, 1);
+    const wallMat = new THREE.MeshToonMaterial({ color: 0x776677 });
+
+    for (let coord = -50; coord <= 50; coord += tileSize) {
+      this.createWall(coord, 49.5, wallGeom, wallMat);
+      this.createWall(coord, -49.5, wallGeom, wallMat);
+    }
+    for (let coord = -50; coord <= 50; coord += tileSize) {
+      this.createWall(49.5, coord, new THREE.BoxGeometry(1, 2, tileSize - 0.5), wallMat);
+      this.createWall(-49.5, coord, new THREE.BoxGeometry(1, 2, tileSize - 0.5), wallMat);
+    }
+  }
+
+  private createWall(x: number, z: number, geom: THREE.BoxGeometry, mat: THREE.Material) {
+    const wall = new THREE.Mesh(geom, mat);
+    wall.position.set(x, 1, z);
+    wall.castShadow = true;
+    wall.receiveShadow = true;
+    this.add(wall);
+  }
+}