@vived/app 2.8.1 → 2.11.0

package/lib/Entities/FocusCamera.d.ts

@@ -0,0 +1,70 @@
+import { Vector3 } from ".";
+export declare type OnFocusCameraChange = () => void;
+export interface FocusCameraLerper {
+    cancelLerp: () => void;
+}
+export interface FocusCameraData {
+    defaultAlpha?: number;
+    defaultBeta?: number;
+    defaultRadius?: number;
+    defaultTarget?: {
+        x: number;
+        y: number;
+        z: number;
+    };
+    nearClip?: number;
+    farClip?: number;
+    alphaLimit?: {
+        min: number;
+        max: number;
+    };
+    betaLimit?: {
+        min: number;
+        max: number;
+    };
+    radiusLimit?: {
+        min: number;
+        max: number;
+    };
+    targetLimit?: {
+        min: {
+            x: number;
+            y: number;
+            z: number;
+        };
+        max: {
+            x: number;
+            y: number;
+            z: number;
+        };
+    };
+}
+export interface FocusCamera {
+    alpha: number;
+    beta: number;
+    radius: number;
+    target: Vector3;
+    direction: Vector3;
+    cameraPosition: Vector3;
+    nearClip: number;
+    farClip: number;
+    defaultAlpha: number;
+    defaultBeta: number;
+    defaultRadius: number;
+    defaultTarget: Vector3;
+    setAlphaLimits: (min: number, max: number) => void;
+    clearAlphaLimits: () => void;
+    setBetaLimits: (min: number, max: number) => void;
+    clearBetaLimits: () => void;
+    setRadiusLimits: (min: number, max: number) => void;
+    clearRadiusLimits: () => void;
+    setTargetLimits: (min: Vector3, max: Vector3) => void;
+    clearTargetLimits: () => void;
+    registerLerp: (lerper: FocusCameraLerper) => void;
+    lerpCompleted: () => void;
+    cancelLerp: () => void;
+    applyData: (data: FocusCameraData) => void;
+    addObserver: (observer: OnFocusCameraChange) => void;
+    removeObserver: (observer: OnFocusCameraChange) => void;
+}
+export declare function makeFocusCamera(): FocusCamera;

package/lib/Entities/FocusCamera.js

