@combeenation/3d-viewer 4.0.0-beta4 → 4.0.0-beta5

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 (106) hide show
  1. package/README.md +114 -112
  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 +190 -190
  6. package/dist/lib-cjs/api/classes/element.d.ts +130 -125
  7. package/dist/lib-cjs/api/classes/element.js +743 -682
  8. package/dist/lib-cjs/api/classes/element.js.map +1 -1
  9. package/dist/lib-cjs/api/classes/elementParameterizable.d.ts +14 -14
  10. package/dist/lib-cjs/api/classes/elementParameterizable.js +134 -134
  11. package/dist/lib-cjs/api/classes/event.d.ts +326 -312
  12. package/dist/lib-cjs/api/classes/event.js +371 -357
  13. package/dist/lib-cjs/api/classes/event.js.map +1 -1
  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 +259 -165
  17. package/dist/lib-cjs/api/classes/parameter.js +387 -267
  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 -126
  21. package/dist/lib-cjs/api/classes/parameterObservable.js.map +1 -1
  22. package/dist/lib-cjs/api/classes/parameterizable.d.ts +15 -15
  23. package/dist/lib-cjs/api/classes/parameterizable.js +149 -149
  24. package/dist/lib-cjs/api/classes/placementAnimation.d.ts +38 -38
  25. package/dist/lib-cjs/api/classes/placementAnimation.js +149 -138
  26. package/dist/lib-cjs/api/classes/placementAnimation.js.map +1 -1
  27. package/dist/lib-cjs/api/classes/variant.d.ts +234 -190
  28. package/dist/lib-cjs/api/classes/variant.js +1147 -873
  29. package/dist/lib-cjs/api/classes/variant.js.map +1 -1
  30. package/dist/lib-cjs/api/classes/variantInstance.d.ts +45 -41
  31. package/dist/lib-cjs/api/classes/variantInstance.js +108 -98
  32. package/dist/lib-cjs/api/classes/variantInstance.js.map +1 -1
  33. package/dist/lib-cjs/api/classes/variantParameterizable.d.ts +17 -17
  34. package/dist/lib-cjs/api/classes/variantParameterizable.js +92 -92
  35. package/dist/lib-cjs/api/classes/viewer.d.ts +131 -128
  36. package/dist/lib-cjs/api/classes/viewer.js +560 -486
  37. package/dist/lib-cjs/api/classes/viewer.js.map +1 -1
  38. package/dist/lib-cjs/api/classes/viewerLight.d.ts +66 -65
  39. package/dist/lib-cjs/api/classes/viewerLight.js +389 -322
  40. package/dist/lib-cjs/api/classes/viewerLight.js.map +1 -1
  41. package/dist/lib-cjs/api/internal/debugViewer.d.ts +13 -13
  42. package/dist/lib-cjs/api/internal/debugViewer.js +87 -87
  43. package/dist/lib-cjs/api/internal/lensRendering.d.ts +8 -8
  44. package/dist/lib-cjs/api/internal/lensRendering.js +11 -11
  45. package/dist/lib-cjs/api/internal/sceneSetup.d.ts +10 -6
  46. package/dist/lib-cjs/api/internal/sceneSetup.js +231 -227
  47. package/dist/lib-cjs/api/internal/sceneSetup.js.map +1 -1
  48. package/dist/lib-cjs/api/manager/animationManager.d.ts +29 -29
  49. package/dist/lib-cjs/api/manager/animationManager.js +121 -121
  50. package/dist/lib-cjs/api/manager/sceneManager.d.ts +32 -32
  51. package/dist/lib-cjs/api/manager/sceneManager.js +132 -132
  52. package/dist/lib-cjs/api/manager/variantInstanceManager.d.ts +90 -90
  53. package/dist/lib-cjs/api/manager/variantInstanceManager.js +321 -321
  54. package/dist/lib-cjs/api/store/specStorage.d.ts +24 -24
  55. package/dist/lib-cjs/api/store/specStorage.js +51 -51
  56. package/dist/lib-cjs/api/util/babylonHelper.d.ts +175 -125
  57. package/dist/lib-cjs/api/util/babylonHelper.js +520 -368
  58. package/dist/lib-cjs/api/util/babylonHelper.js.map +1 -1
  59. package/dist/lib-cjs/api/util/globalTypes.d.ts +333 -279
  60. package/dist/lib-cjs/api/util/globalTypes.js +1 -1
  61. package/dist/lib-cjs/api/util/resourceHelper.d.ts +53 -51
  62. package/dist/lib-cjs/api/util/resourceHelper.js +240 -243
  63. package/dist/lib-cjs/api/util/resourceHelper.js.map +1 -1
  64. package/dist/lib-cjs/api/util/stringHelper.d.ts +9 -9
  65. package/dist/lib-cjs/api/util/stringHelper.js +25 -25
  66. package/dist/lib-cjs/buildinfo.json +3 -3
  67. package/dist/lib-cjs/index.d.ts +48 -46
  68. package/dist/lib-cjs/index.js +86 -82
  69. package/dist/lib-cjs/index.js.map +1 -1
  70. package/package.json +83 -83
  71. package/src/api/classes/animationInterface.ts +11 -11
  72. package/src/api/classes/dottedPath.ts +189 -189
  73. package/src/api/classes/element.ts +644 -617
  74. package/src/api/classes/event.ts +370 -355
  75. package/src/api/classes/eventBroadcaster.ts +54 -54
  76. package/src/api/classes/parameter.ts +408 -277
  77. package/src/api/classes/parameterObservable.ts +99 -121
  78. package/src/api/classes/{elementParameterizable.ts → parameterizable.ts} +89 -78
  79. package/src/api/classes/placementAnimation.ts +143 -133
  80. package/src/api/classes/variant.ts +817 -670
  81. package/src/api/classes/variantInstance.ts +88 -81
  82. package/src/api/classes/variantParameterizable.ts +73 -0
  83. package/src/api/classes/viewer.ts +478 -421
  84. package/src/api/classes/viewerLight.ts +330 -0
  85. package/src/api/internal/debugViewer.ts +81 -81
  86. package/src/api/internal/lensRendering.ts +10 -10
  87. package/src/api/internal/sceneSetup.ts +194 -204
  88. package/src/api/manager/animationManager.ts +116 -116
  89. package/src/api/manager/sceneManager.ts +105 -105
  90. package/src/api/manager/variantInstanceManager.ts +236 -236
  91. package/src/api/store/specStorage.ts +53 -53
  92. package/src/api/util/babylonHelper.ts +553 -392
  93. package/src/api/util/globalTypes.ts +380 -319
  94. package/src/api/util/resourceHelper.ts +184 -187
  95. package/src/api/util/stringHelper.ts +26 -0
  96. package/src/buildinfo.json +2 -2
  97. package/src/commonjs.tsconfig.json +13 -13
  98. package/src/declaration.tsconfig.json +10 -10
  99. package/src/dev.ts +42 -46
  100. package/src/es6.tsconfig.json +13 -13
  101. package/src/index.ts +91 -87
  102. package/src/pagesconfig.json +61 -57
  103. package/src/tsconfig.json +43 -43
  104. package/src/tsconfig.types.json +9 -9
  105. package/src/types.d.ts +4 -4
  106. package/dist/webpack-stats.json +0 -0
