@vived/app 2.6.1

package/CHANGELOG.md

@@ -0,0 +1,58 @@
+# Changelog
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
+and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+## [2.6.0] - 2021-7-29
+### Added
+- Transition capability to the serailized states
+- Verbose flag to the base use case
+### Fixed
+- The serilization system did not like having an empty state passed in. Fixed it
+- Changed the base app use case to arrow functions
+## [2.5.0] - 2021-7-9
+### Changed
+- Change the Device Peview PM to return a view model
+- Changed system name BaseAppState to BaseApp
+- Merged Serilization into Base App
+- Merged Dispatch to Host into Base App
+- Merged Device Preview into Base App
+## [2.3.0] - 2021-7-7
+### Changed
+- Converted the App Handler into a factory
+### Added
+- Serilization system
+- A lot of app systems controlles and PMs
+## [2.2.0] - 2021-07-1
+### Changed
+- Start to payload version 2
+- Set state to payload version 2
+## [2.1.0] - 2021-06-28
+### Added
+- Support for responding to requsting app response payload versions
+## [2.0.0] - 2021-06-28
+### Removed
+- React and the hook
+## [1.2.0] - 2021-06-28
+### Added 
+- Support for host communication via the 3rd gen boundary 
+## [1.1.0] - 2021-04-26
+### Changed
+- General refactor on project structure
+- Renamed the package to @VIVED
+### Added
+- A Set Device Preview controller
+
+## [1.0.0] - 2021-04-20
+### Changed
+- Setup the readme file
+### Removed
+- All the boundary interfaces. These were moved to a seperate package.
+
+## [0.0.2] - 2021-04-06
+### Added
+- Old version of the App Interface
+
+## [0.0.1] - 2021-04-06
+### Added
+- Initial setup

package/README.md

