Needle Engine 3.2.4-alpha

Files changed (35) hide show

src/engine/engine_fileloader.js +2 -2
plugins/vite/license.js +2 -2
src/engine/codegen/register_types.js +2 -2
src/engine-components/Animation.ts +17 -19
src/engine-components/Animator.ts +4 -5
src/engine-components/AnimatorController.ts +16 -17
src/engine-components/api.ts +2 -0
src/engine/api.ts +5 -1
src/engine-components/AudioListener.ts +4 -4
src/engine-components/AudioSource.ts +8 -8
src/engine-components/AvatarLoader.ts +15 -16
src/engine-components/AxesHelper.ts +1 -1
src/engine-components/BasicIKConstraint.ts +2 -2
src/engine-components/BoxHelperComponent.ts +13 -13
src/engine-components/Component.ts +61 -62
src/engine-components/DragControls.ts +42 -43
src/engine/engine_addressables.ts +6 -7
src/engine/engine_context.ts +31 -28
src/engine/engine_gameobject.ts +21 -21
src/engine/engine_gizmos.ts +5 -6
src/engine/engine_gltf_builtin_components.ts +9 -10
src/engine/engine_input.ts +17 -18
src/engine/engine_license.ts +2 -2
src/engine/engine_mainloop_utils.ts +5 -5
src/engine/engine_networking_auto.ts +1 -1
src/engine/engine_networking_files.ts +10 -11
src/engine/engine_three_utils.ts +37 -37
src/engine/extensions/NEEDLE_components.ts +7 -6
src/engine/extensions/NEEDLE_lighting_settings.ts +15 -6
src/engine/extensions/NEEDLE_techniques_webgl.ts +29 -30
src/needle-engine.ts +5 -8
src/engine-components/ParticleSystemModules.ts +1483 -1483
src/engine-components-experimental/networking/PlayerSync.ts +17 -4
src/engine-components/ui/Utils.ts +4 -4
src/engine-components-experimental/api.ts +1 -0

src/engine/engine_fileloader.js CHANGED Viewed

