@mml-io/3d-web-experience-client 0.16.0 → 0.18.0

package/build/Networked3dWebExperienceClient.d.ts

@@ -1,4 +1,6 @@
-import { AnimationConfig } from "@mml-io/3d-web-client-core";
+import { AvatarType } from "@mml-io/3d-web-avatar-selection-ui";
+import { AnimationConfig, EnvironmentConfiguration } from "@mml-io/3d-web-client-core";
+import { StringToHslOptions } from "@mml-io/3d-web-text-chat";
 type MMLDocumentConfiguration = {
     url: string;
     position?: {
@@ -17,21 +19,33 @@ type MMLDocumentConfiguration = {
         z: number;
     };
 };
+export type AvatarConfiguration = {
+    availableAvatars?: Array<AvatarType>;
+    allowCustomAvatars?: boolean;
+};
 export type Networked3dWebExperienceClientConfig = {
     sessionToken: string;
     chatNetworkAddress?: string;
+    chatVisibleByDefault?: boolean;
+    userNameToColorOptions?: StringToHslOptions;
+    voiceChatAddress?: string;
     userNetworkAddress: string;
     mmlDocuments?: Array<MMLDocumentConfiguration>;
     animationConfig: AnimationConfig;
-    hdrJpgUrl: string;
+    environmentConfiguration?: EnvironmentConfiguration;
+    skyboxHdrJpgUrl: string;
+    enableTweakPane?: boolean;
+    updateURLLocation?: boolean;
+    avatarConfiguration?: AvatarConfiguration;
 };
 export declare class Networked3dWebExperienceClient {
     private holderElement;
     private config;
     private element;
+    private canvasHolder;
     private scene;
     private composer;
-    private tweakPane;
+    private tweakPane?;
     private audioListener;
     private cameraManager;
     private collisionsManager;
@@ -41,26 +55,36 @@ export declare class Networked3dWebExperienceClient {
     private keyInputManager;
     private virtualJoystick;
     private mmlCompositionScene;
+    private mmlFrames;
     private clientId;
     private networkClient;
     private remoteUserStates;
     private userProfiles;
     private networkChat;
     private textChatUI;
+    private avatarSelectionUI;
     private voiceChatManager;
     private readonly latestCharacterObject;
+    private characterControllerPaneSet;
     private initialLoadCompleted;
     private loadingProgressManager;
     private loadingScreen;
+    private errorScreen?;
+    private currentRequestAnimationFrame;
     constructor(holderElement: HTMLElement, config: Networked3dWebExperienceClientConfig);
     static createFullscreenHolder(): HTMLDivElement;
     private resolveCharacterData;
     private updateUserProfile;
+    private updateUserAvatar;
     private sendChatMessageToServer;
+    private sendIdentityUpdateToServer;
     private connectToVoiceChat;
     private connectToTextChat;
+    private mountAvatarSelectionUI;
     update(): void;
     private spawnCharacter;
+    private disposeWithError;
+    dispose(): void;
     private setupMMLScene;
 }
 export {};

package/build/index.js

@@ -1,4 +1,5 @@
 // src/Networked3dWebExperienceClient.ts
+import { AvatarSelectionUI } from "@mml-io/3d-web-avatar-selection-ui";
 import {
   CameraManager,
   CharacterManager,
@@ -6,17 +7,24 @@ import {
   CollisionsManager,
   Composer,
   decodeCharacterAndCamera,
+  ErrorScreen,
   getSpawnPositionInsideCircle,
+  GroundPlane,
   KeyInputManager,
+  LoadingScreen,
   MMLCompositionScene,
   TimeManager,
   TweakPane,
-  GroundPlane,
-  LoadingScreen,
   VirtualJoystick
 } from "@mml-io/3d-web-client-core";
-import { ChatNetworkingClient, TextChatUI } from "@mml-io/3d-web-text-chat";
 import {
+  ChatNetworkingClient,
+  TextChatUI
+} from "@mml-io/3d-web-text-chat";
+import {
+  AUTHENTICATION_FAILED_ERROR_TYPE,
+  CONNECTION_LIMIT_REACHED_ERROR_TYPE,
+  USER_UPDATE_MESSAGE_TYPE,
   UserNetworkingClient,
   WebsocketStatus
 } from "@mml-io/3d-web-user-networking";
@@ -37,17 +45,22 @@ var Networked3dWebExperienceClient = class {
     this.characterModelLoader = new CharacterModelLoader();
     this.timeManager = new TimeManager();
     this.keyInputManager = new KeyInputManager();
+    this.mmlFrames = [];
     this.clientId = null;
     this.remoteUserStates = /* @__PURE__ */ new Map();
     this.userProfiles = /* @__PURE__ */ new Map();
     this.networkChat = null;
     this.textChatUI = null;
+    this.avatarSelectionUI = null;
     this.voiceChatManager = null;
     this.latestCharacterObject = {
       characterState: null
     };
+    this.characterControllerPaneSet = false;
     this.initialLoadCompleted = false;
     this.loadingProgressManager = new LoadingProgressManager();
+    this.currentRequestAnimationFrame = null;
+    var _a;
     this.element = document.createElement("div");
     this.element.style.position = "absolute";
     this.element.style.width = "100%";
@@ -58,7 +71,12 @@ var Networked3dWebExperienceClient = class {
         this.audioListener.context.resume();
       }
     });
-    this.cameraManager = new CameraManager(this.element, this.collisionsManager);
+    this.canvasHolder = document.createElement("div");
+    this.canvasHolder.style.position = "absolute";
+    this.canvasHolder.style.width = "100%";
+    this.canvasHolder.style.height = "100%";
+    this.element.appendChild(this.canvasHolder);
+    this.cameraManager = new CameraManager(this.canvasHolder, this.collisionsManager);
     this.cameraManager.camera.add(this.audioListener);
     this.virtualJoystick = new VirtualJoystick(this.element, {
       radius: 70,
@@ -67,16 +85,24 @@ var Networked3dWebExperienceClient = class {
       y: 0,
       mouse_support: false
     });
-    this.composer = new Composer(this.scene, this.cameraManager.camera, true);
-    this.composer.useHDRJPG(this.config.hdrJpgUrl);
-    this.element.appendChild(this.composer.renderer.domElement);
-    this.tweakPane = new TweakPane(
-      this.element,
-      this.composer.renderer,
-      this.scene,
-      this.composer.effectComposer
-    );
-    this.composer.setupTweakPane(this.tweakPane);
+    this.composer = new Composer({
+      scene: this.scene,
+      camera: this.cameraManager.camera,
+      spawnSun: true,
+      environmentConfiguration: this.config.environmentConfiguration
+    });
+    this.composer.useHDRJPG(this.config.skyboxHdrJpgUrl);
+    this.canvasHolder.appendChild(this.composer.renderer.domElement);
+    if (this.config.enableTweakPane !== false) {
+      this.tweakPane = new TweakPane(
+        this.element,
+        this.composer.renderer,
+        this.scene,
+        this.composer.effectComposer
+      );
+      this.cameraManager.setupTweakPane(this.tweakPane);
+      this.composer.setupTweakPane(this.tweakPane);
+    }
     const resizeObserver = new ResizeObserver(() => {
       this.composer.fitContainer();
     });
@@ -115,6 +141,16 @@ var Networked3dWebExperienceClient = class {
           username,
           characterDescription
         });
+      },
+      onServerError: (error) => {
+        switch (error.errorType) {
+          case AUTHENTICATION_FAILED_ERROR_TYPE:
+            this.disposeWithError(error.message);
+            break;
+          case CONNECTION_LIMIT_REACHED_ERROR_TYPE:
+            this.disposeWithError(error.message);
+            break;
+        }
       }
     });
     this.characterManager = new CharacterManager({
@@ -133,21 +169,25 @@ var Networked3dWebExperienceClient = class {
       animationConfig: this.config.animationConfig,
       characterResolve: (characterId) => {
         return this.resolveCharacterData(characterId);
-      }
+      },
+      updateURLLocation: this.config.updateURLLocation !== false
     });
     this.scene.add(this.characterManager.group);
