@mavonengine/core 0.0.2

package/dist/Components/TrailComponent.js

@@ -0,0 +1,73 @@
+import { BufferGeometry, Float32BufferAttribute, Line, LineBasicMaterial, Points, PointsMaterial, } from 'three';
+import Game from '../Game';
+/**
+ * Creates a trail behind the entity
+ */
+export default class TrailComponent {
+    constructor(entity, maxPoints = 50) {
+        this.points = [];
+        this.entity = entity;
+        this.maxPoints = maxPoints;
+        const startPos = entity.position.clone();
+        this.points.push({
+            position: startPos,
+            timestamp: Game.instance().clock.getElapsedTime() ?? 0,
+        });
+        if (Game.instance().debug.active) {
+            // Create Points
+            this.geometry = new BufferGeometry();
+            this.geometry.setAttribute('position', new Float32BufferAttribute(startPos.toArray(), 3));
+            const pointsMaterial = new PointsMaterial({ size: 0.1, color: 0xFFFFFF });
+            this.pointsInstance = new Points(this.geometry, pointsMaterial);
+            this.pointsInstance.frustumCulled = false;
+            Game.instance().scene.add(this.pointsInstance);
+            // Create Line
+            this.lineGeometry = new BufferGeometry();
+            this.lineGeometry.setAttribute('position', new Float32BufferAttribute(startPos.toArray(), 3));
+            const lineMaterial = new LineBasicMaterial({ color: 0xFF0000 });
+            this.lineInstance = new Line(this.lineGeometry, lineMaterial);
+            this.lineInstance.frustumCulled = false;
+            Game.instance().scene.add(this.lineInstance);
+        }
+    }
+    update(_delta) {
+        const lastPoint = this.points[this.points.length - 1];
+        const currentPosition = this.entity.position;
+        if (currentPosition.distanceTo(lastPoint.position) >= 1) {
+            const newPoint = currentPosition.clone();
+            this.points.push({
+                position: newPoint,
+                timestamp: Game.instance().clock.getElapsedTime() ?? 0,
+            });
+            if (this.points.length > this.maxPoints) {
+                this.points.shift();
+            }
+            const positions = new Float32Array(this.points.length * 3);
+            for (let i = 0; i < this.points.length; i++) {
+                positions[i * 3] = this.points[i].position.x;
+                positions[i * 3 + 1] = this.points[i].position.y;
+                positions[i * 3 + 2] = this.points[i].position.z;
+            }
+            if (this.geometry) {
+                this.geometry.setAttribute('position', new Float32BufferAttribute(positions, 3));
+                this.geometry.attributes.position.needsUpdate = true;
+            }
+            if (this.lineGeometry) {
+                this.lineGeometry.setAttribute('position', new Float32BufferAttribute(positions, 3));
+                this.lineGeometry.attributes.position.needsUpdate = true;
+            }
+        }
+    }
+    destroy() {
+        if (this.pointsInstance) {
+            Game.instance().scene.remove(this.pointsInstance);
+            this.geometry?.dispose();
+            this.pointsInstance.material.dispose();
+        }
+        if (this.lineInstance) {
+            Game.instance().scene.remove(this.lineInstance);
+            this.lineGeometry?.dispose();
+            this.lineInstance.material.dispose();
+        }
+    }
+}

package/dist/Editor/EditorHelper.cjs

