puppet scale

src/routes/scene/components/renderer/puppet/index.ts

@@ -32,15 +32,21 @@ export class Puppet {
   private readonly skin: PuppetSkin;
   private readonly targetGroundPosition = new THREE.Vector3();
 
-  constructor(readonly id: string) {
+  constructor(readonly id: string, scale: number) {
     this.rig = this.createRig();
     this.root = this.rig.root;
     this.animation = new PuppetAnimation(this.rig);
     const placeholderMaterial = this.rig.body.material;
     this.skin = new PuppetSkin(id, this.rig);
+    this.setScale(scale);
     if (!Array.isArray(placeholderMaterial)) placeholderMaterial.dispose();
   }
 
+  setScale(scale: number) {
+    if (this.root.scale.x === scale) return;
+    this.root.scale.setScalar(scale);
+  }
+
   update(
     state: PuppetState,
     world: World,
@@ -81,50 +87,49 @@ export class Puppet {
   private createRig(): PuppetRig {
     const root = new THREE.Group();
     const material = new THREE.MeshStandardMaterial();
-    const scale = 1;
 
     const body = new THREE.Mesh(
-      new THREE.BoxGeometry(16 * scale, 24 * scale, 8 * scale),
+      new THREE.BoxGeometry(16, 24, 8),
       material,
     );
-    body.position.y = 36 * scale;
+    body.position.y = 36;
 
     const head = new THREE.Mesh(
-      new THREE.BoxGeometry(16 * scale, 16 * scale, 16 * scale),
+      new THREE.BoxGeometry(16, 16, 16),
       material,
     );
-    head.position.y = 56 * scale;
+    head.position.y = 56;
 
     const { pivot: leftArm, mesh: leftArmMesh } = this.createLimbPivot(
-      -12 * scale,
-      48 * scale,
-      8 * scale,
-      24 * scale,
-      8 * scale,
+      -12,
+      48,
+      8,
+      24,
+      8,
       material,
     );
     const { pivot: rightArm, mesh: rightArmMesh } = this.createLimbPivot(
-      12 * scale,
-      48 * scale,
-      8 * scale,
-      24 * scale,
-      8 * scale,
+      12,
+      48,
+      8,
+      24,
+      8,
       material,
     );
     const { pivot: leftLeg, mesh: leftLegMesh } = this.createLimbPivot(
-      -4 * scale,
-      24 * scale,
-      8 * scale,
-      24 * scale,
-      8 * scale,
+      -4,
+      24,
+      8,
+      24,
+      8,
       material,
     );
     const { pivot: rightLeg, mesh: rightLegMesh } = this.createLimbPivot(
-      4 * scale,
-      24 * scale,
-      8 * scale,
-      24 * scale,
-      8 * scale,
+      4,
+      24,
+      8,
+      24,
+      8,
       material,
     );
 

src/routes/scene/components/renderer/puppet/manager.ts

@@ -10,12 +10,13 @@ export class PuppetManager {
 
   update(
     states: readonly PuppetState[],
+    scale: number,
     frozenPuppetId: string | null,
     deltaSeconds: number,
     elapsedSeconds: number,
     skinHashes: ReadonlyMap<string, string | null>,
   ) {
-    this.syncPuppets(states);
+    this.syncPuppets(states, scale);
 
     for (const state of states) {
       this.puppets
@@ -46,17 +47,19 @@ export class PuppetManager {
     this.puppets.clear();
   }
 
-  private syncPuppets(states: readonly PuppetState[]) {
+  private syncPuppets(states: readonly PuppetState[], scale: number) {
     const nextPuppetIds = new Set(states.map((state) => state.id));
 
     for (const state of states) {
       if (this.puppets.has(state.id)) continue;
 
-      const puppet = new Puppet(state.id);
+      const puppet = new Puppet(state.id, scale);
       this.puppets.set(puppet.id, puppet);
       this.world.addObject(puppet.root);
     }
 
+    for (const puppet of this.puppets.values()) puppet.setScale(scale);
+
     for (const [puppetId, puppet] of this.puppets) {
       if (nextPuppetIds.has(puppetId)) continue;