@vived/app 4.2.0 → 4.3.0

package/lib/Entities/Tool.js

@@ -0,0 +1,94 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.makeTool = exports.Tool = exports.ToolState = void 0;
+const MemoizedString_1 = require("./Memoized/MemoizedString");
+const ObservableEntity_1 = require("./ObservableEntity");
+var ToolState;
+(function (ToolState) {
+    ToolState["HIDDEN"] = "HIDDEN";
+    ToolState["DISABLED"] = "DISABLED";
+    ToolState["ENABLED"] = "ENABLED";
+    ToolState["ACTIVE"] = "ACTIVE";
+})(ToolState = exports.ToolState || (exports.ToolState = {}));
+class Tool extends ObservableEntity_1.ObservableEntity {
+}
+exports.Tool = Tool;
+function makeTool(data) {
+    return new ToolImp(data);
+}
+exports.makeTool = makeTool;
+class ToolImp extends Tool {
+    constructor(data) {
+        super();
+        this.memoizedState = new MemoizedString_1.MemoizedString(ToolState.ENABLED, this.notify);
+        this.actions = [];
+        this._isAction = false;
+        this.registerAction = (action) => {
+            this.actions.push(action);
+            this._isAction = true;
+        };
+        this.triggerActions = () => {
+            this.actions.forEach((action) => {
+                action();
+            });
+        };
+        this.isMyHotkey = (hotkey) => {
+            let isMine = false;
+            this.hotkeys.forEach((myHotkey) => {
+                if (this.hotkeysMatch(myHotkey, hotkey)) {
+                    isMine = true;
+                }
+            });
+            return isMine;
+        };
+        this.type = data.type;
+        this.memoizedLabel = new MemoizedString_1.MemoizedString(data.label, this.notify);
+        this.isDefault = data.isDefault;
+        this.memoizedShortcut = new MemoizedString_1.MemoizedString(data.shortcutLabel, this.notify);
+        this.hotkeys = data.hotkeys;
+    }
+    get label() {
+        return this.memoizedLabel.val;
+    }
+    set label(toolLabel) {
+        this.memoizedLabel.val = toolLabel;
+    }
+    get shortcutLabel() {
+        return this.memoizedShortcut.val;
+    }
+    set shortcutLabel(shorcut) {
+        this.memoizedShortcut.val = shorcut;
+    }
+    get state() {
+        return this.memoizedState.val;
+    }
+    set state(val) {
+        this.memoizedState.val = val;
+    }
+    get isAction() {
+        return this._isAction;
+    }
+    hotkeysMatch(a, b) {
+        if (a.keyCode !== b.keyCode)
+            return false;
+        const aComplete = this.fillInMissingModifiers(a);
+        const bComplete = this.fillInMissingModifiers(b);
+        if (aComplete.alt !== bComplete.alt)
+            return false;
+        if (aComplete.control !== bComplete.control)
+            return false;
+        if (aComplete.meta !== bComplete.meta)
+            return false;
+        if (aComplete.shift !== bComplete.shift)
+            return false;
+        return true;
+    }
+    fillInMissingModifiers(hotkey) {
+        const rVal = Object.assign({}, hotkey);
+        rVal.alt = hotkey.alt === undefined ? false : hotkey.alt;
+        rVal.control = hotkey.control === undefined ? false : hotkey.control;
+        rVal.meta = hotkey.meta === undefined ? false : hotkey.meta;
+        rVal.shift = hotkey.shift === undefined ? false : hotkey.shift;
+        return rVal;
+    }
+}

package/lib/Entities/ToolRepository.d.ts