@@ -0,0 +1,151 @@
+# VIVED App
+This package is intended to hold all the common logic used by VIVED Slide Apps. 
+
+## Use Case
+You will need to instantiate the baseAppUC by calling makeBaseAppUC(). Typically this is done in your Main script when everything is starting up.
+
+### Functions
+#### getIsAuthoring():boolean
+Gets the flag to see if the app is currently in an authoring state
+
+#### setIsAuthoring(isAuthoring:boolean):void
+Sets the is authoring flag. If there is a change this will notify all observers
+
+#### getShowBabylonInspector():boolean
+Gets the flag to see if the babylon inspector should be show
+
+#### setShowBabylonInspector(showInspector: boolean):void
+Sets if the Babylon Inspector should be shown. If there is a change this will notify all observers.
+
+#### addObserver(observer: BaseAppStateObserver): void;
+Adds an observer to the Use Case. The observer will be notified if anything in the use case changes
+
+#### removeObserver(observer: BaseAppStateObserver): void;
+Removes an observer so it will no longer be notified of changes in the Use Case
+
+#### getSerializedState(): SerializedStates;
+Get the current serialized state of the App. See the Serilization section below
+
+#### setSerializedState(state: SerializedStates): void;
+Sets the state of the app to a Serialized State. See the Serilization section below
+
+#### registerSerializableSystem(serializedSystem: SerializableSystem):void;
+Registers a Serializable System. This is likely a system in your App which has states that need to be saved and applied. See the Serilization section below
+
+#### setHostHandler(handler: Handler):void;
+When an App is mounted it is passed the Host Handler. This is the Handler to which the Use Case will dispatch all requests. This needs to be set when the app Main is constructed. See the App - Host Communication section below
+
+#### hasHostHandler():boolean;
+This checks to see if a host handler has been set. This is useful for avoiding nasty errors
+
+#### dispatchOnStateChange(stateObject: object):void;
+When authoring the Host should be notified whenever something in the serializable state has changed. Calling this will let the host know that the state has changed and pass along the new state.
+
+#### dispatchOnStateComplete():void
+Calling this will let the Host know that the user has completed their required task and the Host can move on to the next state. 
+
+#### dispatchSubmitResults(results:object):void;
+If a user has completed a task and there are results to submit the app can pass these results to the Host via this call.
+
+#### dispatchGetAppAssetsURL():string
+Many Apps require Assets such as GLBs or images. These are expected to be stored in the public/assets folder (assuming the app was built with Create React App). However once the App has been published, the path to this folder will be different. The Host should know this path so calling this will ask the host for the path to the assets folder.
+
+#### setDevicePreview(x: number, y: number): void;
+At some point the User may opt to view the Activity in a way the previews a specific hardware device. This decision is handled by the host but the App will be notified. This function is used to set the desired x and y resolution
+
+#### clearDevicePreview():void;
+Calling this will clear any preview device resoltions.
+
+#### getUseDevicePreview(): boolean;
+This will return a true if the Host has set a device resolution to preview. Otherwise it will return false
+
+#### getDevicePreviewSize(): {x: number, y:number}
+This will return the requested preview device x and y resolution. If no device has been set or the previewed device has been cleared, these will both be -1.
+
+### Observers
+If you want to be notified when something changes in the Use Case you will need to create an observer class the implements BaseAppStateObserver and then registers itself with the use case via addObserver. If you observer is getting destroyed it needs to call removeObserver on the Use Case
+
+### Serilization
+The Serilization system is designed to handle all the heavy lifting of serializing and desrializing the state of your app.
+
+#### Serializable System
+You app will likey have one or my systems that have data which needs to be stored in the state. For each of these systems you are expected to write a class that implements SerializableSystem and then register this class with the Base App Use Case by calling registerSerializableSystem. 
+
+This implementation requires your class to setup four items:
+##### Name
+This is the name of your system. Not this name must be unique across all the serialized systems in your App. In other words you cannot register two different Serializable Systems with the same name. Also, this name should not be modified down the road is it is how the Use Case will determine what Class to send stored activity data to. This name will never be seen by a user.
+
+##### Serilization Version
+This is an integer that is stored with the data and written into an activity file. This is intended to allow the system state data to be changed over time while giving developers the opportunity to be backwards compatable. For example, lets say after a few months the system is improved to include another statable variable. The devloper would iterate the serilizationVersion from 1 to 2. From now on, any new saved states will be saved with version number 2. When the System is asked to apply some saved state data it can check to see if this state data was version 1 or 2 and handle it appropriatetly.
+
+##### getSerializedObject():object
+The Serilization Use Case will trigger this function when it needs to store the current state. The Class is expected to form up an object however they see fit and return it as a vanilla object.
+
+##### applySerializedObject(state: object, version: number):void
+This function will be called when the Serilization Use Case want to apply a state to a system. It will pass in a vanilla object as well as the serilization version that was set when this object was formed. The Class is expected to handle the versions and apply the object appropriatetly.
+
+### App - Host Communication
+The boundary between the Host and the App has been intentionally designed to allow the the host and the apps to be completely independent of each other while allowing communication between the two. 
+
+#### Request
+All messages passed between the Host and the App are called requests. All Requests are strongly typed and versioned in the @vived/app-host-boundary package.
+
+#### Dispatcher
+When an App needs to send a request to the Host all it needs to do is trigger a dispatch action in the Use Case. This package will take care of correctly forming the Request and sending it to the Host.
+
+#### Handler
+When the Host sends a request to the App it must be handled, which is the responsibility of the App Handler. You app is expected to provide a list of AppHandlerFunctions when it creates the App Handler during the construction of the App. This allows allows the App to unpack the request and then call one of these functions, allowing your App to handle it however it wants.
+
+## Presenter Models
+Presenter Models are intented to update a view whenenver a something specific changes in the Use Case. The Presenter Model will either pass the View a specific parameter or a View Model of parameters. Ideally the View will be able to just consume the View Model or the parameter without needing any logic or refactoring.
+
+To use Presenter Model your View (or Hook) will need to instantiate the Presenter Model, passing in the baseAppUC and a callback function. The callback function will be triggered when the Presenter Moder is initiated and then whenever an update is available. It is important to call Dispose on the Presetner Model if your view or hook is being destroyed in order to remove it's observer from the Use Case.
+
+### DevicePreviewPM
+This PM will update it's view whenever something with the Device Preview changes. It returns a View Model with the following parameters
+- isPreviewingDevice: a boolean letting you know if the render canvas should be scaled
+- x: is the pixel width to scale to if isPreviewingDevice. This will be -1 if there is no device to preview
+- y: is the pixel height to scale to if isPreviewingDevice. This will be -1 if there is no device
+
+### IsAuthoringPM
+This PM will update the view whenever the Is Authoring flag changes, passing back the current isAuthor value.
+
+### ShowBabylonInspectorPM
+This PM will update the view whenever the Show Babylon Inspector flag changes, passing back the current value.
+
+## Controllers
+### defaultAppHandlerFunctions
+The function creates all the default app handler functions. These include:
+- showBabylonInspector: (show: boolean) => void;
+- setIsAuthoring: (isAuthoring: boolean) => void;
+- disposeApp: () => void;
+- stopApp: () => void;
+- startApp: (container: HTMLElement) => void;
+- setState: (finalState: string, duration?: number) => void;
+- setDevicePreview: (x: number, y: number) => void;
+
+Your App will likely need to handle one or more of these functions differently so the intent is that you use this function to create all the default functions and then replace the appropriate functions with your custom function before creating the App Handler
+
+### dispatchStateChange()
+This function is created with the factory makeDispatchStateChange. It first gets the latest serialized state and then dispatches that state to the Host
+
+### makeAppHandler(functions: AppHandlerFunctions): Handler
+This function is used to create the App Handler. It takes in the App Handler Functions and returns a generic Handler, which is passed to the Host. The host can then dispatch a request to this Handler. The App Handler is responsible for reading the request and triggering the appropriate App Handler Function
+
+### setDevicePreview(x: number, y: number)
+This function is created with the makeSetDevicePreview factory. If either x or y are negative this function will clear the selected device in the baseAppUC. Otherwise it will set the x and y value of the selected device in the Use Case.
+
+### setIsAuthoring(isAuthoring: boolean)
+This function is created with the makeSetIsAuthoring factory and will apply the isAuthoring flag to the use case. It will also dispatch a state change if the is Authorin is set to true. This allows the Host to know the initial state when the user start authoring.
+
+### setState(state: string, duration?: number)
+This function is created with the makeSetState facory. It is responsible for recieving a desired state from the Host and applying it locally. You will note that the setState function in this package does not use the duration parameter. This function simply sets the state hard, without any transition. You App will probably what to implement it's own setState function that support nice interpolations for your systems.
+
+### showBabylonInspector(showInspector:boolean)
+This function is created with the makeShowBabylonInspector factory. It will set the show babylon inspector flag in the Use Case. 
+
+### startApp(container: HTMLElement)
+This function is created with the makeStartApp factory. It is reponsible for starting up all the renderings of the App. This could include the App's react components as well as the Babylon Engine.
+
+### stopApp()
+This function is created with the makeStopApp factory. It is reponsible for stopping up all the renderings of the App. This could include the App's react components as well as the Babylon Engine. It also ensures that the isAuthoring flag is set to false.

