@needle-tools/engine 2.53.0-pre → 2.54.2-pre

package/src/engine-components/Renderer.ts

@@ -463,14 +463,10 @@ export class Renderer extends Behaviour implements IRenderer {
         if (!suppressProgressiveLoading && material._didRequestTextureLOD === undefined && this.allowProgressiveLoading) {
             material._didRequestTextureLOD = 0;
             if (debugProgressiveLoading) {
-                console.log("Load material LOD (with delay)", material.name);
-                setTimeout(() => {
-                    NEEDLE_progressive.assignTextureLOD(this.context, this.sourceId, material);
-                }, 2000);
-            }
-            else {
-                NEEDLE_progressive.assignTextureLOD(this.context, this.sourceId, material);
+                console.log("Load material LOD", material.name);
             }
+            NEEDLE_progressive.assignTextureLOD(this.context, this.sourceId, material);
+
         }
 
         if (material.envMapIntensity !== undefined) {
@@ -549,10 +545,10 @@ export class Renderer extends Behaviour implements IRenderer {
             // update the reflection probe right before rendering
             // if we do it immediately the reflection probe might not be enabled yet 
             // (since this method is called from onEnable)
-            this.startCoroutine(this._updateReflectionProbe(), FrameEvent.OnBeforeRender);
+            this.startCoroutine(this._updateReflectionProbe(), FrameEvent.LateUpdate);
         }
     }
-    private *_updateReflectionProbe(){
+    private *_updateReflectionProbe() {
         const obj = this.probeAnchor || this.gameObject;
         const isAnchor = this.probeAnchor ? true : false;
         this._reflectionProbe = ReflectionProbe.get(obj, this.context, isAnchor);

package/src/engine-components/Volume.ts

@@ -93,7 +93,14 @@ export class VolumeProfile {
                 // three.js range goes from 0..inf
                 if (debug)
                     console.log(colorAdjustments.postExposure);
-                const exposure = Math.pow(2, colorAdjustments.postExposure?.value ?? 0);
+                let exposure = 1;
+                // convert to linear
+                if (colorAdjustments.postExposure)
+                    exposure = Math.pow(2, colorAdjustments.postExposure.value);
+                // ACES applies a factor of roughly 1.666 ( /= .6 )
+                if (context.renderer.toneMapping === ACESFilmicToneMapping) {
+                    // exposure /= Math.PI / 2;
+                }
                 const useExposure = colorAdjustments.postExposure?.overrideState && !remove;
                 context.renderer.toneMappingExposure = useExposure ? exposure : 1;
                 if (!context.renderer.toneMapping)

package/src/engine-components/WebXR.ts

@@ -86,7 +86,7 @@ export class WebXR extends Behaviour {
         return listener;
     }
 
-    public static createVRButton(webXR: WebXR, opts?: CreateButtonOptions): HTMLButtonElement {
+    public static createVRButton(webXR: WebXR, opts?: CreateButtonOptions): HTMLButtonElement | HTMLAnchorElement {
         if (!WebXR.XRSupported) {
             console.warn("WebXR is not supported on this device");
         }
@@ -102,7 +102,7 @@ export class WebXR extends Behaviour {
         return vrButton;
     }
 
-    public static createARButton(webXR: WebXR, opts?: CreateButtonOptions): HTMLButtonElement {
+    public static createARButton(webXR: WebXR, opts?: CreateButtonOptions): HTMLButtonElement | HTMLAnchorElement {
         webXR.__internalAwake();
         const domOverlayRoot = webXR.webAR?.getAROverlayContainer();
         const features: any = {};

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

@@ -3,164 +3,164 @@ export class __Ignore {}
 export { AlignmentConstraint } from "../AlignmentConstraint";
 export { Animation } from "../Animation";
 export { AnimationCurve } from "../AnimationCurve";
+export { AnimationExtension } from "../export/usdz/extensions/Animation";
+export { AnimationTrackHandler } from "../timeline/TimelineTracks";
 export { Animator } from "../Animator";
 export { AnimatorController } from "../AnimatorController";
+export { AttachedObject } from "../WebXRController";
 export { AudioListener } from "../AudioListener";
 export { AudioSource } from "../AudioSource";
-export { AvatarModel } from "../AvatarLoader";
+export { AudioTrackHandler } from "../timeline/TimelineTracks";
+export { Avatar_Brain_LookAt } from "../avatar/Avatar_Brain_LookAt";
+export { Avatar_MouthShapes } from "../avatar/Avatar_MouthShapes";
+export { Avatar_MustacheShake } from "../avatar/Avatar_MustacheShake";
+export { Avatar_POI } from "../avatar/Avatar_Brain_LookAt";
+export { AvatarBlink_Simple } from "../avatar/AvatarBlink_Simple";
+export { AvatarEyeLook_Rotation } from "../avatar/AvatarEyeLook_Rotation";
 export { AvatarLoader } from "../AvatarLoader";
+export { AvatarMarker } from "../WebXRAvatar";
+export { AvatarModel } from "../AvatarLoader";
 export { AxesHelper } from "../AxesHelper";
+export { BaseUIComponent } from "../ui/BaseUIComponent";
 export { BasicIKConstraint } from "../BasicIKConstraint";
+export { BoxCollider } from "../Collider";
+export { BoxGizmo } from "../Gizmos";
 export { BoxHelperComponent } from "../BoxHelperComponent";
+export { Button } from "../ui/Button";
+export { CallInfo } from "../EventList";
 export { Camera } from "../Camera";
+export { Canvas } from "../ui/Canvas";
+export { CanvasGroup } from "../ui/CanvasGroup";
+export { CapsuleCollider } from "../Collider";
 export { CharacterController } from "../CharacterController";
 export { CharacterControllerInput } from "../CharacterController";
 export { Collider } from "../Collider";
-export { SphereCollider } from "../Collider";
-export { BoxCollider } from "../Collider";
-export { MeshCollider } from "../Collider";
-export { CapsuleCollider } from "../Collider";
-export { DeleteBox } from "../DeleteBox";
+export { ColorAdjustments } from "../Volume";
+export { ColorBySpeedModule } from "../ParticleSystemModules";
+export { ColorOverLifetimeModule } from "../ParticleSystemModules";
+export { ControlTrackHandler } from "../timeline/TimelineTracks";
 export { Deletable } from "../DeleteBox";
+export { DeleteBox } from "../DeleteBox";
 export { DeviceFlag } from "../DeviceFlag";
 export { DragControls } from "../DragControls";
 export { DropListener } from "../DropListener";
 export { Duplicatable } from "../Duplicatable";
-export { CallInfo } from "../EventList";
-export { EventListEvent } from "../EventList";
+export { EmissionModule } from "../ParticleSystemModules";
 export { EventList } from "../EventList";
+export { EventListEvent } from "../EventList";
+export { EventSystem } from "../ui/EventSystem";
 export { EventTrigger } from "../EventTrigger";
+export { FieldWithDefault } from "../Renderer";
+export { FixedJoint } from "../Joints";
 export { FlyControls } from "../FlyControls";
-export { BoxGizmo } from "../Gizmos";
+export { GltfExport } from "../export/gltf/GltfExport";
+export { GltfExportBox } from "../export/gltf/GltfExport";
+export { Gradient } from "../ParticleSystemModules";
+export { Graphic } from "../ui/Graphic";
+export { GraphicRaycaster } from "../ui/Raycaster";
 export { GridHelper } from "../GridHelper";
+export { GridLayoutGroup } from "../ui/Layout";
 export { GroundProjectedEnv } from "../GroundProjection";
-export { Interactable } from "../Interactable";
-export { UsageMarker } from "../Interactable";
-export { FixedJoint } from "../Joints";
 export { HingeJoint } from "../Joints";
+export { HorizontalLayoutGroup } from "../ui/Layout";
+export { Image } from "../ui/Image";
+export { InheritVelocityModule } from "../ParticleSystemModules";
+export { InputField } from "../ui/InputField";
+export { Interactable } from "../Interactable";
+export { Keyboard } from "../ui/Keyboard";
+export { LayoutGroup } from "../ui/Layout";
 export { Light } from "../Light";
-export { LODModel } from "../LODGroup";
+export { LimitVelocityOverLifetimeModule } from "../ParticleSystemModules";
 export { LODGroup } from "../LODGroup";
+export { LODModel } from "../LODGroup";
+export { LogStats } from "../debug/LogStats";
 export { LookAtConstraint } from "../LookAtConstraint";
+export { MainModule } from "../ParticleSystemModules";
+export { MaskableGraphic } from "../ui/Graphic";
+export { MeshCollider } from "../Collider";
+export { MeshRenderer } from "../Renderer";
+export { MinMaxCurve } from "../ParticleSystemModules";
+export { MinMaxGradient } from "../ParticleSystemModules";
 export { NestedGltf } from "../NestedGltf";
 export { Networking } from "../Networking";
+export { NoiseModule } from "../ParticleSystemModules";
+export { ObjectRaycaster } from "../ui/Raycaster";
 export { OffsetConstraint } from "../OffsetConstraint";
 export { OrbitControls } from "../OrbitControls";
-export { SubEmitterSystem } from "../ParticleSystem";
-export { ParticleSystemRenderer } from "../ParticleSystem";
-export { ParticleSystem } from "../ParticleSystem";
-export { Gradient } from "../ParticleSystemModules";
-export { MinMaxCurve } from "../ParticleSystemModules";
-export { MinMaxGradient } from "../ParticleSystemModules";
-export { MainModule } from "../ParticleSystemModules";
 export { ParticleBurst } from "../ParticleSystemModules";
-export { EmissionModule } from "../ParticleSystemModules";
-export { ColorOverLifetimeModule } from "../ParticleSystemModules";
-export { SizeOverLifetimeModule } from "../ParticleSystemModules";
-export { ShapeModule } from "../ParticleSystemModules";
-export { NoiseModule } from "../ParticleSystemModules";
-export { TrailModule } from "../ParticleSystemModules";
-export { VelocityOverLifetimeModule } from "../ParticleSystemModules";
-export { TextureSheetAnimationModule } from "../ParticleSystemModules";
-export { RotationOverLifetimeModule } from "../ParticleSystemModules";
-export { RotationBySpeedModule } from "../ParticleSystemModules";
-export { LimitVelocityOverLifetimeModule } from "../ParticleSystemModules";
-export { InheritVelocityModule } from "../ParticleSystemModules";
-export { SizeBySpeedModule } from "../ParticleSystemModules";
-export { ColorBySpeedModule } from "../ParticleSystemModules";
 export { ParticleSubEmitter } from "../ParticleSystemSubEmitter";
+export { ParticleSystem } from "../ParticleSystem";
+export { ParticleSystemRenderer } from "../ParticleSystem";
+export { PlayableDirector } from "../timeline/PlayableDirector";
 export { PlayerColor } from "../PlayerColor";
+export { PointerEventData } from "../ui/PointerEvents";
+export { RawImage } from "../ui/Image";
+export { Raycaster } from "../ui/Raycaster";
+export { Rect } from "../ui/RectTransform";
+export { RectTransform } from "../ui/RectTransform";
 export { ReflectionProbe } from "../ReflectionProbe";
-export { FieldWithDefault } from "../Renderer";
+export { RegisteredAnimationInfo } from "../export/usdz/extensions/Animation";
+export { RemoteSkybox } from "../Skybox";
 export { Renderer } from "../Renderer";
-export { MeshRenderer } from "../Renderer";
-export { SkinnedMeshRenderer } from "../Renderer";
 export { RendererLightmap } from "../RendererLightmap";
+export { RGBAColor } from "../js-extensions/RGBAColor";
 export { Rigidbody } from "../RigidBody";
+export { RotationBySpeedModule } from "../ParticleSystemModules";
+export { RotationOverLifetimeModule } from "../ParticleSystemModules";
 export { ScreenCapture } from "../ScreenCapture";
 export { ShadowCatcher } from "../ShadowCatcher";
-export { RemoteSkybox } from "../Skybox";
+export { ShapeModule } from "../ParticleSystemModules";
+export { SignalAsset } from "../timeline/SignalAsset";
+export { SignalReceiver } from "../timeline/SignalAsset";
+export { SignalReceiverEvent } from "../timeline/SignalAsset";
+export { SignalTrackHandler } from "../timeline/TimelineTracks";
+export { Size } from "../ui/RectTransform";
+export { SizeBySpeedModule } from "../ParticleSystemModules";
+export { SizeOverLifetimeModule } from "../ParticleSystemModules";
+export { SkinnedMeshRenderer } from "../Renderer";
 export { SmoothFollow } from "../SmoothFollow";
-export { SpatialTriggerReceiver } from "../SpatialTrigger";
+export { SpatialHtml } from "../ui/SpatialHtml";
 export { SpatialTrigger } from "../SpatialTrigger";
+export { SpatialTriggerReceiver } from "../SpatialTrigger";
 export { SpectatorCamera } from "../SpectatorCamera";
+export { SphereCollider } from "../Collider";
 export { Sprite } from "../SpriteRenderer";
-export { SpriteSheet } from "../SpriteRenderer";
 export { SpriteRenderer } from "../SpriteRenderer";
+export { SpriteSheet } from "../SpriteRenderer";
+export { SubEmitterSystem } from "../ParticleSystem";
 export { SyncedCamera } from "../SyncedCamera";
 export { SyncedRoom } from "../SyncedRoom";
 export { SyncedTransform } from "../SyncedTransform";
+export { TeleportTarget } from "../WebXRController";
 export { TestRunner } from "../TestRunner";
 export { TestSimulateUserData } from "../TestRunner";
+export { Text } from "../ui/Text";
+export { TextureSheetAnimationModule } from "../ParticleSystemModules";
+export { ToneMapping } from "../Volume";
+export { TrailModule } from "../ParticleSystemModules";
+export { TransformData } from "../export/usdz/extensions/Animation";
 export { TransformGizmo } from "../TransformGizmo";
+export { UIRaycastUtils } from "../ui/RaycastUtils";
+export { UIRootComponent } from "../ui/BaseUIComponent";
+export { UsageMarker } from "../Interactable";
+export { USDZExporter } from "../export/usdz/USDZExporter";
+export { VelocityOverLifetimeModule } from "../ParticleSystemModules";
+export { VerticalLayoutGroup } from "../ui/Layout";
 export { VideoPlayer } from "../VideoPlayer";
 export { Voip } from "../Voip";
-export { VolumeParameter } from "../Volume";
+export { Volume } from "../Volume";
 export { VolumeComponent } from "../Volume";
-export { ToneMapping } from "../Volume";
-export { ColorAdjustments } from "../Volume";
+export { VolumeParameter } from "../Volume";
 export { VolumeProfile } from "../Volume";
-export { Volume } from "../Volume";
+export { VRUserState } from "../WebXRSync";
+export { WebAR } from "../WebXR";
 export { WebARSessionRoot } from "../WebARSessionRoot";
 export { WebXR } from "../WebXR";
-export { WebAR } from "../WebXR";
-export { AvatarMarker } from "../WebXRAvatar";
 export { WebXRAvatar } from "../WebXRAvatar";
-export { TeleportTarget } from "../WebXRController";
 export { WebXRController } from "../WebXRController";
-export { AttachedObject } from "../WebXRController";
+export { WebXRSync } from "../WebXRSync";
+export { XRFlag } from "../XRFlag";
 export { XRGrabModel } from "../WebXRGrabRendering";
 export { XRGrabRendering } from "../WebXRGrabRendering";
 export { XRRig } from "../WebXRRig";
-export { VRUserState } from "../WebXRSync";
-export { WebXRSync } from "../WebXRSync";
 export { XRState } from "../XRFlag";
-export { XRFlag } from "../XRFlag";
-export { AvatarBlink_Simple } from "../avatar/AvatarBlink_Simple";
-export { AvatarEyeLook_Rotation } from "../avatar/AvatarEyeLook_Rotation";
-export { Avatar_POI } from "../avatar/Avatar_Brain_LookAt";
-export { Avatar_Brain_LookAt } from "../avatar/Avatar_Brain_LookAt";
-export { Avatar_MouthShapes } from "../avatar/Avatar_MouthShapes";
-export { Avatar_MustacheShake } from "../avatar/Avatar_MustacheShake";
-export { LogStats } from "../debug/LogStats";
-export { RGBAColor } from "../js-extensions/RGBAColor";
-export { PlayableDirector } from "../timeline/PlayableDirector";
-export { SignalAsset } from "../timeline/SignalAsset";
-export { SignalReceiverEvent } from "../timeline/SignalAsset";
-export { SignalReceiver } from "../timeline/SignalAsset";
-export { AnimationTrackHandler } from "../timeline/TimelineTracks";
-export { AudioTrackHandler } from "../timeline/TimelineTracks";
-export { SignalTrackHandler } from "../timeline/TimelineTracks";
-export { ControlTrackHandler } from "../timeline/TimelineTracks";
-export { BaseUIComponent } from "../ui/BaseUIComponent";
-export { UIRootComponent } from "../ui/BaseUIComponent";
-export { Button } from "../ui/Button";
-export { Canvas } from "../ui/Canvas";
-export { CanvasGroup } from "../ui/CanvasGroup";
-export { EventSystem } from "../ui/EventSystem";
-export { Graphic } from "../ui/Graphic";
-export { MaskableGraphic } from "../ui/Graphic";
-export { Image } from "../ui/Image";
-export { RawImage } from "../ui/Image";
-export { InputField } from "../ui/InputField";
-export { Keyboard } from "../ui/Keyboard";
-export { LayoutGroup } from "../ui/Layout";
-export { VerticalLayoutGroup } from "../ui/Layout";
-export { HorizontalLayoutGroup } from "../ui/Layout";
-export { GridLayoutGroup } from "../ui/Layout";
-export { PointerEventData } from "../ui/PointerEvents";
-export { Raycaster } from "../ui/Raycaster";
-export { ObjectRaycaster } from "../ui/Raycaster";
-export { GraphicRaycaster } from "../ui/Raycaster";
-export { UIRaycastUtils } from "../ui/RaycastUtils";
-export { Size } from "../ui/RectTransform";
-export { Rect } from "../ui/RectTransform";
-export { RectTransform } from "../ui/RectTransform";
-export { SpatialHtml } from "../ui/SpatialHtml";
-export { Text } from "../ui/Text";
-export { GltfExportBox } from "../export/gltf/GltfExport";
-export { GltfExport } from "../export/gltf/GltfExport";
-export { USDZExporter } from "../export/usdz/USDZExporter";
-export { RegisteredAnimationInfo } from "../export/usdz/extensions/Animation";
-export { TransformData } from "../export/usdz/extensions/Animation";
-export { AnimationExtension } from "../export/usdz/extensions/Animation";

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

@@ -12,6 +12,7 @@ import { WebXR } from "../../WebXR"
 import { serializable } from "../../../engine/engine_serialization";
 import { showBalloonWarning } from "../../../engine/debug/debug";
 import { Context } from "../../../engine/engine_setup";
+import { WebARSessionRoot } from "../../WebARSessionRoot";
 
 const debug = getParam("debugusdz");
 
@@ -33,6 +34,7 @@ export class USDZExporter extends Behaviour {
 
     private link!: HTMLAnchorElement;
     private webxr?: WebXR;
+    private webARSessionRoot: WebARSessionRoot | undefined;
 
 
     start() {
@@ -65,6 +67,7 @@ export class USDZExporter extends Behaviour {
         const safari = isSafari();
         if (debug || (ios && safari)) {
             this.createQuicklookButton();
+            this.webARSessionRoot = GameObject.findObjectOfType(WebARSessionRoot) ?? undefined;
             this.lastCallback = this.quicklookCallback.bind(this);
             this.link = ensureQuicklookLinkIsCreated(this.context);
             this.link.addEventListener('message', this.lastCallback);
@@ -78,6 +81,16 @@ export class USDZExporter extends Behaviour {
     async exportAsync() {
         if (!this.objectToExport) return;
 
+        // make sure we apply the AR scale
+        if (this.webARSessionRoot) {
+            const scene = this.webARSessionRoot.gameObject;
+            const scale = 1 / this.webARSessionRoot!.arScale;
+            scene.matrix.makeScale(scale, scale, scale);
+            if (this.webARSessionRoot.invertForward) {
+                scene.matrix.multiply(new THREE.Matrix4().makeRotationY(Math.PI));
+            }
+        }
+
         const exporter = new ThreeUSDZExporter();
         const extensions: any = [...this.extensions]
 
@@ -88,7 +101,7 @@ export class USDZExporter extends Behaviour {
         if (this.autoExportAnimations)
             registerAnimatorsImplictly(this.objectToExport, animExt);
 
-        const eventArgs = { self: this, exporter: exporter, extensions: extensions };
+        const eventArgs = { self: this, exporter: exporter, extensions: extensions, object: this.objectToExport };
         this.dispatchEvent(new CustomEvent("before-export", { detail: eventArgs }))
 
         let name = "needle";
@@ -100,6 +113,8 @@ export class USDZExporter extends Behaviour {
         const arraybuffer = await exporter.parse(this.objectToExport, extensions);
         const blob = new Blob([arraybuffer], { type: 'application/octet-stream' });
 
+        this.dispatchEvent(new CustomEvent("after-export", { detail: eventArgs }))
+
         // second file: USDA (without assets)
         //@ts-ignore
         // const usda = exporter.lastUsda;
@@ -154,7 +169,7 @@ export class USDZExporter extends Behaviour {
             await delay(1);
             this.webxr = GameObject.findObjectOfType(WebXR) ?? undefined;
             if (this.webxr) {
-                if(this.webxr.VRButton) this.webxr.VRButton.parentElement?.removeChild(this.webxr.VRButton);
+                if (this.webxr.VRButton) this.webxr.VRButton.parentElement?.removeChild(this.webxr.VRButton);
                 // check if we have an AR button already and re-use that
                 if (this.webxr.ARButton && this._arButton !== this.webxr.ARButton) {
                     this._arButton = this.webxr.ARButton;
@@ -170,6 +185,7 @@ export class USDZExporter extends Behaviour {
                         this.exportAsync();
                     });
                     this.webxr.ARButton.classList.add("quicklook-ar-button");
+                    this.dispatchEvent(new CustomEvent("created-button", { detail: this.webxr.ARButton }))
                 }
                 // create a button if WebXR didnt create one yet
                 else {
@@ -189,6 +205,7 @@ export class USDZExporter extends Behaviour {
                     button.classList.add('webxr-button');
                     button.classList.add("quicklook-ar-button");
                     container.appendChild(button);
+                    this.dispatchEvent(new CustomEvent("created-button", { detail: button }))
                 }
             }
             else {

package/src/engine-components/ui/Button.ts

@@ -31,21 +31,21 @@ export enum Transition {
     Animation
 }
 
-declare class ButtonColors {
+class ButtonColors {
     @serializable()
-    colorMultiplier: 1;
+    colorMultiplier!: 1;
     @serializable(RGBAColor)
-    disabledColor: RGBAColor;
+    disabledColor!: RGBAColor;
     @serializable()
-    fadeDuration: number;
+    fadeDuration!: number;
     @serializable(RGBAColor)
-    highlightedColor: RGBAColor;
+    highlightedColor!: RGBAColor;
     @serializable(RGBAColor)
-    normalColor: RGBAColor;
+    normalColor!: RGBAColor;
     @serializable(RGBAColor)
-    pressedColor: RGBAColor;
+    pressedColor!: RGBAColor;
     @serializable(RGBAColor)
-    selectedColor: RGBAColor;
+    selectedColor!: RGBAColor;
 }
 
 declare type AnimationTriggers = {

package/src/engine-components/ui/InputField.ts

@@ -1,10 +1,13 @@
 import { Behaviour, GameObject } from "../Component";
-import { IPointerClickHandler, IPointerEventHandler } from "./PointerEvents";
+import { IPointerClickHandler, IPointerEventHandler, PointerEventData } from "./PointerEvents";
 import { FrameEvent } from "../../engine/engine_setup";
 import { serializable } from "../../engine/engine_serialization_decorator";
 import { Text } from "./Text";
-import { getParam } from "../../engine/engine_utils";
+import { getParam, isiOS } from "../../engine/engine_utils";
 import { EventList } from "../EventList";
+import { showBalloonMessage } from "../../engine/debug/debug";
+import { Physics } from "../../engine/engine_physics";
+import { tryGetUIComponent } from "./Utils";
 
 const debug = getParam("debuginputfield");
 
@@ -36,6 +39,7 @@ export class InputField extends Behaviour implements IPointerEventHandler {
     private static htmlField: HTMLInputElement | null = null;
 
     private inputEventFn: any;
+    private _iosEventFn: any;
 
     start() {
         if (debug)
@@ -45,6 +49,7 @@ export class InputField extends Behaviour implements IPointerEventHandler {
     onEnable() {
         if (!InputField.htmlField) {
             InputField.htmlField = document.createElement("input");
+            InputField.htmlField.style.caretColor = "transparent";
             InputField.htmlField.classList.add("ar");
             document.body.appendChild(InputField.htmlField);
         }
@@ -57,6 +62,10 @@ export class InputField extends Behaviour implements IPointerEventHandler {
         if (this.placeholder && this.textComponent?.text.length) {
             GameObject.setActive(this.placeholder.gameObject, false);
         }
+        if (isiOS()) {
+            this._iosEventFn = this.processInputOniOS.bind(this);
+            window.addEventListener("touchend", this._iosEventFn);
+        }
     }
 
     onDisable() {
@@ -64,6 +73,9 @@ export class InputField extends Behaviour implements IPointerEventHandler {
         InputField.htmlField?.removeEventListener("keyup", this.inputEventFn);
         // InputField.htmlField?.removeEventListener("change", this.inputEventFn);
         this.onDeselected();
+        if (this._iosEventFn) {
+            window.removeEventListener("touchend", this._iosEventFn);
+        }
     }
 
     onPointerClick(_args) {
@@ -187,6 +199,17 @@ export class InputField extends Behaviour implements IPointerEventHandler {
         }
     }
 
+    private processInputOniOS() {
+        // focus() on safari ios doesnt open the keyboard when not processed from dom event
+        // so we try in a touch end event if this is hit
+        const hits = this.context.physics.raycast();
+        if (!hits.length) return;
+        const hit = hits[0];
+        const obj = hit.object;
+        const component = tryGetUIComponent(obj);
+        if (component?.gameObject === this.gameObject || component?.gameObject.parent === this.gameObject)
+            this.selectInputField();
+    }
 
 
     // private static _lastDeletionTime: number = 0;

package/src/engine-components/ui/Utils.ts

@@ -1,18 +1,19 @@
 
 import { FrontSide, DoubleSide, BackSide, TetrahedronGeometry } from "three"
 import { FrameEvent } from "../../engine/engine_setup";
-import { Behaviour, GameObject } from "../Component";
-import { $shadowDomOwner } from "./BaseUIComponent";
+import { Behaviour } from "../Component";
+import { $shadowDomOwner, BaseUIComponent } from "./BaseUIComponent";
 
-// export function makeNonRaycastable(obj: THREE.Object3D | null | undefined, recursive: boolean = false) {
-//     if (!obj) return;
-//     obj.layers.mask = 2;
-//     if (recursive && obj.children) {
-//         for (const ch of obj.children) {
-//             if (recursive) makeNonRaycastable(ch, true);
-//         }
-//     }
-// }
+export function tryGetUIComponent(obj: THREE.Object3D): BaseUIComponent | null {
+    const owner = obj[$shadowDomOwner];
+    if (owner) {
+        return owner;
+    }
+    if(obj.parent) {
+        return tryGetUIComponent(obj.parent);
+    }
+    return null;
+}
 
 export function isUIObject(obj: THREE.Object3D) {
     return obj["isUI"] === true || typeof obj[$shadowDomOwner] === "object";

package/src/engine-components-experimental/annotation/LineDrawer.ts

@@ -14,7 +14,7 @@ import { ControllerEvents, WebXRController } from "../../engine-components/WebXR
 class LineState {
     isDrawing: boolean;
     lastHit: Vector3;
-    currentHandle: LineHandle;
+    currentHandle: LineHandle | null;
     maxDistance: number;
     prevDistance: number;
     lastParent: THREE.Object3D | null;
@@ -31,7 +31,7 @@ class LineState {
 
 export class LinesDrawer extends Behaviour {
 
-    lines: LinesManager;
+    lines!: LinesManager;
     colliders?: THREE.Object3D[];
     alignToSurface: boolean = true;
     addToPaintedObject: boolean = true;
@@ -40,7 +40,7 @@ export class LinesDrawer extends Behaviour {
 
     start() {
         if (!this.lines) {
-            this.lines = GameObject.getComponent(this.gameObject, LinesManager);
+            this.lines = GameObject.getComponent(this.gameObject, LinesManager)!;
             if (!this.lines)
                 this.lines = GameObject.addNewComponent(this.gameObject, LinesManager);
         }
@@ -72,9 +72,11 @@ export class LinesDrawer extends Behaviour {
         if (this.orbit && this._states["mouse"]) {
             if (this.orbit) this.orbit.enabled = !this._states["mouse"].isDrawing;
         }
+        if (!this.context.mainCamera) return;
 
         const multi = this.context.input.getPointerPressedCount() > 1;
         const sp = this.context.input.getPointerPositionRC(0);
+        if (!sp) return;
         LinesDrawer._raycaster.setFromCamera(sp, this.context.mainCamera);
         const ray = LinesDrawer._raycaster.ray;
         this.updateLine("mouse", ray,
@@ -110,14 +112,15 @@ export class LinesDrawer extends Behaviour {
                     state.maxDistance = hit.distance;
                 }
                 pt = hit.point;
-                pt.add(hit.face.normal.multiplyScalar(0.01));
+                if (hit.face)
+                    pt.add(hit.face.normal.multiplyScalar(0.01));
                 state.prevDistance = hit.distance;
             }
             else if (state.maxDistance > 0) {
                 let dist = state.maxDistance;
                 // if we start drawing in thin air:
                 if (!state.currentHandle && state.lastHit) {
-                    const wp = getWorldPosition(this.context.mainCamera);
+                    const wp = getWorldPosition(this.context.mainCamera!);
                     dist = state.lastHit.distanceTo(wp);
                 }
                 pt = ray.origin.add(ray.direction.multiplyScalar(state.maxDistance));
@@ -165,8 +168,8 @@ export class LinesDrawer extends Behaviour {
         this._raycastOptions.ray = ray;
         const hits = this.context.physics.raycast(this._raycastOptions);
         if (hits.length > 0) {
-            for(const hit of hits) {
-                if(!GameObject.isActiveInHierarchy(hit.object)) {
+            for (const hit of hits) {
+                if (!GameObject.isActiveInHierarchy(hit.object)) {
                     continue;
                 }
                 return hit;