import { AxesHelper, DoubleSide, Matrix4, Mesh, MeshBasicMaterial, Object3D, Plane, Raycaster, RingGeometry, Scene, Vector3 } from "three";
import { isDevEnvironment, showBalloonWarning } from "../../engine/debug/index.js";
import { destroy, instantiate } from "../../engine/engine_gameobject.js";
import { InputEventQueue } from "../../engine/engine_input.js";
import { getBoundingBox, getTempVector } from "../../engine/engine_three_utils.js";
import { DeviceUtilities, getParam } from "../../engine/engine_utils.js";
import { NeedleXRController, NeedleXRSession } from "../../engine/engine_xr.js";
import { Behaviour, GameObject } from "../Component.js";
// https://github.com/takahirox/takahirox.github.io/blob/master/js.mmdeditor/examples/js/controls/DeviceOrientationControls.js
const debug = getParam("debugwebxr");
const invertForwardMatrix = new Matrix4().makeRotationY(Math.PI);
/**
 * The WebARSessionRoot is the root object for a WebAR session and used to place the scene in AR.
 * It is also responsible for scaling the user in AR.
 *
 * @example
 * ```ts
 * WebARSessionRoot.onPlaced((args) => {
 *    console.log("Scene has been placed in AR");
 * });
 * ```
 *
 * @category XR
 * @group Components
 */
