@combeenation/3d-viewer 5.0.1 → 5.0.3-beta2

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 (109) hide show
  1. package/README.md +111 -114
  2. package/dist/lib-cjs/api/classes/animationInterface.d.ts +8 -8
  3. package/dist/lib-cjs/api/classes/animationInterface.js +1 -1
  4. package/dist/lib-cjs/api/classes/dottedPath.d.ts +79 -79
  5. package/dist/lib-cjs/api/classes/dottedPath.js +187 -187
  6. package/dist/lib-cjs/api/classes/element.d.ts +139 -139
  7. package/dist/lib-cjs/api/classes/element.js +794 -794
  8. package/dist/lib-cjs/api/classes/element.js.map +1 -1
  9. package/dist/lib-cjs/api/classes/elementParameterizable.d.ts +14 -0
  10. package/dist/lib-cjs/api/classes/elementParameterizable.js +135 -0
  11. package/dist/lib-cjs/api/classes/elementParameterizable.js.map +1 -0
  12. package/dist/lib-cjs/api/classes/event.d.ts +326 -326
  13. package/dist/lib-cjs/api/classes/event.js +371 -371
  14. package/dist/lib-cjs/api/classes/eventBroadcaster.d.ts +26 -26
  15. package/dist/lib-cjs/api/classes/eventBroadcaster.js +53 -53
  16. package/dist/lib-cjs/api/classes/parameter.d.ts +316 -259
  17. package/dist/lib-cjs/api/classes/parameter.js +451 -388
  18. package/dist/lib-cjs/api/classes/parameter.js.map +1 -1
  19. package/dist/lib-cjs/api/classes/parameterObservable.d.ts +36 -36
  20. package/dist/lib-cjs/api/classes/parameterObservable.js +101 -101
  21. package/dist/lib-cjs/api/classes/parameterizable.d.ts +15 -15
  22. package/dist/lib-cjs/api/classes/parameterizable.js +149 -149
  23. package/dist/lib-cjs/api/classes/placementAnimation.d.ts +44 -44
  24. package/dist/lib-cjs/api/classes/placementAnimation.js +163 -163
  25. package/dist/lib-cjs/api/classes/variant.d.ts +234 -234
  26. package/dist/lib-cjs/api/classes/variant.js +1154 -1154
  27. package/dist/lib-cjs/api/classes/variantInstance.d.ts +45 -45
  28. package/dist/lib-cjs/api/classes/variantInstance.js +108 -108
  29. package/dist/lib-cjs/api/classes/variantParameterizable.d.ts +17 -17
  30. package/dist/lib-cjs/api/classes/variantParameterizable.js +99 -99
  31. package/dist/lib-cjs/api/classes/viewer.d.ts +177 -175
  32. package/dist/lib-cjs/api/classes/viewer.js +717 -701
  33. package/dist/lib-cjs/api/classes/viewer.js.map +1 -1
  34. package/dist/lib-cjs/api/classes/viewerLight.d.ts +66 -66
  35. package/dist/lib-cjs/api/classes/viewerLight.js +392 -392
  36. package/dist/lib-cjs/api/internal/debugViewer.d.ts +13 -13
  37. package/dist/lib-cjs/api/internal/debugViewer.js +86 -86
  38. package/dist/lib-cjs/api/internal/lensRendering.d.ts +8 -8
  39. package/dist/lib-cjs/api/internal/lensRendering.js +11 -11
  40. package/dist/lib-cjs/api/internal/sceneSetup.d.ts +13 -10
  41. package/dist/lib-cjs/api/internal/sceneSetup.js +238 -234
  42. package/dist/lib-cjs/api/internal/sceneSetup.js.map +1 -1
  43. package/dist/lib-cjs/api/manager/animationManager.d.ts +29 -29
  44. package/dist/lib-cjs/api/manager/animationManager.js +130 -130
  45. package/dist/lib-cjs/api/manager/gltfExportManager.d.ts +65 -65
  46. package/dist/lib-cjs/api/manager/gltfExportManager.js +223 -222
  47. package/dist/lib-cjs/api/manager/gltfExportManager.js.map +1 -1
  48. package/dist/lib-cjs/api/manager/sceneManager.d.ts +31 -32
  49. package/dist/lib-cjs/api/manager/sceneManager.js +153 -132
  50. package/dist/lib-cjs/api/manager/sceneManager.js.map +1 -1
  51. package/dist/lib-cjs/api/manager/variantInstanceManager.d.ts +92 -92
  52. package/dist/lib-cjs/api/manager/variantInstanceManager.js +335 -335
  53. package/dist/lib-cjs/api/store/specStorage.d.ts +24 -24
  54. package/dist/lib-cjs/api/store/specStorage.js +51 -51
  55. package/dist/lib-cjs/api/util/babylonHelper.d.ts +174 -166
  56. package/dist/lib-cjs/api/util/babylonHelper.js +575 -497
  57. package/dist/lib-cjs/api/util/babylonHelper.js.map +1 -1
  58. package/dist/lib-cjs/api/util/globalTypes.d.ts +366 -356
  59. package/dist/lib-cjs/api/util/globalTypes.js +1 -1
  60. package/dist/lib-cjs/api/util/resourceHelper.d.ts +58 -53
  61. package/dist/lib-cjs/api/util/resourceHelper.js +257 -242
  62. package/dist/lib-cjs/api/util/resourceHelper.js.map +1 -1
  63. package/dist/lib-cjs/api/util/stringHelper.d.ts +9 -9
  64. package/dist/lib-cjs/api/util/stringHelper.js +25 -25
  65. package/dist/lib-cjs/api/util/structureHelper.d.ts +9 -9
  66. package/dist/lib-cjs/api/util/structureHelper.js +48 -44
  67. package/dist/lib-cjs/api/util/structureHelper.js.map +1 -1
  68. package/dist/lib-cjs/buildinfo.json +3 -3
  69. package/dist/lib-cjs/index.d.ts +49 -49
  70. package/dist/lib-cjs/index.js +89 -89
  71. package/dist/webpack-stats.json +0 -0
  72. package/package.json +87 -87
  73. package/src/api/classes/animationInterface.ts +10 -10
  74. package/src/api/classes/dottedPath.ts +181 -181
  75. package/src/api/classes/element.ts +690 -692
  76. package/src/api/classes/event.ts +367 -367
  77. package/src/api/classes/eventBroadcaster.ts +52 -52
  78. package/src/api/classes/parameter.ts +474 -405
  79. package/src/api/classes/parameterObservable.ts +100 -100
  80. package/src/api/classes/parameterizable.ts +87 -87
  81. package/src/api/classes/placementAnimation.ts +160 -160
  82. package/src/api/classes/variant.ts +845 -845
  83. package/src/api/classes/variantInstance.ts +97 -97
  84. package/src/api/classes/variantParameterizable.ts +85 -85
  85. package/src/api/classes/viewer.ts +650 -624
  86. package/src/api/classes/viewerLight.ts +334 -334
  87. package/src/api/internal/debugViewer.ts +90 -90
  88. package/src/api/internal/lensRendering.ts +10 -10
  89. package/src/api/internal/sceneSetup.ts +204 -201
  90. package/src/api/manager/animationManager.ts +142 -142
  91. package/src/api/manager/gltfExportManager.ts +191 -191
  92. package/src/api/manager/sceneManager.ts +128 -102
  93. package/src/api/manager/variantInstanceManager.ts +265 -265
  94. package/src/api/store/specStorage.ts +51 -51
  95. package/src/api/util/babylonHelper.ts +628 -538
  96. package/src/api/util/globalTypes.ts +413 -402
  97. package/src/api/util/resourceHelper.ts +189 -173
  98. package/src/api/util/stringHelper.ts +23 -23
  99. package/src/api/util/structureHelper.ts +49 -43
  100. package/src/buildinfo.json +3 -3
  101. package/src/commonjs.tsconfig.json +10 -10
  102. package/src/declaration.tsconfig.json +8 -8
  103. package/src/dev.ts +42 -42
  104. package/src/es6.tsconfig.json +10 -10
  105. package/src/index.ts +94 -94
  106. package/src/pagesconfig.json +77 -73
  107. package/src/tsconfig.json +32 -32
  108. package/src/tsconfig.types.json +9 -9
  109. package/src/types.d.ts +3 -3