@@ -1,6 +1,6 @@
-import * as THREE from "three";
+import { FileLoader } from "three";
-export const loader = new THREE.FileLoader();
+export const loader = new FileLoader();
 export async function loadFileAsync(url) {
   return new Promise((resolve, reject) => {

plugins/vite/license.js CHANGED Viewed

@@ -7,11 +7,11 @@
         name: "needle-license",
         enforce: 'pre',
         async transform(src, id) {
-            if (id.includes("engine/engine_license.ts")) {
+            if (id.includes("engine/engine_license") || id.includes("needle-tools_engine.js")) {
                 const needleConfig = await loadConfig();
                 if (needleConfig) {
                     if (needleConfig.hasProLicense !== undefined && typeof needleConfig.hasProLicense === "boolean") {
-                        src = src.replace("const HAS_LICENSE = false;", "const HAS_LICENSE = " + needleConfig.hasProLicense + ";");
+                        src = src.replace("NEEDLE_ENGINE_COMMERCIAL_USE_LICENSE = false;", "NEEDLE_ENGINE_COMMERCIAL_USE_LICENSE = " + needleConfig.hasProLicense + ";");
                         return { code: src, map: null }
                     }
                 }

src/engine/codegen/register_types.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { TypeStore } from "./../engine_typestore"
 // Import types
 import { __Ignore } from "../../engine-components/codegen/components";
 import { AlignmentConstraint } from "../../engine-components/AlignmentConstraint";
@@ -184,7 +184,7 @@
 import { XRGrabRendering } from "../../engine-components/WebXRGrabRendering";
 import { XRRig } from "../../engine-components/WebXRRig";
 import { XRState } from "../../engine-components/XRFlag";
 // Register types
 TypeStore.add("__Ignore", __Ignore);
 TypeStore.add("AlignmentConstraint", AlignmentConstraint);

src/engine-components/Animation.ts CHANGED Viewed

@@ -1,9 +1,7 @@
 import { Behaviour } from "./Component";
-import * as THREE from 'three'
-import { AnimationAction, AnimationClip, Vector2 } from "three";
+import { AnimationAction, AnimationClip, AnimationMixer, LoopOnce, LoopRepeat } from "three";
 import { MixerEvent } from "./Animator";
 import { serializable } from "../engine/engine_serialization_decorator";
-import { InstancingUtil } from "../engine/engine_instancing";
 import { Mathf } from "../engine/engine_math";
 import { Vec2 } from "../engine/engine_types";
 import { getParam } from "../engine/engine_utils";
@@ -63,7 +61,7 @@
         this.animations = animations;
     }
-    set animations(animations: THREE.AnimationClip[]) {
+    set animations(animations: AnimationClip[]) {
         if (debug) console.log("assign animations", animations);
         this.gameObject.animations = animations;
     }
@@ -74,29 +72,29 @@
     /**
      * @deprecated Currently unsupported
      */
-    get currentAction(): THREE.AnimationAction | null {
+    get currentAction(): AnimationAction | null {
         return this._currentActions[0];
     }
     /**
      * @deprecated Currently unsupported
      */
-    get currentActions(): THREE.AnimationAction[] {
+    get currentActions(): AnimationAction[] {
         return this._currentActions;
     }
-    private mixer: THREE.AnimationMixer | undefined = undefined;
-    get actions(): Array<THREE.AnimationAction> {
+    private mixer: AnimationMixer | undefined = undefined;
+    get actions(): Array<AnimationAction> {
         return this._actions;
     }
-    set actions(val: Array<THREE.AnimationAction>) {
+    set actions(val: Array<AnimationAction>) {
         this._actions = val;
     }
-    private _actions: Array<THREE.AnimationAction> = [];
+    private _actions: Array<AnimationAction> = [];
-    // private _currentAction: THREE.AnimationAction | null = null;
+    // private _currentAction: AnimationAction | null = null;
-    private _currentActions: THREE.AnimationAction[] = [];
+    private _currentActions: AnimationAction[] = [];
     private _handles: AnimationHandle[] = [];
     awake() {
@@ -133,7 +131,7 @@
         //     InstancingUtil.markDirty(this.gameObject);
     }
-    getAction(name: string): THREE.AnimationAction | undefined | null {
+    getAction(name: string): AnimationAction | undefined | null {
         return this.actions?.find(a => a.getClip().name === name);
     }
@@ -210,8 +208,8 @@
         if (options?.startTime !== undefined) action.time = options.startTime;
         if (options?.loop !== undefined)
-            action.loop = options.loop ? THREE.LoopRepeat : THREE.LoopOnce;
-        else action.loop = THREE.LoopOnce;
+            action.loop = options.loop ? LoopRepeat : LoopOnce;
+        else action.loop = LoopOnce;
         action.play();
         if (debug)
             console.log("PLAY", action.getClip().name, action)
@@ -239,14 +237,14 @@
         this._didInit = true;
         if (!this.gameObject) return;
         this.actions = [];
-        this.mixer = new THREE.AnimationMixer(this.gameObject);
+        this.mixer = new AnimationMixer(this.gameObject);
     }
 }
 class AnimationHandle {
-    mixer: THREE.AnimationMixer;
-    action: THREE.AnimationAction;
+    mixer: AnimationMixer;
+    action: AnimationAction;
     promise: Promise<AnimationAction> | null = null;
     resolve: Function | null = null;
     reject: Function | null = null;
@@ -258,7 +256,7 @@
     private _finishedCallback?: any;
     private _resolvedOrRejectedCallback?: (AnimationHandle) => void;
-    constructor(action: THREE.AnimationAction, mixer: THREE.AnimationMixer, opts?: PlayOptions, cb?: (handle: AnimationHandle) => void) {
+    constructor(action: AnimationAction, mixer: AnimationMixer, opts?: PlayOptions, cb?: (handle: AnimationHandle) => void) {
         this.action = action;
         this.mixer = mixer;
         this._resolvedOrRejectedCallback = cb;

src/engine-components/Animator.ts CHANGED Viewed

@@ -1,7 +1,6 @@
 import { Behaviour } from "./Component";
-import * as THREE from 'three'
-import { LoopOnce, AnimationActionLoopStyles, AnimationAction } from "three";
-import { getParam, deepClone } from "../engine/engine_utils";
+import { AnimationActionLoopStyles, AnimationAction, AnimationMixer } from "three";
+import { getParam } from "../engine/engine_utils";
 import { AnimatorControllerModel } from "../engine/extensions/NEEDLE_animator_controller_model";
 import { AnimatorController } from "./AnimatorController";
 import { serializable } from "../engine/engine_serialization_decorator";
@@ -12,9 +11,9 @@
 export declare class MixerEvent {
     type: string;
-    action: THREE.AnimationAction;
+    action: AnimationAction;
     loopDelta: number;
-    target: THREE.AnimationMixer;
+    target: AnimationMixer;
 }
 export declare class PlayOptions {

src/engine-components/AnimatorController.ts CHANGED Viewed

@@ -1,9 +1,8 @@
 import { Animator } from "./Animator";
 import { AnimatorConditionMode, AnimatorControllerModel, AnimatorControllerParameterType, AnimatorStateInfo, Condition, createMotion, State, StateMachineBehaviour } from "../engine/extensions/NEEDLE_animator_controller_model";
-import { AnimationAction, AnimationClip, AnimationMixer, AxesHelper, Euler, KeyframeTrack, LoopOnce, LoopRepeat, Matrix4, Object3D, Quaternion, Vector3 } from "three";
+import { AnimationAction, AnimationClip, AnimationMixer, AxesHelper, Euler, KeyframeTrack, LoopOnce, Object3D, Quaternion, Vector3 } from "three";
 import { deepClone, getParam } from "../engine/engine_utils";
 import { Context } from "../engine/engine_setup";
-import * as THREE from "three";
 import { TypeStore } from "../engine/engine_typestore";
 import { assign } from "../engine/engine_serialization_core";
 import { Mathf } from "../engine/engine_math";
@@ -110,7 +109,7 @@
     get context(): Context | undefined | null { return this.animator?.context; }
-    // applyRootMotion(obj: THREE.Object3D) {
+    // applyRootMotion(obj: Object3D) {
     //     // this.internalApplyRootMotion(obj);
     // }
@@ -160,7 +159,7 @@
     }
-    private _mixer!: THREE.AnimationMixer;
+    private _mixer!: AnimationMixer;
     private _activeState?: State;
     constructor(model: AnimatorControllerModel) {
@@ -541,10 +540,10 @@
     private rootMotionHandler?: RootMotionHandler;
-    // private findRootBone(obj: THREE.Object3D): THREE.Object3D | null {
+    // private findRootBone(obj: Object3D): Object3D | null {
     //     if (this.animationRoot) return this.animationRoot;
     //     if (obj.type === "Bone") {
-    //         this.animationRoot = obj as THREE.Bone;
+    //         this.animationRoot = obj as Bone;
     //         return this.animationRoot;
     //     }
     //     if (obj.children) {
@@ -601,16 +600,16 @@
 class RootMotionAction {
-    private static lastObjPosition: { [key: string]: THREE.Vector3 } = {};
-    static lastObjRotation: { [key: string]: THREE.Quaternion } = {};
+    private static lastObjPosition: { [key: string]: Vector3 } = {};
+    static lastObjRotation: { [key: string]: Quaternion } = {};
     // we remove the first keyframe rotation from the space rotation when updating
-    private static firstKeyframeRotation: { [key: string]: THREE.Quaternion } = {};
+    private static firstKeyframeRotation: { [key: string]: Quaternion } = {};
     // this is used to rotate the space on clip end / start (so the transform direction is correct)
-    private static spaceRotation: { [key: string]: THREE.Quaternion } = {};
-    private static effectiveSpaceRotation: { [key: string]: THREE.Quaternion } = {};
+    private static spaceRotation: { [key: string]: Quaternion } = {};
+    private static effectiveSpaceRotation: { [key: string]: Quaternion } = {};
-    private static clipOffsetRotation: { [key: string]: THREE.Quaternion } = {};
+    private static clipOffsetRotation: { [key: string]: Quaternion } = {};
     set action(val: AnimationAction) {
@@ -631,14 +630,14 @@
     positionChange: Vector3 = new Vector3();
     rotationChange: Quaternion = new Quaternion();
-    constructor(context: Context, root: THREE.Object3D, clip: AnimationClip, positionTrack: KeyframeTrack | null, rotationTrack: KeyframeTrack | null) {
+    constructor(context: Context, root: Object3D, clip: AnimationClip, positionTrack: KeyframeTrack | null, rotationTrack: KeyframeTrack | null) {
         // console.log(this, positionTrack, rotationTrack);
         this.context = context;
         this.root = root;
         this.clip = clip;
         if (!RootMotionAction.firstKeyframeRotation[clip.uuid])
-            RootMotionAction.firstKeyframeRotation[clip.uuid] = new THREE.Quaternion();
+            RootMotionAction.firstKeyframeRotation[clip.uuid] = new Quaternion();
         if (rotationTrack) {
             const values = rotationTrack.values;
             RootMotionAction.firstKeyframeRotation[clip.uuid]
@@ -672,7 +671,7 @@
         if (debugRootMotion)
         {
-            const euler = new THREE.Euler().setFromQuaternion(lastRotation);
+            const euler = new Euler().setFromQuaternion(lastRotation);
             console.log("START", this.clip.name, Mathf.toDegrees(euler.y));
         }
     }
@@ -799,13 +798,13 @@
     private controller: AnimatorController;
     private handler: RootMotionAction[] = [];
-    private root!: THREE.Object3D;
+    private root!: Object3D;
     constructor(controller: AnimatorController) {
         this.controller = controller;
     }
-    createClip(mixer: AnimationMixer, root: THREE.Object3D, clip: AnimationClip): AnimationAction {
+    createClip(mixer: AnimationMixer, root: Object3D, clip: AnimationClip): AnimationAction {
         this.root = root;
         let rootName = "";
         if (root && "name" in root) {

src/engine-components/api.ts CHANGED Viewed

@@ -1,1 +1,3 @@
+export * from "./codegen/components";
+export * from "./js-extensions/Object3D";
 export * from "./ui/PointerEvents"

src/engine/api.ts CHANGED Viewed

@@ -3,9 +3,12 @@
 export * from "./engine_context_registry";
 export * from "./extensions/extensions"
 export { InstancingUtil } from "./engine_instancing";
+export * from "./engine_types"
 export * from "./engine_gameobject";
 export * from "./engine_components";
 export * from "./engine_components_internal";
+export * from "./engine_input"
+export * from "./engine_coroutine"
 export { AssetReference, ImageReference } from "./engine_addressables";
 export { Context, FrameEvent } from "./engine_setup";
 export * from "./debug/debug";
@@ -14,7 +17,8 @@
 export * from "./engine_scenetools";
 export * from "./engine_math"
 export * from "./js-extensions"
-export { hasProLicense } from "./engine_license"
+export { hasProLicense } from "./engine_license";
+export { syncField } from "./engine_networking_auto";
 export {
     // url params

src/engine-components/AudioListener.ts CHANGED Viewed

@@ -1,18 +1,18 @@
 import { Behaviour, GameObject } from "./Component";
-import * as THREE from "three";
+import { AudioListener as ThreeAudioListener } from "three";
 import { AudioSource } from "./AudioSource";
 import { Camera } from "./Camera";
 export class AudioListener extends Behaviour {
-    get listener(): THREE.AudioListener {
+    get listener(): ThreeAudioListener {
         if (this._listener == null)
-            this._listener = new THREE.AudioListener();
+            this._listener = new ThreeAudioListener();
         return this._listener;
     }
-    private _listener: THREE.AudioListener | null = null;
+    private _listener: ThreeAudioListener | null = null;
     awake() {
         AudioSource.registerWaitForAllowAudio(() => {

src/engine-components/AudioSource.ts CHANGED Viewed

@@ -1,10 +1,10 @@
 import { Behaviour, GameObject } from "./Component";
-import * as THREE from "three";
 import { PositionalAudioHelper } from 'three/examples/jsm/helpers/PositionalAudioHelper.js';
 import { AudioListener } from "./AudioListener";
 import * as utils from "../engine/engine_utils";
 import { serializable } from "../engine/engine_serialization_decorator";
-import { Application, ApplicationEvents } from "../engine/engine_application";
+import { ApplicationEvents } from "../engine/engine_application";
+import { AudioLoader, PositionalAudio } from "three";
 const debug = utils.getParam("debugaudio");
@@ -146,20 +146,20 @@
     playInBackground: boolean = true;
     private _loop: boolean = false;
-    private sound: THREE.PositionalAudio | null = null;
+    private sound: PositionalAudio | null = null;
     private helper: PositionalAudioHelper | null = null;
     private wasPlaying = false;
-    private audioLoader: THREE.AudioLoader | null = null;
+    private audioLoader: AudioLoader | null = null;
     private shouldPlay: boolean = false;
     // set this from audio context time, used to set clip offset when setting "time" property
     // there is maybe a better way to set a audio clip current time?!
     private _lastClipStartedLoading: string | null = null;
-    public get Sound(): THREE.PositionalAudio | null {
+    public get Sound(): PositionalAudio | null {
         if (!this.sound && AudioSource._userInteractionRegistered) {
             const listener = GameObject.getComponent(this.context.mainCamera, AudioListener) ?? GameObject.findObjectOfType(AudioListener, this.context);
             if (listener?.listener) {
-                this.sound = new THREE.PositionalAudio(listener.listener);
+                this.sound = new PositionalAudio(listener.listener);
                 this.gameObject.add(this.sound);
             }
         }
@@ -170,7 +170,7 @@
     awake() {
-        this.audioLoader = new THREE.AudioLoader();
+        this.audioLoader = new AudioLoader();
         if (this.playOnAwake) this.shouldPlay = true;
     }
@@ -294,7 +294,7 @@
                 console.log(this.clip);
             if (this.clip.endsWith(".mp3") || this.clip.endsWith(".wav")) {
                 if (!this.audioLoader)
-                    this.audioLoader = new THREE.AudioLoader();
+                    this.audioLoader = new AudioLoader();
                 this.shouldPlay = true;
                 if (this._lastClipStartedLoading === this.clip) {
                     if (debug) console.log("Is currently loading:", this._lastClipStartedLoading, this)

src/engine-components/AvatarLoader.ts CHANGED Viewed

@@ -1,28 +1,27 @@
-import { GLTF, GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader";
-import * as THREE from "three";
+import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader";
 import * as utils from "../engine/engine_utils"
-// import * as object from "../engine/engine_gltf_builtin_components";
 import * as loaders from "../engine/engine_loaders"
 import { Context } from "../engine/engine_setup";
 import { GameObject } from "./Component";
 import { download_file } from "../engine/engine_web_api";
 import { getLoader } from "../engine/engine_gltf";
 import { InstantiateOptions } from "../engine/engine_gameobject";
+import { Box3, Object3D, Vector3 } from "three";
 const debug = utils.getParam("debugavatar");
 export class AvatarModel {
-    root: THREE.Object3D;
-    head: THREE.Object3D;
-    leftHand: THREE.Object3D | null;
-    rigthHand: THREE.Object3D | null;
+    root: Object3D;
+    head: Object3D;
+    leftHand: Object3D | null;
+    rigthHand: Object3D | null;
     get isValid(): boolean {
         return this.head !== null && this.head !== undefined;
     }
-    constructor(root: THREE.Object3D, head: THREE.Object3D, leftHand: THREE.Object3D | null, rigthHand: THREE.Object3D | null) {
+    constructor(root: Object3D, head: Object3D, leftHand: Object3D | null, rigthHand: Object3D | null) {
         this.root = root;
         this.head = head;
         this.leftHand = leftHand;
@@ -40,14 +39,14 @@
     // private loader: GLTFLoader | null;
     // private avatarModelCache: Map<string, AvatarModel | null> = new Map<string, AvatarModel | null>();
-    public async getOrCreateNewAvatarInstance(context: Context, avatarId: string | THREE.Object3D): Promise<AvatarModel | null> {
+    public async getOrCreateNewAvatarInstance(context: Context, avatarId: string | Object3D): Promise<AvatarModel | null> {
         if (!avatarId) {
             console.error("Can not create avatar: failed to provide id or root object");
             return null;
         }
-        let root: THREE.Object3D | null = null;
+        let root: Object3D | null = null;
         if (typeof avatarId === "string") {
             root = await this.loadAvatar(context, avatarId);
             if (!root) {
@@ -77,7 +76,7 @@
     }
-    private async loadAvatar(context: Context, avatarId: string): Promise<THREE.Object3D | null> {
+    private async loadAvatar(context: Context, avatarId: string): Promise<Object3D | null> {
         console.assert(avatarId !== undefined && avatarId !== null && typeof avatarId === "string", "Avatar id must not be null");
         if (avatarId.length <= 0) return null;
@@ -146,9 +145,9 @@
     }
     // TODO this should be burned to the ground once 🤞 we have proper extras that define object relations.
-    private findAvatar(obj: THREE.Object3D): AvatarModel {
+    private findAvatar(obj: Object3D): AvatarModel {
-        const root: THREE.Object3D = obj;
+        const root: Object3D = obj;
         let searchIn = root;
         // some GLTFs have a "scene" root it seems, others don't, we skip the root here if there's only one child
         if (searchIn.children.length == 1)
@@ -163,8 +162,8 @@
             head = root;
             // normalize size, if the object isn't properly setup the scale might be totally off
-            const boundsSize = new THREE.Vector3();
-            new THREE.Box3().setFromObject(head).getSize(boundsSize);
+            const boundsSize = new Vector3();
+            new Box3().setFromObject(head).getSize(boundsSize);
             const maxAxis = Math.max(boundsSize.x, boundsSize.y, boundsSize.z);
             console.warn("[Custom Avatar] " + "Normalizing head scale, it's too big: " + maxAxis + " meters! Should be < 0.3m");
             if (maxAxis > 0.3) {
@@ -177,7 +176,7 @@
     }
-    private findAvatarPart(obj: THREE.Object3D, searchString: string[]): THREE.Object3D | null {
+    private findAvatarPart(obj: Object3D, searchString: string[]): Object3D | null {
         const name = obj.name.toLowerCase();
         let matchesAll = true;

src/engine-components/AxesHelper.ts CHANGED Viewed

@@ -11,7 +11,7 @@
     @serializable()
     public isGizmo:boolean = true;
-    private _axes: THREE.AxesHelper | null = null;
+    private _axes: _AxesHelper | null = null;
     onEnable(): void {
         if (this.isGizmo && !params.showGizmos) return;

src/engine-components/BasicIKConstraint.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import { Behaviour, GameObject } from "./Component";
 import * as utils from "./../engine/engine_three_utils";
-import * as THREE from "three"
+import { Vector3 } from "three";
 export class BasicIKConstraint extends Behaviour {
@@ -33,7 +33,7 @@
         let hintDir = utils.getWorldPosition(this.hint).clone();
         hintDir.sub(center);
-        let offsetDir = new THREE.Vector3();
+        let offsetDir = new Vector3();
         offsetDir.crossVectors(hintDir, dir0);
         offsetDir.crossVectors(dir0, offsetDir);
         offsetDir.normalize();

src/engine-components/BoxHelperComponent.ts CHANGED Viewed

@@ -1,28 +1,28 @@
 import { Behaviour } from "./Component";
-import * as THREE from "three";
 import { getParam } from "../engine/engine_utils";
 import { CreateWireCube, Gizmos } from "../engine/engine_gizmos";
 import { getWorldPosition, getWorldScale } from "../engine/engine_three_utils";
+import { Box3, Color, ColorRepresentation, LineSegments, Object3D, Vector3 } from "three";
 const gizmos = getParam("gizmos");
 const debug = getParam("debugboxhelper");
 export class BoxHelperComponent extends Behaviour {
-    private box: THREE.Box3 | null = null;
-    private static testBox: THREE.Box3 = new THREE.Box3();
+    private box: Box3 | null = null;
+    private static testBox: Box3 = new Box3();
     private _lastMatrixUpdateFrame: number = -1;
-    private static _position: THREE.Vector3 = new THREE.Vector3();
-    private static _size: THREE.Vector3 = new THREE.Vector3(.01, .01, .01);
+    private static _position: Vector3 = new Vector3();
+    private static _size: Vector3 = new Vector3(.01, .01, .01);
-    public isInBox(obj: THREE.Object3D, scaleFactor?: number): boolean | undefined {
+    public isInBox(obj: Object3D, scaleFactor?: number): boolean | undefined {
         if (!obj) return undefined;
         // if (!obj.geometry.boundingBox) obj.geometry.computeBoundingBox();
         // if (!obj.geometry.boundingBox) return undefined;
         if (!this.box) {
-            this.box = new THREE.Box3();
+            this.box = new Box3();
         }
@@ -56,14 +56,14 @@
         return intersects;
     }
-    public intersects(box: THREE.Box3): boolean {
+    public intersects(box: Box3): boolean {
         if (!box) return false;
         return this.updateBox(false).intersectsBox(box);
     }
-    public updateBox(force: boolean = false): THREE.Box3 {
+    public updateBox(force: boolean = false): Box3 {
         if (!this.box) {
-            this.box = new THREE.Box3();
+            this.box = new Box3();
         }
         if (force || this.context.time.frameCount != this._lastMatrixUpdateFrame) {
             const firstUpdate = this._lastMatrixUpdateFrame < 0;
@@ -77,8 +77,8 @@
     }
-    private _helper: THREE.LineSegments | null = null;
-    private _color: THREE.Color | null = null;
+    private _helper: LineSegments | null = null;
+    private _color: Color | null = null;
     awake(): void {
         this._helper = null;
@@ -86,7 +86,7 @@
         this.box = null;
     }
-    public showHelper(col: THREE.ColorRepresentation | null = null, force: boolean = false) {
+    public showHelper(col: ColorRepresentation | null = null, force: boolean = false) {
         if (!gizmos && !force) return;
         if (this._helper) {
             if (col)

src/engine-components/Component.ts CHANGED Viewed

@@ -1,15 +1,14 @@
-import * as THREE from "three";
 import { Mathf } from "../engine/engine_math";
 import * as threeutils from "../engine/engine_three_utils";
 import { activeInHierarchyFieldName } from "../engine/engine_constants";
 import { Context, FrameEvent } from "../engine/engine_setup";
 import * as main from "../engine/engine_mainloop_utils";
-import { Object3D } from "three";
 import { syncDestroy, syncInstantiate } from "../engine/engine_networking_instantiate";
-import { ConstructorConcrete, SourceIdentifier, IComponent, IGameObject, Constructor, GuidsMap, UIDProvider, Collision, ICollider } from "../engine/engine_types";
+import { ConstructorConcrete, SourceIdentifier, IComponent, IGameObject, Constructor, GuidsMap, Collision, ICollider } from "../engine/engine_types";
 import { addNewComponent, destroyComponentInstance, findObjectOfType, findObjectsOfType, getComponent, getComponentInChildren, getComponentInParent, getComponents, getComponentsInChildren, getComponentsInParent, getOrAddComponent, moveComponentInstance, removeComponent } from "../engine/engine_components";
 import { findByGuid, destroy, InstantiateOptions, instantiate, HideFlags, foreachComponent, markAsInstancedRendered, isActiveInHierarchy, isActiveSelf, isUsingInstancing, setActive, isDestroyed } from "../engine/engine_gameobject";
+import { Euler, Object3D, Quaternion, Scene, Vector3 } from "three";
 // export interface ISerializationCallbackReceiver {
 //     onBeforeSerialize?(): object | void;
@@ -19,7 +18,7 @@
 //     onDeserialize?(key: string, value: any): any | void;
 // }
-abstract class GameObject extends THREE.Object3D implements THREE.Object3D, IGameObject {
+abstract class GameObject extends Object3D implements Object3D, IGameObject {
     guid: string | undefined;
@@ -27,13 +26,13 @@
     abstract destroy();
     // The actual implementation / prototype of threejs is modified in js-extensions/Object3D
-    abstract get transform(): THREE.Object3D;
+    abstract get transform(): Object3D;
-    public static isDestroyed(go: THREE.Object3D): boolean {
+    public static isDestroyed(go: Object3D): boolean {
         return isDestroyed(go);
     }
-    public static setActive(go: THREE.Object3D, active: boolean, processStart: boolean = true) {
+    public static setActive(go: Object3D, active: boolean, processStart: boolean = true) {
         if (!go) return;
         setActive(go, active);
@@ -44,29 +43,29 @@
     }
     /** If the object is active (same as go.visible) */
-    public static isActiveSelf(go: THREE.Object3D): boolean {
+    public static isActiveSelf(go: Object3D): boolean {
         return isActiveSelf(go);
     }
     /** If the object is active in the hierarchy (e.g. if any parent is invisible or not in the scene it will be false)
      * @param go object to check
     */
-    public static isActiveInHierarchy(go: THREE.Object3D): boolean {
+    public static isActiveInHierarchy(go: Object3D): boolean {
         return isActiveInHierarchy(go);
     }
-    public static markAsInstancedRendered(go: THREE.Object3D, instanced: boolean) {
+    public static markAsInstancedRendered(go: Object3D, instanced: boolean) {
         markAsInstancedRendered(go, instanced);
     }
-    public static isUsingInstancing(instance: THREE.Object3D): boolean { return isUsingInstancing(instance); }
+    public static isUsingInstancing(instance: Object3D): boolean { return isUsingInstancing(instance); }
     /** Run a callback for all components of the provided type on the provided object and its children (if recursive is true)
      * @param instance object to run the method on
      * @param cb callback to run on each component
      * @param recursive if true, the method will be run on all children as well
      */
-    public static foreachComponent(instance: THREE.Object3D, cb: (comp: Component) => any, recursive: boolean = true): any {
+    public static foreachComponent(instance: Object3D, cb: (comp: Component) => any, recursive: boolean = true): any {
         return foreachComponent(instance, cb as (comp: IComponent) => any, recursive);
     }
@@ -90,7 +89,7 @@
     /** Destroys a object on all connected clients (if you are in a networked session)
      * @param instance object to destroy
     */
-    public static destroySynced(instance: THREE.Object3D | Component, context?: Context, recursive: boolean = true) {
+    public static destroySynced(instance: Object3D | Component, context?: Context, recursive: boolean = true) {
         if (!instance) return;
         const go = instance as GameObject;
         context = context ?? Context.Current;
@@ -101,14 +100,14 @@
      * @param instance object to destroy
      * @param recursive if true, all children will be destroyed as well
      */
-    public static destroy(instance: THREE.Object3D | Component, recursive: boolean = true, isRoot: boolean = true) {
+    public static destroy(instance: Object3D | Component, recursive: boolean = true, isRoot: boolean = true) {
         return destroy(instance, recursive, isRoot);
     }
     /**
      * Add an object to parent and also ensure all components are being registered
      */
-    public static add(instance: THREE.Object3D | null | undefined, parent: THREE.Object3D, context?: Context) {
+    public static add(instance: Object3D | null | undefined, parent: Object3D, context?: Context) {
         if (!instance || !parent) return;
         if (instance === parent) {
             console.warn("Can not add object to self", instance);
@@ -137,7 +136,7 @@
     /**
      * Removes the object from its parent and deactivates all of its components
      */
-    public static remove(instance: THREE.Object3D | null | undefined) {
+    public static remove(instance: Object3D | null | undefined) {
         if (!instance) return;
         instance.parent?.remove(instance);
         setActive(instance, false);
@@ -148,7 +147,7 @@
     }
     /** Invokes a method on all components including children (if a method with that name exists) */
-    public static invokeOnChildren(go: THREE.Object3D | null | undefined, functionName: string, ...args: any) {
+    public static invokeOnChildren(go: Object3D | null | undefined, functionName: string, ...args: any) {
         this.invoke(go, functionName, true, args);
     }
@@ -156,7 +155,7 @@
      * @param go object to invoke the method on all components
      * @param functionName name of the method to invoke
      */
-    public static invoke(go: THREE.Object3D | null | undefined, functionName: string, children: boolean = false, ...args: any) {
+    public static invoke(go: Object3D | null | undefined, functionName: string, children: boolean = false, ...args: any) {
         if (!go) return;
         this.foreachComponent(go, c => {
             const fn = c[functionName];
@@ -172,7 +171,7 @@
      * @param type type of the component to add
      * @param callAwake if true, the component will be added and awake will be called immediately
      */
-    public static addNewComponent<T>(go: GameObject | THREE.Object3D, type: ConstructorConcrete<T>, callAwake: boolean = true): T {
+    public static addNewComponent<T>(go: IGameObject | Object3D, type: ConstructorConcrete<T>, callAwake: boolean = true): T {
         const instance = new type();
         //@ts-ignore
         addNewComponent(go, instance, callAwake);
@@ -185,7 +184,7 @@
      * @param go component to move the component to
      * @param instance component to move to the GO
      */
-    public static addComponent(go: GameObject, instance: Component): void {
+    public static addComponent(go: IGameObject, instance: Component): void {
         return this.moveComponent(go, instance);
     }
@@ -194,7 +193,7 @@
      * @param go component to move the component to
      * @param instance component to move to the GO
      */
-    public static moveComponent(go: GameObject, instance: Component): void {
+    public static moveComponent(go: IGameObject, instance: Component): void {
         if (instance.gameObject == null) {
             throw new Error("Did you mean to create a new component? Use addNewComponent");
         }
@@ -209,12 +208,12 @@
         return instance;
     }
-    public static getOrAddComponent<T>(go: GameObject | THREE.Object3D, typeName: ConstructorConcrete<T>): T {
+    public static getOrAddComponent<T>(go: IGameObject | Object3D, typeName: ConstructorConcrete<T>): T {
         return getOrAddComponent<any>(go, typeName);
     }
     /** Gets a component on the provided object */
-    public static getComponent<T>(go: GameObject | THREE.Object3D | null, typeName: Constructor<T> | null): T | null {
+    public static getComponent<T>(go: IGameObject | Object3D | null, typeName: Constructor<T> | null): T | null {
         if (go === null) return null;
         // if names are minified we could also use the type store and work with strings everywhere
         // not ideal, but I dont know a good/sane way to do this otherwise
@@ -223,49 +222,49 @@
         return getComponent(go, typeName as any);
     }
-    public static getComponents<T>(go: GameObject | THREE.Object3D | null, typeName: Constructor<T>, arr: T[] | null = null): T[] {
+    public static getComponents<T>(go: IGameObject | Object3D | null, typeName: Constructor<T>, arr: T[] | null = null): T[] {
         if (go === null) return arr ?? [];
         return getComponents(go, typeName, arr);
     }
-    public static findByGuid(guid: string, hierarchy: THREE.Object3D): GameObject | Component | null | undefined {
+    public static findByGuid(guid: string, hierarchy: Object3D): GameObject | Component | null | undefined {
         const res = findByGuid(guid, hierarchy);
         return res as GameObject | Component | null | undefined;
     }
-    public static findObjectOfType<T>(typeName: Constructor<T>, context?: Context | THREE.Object3D, includeInactive: boolean = true): T | null {
+    public static findObjectOfType<T>(typeName: Constructor<T>, context?: Context | Object3D, includeInactive: boolean = true): T | null {
         return findObjectOfType(typeName, context ?? Context.Current, includeInactive);
     }
-    public static findObjectsOfType<T>(typeName: Constructor<T>, context?: Context | THREE.Object3D): Array<T> {
+    public static findObjectsOfType<T>(typeName: Constructor<T>, context?: Context | Object3D): Array<T> {
         const arr = [];
         findObjectsOfType(typeName, arr, context);
         return arr;
     }
-    public static getComponentInChildren<T>(go: GameObject | THREE.Object3D, typeName: Constructor<T>): T | null {
+    public static getComponentInChildren<T>(go: IGameObject | Object3D, typeName: Constructor<T>): T | null {
         return getComponentInChildren(go, typeName);
     }
-    public static getComponentsInChildren<T>(go: GameObject | THREE.Object3D, typeName: Constructor<T>, arr: T[] | null = null): Array<T> {
+    public static getComponentsInChildren<T>(go: IGameObject | Object3D, typeName: Constructor<T>, arr: T[] | null = null): Array<T> {
         return getComponentsInChildren<T>(go, typeName, arr ?? undefined) as T[]
     }
-    public static getComponentInParent<T>(go: GameObject | THREE.Object3D, typeName: Constructor<T>): T | null {
+    public static getComponentInParent<T>(go: IGameObject | Object3D, typeName: Constructor<T>): T | null {
         return getComponentInParent(go, typeName);
     }
-    public static getComponentsInParent<T>(go: GameObject | THREE.Object3D, typeName: Constructor<T>, arr: Array<T> | null = null): Array<T> {
+    public static getComponentsInParent<T>(go: IGameObject | Object3D, typeName: Constructor<T>, arr: Array<T> | null = null): Array<T> {
         return getComponentsInParent(go, typeName, arr);
     }
-    public static getAllComponents(go: GameObject | THREE.Object3D): Behaviour[] {
+    public static getAllComponents(go: IGameObject | Object3D): Behaviour[] {
         const componentsList = go.userData?.components;
         const newList = [...componentsList];
         return newList;
     }
-    public static *iterateComponents(go: GameObject | THREE.Object3D) {
+    public static *iterateComponents(go: IGameObject | Object3D) {
         const list = go?.userData?.components;
         if (list && Array.isArray(list)) {
             for (let i = 0; i < list.length; i++) {
@@ -300,7 +299,7 @@
     set context(context: Context) {
         this.__context = context;
     }
-    get scene(): THREE.Scene { return this.context.scene; }
+    get scene(): Scene { return this.context.scene; }
     get layer(): number {
         return this.gameObject?.userData?.layer;
@@ -367,7 +366,7 @@
     gameObject!: GameObject;
     guid: string = "invalid";
     sourceId?: SourceIdentifier;
-    // transform: THREE.Object3D = nullObject;
+    // transform: Object3D = nullObject;
     /** called on a component with a map of old to new guids (e.g. when instantiate generated new guids and e.g. timeline track bindings needs to remape them) */
     resolveGuids?(guidsMap: GuidsMap): void;
@@ -521,24 +520,24 @@
     // TODO move this to threeutils
     // we need a copy for modifying the values to local space
-    private static _worldPositionBuffer: THREE.Vector3 = new THREE.Vector3();
-    private static _worldQuaternionBuffer: THREE.Quaternion = new THREE.Quaternion();
-    private static _worldEulerBuffer: THREE.Euler = new THREE.Euler();
+    private static _worldPositionBuffer: Vector3 = new Vector3();
+    private static _worldQuaternionBuffer: Quaternion = new Quaternion();
+    private static _worldEulerBuffer: Euler = new Euler();
-    private _worldPosition: THREE.Vector3 | undefined = undefined;
-    private _worldQuaternion: THREE.Quaternion | undefined = undefined;
-    private static _tempQuaternionBuffer2: THREE.Quaternion = new THREE.Quaternion();
-    private _worldEuler: THREE.Euler | undefined = undefined;
-    private _worldRotation: THREE.Vector3 | undefined = undefined;
+    private _worldPosition: Vector3 | undefined = undefined;
+    private _worldQuaternion: Quaternion | undefined = undefined;
+    private static _tempQuaternionBuffer2: Quaternion = new Quaternion();
+    private _worldEuler: Euler | undefined = undefined;
+    private _worldRotation: Vector3 | undefined = undefined;
-    get worldPosition(): THREE.Vector3 {
-        if (!this._worldPosition) this._worldPosition = new THREE.Vector3();
+    get worldPosition(): Vector3 {
+        if (!this._worldPosition) this._worldPosition = new Vector3();
         threeutils.getWorldPosition(this.gameObject, this._worldPosition);
         // this.gameObject.getWorldPosition(this._worldPosition);
         return this._worldPosition;
     }
-    set worldPosition(val: THREE.Vector3) {
+    set worldPosition(val: Vector3) {
         threeutils.setWorldPosition(this.gameObject, val);
     }
@@ -548,11 +547,11 @@
     }
-    get worldQuaternion(): THREE.Quaternion {
-        if (!this._worldQuaternion) this._worldQuaternion = new THREE.Quaternion();
+    get worldQuaternion(): Quaternion {
+        if (!this._worldQuaternion) this._worldQuaternion = new Quaternion();
         return threeutils.getWorldQuaternion(this.gameObject, this._worldQuaternion);
     }
-    set worldQuaternion(val: THREE.Quaternion) {
+    set worldQuaternion(val: Quaternion) {
         threeutils.setWorldQuaternion(this.gameObject, val);
     }
     setWorldQuaternion(x: number, y: number, z: number, w: number) {
@@ -562,23 +561,23 @@
     // world euler (in radians)
-    get worldEuler(): THREE.Euler {
-        if (!this._worldEuler) this._worldEuler = new THREE.Euler();
+    get worldEuler(): Euler {
+        if (!this._worldEuler) this._worldEuler = new Euler();
         this._worldEuler.setFromQuaternion(this.worldQuaternion);
         return this._worldEuler;
     }
     // world euler (in radians)
-    set worldEuler(val: THREE.Euler) {
-        if (!this._worldQuaternion) this._worldQuaternion = new THREE.Quaternion();
+    set worldEuler(val: Euler) {
+        if (!this._worldQuaternion) this._worldQuaternion = new Quaternion();
         this._worldQuaternion?.setFromEuler(val);
         this.worldQuaternion = this._worldQuaternion;
     }
     // returns rotation in degrees
-    get worldRotation(): THREE.Vector3 {
+    get worldRotation(): Vector3 {
         const rot = this.worldEuler;
-        if (!this._worldRotation) this._worldRotation = new THREE.Vector3();
+        if (!this._worldRotation) this._worldRotation = new Vector3();
         const wr = this._worldRotation;
         wr.set(rot.x, rot.y, rot.z);
         wr.x = Mathf.toDegrees(wr.x);
@@ -587,7 +586,7 @@
         return wr;
     }
-    set worldRotation(val: THREE.Vector3) {
+    set worldRotation(val: Vector3) {
         this.setWorldRotation(val.x, val.y, val.z, true);
     }
@@ -602,16 +601,16 @@
         this.worldQuaternion = Component._worldQuaternionBuffer;
     }
-    private static _forward: THREE.Vector3 = new THREE.Vector3();
-    public get forward(): THREE.Vector3 {
+    private static _forward: Vector3 = new Vector3();
+    public get forward(): Vector3 {
         return Component._forward.set(0, 0, -1).applyQuaternion(this.worldQuaternion);
     }
-    private static _right: THREE.Vector3 = new THREE.Vector3();
-    public get right(): THREE.Vector3 {
+    private static _right: Vector3 = new Vector3();
+    public get right(): Vector3 {
         return Component._right.set(1, 0, 0).applyQuaternion(this.worldQuaternion);
     }
-    private static _up: THREE.Vector3 = new THREE.Vector3();
-    public get up(): THREE.Vector3 {
+    private static _up: Vector3 = new Vector3();
+    public get up(): Vector3 {
         return Component._up.set(0, 1, 0).applyQuaternion(this.worldQuaternion);
     }

src/engine-components/DragControls.ts CHANGED Viewed

@@ -1,19 +1,18 @@
-import { Behaviour, GameObject } from "./Component";
-// import { DragControls as Control } from "../include/three/DragControls";
+import { GameObject } from "./Component";
 import { SyncedTransform } from "./SyncedTransform";
-import * as THREE from "three";
-import { IPointerClickHandler, IPointerDownHandler, IPointerEnterHandler, IPointerExitHandler, IPointerUpHandler, PointerEventData } from "./ui/PointerEvents";
+import { IPointerDownHandler, IPointerEnterHandler, IPointerExitHandler, IPointerUpHandler, PointerEventData } from "./ui/PointerEvents";
 import { Context } from "../engine/engine_setup";
 import { Interactable, UsageMarker } from "./Interactable";
 import { Rigidbody } from "./RigidBody";
 import { WebXR } from "./WebXR";
 import { Avatar_POI } from "./avatar/Avatar_Brain_LookAt";
 import { RaycastOptions } from "../engine/engine_physics";
-import { getWorldPosition, getWorldQuaternion, setWorldPosition } from "../engine/engine_three_utils";
+import { getWorldPosition, setWorldPosition } from "../engine/engine_three_utils";
 import { KeyCode } from "../engine/engine_input";
 import { nameofFactory } from "../engine/engine_utils";
 import { InstancingUtil } from "../engine/engine_instancing";
 import { OrbitControls } from "./OrbitControls";
+import { BufferGeometry, Camera, Color, Line, LineBasicMaterial, Matrix4, Mesh, MeshBasicMaterial, Object3D, Plane, Ray, Raycaster, SphereGeometry, Vector2, Vector3 } from "three";
 const debug = false;
@@ -23,8 +22,8 @@
 }
 interface SelectArgs {
-    selected: THREE.Object3D;
-    attached: THREE.Object3D | GameObject | null;
+    selected: Object3D;
+    attached: Object3D | GameObject | null;
 }
@@ -41,7 +40,7 @@
     public transformSelf: boolean = true;
     // public transformGroup: boolean = true;
-    // public targets: THREE.Object3D[] | null = null;
+    // public targets: Object3D[] | null = null;
     // private controls: Control | null = null;
     private orbit: OrbitControls | null = null;
@@ -53,7 +52,7 @@
         super();
         this.selectStartEventListener = [];
         this.selectEndEventListener = [];
-        this._dragDelta = new THREE.Vector2();
+        this._dragDelta = new Vector2();
     }
     addDragEventListener(type: DragEvents, cb: (ctrls: DragControls, args: SelectArgs) => void | Function) {
@@ -74,10 +73,10 @@
         this.orbit = GameObject.findObjectOfType(OrbitControls, this.context);
     }
-    private static lastHovered: THREE.Object3D;
+    private static lastHovered: Object3D;
     private _draggingRigidbodies: Rigidbody[] = [];
-    private allowEdit(_obj: THREE.Object3D | null = null) {
+    private allowEdit(_obj: Object3D | null = null) {
         return this.context.connection.allowEditing;
     }
@@ -160,7 +159,7 @@
     private _isDragging: boolean = false;
     private _marker: UsageMarker | null = null;
-    private _dragDelta!: THREE.Vector2;
+    private _dragDelta!: Vector2;
     private _didDrag: boolean = false;
     private _activePointerId?: number;
@@ -177,14 +176,14 @@
         if (!dc || dc !== this) return;
-        let object: THREE.Object3D = evt.object;
+        let object: Object3D = evt.object;
         if (this.transformSelf) {
             object = this.gameObject;
         }
         // raise event
-        const args: { selected: THREE.Object3D, attached: THREE.Object3D | null } = { selected: object, attached: object };
+        const args: { selected: Object3D, attached: Object3D | null } = { selected: object, attached: object };
         for (const listener of this.selectStartEventListener) {
             listener(this, args);
         }
@@ -285,54 +284,54 @@
         return this._selected !== null && this._selected !== undefined;
     }
-    public get selected(): THREE.Object3D | null {
+    public get selected(): Object3D | null {
         return this._selected;
     }
-    private _selected: THREE.Object3D | null = null;
+    private _selected: Object3D | null = null;
     private _context: Context | null = null;
-    private _camera: THREE.Camera;;
-    private _cameraPlane: THREE.Plane = new THREE.Plane();
+    private _camera: Camera;
+    private _cameraPlane: Plane = new Plane();
     private _hasGroundPlane: boolean = false;
-    private _groundPlane: THREE.Plane = new THREE.Plane();
-    private _groundOffset: THREE.Vector3 = new THREE.Vector3();
+    private _groundPlane: Plane = new Plane();
+    private _groundOffset: Vector3 = new Vector3();
     private _groundOffsetFactor: number = 0;
     private _groundDistance: number = 0;
-    private _groundPlanePoint: THREE.Vector3 = new THREE.Vector3();
+    private _groundPlanePoint: Vector3 = new Vector3();
-    private _raycaster = new THREE.Raycaster();
-    private _cameraPlaneOffset = new THREE.Vector3();
-    private _intersection = new THREE.Vector3();
-    private _worldPosition = new THREE.Vector3();
-    private _inverseMatrix = new THREE.Matrix4();
+    private _raycaster = new Raycaster();
+    private _cameraPlaneOffset = new Vector3();
+    private _intersection = new Vector3();
+    private _worldPosition = new Vector3();
+    private _inverseMatrix = new Matrix4();
     private _rbs: Rigidbody[] = [];
-    private _groundLine: THREE.Line;
-    private _groundMarker: THREE.Object3D;
-    private static geometry = new THREE.BufferGeometry().setFromPoints([new THREE.Vector3(0, 0, 0), new THREE.Vector3(0, -1, 0)]);
+    private _groundLine: Line;
+    private _groundMarker: Object3D;
+    private static geometry = new BufferGeometry().setFromPoints([new Vector3(0, 0, 0), new Vector3(0, -1, 0)]);
-    constructor(camera: THREE.Camera) {
+    constructor(camera: Camera) {
         this._camera = camera;
-        const line = new THREE.Line(DragHelper.geometry);
-        const mat = line.material as THREE.LineBasicMaterial;
-        mat.color = new THREE.Color(.4, .4, .4);
+        const line = new Line(DragHelper.geometry);
+        const mat = line.material as LineBasicMaterial;
+        mat.color = new Color(.4, .4, .4);
         line.layers.set(2);
         line.name = 'line';
         line.scale.y = 1;
         // line.matrixAutoUpdate = false;
         this._groundLine = line;
-        const geometry = new THREE.SphereGeometry(.5, 22, 22);
-        const material = new THREE.MeshBasicMaterial({ color: mat.color });
-        const sphere = new THREE.Mesh(geometry, material);
+        const geometry = new SphereGeometry(.5, 22, 22);
+        const material = new MeshBasicMaterial({ color: mat.color });
+        const sphere = new Mesh(geometry, material);
         sphere.visible = false;
         sphere.layers.set(2);
         this._groundMarker = sphere;
     }
-    setSelected(newSelected: THREE.Object3D | null, context: Context) {
+    setSelected(newSelected: Object3D | null, context: Context) {
         if (this._selected && context) {
             for (const rb of this._rbs) {
                 rb.wakeUp();
@@ -376,7 +375,7 @@
         }
     }
-    private _groundOffsetVector = new THREE.Vector3(0, 1, 0);
+    private _groundOffsetVector = new Vector3(0, 1, 0);
     private _requireUpdateGroundPlane = true;
     private _didDragOnGroundPlaneLastFrame: boolean = false;
@@ -429,7 +428,7 @@
             this._requireUpdateGroundPlane = false;
             if (this._hasGroundPlane) {
                 // const wp = getWorldPosition(this._selected);
-                // const ray = new THREE.Ray(wp, new THREE.Vector3(0, -1, 0));
+                // const ray = new Ray(wp, new Vector3(0, -1, 0));
                 if (this._raycaster.ray.intersectPlane(this._groundPlane, this._intersection)) {
                     const y = this._intersection.y;
@@ -466,7 +465,7 @@
         }
     }
-    private onUpdateWorldPosition(wp: THREE.Vector3, pointOnPlane: THREE.Vector3 | null, heightOnly: boolean) {
+    private onUpdateWorldPosition(wp: Vector3, pointOnPlane: Vector3 | null, heightOnly: boolean) {
         if (!this._selected) return;
         if (heightOnly) {
             const cur = getWorldPosition(this._selected);
@@ -503,7 +502,7 @@
     private onUpdateGroundPlane() {
         if (!this._selected || !this._context) return;
         const wp = getWorldPosition(this._selected);
-        const ray = new THREE.Ray(new THREE.Vector3(0, .1, 0).add(wp), new THREE.Vector3(0, -1, 0));
+        const ray = new Ray(new Vector3(0, .1, 0).add(wp), new Vector3(0, -1, 0));
         const opts = new RaycastOptions();
         opts.ignore = [this._selected];
         const hits = this._context.physics.raycastFromRay(ray, opts);
@@ -512,7 +511,7 @@
             if (!hit.face || this.contains(this._selected, hit.object)) {
                 continue;
             }
-            const normal = new THREE.Vector3(0, 1, 0); // hit.face.normal
+            const normal = new Vector3(0, 1, 0); // hit.face.normal
             this._groundPlane.setFromNormalAndCoplanarPoint(normal, hit.point);
             break;
         }
@@ -536,7 +535,7 @@
         }
     }
-    private contains(obj: THREE.Object3D, toSearch: THREE.Object3D): boolean {
+    private contains(obj: Object3D, toSearch: Object3D): boolean {
         if (obj === toSearch) return true;
         if (obj.children) {
             for (const child of obj.children) {

src/engine/engine_addressables.ts CHANGED Viewed

@@ -1,11 +1,10 @@
 import { getParam, resolveUrl } from "../engine/engine_utils";
-// import { loadSync, parseSync } from "./engine_scenetools";
 import { SerializationContext, TypeSerializer } from "./engine_serialization_core";
 import { Context } from "./engine_setup";
-import { Group, Object3D, Scene, Texture } from "three";
+import { Group, Object3D, Texture } from "three";
 import { processNewScripts } from "./engine_mainloop_utils";
 import { registerPrefabProvider, syncInstantiate } from "./engine_networking_instantiate";
-import { download, hash } from "./engine_web_api";
+import { download } from "./engine_web_api";
 import { getLoader } from "./engine_gltf";
 import { SourceIdentifier } from "./engine_types";
 import { destroy, instantiate, InstantiateOptions, isDestroyed } from "./engine_gameobject";
@@ -185,11 +184,11 @@
         }
     }
-    async instantiate(parent?: THREE.Object3D | InstantiateOptions) {
+    async instantiate(parent?: Object3D | InstantiateOptions) {
         return this.onInstantiate(parent, false);
     }
-    async instantiateSynced(parent?: THREE.Object3D | InstantiateOptions, saveOnServer: boolean = true) {
+    async instantiateSynced(parent?: Object3D | InstantiateOptions, saveOnServer: boolean = true) {
         return this.onInstantiate(parent, true, saveOnServer);
     }
@@ -211,7 +210,7 @@
         }
     }
-    private async onInstantiate(parent?: THREE.Object3D | InstantiateOptions, networked: boolean = false, saveOnServer?: boolean) {
+    private async onInstantiate(parent?: Object3D | InstantiateOptions, networked: boolean = false, saveOnServer?: boolean) {
         const context = Context.Current;
         if (!parent) parent = context.scene;
         if (this.mustLoad) {
@@ -282,7 +281,7 @@
      * and call destroy on the player marker root
      * @returns the scene root object if the asset was a glb/gltf
      */
-    private tryGetActualGameObjectRoot(asset: any): THREE.Object3D | null {
+    private tryGetActualGameObjectRoot(asset: any): Object3D | null {
         if (asset && asset.scene) {
             // some exporters produce additional root objects
             const scene = asset.scene as Group;

src/engine/engine_context.ts CHANGED Viewed

@@ -1,5 +1,8 @@
-import { Camera, Clock, DepthTexture, PerspectiveCamera, WebGLRenderer, WebGLRenderTarget } from 'three'
-import * as THREE from 'three'
+import { BufferGeometry, Camera, Clock, Color, DepthTexture, Group,
+	Material, NearestFilter, NoToneMapping, Object3D, PCFSoftShadowMap,
+	PerspectiveCamera, RGBAFormat, Scene, sRGBEncoding,
+	Texture, WebGLRenderer, WebGLRenderTarget
+} from 'three'
 import { Input } from './engine_input';
 import { Physics } from './engine_physics';
 import { Time } from './engine_time';
@@ -50,7 +53,7 @@
 	name?: string;
 	alias?: string;
 	domElement: HTMLElement | null;
-	renderer?: THREE.WebGLRenderer = undefined;
+	renderer?: WebGLRenderer = undefined;
 	hash?: string;
 	constructor(domElement: HTMLElement | null) {
@@ -74,7 +77,7 @@
 	ImmersiveAR = "immersive-ar",
 }
-export declare type OnBeforeRenderCallback = (renderer: THREE.WebGLRenderer, scene: THREE.Scene, camera: THREE.Camera, geometry: THREE.BufferGeometry, material: THREE.Material, group: THREE.Group) => void
+export declare type OnBeforeRenderCallback = (renderer: WebGLRenderer, scene: Scene, camera: Camera, geometry: BufferGeometry, material: Material, group: Group) => void
 export function registerComponent(script: IComponent, context?: Context) {
@@ -175,8 +178,8 @@
 	}
 	private _currentFrameEvent: FrameEvent = FrameEvent.Undefined;
-	scene: THREE.Scene;
-	renderer: THREE.WebGLRenderer;
+	scene: Scene;
+	renderer: WebGLRenderer;
 	composer: EffectComposer | null = null;
 	// all scripts
@@ -191,7 +194,7 @@
 	scripts_WithCorroutines: IComponent[] = [];
 	coroutines: { [FrameEvent: number]: Array<CoroutineData> } = {}
-	get mainCamera(): THREE.Camera | null {
+	get mainCamera(): Camera | null {
 		if (this.mainCameraComponent) {
 			const cam = this.mainCameraComponent as ICamera;
 			if (!cam.cam)
@@ -251,21 +254,21 @@
 			// some tonemapping other than "NONE" is required for adjusting exposure with EXR environments
 			this.renderer.toneMappingExposure = 1; // range [0...inf] instead of the usual -15..15
-			this.renderer.toneMapping = THREE.NoToneMapping; // could also set to LinearToneMapping, ACESFilmicToneMapping
+			this.renderer.toneMapping = NoToneMapping; // could also set to LinearToneMapping, ACESFilmicToneMapping
-			this.renderer.setClearColor(new THREE.Color('lightgrey'), 0);
+			this.renderer.setClearColor(new Color('lightgrey'), 0);
 			// @ts-ignore
 			this.renderer.antialias = true;
 			// @ts-ignore
 			this.renderer.alpha = false;
 			this.renderer.shadowMap.enabled = true;
-			this.renderer.shadowMap.type = THREE.PCFSoftShadowMap;
+			this.renderer.shadowMap.type = PCFSoftShadowMap;
 			this.renderer.setSize(this.domWidth, this.domHeight);
-			this.renderer.outputEncoding = THREE.sRGBEncoding;
+			this.renderer.outputEncoding = sRGBEncoding;
 			this.renderer.physicallyCorrectLights = true;
 		}
-		this.scene = new THREE.Scene();
+		this.scene = new Scene();
 		ContextRegistry.register(this);
@@ -328,7 +331,7 @@
 		}
 	}
-	updateAspect(camera: THREE.PerspectiveCamera, width?: number, height?: number) {
+	updateAspect(camera: PerspectiveCamera, width?: number, height?: number) {
 		if (!camera) return;
 		if (width === undefined)
 			width = this.domWidth;
@@ -410,7 +413,7 @@
 		if (index >= 0) this._cameraStack.splice(index, 1);
 		this._cameraStack.push(cam);
 		this.mainCameraComponent = cam;
-		const camera = cam.cam as THREE.PerspectiveCamera;
+		const camera = cam.cam as PerspectiveCamera;
 		if (camera.isPerspectiveCamera)
 			this.updateAspect(camera);
 		(this.mainCameraComponent as ICamera)?.applyClearFlagsIfIsActiveCamera();
@@ -434,7 +437,7 @@
 	private _onBeforeRenderListeners: { [key: string]: OnBeforeRenderCallback[] } = {};
 	/** use this to subscribe to onBeforeRender events on threejs objects */
-	addBeforeRenderListener(target: THREE.Object3D, callback: OnBeforeRenderCallback) {
+	addBeforeRenderListener(target: Object3D, callback: OnBeforeRenderCallback) {
 		if (!this._onBeforeRenderListeners[target.uuid]) {
 			this._onBeforeRenderListeners[target.uuid] = [];
 			const onBeforeRenderCallback = (renderer, scene, camera, geometry, material, group) => {
@@ -450,7 +453,7 @@
 		this._onBeforeRenderListeners[target.uuid].push(callback);
 	}
-	removeBeforeRenderListener(target: THREE.Object3D, callback: OnBeforeRenderCallback) {
+	removeBeforeRenderListener(target: Object3D, callback: OnBeforeRenderCallback) {
 		if (this._onBeforeRenderListeners[target.uuid]) {
 			const arr = this._onBeforeRenderListeners[target.uuid];
 			const idx = arr.indexOf(callback);
@@ -473,11 +476,11 @@
 		this._requireColorTexture = val;
 	}
-	get depthTexture(): THREE.DepthTexture | null {
+	get depthTexture(): DepthTexture | null {
 		return this._renderTarget?.depthTexture || null;
 	}
-	get opaqueColorTexture(): THREE.Texture | null {
+	get opaqueColorTexture(): Texture | null {
 		return this._renderTarget?.texture || null;
 	}
@@ -822,17 +825,17 @@
 		if (!this.mainCamera) return;
 		if (!this._requireDepthTexture && !this._requireColorTexture) return;
 		if (!this._renderTarget) {
-			this._renderTarget = new THREE.WebGLRenderTarget(this.domWidth, this.domHeight);
+			this._renderTarget = new WebGLRenderTarget(this.domWidth, this.domHeight);
 			if (this._requireDepthTexture) {
 				const dt = new DepthTexture(this.domWidth, this.domHeight);;
 				this._renderTarget.depthTexture = dt;
 			}
 			if (this._requireColorTexture) {
-				this._renderTarget.texture = new THREE.Texture();
+				this._renderTarget.texture = new Texture();
 				this._renderTarget.texture.generateMipmaps = false;
-				this._renderTarget.texture.minFilter = THREE.NearestFilter;
-				this._renderTarget.texture.magFilter = THREE.NearestFilter;
-				this._renderTarget.texture.format = THREE.RGBAFormat;
+				this._renderTarget.texture.minFilter = NearestFilter;
+				this._renderTarget.texture.magFilter = NearestFilter;
+				this._renderTarget.texture.format = RGBAFormat;
 			}
 		}
 		const rt = this._renderTarget;
@@ -909,24 +912,24 @@
 }
-// const scene = new THREE.Scene();
+// const scene = new Scene();
 // const useComposer = utils.getParam("postfx");
 // const renderer = new WebGLRenderer({ antialias: true });
 // const composer = useComposer ? new EffectComposer(renderer) : undefined;
-// renderer.setClearColor(new THREE.Color('lightgrey'), 0)
+// renderer.setClearColor(new Color('lightgrey'), 0)
 // renderer.antialias = true;
 // renderer.alpha = false;
 // renderer.shadowMap.enabled = true;
-// renderer.shadowMap.type = THREE.PCFSoftShadowMap;
+// renderer.shadowMap.type = PCFSoftShadowMap;
 // renderer.setSize(window.innerWidth, window.innerHeight);
-// renderer.outputEncoding = THREE.sRGBEncoding;
+// renderer.outputEncoding = sRGBEncoding;
 // renderer.physicallyCorrectLights = true;
 // document.body.appendChild(renderer.domElement);
 // // generation pushes loading requests in this array
 // const sceneData: {
-//     mainCamera: THREE.Camera | undefined
+//     mainCamera: Camera | undefined
 // } = {
 //     preparing: [],
 //     resolving: [],

src/engine/engine_gameobject.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { BufferGeometry, InstancedBufferGeometry, Material, Mesh, Object3D, Texture } from "three";
+import { Bone, Object3D, Quaternion, SkinnedMesh, Vector3 } from "three";
 import { processNewScripts } from "./engine_mainloop_utils";
 import { InstantiateIdProvider } from "./engine_networking_instantiate";
 import { Context, registerComponent } from "./engine_setup";
@@ -36,9 +36,9 @@
     parent?: string | undefined | Object3D;
     /** for duplicatable parenting */
     keepWorldPosition?: boolean
-    position?: THREE.Vector3 | undefined;
-    rotation?: THREE.Quaternion | undefined;
-    scale?: THREE.Vector3 | undefined;
+    position?: Vector3 | undefined;
+    rotation?: Quaternion | undefined;
+    scale?: Vector3 | undefined;
     visible?: boolean | undefined;
@@ -88,14 +88,14 @@
     return go[activeInHierarchyFieldName] || isUsingInstancing(go);
 }
-export function markAsInstancedRendered(go: THREE.Object3D, instanced: boolean) {
+export function markAsInstancedRendered(go: Object3D, instanced: boolean) {
     go[$isUsingInstancing] = instanced;
 }
-export function isUsingInstancing(instance: THREE.Object3D): boolean { return InstancingUtil.isUsingInstancing(instance); }
+export function isUsingInstancing(instance: Object3D): boolean { return InstancingUtil.isUsingInstancing(instance); }
-export function findByGuid(guid: string, hierarchy: THREE.Object3D): GameObject | IComponent | null | undefined {
+export function findByGuid(guid: string, hierarchy: Object3D): GameObject | IComponent | null | undefined {
     return tryFindObject(guid, hierarchy, true, true);
 }
@@ -159,7 +159,7 @@
 declare type ForEachComponentCallback = (comp: Component) => any;
-export function foreachComponent(instance: THREE.Object3D, cb: ForEachComponentCallback, recursive: boolean = true): any {
+export function foreachComponent(instance: Object3D, cb: ForEachComponentCallback, recursive: boolean = true): any {
     return internalForEachComponent(instance, cb, recursive);
 }
@@ -198,8 +198,8 @@
 }
 declare class NewGameObjectReferenceInfo {
-    original: THREE.Object3D;
-    clone: THREE.Object3D;
+    original: Object3D;
+    clone: Object3D;
 }
 export function instantiate(instance: GameObject | Object3D | null, opts: InstantiateOptions | null = null): GameObject | null {
@@ -210,7 +210,7 @@
         // if x is defined assume this is a vec3 - this is just to not break everything at once and stay a little bit backwards compatible
         if (opts["x"] !== undefined) {
             options = new InstantiateOptions();
-            options.position = opts as unknown as THREE.Vector3;
+            options.position = opts as unknown as Vector3;
         }
         else {
             // if (opts instanceof InstantiateOptions)
@@ -276,12 +276,12 @@
 function internalInstantiate(
-    context: Context, instance: GameObject | THREE.Object3D, opts: InstantiateOptions | null,
+    context: Context, instance: GameObject | Object3D, opts: InstantiateOptions | null,
     componentsList: Array<Component>,
     newGameObjectsMap: { [key: string]: NewGameObjectReferenceInfo },
     skinnedMeshesMap: { [key: string]: NewGameObjectReferenceInfo }
 )
-    : GameObject | THREE.Object3D | null {
+    : GameObject | Object3D | null {
     if (!instance) return null;
     // prepare, remove things that dont work out of the box
     // e.g. user data we want to manually clone
@@ -290,7 +290,7 @@
     instance.userData = {};
     const children = instance.children;
     instance.children = [];
-    let clone: THREE.Object3D | GameObject;
+    let clone: Object3D | GameObject;
     clone = instance.clone(false);
     apply(clone);
     // if(instance[$originalGuid])
@@ -408,9 +408,9 @@
 ) {
     for (const key in skinnedMeshes) {
         const val = skinnedMeshes[key];
-        const original = val.original as THREE.SkinnedMesh;
+        const original = val.original as SkinnedMesh;
         const originalSkeleton = original.skeleton;
-        const clone = val.clone as THREE.SkinnedMesh;
+        const clone = val.clone as SkinnedMesh;
         // clone.updateWorldMatrix(true, true);
         if (!originalSkeleton) {
             console.warn("Skinned mesh has no skeleton?", val);
@@ -426,16 +426,16 @@
         // clone.bindMatrix.multiplyScalar(.025);
         // console.assert(originalSkeleton.uuid !== clonedSkeleton.uuid);
         // console.assert(originalBones.length === clonedSkeleton.bones.length);
-        const bones: Array<THREE.Bone> = [];
+        const bones: Array<Bone> = [];
         clonedSkeleton.bones = bones;
         for (let i = 0; i < originalBones.length; i++) {
             const bone = originalBones[i];
             const newBoneInfo = newObjectsMap[bone.uuid];
-            const clonedBone = newBoneInfo.clone as THREE.Bone;
+            const clonedBone = newBoneInfo.clone as Bone;
             // console.log("NEW BONE: ", clonedBone, "BEFORE", newBoneInfo.original);
             bones.push(clonedBone);
         }
-        // clone.skeleton = new THREE.Skeleton(bones);
+        // clone.skeleton = new Skeleton(bones);
         // clone.skeleton.update();
         // clone.pose();
         // clone.scale.set(1,1,1);
@@ -443,7 +443,7 @@
         // console.log("ORIG", original, "CLONE", clone);
     }
     for (const key in skinnedMeshes) {
-        const clone = skinnedMeshes[key].clone as THREE.SkinnedMesh;
+        const clone = skinnedMeshes[key].clone as SkinnedMesh;
         clone.skeleton.update();
         // clone.skeleton.calculateInverses();
         clone.bind(clone.skeleton, clone.bindMatrix);
@@ -532,7 +532,7 @@
 }
-function postProcessNewInstance(copy: THREE.Object3D, key: string, value: IComponent | Object3D | any, newObjectsMap: { [key: string]: NewGameObjectReferenceInfo }) {
+function postProcessNewInstance(copy: Object3D, key: string, value: IComponent | Object3D | any, newObjectsMap: { [key: string]: NewGameObjectReferenceInfo }) {
     if (value === null || value === undefined) return;
     if ((value as IComponent).isComponent === true) {
         const originalGameObjectReference = value["gameObject"];

src/engine/engine_gizmos.ts CHANGED Viewed

@@ -1,7 +1,6 @@
-import * as THREE from 'three';
 import { BufferAttribute, Line, BoxGeometry, EdgesGeometry, Color, LineSegments, LineBasicMaterial, Object3D, Mesh, SphereGeometry, ColorRepresentation, Vector3, Box3, Quaternion, CylinderGeometry } from 'three';
 import { Context } from './engine_setup';
-import { setWorldPosition, setWorldPositionXYZ } from './engine_three_utils';
+import { setWorldPositionXYZ } from './engine_three_utils';
 import { Vec3, Vec4 } from './engine_types';
 const _tmp = new Vector3();
@@ -109,12 +108,12 @@
 }
 const box: BoxGeometry = new BoxGeometry(1, 1, 1);
-export function CreateWireCube(col: THREE.ColorRepresentation | null = null): THREE.LineSegments {
+export function CreateWireCube(col: ColorRepresentation | null = null): LineSegments {
     const color = new Color(col ?? 0xdddddd);
-    // const material = new THREE.MeshBasicMaterial();
-    // material.color = new THREE.Color(col ?? 0xdddddd);
+    // const material = new MeshBasicMaterial();
+    // material.color = new Color(col ?? 0xdddddd);
     // material.wireframe = true;
-    // const box = new THREE.Mesh(box, material);
+    // const box = new Mesh(box, material);
     // box.name = "BOX_GIZMO";
     const edges = new EdgesGeometry(box);
     const line = new LineSegments(edges, new LineBasicMaterial({ color: color }));

src/engine/engine_gltf_builtin_components.ts CHANGED Viewed

@@ -1,7 +1,5 @@
 import "./codegen/register_types";
 import { TypeStore } from "./engine_typestore";
-import * as THREE from "three";
-// import { GameObject } from "../engine-components/Component";
 import { InstantiateIdProvider } from "./engine_networking_instantiate"
 import { Context } from "./engine_setup";
 import { deserializeObject, serializeObject } from "./engine_serialization";
@@ -15,6 +13,7 @@
 import { getParam } from "./engine_utils";
 import { LogType, showBalloonMessage } from "./debug/debug";
 import { isLocalNetwork } from "./engine_networking_utils";
+import { Object3D } from "three";
 const debug = debugExtension;
@@ -43,7 +42,7 @@
 export async function createBuiltinComponents(context: Context, gltfId: SourceIdentifier, gltf, seed: number | null | UIDProvider = null, extension?: NEEDLE_components) {
     if (!gltf) return;
-    const lateResolve: Array<(gltf: THREE.Object3D) => {}> = [];
+    const lateResolve: Array<(gltf: Object3D) => {}> = [];
     let idProvider: UIDProvider | null = seed as UIDProvider;
     if (typeof idProvider === "number") {
@@ -145,15 +144,15 @@
 declare class DeserializeData {
     instance: any;
     compData: IGltfbuiltinComponent;
-    obj: THREE.Object3D;
+    obj: Object3D;
 }
-declare type LateResolveCallback = (gltf: THREE.Object3D) => void;
+declare type LateResolveCallback = (gltf: Object3D) => void;
 const unknownComponentsBuffer: Array<string> = [];
-async function onCreateBuiltinComponents(context: SerializationContext, obj: THREE.Object3D,
+async function onCreateBuiltinComponents(context: SerializationContext, obj: Object3D,
     deserialize: DeserializeData[], lateResolve: LateResolveCallback[]) {
     if (!obj) return;
@@ -324,13 +323,13 @@
 // function tryResolveType(type, entry): any | undefined {
 //     switch (type) {
 //         case "Vector2":
-//             return new THREE.Vector2(entry.x, entry.y);
+//             return new Vector2(entry.x, entry.y);
 //         case "Vector3":
-//             return new THREE.Vector3(entry.x, entry.y, entry.z);
+//             return new Vector3(entry.x, entry.y, entry.z);
 //         case "Vector4":
-//             return new THREE.Vector4(entry.x, entry.y, entry.z, entry.w);
+//             return new Vector4(entry.x, entry.y, entry.z, entry.w);
 //         case "Quaternion":
-//             return new THREE.Quaternion(entry.x, entry.y, entry.z, entry.w);
+//             return new Quaternion(entry.x, entry.y, entry.z, entry.w);
 //     }
 //     return undefined;
 // }

src/engine/engine_input.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-import * as THREE from 'three';
 import { Vector2 } from 'three';
 import { showBalloonMessage, showBalloonWarning } from './debug/debug';
 import { assign } from './engine_serialization_core';
@@ -58,8 +57,8 @@
     _doubleClickTimeThreshold = .2;
     _longPressTimeThreshold = 1;
-    get mousePosition(): THREE.Vector2 { return this._pointerPositions[0]; };
-    get mousePositionRC(): THREE.Vector2 { return this._pointerPositionsRC[0]; }
+    get mousePosition(): Vector2 { return this._pointerPositions[0]; };
+    get mousePositionRC(): Vector2 { return this._pointerPositionsRC[0]; }
     get mouseDown(): boolean { return this._pointerDown[0]; }
     get mouseUp(): boolean { return this._pointerUp[0]; }
     get mouseClick(): boolean { return this._pointerClick[0]; }
@@ -91,19 +90,19 @@
         return count;
     }
-    getPointerPosition(i: number): THREE.Vector2 | null {
+    getPointerPosition(i: number): Vector2 | null {
         if (i >= this._pointerPositions.length) return null;
         return this._pointerPositions[i];
     }
-    getPointerPositionLastFrame(i: number): THREE.Vector2 | null {
+    getPointerPositionLastFrame(i: number): Vector2 | null {
         if (i >= this._pointerPositionsLastFrame.length) return null;
         return this._pointerPositionsLastFrame[i];
     }
-    getPointerPositionDelta(i: number): THREE.Vector2 | null {
+    getPointerPositionDelta(i: number): Vector2 | null {
         if (i >= this._pointerPositionsDelta.length) return null;
         return this._pointerPositionsDelta[i];
     }
-    getPointerPositionRC(i: number): THREE.Vector2 | null {
+    getPointerPositionRC(i: number): Vector2 | null {
         if (i >= this._pointerPositionsRC.length) return null;
         return this._pointerPositionsRC[i];
     }
@@ -213,11 +212,11 @@
     private _pointerClick: boolean[] = [false];
     private _pointerDoubleClick: boolean[] = [false];
     private _pointerPressed: boolean[] = [false];
-    private _pointerPositions: THREE.Vector2[] = [new THREE.Vector2()];
-    private _pointerPositionsLastFrame: THREE.Vector2[] = [new THREE.Vector2()];
-    private _pointerPositionsDelta: THREE.Vector2[] = [new THREE.Vector2()];
-    private _pointerPositionsRC: THREE.Vector2[] = [new THREE.Vector2()];
-    private _pointerPositionDown: THREE.Vector2[] = [new THREE.Vector2()];
+    private _pointerPositions: Vector2[] = [new Vector2()];
+    private _pointerPositionsLastFrame: Vector2[] = [new Vector2()];
+    private _pointerPositionsDelta: Vector2[] = [new Vector2()];
+    private _pointerPositionsRC: Vector2[] = [new Vector2()];
+    private _pointerPositionDown: Vector2[] = [new Vector2()];
     private _pointerDownTime: number[] = [];
     private _pointerUpTime: number[] = [];
     private _pointerUpTimestamp: number[] = [];
@@ -505,9 +504,9 @@
         while (evt.button >= this._pointerTypes.length) this._pointerTypes.push(evt.pointerType);
         this._pointerTypes[evt.button] = evt.pointerType;
-        while (evt.button >= this._pointerPositionDown.length) this._pointerPositionDown.push(new THREE.Vector2());
+        while (evt.button >= this._pointerPositionDown.length) this._pointerPositionDown.push(new Vector2());
         this._pointerPositionDown[evt.button].set(evt.clientX, evt.clientY);
-        while (evt.button >= this._pointerPositions.length) this._pointerPositions.push(new THREE.Vector2());
+        while (evt.button >= this._pointerPositions.length) this._pointerPositions.push(new Vector2());
         this._pointerPositions[evt.button].set(evt.clientX, evt.clientY);
         if (evt.button >= this._pointerDownTime.length) this._pointerDownTime.push(0);
@@ -577,9 +576,9 @@
     private updatePointerPosition(evt: PointerEventArgs) {
         // console.log("MOVE");
-        while (evt.button >= this._pointerPositions.length) this._pointerPositions.push(new THREE.Vector2());
-        while (evt.button >= this._pointerPositionsLastFrame.length) this._pointerPositionsLastFrame.push(new THREE.Vector2());
-        while (evt.button >= this._pointerPositionsDelta.length) this._pointerPositionsDelta.push(new THREE.Vector2());
+        while (evt.button >= this._pointerPositions.length) this._pointerPositions.push(new Vector2());
+        while (evt.button >= this._pointerPositionsLastFrame.length) this._pointerPositionsLastFrame.push(new Vector2());
+        while (evt.button >= this._pointerPositionsDelta.length) this._pointerPositionsDelta.push(new Vector2());
         const lf = this._pointerPositionsLastFrame[evt.button];
         lf.copy(this._pointerPositions[evt.button]);
@@ -593,7 +592,7 @@
         // we want to have the position 01 on the canvas for raycasting
         const px = evt.clientX;
         const py = evt.clientY;
-        while (evt.button >= this._pointerPositionsRC.length) this._pointerPositionsRC.push(new THREE.Vector2());
+        while (evt.button >= this._pointerPositionsRC.length) this._pointerPositionsRC.push(new Vector2());
         const rc = this._pointerPositionsRC[evt.button];
         rc.set(px, py);
         this.convertScreenspaceToRaycastSpace(rc);

src/engine/engine_license.ts CHANGED Viewed

@@ -7,10 +7,10 @@
 // This is modified by a bundler (e.g. vite)
 // Do not edit manually
-const HAS_LICENSE = false;
+const NEEDLE_ENGINE_COMMERCIAL_USE_LICENSE = false;
 export function hasProLicense() {
-    return HAS_LICENSE;
+    return NEEDLE_ENGINE_COMMERCIAL_USE_LICENSE;
 }

src/engine/engine_mainloop_utils.ts CHANGED Viewed

@@ -230,7 +230,7 @@
     }
 }
-function updateIsActiveInHierarchyRecursiveRuntime(go: THREE.Object3D, activeInHierarchy: boolean, allowEventCall: boolean, level: number = 0) {
+function updateIsActiveInHierarchyRecursiveRuntime(go: Object3D, activeInHierarchy: boolean, allowEventCall: boolean, level: number = 0) {
     if (level > 1000) {
         console.warn("Hierarchy is too deep (> 1000 level) - will abort updating active state");
         return false;
@@ -307,7 +307,7 @@
 // let isRunning = false;
 // // Prevent: https://github.com/needle-tools/needle-tiny/issues/641
-// const temporyChildArrayBuffer: Array<Array<THREE.Object3D>> = [];
+// const temporyChildArrayBuffer: Array<Array<Object3D>> = [];
 // export function* iterateChildrenSafe(obj: Object3D) {
 //     if (!obj || !obj.children) yield null;
 //     // if(isRunning) return;
@@ -322,9 +322,9 @@
 //     temporyChildArrayBuffer.push(arr);
 // }
-export function updateActiveInHierarchyWithoutEventCall(go: THREE.Object3D) {
+export function updateActiveInHierarchyWithoutEventCall(go: Object3D) {
     let activeInHierarchy = true;
-    let current: THREE.Object3D | null = go;
+    let current: Object3D | null = go;
     let foundScene: boolean = false;
     while (current) {
         if (!current) break;
@@ -342,7 +342,7 @@
     go[constants.activeInHierarchyFieldName] = activeInHierarchy && foundScene;
 }
-function perComponent(go: THREE.Object3D, evt: (comp: IComponent) => void) {
+function perComponent(go: Object3D, evt: (comp: IComponent) => void) {
     if (go.userData?.components) {
         for (const comp of go.userData.components) {
             evt(comp);

src/engine/engine_networking_auto.ts CHANGED Viewed

@@ -210,7 +210,7 @@
  * (for example a networked color is sent as a number and may be converted to a color in the receiver again)
  * Parameters: (newValue, previousValue)
  */
-export const syncField = function(onFieldChanged: string | FieldChangedCallbackFn) {
+export const syncField = function(onFieldChanged?: string | FieldChangedCallbackFn) {
     return function (target: any, propertyKey: string) {

src/engine/engine_networking_files.ts CHANGED Viewed

@@ -1,6 +1,4 @@
 import { Context } from "../engine/engine_setup";
-// import { loadSync, parseSync } from "../engine/engine_scenetools";
-import * as THREE from "three";
 import * as web from "../engine/engine_web_api";
 import { NetworkConnection } from "../engine/engine_networking";
 import { generateSeed, InstantiateIdProvider } from "../engine/engine_networking_instantiate";
@@ -11,6 +9,7 @@
 import { IGameObject } from "./engine_types";
 import { findByGuid } from "./engine_gameobject";
 import { ContextEvent, ContextRegistry } from "./engine_context_registry";
+import { BoxGeometry, BoxHelper, Mesh, MeshBasicMaterial, Object3D, Vector3 } from "three";
 export enum File_Event {
     File_Spawned = "file-spawned",
@@ -21,15 +20,15 @@
     file_name: string;
     file_hash: string;
     file_size: number;
-    position: THREE.Vector3 | null;
+    position: Vector3 | null;
     seed: number;
     sender: string;
     serverUrl: string;
     parentGuid?: string;
-    boundsSize?: THREE.Vector3;
+    boundsSize?: Vector3;
-    constructor(connectionId: string, seed: number, guid: string, name: string, hash: string, size: number, position: THREE.Vector3 | null, serverUrl: string) {
+    constructor(connectionId: string, seed: number, guid: string, name: string, hash: string, size: number, position: Vector3 | null, serverUrl: string) {
         this.seed = seed;
         this.guid = guid;
         this.file_name = name;
@@ -129,7 +128,7 @@
                     // add object to proper parent
                     if (evt.parentGuid) {
-                        const parent = findByGuid(evt.parentGuid, context.scene) as THREE.Object3D;
+                        const parent = findByGuid(evt.parentGuid, context.scene) as Object3D;
                         if ("add" in parent) parent.add(obj);
                     }
                     if (!obj.parent)
@@ -182,16 +181,16 @@
 }
-const previews: { [key: string]: THREE.Object3D } = {};
+const previews: { [key: string]: Object3D } = {};
 function addPreview(evt: FileSpawnModel, context: Context) {
-    const sphere = new THREE.BoxGeometry();
-    const object = new THREE.Mesh(sphere, new THREE.MeshBasicMaterial({ color: 0x00ff00 }));
-    const box = new THREE.BoxHelper(object, 0x555555);
+    const sphere = new BoxGeometry();
+    const object = new Mesh(sphere, new MeshBasicMaterial({ color: 0x00ff00 }));
+    const box = new BoxHelper(object, 0x555555);
     previews[evt.guid] = box;
     context.scene.add(box);
     if (evt.parentGuid) {
-        const parent = findByGuid(evt.parentGuid, context.scene) as THREE.Object3D;
+        const parent = findByGuid(evt.parentGuid, context.scene) as Object3D;
         if (parent)
             parent.add(box);
     }

src/engine/engine_three_utils.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import * as THREE from "three";
 import { Mathf } from "./engine_math"
-import { WebGLRenderer, Vector3, Quaternion, Uniform, Texture, Material, ShaderMaterial, CanvasTexture, AnimationAction, Camera, PerspectiveCamera } from "three";
+import { WebGLRenderer, Vector3, Quaternion, Uniform, Texture, Material, ShaderMaterial, CanvasTexture, AnimationAction, Camera, PerspectiveCamera, Object3D, Euler, PlaneGeometry, Scene, Mesh } from "three";
 import { CircularBuffer } from "./engine_utils";
@@ -12,16 +12,16 @@
 }
 const flipYQuat: Quaternion = new Quaternion().setFromAxisAngle(new Vector3(0, 1, 0), Math.PI);
-export function lookAtInverse(obj: THREE.Object3D, target: Vector3) {
+export function lookAtInverse(obj: Object3D, target: Vector3) {
     obj.lookAt(target);
     obj.quaternion.multiply(flipYQuat);
 }
-const _worldPositions = new CircularBuffer(() => new THREE.Vector3(), 100);
+const _worldPositions = new CircularBuffer(() => new Vector3(), 100);
-export function getWorldPosition(obj: THREE.Object3D, vec: THREE.Vector3 | null = null, updateParents: boolean = true): THREE.Vector3 {
+export function getWorldPosition(obj: Object3D, vec: Vector3 | null = null, updateParents: boolean = true): Vector3 {
     const wp = vec ?? _worldPositions.get();
     if (!obj) return wp.set(0, 0, 0);
     if (!obj.parent) return wp.copy(obj.position);
@@ -33,7 +33,7 @@
     return wp;
 }
-export function setWorldPosition(obj: THREE.Object3D, val: THREE.Vector3) {
+export function setWorldPosition(obj: Object3D, val: Vector3) {
     if (!obj) return;
     const wp = _worldPositions.get();
     if (val !== wp)
@@ -43,25 +43,25 @@
     obj.position.set(wp.x, wp.y, wp.z);
 }
-export function setWorldPositionXYZ(obj: THREE.Object3D, x: number, y: number, z: number) {
+export function setWorldPositionXYZ(obj: Object3D, x: number, y: number, z: number) {
     const wp = _worldPositions.get();
     wp.set(x, y, z);
     setWorldPosition(obj, wp);
 }
-const _worldQuaternionBuffer: THREE.Quaternion = new THREE.Quaternion();
-const _worldQuaternion: THREE.Quaternion = new THREE.Quaternion();
-const _tempQuaternionBuffer2: THREE.Quaternion = new THREE.Quaternion();
+const _worldQuaternionBuffer: Quaternion = new Quaternion();
+const _worldQuaternion: Quaternion = new Quaternion();
+const _tempQuaternionBuffer2: Quaternion = new Quaternion();
-export function getWorldQuaternion(obj: THREE.Object3D, target: THREE.Quaternion | null = null): THREE.Quaternion {
+export function getWorldQuaternion(obj: Object3D, target: Quaternion | null = null): Quaternion {
     if (!obj) return _worldQuaternion.set(0, 0, 0, 1);
     const quat = target ?? _worldQuaternion;
     if (!obj.parent) return quat.copy(obj.quaternion);
     obj.getWorldQuaternion(quat);
     return quat;
 }
-export function setWorldQuaternion(obj: THREE.Object3D, val: THREE.Quaternion) {
+export function setWorldQuaternion(obj: Object3D, val: Quaternion) {
     if (!obj) return;
     if (val !== _worldQuaternionBuffer)
         _worldQuaternionBuffer.copy(val);
@@ -74,22 +74,22 @@
     obj.quaternion.set(q.x, q.y, q.z, q.w);
     // console.error("quaternion world to local is not yet implemented");
 }
-export function setWorldQuaternionXYZW(obj: THREE.Object3D, x: number, y: number, z: number, w: number) {
+export function setWorldQuaternionXYZW(obj: Object3D, x: number, y: number, z: number, w: number) {
     _worldQuaternionBuffer.set(x, y, z, w);
     setWorldQuaternion(obj, _worldQuaternionBuffer);
 }
-const _worldScale: THREE.Vector3 = new THREE.Vector3();
-const _worldScale2: THREE.Vector3 = new THREE.Vector3();
+const _worldScale: Vector3 = new Vector3();
+const _worldScale2: Vector3 = new Vector3();
-export function getWorldScale(obj: THREE.Object3D, vec: THREE.Vector3 | null = null): THREE.Vector3 {
+export function getWorldScale(obj: Object3D, vec: Vector3 | null = null): Vector3 {
     if (!obj) return _worldScale.set(0, 0, 0);
     if (!obj.parent) return _worldScale.copy(obj.scale);
     obj.getWorldScale(vec ?? _worldScale);
     return vec ?? _worldScale;
 }
-export function setWorldScale(obj: THREE.Object3D, vec: THREE.Vector3) {
+export function setWorldScale(obj: Object3D, vec: Vector3) {
     if (!obj) return;
     if (!obj.parent) {
         obj.scale.copy(vec);
@@ -102,35 +102,35 @@
     obj.scale.copy(tempVec);
 }
-const _forward = new THREE.Vector3();
-const _forwardQuat = new THREE.Quaternion();
-export function forward(obj: THREE.Object3D): THREE.Vector3 {
+const _forward = new Vector3();
+const _forwardQuat = new Quaternion();
+export function forward(obj: Object3D): Vector3 {
     getWorldQuaternion(obj, _forwardQuat);
     return _forward.set(0, 0, 1).applyQuaternion(_forwardQuat);
 }
-const _worldEulerBuffer: THREE.Euler = new THREE.Euler();
-const _worldEuler: THREE.Euler = new THREE.Euler();
-const _worldRotation: THREE.Vector3 = new THREE.Vector3();
+const _worldEulerBuffer: Euler = new Euler();
+const _worldEuler: Euler = new Euler();
+const _worldRotation: Vector3 = new Vector3();
 // world euler (in radians)
-export function getWorldEuler(obj: THREE.Object3D): THREE.Euler {
+export function getWorldEuler(obj: Object3D): Euler {
     obj.getWorldQuaternion(_worldQuaternion);
     _worldEuler.setFromQuaternion(_worldQuaternion);
     return _worldEuler;
 }
 // world euler (in radians)
-export function setWorldEuler(obj: THREE.Object3D, val: THREE.Euler) {
+export function setWorldEuler(obj: Object3D, val: Euler) {
     setWorldQuaternion(obj, _worldQuaternion.setFromEuler(val));;
 }
 // returns rotation in degrees
-export function getWorldRotation(obj: THREE.Object3D): THREE.Vector3 {
+export function getWorldRotation(obj: Object3D): Vector3 {
     const rot = getWorldEuler(obj);
     const wr = _worldRotation;
     wr.set(rot.x, rot.y, rot.z);
@@ -140,11 +140,11 @@
     return wr;
 }
-export function setWorldRotation(obj: THREE.Object3D, val: THREE.Vector3) {
+export function setWorldRotation(obj: Object3D, val: Vector3) {
     setWorldRotationXYZ(obj, val.x, val.y, val.z, true);
 }
-export function setWorldRotationXYZ(obj: THREE.Object3D, x: number, y: number, z: number, degrees: boolean = true) {
+export function setWorldRotationXYZ(obj: Object3D, x: number, y: number, z: number, degrees: boolean = true) {
     if (degrees) {
         x = Mathf.toRadians(x);
         y = Mathf.toRadians(y);
@@ -159,18 +159,18 @@
-// from https://github.com/mrdoob/three.js/pull/10995#issuecomment-287614722
-export function logHierarchy(root: THREE.Object3D | null | undefined, collapsible: boolean = true) {
+// from https://github.com/mrdoob/js/pull/10995#issuecomment-287614722
+export function logHierarchy(root: Object3D | null | undefined, collapsible: boolean = true) {
     if (!root) return;
     if (collapsible) {
-        (function printGraph(obj: THREE.Object3D) {
+        (function printGraph(obj: Object3D) {
             console.groupCollapsed((obj.name ? obj.name : '(no name : ' + obj.type + ')') + ' %o', obj);
             obj.children.forEach(printGraph);
             console.groupEnd();
         }(root));
     } else {
-        root.traverse(function (obj: THREE.Object3D) {
+        root.traverse(function (obj: Object3D) {
             var s = '|___';
             var obj2 = obj;
             while (obj2.parent !== null) {
@@ -198,10 +198,10 @@
 export class Graphics {
-    private static planeGeometry = new THREE.PlaneGeometry(2, 2, 1, 1);
+    private static planeGeometry = new PlaneGeometry(2, 2, 1, 1);
     private static renderer = new WebGLRenderer({ antialias: false });
-    private static perspectiveCam = new THREE.PerspectiveCamera();
-    private static scene = new THREE.Scene();
+    private static perspectiveCam = new PerspectiveCamera();
+    private static scene = new Scene();
     private static readonly vertex = `
     varying vec2 vUv;
     void main(){
@@ -230,7 +230,7 @@
             fragmentShader: fragment
         });
     }
-    private static readonly mesh = new THREE.Mesh(this.planeGeometry, this.blipMaterial);
+    private static readonly mesh = new Mesh(this.planeGeometry, this.blipMaterial);
     static copyTexture(texture: Texture, blitMaterial?: ShaderMaterial) {
         const material = blitMaterial ?? this.blipMaterial;
@@ -292,12 +292,12 @@
 }
 /**@obsolete use Graphics.copyTexture */
-export function copyTexture(texture: THREE.Texture): THREE.Texture {
+export function copyTexture(texture: Texture): Texture {
     return Graphics.copyTexture(texture);
 }
 /**@obsolete use Graphics.textureToCanvas */
-export function textureToCanvas(texture: THREE.Texture, force: boolean = false): HTMLCanvasElement | null {
+export function textureToCanvas(texture: Texture, force: boolean = false): HTMLCanvasElement | null {
     return Graphics.textureToCanvas(texture, force);
 }

src/engine/extensions/NEEDLE_components.ts CHANGED Viewed

@@ -6,6 +6,7 @@
 import { resolveReferences } from "./extension_utils";
 import { apply } from "../../engine-components/js-extensions/Object3D";
 import { getLoader } from "../engine_gltf";
+import { Object3D } from "three";
 export const debug = debugExtension
 const componentsArrayExportKey = "$___Export_Components";
@@ -17,11 +18,11 @@
 }
 class ExportData {
-    node: THREE.Object3D;
+    node: Object3D;
     nodeIndex: number;
     nodeDef: any;
-    constructor(node: THREE.Object3D, nodeIndex: number, nodeDef: any) {
+    constructor(node: Object3D, nodeIndex: number, nodeDef: any) {
         this.node = node;
         this.nodeIndex = nodeIndex;
         this.nodeDef = nodeDef;
@@ -78,7 +79,7 @@
     }
     // https://github.com/mrdoob/three.js/blob/efbfc67edc7f65cfcc61a389ffc5fd43ea702bc6/examples/jsm/exporters/GLTFExporter.js#L532
-    serializeUserData(node: THREE.Object3D, _nodeDef: any) {
+    serializeUserData(node: Object3D, _nodeDef: any) {
         const components = node.userData?.components;
         if (!components || components.length <= 0) return;
         // delete components before serializing user data to avoid circular references
@@ -86,7 +87,7 @@
         node[componentsArrayExportKey] = components;
     }
-    afterSerializeUserData(node: THREE.Object3D, _nodeDef) {
+    afterSerializeUserData(node: Object3D, _nodeDef) {
         if (node.type === "Scene") {
             if (debug)
                 console.log("DONE", JSON.stringify(_nodeDef));
@@ -102,7 +103,7 @@
         // console.log(_nodeDef, _nodeDef.mesh);
     }
-    writeNode(node: THREE.Object3D, nodeDef) {
+    writeNode(node: Object3D, nodeDef) {
         let nodeIndex = this.writer.json.nodes.length;
         console.log(node.name, nodeIndex, node.uuid);
         const context = new ExportData(node, nodeIndex, nodeDef);
@@ -198,7 +199,7 @@
         await Promise.all(loadComponents);
     }
-    private async createComponents(obj: THREE.Object3D, data: ExtensionData) {
+    private async createComponents(obj: Object3D, data: ExtensionData) {
         if (!data) return;
         const componentData = data[builtinComponentKeyName];
         if (componentData) {

src/engine/extensions/NEEDLE_lighting_settings.ts CHANGED Viewed

@@ -43,11 +43,20 @@
             if (ext) {
                 if (debug)
                     console.log("Apply \"" + this.name + "\", src: \"" + this.sourceId + "\"", ext);
-                // add a component to the root of the scene
-                const lightSettings = new Object3D();
-                lightSettings.name = "Needle LightSettings";
-                _result.scene.add(lightSettings);
-                const settings = GameObject.addNewComponent(lightSettings, SceneLightSettings, false);
+                let settings: SceneLightSettings | undefined = undefined;
+                // If the result scene has only one child we add the LightingSettingsComponent to that child
+                if (_result.scene.children.length === 1) {
+                    // add a component to the root of the scene
+                    settings = GameObject.addNewComponent(_result.scene.children[0], SceneLightSettings, false);
+                }
+                // if the scene already has multiple children we add it as a new object
+                else
+                {
+                    const lightSettings = new Object3D();
+                    lightSettings.name = "Needle LightSettings";
+                    _result.scene.add(lightSettings);
+                    settings = GameObject.addNewComponent(lightSettings, SceneLightSettings, false);
+                }
                 settings.sourceId = this.sourceId;
                 settings.ambientIntensity = ext.ambientIntensity;
                 settings.ambientLight = new Color().fromArray(ext.ambientLight);
@@ -109,7 +118,7 @@
         }
         if (this.ambientMode == AmbientMode.Flat) {
             if (this.ambientLight && !this._ambientLightObj) {
-                this._ambientLightObj = new AmbientLight(this.ambientLight, Math.PI * this.ambientIntensity);
+                this._ambientLightObj = new AmbientLight(this.ambientLight, this.ambientIntensity);
             }
             if (this._ambientLightObj) {
                 this.gameObject.add(this._ambientLightObj)

src/engine/extensions/NEEDLE_techniques_webgl.ts CHANGED Viewed

@@ -1,7 +1,6 @@
 import { GLTFLoaderPlugin, GLTFParser } from "three/examples/jsm/loaders/GLTFLoader";
-import * as THREE from 'three';
 import { FindShaderTechniques, whiteDefaultTexture, ToUnityMatrixArray, SetUnitySphericalHarmonics } from '../engine_shaders';
-import { IUniform, RawShaderMaterial, Vector4 } from 'three';
+import { AlwaysDepth, BackSide, Camera, DoubleSide, EqualDepth, FrontSide, GreaterDepth, GreaterEqualDepth, IUniform, LessDepth, LessEqualDepth, LinearEncoding, Material, Matrix4, NotEqualDepth, Object3D, RawShaderMaterial, Vector3, Vector4 } from 'three';
 import { Context } from '../engine_setup';
 import { getParam } from "../engine_utils";
 import * as SHADERDATA from "../shaders/shaderData"
@@ -37,13 +36,13 @@
 }
 class ObjectRendererData {
-    objectToWorldMatrix: THREE.Matrix4 = new THREE.Matrix4();
-    worldToObjectMatrix: THREE.Matrix4 = new THREE.Matrix4();
+    objectToWorldMatrix: Matrix4 = new Matrix4();
+    worldToObjectMatrix: Matrix4 = new Matrix4();
     objectToWorld: Array<Vector4> = new Array<Vector4>();
     worldToObject: Array<Vector4> = new Array<Vector4>();
-    updateFrom(obj: THREE.Object3D) {
+    updateFrom(obj: Object3D) {
         this.objectToWorldMatrix.copy(obj.matrixWorld);
         ToUnityMatrixArray(this.objectToWorldMatrix, this.objectToWorld);
@@ -132,7 +131,7 @@
         this.uniforms["unity_SpecCube0"] = { value: envTexture };
         SetUnitySphericalHarmonics(this.uniforms, array);
         const hdr = Math.sqrt(Math.PI * .5);
-        this.uniforms["unity_SpecCube0_HDR"] = { value: new THREE.Vector4(hdr, hdr, hdr, hdr) };
+        this.uniforms["unity_SpecCube0_HDR"] = { value: new Vector4(hdr, hdr, hdr, hdr) };
         // this.needsUpdate = true;
         // this.uniformsNeedUpdate = true;
         if (debug) console.log("Set environment lighting", this.uniforms);
@@ -143,20 +142,20 @@
     private _objToWorldName = "hlslcc_mtx4x4unity_ObjectToWorld";
     private _worldToObjectName = "hlslcc_mtx4x4unity_WorldToObject";
-    private static viewProjection: THREE.Matrix4 = new THREE.Matrix4();
+    private static viewProjection: Matrix4 = new Matrix4();
     private static _viewProjectionValues: Array<Vector4> = [];
     private _viewProjectionName = "hlslcc_mtx4x4unity_MatrixVP";
-    private static viewMatrix: THREE.Matrix4 = new THREE.Matrix4();
+    private static viewMatrix: Matrix4 = new Matrix4();
     private static _viewMatrixValues: Array<Vector4> = [];
     private _viewMatrixName = "hlslcc_mtx4x4unity_MatrixV";
     private static _worldSpaceCameraPosName = "_WorldSpaceCameraPos";
-    private static _worldSpaceCameraPos: THREE.Vector3 = new THREE.Vector3();
+    private static _worldSpaceCameraPos: Vector3 = new Vector3();
-    private static _mainLightColor: THREE.Vector4 = new THREE.Vector4();
-    private static _mainLightPosition: THREE.Vector3 = new THREE.Vector3();
-    private static _lightData: THREE.Vector4 = new THREE.Vector4();
+    private static _mainLightColor: Vector4 = new Vector4();
+    private static _mainLightPosition: Vector3 = new Vector3();
+    private static _lightData: Vector4 = new Vector4();
     private _rendererData = new ObjectRendererData();
@@ -184,7 +183,7 @@
         this.onUpdateUniforms(camera, obj);
     }
-    onUpdateUniforms(camera?: THREE.Camera, obj?: any) {
+    onUpdateUniforms(camera?: Camera, obj?: any) {
         const context = Context.Current;
@@ -309,7 +308,7 @@
         this.identifier = identifier;
     }
-    loadMaterial(index: number): Promise<THREE.Material> | null {
+    loadMaterial(index: number): Promise<Material> | null {
         const mat = this.parser.json.materials[index];
         if (!mat) {
@@ -328,7 +327,7 @@
         const technique: SHADERDATA.Technique = shaders.techniques[techniqueIndex];
         if (!technique) return null;
-        return new Promise<THREE.Material>(async (resolve, reject) => {
+        return new Promise<Material>(async (resolve, reject) => {
             const bundle = await FindShaderTechniques(shaders, technique.program!);
             const frag = bundle?.fragmentShader;
             const vert = bundle?.vertexShader;
@@ -342,7 +341,7 @@
             const techniqueUniforms = technique.uniforms;
             if (vert.includes("_Time"))
-                uniforms["_Time"] = { value: new THREE.Vector4(0, 0, 0, 0) };
+                uniforms["_Time"] = { value: new Vector4(0, 0, 0, 0) };
             for (const u in techniqueUniforms) {
                 const uniformName = u;
@@ -350,7 +349,7 @@
                 // const typeName = UniformType[uniformValues.type];
                 switch (uniformName) {
                     case "_TimeParameters":
-                        const timeUniform = new THREE.Vector4();
+                        const timeUniform = new Vector4();
                         uniforms[uniformName] = { value: timeUniform };
                         break;
@@ -422,7 +421,7 @@
                                 if (texIndex >= 0) {
                                     const tex = await this.parser.getDependency("texture", texIndex);
                                     if (tex) {
-                                        tex.encoding = THREE.LinearEncoding;
+                                        tex.encoding = LinearEncoding;
                                         tex.needsUpdate = true;
                                     }
                                     uniforms[key] = { value: tex };
@@ -436,7 +435,7 @@
                             }
                         }
                         if (Array.isArray(val) && val.length === 4) {
-                            uniforms[key] = { value: new THREE.Vector4(val[0], val[1], val[2], val[3]) };
+                            uniforms[key] = { value: new Vector4(val[0], val[1], val[2], val[3]) };
                             continue;
                         }
                         uniforms[key] = { value: val };
@@ -460,16 +459,16 @@
             const culling = uniforms["_Cull"]?.value;
             switch (culling) {
                 case CullMode.Off:
-                    material.side = THREE.DoubleSide;
+                    material.side = DoubleSide;
                     break;
                 case CullMode.Front:
-                    material.side = THREE.BackSide;
+                    material.side = BackSide;
                     break;
                 case CullMode.Back:
-                    material.side = THREE.FrontSide;
+                    material.side = FrontSide;
                     break;
                 default:
-                    material.side = THREE.FrontSide;
+                    material.side = FrontSide;
                     break;
             }
@@ -477,31 +476,31 @@
             switch (zTest) {
                 case ZTestMode.Equal:
                     material.depthTest = true;
-                    material.depthFunc = THREE.EqualDepth;
+                    material.depthFunc = EqualDepth;
                     break;
                 case ZTestMode.NotEqual:
                     material.depthTest = true;
-                    material.depthFunc = THREE.NotEqualDepth;
+                    material.depthFunc = NotEqualDepth;
                     break;
                 case ZTestMode.Less:
                     material.depthTest = true;
-                    material.depthFunc = THREE.LessDepth;
+                    material.depthFunc = LessDepth;
                     break;
                 case ZTestMode.LEqual:
                     material.depthTest = true;
-                    material.depthFunc = THREE.LessEqualDepth;
+                    material.depthFunc = LessEqualDepth;
                     break;
                 case ZTestMode.Greater:
                     material.depthTest = true;
-                    material.depthFunc = THREE.GreaterDepth;
+                    material.depthFunc = GreaterDepth;
                     break;
                 case ZTestMode.GEqual:
                     material.depthTest = true;
-                    material.depthFunc = THREE.GreaterEqualDepth;
+                    material.depthFunc = GreaterEqualDepth;
                     break;
                 case ZTestMode.Always:
                     material.depthTest = false;
-                    material.depthFunc = THREE.AlwaysDepth;
+                    material.depthFunc = AlwaysDepth;
                     break;
             }

src/needle-engine.ts CHANGED Viewed

@@ -6,19 +6,16 @@
 import "./engine-components/CameraUtils"
-export { GameObject, Behaviour } from "./engine-components/Component";
-export { serializable, serializeable } from "./engine/engine_serialization_decorator";
-export { Collision } from "./engine/engine_types";
 export * from "./engine/api";
 export * from "./engine-components/api";
-export * from "./engine-components/codegen/components";
-export * from "./engine-components/js-extensions/Object3D";
+export * from "./engine-components-experimental/api";
 // make accessible for external javascript
 import { Context } from "./engine/engine_setup";
 const Needle = { Context: Context };
+if (globalThis["Needle"] !== undefined) {
+    console.warn("Needle Engine is already imported");
+}
 globalThis["Needle"] = Needle;
 function registerGlobal(obj: object) {
     for (const key in obj) {
@@ -47,7 +44,7 @@
 // make three accessible
 import * as THREE from "three";
-if(!globalThis["THREE"]) {
+if (!globalThis["THREE"]) {
     globalThis["THREE"] = THREE;
 }
 else console.warn("Threejs is already imported");

src/engine-components/ParticleSystemModules.ts CHANGED Viewed

@@ -1,1484 +1,1484 @@
-import { Color, Matrix4, Object3D, PointLightShadow, Quaternion, Vector3, Vector2, Euler, Vector4, DirectionalLightHelper } from "three";
-import { Mathf } from "../engine/engine_math";
-import { serializable } from "../engine/engine_serialization";
-import { RGBAColor } from "./js-extensions/RGBAColor";
-import { AnimationCurve } from "./AnimationCurve";
-import { Vec2, Vec3 } from "../engine/engine_types";
-import { Context } from "../engine/engine_setup";
-import { EmitterShape, FrameOverLife, Particle, ShapeJSON } from "three.quarks";
-import { createNoise4D, NoiseFunction4D } from 'simplex-noise';
-import { Gizmos } from "../engine/engine_gizmos";
-import { getParam } from "../engine/engine_utils";
-const debug = getParam("debugparticles");
-declare type Color4 = { r: number, g: number, b: number, a: number };
-declare type ColorKey = { time: number, color: Color4 };
-declare type AlphaKey = { time: number, alpha: number };
-export interface IParticleSystem {
-    get currentParticles(): number;
-    get maxParticles(): number;
-    get time(): number;
-    get deltaTime(): number;
-    get duration(): number;
-    readonly main: MainModule;
-    get container(): Object3D;
-    get worldspace(): boolean;
-    get worldPos(): Vector3;
-    get worldQuaternion(): Quaternion;
-    get worldQuaternionInverted(): Quaternion;
-    get worldScale(): Vector3;
-    get matrixWorld(): Matrix4;
-}
-export enum ParticleSystemRenderMode {
-    Billboard = 0,
-    Stretch = 1,
-    HorizontalBillboard = 2,
-    VerticalBillboard = 3,
-    Mesh = 4,
-    //   None = 5,
-}
-export class Gradient {
-    @serializable()
-    alphaKeys!: Array<AlphaKey>;
-    @serializable()
-    colorKeys!: Array<ColorKey>;
-    get duration(): number {
-        return 1;
-    }
-    evaluate(time: number, target: RGBAColor) {
-        // target.r = this.colorKeys[0].color.r;
-        // target.g = this.colorKeys[0].color.g;
-        // target.b = this.colorKeys[0].color.b;
-        // target.alpha = this.alphaKeys[0].alpha;
-        // return;
-        let closestAlpha: AlphaKey | undefined = undefined;
-        let closestAlphaIndex = 0;
-        let closestColor: ColorKey | null = null;
-        let closestColorIndex = 0;
-        for (let i = 0; i < this.alphaKeys.length; i++) {
-            const key = this.alphaKeys[i];
-            if (key.time < time || !closestAlpha) {
-                closestAlpha = key;
-                closestAlphaIndex = i;
-            }
-        }
-        for (let i = 0; i < this.colorKeys.length; i++) {
-            const key = this.colorKeys[i];
-            if (key.time < time || !closestColor) {
-                closestColor = key;
-                closestColorIndex = i;
-            }
-        }
-        if (closestColor) {
-            const hasNextColor = closestColorIndex + 1 < this.colorKeys.length;
-            if (hasNextColor) {
-                const nextColor = this.colorKeys[closestColorIndex + 1];
-                const t = Mathf.remap(time, closestColor.time, nextColor.time, 0, 1);
-                target.r = Mathf.lerp(closestColor.color.r, nextColor.color.r, t);
-                target.g = Mathf.lerp(closestColor.color.g, nextColor.color.g, t);
-                target.b = Mathf.lerp(closestColor.color.b, nextColor.color.b, t);
-            }
-            else {
-                target.r = closestColor.color.r;
-                target.g = closestColor.color.g;
-                target.b = closestColor.color.b;
-            }
-        }
-        if (closestAlpha) {
-            const hasNextAlpha = closestAlphaIndex + 1 < this.alphaKeys.length;
-            if (hasNextAlpha) {
-                const nextAlpha = this.alphaKeys[closestAlphaIndex + 1];
-                const t = Mathf.remap(time, closestAlpha.time, nextAlpha.time, 0, 1);
-                target.alpha = Mathf.lerp(closestAlpha.alpha, nextAlpha.alpha, t);
-            }
-            else {
-                target.alpha = closestAlpha.alpha;
-            }
-        }
-        return target;
-    }
-}
-export enum ParticleSystemCurveMode {
-    Constant = 0,
-    Curve = 1,
-    TwoCurves = 2,
-    TwoConstants = 3
-}
-export enum ParticleSystemGradientMode {
-    Color = 0,
-    Gradient = 1,
-    TwoColors = 2,
-    TwoGradients = 3,
-    RandomColor = 4,
-}
-export enum ParticleSystemSimulationSpace {
-    Local = 0,
-    World = 1,
-    Custom = 2
-}
-export enum ParticleSystemShapeType {
-    Sphere = 0,
-    SphereShell = 1,
-    Hemisphere = 2,
-    HemisphereShell = 3,
-    Cone = 4,
-    Box = 5,
-    Mesh = 6,
-    ConeShell = 7,
-    ConeVolume = 8,
-    ConeVolumeShell = 9,
-    Circle = 10,
-    CircleEdge = 11,
-    SingleSidedEdge = 12,
-    MeshRenderer = 13,
-    SkinnedMeshRenderer = 14,
-    BoxShell = 15,
-    BoxEdge = 16,
-    Donut = 17,
-    Rectangle = 18,
-    Sprite = 19,
-    SpriteRenderer = 20
-}
-export enum ParticleSystemShapeMultiModeValue {
-    Random = 0,
-    Loop = 1,
-    PingPong = 2,
-    BurstSpread = 3,
-}
-export class MinMaxCurve {
-    @serializable()
-    mode!: ParticleSystemCurveMode;
-    @serializable()
-    constant!: number;
-    @serializable()
-    constantMin!: number;
-    @serializable()
-    constantMax!: number;
-    @serializable(AnimationCurve)
-    curve?: AnimationCurve;
-    @serializable(AnimationCurve)
-    curveMin?: AnimationCurve;
-    @serializable(AnimationCurve)
-    curveMax?: AnimationCurve;
-    @serializable()
-    curveMultiplier?: number;
-    evaluate(t01: number, lerpFactor?: number): number {
-        const t = lerpFactor === undefined ? Math.random() : lerpFactor;
-        switch (this.mode) {
-            case ParticleSystemCurveMode.Constant:
-                return this.constant;
-            case ParticleSystemCurveMode.Curve:
-                t01 = Mathf.clamp01(t01);
-                return this.curve!.evaluate(t01) * this.curveMultiplier!;
-            case ParticleSystemCurveMode.TwoCurves:
-                const t1 = t01 * this.curveMin!.duration;
-                const t2 = t01 * this.curveMax!.duration;
-                return Mathf.lerp(this.curveMin!.evaluate(t1), this.curveMax!.evaluate(t2), t % 1) * this.curveMultiplier!;
-            case ParticleSystemCurveMode.TwoConstants:
-                return Mathf.lerp(this.constantMin, this.constantMax, t % 1)
-            default:
-                this.curveMax!.evaluate(t01) * this.curveMultiplier!;
-                break;
-        }
-        return 0;
-    }
-    getMax(): number {
-        switch (this.mode) {
-            case ParticleSystemCurveMode.Constant:
-                return this.constant;
-            case ParticleSystemCurveMode.Curve:
-                return this.getMaxFromCurve(this.curve!) * this.curveMultiplier!;
-            case ParticleSystemCurveMode.TwoCurves:
-                return Math.max(this.getMaxFromCurve(this.curveMin), this.getMaxFromCurve(this.curveMax)) * this.curveMultiplier!;
-            case ParticleSystemCurveMode.TwoConstants:
-                return Math.max(this.constantMin, this.constantMax);
-            default:
-                return 0;
-        }
-    }
-    private getMaxFromCurve(curve?: AnimationCurve) {
-        if (!curve) return 0;
-        let maxNumber = Number.MIN_VALUE;
-        for (let i = 0; i < curve!.keys.length; i++) {
-            const key = curve!.keys[i];
-            if (key.value > maxNumber) {
-                maxNumber = key.value;
-            }
-        }
-        return maxNumber;
-    }
-}
-export class MinMaxGradient {
-    mode!: ParticleSystemGradientMode;
-    @serializable(RGBAColor)
-    color!: RGBAColor;
-    @serializable(RGBAColor)
-    colorMin!: RGBAColor;
-    @serializable(RGBAColor)
-    colorMax!: RGBAColor;
-    @serializable(Gradient)
-    gradient!: Gradient;
-    @serializable(Gradient)
-    gradientMin!: Gradient;
-    @serializable(Gradient)
-    gradientMax!: Gradient;
-    private static _temp: RGBAColor = new RGBAColor(0, 0, 0, 1);
-    private static _temp2: RGBAColor = new RGBAColor(0, 0, 0, 1);
-    evaluate(t01: number, lerpFactor?: number): RGBAColor {
-        const t = lerpFactor === undefined ? Math.random() : lerpFactor;
-        switch (this.mode) {
-            case ParticleSystemGradientMode.Color:
-                return this.color;
-            case ParticleSystemGradientMode.Gradient:
-                this.gradient.evaluate(t01, MinMaxGradient._temp);
-                return MinMaxGradient._temp
-            case ParticleSystemGradientMode.TwoColors:
-                const col1 = MinMaxGradient._temp.lerpColors(this.colorMin, this.colorMax, t);
-                return col1;
-            case ParticleSystemGradientMode.TwoGradients:
-                this.gradientMin.evaluate(t01, MinMaxGradient._temp);
-                this.gradientMax.evaluate(t01, MinMaxGradient._temp2);
-                return MinMaxGradient._temp.lerp(MinMaxGradient._temp2, t);
-        }
-        // console.warn("Not implemented", ParticleSystemGradientMode[this.mode]);
-        MinMaxGradient._temp.set(0xff00ff)
-        MinMaxGradient._temp.alpha = 1;
-        return MinMaxGradient._temp;
-    }
-}
-declare type ParticleSystemScalingMode = {
-    Hierarchy: number;
-    Local: number;
-    Shape: number;
-}
-export class MainModule {
-    cullingMode!: number;
-    duration!: number;
-    emitterVelocityMode!: number;
-    flipRotation!: number;
-    @serializable(MinMaxCurve)
-    gravityModifier!: MinMaxCurve;
-    gravityModifierMultiplier!: number;
-    loop!: boolean;
-    maxParticles!: number;
-    playOnAwake!: boolean;
-    prewarm!: boolean;
-    ringBufferLoopRange!: { x: number, y: number };
-    ringBufferMode!: boolean;
-    scalingMode!: ParticleSystemScalingMode;
-    simulationSpace!: ParticleSystemSimulationSpace;
-    simulationSpeed!: number;
-    @serializable(MinMaxGradient)
-    startColor!: MinMaxGradient;
-    @serializable(MinMaxCurve)
-    startDelay!: MinMaxCurve;
-    startDelayMultiplier!: number;
-    @serializable(MinMaxCurve)
-    startLifetime!: MinMaxCurve;
-    startLifetimeMultiplier!: number;
-    @serializable(MinMaxCurve)
-    startRotation!: MinMaxCurve;
-    startRotationMultiplier!: number;
-    startRotation3D!: boolean;
-    @serializable(MinMaxCurve)
-    startRotationX!: MinMaxCurve;
-    startRotationXMultiplier!: number;
-    @serializable(MinMaxCurve)
-    startRotationY!: MinMaxCurve;
-    startRotationYMultiplier!: number;
-    @serializable(MinMaxCurve)
-    startRotationZ!: MinMaxCurve;
-    startRotationZMultiplier!: number;
-    @serializable(MinMaxCurve)
-    startSize!: MinMaxCurve;
-    startSize3D!: boolean;
-    startSizeMultiplier!: number;
-    @serializable(MinMaxCurve)
-    startSizeX!: MinMaxCurve;
-    startSizeXMultiplier!: number;
-    @serializable(MinMaxCurve)
-    startSizeY!: MinMaxCurve;
-    startSizeYMultiplier!: number;
-    @serializable(MinMaxCurve)
-    startSizeZ!: MinMaxCurve;
-    startSizeZMultiplier!: number;
-    @serializable(MinMaxCurve)
-    startSpeed!: MinMaxCurve;
-    startSpeedMultiplier!: number;
-    stopAction!: number;
-    useUnscaledTime!: boolean;
-}
-export class ParticleBurst {
-    cycleCount!: number;
-    maxCount!: number;
-    minCount!: number;
-    probability!: number;
-    repeatInterval!: number;
-    time!: number;
-    count!: {
-        constant: number;
-        constantMax: number;
-        constantMin: number;
-        curve?: AnimationCurve;
-        curveMax?: AnimationCurve;
-        curveMin?: AnimationCurve;
-        curveMultiplier?: number;
-        mode: ParticleSystemCurveMode;
-    }
-    private _performed: number = 0;
-    reset() {
-        this._performed = 0;
-    }
-    run(time: number): number {
-        if (time <= this.time) {
-            this.reset();
-            return 0;
-        }
-        let amount = 0;
-        if (this.cycleCount === 0 || this._performed < this.cycleCount) {
-            const nextTime = this.time + this.repeatInterval * this._performed;
-            if (time >= nextTime) {
-                this._performed += 1;
-                if (Math.random() < this.probability) {
-                    switch (this.count.mode) {
-                        case ParticleSystemCurveMode.Constant:
-                            amount = this.count.constant;
-                            break;
-                        case ParticleSystemCurveMode.TwoConstants:
-                            amount = Mathf.lerp(this.count.constantMin, this.count.constantMax, Math.random());
-                            break;
-                        case ParticleSystemCurveMode.Curve:
-                            amount = this.count.curve!.evaluate(Math.random());
-                            break;
-                        case ParticleSystemCurveMode.TwoCurves:
-                            const t = Math.random();
-                            amount = Mathf.lerp(this.count.curveMin!.evaluate(t), this.count.curveMax!.evaluate(t), Math.random());
-                            break;
-                    }
-                }
-            }
-        }
-        return amount;
-    }
-}
-export class EmissionModule {
-    @serializable()
-    enabled!: boolean;
-    get burstCount() {
-        return this.bursts?.length ?? 0;
-    }
-    @serializable()
-    bursts!: ParticleBurst[];
-    @serializable(MinMaxCurve)
-    rateOverTime!: MinMaxCurve;
-    @serializable()
-    rateOverTimeMultiplier!: number;
-    @serializable(MinMaxCurve)
-    rateOverDistance!: MinMaxCurve;
-    @serializable()
-    rateOverDistanceMultiplier!: number;
-    /** set from system */
-    system!: IParticleSystem;
-    reset() {
-        this.bursts?.forEach(b => b.reset());
-    }
-    getBurst() {
-        let amount = 0;
-        if (this.burstCount > 0) {
-            for (let i = 0; i < this.burstCount; i++) {
-                const burst = this.bursts[i];
-                if (burst.time >= this.system.time) {
-                    burst.reset();
-                }
-                amount += Math.round(burst.run(this.system.time));
-            }
-        }
-        return amount;
-    }
-}
-export class ColorOverLifetimeModule {
-    enabled!: boolean;
-    @serializable(MinMaxGradient)
-    color!: MinMaxGradient;
-}
-export class SizeOverLifetimeModule {
-    enabled!: boolean;
-    separateAxes!: boolean;
-    @serializable(MinMaxCurve)
-    size!: MinMaxCurve;
-    sizeMultiplier!: number;
-    @serializable(MinMaxCurve)
-    x!: MinMaxCurve;
-    xMultiplier!: number;
-    @serializable(MinMaxCurve)
-    y!: MinMaxCurve;
-    yMultiplier!: number;
-    @serializable(MinMaxCurve)
-    z!: MinMaxCurve;
-    zMultiplier!: number;
-    private _time: number = 0;
-    private _temp = new Vector3();
-    evaluate(t01: number, target?: Vec3, lerpFactor?: number) {
-        if (!target) target = this._temp;
-        if (!this.enabled) {
-            target.x = target.y = target.z = 1;
-            return target;
-        }
-        if (!this.separateAxes) {
-            const scale = this.size.evaluate(t01, lerpFactor) * this.sizeMultiplier;
-            target.x = scale;
-            // target.y = scale;
-            // target.z = scale;
-        }
-        else {
-            target.x = this.x.evaluate(t01, lerpFactor) * this.xMultiplier;
-            target.y = this.y.evaluate(t01, lerpFactor) * this.yMultiplier;
-            target.z = this.z.evaluate(t01, lerpFactor) * this.zMultiplier;
-        }
-        return target;
-    }
-}
-export class ShapeModule implements EmitterShape {
-    // Emittershape start
-    get type(): string {
-        return ParticleSystemShapeType[this.shapeType];
-    }
-    initialize(particle: Particle): void {
-        this.getPosition();
-        particle.position.copy(this._vector);
-    }
-    toJSON(): ShapeJSON {
-        return this;
-    }
-    clone(): EmitterShape {
-        return new ShapeModule();
-    }
-    // EmitterShape end
-    @serializable()
-    shapeType: ParticleSystemShapeType = ParticleSystemShapeType.Box;
-    @serializable()
-    enabled: boolean = true;
-    @serializable()
-    alignToDirection: boolean = false;
-    @serializable()
-    angle: number = 0;
-    @serializable()
-    arc: number = 360;
-    @serializable()
-    arcSpread!: number;
-    @serializable()
-    arcSpeedMultiplier!: number;
-    @serializable()
-    arcMode!: ParticleSystemShapeMultiModeValue;
-    @serializable(Vector3)
-    boxThickness!: Vector3;
-    @serializable(Vector3)
-    position!: Vector3;
-    @serializable(Vector3)
-    rotation!: Vector3;
-    private _rotation: Euler = new Euler();
-    @serializable(Vector3)
-    scale!: Vector3;
-    @serializable()
-    radius!: number;
-    @serializable()
-    radiusThickness!: number;
-    @serializable()
-    sphericalDirectionAmount!: number;
-    @serializable()
-    randomDirectionAmount!: number;
-    @serializable()
-    randomPositionAmount!: number;
-    private system!: IParticleSystem;
-    private _space?: ParticleSystemSimulationSpace;
-    private readonly _worldSpaceMatrix: Matrix4 = new Matrix4();
-    private readonly _worldSpaceMatrixInverse: Matrix4 = new Matrix4();
-    constructor() {
-        if (debug)
-            console.log(this);
-    }
-    update(system: IParticleSystem, _context: Context, simulationSpace: ParticleSystemSimulationSpace, obj: Object3D) {
-        this.system = system;
-        this._space = simulationSpace;
-        if (simulationSpace === ParticleSystemSimulationSpace.World) {
-            this._worldSpaceMatrix.copy(obj.matrixWorld);
-            // set scale to 1
-            this._worldSpaceMatrix.elements[0] = 1;
-            this._worldSpaceMatrix.elements[5] = 1;
-            this._worldSpaceMatrix.elements[10] = 1;
-            this._worldSpaceMatrixInverse.copy(this._worldSpaceMatrix).invert();
-        }
-    }
-    private applyRotation(vector: Vector3) {
-        const isRotated = this.rotation.x !== 0 || this.rotation.y !== 0 || this.rotation.z !== 0;
-        if (isRotated) {
-            // console.log(this._rotation);
-            // TODO: we need to convert this to threejs euler
-            this._rotation.x = Mathf.toRadians(this.rotation.x);
-            this._rotation.y = Mathf.toRadians(this.rotation.y);
-            this._rotation.z = Mathf.toRadians(this.rotation.z);
-            this._rotation.order = 'ZYX';
-            vector.applyEuler(this._rotation);
-            // this._quat.setFromEuler(this._rotation);
-            // // this._quat.invert();
-            // this._quat.x *= -1;
-            // // this._quat.y *= -1;
-            // // this._quat.z *= -1;
-            // this._quat.w *= -1;
-            // vector.applyQuaternion(this._quat);
-        }
-        return isRotated;
-    }
-    /** nebula implementations: */
-    /** initializer implementation */
-    private _vector: Vector3 = new Vector3(0, 0, 0);
-    private _temp: Vector3 = new Vector3(0, 0, 0);
-    /** called by nebula on initialize */
-    get vector() {
-        return this._vector;
-    }
-    getPosition(): void {
-        this._vector.set(0, 0, 0);
-        const pos = this._temp.copy(this.position);
-        const isWorldSpace = this._space === ParticleSystemSimulationSpace.World;
-        if (isWorldSpace) {
-            pos.applyQuaternion(this.system.worldQuaternion);
-        }
-        let radius = this.radius;
-        if (isWorldSpace) radius *= this.system.worldScale.x;
-        if (this.enabled) {
-            switch (this.shapeType) {
-                case ParticleSystemShapeType.Box:
-                    if (debug) Gizmos.DrawBox(this.position, this.scale, 0xdddddd, 1);
-                    this._vector.x = Math.random() * this.scale.x - this.scale.x / 2;
-                    this._vector.y = Math.random() * this.scale.y - this.scale.y / 2;
-                    this._vector.z = Math.random() * this.scale.z - this.scale.z / 2;
-                    this._vector.add(pos);
-                    break;
-                case ParticleSystemShapeType.Cone:
-                    this.randomConePoint(this.position, this.angle, radius, this.radiusThickness, this.arc, this.arcMode, this._vector);
-                    break;
-                case ParticleSystemShapeType.Sphere:
-                    this.randomSpherePoint(this.position, radius, this.radiusThickness, this.arc, this._vector);
-                    break;
-                case ParticleSystemShapeType.Circle:
-                    this.randomCirclePoint(this.position, radius, this.radiusThickness, this.arc, this._vector);
-                    break;
-                default:
-                    this._vector.set(0, 0, 0);
-                    break;
-                // case ParticleSystemShapeType.Hemisphere:
-                //     randomSpherePoint(this.position.x, this.position.y, this.position.z, this.radius, this.radiusThickness, 180, this._vector);
-                //     break;
-            }
-            this.randomizePosition(this._vector, this.randomPositionAmount);
-        }
-        this.applyRotation(this._vector);
-        if (isWorldSpace) {
-            this._vector.applyQuaternion(this.system.worldQuaternion);
-            this._vector.add(this.system.worldPos);
-        }
-        if (debug) {
-            Gizmos.DrawSphere(this._vector, .03, 0xff0000, .5, true);
-        }
-    }
-    private _dir: Vector3 = new Vector3();
-    getDirection(pos: Vec3): Vector3 {
-        if (!this.enabled) {
-            this._dir.set(0, 0, 1);
-            return this._dir;
-        }
-        switch (this.shapeType) {
-            case ParticleSystemShapeType.Box:
-                this._dir.set(0, 0, 1);
-                break;
-            case ParticleSystemShapeType.Cone:
-                this._dir.set(0, 0, 1);
-                // apply cone angle
-                // this._dir.applyAxisAngle(new Vector3(0, 1, 0), Mathf.toRadians(this.angle));
-                break;
-            case ParticleSystemShapeType.Circle:
-            case ParticleSystemShapeType.Sphere:
-                const rx = pos.x;
-                const ry = pos.y;
-                const rz = pos.z;
-                this._dir.set(rx, ry, rz)
-                if (this.system?.worldspace)
-                    this._dir.sub(this.system.worldPos)
-                else
-                    this._dir.sub(this.position)
-                break;
-            default:
-                this._dir.set(0, 0, 1);
-                break;
-        }
-        if (this._space === ParticleSystemSimulationSpace.World) {
-            this._dir.applyQuaternion(this.system.worldQuaternion);
-        }
-        this.applyRotation(this._dir);
-        this._dir.normalize();
-        this.spherizeDirection(this._dir, this.sphericalDirectionAmount);
-        this.randomizeDirection(this._dir, this.randomDirectionAmount);
-        if (debug) {
-            Gizmos.DrawSphere(pos, .01, 0x883300, .5, true);
-            Gizmos.DrawDirection(pos, this._dir, 0x883300, .5, true);
-        }
-        return this._dir;
-    }
-    private static _randomQuat = new Quaternion();
-    private static _tempVec = new Vector3();
-    private randomizePosition(pos: Vector3, amount: number) {
-        if (amount <= 0) return;
-        const rp = ShapeModule._tempVec;
-        rp.set(Math.random() * 2 - 1, Math.random() * 2 - 1, Math.random() * 2 - 1);
-        rp.x *= amount * this.scale.x;
-        rp.y *= amount * this.scale.y;
-        rp.z *= amount * this.scale.z;
-        pos.add(rp);
-    }
-    private randomizeDirection(direction: Vector3, amount: number) {
-        if (amount === 0) return;
-        const randomQuat = ShapeModule._randomQuat;
-        const tempVec = ShapeModule._tempVec;
-        tempVec.set(Math.random() - .5, Math.random() - .5, Math.random() - .5).normalize();
-        randomQuat.setFromAxisAngle(tempVec, amount * Math.random() * Math.PI);
-        direction.applyQuaternion(randomQuat);
-    }
-    private spherizeDirection(dir: Vector3, amount: number) {
-        if (amount === 0) return;
-        const theta = Math.random() * Math.PI * 2;
-        const phi = Math.acos(1 - Math.random() * 2);
-        const x = Math.sin(phi) * Math.cos(theta);
-        const y = Math.sin(phi) * Math.sin(theta);
-        const z = Math.cos(phi);
-        const v = new Vector3(x, y, z);
-        dir.lerp(v, amount);
-    }
-    private randomSpherePoint(pos: Vec3, radius: number, thickness: number, arc: number, vec: Vec3) {
-        const u = Math.random();
-        const v = Math.random();
-        const theta = 2 * Math.PI * u * (arc / 360);
-        const phi = Math.acos(2 * v - 1);
-        const r = Mathf.lerp(1, 1 - (Math.pow(1 - Math.random(), Math.PI)), thickness) * (radius);
-        const x = pos.x + this.scale.x * (-r * Math.sin(phi) * Math.cos(theta));
-        const y = pos.y + this.scale.y * (r * Math.sin(phi) * Math.sin(theta));
-        const z = pos.z + this.scale.z * (r * Math.cos(phi));
-        vec.x = x;
-        vec.y = y;
-        vec.z = z;
-    }
-    private randomCirclePoint(pos:Vec3, radius:number, thickness:number, arg:number, vec:Vec3){
-        const u = Math.random();
-        const theta = 2 * Math.PI * u * (arg / 360);
-        const r = Mathf.lerp(1, 1 - (Math.pow(1 - Math.random(), Math.PI)), thickness) * (radius);
-        const x = pos.x + this.scale.x * r * Math.cos(theta);
-        const y = pos.y + this.scale.y * r * Math.sin(theta);
-        const z = pos.z;
-        vec.x = x;
-        vec.y = y;
-        vec.z = z;
-    }
-    private _loopTime: number = 0;
-    private _loopDirection: number = 1;
-    private randomConePoint(pos: Vec3, _angle: number, radius: number, thickness: number, arc: number, arcMode: ParticleSystemShapeMultiModeValue, vec: Vec3) {
-        let u = 0;
-        let v = 0;
-        switch (arcMode) {
-            case ParticleSystemShapeMultiModeValue.Random:
-                u = Math.random();
-                v = Math.random();
-                break;
-            case ParticleSystemShapeMultiModeValue.PingPong:
-                if (this._loopTime > 1) this._loopDirection = -1;
-                if (this._loopTime < 0) this._loopDirection = 1;
-            // continue with loop
-            case ParticleSystemShapeMultiModeValue.Loop:
-                u = .5;
-                v = Math.random()
-                this._loopTime += this.system.deltaTime * this._loopDirection;
-                break;
-        }
-        let theta = 2 * Math.PI * u * (arc / 360);
-        switch (arcMode) {
-            case ParticleSystemShapeMultiModeValue.PingPong:
-            case ParticleSystemShapeMultiModeValue.Loop:
-                theta += Math.PI + .5;
-                theta += this._loopTime * Math.PI * 2;
-                theta %= Mathf.toRadians(arc);
-                break;
-        }
-        const phi = Math.acos(2 * v - 1);
-        const r = Mathf.lerp(1, 1 - (Math.pow(1 - Math.random(), Math.PI)), thickness) * radius;
-        const x = pos.x + (-r * Math.sin(phi) * Math.cos(theta));
-        const y = pos.y + (r * Math.sin(phi) * Math.sin(theta));
-        const z = pos.z;
-        vec.x = x * this.scale.x;
-        vec.y = y * this.scale.y;
-        vec.z = z * this.scale.z;
-    }
-}
-export class NoiseModule {
-    @serializable()
-    damping!: boolean;
-    @serializable()
-    enabled!: boolean;
-    @serializable()
-    frequency!: number;
-    @serializable()
-    octaveCount!: number;
-    @serializable()
-    octaveMultiplier!: number;
-    @serializable()
-    octaveScale!: number;
-    @serializable(MinMaxCurve)
-    positionAmount!: MinMaxCurve;
-    @serializable()
-    quality!: number;
-    @serializable(MinMaxCurve)
-    remap!: MinMaxCurve;
-    @serializable()
-    remapEnabled!: boolean;
-    @serializable()
-    remapMultiplier!: number;
-    @serializable(MinMaxCurve)
-    remapX!: MinMaxCurve;
-    @serializable()
-    remapXMultiplier!: number;
-    @serializable(MinMaxCurve)
-    remapY!: MinMaxCurve;
-    @serializable()
-    remapYMultiplier!: number;
-    @serializable(MinMaxCurve)
-    remapZ!: MinMaxCurve;
-    @serializable()
-    remapZMultiplier!: number;
-    @serializable()
-    scrollSpeedMultiplier!: number;
-    @serializable()
-    separateAxes!: boolean;
-    @serializable()
-    strengthMultiplier!: number;
-    @serializable(MinMaxCurve)
-    strengthX!: MinMaxCurve;
-    @serializable()
-    strengthXMultiplier!: number;
-    @serializable(MinMaxCurve)
-    strengthY!: MinMaxCurve;
-    @serializable()
-    strengthYMultiplier!: number;
-    @serializable(MinMaxCurve)
-    strengthZ!: MinMaxCurve;
-    @serializable()
-    strengthZMultiplier!: number;
-    private _noise?: NoiseFunction4D;
-    private _time: number = 0;
-    update(context: Context) {
-        this._time += context.time.deltaTime * this.scrollSpeedMultiplier;
-    }
-    /** nebula implementations: */
-    private _temp: Vector3 = new Vector3();
-    apply(_index: number, pos: Vec3, vel: Vec3, _deltaTime: number, age: number, life: number) {
-        if (!this.enabled) return;
-        if (!this._noise) {
-            this._noise = createNoise4D(() => 0);
-        }
-        const temp = this._temp.set(pos.x, pos.y, pos.z).multiplyScalar(this.frequency);
-        const nx = this._noise(temp.x, temp.y, temp.z, this._time);
-        const ny = this._noise(temp.x, temp.y, temp.z, this._time + 1000 * this.frequency);
-        const nz = this._noise(temp.x, temp.y, temp.z, this._time + 2000 * this.frequency);
-        this._temp.set(nx, ny, nz).normalize()
-        const t = age / life;
-        let strengthFactor = this.positionAmount.evaluate(t);
-        if (!this.separateAxes) {
-            if (this.strengthX) {
-                strengthFactor *= this.strengthX.evaluate(t) * 1.5;
-            }
-            // strengthFactor *= this.strengthMultiplier;
-            // strengthFactor *= deltaTime;
-            this._temp.multiplyScalar(strengthFactor);
-        }
-        else {
-            this._temp.x *= strengthFactor * this.strengthXMultiplier
-            this._temp.y *= strengthFactor * this.strengthYMultiplier;
-            this._temp.z *= strengthFactor * this.strengthZMultiplier;
-        }
-        // this._temp.setLength(strengthFactor * deltaTime);
-        vel.x += this._temp.x;
-        vel.y += this._temp.y;
-        vel.z += this._temp.z;
-    }
-}
-export enum ParticleSystemTrailMode {
-    PerParticle,
-    Ribbon,
-}
-export enum ParticleSystemTrailTextureMode {
-    Stretch = 0,
-    Tile = 1,
-    DistributePerSegment = 2,
-    RepeatPerSegment = 3,
-}
-export class TrailModule {
-    @serializable()
-    enabled!: boolean;
-    @serializable()
-    attachRibbonToTransform = false;
-    @serializable(MinMaxGradient)
-    colorOverLifetime!: MinMaxGradient;
-    @serializable(MinMaxGradient)
-    colorOverTrail!: MinMaxGradient;
-    @serializable()
-    dieWithParticles: boolean = true;
-    @serializable()
-    inheritParticleColor: boolean = true;
-    @serializable(MinMaxCurve)
-    lifetime!: MinMaxCurve;
-    @serializable()
-    lifetimeMultiplier!: number;
-    @serializable()
-    minVertexDistance: number = .2;
-    @serializable()
-    mode: ParticleSystemTrailMode = ParticleSystemTrailMode.PerParticle;
-    @serializable()
-    ratio: number = 1;
-    @serializable()
-    ribbonCount: number = 1;
-    @serializable()
-    shadowBias: number = 0;
-    @serializable()
-    sizeAffectsLifetime: boolean = false;
-    @serializable()
-    sizeAffectsWidth: boolean = false;
-    @serializable()
-    splitSubEmitterRibbons: boolean = false;
-    @serializable()
-    textureMode: ParticleSystemTrailTextureMode = ParticleSystemTrailTextureMode.Stretch;
-    @serializable(MinMaxCurve)
-    widthOverTrail!: MinMaxCurve;
-    @serializable()
-    widthOverTrailMultiplier!: number;
-    @serializable()
-    worldSpace: boolean = false;
-    getWidth(size: number, _life01: number, pos01: number) {
-        let res = this.widthOverTrail.evaluate(pos01);
-        if (pos01 === 0) res = size;
-        size *= res;
-        return size;
-    }
-    getColor(color: Vector4, life01: number, pos01: number) {
-        const overTrail = this.colorOverTrail.evaluate(pos01);
-        const overLife = this.colorOverLifetime.evaluate(life01);
-        color.x *= overTrail.r * overLife.r;
-        color.y *= overTrail.g * overLife.g;
-        color.z *= overTrail.b * overLife.b;
-        color.w *= overTrail.alpha * overLife.alpha;
-    }
-}
-export class VelocityOverLifetimeModule {
-    @serializable()
-    enabled!: boolean;
-    @serializable()
-    space: ParticleSystemSimulationSpace = ParticleSystemSimulationSpace.Local;
-    @serializable(MinMaxCurve)
-    orbitalX!: MinMaxCurve;
-    @serializable(MinMaxCurve)
-    orbitalY!: MinMaxCurve;
-    @serializable(MinMaxCurve)
-    orbitalZ!: MinMaxCurve;
-    @serializable()
-    orbitalXMultiplier!: number;
-    @serializable()
-    orbitalYMultiplier!: number;
-    @serializable()
-    orbitalZMultiplier!: number;
-    @serializable()
-    orbitalOffsetX!: number;
-    @serializable()
-    orbitalOffsetY!: number;
-    @serializable()
-    orbitalOffsetZ!: number;
-    @serializable(MinMaxCurve)
-    speedModifier!: MinMaxCurve;
-    @serializable()
-    speedModifierMultiplier!: number;
-    @serializable(MinMaxCurve)
-    x!: MinMaxCurve;
-    @serializable()
-    xMultiplier!: number;
-    @serializable(MinMaxCurve)
-    y!: MinMaxCurve;
-    @serializable()
-    yMultiplier!: number;
-    @serializable(MinMaxCurve)
-    z!: MinMaxCurve;
-    @serializable()
-    zMultiplier!: number;
-    private _system?: IParticleSystem;
-    // private _worldRotation: Quaternion = new Quaternion();
-    update(system: IParticleSystem) {
-        this._system = system;
-    }
-    private _temp: Vector3 = new Vector3();
-    private _temp2: Vector3 = new Vector3();
-    private _temp3: Vector3 = new Vector3();
-    private _hasOrbital = false;
-    private _index = 0;
-    private _orbitalMatrix: Matrix4 = new Matrix4();
-    init(particle: object) {
-        if (this._index == 0) particle["debug"] = true;
-        this._index += 1;
-        particle["orbitx"] = this.orbitalX.evaluate(Math.random());
-        particle["orbity"] = this.orbitalY.evaluate(Math.random());
-        particle["orbitz"] = this.orbitalZ.evaluate(Math.random());
-        // console.log(particle["orbitx"], particle["orbity"], particle["orbitz"])
-        this._hasOrbital = particle["orbitx"] != 0 || particle["orbity"] != 0 || particle["orbitz"] != 0;
-    }
-    apply(_particle: object, _index: number, _pos: Vec3, vel: Vec3, _dt: number, age: number, life: number) {
-        if (!this.enabled) return;
-        const t = age / life;
-        const speed = this.speedModifier.evaluate(t) * this.speedModifierMultiplier;
-        const x = this.x.evaluate(t);
-        const y = this.y.evaluate(t);
-        const z = this.z.evaluate(t);
-        this._temp.set(-x, y, z);
-        if (this._system) {
-            // if (this.space === ParticleSystemSimulationSpace.World) {
-            //     this._temp.applyQuaternion(this._system.worldQuaternionInverted);
-            // }
-            // if (this._system.main.simulationSpace === ParticleSystemSimulationSpace.World) {
-            //     this._temp.applyQuaternion(this._system.worldQuaternion);
-            // }
-        }
-        if (this._hasOrbital) {
-            const position = this._system?.worldPos;
-            if (position) {
-                // TODO: we absolutely need to fix this, this is a hack for a specific usecase and doesnt work yet correctly
-                // https://github.com/needle-tools/needle-tiny/issues/710
-                const pos = this._temp2.set(_pos.x, _pos.y, _pos.z);
-                const ox = this.orbitalXMultiplier;// particle["orbitx"];
-                const oy = this.orbitalYMultiplier;// particle["orbity"];
-                const oz = this.orbitalZMultiplier;// particle["orbitz"];
-                const angle = speed * Math.PI * 2 * 10; // < Oh god
-                const cosX = Math.cos(angle * ox);
-                const sinX = Math.sin(angle * ox);
-                const cosY = Math.cos(angle * oy);
-                const sinY = Math.sin(angle * oy);
-                const cosZ = Math.cos(angle * oz);
-                const sinZ = Math.sin(angle * oz);
-                const newX = pos.x * (cosY * cosZ) + pos.y * (cosY * sinZ) + pos.z * (-sinY);
-                const newY = pos.x * (sinX * sinY * cosZ - cosX * sinZ) + pos.y * (sinX * sinY * sinZ + cosX * cosZ) + pos.z * (sinX * cosY);
-                const newZ = pos.x * (cosX * sinY * cosZ + sinX * sinZ) + pos.y * (cosX * sinY * sinZ - sinX * cosZ) + pos.z * (cosX * cosY);
-                // pos.x += this.orbitalOffsetX;
-                // pos.y += this.orbitalOffsetY;
-                // pos.z += this.orbitalOffsetZ;
-                const v = this._temp3.set(pos.x - newX, pos.y - newY, pos.z - newZ);
-                v.normalize();
-                v.multiplyScalar(.2 / _dt * (Math.max(this.orbitalXMultiplier, this.orbitalYMultiplier, this.orbitalZMultiplier)));
-                vel.x += v.x;
-                vel.y += v.y;
-                vel.z += v.z;
-            }
-        }
-        vel.x += this._temp.x;
-        vel.y += this._temp.y;
-        vel.z += this._temp.z;
-        vel.x *= speed;
-        vel.y *= speed;
-        vel.z *= speed;
-    }
-}
-enum ParticleSystemAnimationTimeMode {
-    Lifetime,
-    Speed,
-    FPS,
-}
-enum ParticleSystemAnimationMode {
-    Grid,
-    Sprites,
-}
-enum ParticleSystemAnimationRowMode {
-    Custom,
-    Random,
-    MeshIndex,
-}
-enum ParticleSystemAnimationType {
-    WholeSheet,
-    SingleRow,
-}
-export class TextureSheetAnimationModule {
-    @serializable()
-    animation!: ParticleSystemAnimationType;
-    @serializable()
-    enabled!: boolean;
-    @serializable()
-    cycleCount!: number;
-    @serializable(MinMaxCurve)
-    frameOverTime!: MinMaxCurve;
-    @serializable()
-    frameOverTimeMultiplier!: number;
-    @serializable()
-    numTilesX!: number;
-    @serializable()
-    numTilesY!: number;
-    @serializable(MinMaxCurve)
-    startFrame!: MinMaxCurve;
-    @serializable()
-    startFrameMultiplier!: number;
-    @serializable()
-    rowMode!: ParticleSystemAnimationRowMode;
-    @serializable()
-    rowIndex!: number;
-    @serializable()
-    spriteCount!: number;
-    @serializable()
-    timeMode!: ParticleSystemAnimationTimeMode;
-    private sampleOnceAtStart(): boolean {
-        if (this.timeMode === ParticleSystemAnimationTimeMode.Lifetime) {
-            switch (this.frameOverTime.mode) {
-                case ParticleSystemCurveMode.Constant:
-                case ParticleSystemCurveMode.TwoConstants:
-                case ParticleSystemCurveMode.TwoCurves:
-                case ParticleSystemCurveMode.Curve:
-                    return true;
-            }
-        }
-        return false;
-    }
-    getStartIndex(): number {
-        if (this.sampleOnceAtStart()) {
-            const start = Math.random();
-            return start * (this.numTilesX * this.numTilesY);
-        }
-        return 0;
-    }
-    evaluate(t01: number): number | undefined {
-        if (this.sampleOnceAtStart()) {
-            return undefined;
-        }
-        return this.getIndex(t01);
-    }
-    private getIndex(t01: number): number {
-        const tiles = this.numTilesX * this.numTilesY;
-        t01 = t01 * this.cycleCount;
-        let index = this.frameOverTime.evaluate(t01 % 1);
-        index *= this.frameOverTimeMultiplier;
-        index *= tiles;
-        index = index % tiles;
-        index = Math.floor(index);
-        return index;
-    }
-}
-export class RotationOverLifetimeModule {
-    @serializable()
-    enabled!: boolean;
-    @serializable()
-    separateAxes!: boolean;
-    @serializable(MinMaxCurve)
-    x!: MinMaxCurve;
-    @serializable()
-    xMultiplier!: number;
-    @serializable(MinMaxCurve)
-    y!: MinMaxCurve;
-    @serializable()
-    yMultiplier!: number;
-    @serializable(MinMaxCurve)
-    z!: MinMaxCurve;
-    @serializable()
-    zMultiplier!: number;
-    evaluate(t01: number, t: number): number {
-        if (!this.enabled) return 0;
-        if (!this.separateAxes) {
-            const rot = this.z.evaluate(t01, t) * -1;
-            return rot;
-        }
-        return 0;
-    }
-}
-export class RotationBySpeedModule {
-    @serializable()
-    enabled!: boolean;
-    @serializable()
-    range!: Vec2;
-    @serializable()
-    separateAxes!: boolean;
-    @serializable(MinMaxCurve)
-    x!: MinMaxCurve;
-    @serializable()
-    xMultiplier!: number;
-    @serializable(MinMaxCurve)
-    y!: MinMaxCurve;
-    @serializable()
-    yMultiplier!: number;
-    @serializable(MinMaxCurve)
-    z!: MinMaxCurve;
-    @serializable()
-    zMultiplier!: number;
-    evaluate(_t01: number, speed: number): number {
-        if (!this.enabled) return 0;
-        if (!this.separateAxes) {
-            const t = Mathf.lerp(this.range.x, this.range.y, speed);
-            const rot = this.z.evaluate(t) * -1;
-            return rot;
-        }
-        return 0;
-    }
-}
-export class LimitVelocityOverLifetimeModule {
-    @serializable()
-    enabled!: boolean;
-    @serializable()
-    dampen!: number;
-    @serializable(MinMaxCurve)
-    drag!: MinMaxCurve;
-    @serializable()
-    dragMultiplier!: number;
-    @serializable(MinMaxCurve)
-    limit!: MinMaxCurve;
-    @serializable()
-    limitMultiplier!: number;
-    @serializable()
-    separateAxes!: boolean;
-    @serializable(MinMaxCurve)
-    limitX!: MinMaxCurve;
-    @serializable()
-    limitXMultiplier!: number;
-    @serializable(MinMaxCurve)
-    limitY!: MinMaxCurve;
-    @serializable()
-    limitYMultiplier!: number;
-    @serializable(MinMaxCurve)
-    limitZ!: MinMaxCurve;
-    @serializable()
-    limitZMultiplier!: number;
-    @serializable()
-    multiplyDragByParticleSize: boolean = false;
-    @serializable()
-    multiplyDragByParticleVelocity: boolean = false;
-    @serializable()
-    space!: ParticleSystemSimulationSpace;
-    private _temp: Vector3 = new Vector3();
-    private _temp2: Vector3 = new Vector3();
-    apply(_position: Vec3, baseVelocity: Vector3, currentVelocity: Vector3, _size: number, t01: number, _dt: number, _scale: number) {
-        if (!this.enabled) return;
-        // if (this.separateAxes) {
-        //     // const maxX = this.limitX.evaluate(t01) * this.limitXMultiplier;
-        //     // const maxY = this.limitY.evaluate(t01) * this.limitYMultiplier;
-        //     // const maxZ = this.limitZ.evaluate(t01) * this.limitZMultiplier;
-        // }
-        // else
-        {
-            const max = this.limit.evaluate(t01) * this.limitMultiplier;
-            const speed = baseVelocity.length();
-            if (speed > max) {
-                this._temp.copy(baseVelocity).normalize().multiplyScalar(max);
-                let t = this.dampen * .5;
-                // t *= scale;
-                baseVelocity.x = Mathf.lerp(baseVelocity.x, this._temp.x, t);
-                baseVelocity.y = Mathf.lerp(baseVelocity.y, this._temp.y, t);
-                baseVelocity.z = Mathf.lerp(baseVelocity.z, this._temp.z, t);
-                // this._temp2.set(0, 0, 0);
-                currentVelocity.x = Mathf.lerp(currentVelocity.x, this._temp.x, t);
-                currentVelocity.y = Mathf.lerp(currentVelocity.y, this._temp.y, t);
-                currentVelocity.z = Mathf.lerp(currentVelocity.z, this._temp.z, t);
-            }
-            // vel.multiplyScalar(dragFactor);
-        }
-        // vel.x *= 0.3;
-        // vel.y *= 0.3;
-        // vel.z *= 0.3;
-    }
-}
-export enum ParticleSystemInheritVelocityMode {
-    Initial,
-    Current,
-}
-export class InheritVelocityModule {
-    @serializable()
-    enabled!: boolean;
-    @serializable(MinMaxCurve)
-    curve!: MinMaxCurve;
-    @serializable()
-    curveMultiplier!: number;
-    @serializable()
-    mode!: ParticleSystemInheritVelocityMode;
-    system!: IParticleSystem;
-    private _lastWorldPosition!: Vector3;
-    private _velocity: Vector3 = new Vector3();
-    private _temp: Vector3 = new Vector3();
-    update(_context: Context) {
-        if (!this.enabled) return;
-        if (this.system.worldspace === false) return;
-        if (this._lastWorldPosition) {
-            this._velocity.copy(this.system.worldPos).sub(this._lastWorldPosition).multiplyScalar(1 / this.system.deltaTime);
-            this._lastWorldPosition.copy(this.system.worldPos);
-        }
-        else {
-            this._velocity.set(0, 0, 0);
-            this._lastWorldPosition = this.system.worldPos.clone();
-        }
-    }
-    // TODO: make work for subsystems
-    applyInitial(vel: Vector3) {
-        if (!this.enabled) return;
-        if (this.system.worldspace === false) return;
-        if (this.mode === ParticleSystemInheritVelocityMode.Initial) {
-            const factor = this.curve.evaluate(Math.random(), Math.random());
-            this._temp.copy(this._velocity).multiplyScalar(factor);
-            vel.add(this._temp);
-        }
-    }
-    applyCurrent(vel: Vector3, t01: number, lerpFactor: number) {
-        if (!this.enabled) return;
-        if (this.system.worldspace === false) return;
-        if (this.mode === ParticleSystemInheritVelocityMode.Current) {
-            const factor = this.curve.evaluate(t01, lerpFactor);
-            this._temp.copy(this._velocity).multiplyScalar(factor);
-            vel.add(this._temp);
-        }
-    }
-}
-export class SizeBySpeedModule {
-    @serializable()
-    enabled!: boolean;
-    @serializable(Vector2)
-    range!: Vector2;
-    @serializable()
-    separateAxes!: boolean;
-    @serializable(MinMaxCurve)
-    size!: MinMaxCurve;
-    @serializable()
-    sizeMultiplier!: number;
-    @serializable(MinMaxCurve)
-    x!: MinMaxCurve;
-    @serializable()
-    xMultiplier!: number;
-    @serializable(MinMaxCurve)
-    y!: MinMaxCurve;
-    @serializable()
-    yMultiplier!: number;
-    @serializable(MinMaxCurve)
-    z!: MinMaxCurve;
-    @serializable()
-    zMultiplier!: number;
-    evaluate(vel: Vector3, _t01: number, lerpFactor: number, size: number): number {
-        const speed = vel.length();
-        const x = Mathf.remap(speed, this.range.x, this.range.y, 0, 1);
-        const factor = this.size.evaluate(x, lerpFactor);
-        // return size;
-        return size * factor;
-    }
-}
-export class ColorBySpeedModule {
-    @serializable()
-    enabled!: boolean;
-    @serializable(Vector2)
-    range!: Vector2;
-    @serializable(MinMaxGradient)
-    color!: MinMaxGradient;
-    evaluate(vel: Vector3, lerpFactor: number, color: Vector4) {
-        const speed = vel.length();
-        const x = Mathf.remap(speed, this.range.x, this.range.y, 0, 1);
-        const res = this.color.evaluate(x, lerpFactor);
-        color.x *= res.r;
-        color.y *= res.g;
-        color.z *= res.b;
-        color.w *= res.alpha;
-    }
+import { Color, Matrix4, Object3D, PointLightShadow, Quaternion, Vector3, Vector2, Euler, Vector4, DirectionalLightHelper } from "three";
+import { Mathf } from "../engine/engine_math";
+import { serializable } from "../engine/engine_serialization";
+import { RGBAColor } from "./js-extensions/RGBAColor";
+import { AnimationCurve } from "./AnimationCurve";
+import { Vec2, Vec3 } from "../engine/engine_types";
+import { Context } from "../engine/engine_setup";
+import { EmitterShape, FrameOverLife, Particle, ShapeJSON } from "three.quarks";
+import { createNoise4D, NoiseFunction4D } from 'simplex-noise';
+import { Gizmos } from "../engine/engine_gizmos";
+import { getParam } from "../engine/engine_utils";
+const debug = getParam("debugparticles");
+declare type Color4 = { r: number, g: number, b: number, a: number };
+declare type ColorKey = { time: number, color: Color4 };
+declare type AlphaKey = { time: number, alpha: number };
+export interface IParticleSystem {
+    get currentParticles(): number;
+    get maxParticles(): number;
+    get time(): number;
+    get deltaTime(): number;
+    get duration(): number;
+    readonly main: MainModule;
+    get container(): Object3D;
+    get worldspace(): boolean;
+    get worldPos(): Vector3;
+    get worldQuaternion(): Quaternion;
+    get worldQuaternionInverted(): Quaternion;
+    get worldScale(): Vector3;
+    get matrixWorld(): Matrix4;
+}
+export enum ParticleSystemRenderMode {
+    Billboard = 0,
+    Stretch = 1,
+    HorizontalBillboard = 2,
+    VerticalBillboard = 3,
+    Mesh = 4,
+    //   None = 5,
+}
+export class Gradient {
+    @serializable()
+    alphaKeys!: Array<AlphaKey>;
+    @serializable()
+    colorKeys!: Array<ColorKey>;
+    get duration(): number {
+        return 1;
+    }
+    evaluate(time: number, target: RGBAColor) {
+        // target.r = this.colorKeys[0].color.r;
+        // target.g = this.colorKeys[0].color.g;
+        // target.b = this.colorKeys[0].color.b;
+        // target.alpha = this.alphaKeys[0].alpha;
+        // return;
+        let closestAlpha: AlphaKey | undefined = undefined;
+        let closestAlphaIndex = 0;
+        let closestColor: ColorKey | null = null;
+        let closestColorIndex = 0;
+        for (let i = 0; i < this.alphaKeys.length; i++) {
+            const key = this.alphaKeys[i];
+            if (key.time < time || !closestAlpha) {
+                closestAlpha = key;
+                closestAlphaIndex = i;
+            }
+        }
+        for (let i = 0; i < this.colorKeys.length; i++) {
+            const key = this.colorKeys[i];
+            if (key.time < time || !closestColor) {
+                closestColor = key;
+                closestColorIndex = i;
+            }
+        }
+        if (closestColor) {
+            const hasNextColor = closestColorIndex + 1 < this.colorKeys.length;
+            if (hasNextColor) {
+                const nextColor = this.colorKeys[closestColorIndex + 1];
+                const t = Mathf.remap(time, closestColor.time, nextColor.time, 0, 1);
+                target.r = Mathf.lerp(closestColor.color.r, nextColor.color.r, t);
+                target.g = Mathf.lerp(closestColor.color.g, nextColor.color.g, t);
+                target.b = Mathf.lerp(closestColor.color.b, nextColor.color.b, t);
+            }
+            else {
+                target.r = closestColor.color.r;
+                target.g = closestColor.color.g;
+                target.b = closestColor.color.b;
+            }
+        }
+        if (closestAlpha) {
+            const hasNextAlpha = closestAlphaIndex + 1 < this.alphaKeys.length;
+            if (hasNextAlpha) {
+                const nextAlpha = this.alphaKeys[closestAlphaIndex + 1];
+                const t = Mathf.remap(time, closestAlpha.time, nextAlpha.time, 0, 1);
+                target.alpha = Mathf.lerp(closestAlpha.alpha, nextAlpha.alpha, t);
+            }
+            else {
+                target.alpha = closestAlpha.alpha;
+            }
+        }
+        return target;
+    }
+}
+export enum ParticleSystemCurveMode {
+    Constant = 0,
+    Curve = 1,
+    TwoCurves = 2,
+    TwoConstants = 3
+}
+export enum ParticleSystemGradientMode {
+    Color = 0,
+    Gradient = 1,
+    TwoColors = 2,
+    TwoGradients = 3,
+    RandomColor = 4,
+}
+export enum ParticleSystemSimulationSpace {
+    Local = 0,
+    World = 1,
+    Custom = 2
+}
+export enum ParticleSystemShapeType {
+    Sphere = 0,
+    SphereShell = 1,
+    Hemisphere = 2,
+    HemisphereShell = 3,
+    Cone = 4,
+    Box = 5,
+    Mesh = 6,
+    ConeShell = 7,
+    ConeVolume = 8,
+    ConeVolumeShell = 9,
+    Circle = 10,
+    CircleEdge = 11,
+    SingleSidedEdge = 12,
+    MeshRenderer = 13,
+    SkinnedMeshRenderer = 14,
+    BoxShell = 15,
+    BoxEdge = 16,
+    Donut = 17,
+    Rectangle = 18,
+    Sprite = 19,
+    SpriteRenderer = 20
+}
+export enum ParticleSystemShapeMultiModeValue {
+    Random = 0,
+    Loop = 1,
+    PingPong = 2,
+    BurstSpread = 3,
+}
+export class MinMaxCurve {
+    @serializable()
+    mode!: ParticleSystemCurveMode;
+    @serializable()
+    constant!: number;
+    @serializable()
+    constantMin!: number;
+    @serializable()
+    constantMax!: number;
+    @serializable(AnimationCurve)
+    curve?: AnimationCurve;
+    @serializable(AnimationCurve)
+    curveMin?: AnimationCurve;
+    @serializable(AnimationCurve)
+    curveMax?: AnimationCurve;
+    @serializable()
+    curveMultiplier?: number;
+    evaluate(t01: number, lerpFactor?: number): number {
+        const t = lerpFactor === undefined ? Math.random() : lerpFactor;
+        switch (this.mode) {
+            case ParticleSystemCurveMode.Constant:
+                return this.constant;
+            case ParticleSystemCurveMode.Curve:
+                t01 = Mathf.clamp01(t01);
+                return this.curve!.evaluate(t01) * this.curveMultiplier!;
+            case ParticleSystemCurveMode.TwoCurves:
+                const t1 = t01 * this.curveMin!.duration;
+                const t2 = t01 * this.curveMax!.duration;
+                return Mathf.lerp(this.curveMin!.evaluate(t1), this.curveMax!.evaluate(t2), t % 1) * this.curveMultiplier!;
+            case ParticleSystemCurveMode.TwoConstants:
+                return Mathf.lerp(this.constantMin, this.constantMax, t % 1)
+            default:
+                this.curveMax!.evaluate(t01) * this.curveMultiplier!;
+                break;
+        }
+        return 0;
+    }
+    getMax(): number {
+        switch (this.mode) {
+            case ParticleSystemCurveMode.Constant:
+                return this.constant;
+            case ParticleSystemCurveMode.Curve:
+                return this.getMaxFromCurve(this.curve!) * this.curveMultiplier!;
+            case ParticleSystemCurveMode.TwoCurves:
+                return Math.max(this.getMaxFromCurve(this.curveMin), this.getMaxFromCurve(this.curveMax)) * this.curveMultiplier!;
+            case ParticleSystemCurveMode.TwoConstants:
+                return Math.max(this.constantMin, this.constantMax);
+            default:
+                return 0;
+        }
+    }
+    private getMaxFromCurve(curve?: AnimationCurve) {
+        if (!curve) return 0;
+        let maxNumber = Number.MIN_VALUE;
+        for (let i = 0; i < curve!.keys.length; i++) {
+            const key = curve!.keys[i];
+            if (key.value > maxNumber) {
+                maxNumber = key.value;
+            }
+        }
+        return maxNumber;
+    }
+}
+export class MinMaxGradient {
+    mode!: ParticleSystemGradientMode;
+    @serializable(RGBAColor)
+    color!: RGBAColor;
+    @serializable(RGBAColor)
+    colorMin!: RGBAColor;
+    @serializable(RGBAColor)
+    colorMax!: RGBAColor;
+    @serializable(Gradient)
+    gradient!: Gradient;
+    @serializable(Gradient)
+    gradientMin!: Gradient;
+    @serializable(Gradient)
+    gradientMax!: Gradient;
+    private static _temp: RGBAColor = new RGBAColor(0, 0, 0, 1);
+    private static _temp2: RGBAColor = new RGBAColor(0, 0, 0, 1);
+    evaluate(t01: number, lerpFactor?: number): RGBAColor {
+        const t = lerpFactor === undefined ? Math.random() : lerpFactor;
+        switch (this.mode) {
+            case ParticleSystemGradientMode.Color:
+                return this.color;
+            case ParticleSystemGradientMode.Gradient:
+                this.gradient.evaluate(t01, MinMaxGradient._temp);
+                return MinMaxGradient._temp
+            case ParticleSystemGradientMode.TwoColors:
+                const col1 = MinMaxGradient._temp.lerpColors(this.colorMin, this.colorMax, t);
+                return col1;
+            case ParticleSystemGradientMode.TwoGradients:
+                this.gradientMin.evaluate(t01, MinMaxGradient._temp);
+                this.gradientMax.evaluate(t01, MinMaxGradient._temp2);
+                return MinMaxGradient._temp.lerp(MinMaxGradient._temp2, t);
+        }
+        // console.warn("Not implemented", ParticleSystemGradientMode[this.mode]);
+        MinMaxGradient._temp.set(0xff00ff)
+        MinMaxGradient._temp.alpha = 1;
+        return MinMaxGradient._temp;
+    }
+}
+declare type ParticleSystemScalingMode = {
+    Hierarchy: number;
+    Local: number;
+    Shape: number;
+}
+export class MainModule {
+    cullingMode!: number;
+    duration!: number;
+    emitterVelocityMode!: number;
+    flipRotation!: number;
+    @serializable(MinMaxCurve)
+    gravityModifier!: MinMaxCurve;
+    gravityModifierMultiplier!: number;
+    loop!: boolean;
+    maxParticles!: number;
+    playOnAwake!: boolean;
+    prewarm!: boolean;
+    ringBufferLoopRange!: { x: number, y: number };
+    ringBufferMode!: boolean;
+    scalingMode!: ParticleSystemScalingMode;
+    simulationSpace!: ParticleSystemSimulationSpace;
+    simulationSpeed!: number;
+    @serializable(MinMaxGradient)
+    startColor!: MinMaxGradient;
+    @serializable(MinMaxCurve)
+    startDelay!: MinMaxCurve;
+    startDelayMultiplier!: number;
+    @serializable(MinMaxCurve)
+    startLifetime!: MinMaxCurve;
+    startLifetimeMultiplier!: number;
+    @serializable(MinMaxCurve)
+    startRotation!: MinMaxCurve;
+    startRotationMultiplier!: number;
+    startRotation3D!: boolean;
+    @serializable(MinMaxCurve)
+    startRotationX!: MinMaxCurve;
+    startRotationXMultiplier!: number;
+    @serializable(MinMaxCurve)
+    startRotationY!: MinMaxCurve;
+    startRotationYMultiplier!: number;
+    @serializable(MinMaxCurve)
+    startRotationZ!: MinMaxCurve;
+    startRotationZMultiplier!: number;
+    @serializable(MinMaxCurve)
+    startSize!: MinMaxCurve;
+    startSize3D!: boolean;
+    startSizeMultiplier!: number;
+    @serializable(MinMaxCurve)
+    startSizeX!: MinMaxCurve;
+    startSizeXMultiplier!: number;
+    @serializable(MinMaxCurve)
+    startSizeY!: MinMaxCurve;
+    startSizeYMultiplier!: number;
+    @serializable(MinMaxCurve)
+    startSizeZ!: MinMaxCurve;
+    startSizeZMultiplier!: number;
+    @serializable(MinMaxCurve)
+    startSpeed!: MinMaxCurve;
+    startSpeedMultiplier!: number;
+    stopAction!: number;
+    useUnscaledTime!: boolean;
+}
+export class ParticleBurst {
+    cycleCount!: number;
+    maxCount!: number;
+    minCount!: number;
+    probability!: number;
+    repeatInterval!: number;
+    time!: number;
+    count!: {
+        constant: number;
+        constantMax: number;
+        constantMin: number;
+        curve?: AnimationCurve;
+        curveMax?: AnimationCurve;
+        curveMin?: AnimationCurve;
+        curveMultiplier?: number;
+        mode: ParticleSystemCurveMode;
+    }
+    private _performed: number = 0;
+    reset() {
+        this._performed = 0;
+    }
+    run(time: number): number {
+        if (time <= this.time) {
+            this.reset();
+            return 0;
+        }
+        let amount = 0;
+        if (this.cycleCount === 0 || this._performed < this.cycleCount) {
+            const nextTime = this.time + this.repeatInterval * this._performed;
+            if (time >= nextTime) {
+                this._performed += 1;
+                if (Math.random() < this.probability) {
+                    switch (this.count.mode) {
+                        case ParticleSystemCurveMode.Constant:
+                            amount = this.count.constant;
+                            break;
+                        case ParticleSystemCurveMode.TwoConstants:
+                            amount = Mathf.lerp(this.count.constantMin, this.count.constantMax, Math.random());
+                            break;
+                        case ParticleSystemCurveMode.Curve:
+                            amount = this.count.curve!.evaluate(Math.random());
+                            break;
+                        case ParticleSystemCurveMode.TwoCurves:
+                            const t = Math.random();
+                            amount = Mathf.lerp(this.count.curveMin!.evaluate(t), this.count.curveMax!.evaluate(t), Math.random());
+                            break;
+                    }
+                }
+            }
+        }
+        return amount;
+    }
+}
+export class EmissionModule {
+    @serializable()
+    enabled!: boolean;
+    get burstCount() {
+        return this.bursts?.length ?? 0;
+    }
+    @serializable()
+    bursts!: ParticleBurst[];
+    @serializable(MinMaxCurve)
+    rateOverTime!: MinMaxCurve;
+    @serializable()
+    rateOverTimeMultiplier!: number;
+    @serializable(MinMaxCurve)
+    rateOverDistance!: MinMaxCurve;
+    @serializable()
+    rateOverDistanceMultiplier!: number;
+    /** set from system */
+    system!: IParticleSystem;
+    reset() {
+        this.bursts?.forEach(b => b.reset());
+    }
+    getBurst() {
+        let amount = 0;
+        if (this.burstCount > 0) {
+            for (let i = 0; i < this.burstCount; i++) {
+                const burst = this.bursts[i];
+                if (burst.time >= this.system.time) {
+                    burst.reset();
+                }
+                amount += Math.round(burst.run(this.system.time));
+            }
+        }
+        return amount;
+    }
+}
+export class ColorOverLifetimeModule {
+    enabled!: boolean;
+    @serializable(MinMaxGradient)
+    color!: MinMaxGradient;
+}
+export class SizeOverLifetimeModule {
+    enabled!: boolean;
+    separateAxes!: boolean;
+    @serializable(MinMaxCurve)
+    size!: MinMaxCurve;
+    sizeMultiplier!: number;
+    @serializable(MinMaxCurve)
+    x!: MinMaxCurve;
+    xMultiplier!: number;
+    @serializable(MinMaxCurve)
+    y!: MinMaxCurve;
+    yMultiplier!: number;
+    @serializable(MinMaxCurve)
+    z!: MinMaxCurve;
+    zMultiplier!: number;
+    private _time: number = 0;
+    private _temp = new Vector3();
+    evaluate(t01: number, target?: Vec3, lerpFactor?: number) {
+        if (!target) target = this._temp;
+        if (!this.enabled) {
+            target.x = target.y = target.z = 1;
+            return target;
+        }
+        if (!this.separateAxes) {
+            const scale = this.size.evaluate(t01, lerpFactor) * this.sizeMultiplier;
+            target.x = scale;
+            // target.y = scale;
+            // target.z = scale;
+        }
+        else {
+            target.x = this.x.evaluate(t01, lerpFactor) * this.xMultiplier;
+            target.y = this.y.evaluate(t01, lerpFactor) * this.yMultiplier;
+            target.z = this.z.evaluate(t01, lerpFactor) * this.zMultiplier;
+        }
+        return target;
+    }
+}
+export class ShapeModule implements EmitterShape {
+    // Emittershape start
+    get type(): string {
+        return ParticleSystemShapeType[this.shapeType];
+    }
+    initialize(particle: Particle): void {
+        this.getPosition();
+        particle.position.copy(this._vector);
+    }
+    toJSON(): ShapeJSON {
+        return this;
+    }
+    clone(): EmitterShape {
+        return new ShapeModule();
+    }
+    // EmitterShape end
+    @serializable()
+    shapeType: ParticleSystemShapeType = ParticleSystemShapeType.Box;
+    @serializable()
+    enabled: boolean = true;
+    @serializable()
+    alignToDirection: boolean = false;
+    @serializable()
+    angle: number = 0;
+    @serializable()
+    arc: number = 360;
+    @serializable()
+    arcSpread!: number;
+    @serializable()
+    arcSpeedMultiplier!: number;
+    @serializable()
+    arcMode!: ParticleSystemShapeMultiModeValue;
+    @serializable(Vector3)
+    boxThickness!: Vector3;
+    @serializable(Vector3)
+    position!: Vector3;
+    @serializable(Vector3)
+    rotation!: Vector3;
+    private _rotation: Euler = new Euler();
+    @serializable(Vector3)
+    scale!: Vector3;
+    @serializable()
+    radius!: number;
+    @serializable()
+    radiusThickness!: number;
+    @serializable()
+    sphericalDirectionAmount!: number;
+    @serializable()
+    randomDirectionAmount!: number;
+    @serializable()
+    randomPositionAmount!: number;
+    private system!: IParticleSystem;
+    private _space?: ParticleSystemSimulationSpace;
+    private readonly _worldSpaceMatrix: Matrix4 = new Matrix4();
+    private readonly _worldSpaceMatrixInverse: Matrix4 = new Matrix4();
+    constructor() {
+        if (debug)
+            console.log(this);
+    }
+    update(system: IParticleSystem, _context: Context, simulationSpace: ParticleSystemSimulationSpace, obj: Object3D) {
+        this.system = system;
+        this._space = simulationSpace;
+        if (simulationSpace === ParticleSystemSimulationSpace.World) {
+            this._worldSpaceMatrix.copy(obj.matrixWorld);
+            // set scale to 1
+            this._worldSpaceMatrix.elements[0] = 1;
+            this._worldSpaceMatrix.elements[5] = 1;
+            this._worldSpaceMatrix.elements[10] = 1;
+            this._worldSpaceMatrixInverse.copy(this._worldSpaceMatrix).invert();
+        }
+    }
+    private applyRotation(vector: Vector3) {
+        const isRotated = this.rotation.x !== 0 || this.rotation.y !== 0 || this.rotation.z !== 0;
+        if (isRotated) {
+            // console.log(this._rotation);
+            // TODO: we need to convert this to threejs euler
+            this._rotation.x = Mathf.toRadians(this.rotation.x);
+            this._rotation.y = Mathf.toRadians(this.rotation.y);
+            this._rotation.z = Mathf.toRadians(this.rotation.z);
+            this._rotation.order = 'ZYX';
+            vector.applyEuler(this._rotation);
+            // this._quat.setFromEuler(this._rotation);
+            // // this._quat.invert();
+            // this._quat.x *= -1;
+            // // this._quat.y *= -1;
+            // // this._quat.z *= -1;
+            // this._quat.w *= -1;
+            // vector.applyQuaternion(this._quat);
+        }
+        return isRotated;
+    }
+    /** nebula implementations: */
+    /** initializer implementation */
+    private _vector: Vector3 = new Vector3(0, 0, 0);
+    private _temp: Vector3 = new Vector3(0, 0, 0);
+    /** called by nebula on initialize */
+    get vector() {
+        return this._vector;
+    }
+    getPosition(): void {
+        this._vector.set(0, 0, 0);
+        const pos = this._temp.copy(this.position);
+        const isWorldSpace = this._space === ParticleSystemSimulationSpace.World;
+        if (isWorldSpace) {
+            pos.applyQuaternion(this.system.worldQuaternion);
+        }
+        let radius = this.radius;
+        if (isWorldSpace) radius *= this.system.worldScale.x;
+        if (this.enabled) {
+            switch (this.shapeType) {
+                case ParticleSystemShapeType.Box:
+                    if (debug) Gizmos.DrawBox(this.position, this.scale, 0xdddddd, 1);
+                    this._vector.x = Math.random() * this.scale.x - this.scale.x / 2;
+                    this._vector.y = Math.random() * this.scale.y - this.scale.y / 2;
+                    this._vector.z = Math.random() * this.scale.z - this.scale.z / 2;
+                    this._vector.add(pos);
+                    break;
+                case ParticleSystemShapeType.Cone:
+                    this.randomConePoint(this.position, this.angle, radius, this.radiusThickness, this.arc, this.arcMode, this._vector);
+                    break;
+                case ParticleSystemShapeType.Sphere:
+                    this.randomSpherePoint(this.position, radius, this.radiusThickness, this.arc, this._vector);
+                    break;
+                case ParticleSystemShapeType.Circle:
+                    this.randomCirclePoint(this.position, radius, this.radiusThickness, this.arc, this._vector);
+                    break;
+                default:
+                    this._vector.set(0, 0, 0);
+                    break;
+                // case ParticleSystemShapeType.Hemisphere:
+                //     randomSpherePoint(this.position.x, this.position.y, this.position.z, this.radius, this.radiusThickness, 180, this._vector);
+                //     break;
+            }
+            this.randomizePosition(this._vector, this.randomPositionAmount);
+        }
+        this.applyRotation(this._vector);
+        if (isWorldSpace) {
+            this._vector.applyQuaternion(this.system.worldQuaternion);
+            this._vector.add(this.system.worldPos);
+        }
+        if (debug) {
+            Gizmos.DrawSphere(this._vector, .03, 0xff0000, .5, true);
+        }
+    }
+    private _dir: Vector3 = new Vector3();
+    getDirection(pos: Vec3): Vector3 {
+        if (!this.enabled) {
+            this._dir.set(0, 0, 1);
+            return this._dir;
+        }
+        switch (this.shapeType) {
+            case ParticleSystemShapeType.Box:
+                this._dir.set(0, 0, 1);
+                break;
+            case ParticleSystemShapeType.Cone:
+                this._dir.set(0, 0, 1);
+                // apply cone angle
+                // this._dir.applyAxisAngle(new Vector3(0, 1, 0), Mathf.toRadians(this.angle));
+                break;
+            case ParticleSystemShapeType.Circle:
+            case ParticleSystemShapeType.Sphere:
+                const rx = pos.x;
+                const ry = pos.y;
+                const rz = pos.z;
+                this._dir.set(rx, ry, rz)
+                if (this.system?.worldspace)
+                    this._dir.sub(this.system.worldPos)
+                else
+                    this._dir.sub(this.position)
+                break;
+            default:
+                this._dir.set(0, 0, 1);
+                break;
+        }
+        if (this._space === ParticleSystemSimulationSpace.World) {
+            this._dir.applyQuaternion(this.system.worldQuaternion);
+        }
+        this.applyRotation(this._dir);
+        this._dir.normalize();
+        this.spherizeDirection(this._dir, this.sphericalDirectionAmount);
+        this.randomizeDirection(this._dir, this.randomDirectionAmount);
+        if (debug) {
+            Gizmos.DrawSphere(pos, .01, 0x883300, .5, true);
+            Gizmos.DrawDirection(pos, this._dir, 0x883300, .5, true);
+        }
+        return this._dir;
+    }
+    private static _randomQuat = new Quaternion();
+    private static _tempVec = new Vector3();
+    private randomizePosition(pos: Vector3, amount: number) {
+        if (amount <= 0) return;
+        const rp = ShapeModule._tempVec;
+        rp.set(Math.random() * 2 - 1, Math.random() * 2 - 1, Math.random() * 2 - 1);
+        rp.x *= amount * this.scale.x;
+        rp.y *= amount * this.scale.y;
+        rp.z *= amount * this.scale.z;
+        pos.add(rp);
+    }
+    private randomizeDirection(direction: Vector3, amount: number) {
+        if (amount === 0) return;
+        const randomQuat = ShapeModule._randomQuat;
+        const tempVec = ShapeModule._tempVec;
+        tempVec.set(Math.random() - .5, Math.random() - .5, Math.random() - .5).normalize();
+        randomQuat.setFromAxisAngle(tempVec, amount * Math.random() * Math.PI);
+        direction.applyQuaternion(randomQuat);
+    }
+    private spherizeDirection(dir: Vector3, amount: number) {
+        if (amount === 0) return;
+        const theta = Math.random() * Math.PI * 2;
+        const phi = Math.acos(1 - Math.random() * 2);
+        const x = Math.sin(phi) * Math.cos(theta);
+        const y = Math.sin(phi) * Math.sin(theta);
+        const z = Math.cos(phi);
+        const v = new Vector3(x, y, z);
+        dir.lerp(v, amount);
+    }
+    private randomSpherePoint(pos: Vec3, radius: number, thickness: number, arc: number, vec: Vec3) {
+        const u = Math.random();
+        const v = Math.random();
+        const theta = 2 * Math.PI * u * (arc / 360);
+        const phi = Math.acos(2 * v - 1);
+        const r = Mathf.lerp(1, 1 - (Math.pow(1 - Math.random(), Math.PI)), thickness) * (radius);
+        const x = pos.x + this.scale.x * (-r * Math.sin(phi) * Math.cos(theta));
+        const y = pos.y + this.scale.y * (r * Math.sin(phi) * Math.sin(theta));
+        const z = pos.z + this.scale.z * (r * Math.cos(phi));
+        vec.x = x;
+        vec.y = y;
+        vec.z = z;
+    }
+    private randomCirclePoint(pos:Vec3, radius:number, thickness:number, arg:number, vec:Vec3){
+        const u = Math.random();
+        const theta = 2 * Math.PI * u * (arg / 360);
+        const r = Mathf.lerp(1, 1 - (Math.pow(1 - Math.random(), Math.PI)), thickness) * (radius);
+        const x = pos.x + this.scale.x * r * Math.cos(theta);
+        const y = pos.y + this.scale.y * r * Math.sin(theta);
+        const z = pos.z;
+        vec.x = x;
+        vec.y = y;
+        vec.z = z;
+    }
+    private _loopTime: number = 0;
+    private _loopDirection: number = 1;
+    private randomConePoint(pos: Vec3, _angle: number, radius: number, thickness: number, arc: number, arcMode: ParticleSystemShapeMultiModeValue, vec: Vec3) {
+        let u = 0;
+        let v = 0;
+        switch (arcMode) {
+            case ParticleSystemShapeMultiModeValue.Random:
+                u = Math.random();
+                v = Math.random();
+                break;
+            case ParticleSystemShapeMultiModeValue.PingPong:
+                if (this._loopTime > 1) this._loopDirection = -1;
+                if (this._loopTime < 0) this._loopDirection = 1;
+            // continue with loop
+            case ParticleSystemShapeMultiModeValue.Loop:
+                u = .5;
+                v = Math.random()
+                this._loopTime += this.system.deltaTime * this._loopDirection;
+                break;
+        }
+        let theta = 2 * Math.PI * u * (arc / 360);
+        switch (arcMode) {
+            case ParticleSystemShapeMultiModeValue.PingPong:
+            case ParticleSystemShapeMultiModeValue.Loop:
+                theta += Math.PI + .5;
+                theta += this._loopTime * Math.PI * 2;
+                theta %= Mathf.toRadians(arc);
+                break;
+        }
+        const phi = Math.acos(2 * v - 1);
+        const r = Mathf.lerp(1, 1 - (Math.pow(1 - Math.random(), Math.PI)), thickness) * radius;
+        const x = pos.x + (-r * Math.sin(phi) * Math.cos(theta));
+        const y = pos.y + (r * Math.sin(phi) * Math.sin(theta));
+        const z = pos.z;
+        vec.x = x * this.scale.x;
+        vec.y = y * this.scale.y;
+        vec.z = z * this.scale.z;
+    }
+}
+export class NoiseModule {
+    @serializable()
+    damping!: boolean;
+    @serializable()
+    enabled!: boolean;
+    @serializable()
+    frequency!: number;
+    @serializable()
+    octaveCount!: number;
+    @serializable()
+    octaveMultiplier!: number;
+    @serializable()
+    octaveScale!: number;
+    @serializable(MinMaxCurve)
+    positionAmount!: MinMaxCurve;
+    @serializable()
+    quality!: number;
+    @serializable(MinMaxCurve)
+    remap!: MinMaxCurve;
+    @serializable()
+    remapEnabled!: boolean;
+    @serializable()
+    remapMultiplier!: number;
+    @serializable(MinMaxCurve)
+    remapX!: MinMaxCurve;
+    @serializable()
+    remapXMultiplier!: number;
+    @serializable(MinMaxCurve)
+    remapY!: MinMaxCurve;
+    @serializable()
+    remapYMultiplier!: number;
+    @serializable(MinMaxCurve)
+    remapZ!: MinMaxCurve;
+    @serializable()
+    remapZMultiplier!: number;
+    @serializable()
+    scrollSpeedMultiplier!: number;
+    @serializable()
+    separateAxes!: boolean;
+    @serializable()
+    strengthMultiplier!: number;
+    @serializable(MinMaxCurve)
+    strengthX!: MinMaxCurve;
+    @serializable()
+    strengthXMultiplier!: number;
+    @serializable(MinMaxCurve)
+    strengthY!: MinMaxCurve;
+    @serializable()
+    strengthYMultiplier!: number;
+    @serializable(MinMaxCurve)
+    strengthZ!: MinMaxCurve;
+    @serializable()
+    strengthZMultiplier!: number;
+    private _noise?: NoiseFunction4D;
+    private _time: number = 0;
+    update(context: Context) {
+        this._time += context.time.deltaTime * this.scrollSpeedMultiplier;
+    }
+    /** nebula implementations: */
+    private _temp: Vector3 = new Vector3();
+    apply(_index: number, pos: Vec3, vel: Vec3, _deltaTime: number, age: number, life: number) {
+        if (!this.enabled) return;
+        if (!this._noise) {
+            this._noise = createNoise4D(() => 0);
+        }
+        const temp = this._temp.set(pos.x, pos.y, pos.z).multiplyScalar(this.frequency);
+        const nx = this._noise(temp.x, temp.y, temp.z, this._time);
+        const ny = this._noise(temp.x, temp.y, temp.z, this._time + 1000 * this.frequency);
+        const nz = this._noise(temp.x, temp.y, temp.z, this._time + 2000 * this.frequency);
+        this._temp.set(nx, ny, nz).normalize()
+        const t = age / life;
+        let strengthFactor = this.positionAmount.evaluate(t);
+        if (!this.separateAxes) {
+            if (this.strengthX) {
+                strengthFactor *= this.strengthX.evaluate(t) * 1.5;
+            }
+            // strengthFactor *= this.strengthMultiplier;
+            // strengthFactor *= deltaTime;
+            this._temp.multiplyScalar(strengthFactor);
+        }
+        else {
+            this._temp.x *= strengthFactor * this.strengthXMultiplier
+            this._temp.y *= strengthFactor * this.strengthYMultiplier;
+            this._temp.z *= strengthFactor * this.strengthZMultiplier;
+        }
+        // this._temp.setLength(strengthFactor * deltaTime);
+        vel.x += this._temp.x;
+        vel.y += this._temp.y;
+        vel.z += this._temp.z;
+    }
+}
+export enum ParticleSystemTrailMode {
+    PerParticle,
+    Ribbon,
+}
+export enum ParticleSystemTrailTextureMode {
+    Stretch = 0,
+    Tile = 1,
+    DistributePerSegment = 2,
+    RepeatPerSegment = 3,
+}
+export class TrailModule {
+    @serializable()
+    enabled!: boolean;
+    @serializable()
+    attachRibbonToTransform = false;
+    @serializable(MinMaxGradient)
+    colorOverLifetime!: MinMaxGradient;
+    @serializable(MinMaxGradient)
+    colorOverTrail!: MinMaxGradient;
+    @serializable()
+    dieWithParticles: boolean = true;
+    @serializable()
+    inheritParticleColor: boolean = true;
+    @serializable(MinMaxCurve)
+    lifetime!: MinMaxCurve;
+    @serializable()
+    lifetimeMultiplier!: number;
+    @serializable()
+    minVertexDistance: number = .2;
+    @serializable()
+    mode: ParticleSystemTrailMode = ParticleSystemTrailMode.PerParticle;
+    @serializable()
+    ratio: number = 1;
+    @serializable()
+    ribbonCount: number = 1;
+    @serializable()
+    shadowBias: number = 0;
+    @serializable()
+    sizeAffectsLifetime: boolean = false;
+    @serializable()
+    sizeAffectsWidth: boolean = false;
+    @serializable()
+    splitSubEmitterRibbons: boolean = false;
+    @serializable()
+    textureMode: ParticleSystemTrailTextureMode = ParticleSystemTrailTextureMode.Stretch;
+    @serializable(MinMaxCurve)
+    widthOverTrail!: MinMaxCurve;
+    @serializable()
+    widthOverTrailMultiplier!: number;
+    @serializable()
+    worldSpace: boolean = false;
+    getWidth(size: number, _life01: number, pos01: number) {
+        let res = this.widthOverTrail.evaluate(pos01);
+        if (pos01 === 0) res = size;
+        size *= res;
+        return size;
+    }
+    getColor(color: Vector4, life01: number, pos01: number) {
+        const overTrail = this.colorOverTrail.evaluate(pos01);
+        const overLife = this.colorOverLifetime.evaluate(life01);
+        color.x *= overTrail.r * overLife.r;
+        color.y *= overTrail.g * overLife.g;
+        color.z *= overTrail.b * overLife.b;
+        color.w *= overTrail.alpha * overLife.alpha;
+    }
+}
+export class VelocityOverLifetimeModule {
+    @serializable()
+    enabled!: boolean;
+    @serializable()
+    space: ParticleSystemSimulationSpace = ParticleSystemSimulationSpace.Local;
+    @serializable(MinMaxCurve)
+    orbitalX!: MinMaxCurve;
+    @serializable(MinMaxCurve)
+    orbitalY!: MinMaxCurve;
+    @serializable(MinMaxCurve)
+    orbitalZ!: MinMaxCurve;
+    @serializable()
+    orbitalXMultiplier!: number;
+    @serializable()
+    orbitalYMultiplier!: number;
+    @serializable()
+    orbitalZMultiplier!: number;
+    @serializable()
+    orbitalOffsetX!: number;
+    @serializable()
+    orbitalOffsetY!: number;
+    @serializable()
+    orbitalOffsetZ!: number;
+    @serializable(MinMaxCurve)
+    speedModifier!: MinMaxCurve;
+    @serializable()
+    speedModifierMultiplier!: number;
+    @serializable(MinMaxCurve)
+    x!: MinMaxCurve;
+    @serializable()
+    xMultiplier!: number;
+    @serializable(MinMaxCurve)
+    y!: MinMaxCurve;
+    @serializable()
+    yMultiplier!: number;
+    @serializable(MinMaxCurve)
+    z!: MinMaxCurve;
+    @serializable()
+    zMultiplier!: number;
+    private _system?: IParticleSystem;
+    // private _worldRotation: Quaternion = new Quaternion();
+    update(system: IParticleSystem) {
+        this._system = system;
+    }
+    private _temp: Vector3 = new Vector3();
+    private _temp2: Vector3 = new Vector3();
+    private _temp3: Vector3 = new Vector3();
+    private _hasOrbital = false;
+    private _index = 0;
+    private _orbitalMatrix: Matrix4 = new Matrix4();
+    init(particle: object) {
+        if (this._index == 0) particle["debug"] = true;
+        this._index += 1;
+        particle["orbitx"] = this.orbitalX.evaluate(Math.random());
+        particle["orbity"] = this.orbitalY.evaluate(Math.random());
+        particle["orbitz"] = this.orbitalZ.evaluate(Math.random());
+        // console.log(particle["orbitx"], particle["orbity"], particle["orbitz"])
+        this._hasOrbital = particle["orbitx"] != 0 || particle["orbity"] != 0 || particle["orbitz"] != 0;
+    }
+    apply(_particle: object, _index: number, _pos: Vec3, vel: Vec3, _dt: number, age: number, life: number) {
+        if (!this.enabled) return;
+        const t = age / life;
+        const speed = this.speedModifier.evaluate(t) * this.speedModifierMultiplier;
+        const x = this.x.evaluate(t);
+        const y = this.y.evaluate(t);
+        const z = this.z.evaluate(t);
+        this._temp.set(-x, y, z);
+        if (this._system) {
+            // if (this.space === ParticleSystemSimulationSpace.World) {
+            //     this._temp.applyQuaternion(this._system.worldQuaternionInverted);
+            // }
+            // if (this._system.main.simulationSpace === ParticleSystemSimulationSpace.World) {
+            //     this._temp.applyQuaternion(this._system.worldQuaternion);
+            // }
+        }
+        if (this._hasOrbital) {
+            const position = this._system?.worldPos;
+            if (position) {
+                // TODO: we absolutely need to fix this, this is a hack for a specific usecase and doesnt work yet correctly
+                // https://github.com/needle-tools/needle-tiny/issues/710
+                const pos = this._temp2.set(_pos.x, _pos.y, _pos.z);
+                const ox = this.orbitalXMultiplier;// particle["orbitx"];
+                const oy = this.orbitalYMultiplier;// particle["orbity"];
+                const oz = this.orbitalZMultiplier;// particle["orbitz"];
+                const angle = speed * Math.PI * 2 * 10; // < Oh god
+                const cosX = Math.cos(angle * ox);
+                const sinX = Math.sin(angle * ox);
+                const cosY = Math.cos(angle * oy);
+                const sinY = Math.sin(angle * oy);
+                const cosZ = Math.cos(angle * oz);
+                const sinZ = Math.sin(angle * oz);
+                const newX = pos.x * (cosY * cosZ) + pos.y * (cosY * sinZ) + pos.z * (-sinY);
+                const newY = pos.x * (sinX * sinY * cosZ - cosX * sinZ) + pos.y * (sinX * sinY * sinZ + cosX * cosZ) + pos.z * (sinX * cosY);
+                const newZ = pos.x * (cosX * sinY * cosZ + sinX * sinZ) + pos.y * (cosX * sinY * sinZ - sinX * cosZ) + pos.z * (cosX * cosY);
+                // pos.x += this.orbitalOffsetX;
+                // pos.y += this.orbitalOffsetY;
+                // pos.z += this.orbitalOffsetZ;
+                const v = this._temp3.set(pos.x - newX, pos.y - newY, pos.z - newZ);
+                v.normalize();
+                v.multiplyScalar(.2 / _dt * (Math.max(this.orbitalXMultiplier, this.orbitalYMultiplier, this.orbitalZMultiplier)));
+                vel.x += v.x;
+                vel.y += v.y;
+                vel.z += v.z;
+            }
+        }
+        vel.x += this._temp.x;
+        vel.y += this._temp.y;
+        vel.z += this._temp.z;
+        vel.x *= speed;
+        vel.y *= speed;
+        vel.z *= speed;
+    }
+}
+enum ParticleSystemAnimationTimeMode {
+    Lifetime,
+    Speed,
+    FPS,
+}
+enum ParticleSystemAnimationMode {
+    Grid,
+    Sprites,
+}
+enum ParticleSystemAnimationRowMode {
+    Custom,
+    Random,
+    MeshIndex,
+}
+enum ParticleSystemAnimationType {
+    WholeSheet,
+    SingleRow,
+}
+export class TextureSheetAnimationModule {
+    @serializable()
+    animation!: ParticleSystemAnimationType;
+    @serializable()
+    enabled!: boolean;
+    @serializable()
+    cycleCount!: number;
+    @serializable(MinMaxCurve)
+    frameOverTime!: MinMaxCurve;
+    @serializable()
+    frameOverTimeMultiplier!: number;
+    @serializable()
+    numTilesX!: number;
+    @serializable()
+    numTilesY!: number;
+    @serializable(MinMaxCurve)
+    startFrame!: MinMaxCurve;
+    @serializable()
+    startFrameMultiplier!: number;
+    @serializable()
+    rowMode!: ParticleSystemAnimationRowMode;
+    @serializable()
+    rowIndex!: number;
+    @serializable()
+    spriteCount!: number;
+    @serializable()
+    timeMode!: ParticleSystemAnimationTimeMode;
+    private sampleOnceAtStart(): boolean {
+        if (this.timeMode === ParticleSystemAnimationTimeMode.Lifetime) {
+            switch (this.frameOverTime.mode) {
+                case ParticleSystemCurveMode.Constant:
+                case ParticleSystemCurveMode.TwoConstants:
+                case ParticleSystemCurveMode.TwoCurves:
+                case ParticleSystemCurveMode.Curve:
+                    return true;
+            }
+        }
+        return false;
+    }
+    getStartIndex(): number {
+        if (this.sampleOnceAtStart()) {
+            const start = Math.random();
+            return start * (this.numTilesX * this.numTilesY);
+        }
+        return 0;
+    }
+    evaluate(t01: number): number | undefined {
+        if (this.sampleOnceAtStart()) {
+            return undefined;
+        }
+        return this.getIndex(t01);
+    }
+    private getIndex(t01: number): number {
+        const tiles = this.numTilesX * this.numTilesY;
+        t01 = t01 * this.cycleCount;
+        let index = this.frameOverTime.evaluate(t01 % 1);
+        index *= this.frameOverTimeMultiplier;
+        index *= tiles;
+        index = index % tiles;
+        index = Math.floor(index);
+        return index;
+    }
+}
+export class RotationOverLifetimeModule {
+    @serializable()
+    enabled!: boolean;
+    @serializable()
+    separateAxes!: boolean;
+    @serializable(MinMaxCurve)
+    x!: MinMaxCurve;
+    @serializable()
+    xMultiplier!: number;
+    @serializable(MinMaxCurve)
+    y!: MinMaxCurve;
+    @serializable()
+    yMultiplier!: number;
+    @serializable(MinMaxCurve)
+    z!: MinMaxCurve;
+    @serializable()
+    zMultiplier!: number;
+    evaluate(t01: number, t: number): number {
+        if (!this.enabled) return 0;
+        if (!this.separateAxes) {
+            const rot = this.z.evaluate(t01, t) * -1;
+            return rot;
+        }
+        return 0;
+    }
+}
+export class RotationBySpeedModule {
+    @serializable()
+    enabled!: boolean;
+    @serializable()
+    range!: Vec2;
+    @serializable()
+    separateAxes!: boolean;
+    @serializable(MinMaxCurve)
+    x!: MinMaxCurve;
+    @serializable()
+    xMultiplier!: number;
+    @serializable(MinMaxCurve)
+    y!: MinMaxCurve;
+    @serializable()
+    yMultiplier!: number;
+    @serializable(MinMaxCurve)
+    z!: MinMaxCurve;
+    @serializable()
+    zMultiplier!: number;
+    evaluate(_t01: number, speed: number): number {
+        if (!this.enabled) return 0;
+        if (!this.separateAxes) {
+            const t = Mathf.lerp(this.range.x, this.range.y, speed);
+            const rot = this.z.evaluate(t) * -1;
+            return rot;
+        }
+        return 0;
+    }
+}
+export class LimitVelocityOverLifetimeModule {
+    @serializable()
+    enabled!: boolean;
+    @serializable()
+    dampen!: number;
+    @serializable(MinMaxCurve)
+    drag!: MinMaxCurve;
+    @serializable()
+    dragMultiplier!: number;
+    @serializable(MinMaxCurve)
+    limit!: MinMaxCurve;
+    @serializable()
+    limitMultiplier!: number;
+    @serializable()
+    separateAxes!: boolean;
+    @serializable(MinMaxCurve)
+    limitX!: MinMaxCurve;
+    @serializable()
+    limitXMultiplier!: number;
+    @serializable(MinMaxCurve)
+    limitY!: MinMaxCurve;
+    @serializable()
+    limitYMultiplier!: number;
+    @serializable(MinMaxCurve)
+    limitZ!: MinMaxCurve;
+    @serializable()
+    limitZMultiplier!: number;
+    @serializable()
+    multiplyDragByParticleSize: boolean = false;
+    @serializable()
+    multiplyDragByParticleVelocity: boolean = false;
+    @serializable()
+    space!: ParticleSystemSimulationSpace;
+    private _temp: Vector3 = new Vector3();
+    private _temp2: Vector3 = new Vector3();
+    apply(_position: Vec3, baseVelocity: Vector3, currentVelocity: Vector3, _size: number, t01: number, _dt: number, _scale: number) {
+        if (!this.enabled) return;
+        // if (this.separateAxes) {
+        //     // const maxX = this.limitX.evaluate(t01) * this.limitXMultiplier;
+        //     // const maxY = this.limitY.evaluate(t01) * this.limitYMultiplier;
+        //     // const maxZ = this.limitZ.evaluate(t01) * this.limitZMultiplier;
+        // }
+        // else
+        {
+            const max = this.limit.evaluate(t01) * this.limitMultiplier;
+            const speed = baseVelocity.length();
+            if (speed > max) {
+                this._temp.copy(baseVelocity).normalize().multiplyScalar(max);
+                let t = this.dampen * .5;
+                // t *= scale;
+                baseVelocity.x = Mathf.lerp(baseVelocity.x, this._temp.x, t);
+                baseVelocity.y = Mathf.lerp(baseVelocity.y, this._temp.y, t);
+                baseVelocity.z = Mathf.lerp(baseVelocity.z, this._temp.z, t);
+                // this._temp2.set(0, 0, 0);
+                currentVelocity.x = Mathf.lerp(currentVelocity.x, this._temp.x, t);
+                currentVelocity.y = Mathf.lerp(currentVelocity.y, this._temp.y, t);
+                currentVelocity.z = Mathf.lerp(currentVelocity.z, this._temp.z, t);
+            }
+            // vel.multiplyScalar(dragFactor);
+        }
+        // vel.x *= 0.3;
+        // vel.y *= 0.3;
+        // vel.z *= 0.3;
+    }
+}
+export enum ParticleSystemInheritVelocityMode {
+    Initial,
+    Current,
+}
+export class InheritVelocityModule {
+    @serializable()
+    enabled!: boolean;
+    @serializable(MinMaxCurve)
+    curve!: MinMaxCurve;
+    @serializable()
+    curveMultiplier!: number;
+    @serializable()
+    mode!: ParticleSystemInheritVelocityMode;
+    system!: IParticleSystem;
+    private _lastWorldPosition!: Vector3;
+    private _velocity: Vector3 = new Vector3();
+    private _temp: Vector3 = new Vector3();
+    update(_context: Context) {
+        if (!this.enabled) return;
+        if (this.system.worldspace === false) return;
+        if (this._lastWorldPosition) {
+            this._velocity.copy(this.system.worldPos).sub(this._lastWorldPosition).multiplyScalar(1 / this.system.deltaTime);
+            this._lastWorldPosition.copy(this.system.worldPos);
+        }
+        else {
+            this._velocity.set(0, 0, 0);
+            this._lastWorldPosition = this.system.worldPos.clone();
+        }
+    }
+    // TODO: make work for subsystems
+    applyInitial(vel: Vector3) {
+        if (!this.enabled) return;
+        if (this.system.worldspace === false) return;
+        if (this.mode === ParticleSystemInheritVelocityMode.Initial) {
+            const factor = this.curve.evaluate(Math.random(), Math.random());
+            this._temp.copy(this._velocity).multiplyScalar(factor);
+            vel.add(this._temp);
+        }
+    }
+    applyCurrent(vel: Vector3, t01: number, lerpFactor: number) {
+        if (!this.enabled) return;
+        if (this.system.worldspace === false) return;
+        if (this.mode === ParticleSystemInheritVelocityMode.Current) {
+            const factor = this.curve.evaluate(t01, lerpFactor);
+            this._temp.copy(this._velocity).multiplyScalar(factor);
+            vel.add(this._temp);
+        }
+    }
+}
+export class SizeBySpeedModule {
+    @serializable()
+    enabled!: boolean;
+    @serializable(Vector2)
+    range!: Vector2;
+    @serializable()
+    separateAxes!: boolean;
+    @serializable(MinMaxCurve)
+    size!: MinMaxCurve;
+    @serializable()
+    sizeMultiplier!: number;
+    @serializable(MinMaxCurve)
+    x!: MinMaxCurve;
+    @serializable()
+    xMultiplier!: number;
+    @serializable(MinMaxCurve)
+    y!: MinMaxCurve;
+    @serializable()
+    yMultiplier!: number;
+    @serializable(MinMaxCurve)
+    z!: MinMaxCurve;
+    @serializable()
+    zMultiplier!: number;
+    evaluate(vel: Vector3, _t01: number, lerpFactor: number, size: number): number {
+        const speed = vel.length();
+        const x = Mathf.remap(speed, this.range.x, this.range.y, 0, 1);
+        const factor = this.size.evaluate(x, lerpFactor);
+        // return size;
+        return size * factor;
+    }
+}
+export class ColorBySpeedModule {
+    @serializable()
+    enabled!: boolean;
+    @serializable(Vector2)
+    range!: Vector2;
+    @serializable(MinMaxGradient)
+    color!: MinMaxGradient;
+    evaluate(vel: Vector3, lerpFactor: number, color: Vector4) {
+        const speed = vel.length();
+        const x = Mathf.remap(speed, this.range.x, this.range.y, 0, 1);
+        const res = this.color.evaluate(x, lerpFactor);
+        color.x *= res.r;
+        color.y *= res.g;
+        color.z *= res.b;
+        color.w *= res.alpha;
+    }
 }

src/engine-components-experimental/networking/PlayerSync.ts CHANGED Viewed

@@ -3,11 +3,12 @@
 import { serializable } from "../../engine/engine_serialization_decorator";
 import { syncField } from "../../engine/engine_networking_auto"
 import { RoomEvents } from "../../engine/engine_networking";
-import { Object3D } from "three";
 import { syncDestroy } from "../../engine/engine_networking_instantiate";
-import { Vector3 } from "three";
+import { getParam } from "../../engine/engine_utils";
+import { Object3D } from "three";
+const debug = getParam("debugplayersync");
 export class PlayerSync extends Behaviour {
     @serializable(AssetReference)
@@ -28,13 +29,21 @@
     }
     private async onUserJoined(_model) {
+        if (debug) console.log("PlayerSync.onUserJoined", _model);
         const instance = await this.asset?.instantiateSynced({ parent: this.gameObject }, true);
         if (instance) {
-            let pl = GameObject.getComponent(instance as Object3D, PlayerState);
+            let pl = GameObject.getComponent(instance, PlayerState);
             if (pl) {
                 pl.owner = this.context.connection.connectionId!;
             }
+            else {
+                console.error("<strong>Failed finding PlayerState on " + this.asset?.uri + "</strong>: please make sure the asset has a PlayerState component!");
+                GameObject.destroySynced(instance);
+            }
         }
+        else{
+            console.warn("PlayerSync: failed instantiating asset!")
+        }
         // TODO: previously created instances are not re-created when re-joining room
         // const inRoom = this.context.connection.usersInRoom();
@@ -87,7 +96,7 @@
     }
     //** use to check if a component or gameobject is part of a instance owned by the local player */
-    static isLocalPlayer(obj: THREE.Object3D | Component): boolean {
+    static isLocalPlayer(obj: Object3D | Component): boolean {
         if (obj instanceof Object3D) {
             const state = GameObject.getComponentInParent(obj, PlayerState);
             return state?.isLocalPlayer ?? false;
@@ -129,6 +138,8 @@
     }
     private onOwnerChange(newOwner: string, oldOwner: string) {
+        if (debug) console.log("PlayerSync.onOwnerChange", this, "newOwner", newOwner, "oldOwner", oldOwner);
         // Remove from local owner array if it was local before
         const index = PlayerState._local.indexOf(this);
         if (index >= 0) PlayerState._local.splice(index, 1);
@@ -154,6 +165,7 @@
     awake(): void {
         PlayerState.all.push(this);
+        if(debug) console.log("Registered new PlayerState", this, PlayerState.all.length-1, PlayerState.all)
         this.context.connection.beginListen(RoomEvents.UserLeftRoom, (model: { userId: string }) => {
             // console.log("USER LEFT", model.userId)
@@ -177,6 +189,7 @@
     /** this tells the server that this client has been destroyed and the networking message for the instantiate will be removed */
     doDestroy() {
+        if (debug) console.log("PlayerSync.doDestroy → syncDestroy", this);
         syncDestroy(this.gameObject, this.context.connection);
     }

src/engine-components/ui/Utils.ts CHANGED Viewed

@@ -1,10 +1,10 @@
-import { FrontSide, DoubleSide, BackSide, TetrahedronGeometry } from "three"
+import { FrontSide, DoubleSide, Object3D } from "three"
 import { FrameEvent } from "../../engine/engine_setup";
 import { Behaviour } from "../Component";
 import { $shadowDomOwner, BaseUIComponent } from "./BaseUIComponent";
-export function tryGetUIComponent(obj: THREE.Object3D): BaseUIComponent | null {
+export function tryGetUIComponent(obj: Object3D): BaseUIComponent | null {
     const owner = obj[$shadowDomOwner];
     if (owner) {
         return owner;
@@ -15,7 +15,7 @@
     return null;
 }
-export function isUIObject(obj: THREE.Object3D) {
+export function isUIObject(obj: Object3D) {
     return obj["isUI"] === true || typeof obj[$shadowDomOwner] === "object";
 }
@@ -27,7 +27,7 @@
     receiveShadows?: boolean;
 }
-export function updateRenderSettings(shadowComponent: THREE.Object3D, settings: RenderSettings) {
+export function updateRenderSettings(shadowComponent: Object3D, settings: RenderSettings) {
     if (!shadowComponent) return;
     // const owner = shadowComponent[$shadowDomOwner];
     // if (!owner)

src/engine-components-experimental/api.ts ADDED Viewed

	@@ -0,0 +1,1 @@
1	+ export * from "./networking/PlayerSync";