@needle-tools/engine 4.3.2-beta.3 → 4.3.2-beta.5

package/plugins/vite/asap.js

@@ -45,20 +45,6 @@ export const needleAsap = async (command, config, userSettings) => {
                 /** @type {import('vite').HtmlTagDescriptor[]} */
                 const tags = [];
 
-                if (logoSvg?.length) {
-                    tags.push({
-                        tag: 'link',
-                        attrs: {
-                            rel: "preload",
-                            fetchpriority: "high",
-                            as: "image",
-                            href: logoSvg,
-                            type: "image/svg+xml",
-                        }
-                    })
-                }
-
-
                 try {
                     generateGltfPreloadLinks(config, html, tags);
                 }
@@ -82,6 +68,20 @@ export const needleAsap = async (command, config, userSettings) => {
                     }
                 });
 
+                // we insert the logo late because the logo svg string is quite long
+                if (logoSvg?.length) {
+                    tags.push({
+                        tag: 'link',
+                        attrs: {
+                            rel: "preload",
+                            fetchpriority: "high",
+                            as: "image",
+                            href: logoSvg,
+                            type: "image/svg+xml",
+                        }
+                    })
+                }
+
                 return {
                     html,
                     tags
@@ -206,6 +206,18 @@ function generateGltfPreloadLinks(config, html, tags) {
                     if (match.done) break;
                     const value = match.value?.groups?.gltf;
                     if (value) {
+                        // if it's not a url we need to check if the file exists
+                        const isUrl = value.startsWith("http");
+                        if (!isUrl) {
+                            let filepath = value.split("?")[0];
+                            filepath = decodeURIComponent(filepath);
+                            const fullpath = path.join(process.cwd(), filepath);
+                            if (!existsSync(fullpath)) {
+                                console.warn(`[needle:asap] Could not insert head preload link: file not found at \"${filepath}\"`);
+                                continue;
+                            }
+                        }
+                        console.log(`[needle:asap] Insert head glTF preload link: ${value}`);
                         insertPreloadLink(tags, value, "model/gltf+json");
                     }
                 }

package/plugins/vite/dependency-watcher.js

@@ -161,7 +161,7 @@ function testIfInstallIsRequired(projectDir, packageJson) {
                     expectedVersion = value;
                 }
                 if (expectedVersion?.length > 0) {
-                    const isRange = expectedVersion.includes("^") || expectedVersion.includes(">") || expectedVersion.includes("<") || expectedVersion.includes("~");
+                    const isRange = expectedVersion.includes("x") || expectedVersion.includes("^") || expectedVersion.includes(">") || expectedVersion.includes("<") || expectedVersion.includes("~");
                     const isLatest = expectedVersion === "latest";
                     if (!isRange && !isLatest) {
                         const packageJsonPath = path.join(depPath, "package.json");

package/src/engine/engine_context.ts

@@ -189,6 +189,10 @@ export class Context implements IContext {
 		ContextRegistry.Current = context;
 	}
 
+	static get All(): Context[] {
+		return ContextRegistry.All as Context[];
+	}
+
 	/** The name of the context */
 	name: string;
 	/** An alias for the context */

package/src/engine/engine_context_registry.ts

@@ -1,5 +1,7 @@
 import { type IComponent, type IContext, type LoadedModel } from "./engine_types.js";
 
+const debug = typeof window !== undefined ? window.location.search.includes("debugcontext") : false;
+
 /** The various events that can be dispatched by a Needle Engine {@link IContext} instance
  */
 export enum ContextEvent {
@@ -62,6 +64,8 @@ export class ContextRegistry {
 
     /** @internal Internal use only */
     static register(ctx: IContext) {
+        if (this.Registered.indexOf(ctx) !== -1) return;
+        if (debug) console.warn("Registering context");
         this.Registered.push(ctx);
         this.dispatchCallback(ContextEvent.ContextRegistered, ctx);
     }
@@ -70,6 +74,7 @@ export class ContextRegistry {
     static unregister(ctx: IContext) {
         const index = this.Registered.indexOf(ctx);
         if (index === -1) return;
+        if (debug) console.warn("Unregistering context");
         this.Registered.splice(index, 1);
     }
 

package/src/engine/engine_utils_format.ts

@@ -61,7 +61,11 @@ export async function tryDetermineFileTypeFromURL(url: string, useExtension: boo
 
     // If the URL doesnt contain a filetype we need to check the header
     // This is the case for example if we load a file from a data url
-    const header = await fetch(url, {
+    const newUrl = new URL(url);
+    // Adding a URL parameter to avoid the brower to bust the full cache
+    // If we don't do this the file that might already be disc cached will be deleted from the cache
+    newUrl.searchParams.append("range", "true");
+    const header = await fetch(newUrl, {
         method: "GET",
         headers: {
             "range": "bytes=0-32"

package/src/engine-components/Skybox.ts

@@ -5,7 +5,7 @@ import { KTX2Loader } from "three/examples/jsm/loaders/KTX2Loader.js";
 import { RGBELoader } from 'three/examples/jsm/loaders/RGBELoader.js';
 
 import { disposeObjectResources, setDisposable } from "../engine/engine_assetdatabase.js";
-import { ContextRegistry } from "../engine/engine_context_registry.js";
+import { ContextEvent, ContextRegistry } from "../engine/engine_context_registry.js";
 import { registerObservableAttribute } from "../engine/engine_element_extras.js";
 import { syncField } from "../engine/engine_networking_auto.js";
 import { serializable } from "../engine/engine_serialization_decorator.js";
@@ -39,11 +39,11 @@ function createRemoteSkyboxComponent(context: IContext, url: string, skybox: boo
     return remote.setSkybox(url);
 }
 
-ContextRegistry.addContextCreatedCallback((args) => {
+const promises = new Array<Promise<any>>();
+ContextRegistry.registerCallback(ContextEvent.ContextCreationStart, (args) => {
     const context = args.context;
     const skyboxImage = context.domElement.getAttribute("skybox-image") || context.domElement.getAttribute("background-image");
     const environmentImage = context.domElement.getAttribute("environment-image");
-    const promises = new Array<Promise<any>>();
     if (skyboxImage) {
         if (debug)
             console.log("Creating remote skybox to load " + skyboxImage);
@@ -60,10 +60,11 @@ ContextRegistry.addContextCreatedCallback((args) => {
         const promise = createRemoteSkyboxComponent(context, environmentImage, false, true, "environment-image");
         promises.push(promise);
     }
-    if (promises.length > 0) {
-        return PromiseAllWithErrors(promises);
-    }
-    return Promise.resolve();
+});
+ContextRegistry.registerCallback(ContextEvent.ContextCreationStart, () => {
+    return Promise.all(promises).finally(() => {
+        promises.length = 0;
+    })
 });
 
 declare type SkyboxCacheEntry = { src: string, texture: Promise<Texture> };