@@ -0,0 +1,73 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var EditorHelper_exports = {};
+__export(EditorHelper_exports, {
+  default: () => EditorHelper
+});
+module.exports = __toCommonJS(EditorHelper_exports);
+var import_three = require("three");
+var import_Game = __toESM(require("../Game"), 1);
+var import_UILabel = __toESM(require("../ui/UILabel"), 1);
+class EditorHelper {
+  constructor(position, labelText, attachment = null) {
+    this.labelText = labelText;
+    this.attachment = attachment;
+    const geo = new import_three.OctahedronGeometry(0.35);
+    const mat = new import_three.MeshBasicMaterial({ color: 16755200, wireframe: true });
+    this.mesh = new import_three.Mesh(geo, mat);
+    this.mesh.position.copy(position);
+    this.mesh.userData.editorHelper = this;
+    this._prevPosition = position.clone();
+    this.label = new import_UILabel.default(this.mesh, labelText);
+    this.label.domElement.style.pointerEvents = "auto";
+    this.label.domElement.style.cursor = "pointer";
+    this.label.domElement.addEventListener("click", () => {
+      import_Game.default.instance().editor?.selectObject(this.mesh);
+    });
+    import_Game.default.instance().scene.add(this.mesh);
+  }
+  update(delta) {
+    this.label.update(delta);
+    if (this.attachment?.onMove && !this._prevPosition.equals(this.mesh.position)) {
+      const positionDelta = this.mesh.position.clone().sub(this._prevPosition);
+      this.attachment.onMove(positionDelta);
+      this._prevPosition.copy(this.mesh.position);
+    }
+  }
+  dispose() {
+    import_Game.default.instance().scene.remove(this.mesh);
+    this.mesh.geometry.dispose();
+    this.mesh.material.dispose();
+    this.label.destroy();
+  }
+  /** Returns the EditorHelper linked to an Object3D, or null. */
+  static from(object) {
+    return object.userData.editorHelper ?? null;
+  }
+}

package/dist/Editor/EditorHelper.d.ts

@@ -0,0 +1,55 @@
+import type { ContainerApi } from '@tweakpane/core';
+import type { Object3D, Vector3 } from 'three';
+import { Mesh } from 'three';
+import UILabel from '../ui/UILabel';
+export type PropertyField = {
+    type: 'color';
+    label: string;
+    getValue(): string;
+    setValue(v: string): void;
+} | {
+    type: 'slider';
+    label: string;
+    min: number;
+    max: number;
+    step: number;
+    getValue(): number;
+    setValue(v: number): void;
+} | {
+    type: 'checkbox';
+    label: string;
+    getValue(): boolean;
+    setValue(v: boolean): void;
+};
+export interface EditorHelperAttachment {
+    addBindings?(folder: ContainerApi): void;
+    onMove?(delta: Vector3): void;
+    properties?: PropertyField[];
+}
+/**
+ * A generic clickable gizmo that can be placed in the editor scene and linked
+ * to any game object that has no selectable geometry of its own (e.g. a
+ * particle effect, a light source, a trigger volume).
+ *
+ * Usage:
+ *   const helper = new EditorHelper(position, 'Rain', particleEffect)
+ *   editor.addHelper(helper)
+ *
+ * The helper's mesh is selectable via the existing raycast system.
+ * When selected, read helper.attachment for tweakpane bindings.
+ */
+export default class EditorHelper {
+    readonly mesh: Mesh;
+    readonly label: UILabel;
+    readonly labelText: string;
+    readonly attachment: EditorHelperAttachment | null;
+    owner?: {
+        destroy(): void;
+    };
+    private _prevPosition;
+    constructor(position: Vector3, labelText: string, attachment?: EditorHelperAttachment | null);
+    update(delta: number): void;
+    dispose(): void;
+    /** Returns the EditorHelper linked to an Object3D, or null. */
+    static from(object: Object3D): EditorHelper | null;
+}

package/dist/Editor/EditorHelper.js