package/lib/Core/BaseApp/Boundary.d.ts

@@ -0,0 +1,49 @@
+import { Handler } from "@vived/app-host-boundary";
+export interface BaseAppUC {
+    getIsAuthoring(): boolean;
+    setIsAuthoring(isAuthoring: boolean): void;
+    getShowBabylonInspector(): boolean;
+    setShowBabylonInspector(showInspector: boolean): void;
+    addObserver(observer: BaseAppStateObserver): void;
+    removeObserver(observer: BaseAppStateObserver): void;
+    setVerbose(verbose: boolean): void;
+    getSerializedState(): SerializedStates;
+    setSerializedState(state: SerializedStates, transitionTime: number): void;
+    setDefaultState(transitionTime: number): void;
+    registerSerializableSystem(serializedSystem: SerializableSystem): void;
+    getIsTransitioning(): boolean;
+    abortTransition(): void;
+    setTransitionEaseFn: (easeFn: (normalizedTime: number) => number) => void;
+    setHostHandler(handler: Handler): void;
+    hasHostHandler(): boolean;
+    dispatchOnStateChange(stateObject: object): void;
+    dispatchOnStateComplete(): void;
+    dispatchSubmitResults(results: object): void;
+    dispatchGetAppAssetsURL(): string;
+    setDevicePreview(x: number, y: number): void;
+    clearDevicePreview(): void;
+    getUseDevicePreview(): boolean;
+    getDevicePreviewSize(): {
+        x: number;
+        y: number;
+    };
+}
+export interface BaseAppStateObserver {
+    onBaseAppChange: () => void;
+}
+export interface SerializedStates {
+    version: number;
+    systems: SystemState[];
+}
+export interface SystemState {
+    name: string;
+    seriliziationVersion: number;
+    state: object;
+}
+export interface SerializableSystem {
+    name: string;
+    seriliziationVersion: number;
+    getSerializedObject(): object;
+    intializeStateForTransition(serializedState: object | null, version: number): void;
+    applyTransition(percent: number): void;
+}

package/lib/Core/BaseApp/Boundary.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/Core/BaseApp/Entity.d.ts

