@needle-tools/engine 3.4.0-alpha → 3.5.0-alpha

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@needle-tools/engine",
-    "version": "3.4.0-alpha",
+    "version": "3.5.0-alpha",
     "description": "Needle Engine is a web-based runtime for 3D apps. It runs on your machine for development with great integrations into editors like Unity or Blender - and can be deployed onto any device! It is flexible, extensible and networking and XR are built-in",
     "main": "dist/needle-engine.umd.cjs",
     "type": "module",

package/plugins/vite/config.js

@@ -53,4 +53,5 @@ export function tryLoadProjectConfig() {
 /** "assets" -> the directory name inside the output directory to put e.g. glb files into */
 export function builtAssetsDirectory(){
     return "assets";
-}
+}
+

package/plugins/vite/defines.js

@@ -0,0 +1,30 @@
+import { loadConfig } from "./config.js";
+
+/** used to pass config variables into vite.config.define
+ * for example "useRapier"
+ */
+export const needleDefines = (command, config, userSettings) => {
+
+    if (!userSettings) userSettings = {};
+
+    let useRapier = true;
+    if (config.useRapier === false || userSettings?.useRapier === false) useRapier = false;
+
+    return {
+        name: 'needle-defines',
+        enforce: 'pre',
+        config(config) {
+            if (useRapier && userSettings?.useRapier !== true) {
+                const meta = loadConfig();
+                if (meta?.useRapier === false) {
+                    useRapier = false;
+                }
+            }
+            console.log("UseRapier?", useRapier);
+            if (!config.define) config.define = {};
+            if (config.define.NEEDLE_USE_RAPIER === undefined) {
+                config.define.NEEDLE_USE_RAPIER = useRapier;
+            }
+        }
+    }
+}

package/plugins/vite/dependency-watcher.js

