@mml-io/3d-web-client-core 0.0.0-experimental-e594824-20230925 → 0.0.0-experimental-aaef76d-20230925

package/build/character/Character.d.ts

@@ -2,8 +2,10 @@ import { Color, Vector3 } from "three";
 import { CameraManager } from "../camera/CameraManager";
 import { CollisionsManager } from "../collisions/CollisionsManager";
 import { KeyInputManager } from "../input/KeyInputManager";
+import { Composer } from "../rendering/composer";
 import { TimeManager } from "../time/TimeManager";
 import { CharacterModel } from "./CharacterModel";
+import { CharacterSpeakingIndicator } from "./CharacterSpeakingIndicator";
 import { CharacterTooltip } from "./CharacterTooltip";
 import { LocalController } from "./LocalController";
 export type CharacterDescription = {
@@ -23,13 +25,15 @@ export declare class Character {
     private readonly keyInputManager;
     private readonly cameraManager;
     private readonly timeManager;
+    private readonly composer;
     controller: LocalController | null;
     name: string | null;
     model: CharacterModel | null;
     color: Color;
     position: Vector3;
     tooltip: CharacterTooltip | null;
-    constructor(characterDescription: CharacterDescription, id: number, isLocal: boolean, modelLoadedCallback: () => void, collisionsManager: CollisionsManager, keyInputManager: KeyInputManager, cameraManager: CameraManager, timeManager: TimeManager);
+    speakingIndicator: CharacterSpeakingIndicator | null;
+    constructor(characterDescription: CharacterDescription, id: number, isLocal: boolean, modelLoadedCallback: () => void, collisionsManager: CollisionsManager, keyInputManager: KeyInputManager, cameraManager: CameraManager, timeManager: TimeManager, composer: Composer);
     private load;
     update(time: number): void;
 }

package/build/character/CharacterManager.d.ts

@@ -3,11 +3,13 @@ import { Group, Vector3 } from "three";
 import { CameraManager } from "../camera/CameraManager";
 import { CollisionsManager } from "../collisions/CollisionsManager";
 import { KeyInputManager } from "../input/KeyInputManager";
+import { Composer } from "../rendering/composer";
 import { TimeManager } from "../time/TimeManager";
 import { Character, CharacterDescription } from "./Character";
 import { CharacterState } from "./CharacterState";
 import { RemoteController } from "./RemoteController";
 export declare class CharacterManager {
+    private readonly composer;
     private readonly collisionsManager;
     private readonly cameraManager;
     private readonly timeManager;
@@ -15,6 +17,7 @@ export declare class CharacterManager {
     private readonly clientStates;
     private readonly sendUpdate;
     private updateLocationHash;
+    private id;
     loadingCharacters: Map<number, Promise<Character>>;
     remoteCharacters: Map<number, Character>;
     remoteCharacterControllers: Map<number, RemoteController>;
@@ -22,10 +25,12 @@ export declare class CharacterManager {
     character: Character | null;
     private cameraOffsetTarget;
     private cameraOffset;
+    private speakingCharacters;
     readonly group: Group;
-    constructor(collisionsManager: CollisionsManager, cameraManager: CameraManager, timeManager: TimeManager, inputManager: KeyInputManager, clientStates: Map<number, CharacterState>, sendUpdate: (update: CharacterState) => void);
+    constructor(composer: Composer, collisionsManager: CollisionsManager, cameraManager: CameraManager, timeManager: TimeManager, inputManager: KeyInputManager, clientStates: Map<number, CharacterState>, sendUpdate: (update: CharacterState) => void);
     spawnCharacter(characterDescription: CharacterDescription, id: number, isLocal?: boolean, spawnPosition?: Vector3): Promise<Character>;
     getLocalCharacterPositionAndRotation(): PositionAndRotation;
     clear(): void;
+    setSpeakingCharacter(id: number, value: boolean): void;
     update(): void;
 }

package/build/character/CharacterModel.d.ts

@@ -1,4 +1,4 @@
-import { AnimationAction, AnimationMixer, Object3D } from "three";
+import { AnimationAction, AnimationMixer, Bone, Object3D } from "three";
 import { CharacterDescription } from "./Character";
 import { CharacterMaterial } from "./CharacterMaterial";
 import { AnimationState } from "./CharacterState";
@@ -7,6 +7,7 @@ export declare class CharacterModel {
     private modelLoader;
     mesh: Object3D | null;
     material: CharacterMaterial;
+    headBone: Bone | null;
     animations: Record<string, AnimationAction>;
     animationMixer: AnimationMixer | null;
     currentAnimation: AnimationState;

package/build/character/CharacterSpeakingIndicator.d.ts

@@ -0,0 +1,17 @@
+import { Camera, Object3D, Scene, Vector3 } from "three";
+export declare class CharacterSpeakingIndicator {
+    private scene;
+    private vertexShader;
+    private fragmentShader;
+    private uniforms;
+    private geometry;
+    private material;
+    private mesh;
+    private currentAlpha;
+    private targetAlpha;
+    constructor(scene: Scene | Object3D);
+    setBillboarding(position: Vector3, camera: Camera): void;
+    setTime(value: number): void;
+    setSpeaking(value: boolean): void;
+    dispose(): void;
+}

package/build/helpers/math-helpers.d.ts

@@ -1,4 +1,6 @@
-import { Vector3 } from "three";
+import { Quaternion, Vector3, Vector4 } from "three";
+export declare const roundToDecimalPlaces: (value: number, decimalPlaces: number) => number;
+export declare const toArray: (origin: Vector3 | Vector4 | Quaternion, precision?: number) => number[];
 export declare const getSpawnPositionInsideCircle: (radius: number, positions: number, id: number, yPos?: number) => Vector3;
 export declare const round: (n: number, digits: number) => number;
 export declare const ease: (target: number, n: number, factor: number) => number;

package/build/index.js

@@ -2,7 +2,21 @@
 import { PerspectiveCamera, Raycaster, Vector3 as Vector32 } from "three";
 
 // src/helpers/math-helpers.ts
-import { Vector3 } from "three";
+import { Quaternion, Vector3, Vector4 } from "three";
+var roundToDecimalPlaces = (value, decimalPlaces) => {
+  const mult = 10 ** decimalPlaces;
+  return Math.round(value * mult) / mult;
+};
+var toArray = (origin, precision = 3) => {
+  const array = [];
+  array[0] = roundToDecimalPlaces(origin.x, precision);
+  array[1] = roundToDecimalPlaces(origin.y, precision);
+  array[2] = roundToDecimalPlaces(origin.z, precision);
+  if (origin instanceof Vector4 || origin instanceof Quaternion) {
+    array[3] = roundToDecimalPlaces(origin.w, precision);
+  }
+  return array;
+};
 var getSpawnPositionInsideCircle = (radius, positions, id, yPos = 0) => {
   if (id > 0)
     id += 3;
@@ -163,7 +177,7 @@ var CameraManager = class {
 };
 
 // src/character/Character.ts
-import { Color as Color3, Vector3 as Vector34 } from "three";
+import { Color as Color3, Vector3 as Vector35 } from "three";
 
 // src/character/CharacterModel.ts
 import {
@@ -668,6 +682,7 @@ var CharacterModel = class {
     this.modelLoader = ModelLoader_default;
     this.mesh = null;
     this.material = new CharacterMaterial();
+    this.headBone = null;
     this.animations = {};
     this.animationMixer = null;
     this.currentAnimation = 0 /* idle */;
@@ -703,6 +718,9 @@ var CharacterModel = class {
     if (!this.mesh)
       return;
     this.mesh.traverse((child) => {
+      if (child.type === "Bone" && child.name === "mixamorigHeadTop_End") {
+        this.headBone = child;
+      }
       if (child.type === "SkinnedMesh" && child.name === meshName) {
         child.material = new MeshStandardMaterial({
           color: 16711680,
@@ -786,12 +804,104 @@ var CharacterModel = class {
   }
 };
 
+// src/character/CharacterSpeakingIndicator.ts
+import {
+  CircleGeometry,
+  GLSL3,
+  Mesh as Mesh2,
+  RawShaderMaterial
+} from "three";
+var CharacterSpeakingIndicator = class {
+  constructor(scene) {
+    this.scene = scene;
+    this.vertexShader = /* glsl */
+    `
+  in vec3 position;
+  in vec2 uv;
+  uniform mat4 modelViewMatrix;
+  uniform mat4 projectionMatrix;
+  out vec2 vUv;
+  void main() {
+    vUv = uv;
+    gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
+  }`;
+    this.fragmentShader = /* glsl */
+    `
+  precision highp float;
+
+  uniform float time;
+  uniform float alpha;
+  in vec2 vUv;
+  out vec4 fragColor;
+
+  const float size = 1.7;
+  const float distribution = 0.03;
+  const float speed = 0.2;
+  const float overdraw = 3.5;
+  const float shapeK = 0.25;
+
+  float sdHyperbola(vec2 p, float k, float wi) {
+    p = abs(p);
+    float k2 = k * k;
+    float a = p.x + p.y;
+    float i = 0.5 * (a - k2 / a) > wi ? -1.0 : 1.0;
+    float x = clamp(0.5 * (a - k2 / a), 0.0, wi);
+    vec2 q = vec2(x, sqrt(x * x + k2));
+    float s = sign(p.x * p.x - p.y * p.y + k2);
+    return s * length(p - q);
+  }
+
+  void main(void) {
+    vec2 uv = (vUv * 2.0 - 1.0);
+    float r = -(uv.x * uv.x + uv.y * uv.y);
+    float z = 0.5 + 0.5 * sin((r + time * speed) / distribution);
+    float a = clamp(smoothstep(-0.1, 0.2, size - length(uv * 2.0)), 0.0, 0.5);
+    float h = clamp(sdHyperbola(uv, shapeK, 1.0), 0.0, 1.0) * overdraw;
+    float fragAlpha = clamp(a * h, 0.0, 0.7);
+    fragColor = vec4(z * fragAlpha) * alpha;
+  }`;
+    this.uniforms = {
+      time: { value: 0 },
+      alpha: { value: 0 }
+    };
+    this.geometry = new CircleGeometry(0.35, 21);
+    this.material = new RawShaderMaterial({
+      vertexShader: this.vertexShader,
+      fragmentShader: this.fragmentShader,
+      uniforms: this.uniforms,
+      transparent: true,
+      glslVersion: GLSL3
+    });
+    this.mesh = new Mesh2(this.geometry, this.material);
+    this.currentAlpha = 0;
+    this.targetAlpha = 0;
+    this.scene.add(this.mesh);
+  }
+  setBillboarding(position, camera) {
+    this.mesh.position.set(position.x, position.y - 0.15, position.z);
+    this.mesh.lookAt(camera.position);
+  }
+  setTime(value) {
+    this.currentAlpha += ease(this.targetAlpha, this.currentAlpha, 0.06);
+    this.uniforms.time.value = value;
+    this.uniforms.alpha.value = this.currentAlpha;
+  }
+  setSpeaking(value) {
+    this.targetAlpha = value === true ? 1 : 0;
+  }
+  dispose() {
+    this.scene.remove(this.mesh);
+    this.mesh.material.dispose();
+    this.mesh.geometry.dispose();
+  }
+};
+
 // src/character/CharacterTooltip.ts
 import {
   Color as Color2,
   FrontSide,
   LinearFilter as LinearFilter2,
-  Mesh as Mesh2,
+  Mesh as Mesh3,
   MeshBasicMaterial as MeshBasicMaterial2,
   PlaneGeometry
 } from "three";
@@ -941,7 +1051,7 @@ var CharacterTooltip = class {
     });
     this.material.side = FrontSide;
     this.geometry = new PlaneGeometry(1, 1, 1, 1);
-    this.mesh = new Mesh2(this.geometry, this.material);
+    this.mesh = new Mesh3(this.geometry, this.material);
     this.mesh.position.set(0, 1.6, 0);
     this.mesh.visible = false;
     parentModel.add(this.mesh);
@@ -1024,7 +1134,7 @@ var CharacterTooltip = class {
 };
 
 // src/character/LocalController.ts
-import { Line3, Matrix4, Quaternion, Raycaster as Raycaster2, Vector3 as Vector33 } from "three";
+import { Line3, Matrix4, Quaternion as Quaternion2, Raycaster as Raycaster2, Vector3 as Vector34 } from "three";
 var LocalController = class {
   constructor(model, id, collisionsManager, keyInputManager, cameraManager, timeManager) {
     this.model = model;
@@ -1036,7 +1146,7 @@ var LocalController = class {
     this.collisionDetectionSteps = 15;
     this.capsuleInfo = {
       radius: 0.4,
-      segment: new Line3(new Vector33(), new Vector33(0, 1.05, 0))
+      segment: new Line3(new Vector34(), new Vector34(0, 1.05, 0))
     };
     this.maxWalkSpeed = 6;
     this.maxRunSpeed = 8.5;
@@ -1049,15 +1159,15 @@ var LocalController = class {
     this.characterWasOnGround = false;
     this.characterAirborneSince = 0;
     this.currentHeight = 0;
-    this.characterVelocity = new Vector33();
-    this.vectorUp = new Vector33(0, 1, 0);
-    this.vectorDown = new Vector33(0, -1, 0);
+    this.characterVelocity = new Vector34();
+    this.vectorUp = new Vector34(0, 1, 0);
+    this.vectorDown = new Vector34(0, -1, 0);
     this.rotationOffset = 0;
     this.azimuthalAngle = 0;
     this.tempMatrix = new Matrix4();
     this.tempSegment = new Line3();
-    this.tempVector = new Vector33();
-    this.tempVector2 = new Vector33();
+    this.tempVector = new Vector34();
+    this.tempVector2 = new Vector34();
     this.rayCaster = new Raycaster2();
     this.thirdPersonCamera = null;
     this.speed = 0;
@@ -1145,7 +1255,7 @@ var LocalController = class {
     const camToModelDistance = this.thirdPersonCamera.position.distanceTo(this.model.mesh.position);
     const isCameraFirstPerson = camToModelDistance < 2;
     if (isCameraFirstPerson) {
-      const cameraForward = new Vector33(0, 0, 1).applyQuaternion(this.thirdPersonCamera.quaternion);
+      const cameraForward = new Vector34(0, 0, 1).applyQuaternion(this.thirdPersonCamera.quaternion);
       this.azimuthalAngle = Math.atan2(cameraForward.x, cameraForward.z);
     } else {
       this.azimuthalAngle = Math.atan2(
@@ -1166,7 +1276,7 @@ var LocalController = class {
       return;
     this.updateRotationOffset();
     this.updateAzimuthalAngle();
-    const rotationQuaternion = new Quaternion();
+    const rotationQuaternion = new Quaternion2();
     rotationQuaternion.setFromAxisAngle(this.vectorUp, this.azimuthalAngle + this.rotationOffset);
     const angularDifference = this.computeAngularDifference(rotationQuaternion);
     const desiredTime = 0.07;
@@ -1204,19 +1314,19 @@ var LocalController = class {
     this.model.mesh.position.addScaledVector(this.characterVelocity, deltaTime);
     this.tempVector.set(0, 0, 0);
     if (this.forward) {
-      const forward = new Vector33(0, 0, -1).applyAxisAngle(this.vectorUp, this.azimuthalAngle);
+      const forward = new Vector34(0, 0, -1).applyAxisAngle(this.vectorUp, this.azimuthalAngle);
       this.tempVector.add(forward);
     }
     if (this.backward) {
-      const backward = new Vector33(0, 0, 1).applyAxisAngle(this.vectorUp, this.azimuthalAngle);
+      const backward = new Vector34(0, 0, 1).applyAxisAngle(this.vectorUp, this.azimuthalAngle);
       this.tempVector.add(backward);
     }
     if (this.left) {
-      const left = new Vector33(-1, 0, 0).applyAxisAngle(this.vectorUp, this.azimuthalAngle);
+      const left = new Vector34(-1, 0, 0).applyAxisAngle(this.vectorUp, this.azimuthalAngle);
       this.tempVector.add(left);
     }
     if (this.right) {
-      const right = new Vector33(1, 0, 0).applyAxisAngle(this.vectorUp, this.azimuthalAngle);
+      const right = new Vector34(1, 0, 0).applyAxisAngle(this.vectorUp, this.azimuthalAngle);
       this.tempVector.add(right);
     }
     if (this.tempVector.length() > 0) {
@@ -1253,13 +1363,13 @@ var LocalController = class {
     if (!((_a = this.model) == null ? void 0 : _a.mesh)) {
       this.networkState = {
         id: this.id,
-        position: new Vector33(),
+        position: new Vector34(),
         rotation: { quaternionY: 0, quaternionW: 1 },
         state: 0 /* idle */
       };
     } else {
-      const characterQuaternion = this.model.mesh.getWorldQuaternion(new Quaternion());
-      const positionUpdate = new Vector33(
+      const characterQuaternion = this.model.mesh.getWorldQuaternion(new Quaternion2());
+      const positionUpdate = new Vector34(
         this.model.mesh.position.x,
         this.model.mesh.position.y,
         this.model.mesh.position.z
@@ -1284,7 +1394,7 @@ var LocalController = class {
 
 // src/character/Character.ts
 var Character = class {
-  constructor(characterDescription, id, isLocal, modelLoadedCallback, collisionsManager, keyInputManager, cameraManager, timeManager) {
+  constructor(characterDescription, id, isLocal, modelLoadedCallback, collisionsManager, keyInputManager, cameraManager, timeManager, composer) {
     this.characterDescription = characterDescription;
     this.id = id;
     this.isLocal = isLocal;
@@ -1293,12 +1403,14 @@ var Character = class {
     this.keyInputManager = keyInputManager;
     this.cameraManager = cameraManager;
     this.timeManager = timeManager;
+    this.composer = composer;
     this.controller = null;
     this.name = null;
     this.model = null;
     this.color = new Color3();
-    this.position = new Vector34();
+    this.position = new Vector35();
     this.tooltip = null;
+    this.speakingIndicator = null;
     this.load();
   }
   async load() {
@@ -1307,6 +1419,9 @@ var Character = class {
     if (this.tooltip === null) {
       this.tooltip = new CharacterTooltip(this.model.mesh);
     }
+    if (this.speakingIndicator === null) {
+      this.speakingIndicator = new CharacterSpeakingIndicator(this.composer.postPostScene);
+    }
     this.color = this.model.material.colorsCube216[this.id];
     if (this.isLocal) {
       this.controller = new LocalController(
@@ -1321,11 +1436,21 @@ var Character = class {
     this.modelLoadedCallback();
   }
   update(time) {
+    var _a;
     if (!this.model)
       return;
     if (this.tooltip) {
       this.tooltip.update(this.cameraManager.camera);
     }
+    if (this.speakingIndicator) {
+      this.speakingIndicator.setTime(time);
+      if (this.model.mesh && this.model.headBone) {
+        this.speakingIndicator.setBillboarding(
+          (_a = this.model.headBone) == null ? void 0 : _a.getWorldPosition(new Vector35()),
+          this.cameraManager.camera
+        );
+      }
+    }
     this.model.mesh.getWorldPosition(this.position);
     if (typeof this.model.material.uniforms.time !== "undefined") {
       this.model.material.uniforms.time.value = time;
@@ -1336,14 +1461,14 @@ var Character = class {
 };
 
 // src/character/CharacterManager.ts
-import { Group, Vector3 as Vector36 } from "three";
+import { Group, Vector3 as Vector37 } from "three";
 
 // src/character/RemoteController.ts
 import {
   AnimationMixer as AnimationMixer2,
-  Object3D as Object3D4,
-  Quaternion as Quaternion2,
-  Vector3 as Vector35
+  Object3D as Object3D5,
+  Quaternion as Quaternion3,
+  Vector3 as Vector36
 } from "three";
 var RemoteController = class {
   constructor(character, id) {
@@ -1351,7 +1476,7 @@ var RemoteController = class {
     this.id = id;
     this.modelLoader = ModelLoader_default;
     this.characterModel = null;
-    this.animationMixer = new AnimationMixer2(new Object3D4());
+    this.animationMixer = new AnimationMixer2(new Object3D5());
     this.animations = /* @__PURE__ */ new Map();
     this.currentAnimation = 0 /* idle */;
     this.characterModel = this.character.model.mesh;
@@ -1399,8 +1524,8 @@ var RemoteController = class {
     if (!this.characterModel)
       return;
     const { position, rotation, state } = clientUpdate;
-    this.characterModel.position.lerp(new Vector35(position.x, position.y, position.z), 0.15);
-    const rotationQuaternion = new Quaternion2(0, rotation.quaternionY, 0, rotation.quaternionW);
+    this.characterModel.position.lerp(new Vector36(position.x, position.y, position.z), 0.15);
+    const rotationQuaternion = new Quaternion3(0, rotation.quaternionY, 0, rotation.quaternionW);
     this.characterModel.quaternion.slerp(rotationQuaternion, 0.6);
     if (state !== this.currentAnimation) {
       this.transitionToAnimation(state);
@@ -1411,10 +1536,10 @@ var RemoteController = class {
 // src/character/CharacterManager.ts
 function encodeCharacterAndCamera(character, camera) {
   return [
-    ...character.position.toArray(),
-    ...character.quaternion.toArray(),
-    ...camera.position.toArray(),
-    ...camera.quaternion.toArray()
+    ...toArray(character.position),
+    ...toArray(character.quaternion),
+    ...toArray(camera.position),
+    ...toArray(camera.quaternion)
   ].join(",");
 }
 function decodeCharacterAndCamera(hash, character, camera) {
@@ -1425,7 +1550,8 @@ function decodeCharacterAndCamera(hash, character, camera) {
   camera.quaternion.fromArray(values.slice(10, 14));
 }
 var CharacterManager = class {
-  constructor(collisionsManager, cameraManager, timeManager, inputManager, clientStates, sendUpdate) {
+  constructor(composer, collisionsManager, cameraManager, timeManager, inputManager, clientStates, sendUpdate) {
+    this.composer = composer;
     this.collisionsManager = collisionsManager;
     this.cameraManager = cameraManager;
     this.timeManager = timeManager;
@@ -1438,6 +1564,7 @@ var CharacterManager = class {
       can be trapped).
     */
     this.updateLocationHash = false;
+    this.id = 0;
     this.loadingCharacters = /* @__PURE__ */ new Map();
     this.remoteCharacters = /* @__PURE__ */ new Map();
     this.remoteCharacterControllers = /* @__PURE__ */ new Map();
@@ -1445,6 +1572,7 @@ var CharacterManager = class {
     this.character = null;
     this.cameraOffsetTarget = 0;
     this.cameraOffset = 0;
+    this.speakingCharacters = /* @__PURE__ */ new Map();
     this.group = new Group();
   }
   /* TODO: 
@@ -1453,7 +1581,7 @@ var CharacterManager = class {
       the mesh loading async (would allow us to show a nameplate where a remote
       user is before the asset loads).
   */
-  spawnCharacter(characterDescription, id, isLocal = false, spawnPosition = new Vector36()) {
+  spawnCharacter(characterDescription, id, isLocal = false, spawnPosition = new Vector37()) {
     this.characterDescription = characterDescription;
     const characterLoadingPromise = new Promise((resolve) => {
       const character = new Character(
@@ -1491,6 +1619,7 @@ var CharacterManager = class {
           }
           this.group.add(character.model.mesh);
           if (isLocal) {
+            this.id = id;
             this.character = character;
             (_e = this.character.tooltip) == null ? void 0 : _e.setText(`${id}`);
           } else {
@@ -1525,7 +1654,8 @@ var CharacterManager = class {
         this.collisionsManager,
         this.inputManager,
         this.cameraManager,
-        this.timeManager
+        this.timeManager,
+        this.composer
       );
     });
     this.loadingCharacters.set(id, characterLoadingPromise);
@@ -1555,14 +1685,20 @@ var CharacterManager = class {
     }
     this.loadingCharacters.clear();
   }
+  setSpeakingCharacter(id, value) {
+    this.speakingCharacters.set(id, value);
+  }
   update() {
-    var _a;
+    var _a, _b, _c, _d;
     if (this.character) {
       this.character.update(this.timeManager.time);
-      if ((_a = this.character.model) == null ? void 0 : _a.mesh) {
+      if (this.speakingCharacters.has(this.id)) {
+        (_a = this.character.speakingIndicator) == null ? void 0 : _a.setSpeaking(this.speakingCharacters.get(this.id));
+      }
+      if ((_b = this.character.model) == null ? void 0 : _b.mesh) {
         this.cameraOffsetTarget = this.cameraManager.targetDistance <= 0.4 ? 0.13 : 0;
         this.cameraOffset += ease(this.cameraOffsetTarget, this.cameraOffset, 0.1);
-        const targetOffset = new Vector36(0, 1.3, this.cameraOffset);
+        const targetOffset = new Vector37(0, 1.3, this.cameraOffset);
         targetOffset.applyQuaternion(this.character.model.mesh.quaternion);
         this.cameraManager.setTarget(this.character.position.add(targetOffset));
       }
@@ -1573,13 +1709,17 @@ var CharacterManager = class {
         }
       }
       for (const [id, update] of this.clientStates) {
+        if (this.remoteCharacters.has(id) && this.speakingCharacters.has(id)) {
+          const character = this.remoteCharacters.get(id);
+          (_c = character == null ? void 0 : character.speakingIndicator) == null ? void 0 : _c.setSpeaking(this.speakingCharacters.get(id));
+        }
         const { position } = update;
         if (!this.remoteCharacters.has(id) && !this.loadingCharacters.has(id)) {
           this.spawnCharacter(
             this.characterDescription,
             id,
             false,
-            new Vector36(position.x, position.y, position.z)
+            new Vector37(position.x, position.y, position.z)
           ).then((_character) => {
             this.loadingCharacters.delete(id);
           });
@@ -1591,6 +1731,7 @@ var CharacterManager = class {
       }
       for (const [id, character] of this.remoteCharacters) {
         if (!this.clientStates.has(id)) {
+          (_d = character.speakingIndicator) == null ? void 0 : _d.dispose();
           this.group.remove(character.model.mesh);
           this.remoteCharacters.delete(id);
           this.remoteCharacterControllers.delete(id);
@@ -1752,13 +1893,14 @@ import {
   LinearSRGBColorSpace,
   LoadingManager as LoadingManager2,
   PMREMGenerator,
+  Scene as Scene3,
   Vector2 as Vector22,
   WebGLRenderer as WebGLRenderer2
 } from "three";
 import { RGBELoader } from "three/examples/jsm/loaders/RGBELoader.js";
 
 // src/sun/Sun.ts
-import { CameraHelper, Color as Color4, DirectionalLight, Group as Group3, OrthographicCamera, Vector3 as Vector37 } from "three";
+import { CameraHelper, Color as Color4, DirectionalLight, Group as Group3, OrthographicCamera, Vector3 as Vector38 } from "three";
 
 // src/tweakpane/blades/environmentFolder.ts
 var sunValues = {
@@ -1920,7 +2062,7 @@ var Sun = class extends Group3 {
   constructor() {
     super();
     this.debug = false;
-    this.sunOffset = new Vector37(
+    this.sunOffset = new Vector38(
       39 * (Math.PI / 180),
       50 * (Math.PI / 180),
       100
@@ -1947,7 +2089,7 @@ var Sun = class extends Group3 {
     this.directionalLight.shadow.mapSize.set(this.shadowResolution, this.shadowResolution);
     this.directionalLight.castShadow = true;
     this.setColor();
-    this.updateCharacterPosition(new Vector37(0, 0, 0));
+    this.updateCharacterPosition(new Vector38(0, 0, 0));
     this.add(this.directionalLight);
     if (this.debug === true && this.camHelper instanceof CameraHelper) {
       this.add(this.camHelper);
@@ -1985,7 +2127,7 @@ var Sun = class extends Group3 {
     if (!this.target)
       return;
     const distance = this.sunOffset.z;
-    const sphericalPosition = new Vector37(
+    const sphericalPosition = new Vector38(
       distance * Math.sin(polarAngle) * Math.cos(azimuthalAngle),
       distance * Math.cos(polarAngle),
       distance * Math.sin(polarAngle) * Math.sin(azimuthalAngle)
@@ -2896,6 +3038,7 @@ var Composer = class {
     this.ambientLight = null;
     this.sun = null;
     this.scene = scene;
+    this.postPostScene = new Scene3();
     this.camera = camera;
     this.spawnSun = spawnSun;
     this.renderer = new WebGLRenderer2({
@@ -3054,6 +3197,7 @@ var Composer = class {
     this.gaussGrainEffect.uniforms.time.value = timeManager.time;
     this.gaussGrainEffect.uniforms.alpha.value = 1;
     this.composer.render();
+    this.renderer.render(this.postPostScene, this.camera);
     if (this.tweakPane.guiVisible) {
       this.tweakPane.updateStats(timeManager);
     }
@@ -3192,10 +3336,10 @@ import {
   Group as Group4,
   Line3 as Line32,
   Matrix4 as Matrix42,
-  Mesh as Mesh3,
+  Mesh as Mesh4,
   MeshBasicMaterial as MeshBasicMaterial3,
   Ray,
-  Vector3 as Vector38
+  Vector3 as Vector39
 } from "three";
 import { VertexNormalsHelper } from "three/examples/jsm/helpers/VertexNormalsHelper.js";
 import * as BufferGeometryUtils from "three/examples/jsm/utils/BufferGeometryUtils.js";
@@ -3203,9 +3347,9 @@ import { MeshBVH, MeshBVHVisualizer } from "three-mesh-bvh";
 var CollisionsManager = class {
   constructor(scene) {
     this.debug = false;
-    this.tempVector = new Vector38();
-    this.tempVector2 = new Vector38();
-    this.tempVector3 = new Vector38();
+    this.tempVector = new Vector39();
+    this.tempVector2 = new Vector39();
+    this.tempVector3 = new Vector39();
     this.tempRay = new Ray();
     this.tempMatrix = new Matrix42();
     this.tempMatrix2 = new Matrix42();
@@ -3271,7 +3415,7 @@ var CollisionsManager = class {
     };
     if (this.debug) {
       newBufferGeometry.boundsTree = meshBVH;
-      const wireframeMesh = new Mesh3(newBufferGeometry, new MeshBasicMaterial3({ wireframe: true }));
+      const wireframeMesh = new Mesh4(newBufferGeometry, new MeshBasicMaterial3({ wireframe: true }));
       const normalsHelper = new VertexNormalsHelper(wireframeMesh, 0.25, 65280);
       const visualizer = new MeshBVHVisualizer(wireframeMesh, 4);
       visualizer.edgeMaterial.color = new Color7("blue");
@@ -3354,7 +3498,7 @@ var CollisionsManager = class {
         const realDistance = intersectionSegment.distance();
         if (realDistance < capsuleRadius) {
           if (!collisionPosition) {
-            collisionPosition = new Vector38().copy(closestPointOnSegment).applyMatrix4(meshState.matrix);
+            collisionPosition = new Vector39().copy(closestPointOnSegment).applyMatrix4(meshState.matrix);
           }
           const ratio = realDistance / modelReferenceDistance;
           const realDepth = capsuleRadius - realDistance;