npm - @babylonjs/viewer - Versions diffs - 7.37.2 → 7.38.0-alpha - Mend

@babylonjs/viewer 7.37.2 → 7.38.0-alpha

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (607) hide show

package/readme.md CHANGED Viewed

@@ -1,40 +1,164 @@
 # BabylonJS Viewer
-This project is a 3d model viewer using babylonjs.
-Online docs: https://doc.babylonjs.com/features/featuresDeepDive/babylonViewer/viewerExamples
+The Babylon Viewer aims to simplify a specific but common Babylon.js use case: loading, viewing, and interacting with a 3D model.
-## ES6/NPM usage
+![Viewer Default Appearance](./docs/ViewerDefault.jpg)
+`Viewer` is a lower level JavaScript class that implements the bulk of the features, and can be used in any babylonjs context (in the browser using pure HTML, in the browser using React, or even in Babylon Native).
+`HTML3DElement` is a custom HTML element that wraps the `Viewer` class and provides a declarative way to use it specifically in HTML via the custom element `<babylon-viewer>`.
+## Using with a Bundler
 Install the package using npm:
 ```bash
-npm install @babylonjs/viewer --save
+npm install @babylonjs/viewer@preview --save
 ```
-Then in JS/Typescript the viewer to be imported via:
+If you want to use the lower level `Viewer` directly in JavaScript code, you can import it and use it like this:
 ```bash
-import * as BabylonViewer from '@babylonjs/viewer';
+import { Engine } from '@babylonjs/core';
+import { Viewer } from '@babylonjs/viewer';
+const engine = new Engine(canvas);
+const viewer = new Viewer(engine);
+viewer.loadModel("https://playground.babylonjs.com/scenes/BoomBox.glb");
+```
+To use the higher level `HTML3DElement` you can import the `@babylonjs/viewer` module and then reference the `<babylon-viewer>` element in your HTML like this:
+```html
+<html lang="en">
+  <body>
+    <!-- If you already import @babylonjs/viewer somewhere in your JavaScript, you don't need this script import. -->
+    <script type="module">
+      import '@babylonjs/viewer';
+    </script>
+    <babylon-viewer source="https://playground.babylonjs.com/scenes/BoomBox.glb"></babylon-viewer>
+  </body>
+</html>
 ```