@@ -0,0 +1,173 @@
+import { exec, execSync } from 'child_process';
+import { existsSync, readFileSync, rmSync, statSync, writeFileSync } from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+const prefix = "[needle-dependency-watcher] ";
+function log(...msg) {
+    console.log(prefix, ...msg)
+}
+
+export const needleDependencyWatcher = (command, config, userSettings) => {
+    if (command === "build") return;
+
+    if (userSettings?.noDependencyWatcher === true) return;
+
+    const dir = process.cwd();
+    const packageJsonPath = path.join(dir, "package.json");
+    const viteCacheDir = path.join(dir, "node_modules", ".vite");
+
+    return {
+        name: 'needle-dependency-watcher',
+        configureServer(server) {
+            watchPackageJson(server, dir, packageJsonPath, viteCacheDir);
+            manageClients(server);
+        }
+    }
+}
+
+const currentClients = new Set();
+
+function manageClients(server) {
+    server.ws.on("connection", (socket) => {
+        currentClients.add(socket);
+        socket.on("close", () => {
+            currentClients.delete(socket);
+        });
+    });
+}
+
+function triggerReloadOnClients() {
+    log("Triggering reload on clients (todo)", currentClients.size)
+    // for (const client of currentClients) {
+    //     client.send(JSON.stringify({ type: "full-reload" }));
+    // }
+}
+
+
+let packageJsonStat;
+let lastEditTime;
+let packageJsonSize;
+let packageJson;
+let requireInstall = false;
+
+function watchPackageJson(server, projectDir, packageJsonPath, cachePath) {
+
+    if (!existsSync(packageJsonPath)) {
+        return;
+    }
+
+    log("Watching project", packageJsonPath)
+
+    lastRestartTime = 0;
+    packageJsonStat = statSync(packageJsonPath);
+    lastEditTime = packageJsonStat.mtime;
+    packageJsonSize = packageJsonStat.size;
+    packageJson = JSON.parse(readFileSync(packageJsonPath, "utf8"));
+
+    setTimeout(() => {
+        requireInstall = testIfInstallIsRequired(projectDir, packageJson);
+    }, 1000);
+
+    setInterval(() => {
+        packageJsonStat = statSync(packageJsonPath);
+        let modified = false;
+        if (packageJsonStat.mtime > lastEditTime) {
+            modified = true;
+        }
+        if (packageJsonStat.size !== packageJsonSize) {
+            modified = true;
+        }
+        if (modified || requireInstall) {
+            if (modified)
+                log("package.json has changed")
+
+            let requireReload = false;
+            if (!requireInstall) {
+                requireInstall = testIfInstallIsRequired(projectDir, packageJson);
+            }
+
+            // test if dependencies changed
+            let newPackageJson = JSON.parse(readFileSync(packageJsonPath, "utf8"));
+            for (const key in newPackageJson.dependencies) {
+                if (packageJson.dependencies[key] !== newPackageJson.dependencies[key] && newPackageJson.dependencies[key] !== undefined) {
+                    log("Dependency added", key)
+                    requireReload = true;
+                }
+            }
+
+
+            packageJsonSize = packageJsonStat.size;
+            lastEditTime = packageJsonStat.mtime;
+
+            if (requireReload || requireInstall) {
+                restart(server, projectDir, cachePath);
+            }
+        }
+    }, 1000);
+}
+
+function testIfInstallIsRequired(projectDir, packageJson) {
+
+    if (packageJson.dependencies) {
+        for (const key in packageJson.dependencies) {
+            // make sure the dependency is installed
+            const depPath = path.join(projectDir, "node_modules", key);
+            if (!existsSync(depPath)) {
+                log("Dependency not installed", key)
+                return true;
+            }
+        }
+    }
+    return false;
+}
+
+let isRunningRestart = false;
+let restartId = 0;
+let lastRestartTime = 0;
+
+async function restart(server, projectDir, cachePath) {
+
+    if (isRunningRestart) return;
+    isRunningRestart = true;
+
+    try {
+        const id = ++restartId;
+
+        if (requireInstall) {
+            requireInstall = false;
+            log("Installing dependencies...")
+            execSync("npm install", { cwd: projectDir, stdio: "inherit" });
+            requireInstall = false;
+        }
+
+        if (id !== restartId) return;
+        if (Date.now() - lastRestartTime < 1000) return;
+        log("Restarting server...")
+        lastRestartTime = Date.now();
+        requireInstall = false;
+        if (existsSync(cachePath))
+            rmSync(cachePath, { recursive: true, force: true });
+        triggerReloadOnClients();
+
+        // touch vite config to trigger reload
+        // const viteConfigPath = path.join(projectDir, "vite.config.js");
+        // if (existsSync(viteConfigPath)) {
+        //     const content = readFileSync(viteConfigPath, "utf8");
+        //     writeFileSync(viteConfigPath, content, "utf8");
+        //     isRunningRestart = false;
+        //     return;
+        // }
+
+        // check if server is running
+        if (server.httpServer.listening)
+            server.restart();
+        isRunningRestart = false;
+        console.log("-----------------------------------------------")
+    }
+    catch (err) {
+        log("Error restarting server", err);
+        isRunningRestart = false;
+    }
+
+}

package/plugins/vite/editor-connection.js