@@ -0,0 +1,52 @@
+import { Mesh, MeshBasicMaterial, OctahedronGeometry } from 'three';
+import Game from '../Game';
+import UILabel from '../ui/UILabel';
+/**
+ * A generic clickable gizmo that can be placed in the editor scene and linked
+ * to any game object that has no selectable geometry of its own (e.g. a
+ * particle effect, a light source, a trigger volume).
+ *
+ * Usage:
+ *   const helper = new EditorHelper(position, 'Rain', particleEffect)
+ *   editor.addHelper(helper)
+ *
+ * The helper's mesh is selectable via the existing raycast system.
+ * When selected, read helper.attachment for tweakpane bindings.
+ */
+export default class EditorHelper {
+    constructor(position, labelText, attachment = null) {
+        this.labelText = labelText;
+        this.attachment = attachment;
+        const geo = new OctahedronGeometry(0.35);
+        const mat = new MeshBasicMaterial({ color: 0xFFAA00, wireframe: true });
+        this.mesh = new Mesh(geo, mat);
+        this.mesh.position.copy(position);
+        this.mesh.userData.editorHelper = this;
+        this._prevPosition = position.clone();
+        this.label = new UILabel(this.mesh, labelText);
+        this.label.domElement.style.pointerEvents = 'auto';
+        this.label.domElement.style.cursor = 'pointer';
+        this.label.domElement.addEventListener('click', () => {
+            Game.instance().editor?.selectObject(this.mesh);
+        });
+        Game.instance().scene.add(this.mesh);
+    }
+    update(delta) {
+        this.label.update(delta);
+        if (this.attachment?.onMove && !this._prevPosition.equals(this.mesh.position)) {
+            const positionDelta = this.mesh.position.clone().sub(this._prevPosition);
+            this.attachment.onMove(positionDelta);
+            this._prevPosition.copy(this.mesh.position);
+        }
+    }
+    dispose() {
+        Game.instance().scene.remove(this.mesh);
+        this.mesh.geometry.dispose();
+        this.mesh.material.dispose();
+        this.label.destroy();
+    }
+    /** Returns the EditorHelper linked to an Object3D, or null. */
+    static from(object) {
+        return object.userData.editorHelper ?? null;
+    }
+}

package/dist/Editor/WithEditorHelper.cjs

@@ -0,0 +1,65 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var WithEditorHelper_exports = {};
+__export(WithEditorHelper_exports, {
+  WithEditorHelper: () => WithEditorHelper
+});
+module.exports = __toCommonJS(WithEditorHelper_exports);
+var import_Game = __toESM(require("../Game"), 1);
+var import_EditorHelper = __toESM(require("./EditorHelper"), 1);
+function WithEditorHelper(Base) {
+  class Mixed extends Base {
+    registerEditorHelper(position, label, attachment = null) {
+      const editor = import_Game.default.instance().editor;
+      if (!editor)
+        return;
+      this.editorHelper = new import_EditorHelper.default(position, label, attachment);
+      this.editorHelper.owner = this;
+      editor.addHelper(this.editorHelper);
+    }
+    /** Tag a Three.js mesh so the editor can find this object's helper from it. */
+    tagWithHelper(mesh) {
+      if (this.editorHelper)
+        mesh.userData.editorHelper = this.editorHelper;
+    }
+    destroy() {
+      if (this.editorHelper) {
+        import_Game.default.instance().editor?.removeHelper(this.editorHelper);
+        this.editorHelper.dispose();
+        this.editorHelper = void 0;
+      }
+      super.destroy();
+    }
+  }
+  return Mixed;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  WithEditorHelper
+});

package/dist/Editor/WithEditorHelper.d.ts

@@ -0,0 +1,22 @@
+import type { Object3D, Vector3 } from 'three';
+import type { EditorHelperAttachment } from './EditorHelper';
+import EditorHelper from './EditorHelper';
+/**
+ * Mixin that lets any game object register itself as an EditorHelper gizmo.
+ *
+ * - Call `registerEditorHelper(position, label, attachment?)` once the world-space
+ *   position is known (typically end of constructor).
+ * - Call `tagWithHelper(mesh)` for every Three.js mesh that belongs to this object
+ *   so that selecting and deleting any of those meshes in the editor also removes
+ *   the gizmo (and vice-versa via `owner`).
+ * - No-ops when no editor is active, safe in non-editor builds.
+ */
+export declare function WithEditorHelper<TBase extends abstract new (...args: any[]) => {
+    destroy(): void;
+}>(Base: TBase): (abstract new (...args: any[]) => {
+    editorHelper: EditorHelper | undefined;
+    registerEditorHelper(position: Vector3, label: string, attachment?: EditorHelperAttachment | null): void;
+    /** Tag a Three.js mesh so the editor can find this object's helper from it. */
+    tagWithHelper(mesh: Object3D): void;
+    destroy(): void;
+}) & TBase;