@@ -0,0 +1,11 @@
+export interface BaseAppState {
+    isAuthoring: boolean;
+    showBabyonInspector: boolean;
+    handler?: unknown;
+    appAssetsURL?: string;
+    useDevicePreview: boolean;
+    x: number;
+    y: number;
+    isTransitioning: boolean;
+    verbose: boolean;
+}

package/lib/Core/BaseApp/Entity.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/Core/BaseApp/Errors/ErrorDuplicateSystemName.d.ts

@@ -0,0 +1,3 @@
+export declare class DuplicateSystemNameError extends Error {
+    constructor(name: string);
+}

package/lib/Core/BaseApp/Errors/ErrorDuplicateSystemName.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DuplicateSystemNameError = void 0;
+class DuplicateSystemNameError extends Error {
+    constructor(name) {
+        const msg = "Cannot add two serialized systems named " +
+            name +
+            ". Every system name must be unique";
+        super(msg);
+    }
+}
+exports.DuplicateSystemNameError = DuplicateSystemNameError;

package/lib/Core/BaseApp/Errors/ErrorNoHostHandler.d.ts

@@ -0,0 +1,3 @@
+export declare class ErrorNoHostHandler extends Error {
+    constructor();
+}

package/lib/Core/BaseApp/Errors/ErrorNoHostHandler.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ErrorNoHostHandler = void 0;
+class ErrorNoHostHandler extends Error {
+    constructor() {
+        const msg = "Host Handler has not been set";
+        super(msg);
+    }
+}
+exports.ErrorNoHostHandler = ErrorNoHostHandler;

package/lib/Core/BaseApp/Errors/ErrorUnsupportedVersionNumber.d.ts

@@ -0,0 +1,3 @@
+export declare class UnsupportedVersionNumber extends Error {
+    constructor(version: number);
+}

package/lib/Core/BaseApp/Errors/ErrorUnsupportedVersionNumber.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.UnsupportedVersionNumber = void 0;
+class UnsupportedVersionNumber extends Error {
+    constructor(version) {
+        const msg = "Serialization version " + version + " is not supported";
+        super(msg);
+    }
+}
+exports.UnsupportedVersionNumber = UnsupportedVersionNumber;

package/lib/Core/BaseApp/Errors/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./ErrorDuplicateSystemName";
+export * from "./ErrorUnsupportedVersionNumber";
+export * from "./ErrorNoHostHandler";

package/lib/Core/BaseApp/Errors/index.js

@@ -0,0 +1,15 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./ErrorDuplicateSystemName"), exports);
+__exportStar(require("./ErrorUnsupportedVersionNumber"), exports);
+__exportStar(require("./ErrorNoHostHandler"), exports);

package/lib/Core/BaseApp/UseCase.d.ts

@@ -0,0 +1,43 @@
+import { Handler } from "@vived/app-host-boundary";
+import { BaseAppStateObserver, BaseAppUC, SerializableSystem, SerializedStates } from "./Boundary";
+export declare class BaseAppUCImp implements BaseAppUC {
+    private appState;
+    private observers;
+    private systems;
+    private serilizationVersion;
+    private currentInterval?;
+    private easeFunction;
+    constructor();
+    setVerbose(verbose: boolean): void;
+    abortTransition: () => void;
+    setTransitionEaseFn: (easeFn: (normalizedTime: number) => number) => void;
+    getIsTransitioning: () => boolean;
+    setDevicePreview: (x: number, y: number) => void;
+    clearDevicePreview: () => void;
+    getUseDevicePreview: () => boolean;
+    getDevicePreviewSize: () => {
+        x: number;
+        y: number;
+    };
+    setHostHandler: (handler: Handler) => void;
+    hasHostHandler: () => boolean;
+    dispatchOnStateChange: (stateObject: object) => void;
+    dispatchOnStateComplete: () => void;
+    dispatchSubmitResults: (results: object) => void;
+    dispatchGetAppAssetsURL: () => string;
+    registerSerializableSystem: (serializedSystem: SerializableSystem) => void;
+    getSerializedState: () => SerializedStates;
+    setSerializedState: (state: SerializedStates, duration: number) => void;
+    setDefaultState: (duration: number) => void;
+    getShowBabylonInspector: () => boolean;
+    setShowBabylonInspector: (showInspector: boolean) => void;
+    getIsAuthoring: () => boolean;
+    setIsAuthoring: (isAuthoring: boolean) => void;
+    addObserver: (observer: BaseAppStateObserver) => void;
+    removeObserver: (observer: BaseAppStateObserver) => void;
+    private logToConsole;
+    private startTransition;
+    private applyTransitionToSystems;
+    private notify;
+    private dispatch;
+}

