@needle-tools/engine 4.10.0-next.4f9d92a → 4.10.0-next.55c0bf9

package/src/engine-components/web/ViewBox.ts

@@ -1,202 +0,0 @@
-import { Camera, PerspectiveCamera, Vector2, Vector3 } from "three";
-
-import { isDevEnvironment } from "../../engine/debug/debug.js";
-import { Gizmos } from "../../engine/engine_gizmos.js";
-import { serializable } from "../../engine/engine_serialization_decorator.js";
-import { getTempVector } from "../../engine/engine_three_utils.js";
-import { registerType } from "../../engine/engine_typestore.js";
-import { getParam } from "../../engine/engine_utils.js";
-import { Behaviour } from "../Component.js";
-
-const debugParam = getParam("debugviewbox");
-
-@registerType
-export class ViewBox extends Behaviour {
-
-    static instances: ViewBox[] = [];
-
-    @serializable()
-    referenceFieldOfView: number = 60;
-
-    @serializable()
-    debug: boolean = false;
-
-    awake() {
-        // this.referenceFieldOfView = (this.context.mainCamera as PerspectiveCamera)?.fov || 60;
-        // setInterval(()=>{
-        //     this.enabled = !this.enabled
-        // }, 1000)
-    }
-    onEnable(): void {
-        if (debugParam || this.debug || isDevEnvironment()) console.debug("[ViewBox] Using camera fov:", this.referenceFieldOfView);
-        ViewBox.instances.push(this);
-    }
-
-    onDisable(): void {
-        const idx = ViewBox.instances.indexOf(this);
-        if (idx !== -1) ViewBox.instances.splice(idx, 1);
-    }
-
-    onBeforeRender() {
-        if (this.context.isInXR) return;
-        const isActive = ViewBox.instances[ViewBox.instances.length - 1] === this;
-        if (!isActive) {
-            if (debugParam || this.debug) Gizmos.DrawWireBox(this.gameObject.worldPosition, this.gameObject.worldScale, 0x333333);
-            return;
-        }
-        if (debugParam || this.debug) Gizmos.DrawWireBox(this.gameObject.worldPosition, this.gameObject.worldScale, 0xdddd00);
-
-        // calculate box size to fit the camera frustrum size at the current position (just scale)
-        const camera = this.context.mainCamera;
-        if (!camera) return;
-        if (!(camera instanceof PerspectiveCamera)) {
-            // TODO: support orthographic camera
-            return;
-        }
-
-        if (this.referenceFieldOfView === undefined || this.referenceFieldOfView <= 0) {
-            if (debugParam || this.debug) console.warn("[ViewBox] No valid referenceFieldOfView set, cannot adjust box size:", this.referenceFieldOfView);
-            return;
-        }
-
-        const domWidth = this.context.domWidth;
-        const domHeight = this.context.domHeight;
-
-        let rectPosX = 0;
-        let rectPosY = 0;
-        let rectWidth = domWidth;
-        let rectHeight = domHeight;
-        let diffWidth = 1;
-        let diffHeight = 1;
-        // use focus rect if available
-        const focusRectSize = this.context.focusRectSize;
-        if (focusRectSize) {
-            // console.log(focusRectSize)
-            rectPosX = focusRectSize.x;
-            rectPosY = focusRectSize.y;
-            rectWidth = focusRectSize.width;
-            rectHeight = focusRectSize.height;
-            diffWidth = domWidth / rectWidth;
-            diffHeight = domHeight / rectHeight;
-        }
-
-        // const view = camera.view;
-        const view = camera.view;
-        const zoom = camera.zoom;
-        const aspect = camera.aspect;
-        const fov = camera.fov;
-        camera.view = null;
-        camera.zoom = 1;
-        // camera.aspect = rectWidth / rectHeight;
-        camera.fov = this.referenceFieldOfView;
-        camera.updateProjectionMatrix();
-
-        const boxPosition = this.gameObject.worldPosition;
-        const boxScale = this.gameObject.worldScale;
-
-
-
-        // const fov = this.referenceFieldOfView
-        const distance = camera.worldPosition.distanceTo(boxPosition);
-        const vFOV = this.referenceFieldOfView * Math.PI / 180; // convert vertical fov to radians
-        const height = 2 * Math.tan(vFOV / 2) * distance; // visible height
-        const width = height * camera.aspect; // visible width
-
-        const projectedBox = this.projectBoxIntoCamera(boxPosition, boxScale, camera, height * .5);
-        const boxWidth = (projectedBox.maxX - projectedBox.minX);
-        const boxHeight = (projectedBox.maxY - projectedBox.minY);
-
-        // TODO: take the rect size different into account
-        const scale = this.fit(
-            boxWidth * camera.aspect,
-            boxHeight,
-            width / diffWidth,
-            height / diffHeight
-        );
-        const vec = getTempVector(boxPosition);
-        vec.project(camera);
-        this.context.focusRectSettings.offsetX = vec.x;
-        this.context.focusRectSettings.offsetY = vec.y;
-        this.context.focusRectSettings.zoom = scale;
-        // if we don't have a focus rect yet, set it to the dom element
-        if (!this.context.focusRect) this.context.setCameraFocusRect(this.context.domElement);
-
-        // Reset values
-        camera.view = view;
-        camera.zoom = zoom;
-        camera.aspect = aspect;
-        camera.fov = fov;
-        // camera.updateProjectionMatrix();
-
-
-        // BACKLOG: some code for box scale of an object (different component)
-        // this.gameObject.worldScale = getTempVector(width, height, worldscale.z);
-        // this.gameObject.scale.multiplyScalar(.98)
-        // const minscale = Math.min(width, height);
-        // console.log(width, height);
-        // this.gameObject.worldScale = getTempVector(scale, scale, scale);
-    }
-
-
-    /**
-     * Cover fit
-     */
-    private fit(width1: number, height1: number, width2: number, height2: number) {
-        const scaleX = width2 / width1;
-        const scaleY = height2 / height1;
-        return Math.min(scaleX, scaleY);
-    }
-
-
-
-    private projectBoxIntoCamera(position: Vector3, scale: Vector3, camera: Camera, diff: number) {
-
-        const factor = .5 * diff;
-
-        const corners = [
-            getTempVector(-scale.x * factor, -scale.y * factor, -scale.z * factor),
-            getTempVector(scale.x * factor, -scale.y * factor, -scale.z * factor),
-            getTempVector(-scale.x * factor, scale.y * factor, -scale.z * factor),
-            getTempVector(scale.x * factor, scale.y * factor, -scale.z * factor),
-            getTempVector(-scale.x * factor, -scale.y * factor, scale.z * factor),
-            getTempVector(scale.x * factor, -scale.y * factor, scale.z * factor),
-            getTempVector(-scale.x * factor, scale.y * factor, scale.z * factor),
-            getTempVector(scale.x * factor, scale.y * factor, scale.z * factor),
-        ];
-        let minX = Number.POSITIVE_INFINITY;
-        let maxX = Number.NEGATIVE_INFINITY;
-        let minY = Number.POSITIVE_INFINITY;
-        let maxY = Number.NEGATIVE_INFINITY;
-        for (let i = 0; i < corners.length; i++) {
-            const c = corners[i];
-            c.add(position);
-            c.project(camera);
-            if (c.x < minX) minX = c.x;
-            if (c.x > maxX) maxX = c.x;
-            if (c.y < minY) minY = c.y;
-            if (c.y > maxY) maxY = c.y;
-        }
-
-        // if(!this._projectedBoxElement) {
-        //     this._projectedBoxElement = document.createElement("div");
-        // this.context.domElement.appendChild(this._projectedBoxElement);
-        // }
-        // this._projectedBoxElement.style.position = "fixed";
-        // this._projectedBoxElement.style.outline = "10px solid red";
-        // this._projectedBoxElement.style.left = ((minX * .5 + .5) * this.context.domWidth) + "px";
-        // this._projectedBoxElement.style.top = ((-maxY * .5 + .5) * this.context.domHeight) + "px";
-        // this._projectedBoxElement.style.width = ((maxX - minX) * .5 * this.context.domWidth) + "px";
-        // this._projectedBoxElement.style.height = ((maxY - minY) * .5 * this.context.domHeight) + "px";
-        // this._projectedBoxElement.style.pointerEvents = "none";
-        // this._projectedBoxElement.style.zIndex = "1000";
-
-
-        return { minX, maxX, minY, maxY };
-
-    }
-    private _projectedBoxElement: HTMLElement | null = null;
-
-
-
-
-}