@babylonjs/viewer 7.22.2-alpha → 7.22.2

package/templating/viewerTemplatePlugin.d.ts

@@ -0,0 +1,21 @@
+import type { EventCallback, Template } from "./templateManager";
+export interface IViewerTemplatePlugin {
+    readonly templateName: string;
+    readonly eventsToAttach?: Array<string>;
+    interactionPredicate(event: EventCallback): boolean;
+    onEvent?(event: EventCallback): void;
+    addHTMLTemplate?(template: Template): void;
+}
+export declare abstract class AbstractViewerNavbarButton implements IViewerTemplatePlugin {
+    readonly templateName: string;
+    readonly eventsToAttach: Array<string>;
+    protected _prepend: boolean;
+    protected _buttonName: string;
+    protected _buttonClass: string;
+    protected _htmlTemplate: string;
+    constructor(buttonName: string, buttonClass?: string, htmlTemplate?: string);
+    interactionPredicate(event: EventCallback): boolean;
+    abstract onEvent(event: EventCallback): void;
+    addHTMLTemplate(template: Template): void;
+    protected _generateHTMLElement(template: Template): Element | DocumentFragment;
+}

package/templating/viewerTemplatePlugin.js

@@ -0,0 +1,69 @@
+import * as Handlebars from "handlebars";
+var AbstractViewerNavbarButton = /** @class */ (function () {
+    function AbstractViewerNavbarButton(buttonName, buttonClass, htmlTemplate) {
+        this.templateName = "navBar";
+        this.eventsToAttach = ["pointerdown"];
+        this._prepend = true;
+        this._buttonName = buttonName;
+        if (buttonClass) {
+            this._buttonClass = buttonClass;
+        }
+        else {
+            this._buttonClass = buttonName + "-button";
+        }
+        if (htmlTemplate) {
+            this._htmlTemplate = htmlTemplate;
+        }
+        else {
+            this._htmlTemplate = "\n<button class=\"".concat(this._buttonClass, "\">\n    <span class=\"icon ").concat(this._buttonName, "-icon\"></span>\n</button>\n");
+        }
+    }
+    AbstractViewerNavbarButton.prototype.interactionPredicate = function (event) {
+        var pointerDown = event.event;
+        if (pointerDown.button !== 0) {
+            return false;
+        }
+        var element = event.event.target;
+        if (!element) {
+            return false;
+        }
+        var elementClasses = element.classList;
+        for (var i = 0; i < elementClasses.length; ++i) {
+            var className = elementClasses[i];
+            if (className.indexOf(this._buttonClass) !== -1) {
+                return true;
+            }
+        }
+        return false;
+    };
+    AbstractViewerNavbarButton.prototype.addHTMLTemplate = function (template) {
+        var element = this._generateHTMLElement(template);
+        var container = template.parent.querySelector("div.default-control");
+        if (container) {
+            if (this._prepend) {
+                container.insertBefore(element, container.firstChild);
+            }
+            else {
+                container.appendChild(element);
+            }
+        }
+    };
+    AbstractViewerNavbarButton.prototype._generateHTMLElement = function (template) {
+        var compiledTemplate = Handlebars.compile(this._htmlTemplate, { noEscape: template.configuration.params && !!template.configuration.params.noEscape });
+        var config = template.configuration.params || {};
+        var rawHtml = compiledTemplate(config);
+        var fragment;
+        try {
+            fragment = document.createRange().createContextualFragment(rawHtml);
+        }
+        catch (e) {
+            var test_1 = document.createElement(this._buttonClass);
+            test_1.innerHTML = rawHtml;
+            fragment = test_1;
+        }
+        return fragment;
+    };
+    return AbstractViewerNavbarButton;
+}());
+export { AbstractViewerNavbarButton };
+//# sourceMappingURL=viewerTemplatePlugin.js.map