@@ -73,48 +73,46 @@ function createPlugin(isInstalled) {
         },
 
         configureServer(server) {
-            server.ws.on('connection', (socket, _request) => {
-
-                // console.log("Send editor sync status: " + isInstalled);
-                const reply = {
-                    type: "needle:editor-sync:installation-status",
-                    data: isInstalled
-                }
-                socket.send(JSON.stringify(reply));
-
-                socket.on('message', async (bytes) => {
-                    if (bytes?.length < 50) {
-                        const message = Buffer.from(bytes).toString();
-                        if (message === "needle:editor:restart") {
-                            console.log("Received request for a soft restart of the vite server... restarting in 1 second")
-                            setTimeout(() => {
+            try 
+            {
+                server.ws.on('connection', (socket, _request) => {
+    
+                    // console.log("Send editor sync status: " + isInstalled);
+                    const reply = {
+                        type: "needle:editor-sync:installation-status",
+                        data: isInstalled
+                    }
+                    socket.send(JSON.stringify(reply));
+    
+                    socket.on('message', async (bytes) => {
+                        if (bytes?.length < 50) {
+                            const message = Buffer.from(bytes).toString();
+                            if (message === "needle:editor:restart") {
+                                console.log("Received request for a soft restart of the vite server... ")
                                 // This just restarts the vite server
                                 server.restart();
-                                // TODO: restart isnt recommended right now because e.g. Unity doesnt properly find the new process to display it in the progress bar
-                                // spawn(process.argv.shift(), process.argv, {
-                                //     cwd: process.cwd(),
-                                //     detached: true,
-                                //     stdio: "inherit"
-                                // });
-                                // process.exit();
-                            }, 1000);
-                        }
-                        else if (message === "needle:editor:stop") {
-                            process.exit();
-                        }
-                        else if (message === `{"type":"ping"}`) {
-                            socket.send(JSON.stringify({ type: "pong" }));
+                            }
+                            else if (message === "needle:editor:stop") {
+                                process.exit();
+                            }
+                            else if (message === `{"type":"ping"}`) {
+                                socket.send(JSON.stringify({ type: "pong" }));
+                            }
+                            else if (message === "needle:editor:editor-sync-enabled") {
+                                console.log("Editor sync enabled")
+                                editorSyncEnabled = true;
+                            }
+                            else if (message === "needle:editor:editor-sync-disabled") {
+                                editorSyncEnabled = false;
+                            }
                         }
-                        else if (message === "needle:editor:editor-sync-enabled") {
-                            console.log("Editor sync enabled")
-                            editorSyncEnabled = true;
-                        }
-                        else if (message === "needle:editor:editor-sync-disabled") {
-                            editorSyncEnabled = false;
-                        }
-                    }
-                })
-            });
+                    })
+                });
+            }
+            catch(err){
+                console.error("Error in needle-editor-connection")
+                console.error(err)
+            }
         }
 
     }

package/plugins/vite/index.js

@@ -1,3 +1,4 @@
+import { needleDefines } from "./defines.js";
 import { needleBuild } from "./build.js";
 import { needleMeta } from "./meta.js"
 import { needlePoster } from "./poster.js"
@@ -9,6 +10,7 @@ import { needleViteAlias } from "./alias.js";
 import { needleTransformCodegen } from "./transform-codegen.js";
 import { needleLicense } from "./license.js";
 import { needlePeerjs } from "./peer.js";
+import { needleDependencyWatcher } from "./dependency-watcher.js";
 
 export * from "./gzip.js";
 export * from "./config.js";