package/dist/Editor/WithEditorHelper.js

@@ -0,0 +1,38 @@
+import Game from '../Game';
+import EditorHelper from './EditorHelper';
+/**
+ * Mixin that lets any game object register itself as an EditorHelper gizmo.
+ *
+ * - Call `registerEditorHelper(position, label, attachment?)` once the world-space
+ *   position is known (typically end of constructor).
+ * - Call `tagWithHelper(mesh)` for every Three.js mesh that belongs to this object
+ *   so that selecting and deleting any of those meshes in the editor also removes
+ *   the gizmo (and vice-versa via `owner`).
+ * - No-ops when no editor is active, safe in non-editor builds.
+ */
+export function WithEditorHelper(Base) {
+    class Mixed extends Base {
+        registerEditorHelper(position, label, attachment = null) {
+            const editor = Game.instance().editor;
+            if (!editor)
+                return;
+            this.editorHelper = new EditorHelper(position, label, attachment);
+            this.editorHelper.owner = this;
+            editor.addHelper(this.editorHelper);
+        }
+        /** Tag a Three.js mesh so the editor can find this object's helper from it. */
+        tagWithHelper(mesh) {
+            if (this.editorHelper)
+                mesh.userData.editorHelper = this.editorHelper;
+        }
+        destroy() {
+            if (this.editorHelper) {
+                Game.instance().editor?.removeHelper(this.editorHelper);
+                this.editorHelper.dispose();
+                this.editorHelper = undefined;
+            }
+            super.destroy();
+        }
+    }
+    return Mixed;
+}

package/dist/Game.cjs

