impot models and set camera

src/controllers/TestSceneC.ts

@@ -1,42 +1,72 @@
-import { BoxGeometry, Mesh, MeshStandardMaterial, Vector3 } from "three";
+import { DirectionalLight, Object3D, Vector3, Mesh, Material } from "three";
 import { ThreeC } from "./ThreeC";
-import { InputC, JoystickC } from "@24tools/playable_template";
+import { CameraC } from "./CameraC";
+import { InputC, UpdateController } from "@24tools/playable_template";
 
 export class TestSceneC {
+  private static character: Object3D | null = null;
+
   static init() {
-    this.createPrimitive();
+    this.loadMapModel();
+    this.loadCharacter();
 
     // example of using InputC events
     InputC.onTouchDown.addDelegate((event) => {
       console.log("onMouseDown", event);
     });
 
-    // if you have update in your controller
-    // UpdateController.Instance.onUpdate.addDelegate(() => {
-    //   this.update();
-    // });
+    // Update loop to follow character with camera
+    UpdateController.Instance.onUpdate.addDelegate(() => {
+      this.updateCameraFollow();
+    });
   }
 
-  private static createPrimitive() {
-    const geometry = new BoxGeometry(1, 1, 1);
-    const material = new MeshStandardMaterial({ color: 0xcc0000 });
-    const cube = new Mesh(geometry, material);
+  private static loadMapModel() {
+    const mapObject = ThreeC.getObject("map");
+    if (!mapObject) {
+      console.warn("Map model resource not found: map");
+      return;
+    }
 
-    const geometryPlane = new BoxGeometry(5, 0.1, 7);
-    const materialPlane = new MeshStandardMaterial({ color: 0xaaaaaa });
-    const plane = new Mesh(geometryPlane, materialPlane);
+    mapObject.position.set(0, 0, 0);
+    
+    ThreeC.setShadowsStateForChildren(mapObject, true, true);
+    ThreeC.addToScene(mapObject);
+  }
+  
 
-    let planePosition = plane.position.clone();
+  private static updateCameraFollow() {
+    if (!this.character || !CameraC.camera) return;
 
-    ThreeC.setShadowsStateForChildren(cube, true, false);
+    // Position camera at 75 degree angle from horizontal, slightly to the side
+    const charPos = this.character.position;
+    const angle = 70 * (Math.PI / 180); // 75 degrees
+    const distance = 10;
+    const sideOffset = 5; // offset to the left side
 
-    ThreeC.setShadowsStateForChildren(plane, false, true);
+    // Calculate vertical and horizontal distances based on 75 degree angle
+    const verticalDistance = distance * Math.sin(angle);
+    const horizontalDistance = distance * Math.cos(angle);
 
-    plane.position.copy(
-      new Vector3(planePosition.x, planePosition.y - 0.5, planePosition.z - 1.5)
+    CameraC.camera.position.set(
+      charPos.x + sideOffset,
+      charPos.y + verticalDistance,
+      charPos.z + horizontalDistance
     );
+    CameraC.camera.lookAt(charPos.x, charPos.y + 1, charPos.z);
+  }
 
-    ThreeC.addToScene(cube);
-    ThreeC.addToScene(plane);
+  private static loadCharacter() {
+    const charObject = ThreeC.getObject("character");
+    if (!charObject) {
+      console.warn("Character model resource not found: character");
+      return;
+    }
+
+    // Place character near the map center; adjust Y for ground offset
+    charObject.position.copy(new Vector3(0, 0, 32));
+    this.character = charObject;
+    ThreeC.setShadowsStateForChildren(charObject, true, true);
+    ThreeC.addToScene(charObject);
   }
 }