@@ -0,0 +1,46 @@
+import { ObservableEntity } from "./ObservableEntity";
+import { HotKey, Tool, ToolData } from "./Tool";
+export declare abstract class ToolRepository<ToolTypes> extends ObservableEntity {
+    /**
+     * Retuns the active tool. If no tool is active it will return undefined.
+     */
+    abstract get activeTool(): Tool<ToolTypes> | undefined;
+    /**
+     * Returns all the tools.
+     */
+    abstract get allTools(): Tool<ToolTypes>[];
+    /**
+     * Set up the tools from a JSON data file. This should be called during construction.
+     * It is assumed this is only called once.
+     * @param toolData
+     */
+    abstract setupToolsFromData(toolData: ToolData<ToolTypes>[]): void;
+    /**
+     * Get's a tool by it's type. Retruns undefined if no tool could be found
+     * @param toolType The tool type
+     */
+    abstract getTool(toolType: ToolTypes): Tool<ToolTypes> | undefined;
+    /**
+     * Returns the tool that has been assinged to a particular key code.
+     * Will return undefined of no tool is found
+     * @param hotkey Key Code
+     */
+    abstract getToolForHotkey(hotkey: HotKey): Tool<ToolTypes> | undefined;
+    /**
+     * Call this to set the default tool as active
+     */
+    abstract setDefaultToolActive(): void;
+    /**
+     * Triggers a tool of type
+     * @param toolType Tool's type
+     */
+    abstract triggerTool(toolType: ToolTypes): void;
+    /**
+     * Toggls a tool between Hidden and shown.
+     * If the tool is tool is currently Active, the default tool will be set active
+     * The Default Tool cannot be toggled
+     * @param toolType Tool's type
+     */
+    abstract toggleToolVisibility(toolType: ToolTypes): void;
+}
+export declare function makeToolRepo<ToolTypes>(): ToolRepository<ToolTypes>;

package/lib/Entities/ToolRepository.js

@@ -0,0 +1,118 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.makeToolRepo = exports.ToolRepository = void 0;
+const ObservableEntity_1 = require("./ObservableEntity");
+const Tool_1 = require("./Tool");
+class ToolRepository extends ObservableEntity_1.ObservableEntity {
+}
+exports.ToolRepository = ToolRepository;
+function makeToolRepo() {
+    return new ToolRepositoryImp();
+}
+exports.makeToolRepo = makeToolRepo;
+class ToolRepositoryImp extends ToolRepository {
+    constructor() {
+        super(...arguments);
+        this.toolLookup = new Map();
+    }
+    get allTools() {
+        return Array.from(this.toolLookup.values());
+    }
+    setDefaultToolActive() {
+        if (this._defaultToolType !== undefined) {
+            this.triggerTool(this._defaultToolType);
+        }
+        else {
+            console.warn(`[ToolRepository] No default tools has been specified`);
+        }
+    }
+    setupToolsFromData(toolDatas) {
+        toolDatas.forEach((toolData) => {
+            const type = toolData.type;
+            if (this.toolLookup.has(type)) {
+                console.warn(`[ToolRepository] A tool with the ID ${toolData.type} already exists. Replacing`);
+            }
+            const tool = Tool_1.makeTool(toolData);
+            this.toolLookup.set(type, tool);
+            if (toolData.isDefault) {
+                if (this._defaultToolType) {
+                    console.warn(`[ToolRepository] More than one tools is marked as default. Replacing`);
+                }
+                this._defaultToolType = type;
+            }
+        });
+        if (!this._defaultToolType) {
+            console.warn(`[ToolRepository] No default tools was specified. Defaulting to the first tool in the list`);
+            this._defaultToolType = Array.from(this.toolLookup.keys())[0];
+        }
+        if (this._defaultToolType) {
+            this.triggerTool(this._defaultToolType);
+        }
+    }
+    getTool(type) {
+        return this.toolLookup.get(type);
+    }
+    getToolForHotkey(hotkey) {
+        let tool;
+        this.allTools.forEach((t) => {
+            if (t.isMyHotkey(hotkey)) {
+                tool = t;
+            }
+        });
+        return tool;
+    }
+    get activeTool() {
+        if (!this._activeToolType)
+            return undefined;
+        return this.getTool(this._activeToolType);
+    }
+    triggerTool(type) {
+        if (this._activeToolType === type)
+            return;
+        const newActiveTool = this.toolLookup.get(type);
+        if (!newActiveTool) {
+            console.warn(`[ToolRepository] Unable to find tool ${type}`);
+            return;
+        }
+        if (newActiveTool.isAction) {
+            newActiveTool.triggerActions();
+            return;
+        }
+        if (newActiveTool.state === Tool_1.ToolState.DISABLED) {
+            return;
+        }
+        if (newActiveTool.state === Tool_1.ToolState.HIDDEN) {
+            return;
+        }
+        this.toolLookup.forEach((tool) => {
+            if (tool.type === type) {
+                this._activeToolType = type;
+                tool.state = Tool_1.ToolState.ACTIVE;
+            }
+            else if (tool.state === Tool_1.ToolState.ACTIVE) {
+                tool.state = Tool_1.ToolState.ENABLED;
+            }
+        });
+        this.notify();
+    }
+    toggleToolVisibility(type) {
+        const tool = this.getTool(type);
+        if (!tool) {
+            console.warn(`[ToolRepository] Unable to find tool to toggle: ${type}`);
+            return;
+        }
+        if (tool.type === this._defaultToolType) {
+            console.warn(`[ToolRepository] The default tool's visibility cannot be toggled`);
+            return;
+        }
+        if (tool.state === Tool_1.ToolState.HIDDEN) {
+            tool.state = Tool_1.ToolState.ENABLED;
+        }
+        else {
+            if (tool.state === Tool_1.ToolState.ACTIVE) {
+                this.setDefaultToolActive();
+            }
+            tool.state = Tool_1.ToolState.HIDDEN;
+        }
+    }
+}

