Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 8cb1e2a

Browse files
Chau TranChau Tran
Chau Tran
authored and
Chau Tran
committed
feat: add custom elements type
1 parent 3f77a7d commit 8cb1e2a

File tree

10 files changed

+792
-192
lines changed

10 files changed

+792
-192
lines changed

libs/angular-three/metadata.json

Lines changed: 1 addition & 0 deletions
Large diffs are not rendered by default.

libs/angular-three/ng-package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,5 +4,6 @@
44
"lib": {
55
"entryFile": "src/index.ts"
66
},
7-
"allowedNonPeerDependencies": ["ngx-resize", "@rx-angular/state", "@nx/devkit"]
7+
"allowedNonPeerDependencies": ["ngx-resize", "@rx-angular/state", "@nx/devkit"],
8+
"assets": ["metadata.json", "web-types.json"]
89
}

libs/angular-three/package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,5 +33,6 @@
3333
},
3434
"sideEffects": false,
3535
"generators": "./plugin/generators.json",
36-
"schematics": "./plugin/generators.json"
36+
"schematics": "./plugin/generators.json",
37+
"web-types": "./web-types.json"
3738
}

libs/angular-three/project.json

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,11 @@
2424
"package": {
2525
"executor": "nx:run-commands",
2626
"options": {
27-
"commands": ["npx nx build angular-three", "npx nx build angular-three-plugin"],
27+
"commands": [
28+
"node ./tools/scripts/generate-json.mjs",
29+
"npx nx build angular-three",
30+
"npx nx build angular-three-plugin"
31+
],
2832
"parallel": false
2933
}
3034
},

libs/angular-three/src/lib/loader.ts

Lines changed: 42 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,56 +1,46 @@
11
import { ChangeDetectorRef, inject } from '@angular/core';
22
import {
3+
ReplaySubject,
34
catchError,
45
forkJoin,
56
from,
67
isObservable,
78
map,
8-
Observable,
99
of,
10-
ReplaySubject,
1110
retry,
1211
share,
1312
switchMap,
1413
take,
1514
tap,
15+
type Observable,
1616
} from 'rxjs';
1717
import type { GLTF } from 'three/examples/jsm/loaders/GLTFLoader';
18-
import type { NgtBranchingReturn, NgtLoaderExtensions, NgtLoaderResult, NgtObjectMap } from './types';
18+
import type {
19+
NgtAnyRecord,
20+
NgtBranchingReturn,
21+
NgtLoaderExtensions,
22+
NgtLoaderProto,
23+
NgtLoaderReturnType,
24+
NgtObjectMap,
25+
} from './types';
1926
import { makeObjectGraph } from './utils/make';
2027
import { safeDetectChanges } from './utils/safe-detect-changes';
2128

22-
interface NgtLoader {
23-
<TReturnType, TUrl extends string | string[] | Record<string, string>>(
24-
loaderConstructorFactory: (inputs: TUrl) => new (...args: any[]) => NgtLoaderResult<TReturnType>,
25-
input: TUrl | Observable<TUrl>,
26-
extensions?: NgtLoaderExtensions<NgtLoaderResult<TReturnType>>,
27-
onProgress?: (event: ProgressEvent) => void
28-
): Observable<
29-
TUrl extends string[]
30-
? Array<NgtBranchingReturn<TReturnType, GLTF, GLTF & NgtObjectMap>>
31-
: TUrl extends object
32-
? { [key in keyof TUrl]: NgtBranchingReturn<TReturnType, GLTF, GLTF & NgtObjectMap> }
33-
: NgtBranchingReturn<TReturnType, GLTF, GLTF & NgtObjectMap>
34-
>;
35-
destroy: () => void;
36-
preLoad: <TReturnType, TUrl extends string | string[] | Record<string, string>>(
37-
loaderConstructorFactory: (inputs: TUrl) => new (...args: any[]) => NgtLoaderResult<TReturnType>,
38-
inputs: TUrl | Observable<TUrl>,
39-
extensions?: NgtLoaderExtensions
40-
) => void;
41-
}
42-
4329
export type NgtLoaderResults<
4430
TInput extends string | string[] | Record<string, string>,
4531
TReturn
4632
> = TInput extends string[] ? TReturn[] : TInput extends object ? { [key in keyof TInput]: TReturn } : TReturn;
4733

4834
const cached = new Map<string, Observable<any>>();
4935

