@needle-tools/engine 3.5.1-alpha → 3.5.2-alpha

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@needle-tools/engine",
-    "version": "3.5.1-alpha",
+    "version": "3.5.2-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/license.js

@@ -13,8 +13,8 @@ export const needleLicense = (command, config, userSettings) => {
             if (isNeedleEngineFile || isViteChunkFile) {
                 const needleConfig = await loadConfig();
                 if (needleConfig) {
-                    if (needleConfig.hasProLicense === true) {
-                        src = src.replace("NEEDLE_ENGINE_COMMERCIAL_USE_LICENSE = false;", "NEEDLE_ENGINE_COMMERCIAL_USE_LICENSE = " + needleConfig.hasProLicense + ";");
+                    if (typeof needleConfig.license === "string") {
+                        src = src.replace("const NEEDLE_ENGINE_LICENSE_TYPE: string = \"\";", "const NEEDLE_ENGINE_LICENSE_TYPE: string = \"" + needleConfig.license + "\";");
                         return { code: src, map: null }
                     }
                 }

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";
@@ -184,7 +184,6 @@ import { TriggerModel } from "../../engine-components/export/usdz/extensions/beh
 import { UIRaycastUtils } from "../../engine-components/ui/RaycastUtils";
 import { UIRootComponent } from "../../engine-components/ui/BaseUIComponent";
 import { UsageMarker } from "../../engine-components/Interactable";
-import { USDZBehaviours } from "../../engine-components/export/usdz/extensions/behavior/Behaviour";
 import { USDZExporter } from "../../engine-components/export/usdz/USDZExporter";
 import { USDZText } from "../../engine-components/export/usdz/extensions/USDZText";
 import { VariantAction } from "../../engine-components/export/usdz/extensions/behavior/Actions";
@@ -214,7 +213,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);
@@ -399,7 +398,6 @@ TypeStore.add("TriggerModel", TriggerModel);
 TypeStore.add("UIRaycastUtils", UIRaycastUtils);
 TypeStore.add("UIRootComponent", UIRootComponent);
 TypeStore.add("UsageMarker", UsageMarker);
-TypeStore.add("USDZBehaviours", USDZBehaviours);
 TypeStore.add("USDZExporter", USDZExporter);
 TypeStore.add("USDZText", USDZText);
 TypeStore.add("VariantAction", VariantAction);

package/src/engine/engine_element_loading.ts

@@ -3,7 +3,7 @@ import { Mathf } from "./engine_math";
 import { LoadingProgressArgs } from "./engine_setup";
 import { getParam } from "./engine_utils";
 import { logoSVG } from "./assets"
-import { hasProLicense } from "./engine_license";
+import { hasCommercialLicense, hasProLicense } from "./engine_license";
 
 const debug = getParam("debugloadingbar");
 const debugRendering = getParam("debugloadingbarrendering");
@@ -301,7 +301,7 @@ export class EngineLoadingView implements ILoadingViewHandler {
             }
         }
 
-        if (!hasLicense) {
+        if (!hasCommercialLicense()) {
             const nonCommercialContainer = document.createElement("div");
             nonCommercialContainer.style.paddingTop = ".6em";
             nonCommercialContainer.style.fontSize = ".8em";

package/src/engine/engine_license.ts

@@ -7,10 +7,28 @@ const debug = getParam("debuglicense");
 
 // This is modified by a bundler (e.g. vite)
 // Do not edit manually
-const NEEDLE_ENGINE_COMMERCIAL_USE_LICENSE = false;
+const NEEDLE_ENGINE_LICENSE_TYPE: string = "";
+if (debug) console.log("License Type: " + NEEDLE_ENGINE_LICENSE_TYPE)
 
 export function hasProLicense() {
-    return NEEDLE_ENGINE_COMMERCIAL_USE_LICENSE;
+    switch (NEEDLE_ENGINE_LICENSE_TYPE) {
+        case "pro":
+        case "enterprise":
+            return true;
+    };
+    return false;
+}
+
+export function hasIndieLicense() {
+    switch (NEEDLE_ENGINE_LICENSE_TYPE) {
+        case "indie":
+            return true;
+    }
+    return false;
+}
+
+export function hasCommercialLicense() {
+    return hasProLicense() || hasIndieLicense();
 }
 
 
@@ -52,7 +70,8 @@ function insertNonCommercialUseHint(ctx: IContext) {
         }
     }, 100);
 
-    logNonCommercialUse();
+    if (!hasCommercialLicense())
+        logNonCommercialUse();
 
     let svg = `<img class="logo" src="${logoSVG}" style="width: 40px; height: 40px; margin-right: 2px; vertical-align: middle; margin-bottom: 2px;"/>`;
     const logoElement = document.createElement("div");
@@ -66,7 +85,9 @@ function insertNonCommercialUseHint(ctx: IContext) {
     //     textElement.innerHTML = "Needle Engine<br/><span class=\"non-commercial\">Non Commercial</span>";
     licenseElement.appendChild(textElement);
 
-    licenseElement.title = "Needle Engine — non commercial version";
+    licenseElement.title = "Needle Engine";
+    if (!hasCommercialLicense())
+        licenseElement.title += " non commercial version";
     licenseElement.addEventListener("click", () => {
         globalThis.open("https://needle.tools", "_blank");
     });

package/src/engine-components/SceneSwitcher.ts

@@ -56,11 +56,27 @@ export class SceneSwitcher extends Behaviour {
     @serializable()
     useSceneLighting: boolean = true;
 
+    /** how many scenes after the currently active scene should be preloaded */
+    @serializable()
+    preloadNext: number = 1;
+
+    /** how many scenes before the currently active scene should be preloaded */
+    @serializable()
+    preloadPrevious: number = 1;
+
+    /** how many scenes can be loaded in parallel */
+    @serializable()
+    preloadConcurrent: number = 2;
+
+
+    get currentIndex(): number { return this._currentIndex; }
 
     private _currentIndex: number = -1;
     private _currentScene: AssetReference | undefined = undefined;
     private _engineElementOverserver: MutationObserver | undefined = undefined;
 
+    private _preloadScheduler?: PreLoadScheduler;
+
     async start() {
         if (this._currentIndex === -1 && !await this.tryLoadFromQueryParam()) {
             const value = this.context.domElement.getAttribute(ENGINE_ELEMENT_SCENE_ATTRIBUTE_NAME);
@@ -100,6 +116,13 @@ export class SceneSwitcher extends Behaviour {
         this._engineElementOverserver.observe(this.context.domElement, {
             attributes: true
         });
+
+        if (!this._preloadScheduler)
+            this._preloadScheduler = new PreLoadScheduler(this);
+        this._preloadScheduler.maxLoadAhead = this.preloadNext;
+        this._preloadScheduler.maxLoadBehind = this.preloadPrevious;
+        this._preloadScheduler.maxConcurrent = this.preloadConcurrent;
+        this._preloadScheduler.begin();
     }
 
     onDisable(): void {
@@ -107,6 +130,7 @@ export class SceneSwitcher extends Behaviour {
         this.context.input.removeEventListener(InputEvents.KeyDown, this.onKeyDown);
         this.context.input.removeEventListener(InputEvents.PointerMove, this.onPointerMove);
         this.context.input.removeEventListener(InputEvents.PointerUp, this.onPointerUp);
+        this._preloadScheduler?.stop();
     }
 
     private onPopState = async (_state: PopStateEvent) => {
@@ -189,7 +213,7 @@ export class SceneSwitcher extends Behaviour {
     select(index: number | string): Promise<boolean> {
         if (debug) console.log("select", index);
 
-        if(typeof index === "object"){
+        if (typeof index === "object") {
             // If a user tries to reference a scene object in a UnityEvent and invoke select(obj) 
             // Then the object will be serialized as a object { guid : ... } or with the index json pointer
             // This case is not supported right now. Object references in the editor must not be scene references
@@ -271,6 +295,15 @@ export class SceneSwitcher extends Behaviour {
         return false;
     }
 
+    preload(index: number) {
+        if (index >= 0 && index < this.scenes.length) {
+            const scene = this.scenes[index];
+            if(scene instanceof AssetReference) 
+                return scene.preload();
+        }
+        return couldNotLoadScenePromise;
+    }
+
     private tryLoadFromQueryParam() {
         if (!this.queryParameterName?.length) return couldNotLoadScenePromise;
         // try restore the scene from the url
@@ -308,3 +341,105 @@ export class SceneSwitcher extends Behaviour {
         return couldNotLoadScenePromise;
     }
 }
+
+
+
+
+class PreLoadScheduler {
+    maxLoadAhead: number;
+    maxLoadBehind: number;
+    maxConcurrent: number;
+
+    private _isRunning: boolean = false;
+    private _rooms: SceneSwitcher;
+    private _roomTasks: LoadTask[] = [];
+    private _maxConcurrentLoads: number = 1;
+
+    constructor(rooms: SceneSwitcher, ahead: number = 1, behind: number = 1, maxConcurrent: number = 2) {
+        this._rooms = rooms;
+        this.maxLoadAhead = ahead;
+        this.maxLoadBehind = behind;
+        this.maxConcurrent = maxConcurrent;
+    }
+
+    begin() {
+        if (this._isRunning) return;
+        if (debug) console.log("Preload begin")
+        this._isRunning = true;
+        let lastRoom: number = -1;
+        let searchDistance: number;
+        let searchCall: number;
+        const array = this._rooms.scenes;
+        let interval = setInterval(() => {
+            if (this.allLoaded()) {
+                if (debug)
+                    console.log("All scenes loaded");
+                this.stop();
+            }
+            if (!this._isRunning) {
+                clearInterval(interval);
+                return;
+            }
+            if (this.canLoadNewScene() === false) return;
+            if (lastRoom !== this._rooms.currentIndex) {
+                lastRoom = this._rooms.currentIndex;
+                searchCall = 0;
+                searchDistance = 0;
+            }
+            const searchForward = searchCall % 2 === 0;
+            if (searchForward) searchDistance += 1;
+            searchCall += 1;
+            const maxSearchDistance = searchForward ? this.maxLoadAhead : this.maxLoadBehind;
+            if (searchDistance > maxSearchDistance) return;
+            let roomIndex = searchForward ? lastRoom + searchDistance : lastRoom - searchDistance;
+            if (roomIndex < 0) return;
+            // if (roomIndex < 0) roomIndex = array.length + roomIndex;
+            if (roomIndex < 0 || roomIndex >= array.length) return;
+            const scene = array[roomIndex];
+            new LoadTask(roomIndex, scene, this._roomTasks);
+        }, 200);
+    }
+
+    stop() {
+        this._isRunning = false;
+    }
+
+    canLoadNewScene(): boolean {
+        return this._roomTasks.length < this._maxConcurrentLoads;
+    }
+
+    allLoaded(): boolean {
+        for (const room of this._rooms.scenes) {
+            if (room.isLoaded() === false) return false;
+        }
+        return true;
+    }
+}
+
+class LoadTask {
+
+    index: number;
+    asset: AssetReference;
+    tasks: LoadTask[];
+
+    constructor(index: number, asset: AssetReference, tasks: LoadTask[]) {
+        this.index = index;
+        this.asset = asset;
+        this.tasks = tasks;
+        tasks.push(this);
+        this.awaitLoading();
+    }
+
+    private async awaitLoading() {
+        if (!this.asset.isLoaded()) {
+            if (debug)
+                console.log("Preload start: " + this.asset.uri, this.index);
+            await this.asset.preload();
+            if (debug)
+                console.log("Preload finished: " + this.asset.uri, this.index);
+        }
+
+        const i = this.tasks.indexOf(this);
+        if (i >= 0) this.tasks.splice(i, 1);
+    }
+}

package/src/engine-components/codegen/components.ts

@@ -179,7 +179,6 @@ export { TriggerModel } from "../export/usdz/extensions/behavior/BehavioursBuild
 export { UIRaycastUtils } from "../ui/RaycastUtils";
 export { UIRootComponent } from "../ui/BaseUIComponent";
 export { UsageMarker } from "../Interactable";
-export { USDZBehaviours } from "../export/usdz/extensions/behavior/Behaviour";
 export { USDZExporter } from "../export/usdz/USDZExporter";
 export { USDZText } from "../export/usdz/extensions/USDZText";
 export { VariantAction } from "../export/usdz/extensions/behavior/Actions";

package/src/engine-components/export/usdz/ThreeUSDZExporter.ts

@@ -48,7 +48,6 @@ class USDObject {
 	parent: USDObject | null;
 	children: Array<USDObject | null> = [];
 	_eventListeners: {};
-	mesh: any;
 
 	static createEmptyParent( object ) {
 
@@ -92,7 +91,7 @@ class USDObject {
 
 	clone() {
 
-		const clone = new USDObject( MathUtils.generateUUID(), this.name, this.matrix, this.mesh, this.material );
+		const clone = new USDObject( MathUtils.generateUUID(), this.name, this.matrix, this.geometry, this.material );
 		clone.isDynamic = this.isDynamic;
 		return clone;
 
@@ -383,9 +382,20 @@ class USDZExporterContext {
 
 }
 
+/**[documentation](https://developer.apple.com/documentation/arkit/usdz_schemas_for_ar/preliminary_anchoringapi/preliminary_anchoring_type) */
+export type Anchoring = "plane" | "image" | "face" | "none"
+/**[documentation](https://developer.apple.com/documentation/arkit/usdz_schemas_for_ar/preliminary_anchoringapi/preliminary_planeanchoring_alignment) */
+export type Alignment = "horizontal" | "vertical" | "any";
+
 class USDZExporterOptions {
-	ar: { anchoring: { type: string } } = { anchoring: { type: 'plane' } };
-	planeAnchoring: { alignment: string } = { alignment: 'horizontal' };
+	ar: {
+		anchoring: { type: Anchoring },
+		planeAnchoring: { alignment: Alignment },
+	} = { 
+		anchoring: { type: 'plane' },
+		planeAnchoring: { alignment: 'horizontal' }
+	};
+	quickLookCompatible: boolean = false;
 	extensions: any[] = [];
 }
 
@@ -594,7 +604,7 @@ function parseDocument( context: USDZExporterContext ) {
 
 	writer.appendLine( `token preliminary:anchoring:type = "${context.exporter.sceneAnchoringOptions.ar.anchoring.type}"` );
 	if (context.exporter.sceneAnchoringOptions.ar.anchoring.type === 'plane')
-		writer.appendLine( `token preliminary:planeAnchoring:alignment = "${context.exporter.sceneAnchoringOptions.planeAnchoring.alignment}"` );
+		writer.appendLine( `token preliminary:planeAnchoring:alignment = "${context.exporter.sceneAnchoringOptions.ar.planeAnchoring.alignment}"` );
 	// bit hacky as we don't have a callback here yet. Relies on the fact that the image is named identical in the ImageTracking extension.
 	if (context.exporter.sceneAnchoringOptions.ar.anchoring.type === 'image')
 		writer.appendLine( `rel preliminary:imageAnchoring:referenceImage = </${context.document.name}/Scenes/Scene/AnchoringReferenceImage>` );
@@ -1076,7 +1086,7 @@ function buildMaterial( material: MeshStandardMaterial, textures ) {
 	const pad = '            ';
 	const inputs: Array<string> = [];
 	const samplers: Array<string> = [];
-	const exportForQuickLook = true;
+	const exportForQuickLook = false;
 
 	function buildTexture( texture, mapType, color: Color | undefined = undefined, opacity: number | undefined = undefined ) {
 
@@ -1088,6 +1098,11 @@ function buildMaterial( material: MeshStandardMaterial, textures ) {
 
 		const repeat = texture.repeat.clone();
 		const offset = texture.offset.clone();
+		const rotation = texture.rotation;
+
+		// rotation is around the wrong point. after rotation we need to shift offset again so that we're rotating around the right spot
+		let xRotationOffset = Math.sin(rotation);
+		let yRotationOffset = Math.cos(rotation);
 
 		// texture coordinates start in the opposite corner, need to correct
 		offset.y = 1 - offset.y - repeat.y;
@@ -1096,15 +1111,28 @@ function buildMaterial( material: MeshStandardMaterial, textures ) {
 		// Apple Feedback: 	FB10036297 and FB11442287
 		if ( exportForQuickLook ) {
 
+			// This is NOT correct yet in QuickLook, but comes close for a range of models.
+			// It becomes more incorrect the bigger the offset is
+
 			offset.x = offset.x / repeat.x;
 			offset.y = offset.y / repeat.y;
 
+			offset.x += xRotationOffset / repeat.x;
+			offset.y += yRotationOffset - 1;
+		}
+
+		else {
+
+			// results match glTF results exactly. verified correct in usdview.
+			offset.x += xRotationOffset * repeat.x;
+			offset.y += (1 - yRotationOffset) * repeat.y;
+
 		}
 
 		textures[ id ] = texture;
 		const uvReader = mapType == 'occlusion' ? 'uvReader_st2' : 'uvReader_st';
 
-		const needsTextureTransform = ( repeat.x != 1 || repeat.y != 1 || offset.x != 0 || offset.y != 0 );
+		const needsTextureTransform = ( repeat.x != 1 || repeat.y != 1 || offset.x != 0 || offset.y != 0 || rotation != 0 );
 		const textureTransformInput = `</Materials/Material_${material.id}/${uvReader}.outputs:result>`;
 		const textureTransformOutput = `</Materials/Material_${material.id}/Transform2d_${mapType}.outputs:result>`;
 
@@ -1123,6 +1151,7 @@ function buildMaterial( material: MeshStandardMaterial, textures ) {
             float2 inputs:in.connect = ${textureTransformInput}
             float2 inputs:scale = ${buildVector2( repeat )}
             float2 inputs:translation = ${buildVector2( offset )}
+			float inputs:rotation = ${(rotation / Math.PI * 180).toFixed( PRECISION )}
             float2 outputs:result
         }
 		` : '' }

package/src/engine-components/export/usdz/USDZExporter.ts

@@ -13,6 +13,7 @@ import { showBalloonMessage, showBalloonWarning } from "../../../engine/debug/de
 import { Context } from "../../../engine/engine_setup";
 import { WebARSessionRoot } from "../../webxr/WebARSessionRoot";
 import { hasProLicense } from "../../../engine/engine_license";
+import { BehaviorExtension } from "./extensions/behavior/Behaviour";
 
 const debug = getParam("debugusdz");
 
@@ -51,6 +52,9 @@ export class USDZExporter extends Behaviour {
     @serializable()
     planeAnchoringAlignment: "horizontal" | "vertical" | "any" = "horizontal";
 
+    @serializable()
+    interactive: boolean = true;
+
     extensions: IUSDExporterExtension[] = [];
 
     private link!: HTMLAnchorElement;
@@ -84,9 +88,11 @@ export class USDZExporter extends Behaviour {
             this.objectToExport = this.gameObject;
         if (!this.objectToExport?.children?.length && !(this.objectToExport as Mesh)?.isMesh)
             this.objectToExport = this.context.scene;
-    }
-
 
+        if (this.interactive) {
+            this.extensions.push(new BehaviorExtension());
+        }
+    }
 
     onEnable() {
         const ios = isiOS()
@@ -157,12 +163,13 @@ export class USDZExporter extends Behaviour {
             ar: {
                 anchoring: {
                     type: this.anchoringType,
-                }
-            },
-            planeAnchoring: {
-                alignment: this.planeAnchoringAlignment,
+                },
+                planeAnchoring: {
+                    alignment: this.planeAnchoringAlignment,
+                },
             },
-            extensions: extensions
+            extensions: extensions,
+            quickLookCompatible: true,
         });
         const blob = new Blob([arraybuffer], { type: 'application/octet-stream' });
 

package/src/engine-components/export/usdz/extensions/behavior/Behaviour.ts

@@ -1,9 +1,8 @@
-import { Behaviour, GameObject } from "../../../../Component";
-import { USDZExporter } from "../../USDZExporter";
+import { GameObject } from "../../../../Component";
+import { IContext } from "../../../../../engine/engine_types";
 import { IUSDExporterExtension } from "../../Extension";
 import { USDObject, USDWriter } from "../../ThreeUSDZExporter";
 import { BehaviorModel } from "./BehavioursBuilder";
-import { IContext } from "../../../../../engine/engine_types";
 
 export interface UsdzBehaviour {
     createBehaviours?(ext: BehaviorExtension, model: USDObject, context: IContext): void;
@@ -11,15 +10,6 @@ export interface UsdzBehaviour {
     afterCreateDocument?(ext: BehaviorExtension, context: IContext): void;
 }
 
-export class USDZBehaviours extends Behaviour {
-    start() {
-        const exporter = GameObject.findObjectOfType(USDZExporter);
-        if (exporter) {
-            exporter.extensions.push(new BehaviorExtension());
-        }
-    }
-}
-
 export class BehaviorExtension implements IUSDExporterExtension {
 
     get extensionName(): string {
@@ -40,8 +30,8 @@ export class BehaviorExtension implements IUSDExporterExtension {
             GameObject.foreachComponent(e, (comp) => {
                 const c = comp as unknown as UsdzBehaviour;
                 if (
-                    typeof c.createBehaviours === "function" || 
-                    typeof c.beforeCreateDocument === "function" || 
+                    typeof c.createBehaviours === "function" ||
+                    typeof c.beforeCreateDocument === "function" ||
                     typeof c.afterCreateDocument === "function"
                 ) {
                     this.behaviourComponents.push(c);
@@ -66,7 +56,7 @@ export class BehaviorExtension implements IUSDExporterExtension {
         this.behaviourComponents.length = 0;
     }
 
-    onAfterHierarchy(context, writer : USDWriter) {
+    onAfterHierarchy(context, writer: USDWriter) {
         if (this.behaviours?.length) {
 
             // this.combineBehavioursWithSameTapActions();

package/src/engine-components/export/usdz/extensions/behavior/BehaviourComponents.ts

@@ -7,7 +7,7 @@ import { RegisteredAnimationInfo, UsdzAnimation } from "../Animation";
 import { getWorldPosition, getWorldQuaternion, getWorldScale, setWorldPosition, setWorldQuaternion, setWorldScale } from "../../../../../engine/engine_three_utils";
 
 import { Object3D, Material, Vector3, Quaternion, AnimationAction } from "three";
-import { USDObject } from "../../ThreeUSDZExporter";
+import { USDDocument, USDObject } from "../../ThreeUSDZExporter";
 
 import { BehaviorExtension, UsdzBehaviour } from "./Behaviour";
 import { ActionBuilder, ActionModel, BehaviorModel, IBehaviorElement, MotionType, Space, TriggerBuilder } from "./BehavioursBuilder";
@@ -44,7 +44,7 @@ export class ChangeTransformOnClick extends Behaviour implements IPointerClickHa
 
         const thisScale = getWorldScale(this.object).clone();
         const targetScale = getWorldScale(this.target).clone();
-        
+
         const dist = thisPos.distanceTo(targetPos);
         const rotDist = thisRot.angleTo(targetRot);
         const scaleDist = thisScale.distanceTo(targetScale);
@@ -63,10 +63,10 @@ export class ChangeTransformOnClick extends Behaviour implements IPointerClickHa
 
             t01 += this.context.time.deltaTime / this.duration;
             if (t01 > 1) t01 = 1;
-            
+
             // apply ease-in-out
             // https://easings.net/
-            eased =  t01 < 0.5 ? 4 * t01 * t01 * t01 : 1 - Math.pow(-2 * t01 + 2, 3) / 2;
+            eased = t01 < 0.5 ? 4 * t01 * t01 * t01 : 1 - Math.pow(-2 * t01 + 2, 3) / 2;
 
             this.targetPos.lerpVectors(thisPos, targetPos, eased);
             this.targetRot.slerpQuaternions(thisRot, targetRot, eased);
@@ -83,7 +83,7 @@ export class ChangeTransformOnClick extends Behaviour implements IPointerClickHa
     }
 
     private *moveRelative() {
-        
+
         if (!this.target || !this.object) return;
 
         const thisPos = this.object.position.clone();
@@ -107,10 +107,10 @@ export class ChangeTransformOnClick extends Behaviour implements IPointerClickHa
 
             t01 += this.context.time.deltaTime / this.duration;
             if (t01 > 1) t01 = 1;
-            
+
             // apply ease-in-out
             // https://easings.net/
-            eased =  t01 < 0.5 ? 4 * t01 * t01 * t01 : 1 - Math.pow(-2 * t01 + 2, 3) / 2;
+            eased = t01 < 0.5 ? 4 * t01 * t01 * t01 : 1 - Math.pow(-2 * t01 + 2, 3) / 2;
 
             this.object.position.lerpVectors(thisPos, this.targetPos, eased);
             this.object.quaternion.slerpQuaternions(thisRot, this.targetRot, eased);
@@ -120,7 +120,7 @@ export class ChangeTransformOnClick extends Behaviour implements IPointerClickHa
         }
 
         this.coroutine = null;
-    }   
+    }
 
     onPointerClick() {
         if (this.coroutine) this.stopCoroutine(this.coroutine);
@@ -313,11 +313,12 @@ export class SetActiveOnClick extends Behaviour implements IPointerClickHandler,
                 hideClickedObject = true;
                 targetState = !this.target.visible;
 
-                // TODO check where we have to create the clone; here it doesn't show up
+                if (!this.selfModel.parent || this.selfModel.parent.isEmpty())
+                    USDDocument.createEmptyParent(this.selfModel);
+
                 this.toggleModel = this.selfModel.clone();
                 this.toggleModel.name += "_toggle";
-                if (this.selfModel.parent)
-                    this.selfModel.parent.add(this.toggleModel);
+                this.selfModel.parent!.add(this.toggleModel);
             }
 
             const sequence: ActionModel[] = [];
@@ -344,8 +345,8 @@ export class SetActiveOnClick extends Behaviour implements IPointerClickHandler,
                     ActionBuilder.sequence(...toggleSequence)
                 ));
 
-                ext.addBehavior(new BehaviorModel("HideOnStart_" + this.gameObject.name, 
-                    TriggerBuilder.sceneStartTrigger(), 
+                ext.addBehavior(new BehaviorModel("HideOnStart_" + this.gameObject.name,
+                    TriggerBuilder.sceneStartTrigger(),
                     ActionBuilder.fadeAction(this.toggleModel, 0, false)
                 ));
             }
@@ -363,8 +364,8 @@ export class HideOnStart extends Behaviour implements UsdzBehaviour {
 
     createBehaviours(ext, model, _context) {
         if (model.uuid === this.gameObject.uuid)
-            ext.addBehavior(new BehaviorModel("HideOnStart_" + this.gameObject.name, 
-                TriggerBuilder.sceneStartTrigger(), 
+            ext.addBehavior(new BehaviorModel("HideOnStart_" + this.gameObject.name,
+                TriggerBuilder.sceneStartTrigger(),
                 ActionBuilder.fadeAction(model, 0, false)
             ));
     }
@@ -394,8 +395,7 @@ export class EmphasizeOnClick extends Behaviour implements UsdzBehaviour {
     createBehaviours(ext, model, _context) {
         if (!this.target) return;
 
-        if (model.uuid === this.gameObject.uuid)
-        {
+        if (model.uuid === this.gameObject.uuid) {
             const emphasize = new BehaviorModel("emphasize " + this.name,
                 TriggerBuilder.tapTrigger(this.gameObject),
                 ActionBuilder.emphasize(this.target, this.duration, this.motionType, undefined, "basic"),
@@ -417,7 +417,7 @@ export class PlayAnimationOnClick extends Behaviour implements IPointerClickHand
 
     @serializable()
     stateName?: string;
-    
+
     @serializable()
     stateNameAfterPlaying?: string;
 
@@ -486,7 +486,7 @@ export class PlayAnimationOnClick extends Behaviour implements IPointerClickHand
 
     createAnimation(ext, model, _context) {
         if (this.target && this.animator) {
-            
+
             const state = this.animator?.runtimeAnimatorController?.findState(this.stateName);
             this.stateAnimationModel = model;
             this.stateAnimation = ext.registerAnimation(this.target, state?.motion.clip);

package/src/engine-components/export/usdz/extensions/behavior/BehavioursBuilder.ts

@@ -74,7 +74,7 @@ function resolve(targetObject: Target, document: USDDocument): string {
             let obj = targetObject[i];
             if (typeof obj === "string")
                 str += obj;
-            else if ( typeof obj === "object") {
+            else if (typeof obj === "object") {
                 //@ts-ignore
                 if (obj.isObject3D) {
                     //@ts-ignore
@@ -436,7 +436,7 @@ export class ActionBuilder {
         act.tokenId = "Emphasize";
         act.duration = duration;
         act.style = style ?? "basic";
-        act.motionType = MotionType[motionType]; 
+        act.motionType = MotionType[motionType];
         act.moveDistance = moveDistance;
         return act;
     }