package/README.md CHANGED
@@ -1,114 +1,111 @@
1
- # 3D viewer
2
-
3
- ## Usage
4
-
5
- - Create a label called `JS_3dViewerLbl` which we'll use to render the 3d viewer into:
6
-
7
- - Set its value to `<canvas></canvas>`
8
- - Add CSS class `ViewerLbl`
9
- - Add the following CSS styles to your configurator:
10
-
11
- ```css
12
- .ViewerLbl .cfgrctrl-innerlabel {
13
- height: 100%;
14
- }
15
-
16
- .ViewerLbl canvas {
17
- width: 100%;
18
- height: 100%;
19
- }
20
- ```
21
-
22
- - Install viewer dependencies: `npm i @combeenation/3d-viewer`
23
- - Create specification (example, bare minimum):
24
- ```js
25
- /**
26
- * @return {StructureJson}
27
- */
28
- export function createSpec() {
29
- return {
30
- scene: {
31
- engine: {
32
- antialiasing: true,
33
- options: {
34
- preserveDrawingBuffer: true,
35
- stencil: true,
36
- // `xrCompatible` is required to fix WebXR issue in Safari 15 as mentioned in the BabylonJS forum:
37
- // https://forum.babylonjs.com/t/safari-15-0-breaks-every-babylonjs-application/23973
38
- xrCompatible: false,
39
- },
40
- },
41
- scene: {
42
- globals: {},
43
- lights: {
44
- default: {
45
- type: 'hemispheric',
46
- },
47
- },
48
- cameras: {},
49
- },
50
- },
51
- setup: {
52
- instances: [
53
- {
54
- name: 'DirtBikeInstance',
55
- variant: 'DirtBike',
56
- lazy: false,
57
- parameters: {
58
- visible: true,
59
- scaling: '( 1, 1, 1 )',
60
- position: '( 0, 0, 0 )',
61
- rotation: '( 0, 0, 0 )',
62
- },
63
- },
64
- ],
65
- },
66
- variants: {
67
- DirtBike: {
68
- glTF: 'https://combeepublic.blob.core.windows.net/resources/the-3d-file.glb',
69
- elements: {
70
- Main: ['__root__'],
71
- },
72
- },
73
- },
74
- };
75
- }
76
- ```
77
- - Bootstrap viewer (example code):
78
-
79
- ```js
80
- import { Viewer } from '@combeenation/3d-viewer';
81
- import { CtrlUtils } from '@combeenation/custom-js-utils';
82
- import { createSpec } from 'path/to/spec-file';
83
-
84
- /**
85
- * Bootstraps the viewer using the JSON spec, registers all needed events etc.
86
- */
87
- export async function bootstrapViewer() {
88
- Cbn.utils.Log.add(`Bootstrapping viewer v${Viewer.version}`, Cbn.utils.Log.Type.Misc)();
89
-
90
- const $canvas = $(CtrlUtils.getLabel('JS_3dViewerLbl').el.dom).find('canvas');
91
- const canvas = /** @type {HTMLCanvasElement} */ ($canvas.get(0));
92
- const viewer = new Viewer(canvas, createSpec());
93
- await viewer.bootstrap();
94
-
95
- // The resize listener doesn't seem to work on the canvas itself, therefore we're installing it on its parent
96
- Cbn.utils.ResizeEvents.addResizeListener(canvas.parentElement, () => viewer.resize());
97
- }
98
- ```
99
-
100
- - Call `bootstrapViewer` e.g. somewhere in `onCfgrReady` in your main file:
101
-
102
- ```js
103
- CfgrUtils.onCfgrReady(async () => {
104
- // ...
105
-
106
- const viewer = await bootstrapViewer();
107
-
108
- // ...
109
-
110
- // Make some functions accessible in the global window object (e.g. for debugging in the console etc.)
111
- // Can be extended as needed.
112
- window.CfgrJS = { /* ... */ viewer /* ... */ };
113
- });
114
- ```
1
+ # 3D viewer
2
+
3
+ ## Usage
4
+
5
+ - Create a label called `JS_3dViewerLbl` which we'll use to render the 3d viewer into:
6
+
7
+ - Set its value to `<canvas></canvas>`
8
+ - Add CSS class `ViewerLbl`
9
+ - Add the following CSS styles to your configurator:
10
+
11
+ ```css
12
+ .ViewerLbl .cfgrctrl-innerlabel {
13
+ height: 100%;
14
+ }
15
+
16
+ .ViewerLbl canvas {
17
+ width: 100%;
18
+ height: 100%;
19
+ }
20
+ ```
21
+
22
+ - Install viewer dependencies: `npm i @combeenation/3d-viewer`
23
+ - Create specification (example, bare minimum):
24
+ ```js
25
+ /**
26
+ * @return {StructureJson}
27
+ */
28
+ export function createSpec() {
29
+ return {
30
+ scene: {
31
+ engine: {
32
+ antialiasing: true,
33
+ options: {
34
+ preserveDrawingBuffer: true,
35
+ stencil: true,
36
+ // `xrCompatible` is required to fix WebXR issue in Safari 15 as mentioned in the BabylonJS forum:
37
+ // https://forum.babylonjs.com/t/safari-15-0-breaks-every-babylonjs-application/23973
38
+ xrCompatible: false,
39
+ },
40
+ },
41
+ scene: {
42
+ globals: {},
43
+ cameras: {},
44
+ },
45
+ },
46
+ setup: {
47
+ instances: [
48
+ {
49
+ name: 'DirtBikeInstance',
50
+ variant: 'DirtBike',
51
+ lazy: false,
52
+ parameters: {
53
+ visible: true,
54
+ scaling: '( 1, 1, 1 )',
55
+ position: '( 0, 0, 0 )',
56
+ rotation: '( 0, 0, 0 )',
57
+ },
58
+ },
59
+ ],
60
+ },
61
+ variants: {
62
+ DirtBike: {
63
+ glTF: 'https://combeepublic.blob.core.windows.net/resources/the-3d-file.glb',
64
+ elements: {
65
+ Main: ['__root__'],
66
+ },
67
+ },
68
+ },
69
+ };
70
+ }
71
+ ```
72
+ - Bootstrap viewer (example code):
73
+
74
+ ```js
75
+ import { Viewer } from '@combeenation/3d-viewer';
76
+ import { CtrlUtils } from '@combeenation/custom-js-utils';
77
+ import { createSpec } from 'path/to/spec-file';
78
+
79
+ /**
80
+ * Bootstraps the viewer using the JSON spec, registers all needed events etc.
81
+ */
82
+ export async function bootstrapViewer() {
83
+ Cbn.utils.Log.add(`Bootstrapping viewer v${Viewer.version}`, Cbn.utils.Log.Type.Misc)();
84
+
85
+ const $canvas = $(CtrlUtils.getLabel('JS_3dViewerLbl').el.dom).find('canvas');
86
+ const canvas = /** @type {HTMLCanvasElement} */ ($canvas.get(0));
87
+ const viewer = new Viewer(canvas, createSpec());
88
+ await viewer.bootstrap();
89
+
90
+ // The resize listener doesn't seem to work on the canvas itself, therefore we're installing it on its parent
91
+ Cbn.utils.ResizeEvents.addResizeListener(canvas.parentElement, () => viewer.resize());
92
+
93
+ return viewer;
94
+ }
95
+ ```
96
+
97
+ - Call `bootstrapViewer` e.g. somewhere in `onCfgrReady` in your main file:
98
+
99
+ ```js
100
+ CfgrUtils.onCfgrReady(async () => {
101
+ // ...
102
+
103
+ const viewer = await bootstrapViewer();
104
+
105
+ // ...
106
+
107
+ // Make some functions accessible in the global window object (e.g. for debugging in the console etc.)
108
+ // Can be extended as needed.
109
+ window.CfgrJS = { /* ... */ viewer /* ... */ };
110
+ });
111
+ ```
@@ -1,8 +1,8 @@
1
- /**
2
- * An Interface defining the basic functionality of an animation.
3
- */
4
- interface AnimationInterface {
5
- play(): Promise<AnimationInterface>;
6
- pause(): AnimationInterface;
7
- kill(): AnimationInterface;
8
- }
1
+ /**
2
+ * An Interface defining the basic functionality of an animation.
3
+ */
4
+ interface AnimationInterface {
5
+ play(): Promise<AnimationInterface>;
6
+ pause(): AnimationInterface;
7
+ kill(): AnimationInterface;
8
+ }
@@ -1,2 +1,2 @@
1
- "use strict";
1
+ "use strict";
2
2
  //# sourceMappingURL=animationInterface.js.map
@@ -1,79 +1,79 @@
1
- export declare class DottedPath {
2
- static DELIMITER: string;
3
- static SAFE_CHAR: string;
4
- parts: string[];
5
- /**
6
- * Magic factory function that creates a DottedPath based on the argument type.
7
- */
8
- static create(dottedPath?: DottedPathArgument): DottedPath;
9
- /**
10
- * Creates a DottedPath from a string.
11
- * Allows patterns with unsafe characters wrapped in apostrophes or quotes.
12
- * E.g. "part1.part2.'part.3'.part_4"
13
- */
14
- static createFromPath(path: string): DottedPath;
15
- /**
16
- * Creates a DottedPath from a string list.
17
- */
18
- static createFromParts(parts: string[]): DottedPath;
19
- /**
20
- * Creates an empty DottedPath.
21
- */
22
- static createEmpty(): DottedPath;
23
- /**
24
- * Sanitizes given part: replaces all characters like {@link DottedPath.DELIMITER}
25
- * with a "safe" character like {@link DottedPath.SAFE_CHAR}.
26
- * (i) Does not trim whitespace.
27
- */
28
- static sanitizePart(part: string): string;
29
- /**
30
- * Constructor
31
- */
32
- private constructor();
33
- /**
34
- * The path.
35
- * (i) Does not return an empty dot for no path.
36
- */
37
- get path(): string;
38
- /**
39
- * The first part.
40
- */
41
- get firstPart(): string | null;
42
- /**
43
- * The last part.
44
- */
45
- get lastPart(): string | null;
46
- /**
47
- * Gets the tokens to each leaf of the DottedPath tree.
48
- * E.g. "part1.part2.part_3" will return an array like
49
- * ["part1", "part1.part2", "part1.part2.part_3"]
50
- */
51
- get leafTokens(): string[];
52
- /**
53
- * Removes the first part and returns it.
54
- */
55
- shiftPart(): string | undefined;
56
- /**
57
- * Adds part to the beginning of parts list.
58
- */
59
- unshiftPart(part: string, duplicateCheck?: boolean): DottedPath;
60
- /**
61
- * Adds part to the end of parts list.
62
- * (i) Does not add a part if the last char already is the delimiter or if an empty string was passed.
63
- */
64
- addPart(part: string, duplicateCheck?: boolean): DottedPath;
65
- /**
66
- * Adds multiple parts to the end of parts list.
67
- */
68
- addParts(parts: string[], duplicateCheck?: boolean): DottedPath;
69
- /**
70
- * Removes the last part and returns it.
71
- */
72
- popPart(): string | undefined;
73
- toString(): string;
74
- valueOf(): string;
75
- /**
76
- * Clones the DottedPath.
77
- */
78
- clone(): DottedPath;
79
- }
1
+ export declare class DottedPath {
2
+ static DELIMITER: string;
3
+ static SAFE_CHAR: string;
4
+ parts: string[];
5
+ /**
6
+ * Magic factory function that creates a DottedPath based on the argument type.
7
+ */
8
+ static create(dottedPath?: DottedPathArgument): DottedPath;
9
+ /**
10
+ * Creates a DottedPath from a string.
11
+ * Allows patterns with unsafe characters wrapped in apostrophes or quotes.
12
+ * E.g. "part1.part2.'part.3'.part_4"
13
+ */
14
+ static createFromPath(path: string): DottedPath;
15
+ /**
16
+ * Creates a DottedPath from a string list.
17
+ */
18
+ static createFromParts(parts: string[]): DottedPath;
19
+ /**
20
+ * Creates an empty DottedPath.
21
+ */
22
+ static createEmpty(): DottedPath;
23
+ /**
24
+ * Sanitizes given part: replaces all characters like {@link DottedPath.DELIMITER}
25
+ * with a "safe" character like {@link DottedPath.SAFE_CHAR}.
26
+ * (i) Does not trim whitespace.
27
+ */
28
+ static sanitizePart(part: string): string;
29
+ /**
30
+ * Constructor
31
+ */
32
+ private constructor();
33
+ /**
34
+ * The path.
35
+ * (i) Does not return an empty dot for no path.
36
+ */
37
+ get path(): string;
38
+ /**
39
+ * The first part.
40
+ */
41
+ get firstPart(): string | null;
42
+ /**
43
+ * The last part.
44
+ */
45
+ get lastPart(): string | null;
46
+ /**
47
+ * Gets the tokens to each leaf of the DottedPath tree.
48
+ * E.g. "part1.part2.part_3" will return an array like
49
+ * ["part1", "part1.part2", "part1.part2.part_3"]
50
+ */
51
+ get leafTokens(): string[];
52
+ /**
53
+ * Removes the first part and returns it.
54
+ */
55
+ shiftPart(): string | undefined;
56
+ /**
57
+ * Adds part to the beginning of parts list.
58
+ */
59
+ unshiftPart(part: string, duplicateCheck?: boolean): DottedPath;
60
+ /**
61
+ * Adds part to the end of parts list.
62
+ * (i) Does not add a part if the last char already is the delimiter or if an empty string was passed.
63
+ */
64
+ addPart(part: string, duplicateCheck?: boolean): DottedPath;
65
+ /**
66
+ * Adds multiple parts to the end of parts list.
67
+ */
68
+ addParts(parts: string[], duplicateCheck?: boolean): DottedPath;
69
+ /**
70
+ * Removes the last part and returns it.
71
+ */
72
+ popPart(): string | undefined;
73
+ toString(): string;
74
+ valueOf(): string;
75
+ /**
76
+ * Clones the DottedPath.
77
+ */
78
+ clone(): DottedPath;
79
+ }