@@ -0,0 +1,243 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.makeFocusCamera = void 0;
+const _1 = require(".");
+function makeFocusCamera() {
+    return new FocusCameraImp();
+}
+exports.makeFocusCamera = makeFocusCamera;
+class FocusCameraImp {
+    constructor() {
+        this.farClip = 100;
+        this.nearClip = 0.01;
+        this.defaultAlpha = 0;
+        this.defaultBeta = 30;
+        this.defaultRadius = 8;
+        this.defaultTarget = _1.Vector3.Zero();
+        this.limitRadius = false;
+        this.minRadius = 0;
+        this.maxRadius = 0;
+        this.limitAlpha = false;
+        this.minAlpha = 0;
+        this.maxAlpha = 0;
+        this.limitBeta = false;
+        this.minBeta = 0;
+        this.maxBeta = 0;
+        this.limitTarget = false;
+        this.maxTargetPosition = _1.Vector3.Zero();
+        this.minTargetPosition = _1.Vector3.Zero();
+        this.observers = new _1.ObserverList();
+        this.memoizedAlpha = new _1.MemoizedNumber(0, this.observers.notify);
+        this.memoizedBeta = new _1.MemoizedNumber(0, this.observers.notify);
+        this.memoizedRadius = new _1.MemoizedNumber(1, this.observers.notify);
+        this.memoizedTarget = new _1.MemoizedVector3(_1.Vector3.Zero(), this.observers.notify);
+        this.setRadiusLimits = (min, max) => {
+            if (min < 0) {
+                throw new Error("[Orbit Camera] Mininum Radius must be greater >= 0");
+            }
+            if (max < min) {
+                throw new Error("[Orbit Camera] Max radius must be >= min radius");
+            }
+            this.maxRadius = max;
+            this.minRadius = min;
+            this.limitRadius = true;
+            this.radius = this.radius;
+        };
+        this.clearRadiusLimits = () => {
+            this.maxRadius = 0;
+            this.minRadius = 0;
+            this.limitRadius = false;
+        };
+        this.setAlphaLimits = (min, max) => {
+            if (min > max) {
+                throw new Error("[Orbit Camera] Max alpha must be >= min alpha");
+            }
+            if (min < -180) {
+                throw new Error("[Orbit Camera] Min alpha must be >= -180");
+            }
+            if (max > 180) {
+                throw new Error("[Orbit Camera] Max alpha must be <= 180");
+            }
+            this.maxAlpha = max;
+            this.minAlpha = min;
+            this.limitAlpha = true;
+            this.alpha = this.alpha;
+        };
+        this.clearAlphaLimits = () => {
+            this.maxAlpha = 0;
+            this.minAlpha = 0;
+            this.limitAlpha = false;
+        };
+        this.setBetaLimits = (min, max) => {
+            if (min > max) {
+                throw new Error("[Orbit Camera] Max beta must be >= min beta");
+            }
+            if (min < -180) {
+                throw new Error("[Orbit Camera] Min beta must be >= -180");
+            }
+            if (max > 180) {
+                throw new Error("[Orbit Camera] Max beta must be <= 180");
+            }
+            this.maxBeta = max;
+            this.minBeta = min;
+            this.limitBeta = true;
+            this.beta = this.beta;
+        };
+        this.clearBetaLimits = () => {
+            this.maxBeta = 0;
+            this.minBeta = 0;
+            this.limitBeta = false;
+        };
+        this.setTargetLimits = (min, max) => {
+            const minArray = min.asArray();
+            const maxArray = max.asArray();
+            for (let i = 0; i < 3; i++) {
+                if (minArray[i] > maxArray[i]) {
+                    throw new Error("[Orbit Camera] Min target must be less than the max target");
+                }
+            }
+            this.maxTargetPosition = max;
+            this.minTargetPosition = min;
+            this.limitTarget = true;
+            this.target = this.target;
+        };
+        this.clearTargetLimits = () => {
+            this.maxTargetPosition = _1.Vector3.Zero();
+            this.minTargetPosition = _1.Vector3.Zero();
+            this.limitTarget = false;
+        };
+        this.registerLerp = (lerper) => {
+            if (this.currentLerp) {
+                this.currentLerp.cancelLerp();
+            }
+            this.currentLerp = lerper;
+        };
+        this.lerpCompleted = () => {
+            this.currentLerp = undefined;
+        };
+        this.cancelLerp = () => {
+            var _a;
+            (_a = this.currentLerp) === null || _a === void 0 ? void 0 : _a.cancelLerp();
+            this.currentLerp = undefined;
+        };
+        this.applyData = (data) => {
+            if (data.defaultAlpha !== undefined) {
+                this.defaultAlpha = data.defaultAlpha;
+            }
+            if (data.defaultBeta !== undefined) {
+                this.defaultBeta = data.defaultBeta;
+            }
+            if (data.defaultRadius !== undefined) {
+                this.defaultRadius = data.defaultRadius;
+            }
+            if (data.defaultTarget !== undefined) {
+                const { x, y, z } = data.defaultTarget;
+                this.defaultTarget = new _1.Vector3(x, y, z);
+            }
+            if (data.nearClip !== undefined) {
+                this.nearClip = data.nearClip;
+            }
+            if (data.farClip !== undefined) {
+                this.farClip = data.farClip;
+            }
+            if (data.alphaLimit !== undefined) {
+                this.setAlphaLimits(data.alphaLimit.min, data.alphaLimit.max);
+            }
+            if (data.betaLimit !== undefined) {
+                this.setBetaLimits(data.betaLimit.min, data.betaLimit.max);
+            }
+            if (data.radiusLimit !== undefined) {
+                this.setRadiusLimits(data.radiusLimit.min, data.radiusLimit.max);
+            }
+            if (data.targetLimit !== undefined) {
+                const { max, min } = data.targetLimit;
+                this.setTargetLimits(new _1.Vector3(min.x, min.y, min.z), new _1.Vector3(max.x, max.y, max.z));
+            }
+        };
+        this.addObserver = (observer) => {
+            this.observers.add(observer);
+        };
+        this.removeObserver = (observer) => {
+            this.observers.remove(observer);
+        };
+    }
+    get alpha() {
+        return this.memoizedAlpha.val;
+    }
+    set alpha(val) {
+        let clampedVal = this.clampAngle(val);
+        if (this.limitAlpha) {
+            clampedVal = Math.min(clampedVal, this.maxAlpha);
+            clampedVal = Math.max(clampedVal, this.minAlpha);
+        }
+        this.memoizedAlpha.val = clampedVal;
+    }
+    get beta() {
+        return this.memoizedBeta.val;
+    }
+    set beta(val) {
+        let clampedVal = this.clampAngle(val);
+        if (this.limitBeta) {
+            clampedVal = Math.min(clampedVal, this.maxBeta);
+            clampedVal = Math.max(clampedVal, this.minBeta);
+        }
+        this.memoizedBeta.val = clampedVal;
+    }
+    get radius() {
+        return this.memoizedRadius.val;
+    }
+    set radius(val) {
+        let clampedVal = Math.max(val, 0);
+        if (this.limitRadius) {
+            clampedVal = Math.min(clampedVal, this.maxRadius);
+            clampedVal = Math.max(clampedVal, this.minRadius);
+        }
+        this.memoizedRadius.val = clampedVal;
+    }
+    get target() {
+        return this.memoizedTarget.getVector();
+    }
+    set target(val) {
+        const targetVals = val.asArray();
+        if (this.limitTarget) {
+            const maxVals = this.maxTargetPosition.asArray();
+            const minVals = this.minTargetPosition.asArray();
+            for (let i = 0; i < 3; i++) {
+                let v = targetVals[i];
+                v = Math.min(v, maxVals[i]);
+                v = Math.max(v, minVals[i]);
+                targetVals[i] = v;
+            }
+        }
+        this.memoizedTarget.setVector(new _1.Vector3(targetVals[0], targetVals[1], targetVals[2]));
+    }
+    get direction() {
+        const yLength = -Math.sin(this.degToRad(this.beta));
+        const horizontalLenght = Math.cos(this.degToRad(this.beta));
+        const alphaRadians = this.degToRad(this.alpha);
+        const xLength = -horizontalLenght * Math.sin(alphaRadians);
+        const zLength = horizontalLenght * Math.cos(alphaRadians);
+        return new _1.Vector3(xLength, yLength, zLength);
+    }
+    get cameraPosition() {
+        const localOffset = this.direction.copy();
+        localOffset.setLength(-this.radius);
+        return this.target.add(localOffset);
+    }
+    degToRad(degrees) {
+        return (degrees * Math.PI) / 180;
+    }
+    clampAngle(angle) {
+        const isNegative = angle < 0 ? true : false;
+        const absAngle = Math.abs(angle);
+        const revolutions = Math.floor(absAngle / 360);
+        let angleWithoutRevolutions = absAngle - revolutions * 360;
+        if (angleWithoutRevolutions > 180) {
+            angleWithoutRevolutions = angleWithoutRevolutions - 360;
+        }
+        if (isNegative) {
+            angleWithoutRevolutions *= -1;
+        }
+        return angleWithoutRevolutions;
+    }
+}