package/lib/Core/BaseApp/UseCase.js

@@ -0,0 +1,250 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BaseAppUCImp = void 0;
+const app_host_boundary_1 = require("@vived/app-host-boundary");
+const Errors_1 = require("./Errors");
+class BaseAppUCImp {
+    constructor() {
+        this.observers = [];
+        this.systems = new Map();
+        this.serilizationVersion = 2;
+        this.easeFunction = (normalizedTime) => {
+            return normalizedTime; // default to a linear function
+        };
+        this.abortTransition = () => {
+            if (this.currentInterval) {
+                clearInterval(this.currentInterval);
+            }
+            this.appState.isTransitioning = false;
+        };
+        this.setTransitionEaseFn = (easeFn) => {
+            this.easeFunction = easeFn;
+        };
+        this.getIsTransitioning = () => {
+            return this.appState.isTransitioning;
+        };
+        this.setDevicePreview = (x, y) => {
+            if (this.appState.useDevicePreview &&
+                x === this.appState.x &&
+                y === this.appState.y) {
+                return;
+            }
+            this.appState.useDevicePreview = true;
+            this.appState.x = x;
+            this.appState.y = y;
+            this.notify();
+            this.logToConsole(`Device Preview set to ${x}, ${y}`);
+        };
+        this.clearDevicePreview = () => {
+            if (!this.appState.useDevicePreview)
+                return;
+            this.appState.useDevicePreview = false;
+            this.appState.x = -1;
+            this.appState.y = -1;
+            this.notify();
+            this.logToConsole(`Device Preview cleared`);
+        };
+        this.getUseDevicePreview = () => {
+            return this.appState.useDevicePreview;
+        };
+        this.getDevicePreviewSize = () => {
+            const { x, y } = this.appState;
+            return { x, y };
+        };
+        this.setHostHandler = (handler) => {
+            this.appState.handler = handler;
+            this.logToConsole("Handler set");
+        };
+        this.hasHostHandler = () => {
+            if (this.appState.handler) {
+                return true;
+            }
+            else {
+                return false;
+            }
+        };
+        this.dispatchOnStateChange = (stateObject) => {
+            const request = {
+                type: app_host_boundary_1.ON_STATE_CHANGE,
+                version: 1,
+                payload: {
+                    stateObject,
+                },
+            };
+            this.dispatch(request);
+        };
+        this.dispatchOnStateComplete = () => {
+            const request = {
+                type: app_host_boundary_1.ON_STATE_COMPLETED,
+                version: 1,
+            };
+            this.dispatch(request);
+        };
+        this.dispatchSubmitResults = (results) => {
+            const request = {
+                type: app_host_boundary_1.SUBMIT_RESULTS,
+                version: 1,
+                payload: {
+                    results,
+                },
+            };
+            this.dispatch(request);
+        };
+        this.dispatchGetAppAssetsURL = () => {
+            var _a;
+            const callback = (url) => {
+                this.appState.appAssetsURL = url;
+            };
+            const request = {
+                type: app_host_boundary_1.GET_APP_ASSET_URL,
+                version: 1,
+                payload: {
+                    callback,
+                },
+            };
+            this.dispatch(request);
+            return (_a = this.appState.appAssetsURL) !== null && _a !== void 0 ? _a : "";
+        };
+        this.registerSerializableSystem = (serializedSystem) => {
+            if (this.systems.has(serializedSystem.name)) {
+                throw new Errors_1.DuplicateSystemNameError(serializedSystem.name);
+            }
+            this.systems.set(serializedSystem.name, serializedSystem);
+        };
+        this.getSerializedState = () => {
+            const systems = Array.from(this.systems.values());
+            const serializedStates = systems.map((system) => {
+                const state = system.getSerializedObject();
+                return {
+                    seriliziationVersion: system.seriliziationVersion,
+                    name: system.name,
+                    state,
+                };
+            });
+            return {
+                version: this.serilizationVersion,
+                systems: serializedStates,
+            };
+        };
+        this.setSerializedState = (state, duration) => {
+            if (state.version === 2) {
+                state.systems.forEach((systemState) => {
+                    const seriliazableSystem = this.systems.get(systemState.name);
+                    if (seriliazableSystem) {
+                        seriliazableSystem.intializeStateForTransition(systemState.state, systemState.seriliziationVersion);
+                    }
+                    else {
+                        console.warn("Unable to find seriarializedSystem " + systemState.name);
+                    }
+                });
+            }
+            // Here is where we will add support for future versions
+            else {
+                throw new Errors_1.UnsupportedVersionNumber(state.version);
+            }
+            this.startTransition(duration);
+            this.logToConsole(`State set to ${JSON.stringify(state)} with a ${duration} second duration`);
+        };
+        this.setDefaultState = (duration) => {
+            this.systems.forEach((system) => {
+                system.intializeStateForTransition(null, -1);
+            });
+            this.startTransition(duration);
+            this.logToConsole(`State has been set to transition to default over ${duration} seconds`);
+        };
+        this.getShowBabylonInspector = () => {
+            return this.appState.showBabyonInspector;
+        };
+        this.setShowBabylonInspector = (showInspector) => {
+            if (this.appState.showBabyonInspector === showInspector)
+                return;
+            this.appState.showBabyonInspector = showInspector;
+            this.notify();
+            this.logToConsole(`Show Babylon Inspector set to ${showInspector}`);
+        };
+        this.getIsAuthoring = () => {
+            return this.appState.isAuthoring;
+        };
+        this.setIsAuthoring = (isAuthoring) => {
+            if (isAuthoring === this.appState.isAuthoring)
+                return;
+            this.appState.isAuthoring = isAuthoring;
+            this.notify();
+            this.logToConsole(`Is Authoring set to ${isAuthoring}`);
+        };
+        this.addObserver = (observer) => {
+            this.observers.push(observer);
+        };
+        this.removeObserver = (observer) => {
+            const index = this.observers.indexOf(observer);
+            if (index >= 0) {
+                this.observers.splice(index, 1);
+            }
+        };
+        this.appState = {
+            isAuthoring: false,
+            showBabyonInspector: false,
+            useDevicePreview: false,
+            x: -1,
+            y: -1,
+            isTransitioning: false,
+            verbose: false,
+        };
+    }
+    setVerbose(verbose) {
+        this.appState.verbose = verbose;
+    }
+    logToConsole(message) {
+        if (!this.appState.verbose)
+            return;
+        console.log("[Base App UC] " + message);
+    }
+    startTransition(duration) {
+        if (duration === 0) {
+            if (this.currentInterval) {
+                clearInterval(this.currentInterval);
+                this.appState.isTransitioning = false;
+            }
+            this.applyTransitionToSystems(1);
+        }
+        else {
+            if (this.currentInterval) {
+                clearInterval(this.currentInterval);
+            }
+            this.appState.isTransitioning = true;
+            const durationInMS = duration * 1000;
+            let chrono = 0;
+            const transitionDelta = 10;
+            this.currentInterval = setInterval(() => {
+                chrono = chrono + transitionDelta;
+                let normalizedTime = chrono / durationInMS;
+                if (normalizedTime > 1) {
+                    normalizedTime = 1;
+                }
+                const percent = this.easeFunction(normalizedTime);
+                this.applyTransitionToSystems(percent);
+                if (normalizedTime >= 1 && this.currentInterval) {
+                    clearInterval(this.currentInterval);
+                    this.appState.isTransitioning = false;
+                }
+            }, transitionDelta);
+        }
+    }
+    applyTransitionToSystems(percent) {
+        this.systems.forEach((system) => {
+            system.applyTransition(percent);
+        });
+    }
+    notify() {
+        this.observers.forEach((observer) => observer.onBaseAppChange());
+    }
+    dispatch(request) {
+        if (!this.appState.handler) {
+            throw new Errors_1.ErrorNoHostHandler();
+        }
+        const handler = this.appState.handler;
+        handler(request);
+        this.logToConsole(`Dispatched request: ${JSON.stringify(request)}`);
+    }
+}
+exports.BaseAppUCImp = BaseAppUCImp;

package/lib/Core/BaseAppState/Boundary.d.ts

@@ -0,0 +1,14 @@
+export interface BaseAppStateUC {
+    getIsAuthoring(): boolean;
+    setIsAuthoring(isAuthoring: boolean): void;
+    getShowBabylonInspector(): boolean;
+    setShowBabylonInspector(showInspector: boolean): void;
+    getAppContainer(): HTMLElement | undefined;
+    setAppContainer(container: HTMLElement): void;
+    clearAppContainer(): void;
+    addObserver(observer: BaseAppStateObserver): void;
+    removeObserver(observer: BaseAppStateObserver): void;
+}
+export interface BaseAppStateObserver {
+    onAppStateChange: () => void;
+}

package/lib/Core/BaseAppState/Boundary.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });