@combeenation/3d-viewer 5.1.2 → 5.2.0-alpha1

package/README.md

@@ -1,111 +1,111 @@
-# 3D viewer
-
-## Usage
-
-- Create a label called `JS_3dViewerLbl` which we'll use to render the 3d viewer into:
-
-  - Set its value to `<canvas></canvas>`
-  - Add CSS class `ViewerLbl`
-  - Add the following CSS styles to your configurator:
-
-    ```css
-    .ViewerLbl .cfgrctrl-innerlabel {
-      height: 100%;
-    }
-
-    .ViewerLbl canvas {
-      width: 100%;
-      height: 100%;
-    }
-    ```
-
-- Install viewer dependencies: `npm i @combeenation/3d-viewer`
-- Create specification (example, bare minimum):
-  ```js
-  /**
-   * @return {StructureJson}
-   */
-  export function createSpec() {
-    return {
-      scene: {
-        engine: {
-          antialiasing: true,
-          options: {
-            preserveDrawingBuffer: true,
-            stencil: true,
-            // `xrCompatible` is required to fix WebXR issue in Safari 15 as mentioned in the BabylonJS forum:
-            // https://forum.babylonjs.com/t/safari-15-0-breaks-every-babylonjs-application/23973
-            xrCompatible: false,
-          },
-        },
-        scene: {
-          globals: {},
-          cameras: {},
-        },
-      },
-      setup: {
-        instances: [
-          {
-            name: 'DirtBikeInstance',
-            variant: 'DirtBike',
-            lazy: false,
-            parameters: {
-              visible: true,
-              scaling: '( 1, 1, 1 )',
-              position: '( 0, 0, 0 )',
-              rotation: '( 0, 0, 0 )',
-            },
-          },
-        ],
-      },
-      variants: {
-        DirtBike: {
-          glTF: 'https://combeepublic.blob.core.windows.net/resources/the-3d-file.glb',
-          elements: {
-            Main: ['__root__'],
-          },
-        },
-      },
-    };
-  }
-  ```
-- Bootstrap viewer (example code):
-
-  ```js
-  import { Viewer } from '@combeenation/3d-viewer';
-  import { CtrlUtils } from '@combeenation/custom-js-utils';
-  import { createSpec } from 'path/to/spec-file';
-
-  /**
-   * Bootstraps the viewer using the JSON spec, registers all needed events etc.
-   */
-  export async function bootstrapViewer() {
-    Cbn.utils.Log.add(`Bootstrapping viewer v${Viewer.version}`, Cbn.utils.Log.Type.Misc)();
-
-    const $canvas = $(CtrlUtils.getLabel('JS_3dViewerLbl').el.dom).find('canvas');
-    const canvas = /** @type {HTMLCanvasElement} */ ($canvas.get(0));
-    const viewer = new Viewer(canvas, createSpec());
-    await viewer.bootstrap();
-
-    // The resize listener doesn't seem to work on the canvas itself, therefore we're installing it on its parent
-    Cbn.utils.ResizeEvents.addResizeListener(canvas.parentElement, () => viewer.resize());
-
-    return viewer;
-  }
-  ```
-
-- Call `bootstrapViewer` e.g. somewhere in `onCfgrReady` in your main file:
-
-  ```js
-  CfgrUtils.onCfgrReady(async () => {
-    // ...
-
-    const viewer = await bootstrapViewer();
-
-    // ...
-
-    // Make some functions accessible in the global window object (e.g. for debugging in the console etc.)
-    // Can be extended as needed.
-    window.CfgrJS = { /* ... */ viewer /* ... */ };
-  });
-  ```
+# 3D viewer
+
+## Usage
+
+- Create a label called `JS_3dViewerLbl` which we'll use to render the 3d viewer into:
+
+  - Set its value to `<canvas></canvas>`
+  - Add CSS class `ViewerLbl`
+  - Add the following CSS styles to your configurator:
+
+    ```css
+    .ViewerLbl .cfgrctrl-innerlabel {
+      height: 100%;
+    }
+
+    .ViewerLbl canvas {
+      width: 100%;
+      height: 100%;
+    }
+    ```
+
+- Install viewer dependencies: `npm i @combeenation/3d-viewer`
+- Create specification (example, bare minimum):
+  ```js
+  /**
+   * @return {StructureJson}
+   */
+  export function createSpec() {
+    return {
+      scene: {
+        engine: {
+          antialiasing: true,
+          options: {
+            preserveDrawingBuffer: true,
+            stencil: true,
+            // `xrCompatible` is required to fix WebXR issue in Safari 15 as mentioned in the BabylonJS forum:
+            // https://forum.babylonjs.com/t/safari-15-0-breaks-every-babylonjs-application/23973
+            xrCompatible: false,
+          },
+        },
+        scene: {
+          globals: {},
+          cameras: {},
+        },
+      },
+      setup: {
+        instances: [
+          {
+            name: 'DirtBikeInstance',
+            variant: 'DirtBike',
+            lazy: false,
+            parameters: {
+              visible: true,
+              scaling: '( 1, 1, 1 )',
+              position: '( 0, 0, 0 )',
+              rotation: '( 0, 0, 0 )',
+            },
+          },
+        ],
+      },
+      variants: {
+        DirtBike: {
+          glTF: 'https://combeepublic.blob.core.windows.net/resources/the-3d-file.glb',
+          elements: {
+            Main: ['__root__'],
+          },
+        },
+      },
+    };
+  }
+  ```
+- Bootstrap viewer (example code):
+
+  ```js
+  import { Viewer } from '@combeenation/3d-viewer';
+  import { CtrlUtils } from '@combeenation/custom-js-utils';
+  import { createSpec } from 'path/to/spec-file';
+
+  /**
+   * Bootstraps the viewer using the JSON spec, registers all needed events etc.
+   */
+  export async function bootstrapViewer() {
+    Cbn.utils.Log.add(`Bootstrapping viewer v${Viewer.version}`, Cbn.utils.Log.Type.Misc)();
+
+    const $canvas = $(CtrlUtils.getLabel('JS_3dViewerLbl').el.dom).find('canvas');
+    const canvas = /** @type {HTMLCanvasElement} */ ($canvas.get(0));
+    const viewer = new Viewer(canvas, createSpec());
+    await viewer.bootstrap();
+
+    // The resize listener doesn't seem to work on the canvas itself, therefore we're installing it on its parent
+    Cbn.utils.ResizeEvents.addResizeListener(canvas.parentElement, () => viewer.resize());
+
+    return viewer;
+  }
+  ```
+
+- Call `bootstrapViewer` e.g. somewhere in `onCfgrReady` in your main file:
+
+  ```js
+  CfgrUtils.onCfgrReady(async () => {
+    // ...
+
+    const viewer = await bootstrapViewer();
+
+    // ...
+
+    // Make some functions accessible in the global window object (e.g. for debugging in the console etc.)
+    // Can be extended as needed.
+    window.CfgrJS = { /* ... */ viewer /* ... */ };
+  });
+  ```

package/dist/lib-cjs/buildinfo.json

@@ -1,3 +1,3 @@
-{
-    "version": "5.1.2"
-}
+{
+    "version": "%npm_package_version%"
+}