package/lib/Entities/KeyboardInput.d.ts

@@ -1,14 +1,12 @@
-export declare type OnKeyDown = (key: string) => void;
-export declare type OnKeyUp = (key: string) => void;
+export interface KeyboardController {
+    onKeyDown?: (e: KeyboardEvent) => void;
+    onKeyUp?: (e: KeyboardEvent) => void;
+}
 export interface KeyboardInput {
     eventElement: HTMLElement | undefined;
     setEventElement: (eventElement: HTMLElement) => void;
-    removeEventElement: (eventElement: HTMLElement) => void;
     clearInputElement: () => void;
-    isKeyPressed: (key: string) => boolean;
-    addKeyDownObserver: (observer: OnKeyDown) => void;
-    removeKeyDownObserver: (observer: OnKeyDown) => void;
-    addKeyUpObserver: (observer: OnKeyUp) => void;
-    removeKeyUpObserver: (observer: OnKeyUp) => void;
+    registerController: (controller: KeyboardController) => void;
+    removeController: (controller: KeyboardController) => void;
 }
 export declare function makeKeyboardInput(): KeyboardInput;

package/lib/Entities/KeyboardInput.js

@@ -1,73 +1,51 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.makeKeyboardInput = void 0;
-const _1 = require(".");
 function makeKeyboardInput() {
     return new KeyboardInputImp();
 }
 exports.makeKeyboardInput = makeKeyboardInput;
 class KeyboardInputImp {
     constructor() {
+        this.controllers = [];
         this._eventElement = undefined;
         this.setEventElement = (element) => {
-            if (this._eventElement) {
-                this._eventElement.onkeydown = null;
-                this._eventElement.onkeyup = null;
-            }
-            element.onkeydown = (e) => {
-                this.submitKeyDown(e.code);
-            };
-            element.onkeyup = (e) => {
-                this.submitKeyUp(e.code);
-            };
+            this.clearInputElement();
+            element.addEventListener("keydown", this.submitKeyDown, false);
+            element.addEventListener("keyup", this.submitKeyUp, false);
             this._eventElement = element;
         };
-        this.removeEventElement = (eventElement) => {
-            if (this._eventElement !== eventElement)
-                return;
-            this._eventElement.onkeydown = null;
-            this._eventElement.onkeyup = null;
-            this._eventElement = undefined;
-        };
         this.clearInputElement = () => {
             if (!this._eventElement)
                 return;
-            this._eventElement.onkeydown = null;
-            this._eventElement.onkeyup = null;
-            this._eventElement = undefined;
+            this._eventElement.removeEventListener("keydown", this.submitKeyDown);
+            this._eventElement.removeEventListener("keyup", this.submitKeyUp);
         };
-        this.downObservers = new _1.ObserverList();
-        this.upObservers = new _1.ObserverList();
         this.pressedKeys = [];
-        this.submitKeyDown = (key) => {
-            if (this.pressedKeys.includes(key))
-                return;
-            this.pressedKeys.push(key);
-            this.downObservers.notify(key);
-        };
-        this.submitKeyUp = (key) => {
-            if (!this.pressedKeys.includes(key))
-                return;
-            const index = this.pressedKeys.indexOf(key);
+        this.submitKeyDown = (e) => {
+            e.preventDefault();
+            this.controllers.forEach((c) => {
+                if (c.onKeyDown) {
+                    c.onKeyDown(e);
+                }
+            });
+        };
+        this.submitKeyUp = (e) => {
+            e.preventDefault();
+            this.controllers.forEach((c) => {
+                if (c.onKeyUp) {
+                    c.onKeyUp(e);
+                }
+            });
+        };
+        this.registerController = (controller) => {
+            this.controllers.push(controller);
+        };
+        this.removeController = (controller) => {
+            const index = this.controllers.indexOf(controller);
             if (index >= 0) {
-                this.pressedKeys.splice(index, 1);
+                this.controllers.splice(index, 1);
             }
-            this.upObservers.notify(key);
-        };
-        this.isKeyPressed = (key) => {
-            return this.pressedKeys.includes(key);
-        };
-        this.addKeyDownObserver = (observer) => {
-            this.downObservers.add(observer);
-        };
-        this.removeKeyDownObserver = (observer) => {
-            this.downObservers.remove(observer);
-        };
-        this.addKeyUpObserver = (observer) => {
-            this.upObservers.add(observer);
-        };
-        this.removeKeyUpObserver = (observer) => {
-            this.upObservers.remove(observer);
         };
     }
     get eventElement() {

package/lib/Entities/MouseInput.d.ts

@@ -12,4 +12,4 @@ export interface MouseInput {
     registerController: (controller: MouseController) => void;
     removeController: (controller: MouseController) => void;
 }
-export declare function makeMouseSceneInput(): MouseInput;
+export declare function makeMouseInput(): MouseInput;

package/lib/Entities/MouseInput.js

@@ -1,24 +1,25 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.makeMouseSceneInput = void 0;
+exports.makeMouseInput = void 0;
 const _1 = require(".");
-function makeMouseSceneInput() {
+function makeMouseInput() {
     return new MouseInputImp();
 }
-exports.makeMouseSceneInput = makeMouseSceneInput;
+exports.makeMouseInput = makeMouseInput;
 class MouseInputImp {
     constructor() {
         this.controllers = [];
         this.maxClickMovement = 5; // pixels
+        this.isPressed = false;
         this._eventElement = undefined;
         this.setEventElement = (eventElement) => {
             if (this._eventElement)
                 this.clearInputElement();
-            eventElement.addEventListener("mousedown", this.onMouseDown);
-            eventElement.addEventListener("mouseup", this.onMouseUp);
-            eventElement.addEventListener("mousemove", this.onMouseMove);
-            eventElement.addEventListener("mouseout", this.onMouseOut);
-            eventElement.addEventListener("wheel", this.onWheel);
+            eventElement.addEventListener("mousedown", this.onMouseDown, false);
+            eventElement.addEventListener("mouseup", this.onMouseUp, false);
+            eventElement.addEventListener("mousemove", this.onMouseMove, false);
+            eventElement.addEventListener("mouseout", this.onMouseOut, false);
+            eventElement.addEventListener("wheel", this.onWheel, false);
             this._eventElement = eventElement;
         };
         this.clearInputElement = () => {
@@ -41,20 +42,23 @@ class MouseInputImp {
             }
         };
         this.onMouseDown = (e) => {
-            const mousePos = new _1.Vector2(e.offsetX, e.offsetY);
+            e.preventDefault();
             this.controllers.forEach((c) => {
                 if (c.onDown) {
                     c.onDown(e);
                 }
             });
+            this.isPressed = true;
             this.pressEvent = e;
         };
         this.onMouseUp = (e) => {
+            e.preventDefault();
             this.controllers.forEach((c) => {
                 if (c.onUp) {
                     c.onUp(e);
                 }
             });
+            this.isPressed = false;
             if (!this.pressEvent)
                 return;
             const deltaX = this.pressEvent.screenX - e.screenX;
@@ -70,6 +74,7 @@ class MouseInputImp {
             this.pressEvent = undefined;
         };
         this.onMouseMove = (e) => {
+            e.preventDefault();
             this.controllers.forEach((c) => {
                 if (c.onMove) {
                     c.onMove(e);
@@ -85,17 +90,19 @@ class MouseInputImp {
             }
         };
         this.onMouseOut = (e) => {
-            if (!this.pressEvent)
+            e.preventDefault();
+            if (!this.isPressed)
                 return;
-            const mousePos = new _1.Vector2(e.offsetX, e.offsetY);
             this.controllers.forEach((c) => {
                 if (c.onUp) {
                     c.onUp(e);
                 }
             });
             this.pressEvent = undefined;
+            this.isPressed = false;
         };
         this.onWheel = (e) => {
+            e.preventDefault();
             this.controllers.forEach((c) => {
                 if (c.onWheel) {
                     c.onWheel(e);

package/lib/Entities/OrbitCamera.d.ts

@@ -3,14 +3,73 @@ export declare type OnOrbitCameraChange = () => void;
 export interface CameraLerper {
     cancelLerp: () => void;
 }
+export interface CameraData {
+    defaultAlpha?: number;
+    defaultBeta?: number;
+    defaultRadius?: number;
+    defaultTarget?: {
+        x: number;
+        y: number;
+        z: number;
+    };
+    nearClip?: number;
+    farClip?: number;
+    alphaLimit?: {
+        min: number;
+        max: number;
+    };
+    betaLimit?: {
+        min: number;
+        max: number;
+    };
+    radiusLimit?: {
+        min: number;
+        max: number;
+    };
+    targetLimit?: {
+        min: {
+            x: number;
+            y: number;
+            z: number;
+        };
+        max: {
+            x: number;
+            y: number;
+            z: number;
+        };
+    };
+    dollyRollSensitivity?: number;
+    dollyPixelSensitivity?: number;
+    orbitPixelSensitivity?: number;
+    dollyPinchSensitivity?: number;
+}
 export interface OrbitCamera {
     alpha: number;
     beta: number;
     radius: number;
     target: Vector3;
+    nearClip: number;
+    farClip: number;
+    defaultAlpha: number;
+    defaultBeta: number;
+    defaultRadius: number;
+    defaultTarget: Vector3;
+    dollyRollSensitivity: number;
+    dollyPixelSensitivity: number;
+    dollyPinchSensitivity: number;
+    orbitPixelSensitivity: number;
+    setAlphaLimits: (min: number, max: number) => void;
+    clearAlphaLimits: () => void;
+    setBetaLimits: (min: number, max: number) => void;
+    clearBetaLimits: () => void;
+    setRadiusLimits: (min: number, max: number) => void;
+    clearRadiusLimits: () => void;
+    setTargetLimits: (min: Vector3, max: Vector3) => void;
+    clearTargetLimits: () => void;
     registerLerp: (lerper: CameraLerper) => void;
     lerpCompleted: () => void;
     cancelLerp: () => void;
+    applyData: (data: CameraData) => void;
     addObserver: (observer: OnOrbitCameraChange) => void;
     removeObserver: (observer: OnOrbitCameraChange) => void;
 }