package/lib/Entities/TouchInput.d.ts

@@ -0,0 +1,28 @@
+import { Vector2 } from "../ValueObjects";
+export interface TouchInputEvent {
+    touchCount: number;
+    touchCenter: Vector2;
+    touches: TouchData[];
+    event: TouchEvent;
+}
+export interface TouchData {
+    id: number;
+    position: Vector2;
+    touch?: Touch;
+}
+export interface TouchController {
+    onTouchStart?: (e: TouchInputEvent) => void;
+    onTouchMove?: (e: TouchInputEvent) => void;
+    onTouchEnd?: (e: TouchInputEvent) => void;
+    onTouchCancel?: (e: TouchInputEvent) => void;
+}
+export interface TouchInput {
+    eventElement: HTMLElement | undefined;
+    eventElementBounds?: DOMRect;
+    setEventElement: (eventElement: HTMLElement) => void;
+    clearInputElement: () => void;
+    updateInputElementBounds: () => void;
+    registerController: (controller: TouchController) => void;
+    removeController: (controller: TouchController) => void;
+}
+export declare function makeTouchInput(): TouchInput;

package/lib/Entities/TouchInput.js

@@ -0,0 +1,144 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.makeTouchInput = void 0;
+const ValueObjects_1 = require("../ValueObjects");
+function makeTouchInput() {
+    return new TouchInputImp();
+}
+exports.makeTouchInput = makeTouchInput;
+class TouchInputImp {
+    constructor() {
+        this.controllers = [];
+        this._eventElement = undefined;
+        this.updateInputElementBounds = () => {
+            if (!this._eventElement)
+                return;
+            this.eventElementBounds = this._eventElement.getBoundingClientRect(); // Expensive so we cache
+        };
+        this.getTouchOffsetPosition = (touch) => {
+            if (!this.eventElementBounds) {
+                console.warn("No target bounds");
+                return ValueObjects_1.Vector2.Zero();
+            }
+            const x = touch.clientX - this.eventElementBounds.x;
+            const y = touch.clientY - this.eventElementBounds.y;
+            return new ValueObjects_1.Vector2(x, y);
+        };
+        this.setEventElement = (eventElement) => {
+            if (this._eventElement)
+                this.clearInputElement();
+            eventElement.addEventListener("touchstart", this.onTouchStart, false);
+            eventElement.addEventListener("touchmove", this.onTouchMove, false);
+            eventElement.addEventListener("touchend", this.onTouchEnd, false);
+            eventElement.addEventListener("touchcancel", this.onTouchCancel, false);
+            this.eventElementBounds = eventElement.getBoundingClientRect();
+            this._eventElement = eventElement;
+        };
+        this.onTouchStart = (e) => {
+            if (e.cancelable)
+                e.preventDefault();
+            const touchInput = this.createTouchInputEvent(e);
+            this.controllers.forEach((c) => {
+                if (c.onTouchStart) {
+                    c.onTouchStart(touchInput);
+                }
+            });
+        };
+        this.onTouchMove = (e) => {
+            if (e.cancelable)
+                e.preventDefault();
+            const touchInput = this.createTouchInputEvent(e);
+            this.controllers.forEach((c) => {
+                if (c.onTouchMove) {
+                    c.onTouchMove(touchInput);
+                }
+            });
+        };
+        this.onTouchEnd = (e) => {
+            if (e.cancelable)
+                e.preventDefault();
+            const touchInput = this.createTouchInputEvent(e);
+            this.controllers.forEach((c) => {
+                if (c.onTouchEnd) {
+                    c.onTouchEnd(touchInput);
+                }
+            });
+        };
+        this.onTouchCancel = (e) => {
+            if (e.cancelable)
+                e.preventDefault();
+            const touchInput = this.createTouchInputEvent(e);
+            this.controllers.forEach((c) => {
+                if (c.onTouchCancel) {
+                    c.onTouchCancel(touchInput);
+                }
+            });
+        };
+        this.clearInputElement = () => {
+            if (!this._eventElement)
+                return;
+            this._eventElement.removeEventListener("touchstart", this.onTouchStart);
+            this._eventElement.removeEventListener("touchmove", this.onTouchMove);
+            this._eventElement.removeEventListener("touchend", this.onTouchEnd);
+            this._eventElement.removeEventListener("touchcancel", this.onTouchCancel);
+            this._eventElement = undefined;
+        };
+        this.registerController = (controller) => {
+            this.controllers.push(controller);
+        };
+        this.removeController = (controller) => {
+            const index = this.controllers.indexOf(controller);
+            if (index >= 0) {
+                this.controllers.splice(index, 1);
+            }
+        };
+    }
+    get eventElement() {
+        return this._eventElement;
+    }
+    createTouchInputEvent(event) {
+        const touches = [];
+        const touchCount = event.touches.length;
+        let minX = 0;
+        let maxX = 0;
+        let minY = 0;
+        let maxY = 0;
+        for (let i = 0; i < touchCount; i++) {
+            const touch = event.touches[i];
+            const position = this.getTouchOffsetPosition(touch);
+            touches.push({
+                id: touch.identifier,
+                touch,
+                position,
+            });
+            if (i === 0) {
+                minX = position.x;
+                maxX = position.x;
+                minY = position.y;
+                maxY = position.y;
+            }
+            else {
+                minX = Math.min(minX, position.x);
+                maxX = Math.max(maxX, position.x);
+                minY = Math.min(minY, position.y);
+                maxY = Math.max(maxY, position.y);
+            }
+        }
+        let cntX = 0;
+        let cntY = 0;
+        if (touchCount === 1) {
+            cntX = maxX;
+            cntY = maxY;
+        }
+        else {
+            cntX = minX + (maxX - minX) / 2;
+            cntY = minY + (maxY - minY) / 2;
+        }
+        return {
+            touchCenter: new ValueObjects_1.Vector2(cntX, cntY),
+            touchCount,
+            touches,
+            event,
+        };
+    }
+}