@@ -0,0 +1,131 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Game_exports = {};
+__export(Game_exports, {
+  default: () => Game
+});
+module.exports = __toCommonJS(Game_exports);
+var THREE = __toESM(require("three"), 1);
+var import_BaseGame = __toESM(require("./BaseGame"), 1);
+var import_Camera = __toESM(require("./Camera"), 1);
+var import_InputManager = __toESM(require("./InputManager"), 1);
+var import_ParticleSystem = __toESM(require("./Particles/System/ParticleSystem"), 1);
+var import_Renderer = __toESM(require("./Renderer"), 1);
+var import_PhysicsRenderer = require("./Renderer/PhysicsRenderer");
+var import_Debug = __toESM(require("./Utils/Debug"), 1);
+var import_LoadingScreen = __toESM(require("./Utils/LoadingScreen"), 1);
+var import_Logger = __toESM(require("./Utils/Logger"), 1);
+var import_Resources = __toESM(require("./Utils/Resources"), 1);
+var import_Sizes = __toESM(require("./Utils/Sizes"), 1);
+var import_World = __toESM(require("./World/World"), 1);
+var import_style = require("./style.css");
+class Game extends import_BaseGame.default {
+  /**
+   * @param sources The source files to load when launching the game
+   */
+  constructor(sources, physicsWorld, renderParameters = {}) {
+    super(
+      // eslint-disable-next-line node/prefer-global/process
+      new import_Logger.default(process.env.NODE_ENV === "production" ? "error" : "debug"),
+      physicsWorld
+    );
+    this.canvas = document.createElement("canvas");
+    this.uiRoot = document.createElement("div");
+    /**
+     * Removing the prevention of right clicking
+     * for in the editor
+     */
+    this.contextMenuAbort = new AbortController();
+    this.initDocument();
+    this.debug = new import_Debug.default();
+    window.Game = this;
+    this.sizes = new import_Sizes.default();
+    this.sizes.on("resize", () => {
+      this.resize();
+    });
+    this.resources = new import_Resources.default(sources);
+    this.loadingScreen = new import_LoadingScreen.default(this.resources);
+    this.audio = new THREE.Audio(new THREE.AudioListener());
+    this.camera = new import_Camera.default(this.audio.listener);
+    this.renderer = new import_Renderer.default({
+      canvas: this.canvas,
+      ...renderParameters
+    });
+    this.input = new import_InputManager.default();
+    this.particleSystem = new import_ParticleSystem.default();
+    this.physicsWorld = physicsWorld;
+    if (this.physicsWorld) {
+      this.physicsDebugRender = new import_PhysicsRenderer.RapierDebugRenderer(this.scene, this.physicsWorld);
+    }
+    this.world = new import_World.default();
+    if (this.isDevMode()) {
+      Game.devModeHook?.();
+    }
+    const render = () => {
+      const delta = this.clock.getDelta();
+      this.particleSystem.update(delta);
+      this.renderer.update(delta);
+      window.requestAnimationFrame(() => render());
+    };
+    render();
+  }
+  initDocument() {
+    document.body.appendChild(this.canvas);
+    this.uiRoot.setAttribute("id", "ui");
+    this.uiRoot.style.opacity = "0";
+    this.canvas.parentNode.insertBefore(this.uiRoot, this.canvas);
+    this.canvas.setAttribute("draggable", "false");
+    this.canvas.addEventListener("mousedown", (e) => {
+      e.preventDefault();
+    });
+    document.getElementsByTagName("body")[0].setAttribute("onContextMenu", "return false;");
+    document.addEventListener("contextmenu", (e) => {
+      e.preventDefault();
+    }, {
+      signal: this.contextMenuAbort.signal
+    });
+    queueMicrotask(() => this.trigger("documentReady"));
+  }
+  static instance() {
+    return super.instance();
+  }
+  resize() {
+    this.camera.resize();
+    this.renderer.resize();
+  }
+  update(delta) {
+    if (this.editor) {
+      this.editor.update(delta);
+    }
+    this.loadingScreen.update(delta);
+    super.update(delta);
+    this.physicsDebugRender?.update();
+    this.camera.update(delta);
+  }
+}

package/dist/Game.d.ts

@@ -0,0 +1,51 @@
+import type { World } from '@dimforge/rapier3d-compat';
+import type IEditor from './Types/IEditor';
+import type { Asset } from './Types/Asset';
+import * as THREE from 'three';
+import BaseGame from './BaseGame';
+import Camera from './Camera';
+import InputManager from './InputManager';
+import ParticleSystem from './Particles/System/ParticleSystem';
+import Renderer from './Renderer';
+import { RapierDebugRenderer } from './Renderer/PhysicsRenderer';
+import Debug from './Utils/Debug';
+import LoadingScreen from './Utils/LoadingScreen';
+import Resources from './Utils/Resources';
+import Sizes from './Utils/Sizes';
+import ClientGameWorld from './World/World';
+import './style.css';
+export default class Game extends BaseGame {
+    canvas: HTMLCanvasElement;
+    uiRoot: HTMLDivElement;
+    readonly sizes: Sizes;
+    camera: Camera;
+    renderer: Renderer;
+    resources: Resources;
+    debug: Debug;
+    input: InputManager;
+    audio: THREE.Audio;
+    physicsDebugRender?: RapierDebugRenderer;
+    particleSystem: ParticleSystem;
+    loadingScreen: LoadingScreen;
+    editor?: IEditor;
+    /**
+     * Optional hook invoked in dev mode after the game is initialized.
+     * Set this before constructing Game to register the editor or other dev tools.
+     * e.g. `Game.devModeHook = () => Editor.registerListener()`
+     */
+    static devModeHook?: () => void;
+    world: ClientGameWorld;
+    /**
+     * Removing the prevention of right clicking
+     * for in the editor
+     */
+    contextMenuAbort: AbortController;
+    /**
+     * @param sources The source files to load when launching the game
+     */
+    constructor(sources: Asset[], physicsWorld?: World, renderParameters?: THREE.WebGLRendererParameters);
+    private initDocument;
+    static instance(): Game;
+    private resize;
+    update(delta: number): void;
+}