-    const groundPlane = new GroundPlane();
-    this.collisionsManager.addMeshesGroup(groundPlane);
-    this.scene.add(groundPlane);
+    if (((_a = this.config.environmentConfiguration) == null ? void 0 : _a.groundPlane) !== false) {
+      const groundPlane = new GroundPlane();
+      this.collisionsManager.addMeshesGroup(groundPlane);
+      this.scene.add(groundPlane);
+    }
     this.setupMMLScene();
     this.loadingScreen = new LoadingScreen(this.loadingProgressManager);
-    document.body.append(this.loadingScreen.element);
+    this.element.append(this.loadingScreen.element);
     this.loadingProgressManager.addProgressCallback(() => {
       const [, completed] = this.loadingProgressManager.toRatio();
       if (completed && !this.initialLoadCompleted) {
         this.initialLoadCompleted = true;
         this.connectToVoiceChat();
         this.connectToTextChat();
+        this.mountAvatarSelectionUI();
         this.spawnCharacter();
       }
     });
@@ -179,22 +219,63 @@ var Networked3dWebExperienceClient = class {
     this.userProfiles.set(id, userData);
     this.characterManager.respawnIfPresent(id);
   }
+  updateUserAvatar(avatar) {
+    if (this.clientId === null) {
+      throw new Error("Client ID not set");
+    }
+    const user = this.userProfiles.get(this.clientId);
+    if (!user) {
+      throw new Error("User not found");
+    }
+    const newUser = {
+      ...user,
+      characterDescription: {
+        meshFileUrl: avatar.meshFileUrl ?? void 0,
+        mmlCharacterUrl: avatar.mmlCharacterUrl ?? void 0,
+        mmlCharacterString: avatar.mmlCharacterString ?? void 0
+      }
+    };
+    this.userProfiles.set(this.clientId, newUser);
+    this.updateUserProfile(this.clientId, newUser);
+  }
   sendChatMessageToServer(message) {
     this.mmlCompositionScene.onChatMessage(message);
     if (this.clientId === null || this.networkChat === null)
       return;
     this.networkChat.sendChatMessage(message);
   }
