@combeenation/3d-viewer 3.1.1-alpha7 → 3.1.2
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.
- package/README.md +111 -111
- package/dist/lib-cjs/api/classes/animationInterface.d.ts +8 -8
- package/dist/lib-cjs/api/classes/animationInterface.js +1 -1
- package/dist/lib-cjs/api/classes/dottedPath.d.ts +79 -79
- package/dist/lib-cjs/api/classes/dottedPath.js +190 -190
- package/dist/lib-cjs/api/classes/element.d.ts +125 -126
- package/dist/lib-cjs/api/classes/element.js +678 -674
- package/dist/lib-cjs/api/classes/element.js.map +1 -1
- package/dist/lib-cjs/api/classes/elementParameterizable.d.ts +14 -14
- package/dist/lib-cjs/api/classes/elementParameterizable.js +134 -134
- package/dist/lib-cjs/api/classes/event.d.ts +312 -312
- package/dist/lib-cjs/api/classes/event.js +357 -357
- package/dist/lib-cjs/api/classes/eventBroadcaster.d.ts +26 -26
- package/dist/lib-cjs/api/classes/eventBroadcaster.js +53 -53
- package/dist/lib-cjs/api/classes/parameter.d.ts +165 -165
- package/dist/lib-cjs/api/classes/parameter.js +267 -267
- package/dist/lib-cjs/api/classes/parameterObservable.d.ts +36 -36
- package/dist/lib-cjs/api/classes/parameterObservable.js +126 -126
- package/dist/lib-cjs/api/classes/parameterizable.d.ts +15 -15
- package/dist/lib-cjs/api/classes/parameterizable.js +149 -149
- package/dist/lib-cjs/api/classes/placementAnimation.d.ts +38 -38
- package/dist/lib-cjs/api/classes/placementAnimation.js +138 -138
- package/dist/lib-cjs/api/classes/variant.d.ts +180 -190
- package/dist/lib-cjs/api/classes/variant.js +863 -873
- package/dist/lib-cjs/api/classes/variant.js.map +1 -1
- package/dist/lib-cjs/api/classes/variantInstance.d.ts +41 -41
- package/dist/lib-cjs/api/classes/variantInstance.js +98 -98
- package/dist/lib-cjs/api/classes/variantParameterizable.d.ts +17 -17
- package/dist/lib-cjs/api/classes/variantParameterizable.js +92 -92
- package/dist/lib-cjs/api/classes/viewer.d.ts +128 -128
- package/dist/lib-cjs/api/classes/viewer.js +486 -486
- package/dist/lib-cjs/api/classes/viewerLight.d.ts +65 -66
- package/dist/lib-cjs/api/classes/viewerLight.js +322 -389
- package/dist/lib-cjs/api/classes/viewerLight.js.map +1 -1
- package/dist/lib-cjs/api/internal/debugViewer.d.ts +13 -13
- package/dist/lib-cjs/api/internal/debugViewer.js +87 -87
- package/dist/lib-cjs/api/internal/lensRendering.d.ts +8 -8
- package/dist/lib-cjs/api/internal/lensRendering.js +11 -11
- package/dist/lib-cjs/api/internal/sceneSetup.d.ts +6 -6
- package/dist/lib-cjs/api/internal/sceneSetup.js +227 -227
- package/dist/lib-cjs/api/manager/animationManager.d.ts +29 -29
- package/dist/lib-cjs/api/manager/animationManager.js +121 -121
- package/dist/lib-cjs/api/manager/sceneManager.d.ts +32 -32
- package/dist/lib-cjs/api/manager/sceneManager.js +132 -132
- package/dist/lib-cjs/api/manager/variantInstanceManager.d.ts +90 -90
- package/dist/lib-cjs/api/manager/variantInstanceManager.js +321 -321
- package/dist/lib-cjs/api/store/specStorage.d.ts +24 -24
- package/dist/lib-cjs/api/store/specStorage.js +51 -51
- package/dist/lib-cjs/api/util/babylonHelper.d.ts +125 -125
- package/dist/lib-cjs/api/util/babylonHelper.js +368 -368
- package/dist/lib-cjs/api/util/globalTypes.d.ts +275 -275
- package/dist/lib-cjs/api/util/globalTypes.js +1 -1
- package/dist/lib-cjs/api/util/resourceHelper.d.ts +30 -30
- package/dist/lib-cjs/api/util/resourceHelper.js +247 -203
- package/dist/lib-cjs/api/util/resourceHelper.js.map +1 -1
- package/dist/lib-cjs/api/util/stringHelper.d.ts +9 -9
- package/dist/lib-cjs/api/util/stringHelper.js +25 -25
- package/dist/lib-cjs/buildinfo.json +3 -3
- package/dist/lib-cjs/index.d.ts +46 -46
- package/dist/lib-cjs/index.js +82 -82
- package/dist/webpack-stats.json +0 -0
- package/package.json +83 -83
- package/src/api/classes/animationInterface.ts +11 -11
- package/src/api/classes/dottedPath.ts +189 -189
- package/src/api/classes/element.ts +608 -606
- package/src/api/classes/elementParameterizable.ts +78 -78
- package/src/api/classes/event.ts +355 -355
- package/src/api/classes/eventBroadcaster.ts +54 -54
- package/src/api/classes/parameter.ts +277 -277
- package/src/api/classes/parameterObservable.ts +121 -121
- package/src/api/classes/placementAnimation.ts +133 -133
- package/src/api/classes/variant.ts +659 -670
- package/src/api/classes/variantInstance.ts +81 -81
- package/src/api/classes/viewer.ts +421 -421
- package/src/api/internal/debugViewer.ts +81 -81
- package/src/api/internal/lensRendering.ts +10 -10
- package/src/api/internal/sceneSetup.ts +203 -203
- package/src/api/manager/animationManager.ts +116 -116
- package/src/api/manager/sceneManager.ts +105 -105
- package/src/api/manager/variantInstanceManager.ts +236 -236
- package/src/api/store/specStorage.ts +53 -53
- package/src/api/util/babylonHelper.ts +392 -392
- package/src/api/util/globalTypes.ts +314 -314
- package/src/api/util/resourceHelper.ts +168 -155
- package/src/buildinfo.json +2 -2
- package/src/commonjs.tsconfig.json +13 -13
- package/src/declaration.tsconfig.json +10 -10
- package/src/dev.ts +44 -46
- package/src/es6.tsconfig.json +13 -13
- package/src/index.ts +87 -87
- package/src/pagesconfig.json +47 -47
- package/src/tsconfig.json +43 -43
- package/src/tsconfig.types.json +9 -9
- package/src/types.d.ts +4 -4
|
@@ -1,121 +1,121 @@
|
|
|
1
|
-
import { merge } from 'lodash-es';
|
|
2
|
-
import { Parameter } from '../classes/parameter';
|
|
3
|
-
import { uuidv4 } from '../util/resourceHelper';
|
|
4
|
-
import { EventBroadcaster } from './eventBroadcaster';
|
|
5
|
-
|
|
6
|
-
export abstract class ParameterObservable extends EventBroadcaster {
|
|
7
|
-
|
|
8
|
-
public readonly uuid: string;
|
|
9
|
-
|
|
10
|
-
public readonly parameters: ParameterBag = {};
|
|
11
|
-
|
|
12
|
-
protected readonly parameterDeclaration: ParameterDeclarations = {};
|
|
13
|
-
|
|
14
|
-
protected parameterObservers: Map<string, ParameterObserver[]> = new Map();
|
|
15
|
-
|
|
16
|
-
protected constructor( parameterDeclaration: ParameterDeclarations = {}, parameters: ParameterBag = {} ) {
|
|
17
|
-
super();
|
|
18
|
-
this.uuid = uuidv4();
|
|
19
|
-
this.parameterDeclaration = merge(this.parameterDeclaration, parameterDeclaration);
|
|
20
|
-
this.parameters = merge(this.parameters, parameters);
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
/**
|
|
24
|
-
* The uuid (if not overloaded).
|
|
25
|
-
*/
|
|
26
|
-
get id(): string {
|
|
27
|
-
return this.uuid;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
/**
|
|
31
|
-
* Adds an observer function for parameter changes.
|
|
32
|
-
* The {@link ParameterObserver} gets 3 parameters: the {@link ParameterObservable}, the old {@link ParameterValue}
|
|
33
|
-
* and the new {@link ParameterValue}.
|
|
34
|
-
*
|
|
35
|
-
* See {@page Parameters} for an example.
|
|
36
|
-
*/
|
|
37
|
-
public addParameterObserver( parameter: string, observer: ParameterObserver ): ParameterObservable {
|
|
38
|
-
if( this.parameterObservers.has( parameter ) ) {
|
|
39
|
-
this.parameterObservers.get( parameter )!.push( observer );
|
|
40
|
-
return this;
|
|
41
|
-
}
|
|
42
|
-
this.parameterObservers.set( parameter, [observer] );
|
|
43
|
-
return this;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
/**
|
|
47
|
-
* Removes all {@link ParameterObserver}s for given parameter.
|
|
48
|
-
*/
|
|
49
|
-
public removeParameterObservers( parameter: string ): ParameterObservable {
|
|
50
|
-
this.parameterObservers.delete( parameter );
|
|
51
|
-
return this;
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
/**
|
|
55
|
-
* Invoke parameter observers for given parameter.
|
|
56
|
-
*/
|
|
57
|
-
public async commitParameter( parameter: string, value: ParameterValue ): Promise<ParameterObservable> {
|
|
58
|
-
const parameters: ParameterBag = {};
|
|
59
|
-
parameters[parameter] = value;
|
|
60
|
-
return this.commitParameters( parameters );
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
/**
|
|
64
|
-
* Invoke parameter observers for given parameters.
|
|
65
|
-
*/
|
|
66
|
-
public abstract commitParameters( parameters?: ParameterBag ): Promise<ParameterObservable>;
|
|
67
|
-
|
|
68
|
-
/**
|
|
69
|
-
* Asserts whether given parameter is declared and valid.
|
|
70
|
-
*/
|
|
71
|
-
public assertParameter( parameterDeclaration: ParameterDeclarations, parameter: string, value: ParameterValue ) {
|
|
72
|
-
if( !(parameter in parameterDeclaration) ) {
|
|
73
|
-
// This is a valid case since we are not able to check parameters that are not declared.
|
|
74
|
-
// We just ignore parameters that are not declared.
|
|
75
|
-
return;
|
|
76
|
-
}
|
|
77
|
-
const declaration = parameterDeclaration[parameter];
|
|
78
|
-
const genericError = `"${value}" is not a valid value for parameter "${parameter}" of type ` +
|
|
79
|
-
`"${declaration.type}" for ${this.constructor.name} "${this.id}".`;
|
|
80
|
-
switch( declaration.type ) {
|
|
81
|
-
case 'boolean':
|
|
82
|
-
try {
|
|
83
|
-
Parameter.parseBoolean( value );
|
|
84
|
-
} catch( e ) {
|
|
85
|
-
throw Error( genericError );
|
|
86
|
-
}
|
|
87
|
-
break;
|
|
88
|
-
case 'number':
|
|
89
|
-
try {
|
|
90
|
-
Parameter.parseNumber( value );
|
|
91
|
-
} catch( e ) {
|
|
92
|
-
throw Error( genericError );
|
|
93
|
-
}
|
|
94
|
-
break;
|
|
95
|
-
case 'color':
|
|
96
|
-
try {
|
|
97
|
-
Parameter.parseColor( value );
|
|
98
|
-
} catch( e ) {
|
|
99
|
-
throw Error( genericError + ` It must be hex with leading "#" or of format "(r,g,b)".` );
|
|
100
|
-
}
|
|
101
|
-
break;
|
|
102
|
-
case 'vector':
|
|
103
|
-
try {
|
|
104
|
-
Parameter.parseVector( value );
|
|
105
|
-
} catch( e ) {
|
|
106
|
-
throw Error( genericError + ` It must be of format "(x,y,z)".` );
|
|
107
|
-
}
|
|
108
|
-
break;
|
|
109
|
-
case 'select':
|
|
110
|
-
if( !declaration.options ) {
|
|
111
|
-
throw Error( `No options defined for parameter declaration "${parameter}"` +
|
|
112
|
-
`of type "${declaration.type}" for ${this.constructor.name} "${this.id}".` );
|
|
113
|
-
}
|
|
114
|
-
if( declaration.options.indexOf( value ) === -1 ) {
|
|
115
|
-
throw Error( genericError + ` Valid values are: "${declaration.options.join( '", "' )}".` );
|
|
116
|
-
}
|
|
117
|
-
break;
|
|
118
|
-
}
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
}
|
|
1
|
+
import { merge } from 'lodash-es';
|
|
2
|
+
import { Parameter } from '../classes/parameter';
|
|
3
|
+
import { uuidv4 } from '../util/resourceHelper';
|
|
4
|
+
import { EventBroadcaster } from './eventBroadcaster';
|
|
5
|
+
|
|
6
|
+
export abstract class ParameterObservable extends EventBroadcaster {
|
|
7
|
+
|
|
8
|
+
public readonly uuid: string;
|
|
9
|
+
|
|
10
|
+
public readonly parameters: ParameterBag = {};
|
|
11
|
+
|
|
12
|
+
protected readonly parameterDeclaration: ParameterDeclarations = {};
|
|
13
|
+
|
|
14
|
+
protected parameterObservers: Map<string, ParameterObserver[]> = new Map();
|
|
15
|
+
|
|
16
|
+
protected constructor( parameterDeclaration: ParameterDeclarations = {}, parameters: ParameterBag = {} ) {
|
|
17
|
+
super();
|
|
18
|
+
this.uuid = uuidv4();
|
|
19
|
+
this.parameterDeclaration = merge(this.parameterDeclaration, parameterDeclaration);
|
|
20
|
+
this.parameters = merge(this.parameters, parameters);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
/**
|
|
24
|
+
* The uuid (if not overloaded).
|
|
25
|
+
*/
|
|
26
|
+
get id(): string {
|
|
27
|
+
return this.uuid;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
/**
|
|
31
|
+
* Adds an observer function for parameter changes.
|
|
32
|
+
* The {@link ParameterObserver} gets 3 parameters: the {@link ParameterObservable}, the old {@link ParameterValue}
|
|
33
|
+
* and the new {@link ParameterValue}.
|
|
34
|
+
*
|
|
35
|
+
* See {@page Parameters} for an example.
|
|
36
|
+
*/
|
|
37
|
+
public addParameterObserver( parameter: string, observer: ParameterObserver ): ParameterObservable {
|
|
38
|
+
if( this.parameterObservers.has( parameter ) ) {
|
|
39
|
+
this.parameterObservers.get( parameter )!.push( observer );
|
|
40
|
+
return this;
|
|
41
|
+
}
|
|
42
|
+
this.parameterObservers.set( parameter, [observer] );
|
|
43
|
+
return this;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
/**
|
|
47
|
+
* Removes all {@link ParameterObserver}s for given parameter.
|
|
48
|
+
*/
|
|
49
|
+
public removeParameterObservers( parameter: string ): ParameterObservable {
|
|
50
|
+
this.parameterObservers.delete( parameter );
|
|
51
|
+
return this;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
/**
|
|
55
|
+
* Invoke parameter observers for given parameter.
|
|
56
|
+
*/
|
|
57
|
+
public async commitParameter( parameter: string, value: ParameterValue ): Promise<ParameterObservable> {
|
|
58
|
+
const parameters: ParameterBag = {};
|
|
59
|
+
parameters[parameter] = value;
|
|
60
|
+
return this.commitParameters( parameters );
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
/**
|
|
64
|
+
* Invoke parameter observers for given parameters.
|
|
65
|
+
*/
|
|
66
|
+
public abstract commitParameters( parameters?: ParameterBag ): Promise<ParameterObservable>;
|
|
67
|
+
|
|
68
|
+
/**
|
|
69
|
+
* Asserts whether given parameter is declared and valid.
|
|
70
|
+
*/
|
|
71
|
+
public assertParameter( parameterDeclaration: ParameterDeclarations, parameter: string, value: ParameterValue ) {
|
|
72
|
+
if( !(parameter in parameterDeclaration) ) {
|
|
73
|
+
// This is a valid case since we are not able to check parameters that are not declared.
|
|
74
|
+
// We just ignore parameters that are not declared.
|
|
75
|
+
return;
|
|
76
|
+
}
|
|
77
|
+
const declaration = parameterDeclaration[parameter];
|
|
78
|
+
const genericError = `"${value}" is not a valid value for parameter "${parameter}" of type ` +
|
|
79
|
+
`"${declaration.type}" for ${this.constructor.name} "${this.id}".`;
|
|
80
|
+
switch( declaration.type ) {
|
|
81
|
+
case 'boolean':
|
|
82
|
+
try {
|
|
83
|
+
Parameter.parseBoolean( value );
|
|
84
|
+
} catch( e ) {
|
|
85
|
+
throw Error( genericError );
|
|
86
|
+
}
|
|
87
|
+
break;
|
|
88
|
+
case 'number':
|
|
89
|
+
try {
|
|
90
|
+
Parameter.parseNumber( value );
|
|
91
|
+
} catch( e ) {
|
|
92
|
+
throw Error( genericError );
|
|
93
|
+
}
|
|
94
|
+
break;
|
|
95
|
+
case 'color':
|
|
96
|
+
try {
|
|
97
|
+
Parameter.parseColor( value );
|
|
98
|
+
} catch( e ) {
|
|
99
|
+
throw Error( genericError + ` It must be hex with leading "#" or of format "(r,g,b)".` );
|
|
100
|
+
}
|
|
101
|
+
break;
|
|
102
|
+
case 'vector':
|
|
103
|
+
try {
|
|
104
|
+
Parameter.parseVector( value );
|
|
105
|
+
} catch( e ) {
|
|
106
|
+
throw Error( genericError + ` It must be of format "(x,y,z)".` );
|
|
107
|
+
}
|
|
108
|
+
break;
|
|
109
|
+
case 'select':
|
|
110
|
+
if( !declaration.options ) {
|
|
111
|
+
throw Error( `No options defined for parameter declaration "${parameter}"` +
|
|
112
|
+
`of type "${declaration.type}" for ${this.constructor.name} "${this.id}".` );
|
|
113
|
+
}
|
|
114
|
+
if( declaration.options.indexOf( value ) === -1 ) {
|
|
115
|
+
throw Error( genericError + ` Valid values are: "${declaration.options.join( '", "' )}".` );
|
|
116
|
+
}
|
|
117
|
+
break;
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
}
|
|
@@ -1,133 +1,133 @@
|
|
|
1
|
-
import { ArcRotateCamera } from '@babylonjs/core/Cameras/arcRotateCamera';
|
|
2
|
-
import { Vector3 } from '@babylonjs/core/Maths/math.vector';
|
|
3
|
-
import { gsap } from 'gsap';
|
|
4
|
-
import { cloneDeep, get, isString, merge, set } from 'lodash-es';
|
|
5
|
-
import { Parameter } from '../classes/parameter';
|
|
6
|
-
import { SpecStorage } from '../store/specStorage';
|
|
7
|
-
|
|
8
|
-
/**
|
|
9
|
-
* An {@link PlacementAnimation} handling `Tweens` of the `GSAP` API using configured {@link PlacementDefinition}s
|
|
10
|
-
* and {@link AnimationDefinition}s. It mutates the attributes in the given {@link PlacementDefinition} with the given
|
|
11
|
-
* {@link AnimationDefinition}. The latter can be anything the `GSAP` allows in its API. Please consider using the
|
|
12
|
-
* API of the {@link AnimationManager} to handle instances of this class in your consuming project.
|
|
13
|
-
*/
|
|
14
|
-
export class PlacementAnimation implements AnimationInterface {
|
|
15
|
-
|
|
16
|
-
protected _placementDefinition: PlacementDefinition;
|
|
17
|
-
|
|
18
|
-
protected _animationDefinition: AnimationDefinition;
|
|
19
|
-
|
|
20
|
-
protected _timeline: GSAPTimeline;
|
|
21
|
-
|
|
22
|
-
/**
|
|
23
|
-
* Constructor.
|
|
24
|
-
*/
|
|
25
|
-
public constructor( public readonly mutable: object,
|
|
26
|
-
protected _placement: PlacementDefinition | string,
|
|
27
|
-
protected _animation?: AnimationDefinition | string ) {
|
|
28
|
-
if( isString( _placement ) ) {
|
|
29
|
-
const placementDefinitions = SpecStorage.get<PlacementDefinitions>( 'scene.placements' );
|
|
30
|
-
if( !placementDefinitions ) {
|
|
31
|
-
throw new Error( `No PlacementDefinitions defined in JSON structure.` );
|
|
32
|
-
}
|
|
33
|
-
const placementDefinition = placementDefinitions[_placement];
|
|
34
|
-
if( !placementDefinition ) {
|
|
35
|
-
throw new Error( `PlacementDefinition "${_placement}" not defined in JSON structure.` );
|
|
36
|
-
}
|
|
37
|
-
this._placementDefinition = cloneDeep( placementDefinition );
|
|
38
|
-
} else {
|
|
39
|
-
this._placementDefinition = cloneDeep( _placement ) as PlacementDefinition;
|
|
40
|
-
}
|
|
41
|
-
if( isString( _animation ) ) {
|
|
42
|
-
const animationDefinition = SpecStorage.get<AnimationDefinitions>( 'scene.animations' )?.[_animation];
|
|
43
|
-
if( !animationDefinition ) {
|
|
44
|
-
throw new Error( `AnimationDefinition "${_animation}" not defined in JSON structure.` );
|
|
45
|
-
}
|
|
46
|
-
this._animationDefinition = cloneDeep( animationDefinition );
|
|
47
|
-
} else {
|
|
48
|
-
this._animationDefinition = cloneDeep( _animation ) as AnimationDefinition;
|
|
49
|
-
}
|
|
50
|
-
this._timeline = gsap.timeline( {
|
|
51
|
-
defaults: merge( { duration: 0, ease: 'none' }, this._animationDefinition ),
|
|
52
|
-
paused: true
|
|
53
|
-
} );
|
|
54
|
-
this.preparePlacementDefinition();
|
|
55
|
-
this.createTweens();
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
/**
|
|
59
|
-
* Plays all `Tweens` of this {@link PlacementAnimation}.
|
|
60
|
-
*/
|
|
61
|
-
public async play(): Promise<AnimationInterface> {
|
|
62
|
-
await this._timeline.play().then();
|
|
63
|
-
return this;
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
/**
|
|
67
|
-
* Pause all `Tweens` of this {@link PlacementAnimation}.
|
|
68
|
-
*/
|
|
69
|
-
public pause(): AnimationInterface {
|
|
70
|
-
this._timeline.pause();
|
|
71
|
-
return this;
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
/**
|
|
75
|
-
* Kills all `Tweens` of this {@link PlacementAnimation}.
|
|
76
|
-
*/
|
|
77
|
-
public kill(): AnimationInterface {
|
|
78
|
-
this._timeline.kill();
|
|
79
|
-
return this;
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
/**
|
|
83
|
-
* Prepares different types of {@link PlacementDefinition} and sets some defaults.
|
|
84
|
-
*/
|
|
85
|
-
protected preparePlacementDefinition() {
|
|
86
|
-
let position = this._placementDefinition.position;
|
|
87
|
-
if( isString( position ) ) {
|
|
88
|
-
position = Parameter.parseVector( position );
|
|
89
|
-
this._placementDefinition.position = position;
|
|
90
|
-
}
|
|
91
|
-
if( this.mutable instanceof ArcRotateCamera ) {
|
|
92
|
-
// parse the target
|
|
93
|
-
if( isString( this._placementDefinition.target ) ) {
|
|
94
|
-
this._placementDefinition.target = Parameter.parseVector( this._placementDefinition.target );
|
|
95
|
-
}
|
|
96
|
-
if( position ) {
|
|
97
|
-
// parse the position and calculate alpha, beta and radius with a "ghost camera"
|
|
98
|
-
// @see https://www.babylonjs-playground.com/#4IVMG#0
|
|
99
|
-
const ghostCam = (this.mutable as ArcRotateCamera).clone( 'ghost' ) as ArcRotateCamera;
|
|
100
|
-
ghostCam.setPosition( position );
|
|
101
|
-
merge( this._placementDefinition, {
|
|
102
|
-
alpha: ghostCam.alpha,
|
|
103
|
-
beta: ghostCam.beta,
|
|
104
|
-
radius: ghostCam.radius,
|
|
105
|
-
} );
|
|
106
|
-
delete this._placementDefinition.position;
|
|
107
|
-
ghostCam.dispose();
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
/**
|
|
113
|
-
* Creates `Tweens` for the {@link PlacementDefinition} configured for this {@link PlacementAnimation}.
|
|
114
|
-
*/
|
|
115
|
-
protected createTweens() {
|
|
116
|
-
for( const property in this._placementDefinition ) {
|
|
117
|
-
const propertyValue = get( this._placementDefinition, property );
|
|
118
|
-
const tweenVars: object = {};
|
|
119
|
-
let _mutable = this.mutable;
|
|
120
|
-
if( propertyValue instanceof Vector3 ) {
|
|
121
|
-
// GSAP does not support mutation of complex objects, so we are forced
|
|
122
|
-
// to use the properties on the object as mutable directly and mutate
|
|
123
|
-
// the coordinates separately.
|
|
124
|
-
_mutable = get( this.mutable, property );
|
|
125
|
-
merge( tweenVars, { x: propertyValue.x, y: propertyValue.y, z: propertyValue.z } );
|
|
126
|
-
} else {
|
|
127
|
-
set( tweenVars, property, propertyValue );
|
|
128
|
-
}
|
|
129
|
-
this._timeline.to( _mutable, tweenVars, 0 ); // Note: position 0 does the "parallel" stuff here
|
|
130
|
-
}
|
|
131
|
-
}
|
|
132
|
-
|
|
133
|
-
}
|
|
1
|
+
import { ArcRotateCamera } from '@babylonjs/core/Cameras/arcRotateCamera';
|
|
2
|
+
import { Vector3 } from '@babylonjs/core/Maths/math.vector';
|
|
3
|
+
import { gsap } from 'gsap';
|
|
4
|
+
import { cloneDeep, get, isString, merge, set } from 'lodash-es';
|
|
5
|
+
import { Parameter } from '../classes/parameter';
|
|
6
|
+
import { SpecStorage } from '../store/specStorage';
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* An {@link PlacementAnimation} handling `Tweens` of the `GSAP` API using configured {@link PlacementDefinition}s
|
|
10
|
+
* and {@link AnimationDefinition}s. It mutates the attributes in the given {@link PlacementDefinition} with the given
|
|
11
|
+
* {@link AnimationDefinition}. The latter can be anything the `GSAP` allows in its API. Please consider using the
|
|
12
|
+
* API of the {@link AnimationManager} to handle instances of this class in your consuming project.
|
|
13
|
+
*/
|
|
14
|
+
export class PlacementAnimation implements AnimationInterface {
|
|
15
|
+
|
|
16
|
+
protected _placementDefinition: PlacementDefinition;
|
|
17
|
+
|
|
18
|
+
protected _animationDefinition: AnimationDefinition;
|
|
19
|
+
|
|
20
|
+
protected _timeline: GSAPTimeline;
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* Constructor.
|
|
24
|
+
*/
|
|
25
|
+
public constructor( public readonly mutable: object,
|
|
26
|
+
protected _placement: PlacementDefinition | string,
|
|
27
|
+
protected _animation?: AnimationDefinition | string ) {
|
|
28
|
+
if( isString( _placement ) ) {
|
|
29
|
+
const placementDefinitions = SpecStorage.get<PlacementDefinitions>( 'scene.placements' );
|
|
30
|
+
if( !placementDefinitions ) {
|
|
31
|
+
throw new Error( `No PlacementDefinitions defined in JSON structure.` );
|
|
32
|
+
}
|
|
33
|
+
const placementDefinition = placementDefinitions[_placement];
|
|
34
|
+
if( !placementDefinition ) {
|
|
35
|
+
throw new Error( `PlacementDefinition "${_placement}" not defined in JSON structure.` );
|
|
36
|
+
}
|
|
37
|
+
this._placementDefinition = cloneDeep( placementDefinition );
|
|
38
|
+
} else {
|
|
39
|
+
this._placementDefinition = cloneDeep( _placement ) as PlacementDefinition;
|
|
40
|
+
}
|
|
41
|
+
if( isString( _animation ) ) {
|
|
42
|
+
const animationDefinition = SpecStorage.get<AnimationDefinitions>( 'scene.animations' )?.[_animation];
|
|
43
|
+
if( !animationDefinition ) {
|
|
44
|
+
throw new Error( `AnimationDefinition "${_animation}" not defined in JSON structure.` );
|
|
45
|
+
}
|
|
46
|
+
this._animationDefinition = cloneDeep( animationDefinition );
|
|
47
|
+
} else {
|
|
48
|
+
this._animationDefinition = cloneDeep( _animation ) as AnimationDefinition;
|
|
49
|
+
}
|
|
50
|
+
this._timeline = gsap.timeline( {
|
|
51
|
+
defaults: merge( { duration: 0, ease: 'none' }, this._animationDefinition ),
|
|
52
|
+
paused: true
|
|
53
|
+
} );
|
|
54
|
+
this.preparePlacementDefinition();
|
|
55
|
+
this.createTweens();
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* Plays all `Tweens` of this {@link PlacementAnimation}.
|
|
60
|
+
*/
|
|
61
|
+
public async play(): Promise<AnimationInterface> {
|
|
62
|
+
await this._timeline.play().then();
|
|
63
|
+
return this;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
/**
|
|
67
|
+
* Pause all `Tweens` of this {@link PlacementAnimation}.
|
|
68
|
+
*/
|
|
69
|
+
public pause(): AnimationInterface {
|
|
70
|
+
this._timeline.pause();
|
|
71
|
+
return this;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
/**
|
|
75
|
+
* Kills all `Tweens` of this {@link PlacementAnimation}.
|
|
76
|
+
*/
|
|
77
|
+
public kill(): AnimationInterface {
|
|
78
|
+
this._timeline.kill();
|
|
79
|
+
return this;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
/**
|
|
83
|
+
* Prepares different types of {@link PlacementDefinition} and sets some defaults.
|
|
84
|
+
*/
|
|
85
|
+
protected preparePlacementDefinition() {
|
|
86
|
+
let position = this._placementDefinition.position;
|
|
87
|
+
if( isString( position ) ) {
|
|
88
|
+
position = Parameter.parseVector( position );
|
|
89
|
+
this._placementDefinition.position = position;
|
|
90
|
+
}
|
|
91
|
+
if( this.mutable instanceof ArcRotateCamera ) {
|
|
92
|
+
// parse the target
|
|
93
|
+
if( isString( this._placementDefinition.target ) ) {
|
|
94
|
+
this._placementDefinition.target = Parameter.parseVector( this._placementDefinition.target );
|
|
95
|
+
}
|
|
96
|
+
if( position ) {
|
|
97
|
+
// parse the position and calculate alpha, beta and radius with a "ghost camera"
|
|
98
|
+
// @see https://www.babylonjs-playground.com/#4IVMG#0
|
|
99
|
+
const ghostCam = (this.mutable as ArcRotateCamera).clone( 'ghost' ) as ArcRotateCamera;
|
|
100
|
+
ghostCam.setPosition( position );
|
|
101
|
+
merge( this._placementDefinition, {
|
|
102
|
+
alpha: ghostCam.alpha,
|
|
103
|
+
beta: ghostCam.beta,
|
|
104
|
+
radius: ghostCam.radius,
|
|
105
|
+
} );
|
|
106
|
+
delete this._placementDefinition.position;
|
|
107
|
+
ghostCam.dispose();
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
/**
|
|
113
|
+
* Creates `Tweens` for the {@link PlacementDefinition} configured for this {@link PlacementAnimation}.
|
|
114
|
+
*/
|
|
115
|
+
protected createTweens() {
|
|
116
|
+
for( const property in this._placementDefinition ) {
|
|
117
|
+
const propertyValue = get( this._placementDefinition, property );
|
|
118
|
+
const tweenVars: object = {};
|
|
119
|
+
let _mutable = this.mutable;
|
|
120
|
+
if( propertyValue instanceof Vector3 ) {
|
|
121
|
+
// GSAP does not support mutation of complex objects, so we are forced
|
|
122
|
+
// to use the properties on the object as mutable directly and mutate
|
|
123
|
+
// the coordinates separately.
|
|
124
|
+
_mutable = get( this.mutable, property );
|
|
125
|
+
merge( tweenVars, { x: propertyValue.x, y: propertyValue.y, z: propertyValue.z } );
|
|
126
|
+
} else {
|
|
127
|
+
set( tweenVars, property, propertyValue );
|
|
128
|
+
}
|
|
129
|
+
this._timeline.to( _mutable, tweenVars, 0 ); // Note: position 0 does the "parallel" stuff here
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
}
|