export class WebARSessionRoot extends Behaviour {
    static _eventListeners = {};
    /**
     * Event that is called when the scene has been placed in AR.
     * @param cb the callback that is called when the scene has been placed
     * @returns a function to remove the event listener
     */
    static onPlaced(cb) {
        const event = "placed";
        if (!this._eventListeners[event])
            this._eventListeners[event] = [];
        this._eventListeners[event].push(cb);
        return () => {
            const index = this._eventListeners[event].indexOf(cb);
            if (index >= 0)
                this._eventListeners[event].splice(index, 1);
        };
    }
    static _hasPlaced = false;
    /**
     * @returns true if the scene has been placed in AR by the user or automatic placement
     */
    static get hasPlaced() {
        return this._hasPlaced;
    }
    /** The scale of the user in AR.
     * **NOTE**: a large value makes the scene appear smaller
     * @default 1
     */
    get arScale() {
        return this._arScale;
    }
    set arScale(val) {
        this._arScale = Math.max(0.000001, val);
        this.onSetScale();
    }
    _arScale = 1;
    /** When enabled the placed scene forward direction will towards the XRRig
     * @deprecated
     * @default false
    */
    invertForward = false;
    /** When assigned this asset will be loaded and visualize the placement while in AR
     * @default null
     */
    customReticle;
    /** Enable touch transform to translate, rotate and scale the scene in AR with multitouch
     * @default true
     */
    arTouchTransform = true;
    /** When enabled the scene will be placed automatically when a point in the real world is found
     * @default false
     */
    autoPlace = false;
    /** When enabled the scene center will be automatically calculated from the content in the scene */
    autoCenter = false;
    /** Experimental: When enabled we will create a XR anchor for the scene placement
     * and make sure the scene is at that anchored point during a XR session
     * @default false
     **/
    useXRAnchor = false;
    /** true if we're currently placing the scene */
    _isPlacing = true;
    /** This is the world matrix of the ar session root when entering webxr
     * it is applied when the scene has been placed (e.g. if the session root is x:10, z:10 we want this position to be the center of the scene)
     */
    _startOffset = new Matrix4();
    _createdPlacementObject = null;
    _reparentedComponents = [];
    // move objects into a temporary scene while placing (which is not rendered) so that the components won't be disabled during this process
    // e.g. we want the avatar to still be updated while placing
    // another possibly solution would be to ensure from this component that the Rig is *also* not disabled while placing
    _placementScene = new Scene();
    /** the reticles used for placement */
    _reticle = [];
    /** needs to be in sync with the reticles */
    _hits = [];
    _placementStartTime = -1;
    _rigPlacementMatrix;
    /** if useAnchor is enabled this is the anchor we have created on placing the scene using the placement hit */
    _anchor = null;
    /** user input is used for ar touch transform */
    userInput;
    onEnable() {
        this.customReticle?.preload();
    }
    supportsXR(mode) {
        return mode === "immersive-ar";
    }
    onEnterXR(_args) {
        if (debug)
            console.log("ENTER WEBXR: SessionRoot start...");
        this._anchor = null;
        WebARSessionRoot._hasPlaced = false;
        // if (_args.xr.session.enabledFeatures?.includes("image-tracking")) {
        //     console.warn("Image tracking is enabled - will not place scene");
        //     return;
        // }
        // save the transform of the session root in the scene to apply it when placing the scene
        this.gameObject.updateMatrixWorld();
        this._startOffset.copy(this.gameObject.matrixWorld);
        // create a new root object for the session placement scripts
        // and move all the children in the scene in a temporary scene that is not rendered
        const rootObject = new Object3D();
        this._createdPlacementObject = rootObject;
        rootObject.name = "AR Session Root";
        this._placementScene.name = "AR Placement Scene";
        this._placementScene.children.length = 0;
        for (let i = this.context.scene.children.length - 1; i >= 0; i--) {
            const ch = this.context.scene.children[i];
            this._placementScene.add(ch);
        }
        this.context.scene.add(rootObject);
        if (this.autoCenter) {
            const bounds = getBoundingBox(this._placementScene.children);
            const center = bounds.getCenter(new Vector3());
            const size = bounds.getSize(new Vector3());
            const matrix = new Matrix4();
            matrix.makeTranslation(center.x, center.y - size.y * .5, center.z);
            this._startOffset.multiply(matrix);
        }
        // reparent components
        // save which gameobject the sessionroot component was previously attached to
        this._reparentedComponents.length = 0;
        this._reparentedComponents.push({ comp: this, originalObject: this.gameObject });
        GameObject.addComponent(rootObject, this);
        // const webXR = GameObject.findObjectOfType(WebXR2);
        // if (webXR) {
        //     this._reparentedComponents.push({ comp: webXR, originalObject: webXR.gameObject });
        //     GameObject.addComponent(rootObject, webXR);
        //     const playerSync = GameObject.findObjectOfType(XRFlag);
        // }
        // recreate the reticle every time we enter AR
        for (const ret of this._reticle) {
            destroy(ret);
        }
        this._reticle.length = 0;
        this._isPlacing = true;
        // we want to receive pointer events EARLY and prevent interaction with other objects while placing by stopping the event propagation
        this.context.input.addEventListener("pointerup", this.onPlaceScene, { queue: InputEventQueue.Early });
    }
    onLeaveXR() {
        // TODO: WebARSessionRoot doesnt work when we enter passthrough and leave XR without having placed the session!!!
        this.context.input.removeEventListener("pointerup", this.onPlaceScene, { queue: InputEventQueue.Early });
        this.onRevertSceneChanges();
        // this._anchor?.delete();
        this._anchor = null;
        WebARSessionRoot._hasPlaced = false;
        this._rigPlacementMatrix = undefined;
    }
    onUpdateXR(args) {
        // disable session placement while images are being tracked
        if (args.xr.isTrackingImages) {
            for (const ret of this._reticle)
                ret.visible = false;
            return;
        }
        if (this._isPlacing) {
            const rigObject = args.xr.rig?.gameObject;
            // the rig should be parented to the scene while placing
            // since the camera is always parented to the rig this ensures that the camera is always rendering
            if (rigObject && rigObject.parent !== this.context.scene) {
                this.context.scene.add(rigObject);
            }
            // in pass through mode we want to place the scene using an XR controller
            let controllersDidHit = false;
            // when auto placing we just use the user's view
            if (args.xr.isPassThrough && args.xr.controllers.length > 0 && !this.autoPlace) {
                for (const ctrl of args.xr.controllers) {
                    // with this we can only place with the left / first controller right now
                    // we also only have one reticle... this should probably be refactored a bit so we can have multiple reticles
                    // and then place at the reticle for which the user clicked the place button
                    const hit = ctrl.getHitTest();
                    if (hit) {
                        controllersDidHit = true;
                        this.updateReticleAndHits(args.xr, ctrl.index, hit, args.xr.rigScale);
                    }
                }
            }
            // in screen AR mode we use "camera" hit testing (or when using the simulator where controller hit testing is not supported)
            if (!controllersDidHit) {
                const hit = args.xr.getHitTest();
                if (hit) {
                    this.updateReticleAndHits(args.xr, 0, hit, args.xr.rigScale);
                }
            }
        }
        else {
            // Update anchors, if any
            if (this._anchor && args.xr.referenceSpace) {
                const pose = args.xr.frame.getPose(this._anchor.anchorSpace, args.xr.referenceSpace);
                if (pose && this.context.time.frame % 20 === 0) {
                    // apply the anchor pose to one of the reticles
                    const converted = args.xr.convertSpace(pose.transform);
                    const reticle = this._reticle[0];
                    if (reticle) {
                        reticle.position.copy(converted.position);
                        reticle.quaternion.copy(converted.quaternion);
                        this.onApplyPose(reticle);
                    }
                }
            }
            // Scene has been placed
            if (this.arTouchTransform) {
                if (!this.userInput)
                    this.userInput = new WebXRSessionRootUserInput(this.context);
                this.userInput?.enable();
            }
            else
                this.userInput?.disable();
            if (this.arTouchTransform && this.userInput?.hasChanged) {
                if (args.xr.rig) {
                    const rig = args.xr.rig.gameObject;
                    this.userInput.applyMatrixTo(rig.matrix, true);
                    rig.matrix.decompose(rig.position, rig.quaternion, rig.scale);
                    // if the rig is scaled large we want the drag touch to be faster
                    this.userInput.factor = rig.scale.x;
                }
                this.userInput.reset();
            }
        }
    }
    updateReticleAndHits(_xr, i, hit, scale) {
        // save the hit test
        this._hits[i] = hit.hit;
        let reticle = this._reticle[i];
        if (!reticle) {
            if (this.customReticle) {
                if (this.customReticle.asset) {
                    reticle = instantiate(this.customReticle.asset);
                }
                else {
                    this.customReticle.loadAssetAsync();
                    return;
                }
            }
            else {
                reticle = new Mesh(new RingGeometry(0.07, 0.09, 32).rotateX(-Math.PI / 2), new MeshBasicMaterial({ side: DoubleSide, depthTest: false, depthWrite: false, transparent: true, opacity: 1, color: 0xeeeeee }));
                reticle.name = "AR Placement Reticle";
            }
            if (debug) {
                const axes = new AxesHelper(1);
                axes.position.y += .01;
                reticle.add(axes);
            }
            this._reticle[i] = reticle;
            reticle.matrixAutoUpdate = false;
            reticle.visible = false;
        }
        reticle["lastPos"] = reticle["lastPos"] || hit.position.clone();
        reticle["lastQuat"] = reticle["lastQuat"] || hit.quaternion.clone();
        // reticle["targetPos"] = reticle["targetPos"] || hit.position.clone();
        // reticle["targetQuat"] = reticle["targetQuat"] || hit.quaternion.clone();
        // TODO we likely want the reticle itself to be placed _exactly_ and then the visuals being lerped,
        // Right now this leads to a "rotation glitch" when going from a horizontal to a vertical surface
        reticle.position.copy(reticle["lastPos"].lerp(hit.position, this.context.time.deltaTime / .1));
        reticle["lastPos"].copy(reticle.position);
        reticle.quaternion.copy(reticle["lastQuat"].slerp(hit.quaternion, this.context.time.deltaTime / .05));
        reticle["lastQuat"].copy(reticle.quaternion);
        // TODO make sure original reticle asset scale is respected, or document it should be uniformly scaled
        // scale *= this.customReticle?.asset?.scale?.x || 1;
        reticle.scale.set(scale, scale, scale);
        // if (this.invertForward) {
        //     reticle.rotateY(Math.PI);
        // }
        // Workaround: For a custom reticle we apply the view based transform during placement preview
        // See NE-4161 for context
        if (this.customReticle)
            this.applyViewBasedTransform(reticle);
        reticle.updateMatrix();
        reticle.visible = true;
        if (reticle.parent !== this.context.scene)
            this.context.scene.add(reticle);
        if (this._placementStartTime < 0) {
            this._placementStartTime = this.context.time.realtimeSinceStartup;
        }
        if (this.autoPlace) {
            this.upVec.set(0, 1, 0).applyQuaternion(reticle.quaternion);
            const isUp = this.upVec.dot(getTempVector(0, 1, 0)) > 0.9;
            if (isUp) {
                // We want the reticle to be at a suitable spot for a moment before we place the scene (not place it immediately)
                let autoplace_timer = reticle["autoplace:timer"] || 0;
                if (autoplace_timer >= 1) {
                    reticle.visible = false;
                    this.onPlaceScene(null);
                }
                else {
                    autoplace_timer += this.context.time.deltaTime;
                    reticle["autoplace:timer"] = autoplace_timer;
                }
            }
            else {
                reticle["autoplace:timer"] = 0;
            }
        }
    }
    onPlaceScene = (evt) => {
        if (this._isPlacing == false)
            return;
        if (evt?.used)
            return;
        let reticle = this._reticle[0];
        if (!reticle) {
            console.warn("No reticle to place...");
            return;
        }
        if (!reticle.visible && !this.autoPlace) {
            console.warn("Reticle is not visible (can not place)");
            return;
        }
        if (NeedleXRSession.active?.isTrackingImages) {
            console.warn("Scene Placement is disabled while images are being tracked");
            return;
        }
        let hit = this._hits[0];
        if (evt && evt.origin instanceof NeedleXRController) {
            // until we can use hit testing for both controllers and have multple reticles we only allow placement with the first controller
            const controllerReticle = this._reticle[evt.origin.index];
            if (controllerReticle) {
                reticle = controllerReticle;
                hit = this._hits[evt.origin.index];
            }
        }
        // if we place the scene we don't want this event to be propagated to any sub-objects (via the EventSystem) anymore and trigger e.g. a click on objects for the "place tap" event
        if (evt) {
            evt.stopImmediatePropagation();
            evt.stopPropagation();
            evt.use();
        }
        this._isPlacing = false;
        this.context.input.removeEventListener("pointerup", this.onPlaceScene);
        this.onRevertSceneChanges();
        // TODO: we should probably use the non-lerped position and quaternion here
        reticle.position.copy(reticle["lastPos"]);
        reticle.quaternion.copy(reticle["lastQuat"]);
        this.onApplyPose(reticle);
        WebARSessionRoot._hasPlaced = true;
        if (this.useXRAnchor) {
            this.onCreateAnchor(NeedleXRSession.active, hit);
        }
        if (this.context.xr) {
            for (const ctrl of this.context.xr.controllers) {
                ctrl.cancelHitTestSource();
            }
        }
    };
    onSetScale() {
        if (!WebARSessionRoot._hasPlaced)
            return;
        const rig = NeedleXRSession.active?.rig?.gameObject;
        if (rig) {
            const currentScale = NeedleXRSession.active?.rigScale || 1;
            const newScale = (1 / this._arScale) * currentScale;
            const scaleMatrix = new Matrix4().makeScale(newScale, newScale, newScale).invert();
            rig.matrix.premultiply(scaleMatrix);
            rig.matrix.decompose(rig.position, rig.quaternion, rig.scale);
        }
    }
    onRevertSceneChanges() {
        for (const ret of this._reticle) {
            if (!ret)
                continue;
            ret.visible = false;
            ret?.removeFromParent();
        }
        this._reticle.length = 0;
        for (let i = this._placementScene.children.length - 1; i >= 0; i--) {
            const ch = this._placementScene.children[i];
            this.context.scene.add(ch);
        }
        this._createdPlacementObject?.removeFromParent();
        for (const reparented of this._reparentedComponents) {
            GameObject.addComponent(reparented.originalObject, reparented.comp);
        }
    }
    async onCreateAnchor(session, hit) {
        if (hit.createAnchor === undefined) {
            console.warn("Hit does not support creating an anchor", hit);
            if (isDevEnvironment())
                showBalloonWarning("Hit does not support creating an anchor");
            return;
        }
        else {
            // @ts-ignore
            const anchor = await hit.createAnchor(session.viewerPose.transform);
            // make sure the session is still active
            if (session.running && anchor) {
                this._anchor = anchor;
            }
        }
    }
    upVec = new Vector3(0, 1, 0);
    lookPoint = new Vector3();
    worldUpVec = new Vector3(0, 1, 0);
    applyViewBasedTransform(reticle) {
        // Make reticle face the user to unify the placement experience across devices.
        // The pose that we're receiving from the hit test varies between devices:
        // - Quest: currently aligned to the mesh that was hit (depends on room setup), has changed a couple times
        // - Android WebXR: looking at the camera, but pretty random when on a wall
        // - Mozilla WebXR Viewer: aligned to the start of the session
        const camGo = this.context.mainCamera;
        const reticleGo = reticle;
        const camWP = camGo.worldPosition;
        const reticleWp = reticleGo.worldPosition;
        this.upVec.set(0, 1, 0).applyQuaternion(reticle.quaternion);
        // upVec may be pointing AWAY from us, we have to flip it if that's the case
        const camPos = camGo.worldPosition;
        if (camPos) {
            const camToReticle = reticle.position.clone().sub(camPos);
            const angle = camToReticle.angleTo(this.upVec);
            if (angle < Math.PI / 2) {
                this.upVec.negate();
            }
        }
        const upAngle = this.upVec.angleTo(this.worldUpVec) * 180 / Math.PI;
        // For debugging look angle for AR placement
        // Gizmos.DrawDirection(reticle.position, upVec, "blue", 0.1);
        // Gizmos.DrawLabel(reticle.position, upAngle.toFixed(2), 0.1);
        const angleForWallPlacement = 30;
        if ((upAngle > angleForWallPlacement && upAngle < 180 - angleForWallPlacement) ||
            (upAngle < -angleForWallPlacement && upAngle > -180 + angleForWallPlacement)) {
            this.lookPoint.copy(reticle.position).add(this.upVec);
            this.lookPoint.y = reticle.position.y;
            reticle.lookAt(this.lookPoint);
        }
        else {
            camWP.y = reticleWp.y;
            reticle.lookAt(camWP);
        }
        // TODO: ability to scale the reticle so that we can fit the scene depending on the view angle or distance to the reticle.
        // Currently, doing this leads to wrong placement of the scene.
        /*
        const rigScale = NeedleXRSession.active?.rigScale || 1;
        const scale = distance * rigScale;
        reticle.scale.set(scale, scale, scale);
        */
    }
    onApplyPose(reticle) {
        const rigObject = NeedleXRSession.active?.rig?.gameObject;
        if (!rigObject) {
            console.warn("No rig object to place");
            return;
        }
        // const rigScale = NeedleXRSession.active?.rigScale || 1;
        // save the previous rig parent
        const previousParent = rigObject.parent || this.context.scene;
        // if we have placed this rig before and this is just "replacing" with the anchor
        // we need to make sure the XRRig attached to the reticle is at the same position as last time
        // since in the following code we move it inside the reticle (relative to the reticle)
        if (this._rigPlacementMatrix) {
            this._rigPlacementMatrix?.decompose(rigObject.position, rigObject.quaternion, rigObject.scale);
        }
        else {
            this._rigPlacementMatrix = rigObject.matrix.clone();
        }
        this.applyViewBasedTransform(reticle);
        reticle.updateMatrix();
        // attach rig to reticle (since the reticle is in rig space it's a easy way to place the rig where we want it relative to the reticle)
        this.context.scene.add(reticle);
        reticle.attach(rigObject);
        reticle.removeFromParent();
        // move rig now relative to the reticle
        // TODO support scaled reticle
        rigObject.scale.set(this.arScale, this.arScale, this.arScale);
        rigObject.position.multiplyScalar(this.arScale);
        rigObject.updateMatrix();
        // if invert forward is disabled we need to invert the forward rotation
        // we want to look into positive Z direction (if invertForward is enabled we look into negative Z direction)
        if (this.invertForward)
            rigObject.matrix.premultiply(invertForwardMatrix);
        rigObject.matrix.premultiply(this._startOffset);
        // apply the rig modifications and add it back to the previous parent
        rigObject.matrix.decompose(rigObject.position, rigObject.quaternion, rigObject.scale);
        previousParent.add(rigObject);
    }
}
class WebXRSessionRootUserInput {
    static up = new Vector3(0, 1, 0);
    static zero = new Vector3(0, 0, 0);
    static one = new Vector3(1, 1, 1);
    oneFingerDrag = true;
    twoFingerRotate = true;
    twoFingerScale = true;
    factor = 1;
    context;
    offset;
    plane;
    _scale = 1;
    _hasChanged = false;
    get scale() {
        return this._scale;
    }
    // readonly translate: Vector3 = new Vector3();
    // readonly rotation: Quaternion = new Quaternion();
    // readonly scale: Vector3 = new Vector3(1, 1, 1);
    constructor(context) {
        this.context = context;
        this.offset = new Matrix4();
        this.plane = new Plane();
        this.plane.setFromNormalAndCoplanarPoint(WebXRSessionRootUserInput.up, WebXRSessionRootUserInput.zero);
    }
    _enabled = false;
    reset() {
        this._scale = 1;
        this.offset.identity();
        this._hasChanged = true;
    }
    get hasChanged() { return this._hasChanged; }
    /**
     * Applies the matrix to the offset matrix
     * @param matrix the matrix to apply the drag offset to
     * @param invert if true the offset matrix will be inverted before applying it to the matrix and premultiplied
     */
    applyMatrixTo(matrix, invert) {
        this._hasChanged = false;
        if (invert) {
            this.offset.invert();
            matrix.premultiply(this.offset);
        }
        else
            matrix.multiply(this.offset);
        // if (this._needsUpdate)
        //     this.updateMatrix();
        // matrix.premultiply(this._rotationMatrix);
        // matrix.premultiply(this.offset).premultiply(this._rotationMatrix)
    }
    currentlyUsedPointerIds = new Set();
    currentlyUnusedPointerIds = new Set();
    get isActive() {
        return this.currentlyUsedPointerIds.size <= 0 && this.currentlyUnusedPointerIds.size > 0;
    }
    enable() {
        if (this._enabled)
            return;
        this._enabled = true;
        this.context.input.addEventListener("pointerdown", this.onPointerDownEarly, { queue: InputEventQueue.Early });
        this.context.input.addEventListener("pointerdown", this.onPointerDownLate, { queue: InputEventQueue.Late });
        this.context.input.addEventListener("pointerup", this.onPointerUpEarly, { queue: InputEventQueue.Early });
        // TODO: refactor the following events to use the input system
        window.addEventListener('touchstart', this.touchStart, { passive: false });
        window.addEventListener('touchmove', this.touchMove, { passive: false });
        window.addEventListener('touchend', this.touchEnd, { passive: false });
    }
    disable() {
        if (!this._enabled)
            return;
        this._enabled = false;
        this.context.input.removeEventListener("pointerdown", this.onPointerDownEarly, { queue: InputEventQueue.Early });
        this.context.input.removeEventListener("pointerdown", this.onPointerDownLate, { queue: InputEventQueue.Late });
        this.context.input.removeEventListener("pointerup", this.onPointerUpEarly, { queue: InputEventQueue.Early });
        window.removeEventListener('touchstart', this.touchStart);
        window.removeEventListener('touchmove', this.touchMove);
        window.removeEventListener('touchend', this.touchEnd);
    }
    onPointerDownEarly = (e) => {
        if (this.isActive)
            e.stopPropagation();
    };
    onPointerDownLate = (e) => {
        if (e.used)
            this.currentlyUsedPointerIds.add(e.pointerId);
        else if (this.currentlyUsedPointerIds.size <= 0)
            this.currentlyUnusedPointerIds.add(e.pointerId);
    };
    onPointerUpEarly = (e) => {
        this.currentlyUsedPointerIds.delete(e.pointerId);
        this.currentlyUnusedPointerIds.delete(e.pointerId);
    };
    // private _needsUpdate: boolean = true;
    // private _rotationMatrix: Matrix4 = new Matrix4();
    // private updateMatrix() {
    //     this._needsUpdate = false;
    //     this._rotationMatrix.makeRotationFromQuaternion(this.rotation);
    //     this.offset.compose(this.translate, new Quaternion(), this.scale);
    //     // const rot = this._tempMatrix.makeRotationY(this.angle);
    //     // this.translate.applyMatrix4(rot);
    //     // this.offset.elements[12] = this.translate.x;
    //     // this.offset.elements[13] = this.translate.y;
    //     // this.offset.elements[14] = this.translate.z;
    //     // this.offset.premultiply(rot);
    //     // const s = this.scale;
    //     // this.offset.premultiply(this._tempMatrix.makeScale(s, s, s));
    // }
    prev = new Map();
    _didMultitouch = false;
    touchStart = (evt) => {
        if (evt.defaultPrevented)
            return;
        // let isValidTouch = true;
        // isValidTouch = evt.target === this.context.domElement || evt.target === this.context.renderer.domElement;
        // if (!isValidTouch) {
        //     return;
        // }
        for (let i = 0; i < evt.changedTouches.length; i++) {
            const touch = evt.changedTouches[i];
            // if a user starts swiping in the top area of the screen
            // which might be a gesture to open the menu
            // we ignore it
            const ignore = DeviceUtilities.isAndroidDevice() && touch.clientY < window.innerHeight * .1;
            if (!this.prev.has(touch.identifier))
                this.prev.set(touch.identifier, {
                    ignore,
                    x: 0,
                    z: 0,
                    screenx: 0,
                    screeny: 0,
                });
            const prev = this.prev.get(touch.identifier);
            if (prev) {
                const pos = this.getPositionOnPlane(touch.clientX, touch.clientY);
                prev.x = pos.x;
                prev.z = pos.z;
                prev.screenx = touch.clientX;
                prev.screeny = touch.clientY;
            }
        }
    };
    touchEnd = (evt) => {
        if (evt.touches.length <= 0) {
            this._didMultitouch = false;
        }
        for (let i = 0; i < evt.changedTouches.length; i++) {
            const touch = evt.changedTouches[i];
            this.prev.delete(touch.identifier);
        }
    };
    touchMove = (evt) => {
        if (evt.defaultPrevented)
            return;
        if (!this.isActive)
            return;
        if (evt.touches.length === 1) {
            // if we had multiple touches before due to e.g. pinching / rotating
            // and stopping one of the touches, we don't want to move the scene suddenly
            // this will be resettet when all touches stop
            if (this._didMultitouch) {
                return;
            }
            const touch = evt.touches[0];
            const prev = this.prev.get(touch.identifier);
            if (!prev || prev.ignore)
                return;
            const pos = this.getPositionOnPlane(touch.clientX, touch.clientY);
            const dx = pos.x - prev.x;
            const dy = pos.z - prev.z;
            if (dx === 0 && dy === 0)
                return;
            if (this.oneFingerDrag)
                this.addMovement(dx, dy);
            prev.x = pos.x;
            prev.z = pos.z;
            prev.screenx = touch.clientX;
            prev.screeny = touch.clientY;
            return;
        }
        else if (evt.touches.length === 2) {
            this._didMultitouch = true;
            const touch1 = evt.touches[0];
            const touch2 = evt.touches[1];
            const prev1 = this.prev.get(touch1.identifier);
            const prev2 = this.prev.get(touch2.identifier);
            if (!prev1 || !prev2)
                return;
            if (this.twoFingerRotate) {
                const angle1 = Math.atan2(touch1.clientY - touch2.clientY, touch1.clientX - touch2.clientX);
                const lastAngle = Math.atan2(prev1.screeny - prev2.screeny, prev1.screenx - prev2.screenx);
                const angleDiff = angle1 - lastAngle;
                if (Math.abs(angleDiff) > 0.001) {
                    this.addRotation(angleDiff);
                }
            }
            if (this.twoFingerScale) {
                const distx = touch1.clientX - touch2.clientX;
                const disty = touch1.clientY - touch2.clientY;
                const dist = Math.sqrt(distx * distx + disty * disty);
                const lastDistx = prev1.screenx - prev2.screenx;
                const lastDisty = prev1.screeny - prev2.screeny;
                const lastDist = Math.sqrt(lastDistx * lastDistx + lastDisty * lastDisty);
                const distDiff = dist - lastDist;
                if (Math.abs(distDiff) > 2) {
                    this.addScale(distDiff);
                }
            }
            prev1.screenx = touch1.clientX;
            prev1.screeny = touch1.clientY;
            prev2.screenx = touch2.clientX;
            prev2.screeny = touch2.clientY;
        }
    };
    _raycaster = new Raycaster();
    _intersection = new Vector3();
    _screenPos = new Vector3();
    getPositionOnPlane(tx, ty) {
        const camera = this.context.mainCamera;
        this._screenPos.x = (tx / window.innerWidth) * 2 - 1;
        this._screenPos.y = -(ty / window.innerHeight) * 2 + 1;
        this._screenPos.z = 1;
        this._screenPos.unproject(camera);
        this._raycaster.set(camera.position, this._screenPos.sub(camera.position));
        this._raycaster.ray.intersectPlane(this.plane, this._intersection);
        return this._intersection;
    }
    addMovement(dx, dz) {
        // this.translate.x -= dx;
        // this.translate.z -= dz;
        // this._needsUpdate = true;
        // return
        // increase diff if the scene is scaled small
        dx /= this._scale;
        dz /= this._scale;
        dx *= this.factor;
        dz *= this.factor;
        // apply it
        this.offset.elements[12] += dx;
        this.offset.elements[14] += dz;
        if (dx !== 0 || dz !== 0)
            this._hasChanged = true;
    }
    ;
    _tempMatrix = new Matrix4();
    addScale(diff) {
        diff /= window.innerWidth;
        diff *= -1;
        // this.scale.x *= 1 + diff;
        // this.scale.y *= 1 + diff;
        // this.scale.z *= 1 + diff;
        // this._needsUpdate = true;
        // return;
        // we use this factor to modify the translation factor (in apply movement)
        this._scale *= 1 + diff;
        // apply the scale
        this._tempMatrix.makeScale(1 - diff, 1 - diff, 1 - diff);
        this.offset.premultiply(this._tempMatrix);
        if (diff !== 0)
            this._hasChanged = true;
    }
    addRotation(rot) {
        rot *= -1;
        // this.rotation.multiply(new Quaternion().setFromAxisAngle(WebXRSessionRootUserInput.up, rot));
        // this._needsUpdate = true;
        // return;
        this._tempMatrix.makeRotationY(rot);
        this.offset.premultiply(this._tempMatrix);
        if (rot !== 0)
            this._hasChanged = true;
    }
}
//# sourceMappingURL=WebARSessionRoot.js.map