+  sendIdentityUpdateToServer(avatar) {
+    if (!this.clientId) {
+      throw new Error("Client ID not set");
+    }
+    const userProfile = this.userProfiles.get(this.clientId);
+    if (!userProfile) {
+      throw new Error("User profile not found");
+    }
+    this.networkClient.sendMessage({
+      type: USER_UPDATE_MESSAGE_TYPE,
+      userIdentity: {
+        username: userProfile.username,
+        characterDescription: {
+          mmlCharacterString: avatar.mmlCharacterString,
+          mmlCharacterUrl: avatar.mmlCharacterUrl,
+          meshFileUrl: avatar.meshFileUrl
+        }
+      }
+    });
+  }
   connectToVoiceChat() {
     if (this.clientId === null)
       return;
-    if (this.voiceChatManager === null) {
-      this.voiceChatManager = new VoiceChatManager(
-        this.element,
-        this.clientId,
-        this.remoteUserStates,
-        this.latestCharacterObject
-      );
+    if (this.voiceChatManager === null && this.config.voiceChatAddress) {
+      this.voiceChatManager = new VoiceChatManager({
+        url: this.config.voiceChatAddress,
+        holderElement: this.element,
+        userId: this.clientId,
+        remoteUserStates: this.remoteUserStates,
+        latestCharacterObj: this.latestCharacterObject,
+        autoJoin: false
+      });
     }
   }
   connectToTextChat() {
@@ -207,17 +288,20 @@ var Networked3dWebExperienceClient = class {
         throw new Error("User not found");
       }
       if (this.textChatUI === null) {
-        this.textChatUI = new TextChatUI(
-          this.element,
-          user.username,
-          this.sendChatMessageToServer.bind(this)
-        );
+        const textChatUISettings = {
+          holderElement: this.element,
+          clientname: user.username,
+          sendMessageToServerMethod: this.sendChatMessageToServer.bind(this),
+          visibleByDefault: this.config.chatVisibleByDefault,
+          stringToHslOptions: this.config.userNameToColorOptions
+        };
+        this.textChatUI = new TextChatUI(textChatUISettings);
         this.textChatUI.init();
       }
       this.networkChat = new ChatNetworkingClient({
         url: this.config.chatNetworkAddress,
         sessionToken: this.config.sessionToken,
-        websocketFactory: (url) => new WebSocket(`${url}?id=${this.clientId}`),
+        websocketFactory: (url) => new WebSocket(url),
         statusUpdateCallback: (status) => {
           if (status === WebsocketStatus.Disconnected || status === WebsocketStatus.Reconnecting) {
           }
@@ -232,8 +316,30 @@ var Networked3dWebExperienceClient = class {
       });
     }
   }
+  mountAvatarSelectionUI() {
+    var _a, _b, _c, _d, _e;
+    if (!((_b = (_a = this.config.avatarConfiguration) == null ? void 0 : _a.availableAvatars) == null ? void 0 : _b.length) && !((_c = this.config.avatarConfiguration) == null ? void 0 : _c.allowCustomAvatars)) {
+      return;
+    }
+    if (this.clientId === null) {
+      throw new Error("Client ID not set");
+    }
+    const ownIdentity = this.userProfiles.get(this.clientId);
+    if (!ownIdentity) {
+      throw new Error("Own identity not found");
+    }
+    this.avatarSelectionUI = new AvatarSelectionUI({
+      holderElement: this.element,
+      clientId: this.clientId,
+      visibleByDefault: false,
+      availableAvatars: ((_d = this.config.avatarConfiguration) == null ? void 0 : _d.availableAvatars) ?? [],
+      sendMessageToServerMethod: this.sendIdentityUpdateToServer.bind(this),
+      enableCustomAvatar: (_e = this.config.avatarConfiguration) == null ? void 0 : _e.allowCustomAvatars
+    });
+    this.avatarSelectionUI.init();
+  }
   update() {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     this.timeManager.update();
     this.characterManager.update();
     (_a = this.voiceChatManager) == null ? void 0 : _a.speakingParticipants.forEach((value, id) => {
@@ -242,10 +348,19 @@ var Networked3dWebExperienceClient = class {
     this.cameraManager.update();
     (_c = this.composer.sun) == null ? void 0 : _c.updateCharacterPosition((_b = this.characterManager.localCharacter) == null ? void 0 : _b.position);
     this.composer.render(this.timeManager);
-    if (this.tweakPane.guiVisible) {
+    if ((_d = this.tweakPane) == null ? void 0 : _d.guiVisible) {
       this.tweakPane.updateStats(this.timeManager);
+      this.tweakPane.updateCameraData(this.cameraManager);
+      if (this.characterManager.localCharacter && this.characterManager.localController) {
+        if (!this.characterControllerPaneSet) {
+          this.characterControllerPaneSet = true;
+          this.characterManager.setupTweakPane(this.tweakPane);
+        } else {
+          this.tweakPane.updateCharacterData(this.characterManager.localController);
+        }
+      }
     }
-    requestAnimationFrame(() => {
+    this.currentRequestAnimationFrame = requestAnimationFrame(() => {
       this.update();
     });
   }
@@ -281,6 +396,30 @@ var Networked3dWebExperienceClient = class {
       this.cameraManager.reverseUpdateFromPositions();
     }
   }
+  disposeWithError(message) {
+    this.dispose();
+    this.errorScreen = new ErrorScreen("An error occurred", message);
+    this.element.append(this.errorScreen.element);
+  }
+  dispose() {
+    var _a, _b, _c;
+    this.networkClient.stop();
+    (_a = this.networkChat) == null ? void 0 : _a.stop();
+    for (const mmlFrame of this.mmlFrames) {
+      mmlFrame.remove();
+    }
+    this.mmlFrames = [];
+    this.mmlCompositionScene.dispose();
+    this.composer.dispose();
+    (_b = this.tweakPane) == null ? void 0 : _b.dispose();
+    if (this.currentRequestAnimationFrame !== null) {
+      cancelAnimationFrame(this.currentRequestAnimationFrame);
+      this.currentRequestAnimationFrame = null;
+    }
+    this.cameraManager.dispose();
+    this.loadingScreen.dispose();
+    (_c = this.errorScreen) == null ? void 0 : _c.dispose();
+  }
   setupMMLScene() {
     registerCustomElementsToWindow(window);
     this.mmlCompositionScene = new MMLCompositionScene({
@@ -322,6 +461,7 @@ var Networked3dWebExperienceClient = class {
           }
         }
         document.body.appendChild(frameElement);
+        this.mmlFrames.push(frameElement);
       }
     }
     const mmlProgressManager = this.mmlCompositionScene.mmlScene.getLoadingProgressManager();

package/build/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/Networked3dWebExperienceClient.ts"],
-  "sourcesContent": ["import {\n  AnimationConfig,\n  CameraManager,\n  CharacterDescription,\n  CharacterManager,\n  CharacterModelLoader,\n  CharacterState,\n  CollisionsManager,\n  Composer,\n  decodeCharacterAndCamera,\n  getSpawnPositionInsideCircle,\n  KeyInputManager,\n  MMLCompositionScene,\n  TimeManager,\n  TweakPane,\n  GroundPlane,\n  LoadingScreen,\n  VirtualJoystick,\n} from \"@mml-io/3d-web-client-core\";\nimport { ChatNetworkingClient, FromClientChatMessage, TextChatUI } from \"@mml-io/3d-web-text-chat\";\nimport {\n  UserData,\n  UserNetworkingClient,\n  UserNetworkingClientUpdate,\n  WebsocketStatus,\n} from \"@mml-io/3d-web-user-networking\";\nimport { VoiceChatManager } from \"@mml-io/3d-web-voice-chat\";\nimport {\n  IMMLScene,\n  LoadingProgressManager,\n  registerCustomElementsToWindow,\n  setGlobalMMLScene,\n} from \"mml-web\";\nimport { AudioListener, Euler, Scene, Vector3 } from \"three\";\n\ntype MMLDocumentConfiguration = {\n  url: string;\n  position?: {\n    x: number;\n    y: number;\n    z: number;\n  };\n  rotation?: {\n    x: number;\n    y: number;\n    z: number;\n  };\n  scale?: {\n    x: number;\n    y: number;\n    z: number;\n  };\n};\n\nexport type Networked3dWebExperienceClientConfig = {\n  sessionToken: string;\n  chatNetworkAddress?: string;\n  userNetworkAddress: string;\n  mmlDocuments?: Array<MMLDocumentConfiguration>;\n  animationConfig: AnimationConfig;\n  hdrJpgUrl: string;\n};\n\nexport class Networked3dWebExperienceClient {\n  private element: HTMLDivElement;\n\n  private scene = new Scene();\n  private composer: Composer;\n  private tweakPane: TweakPane;\n  private audioListener = new AudioListener();\n\n  private cameraManager: CameraManager;\n\n  private collisionsManager = new CollisionsManager(this.scene);\n\n  private characterModelLoader = new CharacterModelLoader();\n  private characterManager: CharacterManager;\n\n  private timeManager = new TimeManager();\n\n  private keyInputManager = new KeyInputManager();\n  private virtualJoystick: VirtualJoystick;\n\n  private mmlCompositionScene: MMLCompositionScene;\n\n  private clientId: number | null = null;\n  private networkClient: UserNetworkingClient;\n  private remoteUserStates = new Map<number, CharacterState>();\n  private userProfiles = new Map<number, UserData>();\n\n  private networkChat: ChatNetworkingClient | null = null;\n  private textChatUI: TextChatUI | null = null;\n\n  private voiceChatManager: VoiceChatManager | null = null;\n  private readonly latestCharacterObject = {\n    characterState: null as null | CharacterState,\n  };\n\n  private initialLoadCompleted = false;\n  private loadingProgressManager = new LoadingProgressManager();\n  private loadingScreen: LoadingScreen;\n\n  constructor(\n    private holderElement: HTMLElement,\n    private config: Networked3dWebExperienceClientConfig,\n  ) {\n    this.element = document.createElement(\"div\");\n    this.element.style.position = \"absolute\";\n    this.element.style.width = \"100%\";\n    this.element.style.height = \"100%\";\n    this.holderElement.appendChild(this.element);\n\n    document.addEventListener(\"mousedown\", () => {\n      if (this.audioListener.context.state === \"suspended\") {\n        this.audioListener.context.resume();\n      }\n    });\n\n    this.cameraManager = new CameraManager(this.element, this.collisionsManager);\n    this.cameraManager.camera.add(this.audioListener);\n\n    this.virtualJoystick = new VirtualJoystick(this.element, {\n      radius: 70,\n      inner_radius: 20,\n      x: 70,\n      y: 0,\n      mouse_support: false,\n    });\n\n    this.composer = new Composer(this.scene, this.cameraManager.camera, true);\n    this.composer.useHDRJPG(this.config.hdrJpgUrl);\n    this.element.appendChild(this.composer.renderer.domElement);\n\n    this.tweakPane = new TweakPane(\n      this.element,\n      this.composer.renderer,\n      this.scene,\n      this.composer.effectComposer,\n    );\n    this.composer.setupTweakPane(this.tweakPane);\n\n    const resizeObserver = new ResizeObserver(() => {\n      this.composer.fitContainer();\n    });\n    resizeObserver.observe(this.element);\n\n    const initialNetworkLoadRef = {};\n    this.loadingProgressManager.addLoadingAsset(initialNetworkLoadRef, \"network\", \"network\");\n    this.networkClient = new UserNetworkingClient({\n      url: this.config.userNetworkAddress,\n      sessionToken: this.config.sessionToken,\n      websocketFactory: (url: string) => new WebSocket(url),\n      statusUpdateCallback: (status: WebsocketStatus) => {\n        if (status === WebsocketStatus.Disconnected || status === WebsocketStatus.Reconnecting) {\n          // The connection was lost after being established - the connection may be re-established with a different client ID\n          this.characterManager.clear();\n          this.remoteUserStates.clear();\n          this.clientId = null;\n        }\n      },\n      assignedIdentity: (clientId: number) => {\n        console.log(`Assigned ID: ${clientId}`);\n        this.clientId = clientId;\n        if (this.initialLoadCompleted) {\n          // Already loaded - respawn the character\n          this.spawnCharacter();\n        } else {\n          this.loadingProgressManager.completedLoadingAsset(initialNetworkLoadRef);\n        }\n      },\n      clientUpdate: (\n        remoteClientId: number,\n        userNetworkingClientUpdate: null | UserNetworkingClientUpdate,\n      ) => {\n        if (userNetworkingClientUpdate === null) {\n          this.remoteUserStates.delete(remoteClientId);\n        } else {\n          this.remoteUserStates.set(remoteClientId, userNetworkingClientUpdate);\n        }\n      },\n      clientProfileUpdated: (\n        clientId: number,\n        username: string,\n        characterDescription: CharacterDescription,\n      ): void => {\n        this.updateUserProfile(clientId, {\n          username,\n          characterDescription,\n        });\n      },\n    });\n\n    this.characterManager = new CharacterManager({\n      composer: this.composer,\n      characterModelLoader: this.characterModelLoader,\n      collisionsManager: this.collisionsManager,\n      cameraManager: this.cameraManager,\n      timeManager: this.timeManager,\n      keyInputManager: this.keyInputManager,\n      virtualJoystick: this.virtualJoystick,\n      remoteUserStates: this.remoteUserStates,\n      sendUpdate: (characterState: CharacterState) => {\n        this.latestCharacterObject.characterState = characterState;\n        this.networkClient.sendUpdate(characterState);\n      },\n      animationConfig: this.config.animationConfig,\n      characterResolve: (characterId: number) => {\n        return this.resolveCharacterData(characterId);\n      },\n    });\n    this.scene.add(this.characterManager.group);\n\n    const groundPlane = new GroundPlane();\n    this.collisionsManager.addMeshesGroup(groundPlane);\n    this.scene.add(groundPlane);\n\n    this.setupMMLScene();\n\n    this.loadingScreen = new LoadingScreen(this.loadingProgressManager);\n    document.body.append(this.loadingScreen.element);\n\n    this.loadingProgressManager.addProgressCallback(() => {\n      const [, completed] = this.loadingProgressManager.toRatio();\n      if (completed && !this.initialLoadCompleted) {\n        this.initialLoadCompleted = true;\n        /*\n         When all content (in particular MML) has loaded, spawn the character (this is to avoid the character falling\n         through as-yet-unloaded geometry)\n        */\n        this.connectToVoiceChat();\n        this.connectToTextChat();\n        this.spawnCharacter();\n      }\n    });\n    this.loadingProgressManager.setInitialLoad(true);\n  }\n\n  static createFullscreenHolder(): HTMLDivElement {\n    document.body.style.margin = \"0\";\n    document.body.style.overflow = \"hidden\";\n\n    const holder = document.createElement(\"div\");\n    holder.style.position = \"absolute\";\n    holder.style.width = \"100%\";\n    holder.style.height = \"100%\";\n    holder.style.overflow = \"hidden\";\n    document.body.appendChild(holder);\n    return holder;\n  }\n\n  private resolveCharacterData(clientId: number): {\n    username: string;\n    characterDescription: CharacterDescription;\n  } {\n    const user = this.userProfiles.get(clientId)!;\n    if (!user) {\n      throw new Error(`Failed to resolve user for clientId ${clientId}`);\n    }\n\n    return {\n      username: user.username,\n      characterDescription: user.characterDescription,\n    };\n  }\n\n  private updateUserProfile(id: number, userData: UserData) {\n    console.log(`Update user_profile for id=${id} (username=${userData.username})`);\n\n    this.userProfiles.set(id, userData);\n\n    this.characterManager.respawnIfPresent(id);\n  }\n\n  private sendChatMessageToServer(message: string): void {\n    this.mmlCompositionScene.onChatMessage(message);\n    if (this.clientId === null || this.networkChat === null) return;\n    this.networkChat.sendChatMessage(message);\n  }\n\n  private connectToVoiceChat() {\n    if (this.clientId === null) return;\n\n    if (this.voiceChatManager === null) {\n      this.voiceChatManager = new VoiceChatManager(\n        this.element,\n        this.clientId,\n        this.remoteUserStates,\n        this.latestCharacterObject,\n      );\n    }\n  }\n\n  private connectToTextChat() {\n    if (this.clientId === null) {\n      return;\n    }\n    if (this.networkChat === null && this.config.chatNetworkAddress) {\n      const user = this.userProfiles.get(this.clientId);\n      if (!user) {\n        throw new Error(\"User not found\");\n      }\n\n      if (this.textChatUI === null) {\n        this.textChatUI = new TextChatUI(\n          this.element,\n          user.username,\n          this.sendChatMessageToServer.bind(this),\n        );\n        this.textChatUI.init();\n      }\n\n      this.networkChat = new ChatNetworkingClient({\n        url: this.config.chatNetworkAddress,\n        sessionToken: this.config.sessionToken,\n        websocketFactory: (url: string) => new WebSocket(`${url}?id=${this.clientId}`),\n        statusUpdateCallback: (status: WebsocketStatus) => {\n          if (status === WebsocketStatus.Disconnected || status === WebsocketStatus.Reconnecting) {\n            // The connection was lost after being established - the connection may be re-established with a different client ID\n          }\n        },\n        clientChatUpdate: (\n          clientId: number,\n          chatNetworkingUpdate: null | FromClientChatMessage,\n        ) => {\n          if (chatNetworkingUpdate !== null && this.textChatUI !== null) {\n            const username = this.userProfiles.get(clientId)?.username || \"Unknown\";\n            this.textChatUI.addTextMessage(username, chatNetworkingUpdate.text);\n          }\n        },\n      });\n    }\n  }\n\n  public update(): void {\n    this.timeManager.update();\n    this.characterManager.update();\n    this.voiceChatManager?.speakingParticipants.forEach((value: boolean, id: number) => {\n      this.characterManager.setSpeakingCharacter(id, value);\n    });\n    this.cameraManager.update();\n    this.composer.sun?.updateCharacterPosition(this.characterManager.localCharacter?.position);\n    this.composer.render(this.timeManager);\n    if (this.tweakPane.guiVisible) {\n      this.tweakPane.updateStats(this.timeManager);\n    }\n    requestAnimationFrame(() => {\n      this.update();\n    });\n  }\n\n  private spawnCharacter() {\n    if (this.clientId === null) {\n      throw new Error(\"Client ID not set\");\n    }\n    const spawnPosition = getSpawnPositionInsideCircle(3, 30, this.clientId!, 0.4);\n    const spawnRotation = new Euler(0, 0, 0);\n    let cameraPosition: Vector3 | null = null;\n    if (window.location.hash && window.location.hash.length > 1) {\n      const urlParams = decodeCharacterAndCamera(window.location.hash.substring(1));\n      spawnPosition.copy(urlParams.character.position);\n      spawnRotation.setFromQuaternion(urlParams.character.quaternion);\n      cameraPosition = urlParams.camera.position;\n    }\n    const ownIdentity = this.userProfiles.get(this.clientId);\n    if (!ownIdentity) {\n      throw new Error(\"Own identity not found\");\n    }\n\n    this.characterManager.spawnLocalCharacter(\n      this.clientId!,\n      ownIdentity.username,\n      ownIdentity.characterDescription,\n      spawnPosition,\n      spawnRotation,\n    );\n    if (cameraPosition !== null) {\n      this.cameraManager.camera.position.copy(cameraPosition);\n      this.cameraManager.setTarget(\n        new Vector3().add(spawnPosition).add(this.characterManager.headTargetOffset),\n      );\n      this.cameraManager.reverseUpdateFromPositions();\n    }\n  }\n\n  private setupMMLScene() {\n    registerCustomElementsToWindow(window);\n    this.mmlCompositionScene = new MMLCompositionScene({\n      targetElement: this.element,\n      renderer: this.composer.renderer,\n      scene: this.scene,\n      camera: this.cameraManager.camera,\n      audioListener: this.audioListener,\n      collisionsManager: this.collisionsManager,\n      getUserPositionAndRotation: () => {\n        return this.characterManager.getLocalCharacterPositionAndRotation();\n      },\n    });\n    this.scene.add(this.mmlCompositionScene.group);\n    setGlobalMMLScene(this.mmlCompositionScene.mmlScene as IMMLScene);\n\n    if (this.config.mmlDocuments) {\n      for (const mmlDocument of this.config.mmlDocuments) {\n        const frameElement = document.createElement(\"m-frame\");\n        frameElement.setAttribute(\"src\", mmlDocument.url);\n        if (mmlDocument.position) {\n          frameElement.setAttribute(\"x\", mmlDocument.position.x.toString());\n          frameElement.setAttribute(\"y\", mmlDocument.position.y.toString());\n          frameElement.setAttribute(\"z\", mmlDocument.position.z.toString());\n        }\n        if (mmlDocument.rotation) {\n          frameElement.setAttribute(\"rx\", mmlDocument.rotation.x.toString());\n          frameElement.setAttribute(\"ry\", mmlDocument.rotation.y.toString());\n          frameElement.setAttribute(\"rz\", mmlDocument.rotation.z.toString());\n        }\n        if (mmlDocument.scale) {\n          if (mmlDocument.scale.x !== undefined) {\n            frameElement.setAttribute(\"sx\", mmlDocument.scale.x.toString());\n          }\n          if (mmlDocument.scale.y !== undefined) {\n            frameElement.setAttribute(\"sy\", mmlDocument.scale.y.toString());\n          }\n          if (mmlDocument.scale.z !== undefined) {\n            frameElement.setAttribute(\"sz\", mmlDocument.scale.z.toString());\n          }\n        }\n        document.body.appendChild(frameElement);\n      }\n    }\n\n    const mmlProgressManager = this.mmlCompositionScene.mmlScene.getLoadingProgressManager!()!;\n    this.loadingProgressManager.addLoadingDocument(mmlProgressManager, \"mml\", mmlProgressManager);\n    mmlProgressManager.addProgressCallback(() => {\n      this.loadingProgressManager.updateDocumentProgress(mmlProgressManager);\n    });\n    mmlProgressManager.setInitialLoad(true);\n  }\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { AvatarSelectionUI, AvatarType } from \"@mml-io/3d-web-avatar-selection-ui\";\nimport {\n  AnimationConfig,\n  CameraManager,\n  CharacterDescription,\n  CharacterManager,\n  CharacterModelLoader,\n  CharacterState,\n  CollisionsManager,\n  Composer,\n  decodeCharacterAndCamera,\n  EnvironmentConfiguration,\n  ErrorScreen,\n  getSpawnPositionInsideCircle,\n  GroundPlane,\n  KeyInputManager,\n  LoadingScreen,\n  MMLCompositionScene,\n  TimeManager,\n  TweakPane,\n  VirtualJoystick,\n} from \"@mml-io/3d-web-client-core\";\nimport {\n  ChatNetworkingClient,\n  FromClientChatMessage,\n  StringToHslOptions,\n  TextChatUI,\n  TextChatUIProps,\n} from \"@mml-io/3d-web-text-chat\";\nimport {\n  AUTHENTICATION_FAILED_ERROR_TYPE,\n  CONNECTION_LIMIT_REACHED_ERROR_TYPE,\n  ServerErrorType,\n  USER_UPDATE_MESSAGE_TYPE,\n  UserData,\n  UserNetworkingClient,\n  UserNetworkingClientUpdate,\n  WebsocketStatus,\n} from \"@mml-io/3d-web-user-networking\";\nimport { VoiceChatManager } from \"@mml-io/3d-web-voice-chat\";\nimport {\n  IMMLScene,\n  LoadingProgressManager,\n  registerCustomElementsToWindow,\n  setGlobalMMLScene,\n} from \"mml-web\";\nimport { AudioListener, Euler, Scene, Vector3 } from \"three\";\n\ntype MMLDocumentConfiguration = {\n  url: string;\n  position?: {\n    x: number;\n    y: number;\n    z: number;\n  };\n  rotation?: {\n    x: number;\n    y: number;\n    z: number;\n  };\n  scale?: {\n    x: number;\n    y: number;\n    z: number;\n  };\n};\n\nexport type AvatarConfiguration = {\n  availableAvatars?: Array<AvatarType>;\n  allowCustomAvatars?: boolean;\n};\n\nexport type Networked3dWebExperienceClientConfig = {\n  sessionToken: string;\n  chatNetworkAddress?: string;\n  chatVisibleByDefault?: boolean;\n  userNameToColorOptions?: StringToHslOptions;\n  voiceChatAddress?: string;\n  userNetworkAddress: string;\n  mmlDocuments?: Array<MMLDocumentConfiguration>;\n  animationConfig: AnimationConfig;\n  environmentConfiguration?: EnvironmentConfiguration;\n  skyboxHdrJpgUrl: string;\n  enableTweakPane?: boolean;\n  updateURLLocation?: boolean;\n  avatarConfiguration?: AvatarConfiguration;\n};\n\nexport class Networked3dWebExperienceClient {\n  private element: HTMLDivElement;\n  private canvasHolder: HTMLDivElement;\n\n  private scene = new Scene();\n  private composer: Composer;\n  private tweakPane?: TweakPane;\n  private audioListener = new AudioListener();\n\n  private cameraManager: CameraManager;\n\n  private collisionsManager = new CollisionsManager(this.scene);\n\n  private characterModelLoader = new CharacterModelLoader();\n  private characterManager: CharacterManager;\n\n  private timeManager = new TimeManager();\n\n  private keyInputManager = new KeyInputManager();\n  private virtualJoystick: VirtualJoystick;\n\n  private mmlCompositionScene: MMLCompositionScene;\n  private mmlFrames: Array<HTMLElement> = [];\n\n  private clientId: number | null = null;\n  private networkClient: UserNetworkingClient;\n  private remoteUserStates = new Map<number, CharacterState>();\n  private userProfiles = new Map<number, UserData>();\n\n  private networkChat: ChatNetworkingClient | null = null;\n  private textChatUI: TextChatUI | null = null;\n\n  private avatarSelectionUI: AvatarSelectionUI | null = null;\n\n  private voiceChatManager: VoiceChatManager | null = null;\n  private readonly latestCharacterObject = {\n    characterState: null as null | CharacterState,\n  };\n  private characterControllerPaneSet: boolean = false;\n\n  private initialLoadCompleted = false;\n  private loadingProgressManager = new LoadingProgressManager();\n  private loadingScreen: LoadingScreen;\n  private errorScreen?: ErrorScreen;\n  private currentRequestAnimationFrame: number | null = null;\n\n  constructor(\n    private holderElement: HTMLElement,\n    private config: Networked3dWebExperienceClientConfig,\n  ) {\n    this.element = document.createElement(\"div\");\n    this.element.style.position = \"absolute\";\n    this.element.style.width = \"100%\";\n    this.element.style.height = \"100%\";\n    this.holderElement.appendChild(this.element);\n\n    document.addEventListener(\"mousedown\", () => {\n      if (this.audioListener.context.state === \"suspended\") {\n        this.audioListener.context.resume();\n      }\n    });\n\n    this.canvasHolder = document.createElement(\"div\");\n    this.canvasHolder.style.position = \"absolute\";\n    this.canvasHolder.style.width = \"100%\";\n    this.canvasHolder.style.height = \"100%\";\n    this.element.appendChild(this.canvasHolder);\n\n    this.cameraManager = new CameraManager(this.canvasHolder, this.collisionsManager);\n    this.cameraManager.camera.add(this.audioListener);\n\n    this.virtualJoystick = new VirtualJoystick(this.element, {\n      radius: 70,\n      inner_radius: 20,\n      x: 70,\n      y: 0,\n      mouse_support: false,\n    });\n\n    this.composer = new Composer({\n      scene: this.scene,\n      camera: this.cameraManager.camera,\n      spawnSun: true,\n      environmentConfiguration: this.config.environmentConfiguration,\n    });\n\n    this.composer.useHDRJPG(this.config.skyboxHdrJpgUrl);\n    this.canvasHolder.appendChild(this.composer.renderer.domElement);\n\n    if (this.config.enableTweakPane !== false) {\n      this.tweakPane = new TweakPane(\n        this.element,\n        this.composer.renderer,\n        this.scene,\n        this.composer.effectComposer,\n      );\n      this.cameraManager.setupTweakPane(this.tweakPane);\n      this.composer.setupTweakPane(this.tweakPane);\n    }\n\n    const resizeObserver = new ResizeObserver(() => {\n      this.composer.fitContainer();\n    });\n    resizeObserver.observe(this.element);\n\n    const initialNetworkLoadRef = {};\n    this.loadingProgressManager.addLoadingAsset(initialNetworkLoadRef, \"network\", \"network\");\n    this.networkClient = new UserNetworkingClient({\n      url: this.config.userNetworkAddress,\n      sessionToken: this.config.sessionToken,\n      websocketFactory: (url: string) => new WebSocket(url),\n      statusUpdateCallback: (status: WebsocketStatus) => {\n        if (status === WebsocketStatus.Disconnected || status === WebsocketStatus.Reconnecting) {\n          // The connection was lost after being established - the connection may be re-established with a different client ID\n          this.characterManager.clear();\n          this.remoteUserStates.clear();\n          this.clientId = null;\n        }\n      },\n      assignedIdentity: (clientId: number) => {\n        console.log(`Assigned ID: ${clientId}`);\n        this.clientId = clientId;\n        if (this.initialLoadCompleted) {\n          // Already loaded - respawn the character\n          this.spawnCharacter();\n        } else {\n          this.loadingProgressManager.completedLoadingAsset(initialNetworkLoadRef);\n        }\n      },\n      clientUpdate: (\n        remoteClientId: number,\n        userNetworkingClientUpdate: null | UserNetworkingClientUpdate,\n      ) => {\n        if (userNetworkingClientUpdate === null) {\n          this.remoteUserStates.delete(remoteClientId);\n        } else {\n          this.remoteUserStates.set(remoteClientId, userNetworkingClientUpdate);\n        }\n      },\n      clientProfileUpdated: (\n        clientId: number,\n        username: string,\n        characterDescription: CharacterDescription,\n      ): void => {\n        this.updateUserProfile(clientId, {\n          username,\n          characterDescription,\n        });\n      },\n      onServerError: (error: { message: string; errorType: ServerErrorType }) => {\n        switch (error.errorType) {\n          case AUTHENTICATION_FAILED_ERROR_TYPE:\n            this.disposeWithError(error.message);\n            break;\n          case CONNECTION_LIMIT_REACHED_ERROR_TYPE:\n            this.disposeWithError(error.message);\n            break;\n        }\n      },\n    });\n\n    this.characterManager = new CharacterManager({\n      composer: this.composer,\n      characterModelLoader: this.characterModelLoader,\n      collisionsManager: this.collisionsManager,\n      cameraManager: this.cameraManager,\n      timeManager: this.timeManager,\n      keyInputManager: this.keyInputManager,\n      virtualJoystick: this.virtualJoystick,\n      remoteUserStates: this.remoteUserStates,\n      sendUpdate: (characterState: CharacterState) => {\n        this.latestCharacterObject.characterState = characterState;\n        this.networkClient.sendUpdate(characterState);\n      },\n      animationConfig: this.config.animationConfig,\n      characterResolve: (characterId: number) => {\n        return this.resolveCharacterData(characterId);\n      },\n      updateURLLocation: this.config.updateURLLocation !== false,\n    });\n    this.scene.add(this.characterManager.group);\n\n    if (this.config.environmentConfiguration?.groundPlane !== false) {\n      const groundPlane = new GroundPlane();\n      this.collisionsManager.addMeshesGroup(groundPlane);\n      this.scene.add(groundPlane);\n    }\n\n    this.setupMMLScene();\n\n    this.loadingScreen = new LoadingScreen(this.loadingProgressManager);\n    this.element.append(this.loadingScreen.element);\n\n    this.loadingProgressManager.addProgressCallback(() => {\n      const [, completed] = this.loadingProgressManager.toRatio();\n      if (completed && !this.initialLoadCompleted) {\n        this.initialLoadCompleted = true;\n        /*\n         When all content (in particular MML) has loaded, spawn the character (this is to avoid the character falling\n         through as-yet-unloaded geometry)\n        */\n        this.connectToVoiceChat();\n        this.connectToTextChat();\n        this.mountAvatarSelectionUI();\n        this.spawnCharacter();\n      }\n    });\n    this.loadingProgressManager.setInitialLoad(true);\n  }\n\n  static createFullscreenHolder(): HTMLDivElement {\n    document.body.style.margin = \"0\";\n    document.body.style.overflow = \"hidden\";\n\n    const holder = document.createElement(\"div\");\n    holder.style.position = \"absolute\";\n    holder.style.width = \"100%\";\n    holder.style.height = \"100%\";\n    holder.style.overflow = \"hidden\";\n    document.body.appendChild(holder);\n    return holder;\n  }\n\n  private resolveCharacterData(clientId: number): {\n    username: string;\n    characterDescription: CharacterDescription;\n  } {\n    const user = this.userProfiles.get(clientId)!;\n\n    if (!user) {\n      throw new Error(`Failed to resolve user for clientId ${clientId}`);\n    }\n\n    return {\n      username: user.username,\n      characterDescription: user.characterDescription,\n    };\n  }\n\n  private updateUserProfile(id: number, userData: UserData) {\n    console.log(`Update user_profile for id=${id} (username=${userData.username})`);\n\n    this.userProfiles.set(id, userData);\n\n    this.characterManager.respawnIfPresent(id);\n  }\n\n  private updateUserAvatar(avatar: AvatarType) {\n    if (this.clientId === null) {\n      throw new Error(\"Client ID not set\");\n    }\n    const user = this.userProfiles.get(this.clientId);\n    if (!user) {\n      throw new Error(\"User not found\");\n    }\n\n    const newUser = {\n      ...user,\n      characterDescription: {\n        meshFileUrl: avatar.meshFileUrl ?? undefined,\n        mmlCharacterUrl: avatar.mmlCharacterUrl ?? undefined,\n        mmlCharacterString: avatar.mmlCharacterString ?? undefined,\n      },\n    } as UserData;\n\n    this.userProfiles.set(this.clientId, newUser);\n    this.updateUserProfile(this.clientId, newUser);\n  }\n\n  private sendChatMessageToServer(message: string): void {\n    this.mmlCompositionScene.onChatMessage(message);\n    if (this.clientId === null || this.networkChat === null) return;\n    this.networkChat.sendChatMessage(message);\n  }\n\n  private sendIdentityUpdateToServer(avatar: AvatarType) {\n    if (!this.clientId) {\n      throw new Error(\"Client ID not set\");\n    }\n\n    const userProfile = this.userProfiles.get(this.clientId);\n\n    if (!userProfile) {\n      throw new Error(\"User profile not found\");\n    }\n\n    this.networkClient.sendMessage({\n      type: USER_UPDATE_MESSAGE_TYPE,\n      userIdentity: {\n        username: userProfile.username,\n        characterDescription: {\n          mmlCharacterString: avatar.mmlCharacterString,\n          mmlCharacterUrl: avatar.mmlCharacterUrl,\n          meshFileUrl: avatar.meshFileUrl,\n        } as CharacterDescription,\n      },\n    });\n  }\n\n  private connectToVoiceChat() {\n    if (this.clientId === null) return;\n\n    if (this.voiceChatManager === null && this.config.voiceChatAddress) {\n      this.voiceChatManager = new VoiceChatManager({\n        url: this.config.voiceChatAddress,\n        holderElement: this.element,\n        userId: this.clientId,\n        remoteUserStates: this.remoteUserStates,\n        latestCharacterObj: this.latestCharacterObject,\n        autoJoin: false,\n      });\n    }\n  }\n\n  private connectToTextChat() {\n    if (this.clientId === null) {\n      return;\n    }\n    if (this.networkChat === null && this.config.chatNetworkAddress) {\n      const user = this.userProfiles.get(this.clientId);\n      if (!user) {\n        throw new Error(\"User not found\");\n      }\n\n      if (this.textChatUI === null) {\n        const textChatUISettings: TextChatUIProps = {\n          holderElement: this.element,\n          clientname: user.username,\n          sendMessageToServerMethod: this.sendChatMessageToServer.bind(this),\n          visibleByDefault: this.config.chatVisibleByDefault,\n          stringToHslOptions: this.config.userNameToColorOptions,\n        };\n        this.textChatUI = new TextChatUI(textChatUISettings);\n        this.textChatUI.init();\n      }\n\n      this.networkChat = new ChatNetworkingClient({\n        url: this.config.chatNetworkAddress,\n        sessionToken: this.config.sessionToken,\n        websocketFactory: (url: string) => new WebSocket(url),\n        statusUpdateCallback: (status: WebsocketStatus) => {\n          if (status === WebsocketStatus.Disconnected || status === WebsocketStatus.Reconnecting) {\n            // The connection was lost after being established - the connection may be re-established with a different client ID\n          }\n        },\n        clientChatUpdate: (\n          clientId: number,\n          chatNetworkingUpdate: null | FromClientChatMessage,\n        ) => {\n          if (chatNetworkingUpdate !== null && this.textChatUI !== null) {\n            const username = this.userProfiles.get(clientId)?.username || \"Unknown\";\n            this.textChatUI.addTextMessage(username, chatNetworkingUpdate.text);\n          }\n        },\n      });\n    }\n  }\n\n  private mountAvatarSelectionUI() {\n    if (\n      !this.config.avatarConfiguration?.availableAvatars?.length &&\n      !this.config.avatarConfiguration?.allowCustomAvatars\n    ) {\n      return;\n    }\n\n    if (this.clientId === null) {\n      throw new Error(\"Client ID not set\");\n    }\n    const ownIdentity = this.userProfiles.get(this.clientId);\n    if (!ownIdentity) {\n      throw new Error(\"Own identity not found\");\n    }\n\n    this.avatarSelectionUI = new AvatarSelectionUI({\n      holderElement: this.element,\n      clientId: this.clientId,\n      visibleByDefault: false,\n      availableAvatars: this.config.avatarConfiguration?.availableAvatars ?? [],\n      sendMessageToServerMethod: this.sendIdentityUpdateToServer.bind(this),\n      enableCustomAvatar: this.config.avatarConfiguration?.allowCustomAvatars,\n    });\n    this.avatarSelectionUI.init();\n  }\n\n  public update(): void {\n    this.timeManager.update();\n    this.characterManager.update();\n    this.voiceChatManager?.speakingParticipants.forEach((value: boolean, id: number) => {\n      this.characterManager.setSpeakingCharacter(id, value);\n    });\n    this.cameraManager.update();\n    this.composer.sun?.updateCharacterPosition(this.characterManager.localCharacter?.position);\n    this.composer.render(this.timeManager);\n    if (this.tweakPane?.guiVisible) {\n      this.tweakPane.updateStats(this.timeManager);\n      this.tweakPane.updateCameraData(this.cameraManager);\n      if (this.characterManager.localCharacter && this.characterManager.localController) {\n        if (!this.characterControllerPaneSet) {\n          this.characterControllerPaneSet = true;\n          this.characterManager.setupTweakPane(this.tweakPane);\n        } else {\n          this.tweakPane.updateCharacterData(this.characterManager.localController);\n        }\n      }\n    }\n    this.currentRequestAnimationFrame = requestAnimationFrame(() => {\n      this.update();\n    });\n  }\n\n  private spawnCharacter() {\n    if (this.clientId === null) {\n      throw new Error(\"Client ID not set\");\n    }\n    const spawnPosition = getSpawnPositionInsideCircle(3, 30, this.clientId!, 0.4);\n    const spawnRotation = new Euler(0, 0, 0);\n    let cameraPosition: Vector3 | null = null;\n    if (window.location.hash && window.location.hash.length > 1) {\n      const urlParams = decodeCharacterAndCamera(window.location.hash.substring(1));\n      spawnPosition.copy(urlParams.character.position);\n      spawnRotation.setFromQuaternion(urlParams.character.quaternion);\n      cameraPosition = urlParams.camera.position;\n    }\n    const ownIdentity = this.userProfiles.get(this.clientId);\n    if (!ownIdentity) {\n      throw new Error(\"Own identity not found\");\n    }\n\n    this.characterManager.spawnLocalCharacter(\n      this.clientId!,\n      ownIdentity.username,\n      ownIdentity.characterDescription,\n      spawnPosition,\n      spawnRotation,\n    );\n\n    if (cameraPosition !== null) {\n      this.cameraManager.camera.position.copy(cameraPosition);\n      this.cameraManager.setTarget(\n        new Vector3().add(spawnPosition).add(this.characterManager.headTargetOffset),\n      );\n      this.cameraManager.reverseUpdateFromPositions();\n    }\n  }\n\n  private disposeWithError(message: string) {\n    this.dispose();\n    this.errorScreen = new ErrorScreen(\"An error occurred\", message);\n    this.element.append(this.errorScreen.element);\n  }\n\n  public dispose() {\n    this.networkClient.stop();\n    this.networkChat?.stop();\n    for (const mmlFrame of this.mmlFrames) {\n      mmlFrame.remove();\n    }\n    this.mmlFrames = [];\n    this.mmlCompositionScene.dispose();\n    this.composer.dispose();\n    this.tweakPane?.dispose();\n    if (this.currentRequestAnimationFrame !== null) {\n      cancelAnimationFrame(this.currentRequestAnimationFrame);\n      this.currentRequestAnimationFrame = null;\n    }\n    this.cameraManager.dispose();\n    this.loadingScreen.dispose();\n    this.errorScreen?.dispose();\n  }\n\n  private setupMMLScene() {\n    registerCustomElementsToWindow(window);\n    this.mmlCompositionScene = new MMLCompositionScene({\n      targetElement: this.element,\n      renderer: this.composer.renderer,\n      scene: this.scene,\n      camera: this.cameraManager.camera,\n      audioListener: this.audioListener,\n      collisionsManager: this.collisionsManager,\n      getUserPositionAndRotation: () => {\n        return this.characterManager.getLocalCharacterPositionAndRotation();\n      },\n    });\n    this.scene.add(this.mmlCompositionScene.group);\n    setGlobalMMLScene(this.mmlCompositionScene.mmlScene as IMMLScene);\n\n    if (this.config.mmlDocuments) {\n      for (const mmlDocument of this.config.mmlDocuments) {\n        const frameElement = document.createElement(\"m-frame\");\n        frameElement.setAttribute(\"src\", mmlDocument.url);\n        if (mmlDocument.position) {\n          frameElement.setAttribute(\"x\", mmlDocument.position.x.toString());\n          frameElement.setAttribute(\"y\", mmlDocument.position.y.toString());\n          frameElement.setAttribute(\"z\", mmlDocument.position.z.toString());\n        }\n        if (mmlDocument.rotation) {\n          frameElement.setAttribute(\"rx\", mmlDocument.rotation.x.toString());\n          frameElement.setAttribute(\"ry\", mmlDocument.rotation.y.toString());\n          frameElement.setAttribute(\"rz\", mmlDocument.rotation.z.toString());\n        }\n        if (mmlDocument.scale) {\n          if (mmlDocument.scale.x !== undefined) {\n            frameElement.setAttribute(\"sx\", mmlDocument.scale.x.toString());\n          }\n          if (mmlDocument.scale.y !== undefined) {\n            frameElement.setAttribute(\"sy\", mmlDocument.scale.y.toString());\n          }\n          if (mmlDocument.scale.z !== undefined) {\n            frameElement.setAttribute(\"sz\", mmlDocument.scale.z.toString());\n          }\n        }\n        document.body.appendChild(frameElement);\n        this.mmlFrames.push(frameElement);\n      }\n    }\n\n    const mmlProgressManager = this.mmlCompositionScene.mmlScene.getLoadingProgressManager!()!;\n    this.loadingProgressManager.addLoadingDocument(mmlProgressManager, \"mml\", mmlProgressManager);\n    mmlProgressManager.addProgressCallback(() => {\n      this.loadingProgressManager.updateDocumentProgress(mmlProgressManager);\n    });\n    mmlProgressManager.setInitialLoad(true);\n  }\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mml-io/3d-web-experience-client",
-  "version": "0.16.0",
+  "version": "0.18.0",
   "publishConfig": {
     "access": "public"
   },
@@ -18,15 +18,17 @@
     "lint-fix": "eslint \"./{src,test}/**/*.{js,jsx,ts,tsx}\" --fix"
   },
   "dependencies": {
-    "@mml-io/3d-web-client-core": "^0.16.0",
-    "@mml-io/3d-web-text-chat": "^0.16.0",
-    "@mml-io/3d-web-user-networking": "^0.16.0",
-    "@mml-io/3d-web-voice-chat": "^0.16.0",
+    "@mml-io/3d-web-avatar-selection-ui": "^0.18.0",
+    "@mml-io/3d-web-client-core": "^0.18.0",
+    "@mml-io/3d-web-text-chat": "^0.18.0",
+    "@mml-io/3d-web-user-networking": "^0.18.0",
+    "@mml-io/3d-web-voice-chat": "^0.18.0",
+    "mml-web": "^0.16.1",
     "three": "0.163.0"
   },
   "devDependencies": {
-    "@types/node": "^20.12.7",
+    "@types/node": "^20.14.10",
     "@types/three": "0.163.0"
   },
-  "gitHead": "c4ef44ae56497ed3cb9abaeee56be11dbc133460"
+  "gitHead": "8eb8acbdc767b15eacf3e8d62c5a0c92d2690f37"
 }