@agent-os-lab/agent-game-sdk 0.1.1

package/src/office/renderers/three/scene.ts

@@ -0,0 +1,790 @@
+import * as THREE from "three";
+import { mergeGeometries } from "three/examples/jsm/utils/BufferGeometryUtils.js";
+
+export const OFFICE_LAYOUT_SCALE = 1.2;
+const OFFICE_FLOOR_CENTER_X = 16;
+const OFFICE_FLOOR_WIDTH = 68 * OFFICE_LAYOUT_SCALE;
+const OFFICE_FLOOR_DEPTH = 24 * OFFICE_LAYOUT_SCALE;
+const OFFICE_FLOOR_TILE_SIZE = 3;
+
+export function scaleOfficeX(x: number): number {
+  return OFFICE_FLOOR_CENTER_X + (x - OFFICE_FLOOR_CENTER_X) * OFFICE_LAYOUT_SCALE;
+}
+
+export function scaleOfficeZ(z: number): number {
+  return z * OFFICE_LAYOUT_SCALE;
+}
+
+const DESK_TEMPLATE = [
+  { seat: { x: scaleOfficeX(-12), z: scaleOfficeZ(-6.2) }, rotation: Math.PI, desk: { x: scaleOfficeX(-12), z: scaleOfficeZ(-8) } },
+  { seat: { x: scaleOfficeX(-7), z: scaleOfficeZ(-6.2) }, rotation: Math.PI, desk: { x: scaleOfficeX(-7), z: scaleOfficeZ(-8) } },
+  { seat: { x: scaleOfficeX(-2), z: scaleOfficeZ(-6.2) }, rotation: Math.PI, desk: { x: scaleOfficeX(-2), z: scaleOfficeZ(-8) } },
+  { seat: { x: scaleOfficeX(-12), z: scaleOfficeZ(-1.2) }, rotation: Math.PI, desk: { x: scaleOfficeX(-12), z: scaleOfficeZ(-3) } },
+  { seat: { x: scaleOfficeX(-7), z: scaleOfficeZ(-1.2) }, rotation: Math.PI, desk: { x: scaleOfficeX(-7), z: scaleOfficeZ(-3) } },
+  { seat: { x: scaleOfficeX(-2), z: scaleOfficeZ(-1.2) }, rotation: Math.PI, desk: { x: scaleOfficeX(-2), z: scaleOfficeZ(-3) } },
+  { seat: { x: scaleOfficeX(-12), z: scaleOfficeZ(3.8) }, rotation: Math.PI, desk: { x: scaleOfficeX(-12), z: scaleOfficeZ(2) } },
+  { seat: { x: scaleOfficeX(-7), z: scaleOfficeZ(3.8) }, rotation: Math.PI, desk: { x: scaleOfficeX(-7), z: scaleOfficeZ(2) } },
+  { seat: { x: scaleOfficeX(-2), z: scaleOfficeZ(3.8) }, rotation: Math.PI, desk: { x: scaleOfficeX(-2), z: scaleOfficeZ(2) } },
+] as const;
+export const DESK_SEATS = DESK_TEMPLATE.map((slot) => slot.seat) as ReadonlyArray<{ x: number; z: number }>;
+export const MEETING_ROOMS = [
+  {
+    center: { x: scaleOfficeX(16.5), z: scaleOfficeZ(3.6) },
+    seats: [
+      { x: scaleOfficeX(13.7), z: scaleOfficeZ(1.4), rotation: Math.PI / 2 },
+      { x: scaleOfficeX(13.7), z: scaleOfficeZ(2.8), rotation: Math.PI / 2 },
+      { x: scaleOfficeX(13.7), z: scaleOfficeZ(4.4), rotation: Math.PI / 2 },
+      { x: scaleOfficeX(13.7), z: scaleOfficeZ(5.8), rotation: Math.PI / 2 },
+      { x: scaleOfficeX(19.3), z: scaleOfficeZ(1.4), rotation: -Math.PI / 2 },
+      { x: scaleOfficeX(19.3), z: scaleOfficeZ(2.8), rotation: -Math.PI / 2 },
+      { x: scaleOfficeX(19.3), z: scaleOfficeZ(4.4), rotation: -Math.PI / 2 },
+      { x: scaleOfficeX(19.3), z: scaleOfficeZ(5.8), rotation: -Math.PI / 2 },
+    ],
+    signColor: 0x3498db,
+    topColor: 0xb8860b,
+    legColor: 0x8b6914,
+    tableDepth: 6.4,
+  },
+  {
+    center: { x: scaleOfficeX(16.5), z: scaleOfficeZ(-7.25) },
+    seats: [
+      { x: scaleOfficeX(13.7), z: scaleOfficeZ(-8.25), rotation: Math.PI / 2 },
+      { x: scaleOfficeX(13.7), z: scaleOfficeZ(-6.25), rotation: Math.PI / 2 },
+      { x: scaleOfficeX(19.3), z: scaleOfficeZ(-8.25), rotation: -Math.PI / 2 },
+      { x: scaleOfficeX(19.3), z: scaleOfficeZ(-6.25), rotation: -Math.PI / 2 },
+    ],
+    signColor: 0xe67e22,
+    topColor: 0xa0522d,
+    legColor: 0x8b4513,
+    tableDepth: 3,
+  },
+] as const;
+export const MEETING_SEATS = MEETING_ROOMS.flatMap((room) => [...room.seats]) as ReadonlyArray<{
+  x: number;
+  z: number;
+  rotation: number;
+}>;
+export const LARGE_MEETING_X = (scaleOfficeX(24) + (OFFICE_FLOOR_CENTER_X + OFFICE_FLOOR_WIDTH / 2)) / 2;
+export const LARGE_MEETING_Z = 0;
+const LARGE_MEETING_CHAIRS_PER_SIDE = 8;
+const LARGE_MEETING_CHAIR_SPACING_X = 1.55 * OFFICE_LAYOUT_SCALE;
+const LARGE_MEETING_CHAIR_DISTANCE_Z = 2.55 * OFFICE_LAYOUT_SCALE;
+export const LOUNGE_CENTER = { x: scaleOfficeX(4.8), z: scaleOfficeZ(8.2) } as const;
+const matrixHelper = new THREE.Object3D();
+
+export function resolveLargeMeetingChairRotation(side: -1 | 1): number {
+  return side === -1 ? 0 : Math.PI;
+}
+
+export function resolveLargeMeetingChairZ(side: -1 | 1): number {
+  return LARGE_MEETING_Z + side * LARGE_MEETING_CHAIR_DISTANCE_Z;
+}
+
+export type OfficeFurniturePlan = {
+  desks: number;
+  deskChairs: number;
+  deskChairBases: number;
+  deskChairCasters: number;
+  monitors: number;
+  meetingTables: number;
+  meetingTableLegs: number;
+  meetingChairs: number;
+  meetingChairBases: number;
+  meetingChairCasters: number;
+  presentationBoards: number;
+  whiteboards: number;
+  noteBoards: number;
+  stickyNotes: number;
+  wallClocks: number;
+  mobileDisplays: number;
+  tableCups: number;
+  waterDispensers: number;
+  teaBars: number;
+  sofas: number;
+  coffeeTables: number;
+  reviewStations: number;
+  zonePads: number;
+};
+
+export function createOfficeFurniturePlan(): OfficeFurniturePlan {
+  return {
+    desks: 9,
+    deskChairs: 9,
+    deskChairBases: 9,
+    deskChairCasters: 45,
+    monitors: 9,
+    meetingTables: 3,
+    meetingTableLegs: 18,
+    meetingChairs: 29,
+    meetingChairBases: 29,
+    meetingChairCasters: 145,
+    presentationBoards: 0,
+    whiteboards: 3,
+    noteBoards: 1,
+    stickyNotes: 6,
+    wallClocks: 1,
+    mobileDisplays: 1,
+    tableCups: 17,
+    waterDispensers: 1,
+    teaBars: 1,
+    sofas: 1,
+    coffeeTables: 0,
+    reviewStations: 0,
+    zonePads: 2,
+  };
+}
+
+export function addLights(scene: THREE.Scene): void {
+  scene.add(new THREE.AmbientLight(0xffffff, 0.7));
+  const directional = new THREE.DirectionalLight(0xffffff, 1.2);
+  directional.position.set(10, 18, 8);
+  directional.castShadow = false;
+  scene.add(directional);
+}
+
+export function buildOfficeScene(scene: THREE.Scene): void {
+  buildOfficeBaseFloors(scene);
+  buildOfficeWalls(scene);
+
+  const batcher = new BoxInstanceBatcher(scene);
+  const transparentCache = new TransparentBoxCache();
+  activeBoxBatcher = batcher;
+  activeTransparentBoxCache = transparentCache;
+  try {
+    buildWallDecorations(scene);
+    buildDeskCluster(scene);
+    buildMeetingRoom(scene);
+    buildLargeMeetingRoom(scene);
+    buildLounge(scene);
+    buildTeaBar(scene);
+  } finally {
+    activeBoxBatcher = undefined;
+    activeTransparentBoxCache = undefined;
+  }
+  batcher.flush();
+}
+
+export function disposeObject(object: THREE.Object3D): void {
+  object.traverse((child) => {
+    const mesh = child as THREE.Mesh;
+    if (mesh.geometry) {
+      mesh.geometry.dispose();
+    }
+    const material = mesh.material;
+    if (Array.isArray(material)) {
+      material.forEach((item) => item.dispose());
+    } else if (material) {
+      material.dispose();
+    }
+  });
+}
+
+class BoxInstanceBatcher {
+  private readonly scene: THREE.Scene;
+  private readonly geometryCache = new Map<string, THREE.BoxGeometry>();
+  private readonly materialCache = new Map<number, THREE.MeshLambertMaterial>();
+  private readonly batches = new Map<number, THREE.BufferGeometry[]>();
+
+  constructor(scene: THREE.Scene) {
+    this.scene = scene;
+  }
+
+  addBox(
+    color: number,
+    width: number,
+    height: number,
+    depth: number,
+    x: number,
+    y: number,
+    z: number,
+    rotationY: number,
+  ) {
+    const geometryKey = `${width}:${height}:${depth}`;
+    const geometry = this.geometryCache.get(geometryKey) ?? (() => {
+      const created = new THREE.BoxGeometry(width, height, depth);
+      this.geometryCache.set(geometryKey, created);
+      return created;
+    })();
+    matrixHelper.position.set(x, y, z);
+    matrixHelper.rotation.set(0, rotationY, 0);
+    matrixHelper.scale.set(1, 1, 1);
+    matrixHelper.updateMatrix();
+    const transformed = geometry.clone();
+    transformed.applyMatrix4(matrixHelper.matrix);
+
+    const batch = this.batches.get(color);
+    if (batch) {
+      batch.push(transformed);
+      return;
+    }
+    this.batches.set(color, [transformed]);
+  }
+
+  flush() {
+    this.batches.forEach((geometries, color) => {
+      const mergedGeometry = mergeGeometries(geometries, false);
+      geometries.forEach((geometry) => geometry.dispose());
+      if (!mergedGeometry) {
+        return;
+      }
+      const material = this.materialCache.get(color) ?? (() => {
+        const created = new THREE.MeshLambertMaterial({ color });
+        this.materialCache.set(color, created);
+        return created;
+      })();
+      const mesh = new THREE.Mesh(mergedGeometry, material);
+      mesh.castShadow = false;
+      mesh.receiveShadow = false;
+      mesh.name = `staticOfficeBoxes:${color}`;
+      this.scene.add(mesh);
+    });
+    this.geometryCache.forEach((geometry) => geometry.dispose());
+    this.geometryCache.clear();
+  }
+}
+
+let activeBoxBatcher: BoxInstanceBatcher | undefined;
+
+class TransparentBoxCache {
+  private readonly geometryCache = new Map<string, THREE.BoxGeometry>();
+  private readonly materialCache = new Map<string, THREE.MeshLambertMaterial>();
+
+  getGeometry(width: number, height: number, depth: number): THREE.BoxGeometry {
+    const key = `${width}:${height}:${depth}`;
+    const cached = this.geometryCache.get(key);
+    if (cached) {
+      return cached;
+    }
+
+    const geometry = new THREE.BoxGeometry(width, height, depth);
+    this.geometryCache.set(key, geometry);
+    return geometry;
+  }
+
+  getMaterial(color: number, opacity: number): THREE.MeshLambertMaterial {
+    const key = `${color}:${opacity}`;
+    const cached = this.materialCache.get(key);
+    if (cached) {
+      return cached;
+    }
+
+    const material = new THREE.MeshLambertMaterial({
+      color,
+      transparent: true,
+      opacity,
+    });
+    this.materialCache.set(key, material);
+    return material;
+  }
+}
+
+let activeTransparentBoxCache: TransparentBoxCache | undefined;
+
+function buildOfficeBaseFloors(scene: THREE.Scene) {
+  const floorMinX = OFFICE_FLOOR_CENTER_X - OFFICE_FLOOR_WIDTH / 2;
+  const floorMaxX = OFFICE_FLOOR_CENTER_X + OFFICE_FLOOR_WIDTH / 2;
+  const officeSplitX = scaleOfficeX(24);
+  addBaseFloor(scene, 0xe5e7eb, (floorMinX + officeSplitX) / 2, officeSplitX - floorMinX, OFFICE_FLOOR_DEPTH);
+  addBaseFloor(scene, 0xdbe4ec, (officeSplitX + floorMaxX) / 2, floorMaxX - officeSplitX, OFFICE_FLOOR_DEPTH);
+}
+
+function addBaseFloor(scene: THREE.Scene, color: number, x: number, width: number, depth: number) {
+  const floor = new THREE.Mesh(
+    new THREE.BoxGeometry(width, 0.2, depth),
+    new THREE.MeshLambertMaterial({ color }),
+  );
+  floor.receiveShadow = true;
+  floor.position.set(x, -0.1, 0);
+  scene.add(floor);
+  addGridFloorLines(scene, x, width, depth);
+}
+
+function addGridFloorLines(scene: THREE.Scene, x: number, width: number, depth: number) {
+  const geometry = new THREE.BufferGeometry();
+  const positions: number[] = [];
+  const minX = x - width / 2;
+  const maxX = x + width / 2;
+  const minZ = -depth / 2;
+  const maxZ = depth / 2;
+
+  for (let lineX = minX; lineX <= maxX + 0.001; lineX += OFFICE_FLOOR_TILE_SIZE) {
+    positions.push(lineX, 0.012, minZ, lineX, 0.012, maxZ);
+  }
+  for (let lineZ = minZ; lineZ <= maxZ + 0.001; lineZ += OFFICE_FLOOR_TILE_SIZE) {
+    positions.push(minX, 0.012, lineZ, maxX, 0.012, lineZ);
+  }
+
+  geometry.setAttribute("position", new THREE.Float32BufferAttribute(positions, 3));
+  const lines = new THREE.LineSegments(
+    geometry,
+    new THREE.LineBasicMaterial({ color: 0x738084, transparent: true, opacity: 0.9 }),
+  );
+  lines.name = "officeGridFloorLines";
+  scene.add(lines);
+}
+
+function buildOfficeWalls(scene: THREE.Scene) {
+  const wallHeight = 2.5;
+  const wallThickness = 0.5;
+  const wallMaterial = new THREE.MeshLambertMaterial({ color: 0xe8e0d0 });
+  const floorMinX = OFFICE_FLOOR_CENTER_X - OFFICE_FLOOR_WIDTH / 2;
+  const floorMaxX = OFFICE_FLOOR_CENTER_X + OFFICE_FLOOR_WIDTH / 2;
+  const floorMinZ = -OFFICE_FLOOR_DEPTH / 2;
+
+  addOfficeWallBox(scene, OFFICE_FLOOR_WIDTH, wallHeight, wallThickness, OFFICE_FLOOR_CENTER_X, wallHeight / 2, floorMinZ, wallMaterial);
+  addOfficeWallBox(scene, wallThickness, wallHeight, OFFICE_FLOOR_DEPTH, floorMinX, wallHeight / 2, 0, wallMaterial);
+  addOfficeWallBox(scene, wallThickness, wallHeight, OFFICE_FLOOR_DEPTH, floorMaxX, wallHeight / 2, 0, wallMaterial);
+}
+
+function addOfficeWallBox(
+  scene: THREE.Scene,
+  width: number,
+  height: number,
+  depth: number,
+  x: number,
+  y: number,
+  z: number,
+  material: THREE.Material,
+) {
+  const mesh = new THREE.Mesh(
+    new THREE.BoxGeometry(width, height, depth),
+    material,
+  );
+  mesh.castShadow = false;
+  mesh.receiveShadow = true;
+  mesh.position.set(x, y, z);
+  scene.add(mesh);
+}
+
+function buildWallDecorations(scene: THREE.Scene) {
+  const northWallFaceZ = -OFFICE_FLOOR_DEPTH / 2 + 0.28;
+  addWallWhiteboard(scene, scaleOfficeX(3.8), northWallFaceZ, 0, 1);
+  addStickyNoteBoard(scene, scaleOfficeX(-11.5), northWallFaceZ);
+  addWallClock(scene, scaleOfficeX(-2.2), northWallFaceZ);
+}
+
+export function resolveWallWhiteboardOffsets(faceDirection: -1 | 1) {
+  return {
+    frameZ: 0.09 * faceDirection,
+    panelZ: 0.14 * faceDirection,
+    trayZ: 0.2 * faceDirection,
+  };
+}
+
+function addWallWhiteboard(scene: THREE.Scene, x: number, wallZ: number, rotation: number, faceDirection: -1 | 1) {
+  const offsets = resolveWallWhiteboardOffsets(faceDirection);
+  addLocalBox(scene, 0x888888, 3.2, 1.7, 0.05, x, wallZ, 0, 1.5, offsets.frameZ, rotation);
+  addLocalBox(scene, 0xffffff, 3, 1.5, 0.08, x, wallZ, 0, 1.5, offsets.panelZ, rotation);
+  addLocalBox(scene, 0x64748b, 1.2, 0.06, 0.05, x, wallZ, -0.5, 1.02, offsets.trayZ, rotation);
+}
+
+function addStickyNoteBoard(scene: THREE.Scene, x: number, z: number) {
+  addBox(scene, 0xb87333, 3, 1.5, 0.08, x, 1.5, z - 0.04);
+  addBox(scene, 0xd4a76a, 2.8, 1.3, 0.05, x, 1.5, z + 0.02);
+
+  const noteColors = [0xffff88, 0xff88aa, 0x88ff88, 0x88bbff, 0xffbb88, 0xf8fafc] as const;
+  for (let noteIndex = 0; noteIndex < noteColors.length; noteIndex += 1) {
+    addBox(
+      scene,
+      noteColors[noteIndex]!,
+      0.5,
+      0.5,
+      0.03,
+      x - 0.8 + (noteIndex % 3) * 0.8,
+      1.8 - Math.floor(noteIndex / 3) * 0.6,
+      z + 0.06,
+    );
+  }
+}
+
+function addWallClock(scene: THREE.Scene, x: number, z: number) {
+  addBox(scene, 0x333333, 0.9, 0.9, 0.05, x, 2, z - 0.04);
+  addBox(scene, 0xffffff, 0.8, 0.8, 0.08, x, 2, z + 0.02);
+  addBox(scene, 0x333333, 0.08, 0.32, 0.04, x, 2.1, z + 0.08);
+  addBox(scene, 0x333333, 0.28, 0.06, 0.04, x + 0.1, 1.98, z + 0.08);
+}
+
+function buildDeskCluster(scene: THREE.Scene) {
+  DESK_TEMPLATE.forEach((slot) => {
+    addDesk(scene, slot.desk.x, slot.desk.z);
+    addOfficeChair(scene, slot.seat.x, slot.seat.z, slot.rotation);
+    addMonitor(scene, slot.desk.x, slot.desk.z - 0.4);
+  });
+}
+
+function buildMeetingRoom(scene: THREE.Scene) {
+  MEETING_ROOMS.forEach((room, roomIndex) => {
+    addMeetingGlassRoom(scene, roomIndex);
+    addMeetingTable(scene, room.center.x, room.center.z, room.topColor, room.legColor, room.tableDepth);
+    room.seats.forEach((seat) => addOfficeChair(scene, seat.x, seat.z, seat.rotation));
+  });
+  addOfficeDividerGlass(scene);
+}
+
+function buildLargeMeetingRoom(scene: THREE.Scene) {
+  addLargeMeetingTable(scene, LARGE_MEETING_X, LARGE_MEETING_Z);
+  for (let index = 0; index < LARGE_MEETING_CHAIRS_PER_SIDE * 2; index += 1) {
+    const side = index < LARGE_MEETING_CHAIRS_PER_SIDE ? -1 : 1;
+    const offset = (index % LARGE_MEETING_CHAIRS_PER_SIDE) - (LARGE_MEETING_CHAIRS_PER_SIDE - 1) / 2;
+    addOfficeChair(
+      scene,
+      LARGE_MEETING_X + offset * LARGE_MEETING_CHAIR_SPACING_X,
+      resolveLargeMeetingChairZ(side),
+      resolveLargeMeetingChairRotation(side),
+    );
+    addTableCup(scene, LARGE_MEETING_X + offset * LARGE_MEETING_CHAIR_SPACING_X, LARGE_MEETING_Z + side * 1.75);
+  }
+  addOfficeChair(scene, LARGE_MEETING_X - 9.1, LARGE_MEETING_Z, Math.PI / 2);
+  addTableCup(scene, LARGE_MEETING_X - 7.6, LARGE_MEETING_Z);
+  addMobileDisplayStand(scene, LARGE_MEETING_X + 9.3, LARGE_MEETING_Z, -Math.PI / 2);
+}
+
+function buildLounge(scene: THREE.Scene) {
+  addSofa(scene, LOUNGE_CENTER.x, LOUNGE_CENTER.z);
+  addLoungeSideTable(scene, LOUNGE_CENTER.x - 3.05, LOUNGE_CENTER.z - 0.05);
+  addBookcase(scene, LOUNGE_CENTER.x + 3.25, LOUNGE_CENTER.z + 0.15);
+}
+
+function buildTeaBar(scene: THREE.Scene) {
+  addTeaCounter(scene, scaleOfficeX(-14.8), scaleOfficeZ(10.4));
+  addWaterDispenser(scene, scaleOfficeX(-16.9), scaleOfficeZ(10.4));
+}
+
+function addDesk(scene: THREE.Scene, x: number, z: number) {
+  addBox(scene, 0xd2b48c, 3, 0.15, 1.8, x, 1.5, z);
+  addBox(scene, 0x8b7355, 0.15, 1.5, 0.15, x - 1.3, 0.75, z - 0.7);
+  addBox(scene, 0x8b7355, 0.15, 1.5, 0.15, x + 1.3, 0.75, z - 0.7);
+  addBox(scene, 0x8b7355, 0.15, 1.5, 0.15, x - 1.3, 0.75, z + 0.7);
+  addBox(scene, 0x8b7355, 0.15, 1.5, 0.15, x + 1.3, 0.75, z + 0.7);
+  addBox(scene, 0x444444, 0.8, 0.05, 0.3, x, 1.6, z + 0.3);
+  addBox(scene, 0x555555, 0.15, 0.05, 0.2, x + 0.6, 1.6, z + 0.3);
+}
+
+function addOfficeChair(scene: THREE.Scene, x: number, z: number, rotation = 0) {
+  addLocalBox(scene, 0x2c3e50, 0.8, 0.1, 0.8, x, z, 0, 1, 0, rotation);
+  addLocalBox(scene, 0x2c3e50, 0.8, 0.9, 0.1, x, z, 0, 1.5, -0.35, rotation);
+  addLocalBox(scene, 0x888888, 0.1, 0.6, 0.1, x, z, 0, 0.6, 0, rotation);
+  for (let armIndex = 0; armIndex < 5; armIndex += 1) {
+    const angle = (armIndex / 5) * Math.PI * 2;
+    addLocalBox(scene, 0x888888, 0.6, 0.06, 0.08, x, z, 0, 0.25, 0, rotation + angle);
+    addLocalBox(
+      scene,
+      0x333333,
+      0.12,
+      0.12,
+      0.12,
+      x,
+      z,
+      Math.sin(angle) * 0.3,
+      0.18,
+      Math.cos(angle) * 0.3,
+      rotation,
+    );
+  }
+}
+
+function addMonitor(scene: THREE.Scene, x: number, z: number) {
+  addBox(scene, 0x333333, 0.1, 0.4, 0.1, x, 1.8, z + 0.1);
+  addBox(scene, 0x333333, 0.6, 0.08, 0.4, x, 1.62, z + 0.1);
+  addBox(scene, 0x222222, 1.4, 1, 0.08, x, 2.5, z);
+  addBox(scene, 0x3498db, 1.2, 0.8, 0.02, x, 2.5, z + 0.05);
+}
+
+function addMeetingTable(
+  scene: THREE.Scene,
+  x: number,
+  z: number,
+  topColor = 0xb8860b,
+  legColor = 0x8b6914,
+  depth = 3,
+) {
+  const legZ = depth / 2 - 0.3;
+  addBox(scene, topColor, 5, 0.15, depth, x, 1.5, z);
+  addBox(scene, legColor, 0.2, 1.5, 0.2, x - 2.2, 0.75, z - legZ);
+  addBox(scene, legColor, 0.2, 1.5, 0.2, x + 2.2, 0.75, z - legZ);
+  addBox(scene, legColor, 0.2, 1.5, 0.2, x - 2.2, 0.75, z + legZ);
+  addBox(scene, legColor, 0.2, 1.5, 0.2, x + 2.2, 0.75, z + legZ);
+}
+
+function addMeetingGlassRoom(scene: THREE.Scene, roomIndex: number) {
+  const sharedWallZ = -2.75;
+  const northWallFaceZ = -OFFICE_FLOOR_DEPTH / 2 + 0.28;
+  if (roomIndex === 0) {
+    addGlassWallWithDoor(
+      scene,
+      roomIndex,
+      scaleOfficeX(10.5),
+      scaleOfficeZ((sharedWallZ + 9.6) / 2),
+      (9.6 - sharedWallZ) * OFFICE_LAYOUT_SCALE,
+      1.9,
+      0.25,
+    );
+    addTransparentBox(scene, 0x88ccee, 11.7 * OFFICE_LAYOUT_SCALE, 2.5, 0.08, scaleOfficeX(16.35), 1.25, scaleOfficeZ(sharedWallZ), 0.2);
+    addTransparentBox(scene, 0x88ccee, 11.7 * OFFICE_LAYOUT_SCALE, 2.5, 0.08, scaleOfficeX(16.35), 1.25, scaleOfficeZ(9.6), 0.2);
+    addMeetingWhiteboard(scene, scaleOfficeX(16.35), scaleOfficeZ(sharedWallZ), Math.PI);
+    addBox(scene, 0xcccccc, 0.15, 2.5, 0.15, scaleOfficeX(10.5), 1.25, scaleOfficeZ(sharedWallZ));
+    addBox(scene, 0xcccccc, 0.15, 2.5, 0.15, scaleOfficeX(10.5), 1.25, scaleOfficeZ(9.6));
+    return;
+  }
+
+  addGlassWallWithDoor(
+    scene,
+    roomIndex,
+    scaleOfficeX(10.5),
+    (northWallFaceZ + scaleOfficeZ(sharedWallZ)) / 2,
+    scaleOfficeZ(sharedWallZ) - northWallFaceZ,
+    1.6,
+    0.25,
+  );
+  addTransparentBox(scene, 0x88ccee, 11.7 * OFFICE_LAYOUT_SCALE, 2.5, 0.08, scaleOfficeX(16.35), 1.25, northWallFaceZ, 0.2);
+  addTransparentBox(
+    scene,
+    0x88ccee,
+    0.08,
+    2.5,
+    scaleOfficeZ(-9.3) - northWallFaceZ,
+    scaleOfficeX(22.2),
+    1.25,
+    (northWallFaceZ + scaleOfficeZ(-9.3)) / 2,
+    0.15,
+  );
+  addMeetingWhiteboard(scene, scaleOfficeX(16.35), northWallFaceZ, 0);
+  [
+    [scaleOfficeX(10.5), northWallFaceZ],
+    [scaleOfficeX(10.5), scaleOfficeZ(sharedWallZ)],
+    [scaleOfficeX(22.2), northWallFaceZ],
+    [scaleOfficeX(22.2), scaleOfficeZ(sharedWallZ)],
+  ].forEach(([x, z]) => addBox(scene, 0xcccccc, 0.15, 2.5, 0.15, x, 1.25, z));
+}
+
+function addOfficeDividerGlass(scene: THREE.Scene) {
+  const minZ = -9.3;
+  const maxZ = 9.6;
+  addTransparentBox(
+    scene,
+    0x88ccee,
+    0.08,
+    2.5,
+    (maxZ - minZ) * OFFICE_LAYOUT_SCALE,
+    scaleOfficeX(22.2),
+    1.25,
+    scaleOfficeZ((minZ + maxZ) / 2),
+    0.15,
+  );
+}
+
+function addMeetingWhiteboard(scene: THREE.Scene, x: number, wallZ: number, rotation: number) {
+  addWallWhiteboard(scene, x, wallZ, rotation, rotation === 0 ? 1 : -1);
+}
+
+function addGlassWallWithDoor(
+  scene: THREE.Scene,
+  roomIndex: number,
+  x: number,
+  z: number,
+  depth: number,
+  doorDepth: number,
+  opacity: number,
+) {
+  const sideDepth = (depth - doorDepth) / 2;
+  const sideOffset = (doorDepth + sideDepth) / 2;
+  addTransparentBox(
+    scene,
+    0x88ccee,
+    0.08,
+    2.5,
+    sideDepth,
+    x,
+    1.25,
+    z - sideOffset,
+    opacity,
+    `meetingGlassWall:${roomIndex}:beforeDoor`,
+  );
+  addTransparentBox(
+    scene,
+    0x88ccee,
+    0.08,
+    2.5,
+    sideDepth,
+    x,
+    1.25,
+    z + sideOffset,
+    opacity,
+    `meetingGlassWall:${roomIndex}:afterDoor`,
+  );
+  addGlassDoor(scene, roomIndex, x, z, doorDepth);
+}
+
+function addGlassDoor(scene: THREE.Scene, roomIndex: number, x: number, z: number, depth: number) {
+  const doorWidth = depth - 0.25;
+  const hingeZ = z - depth / 2 + 0.15;
+  addTransparentBox(scene, 0xa5f3fc, doorWidth, 2.05, 0.06, x - doorWidth / 2, 1.03, hingeZ, 0.2, `meetingGlassDoor:${roomIndex}`);
+  addBox(scene, 0xcccccc, 0.15, 2.5, 0.15, x, 1.25, z - depth / 2);
+  addBox(scene, 0xcccccc, 0.15, 2.5, 0.15, x, 1.25, z + depth / 2);
+  addBox(scene, 0xcccccc, 0.15, 0.15, depth, x, 2.42, z);
+  addBox(scene, 0x334155, 0.2, 0.05, 0.12, x - doorWidth + 0.18, 1.1, hingeZ - 0.08);
+}
+
+function addLargeMeetingTable(scene: THREE.Scene, x: number, z: number) {
+  addBox(scene, 0xb8860b, 16.4, 0.15, 4.5, x, 1.5, z);
+  for (const legX of [-7, -3.5, 0, 3.5, 7]) {
+    addBox(scene, 0x8b6914, 0.2, 1.5, 0.2, x + legX, 0.75, z - 1.95);
+    addBox(scene, 0x8b6914, 0.2, 1.5, 0.2, x + legX, 0.75, z + 1.95);
+  }
+}
+
+function addTableCup(scene: THREE.Scene, x: number, z: number) {
+  addBox(scene, 0xf8fafc, 0.2, 0.22, 0.2, x, 1.69, z);
+  addBox(scene, 0x92400e, 0.16, 0.03, 0.16, x, 1.815, z);
+}
+
+function addPresentationBoard(scene: THREE.Scene, x: number, z: number, screenColor = 0x7dd3fc, rotation = 0) {
+  addLocalBox(scene, 0x2c3e50, 2, 0.4, 0.08, x, z, 0, 2.1, 0, rotation);
+  addLocalBox(scene, screenColor, 1.8, 0.3, 0.02, x, z, 0, 2.1, 0.05, rotation);
+  addLocalBox(scene, 0x64748b, 0.12, 1.55, 0.12, x, z, -1.08, 0.78, -0.02, rotation);
+  addLocalBox(scene, 0x64748b, 0.12, 1.55, 0.12, x, z, 1.08, 0.78, -0.02, rotation);
+}
+
+function addMobileDisplayStand(scene: THREE.Scene, x: number, z: number, rotation = 0) {
+  addLocalBox(scene, 0x111827, 4, 2.3, 0.12, x, z, 0, 3, 0, rotation);
+  addLocalBox(scene, 0x38bdf8, 3.52, 1.76, 0.03, x, z, 0, 3, 0.07, rotation);
+  addLocalBox(scene, 0x64748b, 0.16, 2.4, 0.16, x, z, 0, 1.45, -0.02, rotation);
+  addLocalBox(scene, 0x475569, 1.15, 0.08, 0.5, x, z, 0, 0.48, -0.02, rotation);
+  for (const wheelX of [-0.48, 0.48]) {
+    for (const wheelZ of [-0.18, 0.18]) {
+      addLocalBox(scene, 0x111827, 0.14, 0.14, 0.14, x, z, wheelX, 0.32, wheelZ, rotation);
+    }
+  }
+}
+
+function addSofa(scene: THREE.Scene, x: number, z: number) {
+  addBox(scene, 0x0f766e, 4.45, 0.52, 1.22, x, 0.42, z);
+  addBox(scene, 0x115e59, 4.52, 0.88, 0.26, x, 0.86, z + 0.59);
+  addBox(scene, 0x0f766e, 0.3, 0.78, 1.25, x - 2.28, 0.7, z);
+  addBox(scene, 0x0f766e, 0.3, 0.78, 1.25, x + 2.28, 0.7, z);
+  addBox(scene, 0x14b8a6, 1.28, 0.1, 1.05, x - 1.38, 0.68, z - 0.04);
+  addBox(scene, 0x14b8a6, 1.28, 0.1, 1.05, x, 0.68, z - 0.04);
+  addBox(scene, 0x14b8a6, 1.28, 0.1, 1.05, x + 1.38, 0.68, z - 0.04);
+}
+
+function addLoungeSideTable(scene: THREE.Scene, x: number, z: number) {
+  addBox(scene, 0xd97706, 1, 0.14, 0.8, x, 0.38, z);
+  addBox(scene, 0x92400e, 0.09, 0.4, 0.09, x - 0.38, 0.16, z - 0.3);
+  addBox(scene, 0x92400e, 0.09, 0.4, 0.09, x + 0.38, 0.16, z - 0.3);
+  addBox(scene, 0x92400e, 0.09, 0.4, 0.09, x - 0.38, 0.16, z + 0.3);
+  addBox(scene, 0x92400e, 0.09, 0.4, 0.09, x + 0.38, 0.16, z + 0.3);
+  addBox(scene, 0xfef08a, 0.28, 0.28, 0.28, x, 0.62, z);
+}
+
+function addBookcase(scene: THREE.Scene, x: number, z: number) {
+  addBox(scene, 0x475569, 1.2, 1.45, 0.28, x, 0.78, z);
+  addBox(scene, 0x334155, 1.08, 0.08, 0.32, x, 1.18, z + 0.01);
+  addBox(scene, 0x334155, 1.08, 0.08, 0.32, x, 0.78, z + 0.01);
+  addBox(scene, 0x334155, 1.08, 0.08, 0.32, x, 0.38, z + 0.01);
+  addBox(scene, 0x38bdf8, 0.16, 0.28, 0.08, x - 0.34, 1, z + 0.18);
+  addBox(scene, 0xf97316, 0.16, 0.3, 0.08, x - 0.12, 1, z + 0.18);
+  addBox(scene, 0x22c55e, 0.16, 0.26, 0.08, x + 0.1, 1, z + 0.18);
+  addBox(scene, 0xeab308, 0.46, 0.22, 0.08, x + 0.2, 0.58, z + 0.18);
+}
+
+function addTeaCounter(scene: THREE.Scene, x: number, z: number) {
+  addBox(scene, 0xd97706, 2.2, 0.75, 0.55, x, 0.38, z);
+  addBox(scene, 0x92400e, 2.35, 0.12, 0.7, x, 0.82, z);
+  addBox(scene, 0x334155, 1.08, 0.08, 0.32, x, 1.15, z - 0.2);
+  addBox(scene, 0xfef08a, 0.28, 0.28, 0.28, x - 0.65, 1.02, z);
+  addBox(scene, 0xf8fafc, 0.2, 0.22, 0.2, x + 0.05, 1.02, z - 0.12);
+  addBox(scene, 0xf8fafc, 0.2, 0.22, 0.2, x + 0.38, 1.02, z - 0.12);
+  addBox(scene, 0x22c55e, 0.16, 0.26, 0.08, x + 0.78, 1.03, z + 0.18);
+}
+
+function addWaterDispenser(scene: THREE.Scene, x: number, z: number) {
+  addBox(scene, 0x475569, 0.75, 1.35, 0.45, x, 0.72, z);
+  addBox(scene, 0x38bdf8, 0.46, 0.45, 0.28, x, 1.62, z);
+  addBox(scene, 0x334155, 0.46, 0.08, 0.32, x, 1.18, z + 0.01);
+  addBox(scene, 0xf8fafc, 0.2, 0.22, 0.2, x + 0.25, 0.42, z - 0.16);
+}
+
+function addBox(
+  scene: THREE.Scene,
+  color: number,
+  width: number,
+  height: number,
+  depth: number,
+  x: number,
+  y: number,
+  z: number,
+  rotationY = 0,
+) {
+  if (activeBoxBatcher) {
+    activeBoxBatcher.addBox(color, width, height, depth, x, y, z, rotationY);
+    return;
+  }
+
+  const mesh = new THREE.Mesh(
+    new THREE.BoxGeometry(width, height, depth),
+    new THREE.MeshLambertMaterial({ color }),
+  );
+  mesh.castShadow = true;
+  mesh.receiveShadow = true;
+  mesh.position.set(x, y, z);
+  mesh.rotation.y = rotationY;
+  scene.add(mesh);
+}
+
+function addTransparentBox(
+  scene: THREE.Scene,
+  color: number,
+  width: number,
+  height: number,
+  depth: number,
+  x: number,
+  y: number,
+  z: number,
+  opacity: number,
+  name?: string,
+) {
+  const mesh = new THREE.Mesh(
+    activeTransparentBoxCache?.getGeometry(width, height, depth) ?? new THREE.BoxGeometry(width, height, depth),
+    activeTransparentBoxCache?.getMaterial(color, opacity) ??
+      new THREE.MeshLambertMaterial({
+        color,
+        transparent: true,
+        opacity,
+      }),
+  );
+  mesh.castShadow = false;
+  mesh.receiveShadow = false;
+  if (name) {
+    mesh.name = name;
+  }
+  mesh.position.set(x, y, z);
+  scene.add(mesh);
+}
+
+function addLocalBox(
+  scene: THREE.Scene,
+  color: number,
+  width: number,
+  height: number,
+  depth: number,
+  originX: number,
+  originZ: number,
+  localX: number,
+  y: number,
+  localZ: number,
+  rotationY: number,
+) {
+  const cos = Math.cos(rotationY);
+  const sin = Math.sin(rotationY);
+  addBox(
+    scene,
+    color,
+    width,
+    height,
+    depth,
+    originX + localX * cos + localZ * sin,
+    y,
+    originZ - localX * sin + localZ * cos,
+    rotationY,
+  );
+}