@3dsource/angular-unreal-module 0.0.164 → 0.0.166

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/LICENSE CHANGED
@@ -1,14 +1,14 @@
1
- Copyright (c) 2025 3dsource
2
- All Rights Reserved.
3
-
4
- This software and associated documentation files (the “Software”) are proprietary
5
- and confidential. Unauthorized copying, modification, distribution, or any other
6
- use of the Software, in whole or in part, without the prior written consent of
7
- the copyright holder is strictly prohibited.
8
-
9
- THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
10
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
11
- FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
12
- COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
13
- IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
14
- CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
1
+ Copyright (c) 2025 3dsource
2
+ All Rights Reserved.
3
+
4
+ This software and associated documentation files (the “Software”) are proprietary
5
+ and confidential. Unauthorized copying, modification, distribution, or any other
6
+ use of the Software, in whole or in part, without the prior written consent of
7
+ the copyright holder is strictly prohibited.
8
+
9
+ THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
10
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
11
+ FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
12
+ COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
13
+ IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
14
+ CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
package/README.md CHANGED
@@ -1,224 +1,222 @@
1
- # @3dsource/angular-unreal-module
2
-
3
- Standalone Angular integration for Unreal Engine Pixel Streaming. The package
4
- provides the scene component, WebRTC and signalling lifecycle, NgRx state,
5
- command/callback APIs, reconnection, file transfer and telemetry.
6
-
7
- ## Requirements
8
-
9
- - Angular, Angular CDK and Angular Forms `>=19.0.0 <23.0.0`
10
- - NgRx Store and Effects `>=19.0.0 <23.0.0`
11
- - RxJS `>=7.8.0 <8.0.0`
12
- - `@3dsource/source-ui-native >=1.0.9`
13
- - `@3dsource/types-unreal >=0.0.7`
14
- - `@3dsource/utils >=1.0.21`
15
- - `provideHttpClient()` in the host application
16
-
17
- ## Installation
18
-
19
- ```shell
20
- pnpm add @3dsource/angular-unreal-module @3dsource/source-ui-native @3dsource/types-unreal @3dsource/utils
21
- ```
22
-
23
- The package is standalone and does not expose an NgModule.
24
-
25
- ## Setup
26
-
27
- ### 1. Register state and configuration once
28
-
29
- Add the Unreal feature state, HTTP client and configuration at the application
30
- root. `UNREAL_CONFIG` is required, although all its fields are optional.
31
-
32
- <!-- prettier-ignore -->
33
- ```typescript
34
- import { provideHttpClient } from '@angular/common/http';
35
- import type { ApplicationConfig } from '@angular/core';
36
- import { provideStore } from '@ngrx/store';
37
- import {
38
- provideUnrealState,
39
- UNREAL_CONFIG,
40
- type UnrealInitialConfig,
41
- } from '@3dsource/angular-unreal-module';
42
-
43
- const unrealConfig = {
44
- regionsPingUrl: 'https://datacenter.3dsource.com/regions/',
45
- dataChannelConnectionTimeout: 8000,
46
- fpsMonitor: false,
47
- autoHighResolution: false,
48
- } satisfies UnrealInitialConfig;
49
-
50
- export const appConfig: ApplicationConfig = {
51
- providers: [
52
- provideHttpClient(),
53
- provideStore(),
54
- provideUnrealState(),
55
- { provide: UNREAL_CONFIG, useValue: unrealConfig },
56
- ],
57
- };
58
- ```
59
-
60
- Omit `provideStore()` when the root NgRx store is already configured.
61
-
62
- Available configuration fields:
63
-
64
- | Field | Purpose |
65
- | ------------------------------ | ---------------------------------------------- |
66
- | `regionsPingUrl` | Region latency endpoint |
67
- | `dataChannelConnectionTimeout` | DataChannel connection timeout in ms |
68
- | `customErrorsEndpoint` | Custom error reporting endpoint |
69
- | `commandTelemetryReceiver` | Command telemetry endpoint |
70
- | `streamTelemetryV2Url` | Stream lifecycle telemetry endpoint |
71
- | `screenLockerContainerId` | Container used by the screen-locker overlay |
72
- | `fpsMonitor` | Enables FPS monitoring |
73
- | `autoHighResolution` | Raises resolution after the scene becomes idle |
74
- | `playwright` | Enables the test-specific service behaviour |
75
-
76
- Use `{ provide: UNREAL_CONFIG, useValue: {} }` for the minimal configuration.
77
-
78
- ### 2. Boot the engine on a lazy route
79
-
80
- Lazy-load the route file from the application router:
81
-
82
- <!-- prettier-ignore -->
83
- ```typescript
84
- import type { Routes } from '@angular/router';
85
-
86
- export const APP_ROUTES: Routes = [
87
- {
88
- path: 'stream',
89
- loadChildren: () =>
90
- import('./stream/stream.routes').then((module) => module.STREAM_ROUTES),
91
- },
92
- ];
93
- ```
94
-
95
- Register `provideUnrealModule()` inside that lazy route file:
96
-
97
- <!-- prettier-ignore -->
98
- ```typescript
99
- import type { Routes } from '@angular/router';
100
- import { provideUnrealModule } from '@3dsource/angular-unreal-module';
101
- import { StreamComponent } from './stream.component';
102
-
103
- export const STREAM_ROUTES: Routes = [
104
- {
105
- path: '',
106
- component: StreamComponent,
107
- providers: [provideUnrealModule()],
108
- },
109
- ];
110
- ```
111
-
112
- Keep `provideUnrealState()` and `UNREAL_CONFIG` at the application root.
113
- The `loadChildren()` boundary keeps the streaming engine out of the initial
114
- bundle. Route-scoping `provideUnrealModule()` tears down its effects when the
115
- route is left.
116
-
117
- > `UNREAL_CONFIG` on a route's `providers` does **not** work: the engine
118
- > services are `providedIn: 'root'`, so they are created by the root injector
119
- > and read the token from there. A route-level value is invisible to them and
120
- > `inject(UNREAL_CONFIG, { optional: true })` resolves to `null` — e.g. region
121
- > pinging is skipped entirely (empty `regionsPingUrl`), the orchestration
122
- > `requestStream` goes out without a region and the post-connection re-ping
123
- > never runs. Importing only the token at the root does not pull the module into
124
- > the initial bundle (the package is `sideEffects: false`).
125
-
126
- ### 3. Render the scene
127
-
128
- ```typescript
129
- import { ChangeDetectionStrategy, Component } from '@angular/core';
130
- import { UnrealSceneComponent } from '@3dsource/angular-unreal-module';
131
-
132
- @Component({
133
- selector: 'app-stream',
134
- imports: [UnrealSceneComponent],
135
- template: `<app-unreal-scene />`,
136
- changeDetection: ChangeDetectionStrategy.OnPush,
137
- })
138
- export class StreamComponent {}
139
- ```
140
-
141
- `UnrealSceneComponent` also accepts `isStudio`,
142
- `useContainerAsSizeProvider` and `resolutionSize` inputs, and emits
143
- `changeMouseOverScene`.
144
-
145
- ## Main API
146
-
147
- - `provideUnrealState()` — registers the `unrealFeature` NgRx state.
148
- - `provideUnrealModule()` — registers effects and boots streaming services.
149
- - `UnrealSceneComponent` — renders and manages the Pixel Streaming scene.
150
- - `UnrealCommunicatorService` — sends commands and UI interactions.
151
- - `UnrealCallbackService` — observes Unreal callbacks and command responses.
152
- - `unrealFeature`, exported selectors and actions — expose connection and scene
153
- lifecycle state.
154
- - `FileReceiverService` and `FileHandlerService` — receive files over the
155
- DataChannel.
156
-
157
- Command packet types are provided by `@3dsource/types-unreal`.
158
-
159
- Run `pnpm demo:start` from the repository root to see the scene component in
160
- the demo application.
161
-
162
- ## Optional prefetch scripts
163
-
164
- The package publishes two dependency-free scripts for use in the document
165
- `<head>` before Angular starts:
166
-
167
- - `region-ping-prefetch.js` measures regions early and caches the closest one.
168
- - `stream-prefetch.js` opens and parks an eligible WebRTC connection so Angular
169
- can adopt it after bootstrap.
170
-
171
- <!-- prettier-ignore -->
172
- ```html
173
- <script
174
- src="https://cdn.jsdelivr.net/npm/@3dsource/angular-unreal-module/js/region-ping-prefetch.js"
175
- async
176
- ></script>
177
- <script
178
- src="https://cdn.jsdelivr.net/npm/@3dsource/angular-unreal-module/js/stream-prefetch.js"
179
- async
180
- ></script>
181
- ```
182
-
183
- `stream-prefetch.js` runs by default only on
184
- `metabox-configurator/{modular|basic}/...` routes. It reads the same-origin
185
- `assets/config.json`; override that path with `data-config-url` when needed.
186
- It also forwards the orchestration-issued `streamRequestId` from the polling
187
- response to Cirrus on the WebSocket URL (the session `connectionId`) and parks it
188
- for the Angular side to adopt.
189
- Pin an exact package version in production when deterministic CDN assets are
190
- required.
191
-
192
- ## Repository development
193
-
194
- Run commands from the repository root:
195
-
196
- ```shell
197
- pnpm unreal:build
198
- pnpm unreal:build:watch
199
- pnpm unreal:lint
200
- pnpm unreal:test
201
- pnpm unreal:test:watch
202
- pnpm unreal:test:signalling
203
- pnpm unreal:test:signalling:leaks
204
- ```
205
-
206
- `unreal:build` builds the local `source-ui-native`, `types-unreal` and `utils`
207
- dependencies before this package.
208
-
209
- Release commands publish only this package:
210
-
211
- ```shell
212
- pnpm unreal:release:patch
213
- pnpm unreal:release:dev
214
- ```
215
-
216
- After a successful publish, the release automatically purges the matching
217
- jsDelivr tag. Retry a failed purge without rerunning the release:
218
-
219
- ```shell
220
- pnpm unreal:purge-cdn -- latest
221
- pnpm unreal:purge-cdn -- dev
222
- ```
223
-
224
- Repository tooling requires Node.js 24.16.0 or newer and pnpm 11.18.0.
1
+ # @3dsource/angular-unreal-module
2
+
3
+ Standalone Angular integration for Unreal Engine Pixel Streaming. The package
4
+ provides the scene component, WebRTC and signalling lifecycle, NgRx state,
5
+ command/callback APIs, reconnection, file transfer and telemetry.
6
+
7
+ ## Requirements
8
+
9
+ - Angular, Angular CDK and Angular Forms `>=19.0.0 <23.0.0`
10
+ - NgRx Store and Effects `>=19.0.0 <23.0.0`
11
+ - RxJS `>=7.8.0 <8.0.0`
12
+ - `@3dsource/source-ui-native >=1.0.9`
13
+ - `@3dsource/types-unreal >=0.0.7`
14
+ - `@3dsource/utils >=1.0.21`
15
+ - `provideHttpClient()` in the host application
16
+
17
+ ## Installation
18
+
19
+ ```shell
20
+ pnpm add @3dsource/angular-unreal-module @3dsource/source-ui-native @3dsource/types-unreal @3dsource/utils
21
+ ```
22
+
23
+ The package is standalone and does not expose an NgModule.
24
+
25
+ ## Setup
26
+
27
+ ### 1. Register state and configuration once
28
+
29
+ Add the Unreal feature state, HTTP client and configuration at the application
30
+ root. `UNREAL_CONFIG` is required, although all its fields are optional.
31
+
32
+ <!-- prettier-ignore -->
33
+ ```typescript
34
+ import { provideHttpClient } from '@angular/common/http';
35
+ import type { ApplicationConfig } from '@angular/core';
36
+ import { provideStore } from '@ngrx/store';
37
+ import {
38
+ provideUnrealState,
39
+ UNREAL_CONFIG,
40
+ type UnrealInitialConfig,
41
+ } from '@3dsource/angular-unreal-module';
42
+
43
+ const unrealConfig = {
44
+ regionsPingUrl: 'https://datacenter.3dsource.com/regions/',
45
+ dataChannelConnectionTimeout: 8000,
46
+ fpsMonitor: false,
47
+ autoHighResolution: false,
48
+ } satisfies UnrealInitialConfig;
49
+
50
+ export const appConfig: ApplicationConfig = {
51
+ providers: [
52
+ provideHttpClient(),
53
+ provideStore(),
54
+ provideUnrealState(),
55
+ { provide: UNREAL_CONFIG, useValue: unrealConfig },
56
+ ],
57
+ };
58
+ ```
59
+
60
+ Omit `provideStore()` when the root NgRx store is already configured.
61
+
62
+ Available configuration fields:
63
+
64
+ | Field | Purpose |
65
+ | ------------------------------ | ---------------------------------------------- |
66
+ | `regionsPingUrl` | Region latency endpoint |
67
+ | `dataChannelConnectionTimeout` | DataChannel connection timeout in ms |
68
+ | `customErrorsEndpoint` | Custom error reporting endpoint |
69
+ | `commandTelemetryReceiver` | Command telemetry endpoint |
70
+ | `streamTelemetryV2Url` | Stream lifecycle telemetry endpoint |
71
+ | `screenLockerContainerId` | Container used by the screen-locker overlay |
72
+ | `fpsMonitor` | Enables FPS monitoring |
73
+ | `autoHighResolution` | Raises resolution after the scene becomes idle |
74
+ | `playwright` | Enables the test-specific service behaviour |
75
+
76
+ Use `{ provide: UNREAL_CONFIG, useValue: {} }` for the minimal configuration.
77
+
78
+ ### 2. Boot the engine on a lazy route
79
+
80
+ Lazy-load the route file from the application router:
81
+
82
+ <!-- prettier-ignore -->
83
+ ```typescript
84
+ import type { Routes } from '@angular/router';
85
+
86
+ export const APP_ROUTES: Routes = [
87
+ {
88
+ path: 'stream',
89
+ loadChildren: () =>
90
+ import('./stream/stream.routes').then((module) => module.STREAM_ROUTES),
91
+ },
92
+ ];
93
+ ```
94
+
95
+ Register `provideUnrealModule()` inside that lazy route file:
96
+
97
+ <!-- prettier-ignore -->
98
+ ```typescript
99
+ import type { Routes } from '@angular/router';
100
+ import { provideUnrealModule } from '@3dsource/angular-unreal-module';
101
+ import { StreamComponent } from './stream.component';
102
+
103
+ export const STREAM_ROUTES: Routes = [
104
+ {
105
+ path: '',
106
+ component: StreamComponent,
107
+ providers: [provideUnrealModule()],
108
+ },
109
+ ];
110
+ ```
111
+
112
+ Keep `provideUnrealState()` and `UNREAL_CONFIG` at the application root.
113
+ The `loadChildren()` boundary keeps the streaming engine out of the initial
114
+ bundle. Route-scoping `provideUnrealModule()` tears down its effects when the
115
+ route is left.
116
+
117
+ > `UNREAL_CONFIG` on a route's `providers` does **not** work: the engine
118
+ > services are `providedIn: 'root'`, so they are created by the root injector
119
+ > and read the token from there. A route-level value is invisible to them and
120
+ > `inject(UNREAL_CONFIG, { optional: true })` resolves to `null` — e.g. region
121
+ > pinging is skipped entirely (empty `regionsPingUrl`), the orchestration
122
+ > `requestStream` goes out without a region and the post-connection re-ping
123
+ > never runs. Importing only the token at the root does not pull the module into
124
+ > the initial bundle (the package is `sideEffects: false`).
125
+
126
+ ### 3. Render the scene
127
+
128
+ ```typescript
129
+ import { ChangeDetectionStrategy, Component } from '@angular/core';
130
+ import { UnrealSceneComponent } from '@3dsource/angular-unreal-module';
131
+
132
+ @Component({
133
+ selector: 'app-stream',
134
+ imports: [UnrealSceneComponent],
135
+ template: `<app-unreal-scene />`,
136
+ changeDetection: ChangeDetectionStrategy.OnPush,
137
+ })
138
+ export class StreamComponent {}
139
+ ```
140
+
141
+ `UnrealSceneComponent` also accepts `isStudio`,
142
+ `useContainerAsSizeProvider` and `resolutionSize` inputs, and emits
143
+ `changeMouseOverScene`.
144
+
145
+ ## Main API
146
+
147
+ - `provideUnrealState()` — registers the `unrealFeature` NgRx state.
148
+ - `provideUnrealModule()` — registers effects and boots streaming services.
149
+ - `UnrealSceneComponent` — renders and manages the Pixel Streaming scene.
150
+ - `UnrealCommunicatorService` — sends commands and UI interactions.
151
+ - `UnrealCallbackService` — observes Unreal callbacks and command responses.
152
+ - `unrealFeature`, exported selectors and actions — expose connection and scene
153
+ lifecycle state.
154
+
155
+ Command packet types are provided by `@3dsource/types-unreal`.
156
+
157
+ Run `pnpm demo:start` from the repository root to see the scene component in
158
+ the demo application.
159
+
160
+ ## Optional prefetch scripts
161
+
162
+ The package publishes two dependency-free scripts for use in the document
163
+ `<head>` before Angular starts:
164
+
165
+ - `region-ping-prefetch.js` measures regions early and caches the closest one.
166
+ - `stream-prefetch.js` opens and parks an eligible WebRTC connection so Angular
167
+ can adopt it after bootstrap.
168
+
169
+ <!-- prettier-ignore -->
170
+ ```html
171
+ <script
172
+ src="https://cdn.jsdelivr.net/npm/@3dsource/angular-unreal-module/js/region-ping-prefetch.js"
173
+ async
174
+ ></script>
175
+ <script
176
+ src="https://cdn.jsdelivr.net/npm/@3dsource/angular-unreal-module/js/stream-prefetch.js"
177
+ async
178
+ ></script>
179
+ ```
180
+
181
+ `stream-prefetch.js` runs by default only on
182
+ `metabox-configurator/{modular|basic}/...` routes. It reads the same-origin
183
+ `assets/config.json`; override that path with `data-config-url` when needed.
184
+ It also forwards the orchestration-issued `streamRequestId` from the polling
185
+ response to Cirrus on the WebSocket URL (the session `connectionId`) and parks it
186
+ for the Angular side to adopt.
187
+ Pin an exact package version in production when deterministic CDN assets are
188
+ required.
189
+
190
+ ## Repository development
191
+
192
+ Run commands from the repository root:
193
+
194
+ ```shell
195
+ pnpm unreal:build
196
+ pnpm unreal:build:watch
197
+ pnpm unreal:lint
198
+ pnpm unreal:test
199
+ pnpm unreal:test:watch
200
+ pnpm unreal:test:signalling
201
+ pnpm unreal:test:signalling:leaks
202
+ ```
203
+
204
+ `unreal:build` builds the local `source-ui-native`, `types-unreal` and `utils`
205
+ dependencies before this package.
206
+
207
+ Release commands publish only this package:
208
+
209
+ ```shell
210
+ pnpm unreal:release:patch
211
+ pnpm unreal:release:dev
212
+ ```
213
+
214
+ After a successful publish, the release automatically purges the matching
215
+ jsDelivr tag. Retry a failed purge without rerunning the release:
216
+
217
+ ```shell
218
+ pnpm unreal:purge-cdn -- latest
219
+ pnpm unreal:purge-cdn -- dev
220
+ ```
221
+
222
+ Repository tooling requires Node.js 24.16.0 or newer and pnpm 11.18.0.