package/lib/Entities/UndoRedo.d.ts

@@ -0,0 +1,22 @@
+export declare type OnUndoRedoChange = () => void;
+export interface UndoRedoer {
+    undoAction: (action: UndoRedoAction) => void;
+    redoAction: (action: UndoRedoAction) => void;
+}
+export declare type DoUndoRedoAction = (action: UndoRedoAction) => void;
+export interface UndoRedo {
+    hasUndo: boolean;
+    hasRedo: boolean;
+    submitAction: (action: UndoRedoAction) => void;
+    doUndo: () => void;
+    doRedo: () => void;
+    clearStack: () => void;
+    registerUndoRedoer: (undoRedoer: UndoRedoer) => void;
+    addObserver: (observer: OnUndoRedoChange) => void;
+    removeObserver: (observer: OnUndoRedoChange) => void;
+}
+export declare function makeUndoRedo(): UndoRedo;
+export declare type UndoRedoAction = {
+    type: string;
+    payload: object;
+};

package/lib/Entities/UndoRedo.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.makeUndoRedo = void 0;
+const _1 = require(".");
+function makeUndoRedo() {
+    return new UndoRedoImp();
+}
+exports.makeUndoRedo = makeUndoRedo;
+class UndoRedoImp {
+    constructor() {
+        this.observers = new _1.ObserverList();
+        this.undoRedoers = [];
+        this.undoStack = [];
+        this.redoStack = [];
+        this.doUndo = () => {
+            const action = this.undoStack.pop();
+            if (!action) {
+                console.warn("[UndoRedo] nothing to undo");
+                return;
+            }
+            this.redoStack.push(action);
+            this.undoRedoers.forEach(undoers => undoers.undoAction(action));
+            this.observers.notify();
+        };
+        this.doRedo = () => {
+            const action = this.redoStack.pop();
+            if (!action) {
+                console.warn("[UndoRedo] nothing to redo");
+                return;
+            }
+            this.undoStack.push(action);
+            this.undoRedoers.forEach(redoers => redoers.redoAction(action));
+            this.observers.notify();
+        };
+        this.submitAction = (action) => {
+            this.undoStack.push(action);
+            this.redoStack = [];
+            this.observers.notify();
+        };
+        this.clearStack = () => {
+            this.redoStack = [];
+            this.undoStack = [];
+            this.observers.notify();
+        };
+        this.registerUndoRedoer = (undoredoer) => {
+            this.undoRedoers.push(undoredoer);
+        };
+        this.addObserver = (observer) => {
+            this.observers.add(observer);
+        };
+        this.removeObserver = (observer) => {
+            this.observers.remove(observer);
+        };
+    }
+    get hasUndo() {
+        return this.undoStack.length > 0;
+    }
+    get hasRedo() {
+        return this.redoStack.length > 0;
+    }
+}