package/templating/viewerTemplatePlugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"viewerTemplatePlugin.js","sourceRoot":"","sources":["../../../../tools/viewer/src/templating/viewerTemplatePlugin.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,UAAU,MAAM,YAAY,CAAC;AAWzC;IAQI,oCAAY,UAAkB,EAAE,WAAoB,EAAE,YAAqB;QAP3D,iBAAY,GAAW,QAAQ,CAAC;QAChC,mBAAc,GAAkB,CAAC,aAAa,CAAC,CAAC;QACtD,aAAQ,GAAY,IAAI,CAAC;QAM/B,IAAI,CAAC,WAAW,GAAG,UAAU,CAAC;QAC9B,IAAI,WAAW,EAAE;YACb,IAAI,CAAC,YAAY,GAAG,WAAW,CAAC;SACnC;aAAM;YACH,IAAI,CAAC,YAAY,GAAG,UAAU,GAAG,SAAS,CAAC;SAC9C;QACD,IAAI,YAAY,EAAE;YACd,IAAI,CAAC,aAAa,GAAG,YAAY,CAAC;SACrC;aAAM;YACH,IAAI,CAAC,aAAa,GAAG,4BAChB,IAAI,CAAC,YAAY,yCACV,IAAI,CAAC,WAAW,iCAEvC,CAAC;SACO;IACL,CAAC;IAED,yDAAoB,GAApB,UAAqB,KAAoB;QACrC,IAAM,WAAW,GAAiB,KAAK,CAAC,KAAK,CAAC;QAC9C,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC,EAAE;YAC1B,OAAO,KAAK,CAAC;SAChB;QACD,IAAM,OAAO,GAAgB,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC;QAEhD,IAAI,CAAC,OAAO,EAAE;YACV,OAAO,KAAK,CAAC;SAChB;QAED,IAAM,cAAc,GAAG,OAAO,CAAC,SAAS,CAAC;QAEzC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,cAAc,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE;YAC5C,IAAM,SAAS,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC;YACpC,IAAI,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,EAAE;gBAC7C,OAAO,IAAI,CAAC;aACf;SACJ;QAED,OAAO,KAAK,CAAC;IACjB,CAAC;IAGM,oDAAe,GAAtB,UAAuB,QAAkB;QACrC,IAAM,OAAO,GAAG,IAAI,CAAC,oBAAoB,CAAC,QAAQ,CAAC,CAAC;QACpD,IAAM,SAAS,GAAG,QAAQ,CAAC,MAAM,CAAC,aAAa,CAAC,qBAAqB,CAAC,CAAC;QACvE,IAAI,SAAS,EAAE;YACX,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACf,SAAS,CAAC,YAAY,CAAC,OAAO,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;aACzD;iBAAM;gBACH,SAAS,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;aAClC;SACJ;IACL,CAAC;IAES,yDAAoB,GAA9B,UAA+B,QAAkB;QAC7C,IAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,aAAa,EAAE,EAAE,QAAQ,EAAE,QAAQ,CAAC,aAAa,CAAC,MAAM,IAAI,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC;QACzJ,IAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,IAAI,EAAE,CAAC;QACnD,IAAM,OAAO,GAAG,gBAAgB,CAAC,MAAM,CAAC,CAAC;QACzC,IAAI,QAAoC,CAAC;QACzC,IAAI;YACA,QAAQ,GAAG,QAAQ,CAAC,WAAW,EAAE,CAAC,wBAAwB,CAAC,OAAO,CAAC,CAAC;SACvE;QAAC,OAAO,CAAC,EAAE;YACR,IAAM,MAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;YACvD,MAAI,CAAC,SAAS,GAAG,OAAO,CAAC;YACzB,QAAQ,GAAG,MAAI,CAAC;SACnB;QACD,OAAO,QAAQ,CAAC;IACpB,CAAC;IACL,iCAAC;AAAD,CAAC,AA5ED,IA4EC","sourcesContent":["import type { EventCallback, Template } from \"./templateManager\";\r\nimport * as Handlebars from \"handlebars\";\r\n\r\nexport interface IViewerTemplatePlugin {\r\n    readonly templateName: string;\r\n    readonly eventsToAttach?: Array<string>;\r\n\r\n    interactionPredicate(event: EventCallback): boolean;\r\n    onEvent?(event: EventCallback): void;\r\n    addHTMLTemplate?(template: Template): void;\r\n}\r\n\r\nexport abstract class AbstractViewerNavbarButton implements IViewerTemplatePlugin {\r\n    public readonly templateName: string = \"navBar\";\r\n    public readonly eventsToAttach: Array<string> = [\"pointerdown\"];\r\n    protected _prepend: boolean = true;\r\n    protected _buttonName: string;\r\n    protected _buttonClass: string;\r\n    protected _htmlTemplate: string;\r\n\r\n    constructor(buttonName: string, buttonClass?: string, htmlTemplate?: string) {\r\n        this._buttonName = buttonName;\r\n        if (buttonClass) {\r\n            this._buttonClass = buttonClass;\r\n        } else {\r\n            this._buttonClass = buttonName + \"-button\";\r\n        }\r\n        if (htmlTemplate) {\r\n            this._htmlTemplate = htmlTemplate;\r\n        } else {\r\n            this._htmlTemplate = `\r\n<button class=\"${this._buttonClass}\">\r\n    <span class=\"icon ${this._buttonName}-icon\"></span>\r\n</button>\r\n`;\r\n        }\r\n    }\r\n\r\n    interactionPredicate(event: EventCallback): boolean {\r\n        const pointerDown = <PointerEvent>event.event;\r\n        if (pointerDown.button !== 0) {\r\n            return false;\r\n        }\r\n        const element = <HTMLElement>event.event.target;\r\n\r\n        if (!element) {\r\n            return false;\r\n        }\r\n\r\n        const elementClasses = element.classList;\r\n\r\n        for (let i = 0; i < elementClasses.length; ++i) {\r\n            const className = elementClasses[i];\r\n            if (className.indexOf(this._buttonClass) !== -1) {\r\n                return true;\r\n            }\r\n        }\r\n\r\n        return false;\r\n    }\r\n    abstract onEvent(event: EventCallback): void;\r\n\r\n    public addHTMLTemplate(template: Template): void {\r\n        const element = this._generateHTMLElement(template);\r\n        const container = template.parent.querySelector(\"div.default-control\");\r\n        if (container) {\r\n            if (this._prepend) {\r\n                container.insertBefore(element, container.firstChild);\r\n            } else {\r\n                container.appendChild(element);\r\n            }\r\n        }\r\n    }\r\n\r\n    protected _generateHTMLElement(template: Template): Element | DocumentFragment {\r\n        const compiledTemplate = Handlebars.compile(this._htmlTemplate, { noEscape: template.configuration.params && !!template.configuration.params.noEscape });\r\n        const config = template.configuration.params || {};\r\n        const rawHtml = compiledTemplate(config);\r\n        let fragment: Element | DocumentFragment;\r\n        try {\r\n            fragment = document.createRange().createContextualFragment(rawHtml);\r\n        } catch (e) {\r\n            const test = document.createElement(this._buttonClass);\r\n            test.innerHTML = rawHtml;\r\n            fragment = test;\r\n        }\r\n        return fragment;\r\n    }\r\n}\r\n"]}