50-
function load<TReturnType, TUrl extends string | string[] | Record<string, string>>(
51-
loaderConstructorFactory: (inputs: TUrl) => new (...args: any[]) => NgtLoaderResult<TReturnType>,
36+
function load<
37+
TData,
38+
TUrl extends string | string[] | Record<string, string>,
39+
TLoaderConstructor extends NgtLoaderProto<TData>
40+
>(
41+
loaderConstructorFactory: (inputs: TUrl) => TLoaderConstructor,
5242
input: TUrl | Observable<TUrl>,
53-
extensions?: NgtLoaderExtensions,
43+
extensions?: NgtLoaderExtensions<TLoaderConstructor>,
5444
onProgress?: (event: ProgressEvent) => void
5545
) {
5646
const urls$ = isObservable(input) ? input : of(input);
@@ -67,7 +57,11 @@ function load<TReturnType, TUrl extends string | string[] | Record<string, strin
6757
url,
6858
from(loader.loadAsync(url, onProgress)).pipe(
6959
tap((data) => {
70-
if (data.scene) Object.assign(data, makeObjectGraph(data.scene));
60+
if ((data as NgtAnyRecord)['scene'])
61+
Object.assign(
62+
data as NgtAnyRecord,
63+
makeObjectGraph((data as NgtAnyRecord)['scene'])
64+
);
7165
}),
7266
retry(2),
7367
catchError((err) => {
@@ -86,12 +80,17 @@ function load<TReturnType, TUrl extends string | string[] | Record<string, strin
8680
);
8781
}
8882

89-
function injectLoader<TReturnType, TUrl extends string | string[] | Record<string, string>>(
90-
loaderConstructorFactory: (inputs: TUrl) => new (...args: any[]) => NgtLoaderResult<TReturnType>,
83+
export function injectNgtLoader<
84+
TData,
85+
TUrl extends string | string[] | Record<string, string>,
86+
TLoaderConstructor extends NgtLoaderProto<TData>,
87+
TReturn = NgtLoaderReturnType<TData, TLoaderConstructor>
88+
>(
89+
loaderConstructorFactory: (inputs: TUrl) => TLoaderConstructor,
9190
input: TUrl | Observable<TUrl>,
92-
extensions?: NgtLoaderExtensions,
91+
extensions?: NgtLoaderExtensions<TLoaderConstructor>,
9392
onProgress?: (event: ProgressEvent) => void
94-
): Observable<NgtLoaderResults<TUrl, NgtBranchingReturn<TReturnType, GLTF, GLTF & NgtObjectMap>>> {
93+
): Observable<NgtLoaderResults<TUrl, NgtBranchingReturn<TReturn, GLTF, GLTF & NgtObjectMap>>> {
9594
const cdr = inject(ChangeDetectorRef);
9695

9796
return load(loaderConstructorFactory, input, extensions, onProgress).pipe(
@@ -104,7 +103,7 @@ function injectLoader<TReturnType, TUrl extends string | string[] | Record<strin
104103
return keys.reduce((result, key) => {
105104
result[key as keyof typeof result] = results[keys.indexOf(key)];
106105
return result;
107-
}, {} as { [key in keyof TUrl]: NgtBranchingReturn<TReturnType, GLTF, GLTF & NgtObjectMap> });
106+
}, {} as { [key in keyof TUrl]: NgtBranchingReturn<TReturn, GLTF, GLTF & NgtObjectMap> });
108107
}),
109108
tap(() => {
110109
requestAnimationFrame(() => void safeDetectChanges(cdr));
@@ -114,12 +113,18 @@ function injectLoader<TReturnType, TUrl extends string | string[] | Record<strin
114113
);
115114
}
116115

117-
(injectLoader as NgtLoader).destroy = () => {
116+
injectNgtLoader['destroy'] = () => {
118117
cached.clear();
119118
};
120119

121-
(injectLoader as NgtLoader).preLoad = (loaderConstructorFactory, inputs, extensions) => {
120+
injectNgtLoader['preLoad'] = <
121+
TData,
122+
TUrl extends string | string[] | Record<string, string>,
123+
TLoaderConstructor extends NgtLoaderProto<TData>
124+
>(
125+
loaderConstructorFactory: (inputs: TUrl) => TLoaderConstructor,
126+
inputs: TUrl | Observable<TUrl>,
127+
extensions?: NgtLoaderExtensions<TLoaderConstructor>
128+
) => {
122129
load(loaderConstructorFactory, inputs, extensions).pipe(take(1)).subscribe();
123130
};
124-
125-
export const injectNgtLoader = injectLoader as NgtLoader;

libs/angular-three/src/lib/stores/store.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -163,7 +163,7 @@ export class NgtStore extends NgtRxStore<NgtState> {
163163
};
164164
},
165165
},
166-
setEvents: (events: Partial<NgtEventManager>) => {
166+
setEvents: (events: Partial<NgtEventManager<any>>) => {
167167
this.set((state) => ({ events: { ...state.events, ...events } }));
168168
},
169169
setSize: (width: number, height: number, top?: number, left?: number) => {

0 commit comments

Comments
 (0)