package/dist/Game.js

@@ -0,0 +1,100 @@
+import * as THREE from 'three';
+import BaseGame from './BaseGame';
+import Camera from './Camera';
+import InputManager from './InputManager';
+import ParticleSystem from './Particles/System/ParticleSystem';
+import Renderer from './Renderer';
+import { RapierDebugRenderer } from './Renderer/PhysicsRenderer';
+import Debug from './Utils/Debug';
+import LoadingScreen from './Utils/LoadingScreen';
+import Logger from './Utils/Logger';
+import Resources from './Utils/Resources';
+import Sizes from './Utils/Sizes';
+import ClientGameWorld from './World/World';
+import './style.css';
+export default class Game extends BaseGame {
+    /**
+     * @param sources The source files to load when launching the game
+     */
+    constructor(sources, physicsWorld, renderParameters = {}) {
+        super(
+        // eslint-disable-next-line node/prefer-global/process
+        new Logger(process.env.NODE_ENV === 'production' ? 'error' : 'debug'), physicsWorld);
+        this.canvas = document.createElement('canvas');
+        this.uiRoot = document.createElement('div');
+        /**
+         * Removing the prevention of right clicking
+         * for in the editor
+         */
+        this.contextMenuAbort = new AbortController();
+        this.initDocument();
+        this.debug = new Debug();
+        window.Game = this;
+        this.sizes = new Sizes();
+        this.sizes.on('resize', () => {
+            this.resize();
+        });
+        this.resources = new Resources(sources);
+        this.loadingScreen = new LoadingScreen(this.resources);
+        this.audio = new THREE.Audio(new THREE.AudioListener());
+        this.camera = new Camera(this.audio.listener);
+        this.renderer = new Renderer({
+            canvas: this.canvas,
+            ...renderParameters,
+        });
+        this.input = new InputManager();
+        this.particleSystem = new ParticleSystem();
+        this.physicsWorld = physicsWorld;
+        if (this.physicsWorld) {
+            this.physicsDebugRender = new RapierDebugRenderer(this.scene, this.physicsWorld);
+        }
+        this.world = new ClientGameWorld();
+        if (this.isDevMode()) {
+            Game.devModeHook?.();
+        }
+        const render = () => {
+            const delta = this.clock.getDelta();
+            this.particleSystem.update(delta);
+            this.renderer.update(delta);
+            window.requestAnimationFrame(() => render());
+        };
+        render();
+    }
+    initDocument() {
+        document.body.appendChild(this.canvas);
+        this.uiRoot.setAttribute('id', 'ui');
+        this.uiRoot.style.opacity = '0';
+        this.canvas.parentNode.insertBefore(this.uiRoot, this.canvas);
+        // Prevent drag event in firefox triggering a screengrab / image drag from the current canvas state
+        this.canvas.setAttribute('draggable', 'false');
+        this.canvas.addEventListener('mousedown', (e) => {
+            e.preventDefault();
+        });
+        document.getElementsByTagName('body')[0].setAttribute('onContextMenu', 'return false;');
+        /**
+         * Prevent right click context menu
+         */
+        document.addEventListener('contextmenu', (e) => {
+            e.preventDefault();
+        }, {
+            signal: this.contextMenuAbort.signal,
+        });
+        queueMicrotask(() => this.trigger('documentReady'));
+    }
+    static instance() {
+        return super.instance();
+    }
+    resize() {
+        this.camera.resize();
+        this.renderer.resize();
+    }
+    update(delta) {
+        if (this.editor) {
+            this.editor.update(delta);
+        }
+        this.loadingScreen.update(delta);
+        super.update(delta);
+        this.physicsDebugRender?.update();
+        this.camera.update(delta);
+    }
+}