@@ -22,6 +24,7 @@ export const needlePlugins = async (command, config, userSettings) => {
     // ensure we have user settings initialized with defaults
     userSettings = { ...defaultUserSettings, ...userSettings }
     const array = [
+        needleDefines(command, config, userSettings),
         needleLicense(command, config, userSettings),
         needleViteAlias(command, config, userSettings),
         needleMeta(command, config, userSettings),
@@ -31,7 +34,8 @@ export const needlePlugins = async (command, config, userSettings) => {
         needleCopyFiles(command, config, userSettings),
         needleTransformCodegen(command, config, userSettings),
         needleDrop(command, config, userSettings),
-        needlePeerjs(command, config, userSettings)
+        needlePeerjs(command, config, userSettings),
+        needleDependencyWatcher(command, config, userSettings)
     ];
     array.push(await editorConnection(command, config, userSettings, array));
     return array;

package/plugins/vite/reload.js

@@ -14,6 +14,8 @@ let assetsDirectory = "";
 export const needleReload = (command, config, userSettings) => {
     if (command === "build") return;
 
+    if (userSettings?.noReload === true) return;
+
 
     let isUpdatingConfig = false;
     const updateConfig = async () => {
@@ -45,7 +47,7 @@ export const needleReload = (command, config, userSettings) => {
             else if (!config.server.watch.ignored) config.server.watch.ignored = [];
             for (const pattern of ignorePatterns)
                 config.server.watch.ignored.push(pattern);
-            if(config?.debug === true || userSettings?.debug === true)
+            if (config?.debug === true || userSettings?.debug === true)
                 setTimeout(() => console.log("Updated server ignore patterns: ", config.server.watch.ignored), 100);
         },
         handleHotUpdate(args) {

package/src/engine/api.ts

@@ -27,6 +27,7 @@ export * from "./engine_patcher"
 export * from "./engine_playerview"
 export * from "./engine_physics"
 export * from "./engine_physics.types"
+export * from "./engine_physics_rapier"
 export * from "./engine_scenelighting"
 export * from "./engine_input";
 export * from "./engine_math";

package/src/engine/codegen/register_types.js

@@ -1,5 +1,5 @@
 import { TypeStore } from "./../engine_typestore"
-
+
 // Import types
 import { __Ignore } from "../../engine-components/codegen/components";
 import { ActionBuilder } from "../../engine-components/export/usdz/extensions/behavior/BehavioursBuilder";
@@ -214,7 +214,7 @@ import { XRGrabModel } from "../../engine-components/webxr/WebXRGrabRendering";
 import { XRGrabRendering } from "../../engine-components/webxr/WebXRGrabRendering";
 import { XRRig } from "../../engine-components/webxr/WebXRRig";
 import { XRState } from "../../engine-components/XRFlag";
-
+
 // Register types
 TypeStore.add("__Ignore", __Ignore);
 TypeStore.add("ActionBuilder", ActionBuilder);

package/src/engine/engine_context.ts

@@ -1,7 +1,8 @@
-import { BufferGeometry, Camera, Clock, Color, DepthTexture, Group, 
-	Material, NearestFilter, NoToneMapping, Object3D, PCFSoftShadowMap, 
-	PerspectiveCamera, RGBAFormat, Scene, sRGBEncoding, 
-	Texture, WebGLRenderer, WebGLRenderTarget 
+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';
@@ -27,6 +28,7 @@ import { PlayerViewManager } from './engine_playerview';
 import { CoroutineData, ICamera, IComponent, IContext, ILight } from "./engine_types"
 import { destroy, foreachComponent } from './engine_gameobject';
 import { ContextEvent, ContextRegistry } from './engine_context_registry';
+import { delay } from './engine_utils';
 // import { createCameraWithOrbitControl } from '../engine-components/CameraUtils';
 
 
@@ -251,8 +253,8 @@ export class Context implements IContext {
 			this.isManagedExternally = true;
 		}
 		else {
-			this.renderer = new WebGLRenderer({ 
-				antialias: true 
+			this.renderer = new WebGLRenderer({
+				antialias: true
 			});
 
 			// some tonemapping other than "NONE" is required for adjusting exposure with EXR environments
@@ -346,12 +348,13 @@ export class Context implements IContext {
 			camera.updateProjectionMatrix();
 	}
 
-	onCreate(buildScene?: (context: Context, loadingOptions?: LoadingOptions) => Promise<void>, opts?: LoadingOptions) {
+	async onCreate(buildScene?: (context: Context, loadingOptions?: LoadingOptions) => Promise<void>, opts?: LoadingOptions) {
 		if (this._isCreated) {
 			console.warn("Context already created");
 			return null;
 		}
 		this._isCreated = true;
+        await delay(1);
 		return this.internalOnCreate(buildScene, opts);
 	}
 
@@ -498,8 +501,8 @@ export class Context implements IContext {
 
 	private async internalOnCreate(buildScene?: (context: Context, opts?: LoadingOptions) => Promise<void>, opts?: LoadingOptions) {
 
-		// TODO: we could configure if we need physics
-		await this.physics.createWorld();
+		Context.Current = this;
+		await ContextRegistry.dispatchCallback(ContextEvent.ContextCreationStart, this);
 
 		// load and create scene
 		let prepare_succeeded = true;
@@ -512,7 +515,7 @@ export class Context implements IContext {
 			console.error(err);
 			prepare_succeeded = false;
 		}
-		if (!prepare_succeeded) return;
+		if (!prepare_succeeded) return false;
 
 		this.internalOnUpdateVisible();
 
@@ -523,6 +526,9 @@ export class Context implements IContext {
 
 		Context.Current = this;
 
+		// TODO: we could configure if we need physics
+		// await this.physics.engine?.initialize();
+
 		// Setup
 		Context.Current = this;
 		for (let i = 0; i < this.new_scripts.length; i++) {
@@ -609,13 +615,13 @@ export class Context implements IContext {
 		if (debug)
 			logHierarchy(this.scene, true);
 
-		ContextRegistry.dispatchCallback(ContextEvent.ContextCreated, this);
+		return ContextRegistry.dispatchCallback(ContextEvent.ContextCreated, this);
 	}
 
 	private _accumulatedTime = 0;
 	private _framerateClock = new Clock();
 
-	private render(_, frame : XRFrame) {
+	private render(_, frame: XRFrame) {
 		this._xrFrame = frame;
 
 		this._currentFrameEvent = FrameEvent.Undefined;
@@ -627,7 +633,7 @@ export class Context implements IContext {
 			}
 			this._accumulatedTime = 0;
 		}
-		
+
 		this._stats?.begin();
 
 		Context.Current = this;
@@ -696,16 +702,19 @@ export class Context implements IContext {
 		this.executeCoroutines(FrameEvent.LateUpdate);
 		if (this.onHandlePaused()) return;
 
-		const physicsSteps = 1;
-		const dt = this.time.deltaTime / physicsSteps;
-		for (let i = 0; i < physicsSteps; i++) {
-			this._currentFrameEvent = FrameEvent.PrePhysicsStep;
-			this.executeCoroutines(FrameEvent.PrePhysicsStep);
-			this.physics.step(dt);
-			this._currentFrameEvent = FrameEvent.PostPhysicsStep;
-			this.executeCoroutines(FrameEvent.PostPhysicsStep);
+		if (this.physics.engine) {
+			const physicsSteps = 1;
+			const dt = this.time.deltaTime / physicsSteps;
+			for (let i = 0; i < physicsSteps; i++) {
+				this._currentFrameEvent = FrameEvent.PrePhysicsStep;
+				this.executeCoroutines(FrameEvent.PrePhysicsStep);
+				this.physics.engine.step(dt);
+				this._currentFrameEvent = FrameEvent.PostPhysicsStep;
+				this.executeCoroutines(FrameEvent.PostPhysicsStep);
+			}
+			this.physics.engine.postStep();
 		}
-		this.physics.postStep();
+		
 		if (this.onHandlePaused()) return;
 
 		if (this.isVisibleToUser) {
@@ -781,7 +790,7 @@ export class Context implements IContext {
 		this.renderRequiredTextures();
 		// if (camera === this.mainCameraComponent?.cam) {
 		// 	if (this.mainCameraComponent.activeTexture) {
-				
+
 		// 	}
 		// }
 		if (this.composer && !this.isInXR) {

package/src/engine/engine_context_registry.ts

@@ -1,8 +1,10 @@
-import { IContext } from "./engine_types";
+import { IComponent, IContext } from "./engine_types";
 
 export enum ContextEvent {
     /** called when the context is registered to the registry, the context is not fully initialized at this point */
     ContextRegistered = "ContextRegistered",
+    /** called before the first glb is loaded, can be used to initialize physics engine, is awaited */
+    ContextCreationStart = "ContextCreationStart",
     ContextCreated = "ContextCreated",
     ContextDestroyed = "ContextDestroyed",
     MissingCamera = "MissingCamera",
@@ -13,11 +15,11 @@ export type ContextEventArgs = {
     context: IContext;
 }
 
-export type ContextCallback = (evt: ContextEventArgs) => void;
+export type ContextCallback = (evt: ContextEventArgs) => void | Promise<any> | IComponent;
 
 export class ContextRegistry {
 
-    static get Current(): IContext{
+    static get Current(): IContext {
         return globalThis["NeedleEngine.Context.Current"]
     }
     static set Current(ctx: IContext) {
@@ -51,10 +53,15 @@ export class ContextRegistry {
         this._callbacks[evt].splice(index, 1);
     }
 
-    static dispatchCallback(evt: ContextEvent, context:IContext) {
-        if (!this._callbacks[evt]) return;
+    static dispatchCallback(evt: ContextEvent, context: IContext) {
+        if (!this._callbacks[evt]) return true;
         const args = { event: evt, context }
-        this._callbacks[evt].forEach(cb => cb(args));
+        const promises = new Array<Promise<any>>();
+        this._callbacks[evt].forEach(cb => {
+            const res = cb(args)
+            if (res instanceof Promise) promises.push(res);
+        });
+        return Promise.all(promises);
     }
 
     static addContextCreatedCallback(callback: ContextCallback) {

package/src/engine/engine_element.ts

@@ -164,6 +164,7 @@ export class NeedleEngineHTMLElement extends HTMLElement implements INeedleEngin
             return;
         }
 
+
         this._previousSrc = src;
 
         // Set the source attribute so codegen doesnt try to re-assign it again and we communicate to the outside which root files are being loaded
@@ -221,7 +222,7 @@ export class NeedleEngineHTMLElement extends HTMLElement implements INeedleEngin
                     if (!url.includes(".glb") && !url.includes(".gltf")) {
                         const warning = `Needle Engine: found suspicious src "${url}"`;
                         console.warn(warning);
-                        if(isLocalNetwork()) showBalloonWarning(warning);
+                        if (isLocalNetwork()) showBalloonWarning(warning);
                     }
                     const fileName = getNameFromUrl(url);
                     const progress: LoadingProgressArgs = {

package/src/engine/engine_element_loading.ts

@@ -73,7 +73,7 @@ export class EngineLoadingView implements ILoadingViewHandler {
     }
 
     onLoadingBegin(message?: string) {
-        if (debug) console.log("Begin Loading")
+        if (debug) console.warn("Begin Loading")
         if (!this._loadingElement) {
             for (let i = 0; i < this._element.children.length; i++) {
                 const el = this._element.children[i] as HTMLElement;
@@ -98,9 +98,8 @@ export class EngineLoadingView implements ILoadingViewHandler {
     }
 
     onLoadingUpdate(progress: LoadingProgressArgs | ProgressEvent | number, message?: string) {
-        // if the element has no parent we want to add it
         if (!this._loadingElement?.parentElement) {
-            this.onLoadingBegin(message);
+            return;
         }
         // console.log(callback.name, callback.progress.loaded / callback.progress.total, callback.index + "/" + callback.count);
         let total01 = 0;

package/src/engine/engine_input.ts

@@ -2,7 +2,7 @@ import { Vector2 } from 'three';
 import { showBalloonMessage, showBalloonWarning } from './debug/debug';
 import { assign } from './engine_serialization_core';
 import { Context } from './engine_setup';
-import { Vec2 } from './engine_types';
+import { IInput, Vec2 } from './engine_types';
 import { getParam } from './engine_utils';
 
 const debug = getParam("debuginput");
@@ -52,7 +52,7 @@ export enum PointerType {
 //     }
 // }
 
-export class Input extends EventTarget {
+export class Input extends EventTarget implements IInput {
 
     _doubleClickTimeThreshold = .2;
     _longPressTimeThreshold = 1;