package/README.md CHANGED
@@ -1,112 +1,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: false, // 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
37
- },
38
- },
39
- scene: {
40
- globals: {},
41
- lights: {
42
- default: {
43
- type: 'hemispheric',
44
- },
45
- },
46
- cameras: {},
47
- },
48
- },
49
- setup: {
50
- instances: [
51
- {
52
- name: 'DirtBikeInstance',
53
- variant: 'DirtBike',
54
- lazy: false,
55
- parameters: {
56
- visible: true,
57
- scaling: '( 1, 1, 1 )',
58
- position: '( 0, 0, 0 )',
59
- rotation: '( 0, 0, 0 )',
60
- },
61
- },
62
- ],
63
- },
64
- variants: {
65
- DirtBike: {
66
- glTF: 'https://combeepublic.blob.core.windows.net/resources/the-3d-file.glb',
67
- elements: {
68
- Main: ['__root__'],
69
- },
70
- },
71
- },
72
- };
73
- }
74
- ```
75
-
76
- - Bootstrap viewer (example code):
77
-
78
- ```js
79
- import { Viewer } from '@combeenation/3d-viewer';
80
- import { CtrlUtils } from '@combeenation/custom-js-utils';
81
- import { createSpec } from 'path/to/spec-file';
82
-
83
- /**
84
- * Bootstraps the viewer using the JSON spec, registers all needed events etc.
85
- */
86
- export async function bootstrapViewer() {
87
- Cbn.utils.Log.add(`Bootstrapping viewer v${Viewer.version}`, Cbn.utils.Log.Type.Misc)();
88
-
89
- const $canvas = $(CtrlUtils.getLabel('JS_3dViewerLbl').el.dom).find('canvas');
90
- const canvas = /** @type {HTMLCanvasElement} */ ($canvas.get(0));
91
- const viewer = new Viewer(canvas, createSpec());
92
- await viewer.bootstrap();
93
-
94
- // The resize listener doesn't seem to work on the canvas itself, therefore we're installing it on its parent
95
- Cbn.utils.ResizeEvents.addResizeListener(canvas.parentElement, () => viewer.resize());
96
- }
97
- ```
98
-
99
- - Call `bootstrapViewer` e.g. somewhere in `onCfgrReady` in your main file:
100
- ```js
101
- CfgrUtils.onCfgrReady(async () => {
102
- // ...
103
-
104
- const viewer = await bootstrapViewer();
105
-
106
- // ...
107
-
108
- // Make some functions accessible in the global window object (e.g. for debugging in the console etc.)
109
- // Can be extended as needed.
110
- window.CfgrJS = { /* ... */ viewer /* ... */ };
111
- });
112
- ```
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
+
78
+ - Bootstrap viewer (example code):
79
+
80
+ ```js
81
+ import { Viewer } from '@combeenation/3d-viewer';
82
+ import { CtrlUtils } from '@combeenation/custom-js-utils';
83
+ import { createSpec } from 'path/to/spec-file';
84
+
85
+ /**
86
+ * Bootstraps the viewer using the JSON spec, registers all needed events etc.
87
+ */
88
+ export async function bootstrapViewer() {
89
+ Cbn.utils.Log.add(`Bootstrapping viewer v${Viewer.version}`, Cbn.utils.Log.Type.Misc)();
90
+
91
+ const $canvas = $(CtrlUtils.getLabel('JS_3dViewerLbl').el.dom).find('canvas');
92
+ const canvas = /** @type {HTMLCanvasElement} */ ($canvas.get(0));
93
+ const viewer = new Viewer(canvas, createSpec());
94
+ await viewer.bootstrap();
95
+
96
+ // The resize listener doesn't seem to work on the canvas itself, therefore we're installing it on its parent
97
+ Cbn.utils.ResizeEvents.addResizeListener(canvas.parentElement, () => viewer.resize());
98
+ }
99
+ ```
100
+
101
+ - Call `bootstrapViewer` e.g. somewhere in `onCfgrReady` in your main file:
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,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
+ }