-Add a babylon element in a html file:
+## Using Directly in a Browser
+If you want to use the viewer directly in a browser without any build tools, you can use the self-contained ESM bundle (which includes all dependencies) through a CDN such as [UNPKG](https://unpkg.com/) or [jsDelivr](https://www.jsdelivr.com/) like this:
 ```html
-<babylon id="babylon-viewer" camera.behaviors.auto-rotate="0"></babylon>
+<html lang="en">
+  <body>
+    <script type="module" src="https://unpkg.com/@babylonjs/viewer@preview/dist/babylon-viewer.esm.min.js"></script>
+    <babylon-viewer source="https://playground.babylonjs.com/scenes/BoomBox.glb"></babylon-viewer>
+  </body>
+</html>
 ```
-And used to load models
+See the [codesandbox.io](https://codesandbox.io/p/sandbox/babylon-viewer-ws82xr) example for a live demo.
+## Features
+The Babylon Viewer is under active development and new features are continuously being added. You can request a specific feature in the [Babylon Forum](https://forum.babylonjs.com/c/features/11).
+**⚠️ NOTE**: While the Babylon Viewer is production ready in terms of performance, reliability, etc., the `@preview` tag and `-alpha` suffix are used to indicate that the API is still subject to change.
-```javascript
-BabylonViewer.viewerManager.getViewerPromiseById("babylon-viewer").then(function (viewer) {
-    // this will resolve only after the viewer with this specific ID is initialized
-    viewer.onEngineInitObservable.add(function (scene) {
-        viewer.loadModel({
-            title: "Helmet",
-            subtitle: "BabylonJS",
-            thumbnail: "https://www.babylonjs.com/img/favicon/apple-icon-144x144.png",
-            url: "https://www.babylonjs.com/Assets/DamagedHelmet/glTF/DamagedHelmet.gltf",
-        });
-    });
-});
+### Formats, Capabilities, and Dynamic Imports
+The Babylon Viewer supports all the formats that Babylon.js supports, as well as many capabilities such as animation and audio. However, the Babylon Viewer (with support from various Babylon.js libraries) uses dynamic imports to defer loading formats and capabilities until a model is loaded of a specific type or that uses a specific capability. This reduces the download burden on the end user and reduces the time to get something on the screen.
+### Advanced Usage and Customization
+While the Babylon Viewer is specifically designed to make viewing a single 3D model easy, it also exposes the underlying Babylon.js components so that you can customize it for your specific scenario and needs.
+The `HTML3DElement` exposes a `viewerDetails` property and a `viewerready` event that you can use to access the underlying `Viewer` object, the `Scene` object, and the loaded model (`AssetContainer`).
+### WebGL and WebGPU
+`HTML3DElement` will choose an underlying engine by default, and how it chooses will change over time. You can use the `engine` attribute to specify a specific engine, such as `WebGL` or `WebGPU`.
+### Lighting / Environment
+A Babylon.js environment file can be applied to the a `<babylon-viewer>` through the `environment` attribute. For example:
+```html
+<babylon-viewer
+  source="https://playground.babylonjs.com/scenes/BoomBox.glb"
+  environment="https://unpkg.com/@babylonjs/viewer@preview/assets/photoStudio.env">
+</babylon-viewer>
 ```
+The environment is automatically used as the skybox, and also used for image-based lighting (IBL) when a model is loaded that uses PBR materials (such as glTF), unless the model provides its own lights. When IBL is not used and the model does not provide its own lights, default lighting is applied using Babylon.js lights.
+### Styling
+`HTML3DElement` includes default UI for various capabilities, such as animation. You can customize the UI in a number of ways:
+#### CSS Variables
+Various CSS variables can be set to customize the appearance of the viewer. These variables are applied to the `babylon-viewer` element and are inherited by all UI elements within the viewer.
+| Variable                      | Description                                                                                                                                 |
+| ----------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- |
+| `--ui-foreground-color`       | The default color for the foreground of all UI elements.                                                                                    |
+| `--ui-background-hue`         | The default hue for the background of all UI elements.                                                                                      |
+| `--ui-background-saturation`  | The default saturation for the background of all UI elements.                                                                               |
+| `--ui-background-lightness`   | The default lightness for the background of all UI elements.                                                                                |
+| `--ui-background-opacity`     | The default opacity for the background of all UI elements.                                                                                  |
+| `--ui-background-color`       | The default color for the background of all UI elements (derived from the background hue, saturation, lightness, and opacity).              |
+| `--ui-background-color-hover` | The default color for the background of all UI elements when hovered (derived from the background hue, saturation, lightness, and opacity). |
+As an example, if you wanted UI elements with a moderately saturated bluish background, you could apply the following CSS variables on the `babylon-viewer` element:
+```css
+babylon-viewer {
+  --ui-background-hue: 200;
+  --ui-background-saturation: 70%;
+}
+```
+![Viewer styled with CSS Variables](./docs/ViewerStyled.jpg)
+#### Parts
+Various parts of the viewer can be styled using CSS part selectors. The following parts are available:
+| Part Name  | Description                              |
+| ---------- | ---------------------------------------- |
+| `tool-bar` | The toolbar used for animation controls. |
+As an example, if you wanted to style the toolbar to move it to the top and remove the rounded corners and margin, you could apply the following CSS on the `babylon-viewer` element:
+```css
+babylon-viewer::part(tool-bar) {
+  border-radius: 0;
+  left: 0;
+  right: 0;
+  bottom: unset;
+  top: 0;
+  width: unset;
+  max-width: unset;
+  transform: unset;
+}
+```
+![Viewer styled with Parts](./docs/ViewerParts.jpg)
+#### Slots
+Various slots are defined that allow entire sections of the UI to be replaced. The following slots are available:
+| Slot Name  | Description                              |
+| ---------- | ---------------------------------------- |
+| `tool-bar` | The toolbar used for animation controls. |
+As an example, if you wanted to replace the toolbar with a custom button that just toggles animation play/pause state, you could do so with the following:
+```html
+<babylon-viewer source="https://raw.githubusercontent.com/BabylonJS/Assets/master/meshes/ufo.glb">
+  <div slot="tool-bar" style="position: absolute; top: 12px; left: 12px; width: 100px; height: 36px">
+    <button onclick="document.querySelector('babylon-viewer').toggleAnimation()">Toggle Animation</button>
+  </div>
+</babylon-viewer>
+```
+![Viewer UI replacement with Slots](./docs/ViewerSlots.jpg)

package/configuration/configuration.d.ts DELETED Viewed

@@ -1,107 +0,0 @@
-import type { IEnvironmentMapConfiguration } from "./interfaces/environmentMapConfiguration";
-import type { EngineOptions } from "@babylonjs/core/Engines/thinEngine.js";
-import type { IObserversConfiguration } from "./interfaces/observersConfiguration";
-import type { IModelConfiguration } from "./interfaces/modelConfiguration";
-import type { ISceneConfiguration } from "./interfaces/sceneConfiguration";
-import type { ISceneOptimizerConfiguration } from "./interfaces/sceneOptimizerConfiguration";
-import type { ICameraConfiguration } from "./interfaces/cameraConfiguration";
-import type { ISkyboxConfiguration } from "./interfaces/skyboxConfiguration";
-import type { IGroundConfiguration } from "./interfaces/groundConfiguration";
-import type { ILightConfiguration } from "./interfaces/lightConfiguration";
-import type { ITemplateConfiguration } from "./interfaces/templateConfiguration";
-import type { IVRConfiguration } from "./interfaces/vrConfiguration";
-import type { IDefaultRenderingPipelineConfiguration } from "./interfaces/defaultRenderingPipelineConfiguration";
-export declare function getConfigurationKey(key: string, configObject: any): any;
-export interface ViewerConfiguration {
-    version?: string;
-    extends?: string;
-    pageUrl?: string;
-    configuration?: string | {
-        url?: string;
-        payload?: any;
-        mapper?: string;
-    };
-    observers?: IObserversConfiguration;
-    canvasElement?: string;
-    model?: IModelConfiguration | string;
-    scene?: ISceneConfiguration;
-    optimizer?: ISceneOptimizerConfiguration | boolean;
-    camera?: ICameraConfiguration;
-    skybox?: boolean | ISkyboxConfiguration;
-    ground?: boolean | IGroundConfiguration;
-    lights?: {
-        [name: string]: number | boolean | ILightConfiguration;
-    };
-    engine?: {
-        renderInBackground?: boolean;
-        antialiasing?: boolean;
-        disableResize?: boolean;
-        engineOptions?: EngineOptions;
-        adaptiveQuality?: boolean;
-        hdEnabled?: boolean;
-    };
-    templates?: {
-        main: ITemplateConfiguration;
-        [key: string]: ITemplateConfiguration;
-    };
-    customShaders?: {
-        shaders?: {
-            [key: string]: string;
-        };
-        includes?: {
-            [key: string]: string;
-        };
-    };
-    loaderPlugins?: {
-        extendedMaterial?: boolean;
-        msftLod?: boolean;
-        telemetry?: boolean;
-        minecraft?: boolean;
-        [propName: string]: boolean | undefined;
-    };
-    environmentMap?: IEnvironmentMapConfiguration;
-    vr?: IVRConfiguration;
-    "3dCommerceCertified"?: boolean;
-    lab?: {
-        flashlight?: boolean | {
-            exponent?: number;
-            angle?: number;
-            intensity?: number;
-            diffuse?: {
-                r: number;
-                g: number;
-                b: number;
-            };
-            specular?: {
-                r: number;
-                g: number;
-                b: number;
-            };
-        };
-        hideLoadingDelay?: number;
-        /** @deprecated */
-        assetsRootURL?: string;
-        environmentMainColor?: {
-            r: number;
-            g: number;
-            b: number;
-        };
-        /** @deprecated */
-        environmentMap?: {
-            /**
-             * Environment map texture path in relative to the asset folder.
-             */
-            texture: string;
-            /**
-             * Default rotation to apply to the environment map.
-             */
-            rotationY: number;
-            /**
-             * Tint level of the main color on the environment map.
-             */
-            tintLevel: number;
-        };
-        defaultRenderingPipelines?: boolean | IDefaultRenderingPipelineConfiguration;
-        globalLightRotation?: number;
-    };
-}

package/configuration/configuration.js DELETED Viewed

@@ -1,16 +0,0 @@
-export function getConfigurationKey(key, configObject) {
-    var splits = key.split(".");
-    if (splits.length === 0 || !configObject) {
-        return;
-    }
-    else if (splits.length === 1) {
-        if (configObject[key] !== undefined) {
-            return configObject[key];
-        }
-    }
-    else {
-        var firstKey = splits.shift();
-        return getConfigurationKey(splits.join("."), configObject[firstKey]);
-    }
-}
-//# sourceMappingURL=configuration.js.map

package/configuration/configuration.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"configuration.js","sourceRoot":"","sources":["../../../../tools/viewer/src/configuration/configuration.ts"],"names":[],"mappings":"AAeA,MAAM,UAAU,mBAAmB,CAAC,GAAW,EAAE,YAAiB;IAC9D,IAAM,MAAM,GAAG,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAE9B,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;QACvC,OAAO;IACX,CAAC;SAAM,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAC7B,IAAI,YAAY,CAAC,GAAG,CAAC,KAAK,SAAS,EAAE,CAAC;YAClC,OAAO,YAAY,CAAC,GAAG,CAAC,CAAC;QAC7B,CAAC;IACL,CAAC;SAAM,CAAC;QACJ,IAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,EAAE,CAAC;QAChC,OAAO,mBAAmB,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,YAAY,CAAC,QAAS,CAAC,CAAC,CAAC;IAC1E,CAAC;AACL,CAAC","sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\r\nimport type { IEnvironmentMapConfiguration } from \"./interfaces/environmentMapConfiguration\";\r\nimport type { EngineOptions } from \"core/Engines/thinEngine\";\r\nimport type { IObserversConfiguration } from \"./interfaces/observersConfiguration\";\r\nimport type { IModelConfiguration } from \"./interfaces/modelConfiguration\";\r\nimport type { ISceneConfiguration } from \"./interfaces/sceneConfiguration\";\r\nimport type { ISceneOptimizerConfiguration } from \"./interfaces/sceneOptimizerConfiguration\";\r\nimport type { ICameraConfiguration } from \"./interfaces/cameraConfiguration\";\r\nimport type { ISkyboxConfiguration } from \"./interfaces/skyboxConfiguration\";\r\nimport type { IGroundConfiguration } from \"./interfaces/groundConfiguration\";\r\nimport type { ILightConfiguration } from \"./interfaces/lightConfiguration\";\r\nimport type { ITemplateConfiguration } from \"./interfaces/templateConfiguration\";\r\nimport type { IVRConfiguration } from \"./interfaces/vrConfiguration\";\r\nimport type { IDefaultRenderingPipelineConfiguration } from \"./interfaces/defaultRenderingPipelineConfiguration\";\r\n\r\nexport function getConfigurationKey(key: string, configObject: any): any {\r\n const splits = key.split(\".\");\r\n\r\n if (splits.length === 0 || !configObject) {\r\n return;\r\n } else if (splits.length === 1) {\r\n if (configObject[key] !== undefined) {\r\n return configObject[key];\r\n }\r\n } else {\r\n const firstKey = splits.shift();\r\n return getConfigurationKey(splits.join(\".\"), configObject[firstKey!]);\r\n }\r\n}\r\n\r\nexport interface ViewerConfiguration {\r\n // configuration version\r\n version?: string;\r\n extends?: string; // is this configuration extending an existing configuration?\r\n\r\n pageUrl?: string; // will be used for sharing and other fun stuff. This is the page showing the model (not the model's url!)\r\n\r\n configuration?:\r\n | string\r\n | {\r\n url?: string;\r\n payload?: any;\r\n mapper?: string; // json (default), html, yaml, xml, etc'. if not provided, file extension will be used.\r\n };\r\n\r\n // names of functions in the window context.\r\n observers?: IObserversConfiguration;\r\n\r\n canvasElement?: string; // if there is a need to override the standard implementation - ID of HTMLCanvasElement\r\n\r\n model?: IModelConfiguration | string;\r\n\r\n scene?: ISceneConfiguration;\r\n optimizer?: ISceneOptimizerConfiguration | boolean;\r\n // at the moment, support only a single camera.\r\n camera?: ICameraConfiguration;\r\n skybox?: boolean | ISkyboxConfiguration;\r\n\r\n ground?: boolean | IGroundConfiguration;\r\n lights?: {\r\n //globalRotation: number,\r\n [name: string]: number | boolean | ILightConfiguration;\r\n };\r\n // engine configuration. optional!\r\n engine?: {\r\n renderInBackground?: boolean;\r\n antialiasing?: boolean;\r\n disableResize?: boolean;\r\n engineOptions?: EngineOptions;\r\n adaptiveQuality?: boolean;\r\n hdEnabled?: boolean;\r\n };\r\n //templateStructure?: ITemplateStructure,\r\n templates?: {\r\n main: ITemplateConfiguration;\r\n [key: string]: ITemplateConfiguration;\r\n };\r\n\r\n customShaders?: {\r\n shaders?: {\r\n [key: string]: string;\r\n };\r\n includes?: {\r\n [key: string]: string;\r\n };\r\n };\r\n\r\n loaderPlugins?: {\r\n extendedMaterial?: boolean;\r\n msftLod?: boolean;\r\n telemetry?: boolean;\r\n minecraft?: boolean;\r\n\r\n [propName: string]: boolean | undefined;\r\n };\r\n\r\n environmentMap?: IEnvironmentMapConfiguration;\r\n\r\n vr?: IVRConfiguration;\r\n \"3dCommerceCertified\"?: boolean;\r\n\r\n // features that are being tested.\r\n // those features' syntax will change and move out!\r\n // Don't use in production (or be ready to make the changes :) )\r\n lab?: {\r\n flashlight?:\r\n | boolean\r\n | {\r\n exponent?: number;\r\n angle?: number;\r\n intensity?: number;\r\n diffuse?: { r: number; g: number; b: number };\r\n specular?: { r: number; g: number; b: number };\r\n };\r\n hideLoadingDelay?: number;\r\n /** @deprecated */\r\n assetsRootURL?: string;\r\n environmentMainColor?: { r: number; g: number; b: number };\r\n /** @deprecated */\r\n environmentMap?: {\r\n /**\r\n * Environment map texture path in relative to the asset folder.\r\n */\r\n texture: string;\r\n\r\n /**\r\n * Default rotation to apply to the environment map.\r\n */\r\n rotationY: number;\r\n\r\n /**\r\n * Tint level of the main color on the environment map.\r\n */\r\n tintLevel: number;\r\n };\r\n defaultRenderingPipelines?: boolean | IDefaultRenderingPipelineConfiguration;\r\n globalLightRotation?: number;\r\n };\r\n}\r\n"]}

package/configuration/configurationCompatibility.d.ts DELETED Viewed

@@ -1,8 +0,0 @@
-import type { ViewerConfiguration } from "./configuration";
-/**
- * This function will make sure the configuration file is taking deprecated fields into account
- * and is setting them to the correct keys and values.
- *
- * @param configuration The configuration to process. Mutable!
- */
-export declare function processConfigurationCompatibility(configuration: ViewerConfiguration): void;

package/configuration/configurationCompatibility.js DELETED Viewed

@@ -1,66 +0,0 @@
-import { getConfigurationKey } from "./configuration.js";
-/**
- * This function will make sure the configuration file is taking deprecated fields into account
- * and is setting them to the correct keys and values.
- *
- * @param configuration The configuration to process. Mutable!
- */
-export function processConfigurationCompatibility(configuration) {
-    if (configuration.camera) {
-        // camera contrast -> image processing contrast
-        if (configuration.camera.contrast !== undefined) {
-            setKeyInObject(configuration, "scene.imageProcessingConfiguration.contrast", configuration.camera.contrast);
-        }
-        // camera exposure -> image processing exposure
-        if (configuration.camera.exposure !== undefined) {
-            setKeyInObject(configuration, "scene.imageProcessingConfiguration.exposure", configuration.camera.exposure);
-        }
-    }
-    if (configuration.scene) {
-        //glow
-        if (configuration.scene.glow) {
-            setKeyInObject(configuration, "lab.defaultRenderingPipelines.glowLayerEnabled", true);
-            var enabledProcessing = getConfigurationKey("scene.imageProcessingConfiguration.isEnabled", configuration);
-            if (enabledProcessing !== false) {
-                setKeyInObject(configuration, "scene.imageProcessingConfiguration.isEnabled", true);
-            }
-        }
-        if (configuration.scene.mainColor) {
-            setKeyInObject(configuration, "environmentMap.mainColor", configuration.scene.mainColor, true);
-        }
-    }
-    if (configuration.model && typeof configuration.model === "object") {
-        // castShadows === castShadow
-        if (configuration.model.castShadows !== undefined && configuration.model.castShadow === undefined) {
-            configuration.model.castShadow = configuration.model.castShadows;
-        }
-    }
-    if (configuration.lab) {
-        if (configuration.lab.assetsRootURL) {
-            setKeyInObject(configuration, "scene.assetsRootURL", configuration.lab.assetsRootURL, true);
-        }
-        if (configuration.lab.environmentMap) {
-            setKeyInObject(configuration, "environmentMap", configuration.lab.environmentMap, true);
-        }
-    }
-}
-function setKeyInObject(object, keys, value, shouldOverwrite) {
-    var keySplit = keys.split(".");
-    if (keySplit.length === 0) {
-        return;
-    }
-    var lastKey = keySplit.pop();
-    if (!lastKey) {
-        return;
-    }
-    var curObj = object;
-    keySplit.forEach(function (key) {
-        curObj[key] = curObj[key] || {};
-        curObj = curObj[key];
-    });
-    if (curObj[lastKey] !== undefined && !shouldOverwrite) {
-        return;
-    }
-    curObj[lastKey] = value;
-}
-//# sourceMappingURL=configurationCompatibility.js.map

package/configuration/configurationCompatibility.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"configurationCompatibility.js","sourceRoot":"","sources":["../../../../tools/viewer/src/configuration/configurationCompatibility.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ViewerConfiguration } from \"./configuration\";\r\nimport { getConfigurationKey } from \"./configuration\";\r\n/**\r\n * This function will make sure the configuration file is taking deprecated fields into account\r\n * and is setting them to the correct keys and values.\r\n *\r\n * @param configuration The configuration to process. Mutable!\r\n */\r\nexport function processConfigurationCompatibility(configuration: ViewerConfiguration) {\r\n if (configuration.camera) {\r\n // camera contrast -> image processing contrast\r\n if (configuration.camera.contrast !== undefined) {\r\n setKeyInObject(configuration, \"scene.imageProcessingConfiguration.contrast\", configuration.camera.contrast);\r\n }\r\n\r\n // camera exposure -> image processing exposure\r\n if (configuration.camera.exposure !== undefined) {\r\n setKeyInObject(configuration, \"scene.imageProcessingConfiguration.exposure\", configuration.camera.exposure);\r\n }\r\n }\r\n\r\n if (configuration.scene) {\r\n //glow\r\n if (configuration.scene.glow) {\r\n setKeyInObject(configuration, \"lab.defaultRenderingPipelines.glowLayerEnabled\", true);\r\n const enabledProcessing = getConfigurationKey(\"scene.imageProcessingConfiguration.isEnabled\", configuration);\r\n if (enabledProcessing !== false) {\r\n setKeyInObject(configuration, \"scene.imageProcessingConfiguration.isEnabled\", true);\r\n }\r\n }\r\n\r\n if (configuration.scene.mainColor) {\r\n setKeyInObject(configuration, \"environmentMap.mainColor\", configuration.scene.mainColor, true);\r\n }\r\n }\r\n\r\n if (configuration.model && typeof configuration.model === \"object\") {\r\n // castShadows === castShadow\r\n if ((<any>configuration.model).castShadows !== undefined && configuration.model.castShadow === undefined) {\r\n configuration.model.castShadow = (<any>configuration.model).castShadows;\r\n }\r\n }\r\n\r\n if (configuration.lab) {\r\n if (configuration.lab.assetsRootURL) {\r\n setKeyInObject(configuration, \"scene.assetsRootURL\", configuration.lab.assetsRootURL, true);\r\n }\r\n if (configuration.lab.environmentMap) {\r\n setKeyInObject(configuration, \"environmentMap\", configuration.lab.environmentMap, true);\r\n }\r\n }\r\n}\r\n\r\nfunction setKeyInObject(object: any, keys: string, value: any, shouldOverwrite?: boolean) {\r\n const keySplit = keys.split(\".\");\r\n if (keySplit.length === 0) {\r\n return;\r\n }\r\n const lastKey = keySplit.pop();\r\n if (!lastKey) {\r\n return;\r\n }\r\n let curObj = object;\r\n keySplit.forEach((key) => {\r\n curObj[key] = curObj[key] || {};\r\n curObj = curObj[key];\r\n });\r\n if (curObj[lastKey] !== undefined && !shouldOverwrite) {\r\n return;\r\n }\r\n curObj[lastKey] = value;\r\n}\r\n"]}

package/configuration/configurationContainer.d.ts DELETED Viewed

@@ -1,10 +0,0 @@
-import type { ViewerConfiguration } from "./configuration";
-import { Color3 } from "@babylonjs/core/Maths/math.js";
-import type { Scene } from "@babylonjs/core/scene.js";
-export declare class ConfigurationContainer {
-    configuration: ViewerConfiguration;
-    viewerId: string;
-    mainColor: Color3;
-    reflectionColor: Color3;
-    scene?: Scene;
-}

package/configuration/configurationContainer.js DELETED Viewed

@@ -1,10 +0,0 @@
-import { Color3 } from "@babylonjs/core/Maths/math.js";
-var ConfigurationContainer = /** @class */ (function () {
-    function ConfigurationContainer() {
-        this.mainColor = Color3.White();
-        this.reflectionColor = Color3.White();
-    }
-    return ConfigurationContainer;
-}());
-export { ConfigurationContainer };
-//# sourceMappingURL=configurationContainer.js.map

package/configuration/configurationContainer.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"configurationContainer.js","sourceRoot":"","sources":["../../../../tools/viewer/src/configuration/configurationContainer.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,sCAAwB;AAGzC;IAAA;QAKW,cAAS,GAAW,MAAM,CAAC,KAAK,EAAE,CAAC;QACnC,oBAAe,GAAW,MAAM,CAAC,KAAK,EAAE,CAAC;IAEpD,CAAC;IAAD,6BAAC;AAAD,CAAC,AARD,IAQC","sourcesContent":["import type { ViewerConfiguration } from \"./configuration\";\r\nimport { Color3 } from \"core/Maths/math\";\r\nimport type { Scene } from \"core/scene\";\r\n\r\nexport class ConfigurationContainer {\r\n public configuration: ViewerConfiguration;\r\n\r\n public viewerId: string;\r\n\r\n public mainColor: Color3 = Color3.White();\r\n public reflectionColor: Color3 = Color3.White();\r\n public scene?: Scene;\r\n}\r\n"]}

package/configuration/globals.d.ts DELETED Viewed

@@ -1,6 +0,0 @@
-export declare class ViewerGlobals {
-    disableInit: boolean;
-    disableWebGL2Support: boolean;
-    get version(): string;
-}
-export declare const viewerGlobals: ViewerGlobals;

package/configuration/globals.js DELETED Viewed

@@ -1,18 +0,0 @@
-import { Engine } from "@babylonjs/core/Engines/engine.js";
-var ViewerGlobals = /** @class */ (function () {
-    function ViewerGlobals() {
-        this.disableInit = false;
-        this.disableWebGL2Support = false;
-    }
-    Object.defineProperty(ViewerGlobals.prototype, "version", {
-        get: function () {
-            return Engine.Version;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    return ViewerGlobals;
-}());
-export { ViewerGlobals };
-export var viewerGlobals = new ViewerGlobals();
-//# sourceMappingURL=globals.js.map

package/configuration/globals.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"globals.js","sourceRoot":"","sources":["../../../../tools/viewer/src/configuration/globals.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,0CAA4B;AAE7C;IAAA;QACW,gBAAW,GAAY,KAAK,CAAC;QAC7B,yBAAoB,GAAY,KAAK,CAAC;IAKjD,CAAC;IAHG,sBAAW,kCAAO;aAAlB;YACI,OAAO,MAAM,CAAC,OAAO,CAAC;QAC1B,CAAC;;;OAAA;IACL,oBAAC;AAAD,CAAC,AAPD,IAOC;;AAED,MAAM,CAAC,IAAM,aAAa,GAAkB,IAAI,aAAa,EAAE,CAAC","sourcesContent":["import { Engine } from \"core/Engines/engine\";\r\n\r\nexport class ViewerGlobals {\r\n public disableInit: boolean = false;\r\n public disableWebGL2Support: boolean = false;\r\n\r\n public get version(): string {\r\n return Engine.Version;\r\n }\r\n}\r\n\r\nexport const viewerGlobals: ViewerGlobals = new ViewerGlobals();\r\n"]}

package/configuration/index.d.ts DELETED Viewed

	@@ -1,2 +0,0 @@
1	- export * from "./configuration";
2	- export * from "./interfaces/index";

package/configuration/index.js DELETED Viewed

@@ -1,4 +0,0 @@
-/* eslint-disable import/no-internal-modules */
-export * from "./configuration.js";
-export * from "./interfaces/index.js";
-//# sourceMappingURL=index.js.map

package/configuration/index.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../tools/viewer/src/configuration/index.ts"],"names":[],"mappings":"AAAA,+CAA+C;AAC/C,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC","sourcesContent":["/* eslint-disable import/no-internal-modules /\r\nexport from \"./configuration\";\r\nexport * from \"./interfaces/index\";\r\n"]}

package/configuration/interfaces/cameraConfiguration.d.ts DELETED Viewed

@@ -1,31 +0,0 @@
-export interface ICameraConfiguration {
-    position?: {
-        x: number;
-        y: number;
-        z: number;
-    };
-    rotation?: {
-        x: number;
-        y: number;
-        z: number;
-        w: number;
-    };
-    fov?: number;
-    fovMode?: number;
-    minZ?: number;
-    maxZ?: number;
-    inertia?: number;
-    exposure?: number;
-    pinchPrecision?: number;
-    behaviors?: {
-        [name: string]: boolean | number | ICameraBehaviorConfiguration;
-    };
-    disableCameraControl?: boolean;
-    disableCtrlForPanning?: boolean;
-    disableAutoFocus?: boolean;
-    [propName: string]: any;
-}
-export interface ICameraBehaviorConfiguration {
-    type: number;
-    [propName: string]: any;
-}

package/configuration/interfaces/cameraConfiguration.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- export {};
2	- //# sourceMappingURL=cameraConfiguration.js.map

package/configuration/interfaces/cameraConfiguration.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"cameraConfiguration.js","sourceRoot":"","sources":["../../../../../tools/viewer/src/configuration/interfaces/cameraConfiguration.ts"],"names":[],"mappings":"","sourcesContent":["export interface ICameraConfiguration {\r\n position?: { x: number; y: number; z: number };\r\n rotation?: { x: number; y: number; z: number; w: number };\r\n fov?: number;\r\n fovMode?: number;\r\n minZ?: number;\r\n maxZ?: number;\r\n inertia?: number;\r\n exposure?: number;\r\n pinchPrecision?: number;\r\n behaviors?: {\r\n [name: string]: boolean | number | ICameraBehaviorConfiguration;\r\n };\r\n disableCameraControl?: boolean;\r\n disableCtrlForPanning?: boolean;\r\n disableAutoFocus?: boolean;\r\n\r\n [propName: string]: any;\r\n}\r\n\r\nexport interface ICameraBehaviorConfiguration {\r\n type: number;\r\n [propName: string]: any;\r\n}\r\n"]}

package/configuration/interfaces/colorGradingConfiguration.d.ts DELETED Viewed

@@ -1,81 +0,0 @@
-/**
- * The Color Grading Configuration groups the different settings used to define the color grading used in the viewer.
- */
-export interface IColorGradingConfiguration {
-    /**
-     * Transform data string, encoded as determined by transformDataFormat.
-     */
-    transformData: string;
-    /**
-     * The encoding format of TransformData (currently only raw-base16 is supported).
-     */
-    transformDataFormat: string;
-    /**
-     * The weight of the transform
-     */
-    transformWeight: number;
-    /**
-     * Color curve colorFilterHueGlobal value
-     */
-    colorFilterHueGlobal: number;
-    /**
-     * Color curve colorFilterHueShadows value
-     */
-    colorFilterHueShadows: number;
-    /**
-     * Color curve colorFilterHueMidtones value
-     */
-    colorFilterHueMidtones: number;
-    /**
-     * Color curve colorFilterHueHighlights value
-     */
-    colorFilterHueHighlights: number;
-    /**
-     * Color curve colorFilterDensityGlobal value
-     */
-    colorFilterDensityGlobal: number;
-    /**
-     * Color curve colorFilterDensityShadows value
-     */
-    colorFilterDensityShadows: number;
-    /**
-     * Color curve colorFilterDensityMidtones value
-     */
-    colorFilterDensityMidtones: number;
-    /**
-     * Color curve colorFilterDensityHighlights value
-     */
-    colorFilterDensityHighlights: number;
-    /**
-     * Color curve saturationGlobal value
-     */
-    saturationGlobal: number;
-    /**
-     * Color curve saturationShadows value
-     */
-    saturationShadows: number;
-    /**
-     * Color curve saturationMidtones value
-     */
-    saturationMidtones: number;
-    /**
-     * Color curve saturationHighlights value
-     */
-    saturationHighlights: number;
-    /**
-     * Color curve exposureGlobal value
-     */
-    exposureGlobal: number;
-    /**
-     * Color curve exposureShadows value
-     */
-    exposureShadows: number;
-    /**
-     * Color curve exposureMidtones value
-     */
-    exposureMidtones: number;
-    /**
-     * Color curve exposureHighlights value
-     */
-    exposureHighlights: number;
-}

package/configuration/interfaces/colorGradingConfiguration.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- export {};
2	- //# sourceMappingURL=colorGradingConfiguration.js.map

package/configuration/interfaces/colorGradingConfiguration.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"colorGradingConfiguration.js","sourceRoot":"","sources":["../../../../../tools/viewer/src/configuration/interfaces/colorGradingConfiguration.ts"],"names":[],"mappings":"","sourcesContent":["/**\r\n * The Color Grading Configuration groups the different settings used to define the color grading used in the viewer.\r\n */\r\nexport interface IColorGradingConfiguration {\r\n /**\r\n * Transform data string, encoded as determined by transformDataFormat.\r\n */\r\n transformData: string;\r\n\r\n /**\r\n * The encoding format of TransformData (currently only raw-base16 is supported).\r\n */\r\n transformDataFormat: string;\r\n\r\n /**\r\n * The weight of the transform\r\n */\r\n transformWeight: number;\r\n\r\n /**\r\n * Color curve colorFilterHueGlobal value\r\n */\r\n colorFilterHueGlobal: number;\r\n\r\n /**\r\n * Color curve colorFilterHueShadows value\r\n */\r\n colorFilterHueShadows: number;\r\n\r\n /**\r\n * Color curve colorFilterHueMidtones value\r\n */\r\n colorFilterHueMidtones: number;\r\n\r\n /**\r\n * Color curve colorFilterHueHighlights value\r\n */\r\n colorFilterHueHighlights: number;\r\n\r\n /**\r\n * Color curve colorFilterDensityGlobal value\r\n */\r\n colorFilterDensityGlobal: number;\r\n\r\n /**\r\n * Color curve colorFilterDensityShadows value\r\n */\r\n colorFilterDensityShadows: number;\r\n\r\n /**\r\n * Color curve colorFilterDensityMidtones value\r\n */\r\n colorFilterDensityMidtones: number;\r\n\r\n /**\r\n * Color curve colorFilterDensityHighlights value\r\n */\r\n colorFilterDensityHighlights: number;\r\n\r\n /**\r\n * Color curve saturationGlobal value\r\n */\r\n saturationGlobal: number;\r\n\r\n /**\r\n * Color curve saturationShadows value\r\n */\r\n saturationShadows: number;\r\n\r\n /**\r\n * Color curve saturationMidtones value\r\n */\r\n saturationMidtones: number;\r\n\r\n /**\r\n * Color curve saturationHighlights value\r\n */\r\n saturationHighlights: number;\r\n\r\n /**\r\n * Color curve exposureGlobal value\r\n */\r\n exposureGlobal: number;\r\n\r\n /**\r\n * Color curve exposureShadows value\r\n */\r\n exposureShadows: number;\r\n\r\n /**\r\n * Color curve exposureMidtones value\r\n */\r\n exposureMidtones: number;\r\n\r\n /**\r\n * Color curve exposureHighlights value\r\n */\r\n exposureHighlights: number;\r\n}\r\n"]}

package/configuration/interfaces/defaultRenderingPipelineConfiguration.d.ts DELETED Viewed

@@ -1,20 +0,0 @@
-import type { DepthOfFieldEffectBlurLevel } from "@babylonjs/core/PostProcesses/depthOfFieldEffect.js";
-export interface IDefaultRenderingPipelineConfiguration {
-    sharpenEnabled?: boolean;
-    bloomEnabled?: boolean;
-    bloomThreshold?: number;
-    depthOfFieldEnabled?: boolean;
-    depthOfFieldBlurLevel?: DepthOfFieldEffectBlurLevel;
-    fxaaEnabled?: boolean;
-    imageProcessingEnabled?: boolean;
-    defaultPipelineTextureType?: number;
-    bloomScale?: number;
-    chromaticAberrationEnabled?: boolean;
-    grainEnabled?: boolean;
-    bloomKernel?: number;
-    hardwareScaleLevel?: number;
-    bloomWeight?: number;
-    hdr?: boolean;
-    samples?: number;
-    glowLayerEnabled?: boolean;
-}

package/configuration/interfaces/defaultRenderingPipelineConfiguration.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- export {};
2	- //# sourceMappingURL=defaultRenderingPipelineConfiguration.js.map