@needle-tools/engine 3.28.7-beta → 3.28.7-beta.1

package/lib/engine-components/OrbitControls.js

@@ -1,647 +1,647 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { Behaviour, GameObject } from "./Component.js";
-import { Camera } from "./Camera.js";
-import { LookAtConstraint } from "./LookAtConstraint.js";
-import { getWorldDirection, getWorldPosition, getWorldRotation, setWorldRotation } from "../engine/engine_three_utils.js";
-import { RaycastOptions } from "../engine/engine_physics.js";
-import { serializable } from "../engine/engine_serialization_decorator.js";
-import { getParam, isMobileDevice } from "../engine/engine_utils.js";
-import { Box3, Object3D, Vector2, Vector3, Box3Helper, GridHelper, Mesh, ShadowMaterial, Ray } from "three";
-import { OrbitControls as ThreeOrbitControls } from "three/examples/jsm/controls/OrbitControls.js";
-import { EventSystem, EventSystemEvents } from "./ui/EventSystem.js";
-import { setCameraController, useForAutoFit } from "../engine/engine_camera.js";
-import { SyncedTransform } from "./SyncedTransform.js";
-import { tryGetUIComponent } from "./ui/Utils.js";
-import { GroundProjectedSkybox } from "three/examples/jsm/objects/GroundProjectedSkybox.js";
-import { Mathf } from "../engine/engine_math.js";
-const freeCam = getParam("freecam");
-const debugCameraFit = getParam("debugcamerafit");
-const smoothcam = getParam("smoothcam");
-const disabledKeys = { LEFT: "", UP: "", RIGHT: "", BOTTOM: "" };
-let defaultKeys = undefined;
-export var OrbitControlsEventsType;
-(function (OrbitControlsEventsType) {
-    /** Invoked with a CameraTargetReachedEvent */
-    OrbitControlsEventsType["CameraTargetReached"] = "target-reached";
-})(OrbitControlsEventsType || (OrbitControlsEventsType = {}));
-export class CameraTargetReachedEvent extends CustomEvent {
-    constructor(ctrls, type) {
-        super(OrbitControlsEventsType.CameraTargetReached, {
-            detail: {
-                controls: ctrls,
-                type: type,
-            }
-        });
-    }
-}
-export class OrbitControls extends Behaviour {
-    get isCameraController() {
-        return true;
-    }
-    /** The underlying three.js OrbitControls */
-    get controls() {
-        return this._controls;
-    }
-    /** The object being controlled by the OrbitControls (usually the camera) */
-    get controllerObject() {
-        return this._cameraObject;
-    }
-    /** Register callback when user starts interacting with the orbit controls */
-    onStartInteraction(callback) {
-        this.controls?.addEventListener("start", callback);
-    }
-    /** When enabled the scene will be automatically fitted into the camera view in onEnable */
-    autoFit = false;
-    enableRotate = true;
-    autoRotate = false;
-    autoRotateSpeed = 1.0;
-    enableKeys = true;
-    enableDamping = true;
-    dampingFactor = 0.1;
-    enableZoom = true;
-    minZoom = 0;
-    maxZoom = Infinity;
-    enablePan = true;
-    lookAtConstraint = null;
-    lookAtConstraint01 = 1;
-    /** If true user input interrupts the camera from animating to a target */
-    allowInterrupt = true;
-    middleClickToFocus = true;
-    doubleClickToFocus = true;
-    // @serializable()
-    // zoomToCursor: boolean = false;
-    // remove once slerp works correctly
-    useSlerp = true;
-    debugLog = false;
-    /**
-     * @deprecated use `targetLerpDuration` instead
-     * ~~The speed at which the camera target and the camera will be lerping to their destinations (if set via script or user input)~~
-     * */
-    get targetLerpSpeed() { return 5; }
-    set targetLerpSpeed(v) { this.targetLerpDuration = 1 / v; }
-    /** The duration in seconds it takes for the camera look ad and position lerp to reach their destination (when set via `setCameraTargetPosition` and `setLookTargetPosition`) */
-    targetLerpDuration = 1;
-    /** When enabled OrbitControls will automatically raycast find a look at target in start */
-    autoTarget = true;
-    _controls = null;
-    _cameraObject = null;
-    _lookTargetLerpActive = false;
-    _lookTargetStartPosition = new Vector3();
-    _lookTargetEndPosition = new Vector3();
-    _lookTargetLerp01 = 0;
-    _lookTargetLerpDuration = 0;
-    _cameraLerpActive = false;
-    _cameraStartPosition = new Vector3();
-    _cameraEndPosition = new Vector3();
-    _cameraLerp01 = 0;
-    _cameraLerpDuration = 0;
-    _inputs = 0;
-    _enableTime = 0; // use to disable double click when double clicking on UI
-    _startedListeningToKeyEvents = false;
-    _eventSystem;
-    _afterHandleInputFn;
-    _camera = null;
-    _syncedTransform;
-    _didStart = false;
-    targetElement = null;
-    awake() {
-        this._didStart = false;
-        this._startedListeningToKeyEvents = false;
-    }
-    start() {
-        this._didStart = true;
-        if (this.autoTarget) {
-            if (this._controls) {
-                const camGo = GameObject.getComponent(this.gameObject, Camera);
-                if (camGo && !this.setLookTargetFromConstraint()) {
-                    if (this.debugLog)
-                        console.log("NO TARGET");
-                    const worldPosition = getWorldPosition(camGo.cam);
-                    const distanceToCenter = worldPosition.length();
-                    const forward = new Vector3(0, 0, -distanceToCenter).applyMatrix4(camGo.cam.matrixWorld);
-                    this.setLookTargetPosition(forward, true);
-                }
-                if (this.autoTarget && !this.setLookTargetFromConstraint()) {
-                    const opts = new RaycastOptions();
-                    // center of the screen:
-                    opts.screenPoint = new Vector2(0, 0);
-                    opts.lineThreshold = 0.1;
-                    const hits = this.context.physics.raycast(opts);
-                    if (hits.length > 0) {
-                        this.setLookTargetPosition(hits[0].point, true);
-                    }
-                    if (debugCameraFit)
-                        console.log("OrbitControls hits", ...hits);
-                }
-                if (this.autoFit)
-                    this.fitCamera();
-            }
-        }
-        this._eventSystem = EventSystem.get(this.context) ?? undefined;
-        if (this._eventSystem) {
-            this._afterHandleInputFn = this.afterHandleInput.bind(this);
-            this._eventSystem.addEventListener(EventSystemEvents.AfterHandleInput, this._afterHandleInputFn);
-        }
-    }
-    onDestroy() {
-        this._controls?.dispose();
-        this._eventSystem?.removeEventListener(EventSystemEvents.AfterHandleInput, this._afterHandleInputFn);
-    }
-    onEnable() {
-        this._enableTime = this.context.time.time;
-        const cameraComponent = GameObject.getComponent(this.gameObject, Camera);
-        this._camera = cameraComponent;
-        const cam = cameraComponent?.cam;
-        if (cam)
-            setCameraController(cam, this, true);
-        if (!this._controls) {
-            if (!cam) {
-                console.warn("OrbitControls: Requires a Camera component on the same object as this component.");
-                return;
-            }
-            if (cam)
-                this._cameraObject = cam;
-            // Using the parent if possible to make it possible to disable input on the canvas
-            // for having HTML content behind it and still receive input
-            const element = this.targetElement ?? this.context.renderer.domElement;
-            // HACK: workaround for three orbit controls forcing an update when being created....
-            const mat = cam?.quaternion.clone();
-            this._controls = new ThreeOrbitControls(cam, element);
-            cam?.quaternion.copy(mat);
-            if (defaultKeys === undefined)
-                defaultKeys = { ...this._controls.keys };
-        }
-        if (this._controls) {
-            if (freeCam) {
-                this.enablePan = true;
-                this.enableZoom = true;
-                this.middleClickToFocus = true;
-                if (isMobileDevice())
-                    this.doubleClickToFocus = true;
-            }
-            this._controls.addEventListener("start", this.onControlsChangeStarted);
-            if (cam?.type === "PerspectiveCamera") {
-                if (freeCam) {
-                    // dont set limits
-                }
-                else {
-                    this._controls.minDistance = this.minZoom;
-                    this._controls.maxDistance = this.maxZoom;
-                }
-            }
-            else {
-                if (freeCam) {
-                    // dont set limits
-                }
-                else {
-                    this._controls.minZoom = this.minZoom;
-                    this._controls.maxZoom = this.maxZoom;
-                }
-            }
-            if (!this._startedListeningToKeyEvents) {
-                this._startedListeningToKeyEvents = true;
-                this._controls.listenToKeyEvents(window.document.body);
-            }
-        }
-        this._syncedTransform = GameObject.getComponent(this.gameObject, SyncedTransform) ?? undefined;
-        // if we autofit in onEnable then DragControls will trigger fitting every time (because they disable OrbitControls)
-        // that's confusing and not what we want
-        // if (this._didStart) {
-        //     if (this.autoFit) this.fitCamera()
-        // }
-    }
-    onDisable() {
-        if (this._camera?.cam) {
-            setCameraController(this._camera.cam, this, false);
-        }
-        if (this._controls) {
-            this._controls.enabled = false;
-            this._controls.autoRotate = false;
-            this._controls.removeEventListener("start", this.onControlsChangeStarted);
-            // this._controls.reset();
-        }
-    }
-    onControlsChangeStarted = () => {
-        if (this._syncedTransform) {
-            this._syncedTransform.requestOwnership();
-        }
-    };
-    _shouldDisable = false;
-    afterHandleInput(evt) {
-        if (evt.detail.args.pointerId === 0) {
-            if (evt.detail.args.isDown) {
-                if (this._controls && this._eventSystem) {
-                    this._shouldDisable = this._eventSystem.hasActiveUI;
-                }
-            }
-            else if (!evt.detail.args.isPressed || evt.detail.args.isUp) {
-                this._shouldDisable = false;
-            }
-        }
-    }
-    onBeforeRender() {
-        if (!this._controls)
-            return;
-        if (this._cameraObject !== this.context.mainCamera)
-            return;
-        if (this.context.input.getPointerDown(1) || this.context.input.getPointerDown(2) || this.context.input.mouseWheelChanged || (this.context.input.getPointerPressed(0) && this.context.input.getPointerPositionDelta(0)?.length() || 0 > .1)) {
-            this._inputs += 1;
-        }
-        if (this._inputs > 0 && this.allowInterrupt) {
-            // if a user has disabled rotation but enabled auto rotate we don't want to change it when we receive input
-            if (this.enableRotate) {
-                this.autoRotate = false;
-            }
-            this._cameraLerpActive = false;
-            this._lookTargetLerpActive = false;
-        }
-        this._inputs = 0;
-        let focusAtPointer = (this.middleClickToFocus && this.context.input.getPointerClicked(1));
-        focusAtPointer ||= (this.doubleClickToFocus && this.context.input.getPointerDoubleClicked(0) && this.context.time.time - this._enableTime > .3);
-        if (focusAtPointer) {
-            this.setTargetFromRaycast();
-        }
-        if (this._lookTargetLerpActive || this._cameraLerpActive) {
-            // lerp the camera
-            if (this._cameraLerpActive && this._cameraObject) {
-                this._cameraLerp01 += this.context.time.deltaTime / this._cameraLerpDuration;
-                if (this._cameraLerp01 >= 1) {
-                    this._cameraObject.position.copy(this._cameraEndPosition);
-                    this._cameraLerpActive = false;
-                    this.dispatchEvent(new CameraTargetReachedEvent(this, "camera"));
-                }
-                else {
-                    const t = Mathf.easeInOutCubic(this._cameraLerp01);
-                    this._cameraObject.position.lerpVectors(this._cameraStartPosition, this._cameraEndPosition, t);
-                }
-            }
-            // lerp the look target
-            if (this._lookTargetLerpActive) {
-                this._lookTargetLerp01 += this.context.time.deltaTime / this._lookTargetLerpDuration;
-                if (this._lookTargetLerp01 >= 1) {
-                    this._controls.target.copy(this._lookTargetEndPosition);
-                    this._lookTargetLerpActive = false;
-                    this.dispatchEvent(new CameraTargetReachedEvent(this, "lookat"));
-                }
-                else {
-                    const t = Mathf.easeInOutCubic(this._lookTargetLerp01);
-                    this._controls.target.lerpVectors(this._lookTargetStartPosition, this._lookTargetEndPosition, t);
-                }
-            }
-        }
-        if (this._controls) {
-            if (this.debugLog)
-                this._controls.domElement = this.context.renderer.domElement;
-            this._controls.enabled = !this._shouldDisable && this._camera === this.context.mainCameraComponent && !this.context.isInXR;
-            this._controls.keys = this.enableKeys ? defaultKeys : disabledKeys;
-            this._controls.autoRotate = this.autoRotate;
-            this._controls.autoRotateSpeed = this.autoRotateSpeed;
-            this._controls.enableZoom = this.enableZoom;
-            this._controls.enableDamping = this.enableDamping;
-            this._controls.dampingFactor = this.dampingFactor;
-            this._controls.enablePan = this.enablePan;
-            this._controls.enableRotate = this.enableRotate;
-            if (typeof smoothcam === "number" || smoothcam === true) {
-                this._controls.enableDamping = true;
-                const factor = typeof smoothcam === "number" ? smoothcam : .99;
-                this._controls.dampingFactor = Math.max(.001, 1 - Math.min(1, factor));
-            }
-            if (!this.allowInterrupt) {
-                if (this._lookTargetLerpActive) {
-                    this._controls.enablePan = false;
-                }
-                if (this._cameraLerpActive) {
-                    this._controls.enableRotate = false;
-                    this._controls.autoRotate = false;
-                }
-                if (this._lookTargetLerpActive || this._cameraLerpActive) {
-                    this._controls.enableZoom = false;
-                }
-            }
-            //@ts-ignore
-            // this._controls.zoomToCursor = this.zoomToCursor;
-            if (!this.context.isInXR) {
-                if (!freeCam && this.lookAtConstraint?.locked)
-                    this.setLookTargetFromConstraint(0, this.lookAtConstraint01);
-                this._controls.update();
-            }
-        }
-    }
-    /**
-     * Sets camera target position and look direction. Does perform a raycast in the forward direction of the passed in object to find an orbit point
-     */
-    setCameraAndLookTarget(target) {
-        if (!target || !(target instanceof Object3D))
-            return;
-        const worldPosition = getWorldPosition(target);
-        const forward = getWorldDirection(target);
-        this.setTargetFromRaycast(new Ray(worldPosition, forward));
-        this.setCameraTargetPosition(worldPosition);
-    }
-    /** Moves the camera to position smoothly.
-     * @param position The position in local space of the controllerObject to move the camera to. If null the camera will stop lerping to the target.
-    */
-    setCameraTargetPosition(position, immediateOrDuration = false) {
-        if (!position)
-            return;
-        if (position instanceof Object3D) {
-            position = getWorldPosition(position);
-        }
-        if (!this._cameraEndPosition)
-            this._cameraEndPosition = new Vector3();
-        this._cameraEndPosition.copy(position);
-        if (immediateOrDuration === true) {
-            this._cameraLerpActive = false;
-            this.controllerObject?.position.copy(this._cameraEndPosition);
-        }
-        else if (this._cameraObject) {
-            this._cameraLerpActive = true;
-            this._cameraLerp01 = 0;
-            this._cameraStartPosition.copy(this._cameraObject?.position);
-            if (typeof immediateOrDuration === "number") {
-                this._cameraLerpDuration = immediateOrDuration;
-            }
-            else
-                this._cameraLerpDuration = this.targetLerpDuration;
-        }
-    }
-    /** True while the camera position is being lerped */
-    get cameraLerpActive() { return this._cameraLerpActive; }
-    /** Call to stop camera position lerping */
-    stopCameraLerp() {
-        this._cameraLerpActive = false;
-    }
-    /** Moves the camera look-at target to a position smoothly. */
-    setLookTargetPosition(position = null, immediateOrDuration = false) {
-        if (!this._controls)
-            return;
-        if (!position)
-            return;
-        if (position instanceof Object3D) {
-            position = getWorldPosition(position);
-        }
-        this._lookTargetEndPosition.copy(position);
-        if (immediateOrDuration === true) {
-            this._controls.target.copy(this._lookTargetEndPosition);
-        }
-        else {
-            this._lookTargetLerpActive = true;
-            this._lookTargetLerp01 = 0;
-            this._lookTargetStartPosition.copy(this._controls.target);
-            if (typeof immediateOrDuration === "number") {
-                this._lookTargetLerpDuration = immediateOrDuration;
-            }
-            else
-                this._lookTargetLerpDuration = this.targetLerpDuration;
-        }
-    }
-    /** True while the camera look target is being lerped */
-    get lookTargetLerpActive() { return this._lookTargetLerpActive; }
-    /** Call to stop camera look target lerping */
-    stopLookTargetLerp() {
-        this._lookTargetLerpActive = false;
-    }
-    /** Sets the look at target from an assigned lookAtConstraint source by index */
-    setLookTargetFromConstraint(index = 0, t = 1) {
-        if (!this._controls)
-            return false;
-        const sources = this.lookAtConstraint?.sources;
-        if (sources && sources.length > 0) {
-            const target = sources[index];
-            if (target) {
-                target.getWorldPosition(this._lookTargetEndPosition);
-                this.lerpLookTarget(this._lookTargetEndPosition, t);
-                return true;
-            }
-        }
-        return false;
-    }
-    /** @deprecated use `controls.target.lerp(position, delta)` */
-    lerpTarget(position, delta) { return this.lerpLookTarget(position, delta); }
-    lerpLookTarget(position, delta) {
-        if (!this._controls)
-            return;
-        if (delta >= 1)
-            this._controls.target.copy(position);
-        else
-            this._controls.target.lerp(position, delta);
-    }
-    setTargetFromRaycast(ray) {
-        if (!this.controls)
-            return;
-        const rc = ray ? this.context.physics.raycastFromRay(ray) : this.context.physics.raycast();
-        for (const hit of rc) {
-            if (hit.distance > 0 && GameObject.isActiveInHierarchy(hit.object)) {
-                const uiComponent = tryGetUIComponent(hit.object);
-                if (uiComponent) {
-                    const canvas = uiComponent.canvas;
-                    if (canvas?.screenspace) {
-                        break;
-                    }
-                }
-                this.setLookTargetPosition(hit.point);
-                if (this.context.mainCamera) {
-                    const pos = getWorldPosition(this.context.mainCamera);
-                    const cameraTarget = pos.clone().sub(this.controls.target).add(this._lookTargetEndPosition);
-                    this._cameraObject?.parent?.worldToLocal(cameraTarget);
-                    this.setCameraTargetPosition(cameraTarget);
-                }
-                break;
-            }
-        }
-    }
-    // Adapted from https://discourse.threejs.org/t/camera-zoom-to-fit-object/936/24
-    // Slower but better implementation that takes bones and exact vertex positions into account: https://github.com/google/model-viewer/blob/04e900c5027de8c5306fe1fe9627707f42811b05/packages/model-viewer/src/three-components/ModelScene.ts#L321
-    /** Fits the camera to show the objects provided (defaults to the scene if no objects are passed in) */
-    fitCamera(objects, fitOffset = 1.1, immediate = true) {
-        const camera = this._cameraObject;
-        const controls = this._controls;
-        if (!objects?.length)
-            objects = this.context.scene.children;
-        if (objects.length <= 0)
-            return;
-        if (!camera || !controls)
-            return;
-        const size = new Vector3();
-        const center = new Vector3();
-        const box = new Box3();
-        // TODO would be much better to calculate the bounds in camera space instead of world space - 
-        // we would get proper view-dependant fit.
-        // Right now it's independent from where the camera is actually looking from,
-        // and thus we're just getting some maximum that will work for sure.
-        box.makeEmpty();
-        const emptyChildren = [];
-        function expandByObjectRecursive(obj) {
-            let allowExpanding = true;
-            // we dont want to check invisible objects
-            if (!obj.visible)
-                return;
-            if (useForAutoFit(obj) === false)
-                return;
-            if (obj.type === "TransformControlsGizmo" || obj.type === "TransformControlsPlane")
-                return;
-            // ignore Box3Helpers
-            if (obj instanceof Box3Helper)
-                allowExpanding = false;
-            if (obj instanceof GridHelper)
-                allowExpanding = false;
-            // ignore GroundProjectedEnv
-            if (obj instanceof GroundProjectedSkybox)
-                allowExpanding = false;
-            // // Ignore shadow catcher geometry
-            if (obj.material instanceof ShadowMaterial)
-                allowExpanding = false;
-            // ONLY fit meshes
-            if (!(obj instanceof Mesh))
-                allowExpanding = false;
-            // Ignore things parented to the camera + ignore the camera
-            if (obj === camera)
-                return;
-            // We don't want to fit UI objects
-            if (obj["isUI"] === true)
-                return;
-            // If we encountered some geometry that should be ignored
-            // Then we don't want to use that for expanding the view
-            if (allowExpanding) {
-                if (debugCameraFit)
-                    console.log(obj.name, obj.type, obj);
-                // Temporary override children
-                const children_length = obj.children;
-                obj.children = emptyChildren;
-                // TODO: validate that object doesn't contain NaN values
-                const pos = obj.position;
-                const scale = obj.scale;
-                if (Number.isNaN(pos.x) || Number.isNaN(pos.y) || Number.isNaN(pos.z)) {
-                    console.warn(`Object \"${obj.name}\" has NaN values in position or scale.... will ignore it`, pos, scale);
-                    return;
-                }
-                box.expandByObject(obj, true);
-                obj.children = children_length;
-            }
-            for (const child of obj.children) {
-                expandByObjectRecursive(child);
-            }
-        }
-        for (const object of objects) {
-            object.updateMatrixWorld();
-            expandByObjectRecursive(object);
-        }
-        camera.updateMatrixWorld();
-        camera.updateProjectionMatrix();
-        box.getCenter(center);
-        // project this box into camera space
-        box.applyMatrix4(camera.matrixWorldInverse);
-        box.getSize(size);
-        box.setFromCenterAndSize(center, size);
-        if (Number.isNaN(size.x) || Number.isNaN(size.y) || Number.isNaN(size.z)) {
-            console.warn("Camera fit size resultet in NaN", camera, box, [...objects]);
-            return;
-        }
-        if (size.length() <= 0.0000000001) {
-            if (debugCameraFit)
-                console.warn("Camera fit size is zero", box, [...objects]);
-            return;
-        }
-        const verticalFov = camera.fov;
-        const horizontalFov = 2 * Math.atan(Math.tan(verticalFov * Math.PI / 360 / 2) * camera.aspect) / Math.PI * 360;
-        const fitHeightDistance = size.y / (2 * Math.atan(Math.PI * verticalFov / 360));
-        const fitWidthDistance = size.x / (2 * Math.atan(Math.PI * horizontalFov / 360));
-        const distance = fitOffset * Math.max(fitHeightDistance, fitWidthDistance) + size.z / 2;
-        if (debugCameraFit) {
-            console.log("Fit camera to objects", fitHeightDistance, fitWidthDistance, "distance", distance);
-        }
-        const cameraWp = getWorldPosition(camera);
-        const direction = controls.target.clone()
-            .sub(cameraWp)
-            .normalize()
-            .multiplyScalar(distance);
-        controls.maxDistance = distance * 10;
-        controls.minDistance = distance * 0.01;
-        this.setLookTargetPosition(center, immediate);
-        this.autoTarget = false;
-        // TODO: this doesnt take the Camera component nearClipPlane into account
-        camera.near = distance / 100;
-        camera.far = distance * 100;
-        camera.updateMatrixWorld();
-        camera.updateProjectionMatrix();
-        if (camera.parent) {
-            const cameraLocalPosition = camera.parent.worldToLocal(controls.target.clone().sub(direction));
-            this.setCameraTargetPosition(cameraLocalPosition, immediate);
-        }
-        else
-            console.error(`Can not fit camera ${camera.name} because it has no parent`);
-        // setWorldPosition(camera, controls.target.clone().sub(direction));
-        if (debugCameraFit) {
-            const helper = new Box3Helper(box);
-            this.context.scene.add(helper);
-            setWorldRotation(helper, getWorldRotation(camera));
-            if (!this._haveAttachedKeyboardEvents) {
-                this._haveAttachedKeyboardEvents = true;
-                document.body.addEventListener("keydown", (e) => {
-                    if (e.code === "KeyF") {
-                        this.fitCamera(objects);
-                    }
-                });
-            }
-        }
-        controls.update();
-    }
-    _haveAttachedKeyboardEvents = false;
-}
-__decorate([
-    serializable()
-], OrbitControls.prototype, "autoFit", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "enableRotate", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "autoRotate", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "autoRotateSpeed", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "enableKeys", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "enableDamping", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "dampingFactor", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "enableZoom", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "minZoom", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "maxZoom", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "enablePan", void 0);
-__decorate([
-    serializable(LookAtConstraint)
-], OrbitControls.prototype, "lookAtConstraint", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "lookAtConstraint01", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "allowInterrupt", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "middleClickToFocus", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "doubleClickToFocus", void 0);
-__decorate([
-    serializable()
-], OrbitControls.prototype, "targetLerpDuration", void 0);
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Behaviour, GameObject } from "./Component.js";
+import { Camera } from "./Camera.js";
+import { LookAtConstraint } from "./LookAtConstraint.js";
+import { getWorldDirection, getWorldPosition, getWorldRotation, setWorldRotation } from "../engine/engine_three_utils.js";
+import { RaycastOptions } from "../engine/engine_physics.js";
+import { serializable } from "../engine/engine_serialization_decorator.js";
+import { getParam, isMobileDevice } from "../engine/engine_utils.js";
+import { Box3, Object3D, Vector2, Vector3, Box3Helper, GridHelper, Mesh, ShadowMaterial, Ray } from "three";
+import { OrbitControls as ThreeOrbitControls } from "three/examples/jsm/controls/OrbitControls.js";
+import { EventSystem, EventSystemEvents } from "./ui/EventSystem.js";
+import { setCameraController, useForAutoFit } from "../engine/engine_camera.js";
+import { SyncedTransform } from "./SyncedTransform.js";
+import { tryGetUIComponent } from "./ui/Utils.js";
+import { GroundProjectedSkybox } from "three/examples/jsm/objects/GroundProjectedSkybox.js";
+import { Mathf } from "../engine/engine_math.js";
+const freeCam = getParam("freecam");
+const debugCameraFit = getParam("debugcamerafit");
+const smoothcam = getParam("smoothcam");
+const disabledKeys = { LEFT: "", UP: "", RIGHT: "", BOTTOM: "" };
+let defaultKeys = undefined;
+export var OrbitControlsEventsType;
+(function (OrbitControlsEventsType) {
+    /** Invoked with a CameraTargetReachedEvent */
+    OrbitControlsEventsType["CameraTargetReached"] = "target-reached";
+})(OrbitControlsEventsType || (OrbitControlsEventsType = {}));
+export class CameraTargetReachedEvent extends CustomEvent {
+    constructor(ctrls, type) {
+        super(OrbitControlsEventsType.CameraTargetReached, {
+            detail: {
+                controls: ctrls,
+                type: type,
+            }
+        });
+    }
+}
+export class OrbitControls extends Behaviour {
+    get isCameraController() {
+        return true;
+    }
+    /** The underlying three.js OrbitControls */
+    get controls() {
+        return this._controls;
+    }
+    /** The object being controlled by the OrbitControls (usually the camera) */
+    get controllerObject() {
+        return this._cameraObject;
+    }
+    /** Register callback when user starts interacting with the orbit controls */
+    onStartInteraction(callback) {
+        this.controls?.addEventListener("start", callback);
+    }
+    /** When enabled the scene will be automatically fitted into the camera view in onEnable */
+    autoFit = false;
+    enableRotate = true;
+    autoRotate = false;
+    autoRotateSpeed = 1.0;
+    enableKeys = true;
+    enableDamping = true;
+    dampingFactor = 0.1;
+    enableZoom = true;
+    minZoom = 0;
+    maxZoom = Infinity;
+    enablePan = true;
+    lookAtConstraint = null;
+    lookAtConstraint01 = 1;
+    /** If true user input interrupts the camera from animating to a target */
+    allowInterrupt = true;
+    middleClickToFocus = true;
+    doubleClickToFocus = true;
+    // @serializable()
+    // zoomToCursor: boolean = false;
+    // remove once slerp works correctly
+    useSlerp = true;
+    debugLog = false;
+    /**
+     * @deprecated use `targetLerpDuration` instead
+     * ~~The speed at which the camera target and the camera will be lerping to their destinations (if set via script or user input)~~
+     * */
+    get targetLerpSpeed() { return 5; }
+    set targetLerpSpeed(v) { this.targetLerpDuration = 1 / v; }
+    /** The duration in seconds it takes for the camera look ad and position lerp to reach their destination (when set via `setCameraTargetPosition` and `setLookTargetPosition`) */
+    targetLerpDuration = 1;
+    /** When enabled OrbitControls will automatically raycast find a look at target in start */
+    autoTarget = true;
+    _controls = null;
+    _cameraObject = null;
+    _lookTargetLerpActive = false;
+    _lookTargetStartPosition = new Vector3();
+    _lookTargetEndPosition = new Vector3();
+    _lookTargetLerp01 = 0;
+    _lookTargetLerpDuration = 0;
+    _cameraLerpActive = false;
+    _cameraStartPosition = new Vector3();
+    _cameraEndPosition = new Vector3();
+    _cameraLerp01 = 0;
+    _cameraLerpDuration = 0;
+    _inputs = 0;
+    _enableTime = 0; // use to disable double click when double clicking on UI
+    _startedListeningToKeyEvents = false;
+    _eventSystem;
+    _afterHandleInputFn;
+    _camera = null;
+    _syncedTransform;
+    _didStart = false;
+    targetElement = null;
+    awake() {
+        this._didStart = false;
+        this._startedListeningToKeyEvents = false;
+    }
+    start() {
+        this._didStart = true;
+        if (this.autoTarget) {
+            if (this._controls) {
+                const camGo = GameObject.getComponent(this.gameObject, Camera);
+                if (camGo && !this.setLookTargetFromConstraint()) {
+                    if (this.debugLog)
+                        console.log("NO TARGET");
+                    const worldPosition = getWorldPosition(camGo.cam);
+                    const distanceToCenter = worldPosition.length();
+                    const forward = new Vector3(0, 0, -distanceToCenter).applyMatrix4(camGo.cam.matrixWorld);
+                    this.setLookTargetPosition(forward, true);
+                }
+                if (this.autoTarget && !this.setLookTargetFromConstraint()) {
+                    const opts = new RaycastOptions();
+                    // center of the screen:
+                    opts.screenPoint = new Vector2(0, 0);
+                    opts.lineThreshold = 0.1;
+                    const hits = this.context.physics.raycast(opts);
+                    if (hits.length > 0) {
+                        this.setLookTargetPosition(hits[0].point, true);
+                    }
+                    if (debugCameraFit)
+                        console.log("OrbitControls hits", ...hits);
+                }
+                if (this.autoFit)
+                    this.fitCamera();
+            }
+        }
+        this._eventSystem = EventSystem.get(this.context) ?? undefined;
+        if (this._eventSystem) {
+            this._afterHandleInputFn = this.afterHandleInput.bind(this);
+            this._eventSystem.addEventListener(EventSystemEvents.AfterHandleInput, this._afterHandleInputFn);
+        }
+    }
+    onDestroy() {
+        this._controls?.dispose();
+        this._eventSystem?.removeEventListener(EventSystemEvents.AfterHandleInput, this._afterHandleInputFn);
+    }
+    onEnable() {
+        this._enableTime = this.context.time.time;
+        const cameraComponent = GameObject.getComponent(this.gameObject, Camera);
+        this._camera = cameraComponent;
+        const cam = cameraComponent?.cam;
+        if (cam)
+            setCameraController(cam, this, true);
+        if (!this._controls) {
+            if (!cam) {
+                console.warn("OrbitControls: Requires a Camera component on the same object as this component.");
+                return;
+            }
+            if (cam)
+                this._cameraObject = cam;
+            // Using the parent if possible to make it possible to disable input on the canvas
+            // for having HTML content behind it and still receive input
+            const element = this.targetElement ?? this.context.renderer.domElement;
+            // HACK: workaround for three orbit controls forcing an update when being created....
+            const mat = cam?.quaternion.clone();
+            this._controls = new ThreeOrbitControls(cam, element);
+            cam?.quaternion.copy(mat);
+            if (defaultKeys === undefined)
+                defaultKeys = { ...this._controls.keys };
+        }
+        if (this._controls) {
+            if (freeCam) {
+                this.enablePan = true;
+                this.enableZoom = true;
+                this.middleClickToFocus = true;
+                if (isMobileDevice())
+                    this.doubleClickToFocus = true;
+            }
+            this._controls.addEventListener("start", this.onControlsChangeStarted);
+            if (cam?.type === "PerspectiveCamera") {
+                if (freeCam) {
+                    // dont set limits
+                }
+                else {
+                    this._controls.minDistance = this.minZoom;
+                    this._controls.maxDistance = this.maxZoom;
+                }
+            }
+            else {
+                if (freeCam) {
+                    // dont set limits
+                }
+                else {
+                    this._controls.minZoom = this.minZoom;
+                    this._controls.maxZoom = this.maxZoom;
+                }
+            }
+            if (!this._startedListeningToKeyEvents) {
+                this._startedListeningToKeyEvents = true;
+                this._controls.listenToKeyEvents(window.document.body);
+            }
+        }
+        this._syncedTransform = GameObject.getComponent(this.gameObject, SyncedTransform) ?? undefined;
+        // if we autofit in onEnable then DragControls will trigger fitting every time (because they disable OrbitControls)
+        // that's confusing and not what we want
+        // if (this._didStart) {
+        //     if (this.autoFit) this.fitCamera()
+        // }
+    }
+    onDisable() {
+        if (this._camera?.cam) {
+            setCameraController(this._camera.cam, this, false);
+        }
+        if (this._controls) {
+            this._controls.enabled = false;
+            this._controls.autoRotate = false;
+            this._controls.removeEventListener("start", this.onControlsChangeStarted);
+            // this._controls.reset();
+        }
+    }
+    onControlsChangeStarted = () => {
+        if (this._syncedTransform) {
+            this._syncedTransform.requestOwnership();
+        }
+    };
+    _shouldDisable = false;
+    afterHandleInput(evt) {
+        if (evt.detail.args.pointerId === 0) {
+            if (evt.detail.args.isDown) {
+                if (this._controls && this._eventSystem) {
+                    this._shouldDisable = this._eventSystem.hasActiveUI;
+                }
+            }
+            else if (!evt.detail.args.isPressed || evt.detail.args.isUp) {
+                this._shouldDisable = false;
+            }
+        }
+    }
+    onBeforeRender() {
+        if (!this._controls)
+            return;
+        if (this._cameraObject !== this.context.mainCamera)
+            return;
+        if (this.context.input.getPointerDown(1) || this.context.input.getPointerDown(2) || this.context.input.mouseWheelChanged || (this.context.input.getPointerPressed(0) && this.context.input.getPointerPositionDelta(0)?.length() || 0 > .1)) {
+            this._inputs += 1;
+        }
+        if (this._inputs > 0 && this.allowInterrupt) {
+            // if a user has disabled rotation but enabled auto rotate we don't want to change it when we receive input
+            if (this.enableRotate) {
+                this.autoRotate = false;
+            }
+            this._cameraLerpActive = false;
+            this._lookTargetLerpActive = false;
+        }
+        this._inputs = 0;
+        let focusAtPointer = (this.middleClickToFocus && this.context.input.getPointerClicked(1));
+        focusAtPointer ||= (this.doubleClickToFocus && this.context.input.getPointerDoubleClicked(0) && this.context.time.time - this._enableTime > .3);
+        if (focusAtPointer) {
+            this.setTargetFromRaycast();
+        }
+        if (this._lookTargetLerpActive || this._cameraLerpActive) {
+            // lerp the camera
+            if (this._cameraLerpActive && this._cameraObject) {
+                this._cameraLerp01 += this.context.time.deltaTime / this._cameraLerpDuration;
+                if (this._cameraLerp01 >= 1) {
+                    this._cameraObject.position.copy(this._cameraEndPosition);
+                    this._cameraLerpActive = false;
+                    this.dispatchEvent(new CameraTargetReachedEvent(this, "camera"));
+                }
+                else {
+                    const t = Mathf.easeInOutCubic(this._cameraLerp01);
+                    this._cameraObject.position.lerpVectors(this._cameraStartPosition, this._cameraEndPosition, t);
+                }
+            }
+            // lerp the look target
+            if (this._lookTargetLerpActive) {
+                this._lookTargetLerp01 += this.context.time.deltaTime / this._lookTargetLerpDuration;
+                if (this._lookTargetLerp01 >= 1) {
+                    this._controls.target.copy(this._lookTargetEndPosition);
+                    this._lookTargetLerpActive = false;
+                    this.dispatchEvent(new CameraTargetReachedEvent(this, "lookat"));
+                }
+                else {
+                    const t = Mathf.easeInOutCubic(this._lookTargetLerp01);
+                    this._controls.target.lerpVectors(this._lookTargetStartPosition, this._lookTargetEndPosition, t);
+                }
+            }
+        }
+        if (this._controls) {
+            if (this.debugLog)
+                this._controls.domElement = this.context.renderer.domElement;
+            this._controls.enabled = !this._shouldDisable && this._camera === this.context.mainCameraComponent && !this.context.isInXR;
+            this._controls.keys = this.enableKeys ? defaultKeys : disabledKeys;
+            this._controls.autoRotate = this.autoRotate;
+            this._controls.autoRotateSpeed = this.autoRotateSpeed;
+            this._controls.enableZoom = this.enableZoom;
+            this._controls.enableDamping = this.enableDamping;
+            this._controls.dampingFactor = this.dampingFactor;
+            this._controls.enablePan = this.enablePan;
+            this._controls.enableRotate = this.enableRotate;
+            if (typeof smoothcam === "number" || smoothcam === true) {
+                this._controls.enableDamping = true;
+                const factor = typeof smoothcam === "number" ? smoothcam : .99;
+                this._controls.dampingFactor = Math.max(.001, 1 - Math.min(1, factor));
+            }
+            if (!this.allowInterrupt) {
+                if (this._lookTargetLerpActive) {
+                    this._controls.enablePan = false;
+                }
+                if (this._cameraLerpActive) {
+                    this._controls.enableRotate = false;
+                    this._controls.autoRotate = false;
+                }
+                if (this._lookTargetLerpActive || this._cameraLerpActive) {
+                    this._controls.enableZoom = false;
+                }
+            }
+            //@ts-ignore
+            // this._controls.zoomToCursor = this.zoomToCursor;
+            if (!this.context.isInXR) {
+                if (!freeCam && this.lookAtConstraint?.locked)
+                    this.setLookTargetFromConstraint(0, this.lookAtConstraint01);
+                this._controls.update();
+            }
+        }
+    }
+    /**
+     * Sets camera target position and look direction. Does perform a raycast in the forward direction of the passed in object to find an orbit point
+     */
+    setCameraAndLookTarget(target) {
+        if (!target || !(target instanceof Object3D))
+            return;
+        const worldPosition = getWorldPosition(target);
+        const forward = getWorldDirection(target);
+        this.setTargetFromRaycast(new Ray(worldPosition, forward));
+        this.setCameraTargetPosition(worldPosition);
+    }
+    /** Moves the camera to position smoothly.
+     * @param position The position in local space of the controllerObject to move the camera to. If null the camera will stop lerping to the target.
+    */
+    setCameraTargetPosition(position, immediateOrDuration = false) {
+        if (!position)
+            return;
+        if (position instanceof Object3D) {
+            position = getWorldPosition(position);
+        }
+        if (!this._cameraEndPosition)
+            this._cameraEndPosition = new Vector3();
+        this._cameraEndPosition.copy(position);
+        if (immediateOrDuration === true) {
+            this._cameraLerpActive = false;
+            this.controllerObject?.position.copy(this._cameraEndPosition);
+        }
+        else if (this._cameraObject) {
+            this._cameraLerpActive = true;
+            this._cameraLerp01 = 0;
+            this._cameraStartPosition.copy(this._cameraObject?.position);
+            if (typeof immediateOrDuration === "number") {
+                this._cameraLerpDuration = immediateOrDuration;
+            }
+            else
+                this._cameraLerpDuration = this.targetLerpDuration;
+        }
+    }
+    /** True while the camera position is being lerped */
+    get cameraLerpActive() { return this._cameraLerpActive; }
+    /** Call to stop camera position lerping */
+    stopCameraLerp() {
+        this._cameraLerpActive = false;
+    }
+    /** Moves the camera look-at target to a position smoothly. */
+    setLookTargetPosition(position = null, immediateOrDuration = false) {
+        if (!this._controls)
+            return;
+        if (!position)
+            return;
+        if (position instanceof Object3D) {
+            position = getWorldPosition(position);
+        }
+        this._lookTargetEndPosition.copy(position);
+        if (immediateOrDuration === true) {
+            this._controls.target.copy(this._lookTargetEndPosition);
+        }
+        else {
+            this._lookTargetLerpActive = true;
+            this._lookTargetLerp01 = 0;
+            this._lookTargetStartPosition.copy(this._controls.target);
+            if (typeof immediateOrDuration === "number") {
+                this._lookTargetLerpDuration = immediateOrDuration;
+            }
+            else
+                this._lookTargetLerpDuration = this.targetLerpDuration;
+        }
+    }
+    /** True while the camera look target is being lerped */
+    get lookTargetLerpActive() { return this._lookTargetLerpActive; }
+    /** Call to stop camera look target lerping */
+    stopLookTargetLerp() {
+        this._lookTargetLerpActive = false;
+    }
+    /** Sets the look at target from an assigned lookAtConstraint source by index */
+    setLookTargetFromConstraint(index = 0, t = 1) {
+        if (!this._controls)
+            return false;
+        const sources = this.lookAtConstraint?.sources;
+        if (sources && sources.length > 0) {
+            const target = sources[index];
+            if (target) {
+                target.getWorldPosition(this._lookTargetEndPosition);
+                this.lerpLookTarget(this._lookTargetEndPosition, t);
+                return true;
+            }
+        }
+        return false;
+    }
+    /** @deprecated use `controls.target.lerp(position, delta)` */
+    lerpTarget(position, delta) { return this.lerpLookTarget(position, delta); }
+    lerpLookTarget(position, delta) {
+        if (!this._controls)
+            return;
+        if (delta >= 1)
+            this._controls.target.copy(position);
+        else
+            this._controls.target.lerp(position, delta);
+    }
+    setTargetFromRaycast(ray) {
+        if (!this.controls)
+            return;
+        const rc = ray ? this.context.physics.raycastFromRay(ray) : this.context.physics.raycast();
+        for (const hit of rc) {
+            if (hit.distance > 0 && GameObject.isActiveInHierarchy(hit.object)) {
+                const uiComponent = tryGetUIComponent(hit.object);
+                if (uiComponent) {
+                    const canvas = uiComponent.canvas;
+                    if (canvas?.screenspace) {
+                        break;
+                    }
+                }
+                this.setLookTargetPosition(hit.point);
+                if (this.context.mainCamera) {
+                    const pos = getWorldPosition(this.context.mainCamera);
+                    const cameraTarget = pos.clone().sub(this.controls.target).add(this._lookTargetEndPosition);
+                    this._cameraObject?.parent?.worldToLocal(cameraTarget);
+                    this.setCameraTargetPosition(cameraTarget);
+                }
+                break;
+            }
+        }
+    }
+    // Adapted from https://discourse.threejs.org/t/camera-zoom-to-fit-object/936/24
+    // Slower but better implementation that takes bones and exact vertex positions into account: https://github.com/google/model-viewer/blob/04e900c5027de8c5306fe1fe9627707f42811b05/packages/model-viewer/src/three-components/ModelScene.ts#L321
+    /** Fits the camera to show the objects provided (defaults to the scene if no objects are passed in) */
+    fitCamera(objects, fitOffset = 1.1, immediate = true) {
+        const camera = this._cameraObject;
+        const controls = this._controls;
+        if (!objects?.length)
+            objects = this.context.scene.children;
+        if (objects.length <= 0)
+            return;
+        if (!camera || !controls)
+            return;
+        const size = new Vector3();
+        const center = new Vector3();
+        const box = new Box3();
+        // TODO would be much better to calculate the bounds in camera space instead of world space - 
+        // we would get proper view-dependant fit.
+        // Right now it's independent from where the camera is actually looking from,
+        // and thus we're just getting some maximum that will work for sure.
+        box.makeEmpty();
+        const emptyChildren = [];
+        function expandByObjectRecursive(obj) {
+            let allowExpanding = true;
+            // we dont want to check invisible objects
+            if (!obj.visible)
+                return;
+            if (useForAutoFit(obj) === false)
+                return;
+            if (obj.type === "TransformControlsGizmo" || obj.type === "TransformControlsPlane")
+                return;
+            // ignore Box3Helpers
+            if (obj instanceof Box3Helper)
+                allowExpanding = false;
+            if (obj instanceof GridHelper)
+                allowExpanding = false;
+            // ignore GroundProjectedEnv
+            if (obj instanceof GroundProjectedSkybox)
+                allowExpanding = false;
+            // // Ignore shadow catcher geometry
+            if (obj.material instanceof ShadowMaterial)
+                allowExpanding = false;
+            // ONLY fit meshes
+            if (!(obj instanceof Mesh))
+                allowExpanding = false;
+            // Ignore things parented to the camera + ignore the camera
+            if (obj === camera)
+                return;
+            // We don't want to fit UI objects
+            if (obj["isUI"] === true)
+                return;
+            // If we encountered some geometry that should be ignored
+            // Then we don't want to use that for expanding the view
+            if (allowExpanding) {
+                if (debugCameraFit)
+                    console.log(obj.name, obj.type, obj);
+                // Temporary override children
+                const children_length = obj.children;
+                obj.children = emptyChildren;
+                // TODO: validate that object doesn't contain NaN values
+                const pos = obj.position;
+                const scale = obj.scale;
+                if (Number.isNaN(pos.x) || Number.isNaN(pos.y) || Number.isNaN(pos.z)) {
+                    console.warn(`Object \"${obj.name}\" has NaN values in position or scale.... will ignore it`, pos, scale);
+                    return;
+                }
+                box.expandByObject(obj, true);
+                obj.children = children_length;
+            }
+            for (const child of obj.children) {
+                expandByObjectRecursive(child);
+            }
+        }
+        for (const object of objects) {
+            object.updateMatrixWorld();
+            expandByObjectRecursive(object);
+        }
+        camera.updateMatrixWorld();
+        camera.updateProjectionMatrix();
+        box.getCenter(center);
+        // project this box into camera space
+        box.applyMatrix4(camera.matrixWorldInverse);
+        box.getSize(size);
+        box.setFromCenterAndSize(center, size);
+        if (Number.isNaN(size.x) || Number.isNaN(size.y) || Number.isNaN(size.z)) {
+            console.warn("Camera fit size resultet in NaN", camera, box, [...objects]);
+            return;
+        }
+        if (size.length() <= 0.0000000001) {
+            if (debugCameraFit)
+                console.warn("Camera fit size is zero", box, [...objects]);
+            return;
+        }
+        const verticalFov = camera.fov;
+        const horizontalFov = 2 * Math.atan(Math.tan(verticalFov * Math.PI / 360 / 2) * camera.aspect) / Math.PI * 360;
+        const fitHeightDistance = size.y / (2 * Math.atan(Math.PI * verticalFov / 360));
+        const fitWidthDistance = size.x / (2 * Math.atan(Math.PI * horizontalFov / 360));
+        const distance = fitOffset * Math.max(fitHeightDistance, fitWidthDistance) + size.z / 2;
+        if (debugCameraFit) {
+            console.log("Fit camera to objects", fitHeightDistance, fitWidthDistance, "distance", distance);
+        }
+        const cameraWp = getWorldPosition(camera);
+        const direction = controls.target.clone()
+            .sub(cameraWp)
+            .normalize()
+            .multiplyScalar(distance);
+        controls.maxDistance = distance * 10;
+        controls.minDistance = distance * 0.01;
+        this.setLookTargetPosition(center, immediate);
+        this.autoTarget = false;
+        // TODO: this doesnt take the Camera component nearClipPlane into account
+        camera.near = distance / 100;
+        camera.far = distance * 100;
+        camera.updateMatrixWorld();
+        camera.updateProjectionMatrix();
+        if (camera.parent) {
+            const cameraLocalPosition = camera.parent.worldToLocal(controls.target.clone().sub(direction));
+            this.setCameraTargetPosition(cameraLocalPosition, immediate);
+        }
+        else
+            console.error(`Can not fit camera ${camera.name} because it has no parent`);
+        // setWorldPosition(camera, controls.target.clone().sub(direction));
+        if (debugCameraFit) {
+            const helper = new Box3Helper(box);
+            this.context.scene.add(helper);
+            setWorldRotation(helper, getWorldRotation(camera));
+            if (!this._haveAttachedKeyboardEvents) {
+                this._haveAttachedKeyboardEvents = true;
+                document.body.addEventListener("keydown", (e) => {
+                    if (e.code === "KeyF") {
+                        this.fitCamera(objects);
+                    }
+                });
+            }
+        }
+        controls.update();
+    }
+    _haveAttachedKeyboardEvents = false;
+}
+__decorate([
+    serializable()
+], OrbitControls.prototype, "autoFit", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "enableRotate", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "autoRotate", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "autoRotateSpeed", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "enableKeys", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "enableDamping", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "dampingFactor", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "enableZoom", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "minZoom", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "maxZoom", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "enablePan", void 0);
+__decorate([
+    serializable(LookAtConstraint)
+], OrbitControls.prototype, "lookAtConstraint", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "lookAtConstraint01", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "allowInterrupt", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "middleClickToFocus", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "doubleClickToFocus", void 0);
+__decorate([
+    serializable()
+], OrbitControls.prototype, "targetLerpDuration", void 0);
 //# sourceMappingURL=OrbitControls.js.map