package/viewer/defaultViewer.d.ts

@@ -0,0 +1,130 @@
+import type { Template } from "../templating/templateManager";
+import { TemplateManager } from "../templating/templateManager";
+import { AbstractViewerWithTemplate } from "./viewerWithTemplate";
+import type { ViewerModel } from "../model/viewerModel";
+import type { IViewerTemplatePlugin } from "../templating/viewerTemplatePlugin";
+import type { ViewerConfiguration } from "../configuration/configuration";
+import type { IModelConfiguration } from "../configuration/interfaces/modelConfiguration";
+import "@babylonjs/core/Lights/Shadows/shadowGeneratorSceneComponent.js";
+/**
+ * The Default viewer is the default implementation of the AbstractViewer.
+ * It uses the templating system to render a new canvas and controls.
+ */
+export declare class DefaultViewer extends AbstractViewerWithTemplate {
+    containerElement: Element;
+    /**
+     * The corresponsing template manager of this viewer.
+     */
+    templateManager: TemplateManager;
+    fullscreenElement?: Element;
+    /**
+     * Create a new default viewer
+     * @param containerElement the element in which the templates will be rendered
+     * @param initialConfiguration the initial configuration. Defaults to extending the default configuration
+     */
+    constructor(containerElement: Element, initialConfiguration?: ViewerConfiguration);
+    private _registeredPlugins;
+    registerTemplatePlugin(plugin: IViewerTemplatePlugin): void;
+    /**
+     * This will be executed when the templates initialize.
+     * @returns a promise that will be resolved when the templates are loaded
+     */
+    protected _onTemplatesLoaded(): Promise<import("./viewer").AbstractViewer>;
+    private _initNavbar;
+    private _animationList;
+    private _currentAnimation;
+    private _isAnimationPaused;
+    private _resumePlay;
+    private _handlePointerClick;
+    /**
+     * Plays or Pauses animation
+     * @param noUiUpdate
+     */
+    private _togglePlayPause;
+    private _oldIdleRotationValue;
+    /**
+     * Control progress bar position based on animation current frame
+     */
+    private _updateProgressBar;
+    /**
+     * Update Current Animation Speed
+     * @param speed
+     * @param paramsObject
+     */
+    private _updateAnimationSpeed;
+    /**
+     * Update Current Animation Type
+     * @param data
+     * @param data.label
+     * @param data.value
+     * @param paramsObject
+     */
+    private _updateAnimationType;
+    protected _initVR(): void;
+    /**
+     * Toggle fullscreen of the entire viewer
+     */
+    toggleFullscreen: () => void;
+    /**
+     * Preparing the container element to present the viewer
+     */
+    protected _prepareContainerElement(): void;
+    /**
+     * This function will configure the templates and update them after a model was loaded
+     * It is mainly responsible to changing the title and subtitle etc'.
+     * @param model the model to be used to configure the templates by
+     */
+    protected _configureTemplate(model?: ViewerModel): void;
+    /**
+     * This will load a new model to the default viewer
+     * overriding the AbstractViewer's loadModel.
+     * The scene will automatically be cleared of the old models, if exist.
+     * @param model the configuration object (or URL) to load.
+     * @returns a promise that will be resolved when the model is loaded
+     */
+    loadModel(model?: string | File | IModelConfiguration): Promise<ViewerModel>;
+    private _onModelLoaded;
+    /**
+     * Show the overlay and the defined sub-screen.
+     * Mainly used for help and errors
+     * @param subScreen the name of the subScreen. Those can be defined in the configuration object
+     * @returns a promise that will be resolved when the overlay is shown
+     */
+    showOverlayScreen(subScreen: string): Promise<string> | Promise<Template>;
+    /**
+     * Hide the overlay screen.
+     * @returns a promise that will be resolved when the overlay is hidden
+     */
+    hideOverlayScreen(): Promise<string> | Promise<Template>;
+    /**
+     * show the viewer (in case it was hidden)
+     *
+     * @param visibilityFunction an optional function to execute in order to show the container
+     * @returns a promise that will be resolved when the viewer is shown
+     */
+    show(visibilityFunction?: (template: Template) => Promise<Template>): Promise<Template>;
+    /**
+     * hide the viewer (in case it is visible)
+     *
+     * @param visibilityFunction an optional function to execute in order to hide the container
+     * @returns a promise that will be resolved when the viewer is hidden
+     */
+    hide(visibilityFunction?: (template: Template) => Promise<Template>): Promise<Template>;
+    /**
+     * Show the loading screen.
+     * The loading screen can be configured using the configuration object
+     * @returns a promise that will be resolved when the loading screen is shown
+     */
+    showLoadingScreen(): Promise<string> | Promise<Template>;
+    /**
+     * Hide the loading screen
+     * @returns a promise that will be resolved when the loading screen is hidden
+     */
+    hideLoadingScreen(): Promise<string> | Promise<Template>;
+    dispose(): void;
+    protected _onConfigurationLoaded(configuration: ViewerConfiguration): void;
+    /**
+     * An extension of the light configuration of the abstract viewer.
+     */
+    private _configureLights;
+}