package/lib/PresentationManagers/DevicePreviewPM.d.ts

@@ -0,0 +1,14 @@
+import { DevicePreview } from "../Entities";
+export interface DevicePreviewVM {
+    x: number;
+    y: number;
+    useDevicePreview: boolean;
+}
+export declare class DevicePreviewPM {
+    devicePreview: DevicePreview;
+    updateView: (vm: DevicePreviewVM) => void;
+    doUpdateView: () => void;
+    dispose(): void;
+    constructor(devicePreview: DevicePreview, updateView: (vm: DevicePreviewVM) => void);
+}
+export declare const defaultDevicePreviewVM: DevicePreviewVM;

package/lib/PresentationManagers/DevicePreviewPM.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultDevicePreviewVM = exports.DevicePreviewPM = void 0;
+class DevicePreviewPM {
+    constructor(devicePreview, updateView) {
+        this.doUpdateView = () => {
+            const useDevicePreview = this.devicePreview.useDevicePreview;
+            const x = this.devicePreview.previewSize.x;
+            const y = this.devicePreview.previewSize.y;
+            this.updateView({
+                x,
+                y,
+                useDevicePreview,
+            });
+        };
+        this.devicePreview = devicePreview;
+        this.updateView = updateView;
+        this.doUpdateView();
+        this.devicePreview.addObserver(this.doUpdateView);
+    }
+    dispose() {
+        this.devicePreview.removeObserver(this.doUpdateView);
+    }
+}
+exports.DevicePreviewPM = DevicePreviewPM;
+exports.defaultDevicePreviewVM = {
+    x: 0,
+    y: 0,
+    useDevicePreview: false,
+};

package/lib/PresentationManagers/FocusCameraPM.d.ts

