@needle-tools/engine 2.24.0-pre → 2.25.0-pre

package/src/engine/engine_element_overlay.ts

@@ -1,3 +1,4 @@
+import { Context } from "./engine_setup";
 
 export const arContainerClassName = "ar";
 export const quitARClassName = "quit-ar";
@@ -17,15 +18,23 @@ export class AROverlayHandler {
     registeredCloseEventElements: Element[] = [];
 
     private _createdAROnlyElements: Array<any> = [];
+    private _reparentedObjects: Array<{ el: Element, previousParent: HTMLElement | null }> = [];
 
     requestEndAR() {
         this.onRequestedEndAR();
     }
 
-    onBegin(overlayContainer: HTMLElement, session: THREE.XRSession) {
+    onBegin(context: Context, overlayContainer: HTMLElement, session: THREE.XRSession) {
         this.currentSession = session;
         this.arContainer = overlayContainer;
-        if (!this.arContainer) return;
+
+        const arElements = context.domElement.querySelectorAll(`.${arContainerClassName}`);
+        arElements.forEach(el => {
+            if (!el) return;
+            if (el === this.arContainer) return;
+            this._reparentedObjects.push({ el: el, previousParent: el.parentElement });
+            this.arContainer?.appendChild(el);
+        });
 
         const quit_Elements = overlayContainer.getElementsByClassName(quitARClassName);
         if (!quit_Elements || quit_Elements.length <= 0) {
@@ -42,7 +51,7 @@ export class AROverlayHandler {
         }
     }
 
-    onEnd() {
+    onEnd(_context: Context) {
         // if (this.arContainer)
         // this.arContainer.classList.remove("ar-session-active");
         for (const created of this._createdAROnlyElements) {
@@ -50,6 +59,13 @@ export class AROverlayHandler {
                 created.remove();
             }
         }
+
+
+        for (const prev of this._reparentedObjects) {
+            const el = prev.el as HTMLElement;
+            prev.previousParent?.appendChild(el);
+        }
+        this._reparentedObjects.length = 0;
     }
 
     findOrCreateARContainer(element: HTMLElement): HTMLElement {

package/src/engine/engine_loaders.ts

@@ -3,20 +3,51 @@ import { Context } from "./engine_setup"
 import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'
 import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js';
 import { KTX2Loader } from 'three/examples/jsm/loaders/KTX2Loader.js';
+import { getParam } from "./engine_utils";
+
+const debug = getParam("debugdecoders");
 
 let dracoLoader: DRACOLoader;
 let ktx2Loader: KTX2Loader;
 
+export function setDracoDecoderPath(path: string | undefined) {
+    if (path !== undefined && typeof path === "string") {
+        if (!dracoLoader)
+            dracoLoader = new DRACOLoader();
+        if (debug) console.log("Setting draco decoder path to", path);
+        dracoLoader.setDecoderPath(path);
+    }
+}
+
+export function setDracoDecoderType(type: string | undefined) {
+    if (type !== undefined && typeof type === "string") {
+        if (!dracoLoader)
+            dracoLoader = new DRACOLoader();
+        if (debug) console.log("Setting draco decoder type to", type);
+        dracoLoader.setDecoderConfig({ type: type });
+    }
+}
+
+export function setKtx2TranscoderPath(path: string) {
+    if (path !== undefined && typeof path === "string") {
+        if (!ktx2Loader)
+            ktx2Loader = new KTX2Loader();
+        if (debug) console.log("Setting ktx2 transcoder path to", path);
+        ktx2Loader.setTranscoderPath(path);
+    }
+}
 
-export function addDracoAndKTX2Loaders(loader: GLTFLoader, context : Context) {
+export function addDracoAndKTX2Loaders(loader: GLTFLoader, context: Context) {
     if (!dracoLoader) {
         dracoLoader = new DRACOLoader();
         dracoLoader.setDecoderPath('./include/draco/');
         dracoLoader.setDecoderConfig({ type: 'js' });
+        if(debug) console.log("Setting draco decoder path to", './include/draco/');
     }
     if (!ktx2Loader) {
         ktx2Loader = new KTX2Loader();
         ktx2Loader.setTranscoderPath('./include/ktx2/');
+        if(debug) console.log("Setting ktx2 transcoder path to", './include/ktx2/');
         if (context.renderer)
             ktx2Loader.detectSupport(context.renderer);
     }

package/src/engine/engine_setup.ts

@@ -603,7 +603,8 @@ export class Context {
 			const evts = this.coroutines[evt];
 			for (let i = 0; i < evts.length; i++) {
 				const evt = evts[i];
-				if (!evt.comp || evt.comp.destroyed || !evt.main) {
+				const remove = !evt.comp || evt.comp.destroyed || !evt.main || evt.comp["enabled"] === false;
+				if (remove) {
 					evts.splice(i, 1);
 					--i;
 					continue;

package/src/engine/extensions/EXT_texture_exr.js

@@ -9,6 +9,7 @@ export class EXT_texture_exr {
 
 		this.parser = parser;
 		this.name = "EXT_texture_exr";
+		if(debug) console.log(parser);
 
 	}
 

package/src/engine-components/timeline/TimelineTracks.ts

@@ -161,20 +161,36 @@ export class AnimationTrackHandler extends TrackHandler {
             }
         }
 
-        if (!foundPositionTrack) {
-            const indexOfProperty = clip.tracks[0].name.lastIndexOf(".");
-            const trackName = clip.tracks[0].name.substring(0, indexOfProperty) + ".position";
-            const track = new THREE.VectorKeyframeTrack(trackName, [0, clip.duration], [0, 0, 0, 0, 0, 0]);
-            clip.tracks.push(track);
-            this.createPositionInterpolant(clip, clipModel, track);
-        }
 
-        if (!foundRotationTrack) {
-            const indexOfProperty = clip.tracks[0].name.lastIndexOf(".");
-            const trackName = clip.tracks[0].name.substring(0, indexOfProperty) + ".quaternion";
-            const track = new THREE.QuaternionKeyframeTrack(trackName, [0, clip.duration], [0, 0, 0, 1, 0, 0, 0, 1]);
-            clip.tracks.push(track);
-            this.createRotationInterpolant(clip, clipModel, track);
+        // ensure we always have a position and rotation track so we can apply offsets in interpolator
+        // TODO: this currently assumes that there is only one root always that has offsets so it only does create the interpolator for the first track which might be incorrect. In general it would probably be better if we would not create additional tracks but apply the offsets for these objects elsewhere!?
+
+        if (!foundPositionTrack || !foundRotationTrack) {
+            const root = this.mixer?.getRoot() as THREE.Object3D;
+            const track = clip.tracks[0];
+            const indexOfProperty = track.name.lastIndexOf(".");
+            const baseName = track.name.substring(0, indexOfProperty);
+            const objName = baseName.substring(baseName.lastIndexOf(".") + 1);
+            const targetObj = root.getObjectByName(objName);
+            if (targetObj) {
+                if (!foundPositionTrack) {
+                    const trackName = baseName + ".position";
+                    if (debug) console.warn("Create position track", objName, targetObj);
+                    // apply initial local position so it doesnt get flipped or otherwise changed
+                    const pos = targetObj.position;
+                    const track = new THREE.VectorKeyframeTrack(trackName, [0, clip.duration], [pos.x, pos.y, pos.z, pos.x, pos.y, pos.z]);
+                    clip.tracks.push(track);
+                    this.createPositionInterpolant(clip, clipModel, track);
+                }
+                else if(!foundRotationTrack){
+                    const trackName = clip.tracks[0].name.substring(0, indexOfProperty) + ".quaternion";
+                    if (debug) console.warn("Create quaternion track", objName, targetObj);
+                    const rot = targetObj.quaternion;
+                    const track = new THREE.QuaternionKeyframeTrack(trackName, [0, clip.duration], [rot.x, rot.y, rot.z, rot.w, rot.x, rot.y, rot.z, rot.w]);
+                    clip.tracks.push(track);
+                    this.createRotationInterpolant(clip, clipModel, track);
+                }
+            }
         }
     }
 

package/src/needle-engine.ts

@@ -36,4 +36,11 @@ for (const method of Object.getOwnPropertyNames(GameObject)) {
             Needle[method] = GameObject[method];
             break;
     }
-}
+}
+
+// make three accessible
+import * as THREE from "three";
+if(!globalThis["THREE"]) {
+    globalThis["THREE"] = THREE;
+}
+else console.warn("Threejs is already imported");