@@ -0,0 +1,15 @@
+import { FocusCamera } from "../Entities";
+import { Vector3 } from "../ValueObjects";
+export interface FocusCameraVM {
+    alphaEuler: Vector3;
+    betaEuler: Vector3;
+    cameraLocalPosition: Vector3;
+    target: Vector3;
+}
+export declare class FocusCameraPM {
+    private orbitCam;
+    private view;
+    dispose(): void;
+    private doUpdateView;
+    constructor(orbitCamera: FocusCamera, view: (vm: FocusCameraVM) => void);
+}

package/lib/PresentationManagers/FocusCameraPM.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FocusCameraPM = void 0;
+const Utilities_1 = require("../Utilities");
+const ValueObjects_1 = require("../ValueObjects");
+class FocusCameraPM {
+    constructor(orbitCamera, view) {
+        this.doUpdateView = () => {
+            const { alpha, beta, radius, target } = this.orbitCam;
+            const alphaRadians = Utilities_1.degreesToRadians(alpha);
+            const alphaEuler = new ValueObjects_1.Vector3(0, alphaRadians, 0);
+            const betaRadians = Utilities_1.degreesToRadians(beta);
+            const betaEuler = new ValueObjects_1.Vector3(betaRadians, 0, 0);
+            const cameraLocalPosition = new ValueObjects_1.Vector3(0, 0, -radius);
+            this.view({
+                alphaEuler,
+                betaEuler,
+                cameraLocalPosition,
+                target,
+            });
+        };
+        this.orbitCam = orbitCamera;
+        this.view = view;
+        this.doUpdateView();
+        this.orbitCam.addObserver(this.doUpdateView);
+    }
+    dispose() {
+        this.orbitCam.removeObserver(this.doUpdateView);
+    }
+}
+exports.FocusCameraPM = FocusCameraPM;

package/lib/PresentationManagers/FocusCameraPosRotPM.d.ts

@@ -0,0 +1,13 @@
+import { FocusCamera } from "../Entities";
+import { Vector3 } from "../ValueObjects";
+export interface FocusCameraPosRotVM {
+    position: Vector3;
+    rotation: Vector3;
+}
+export declare class FocusCameraPosRotPM {
+    private focusCam;
+    private view;
+    dispose(): void;
+    private doUpdateView;
+    constructor(orbitCamera: FocusCamera, view: (vm: FocusCameraPosRotVM) => void);
+}

package/lib/PresentationManagers/FocusCameraPosRotPM.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FocusCameraPosRotPM = void 0;
+const Utilities_1 = require("../Utilities");
+const ValueObjects_1 = require("../ValueObjects");
+class FocusCameraPosRotPM {
+    constructor(orbitCamera, view) {
+        this.doUpdateView = () => {
+            const { alpha, beta } = this.focusCam;
+            const alphaRadians = Utilities_1.degreesToRadians(alpha);
+            const betaRadians = Utilities_1.degreesToRadians(beta);
+            const position = this.focusCam.cameraPosition;
+            const rotation = new ValueObjects_1.Vector3(betaRadians, alphaRadians, 0);
+            this.view({
+                position,
+                rotation,
+            });
+        };
+        this.focusCam = orbitCamera;
+        this.view = view;
+        this.doUpdateView();
+        this.focusCam.addObserver(this.doUpdateView);
+    }
+    dispose() {
+        this.focusCam.removeObserver(this.doUpdateView);
+    }
+}
+exports.FocusCameraPosRotPM = FocusCameraPosRotPM;

package/lib/PresentationManagers/FramedScreenContainerPM.d.ts

@@ -0,0 +1,18 @@
+import { FramedScreen } from "../Entities";
+export interface FramedContainerVM {
+    top: number;
+    left: number;
+    width: number;
+    height: number;
+    show: boolean;
+}
+export declare class FramedContainerPM {
+    private updateView;
+    private container?;
+    private lastVM?;
+    doUpdateView: () => void;
+    private vmHadChanged;
+    dispose: () => void;
+    constructor(containerID: string, framedScreen: FramedScreen, updateView: (vm: FramedContainerVM) => void);
+}
+export declare const defaultFramedContainerVM: FramedContainerVM;