@3dsource/angular-unreal-module 0.0.157 → 0.0.159-dev.0
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 +14 -14
- package/README.md +212 -422
- package/fesm2022/3dsource-angular-unreal-module.mjs +260 -535
- package/fesm2022/3dsource-angular-unreal-module.mjs.map +1 -1
- package/package.json +3 -4
- package/types/3dsource-angular-unreal-module.d.ts +217 -359
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { InjectionToken, inject, DestroyRef, ChangeDetectionStrategy, Component, Injectable, signal, effect, untracked, computed,
|
|
2
|
+
import { InjectionToken, inject, DestroyRef, ChangeDetectionStrategy, Component, Injectable, signal, effect, untracked, computed, input, ElementRef, viewChild, afterNextRender, HostListener, SecurityContext, Pipe, output, makeEnvironmentProviders, provideEnvironmentInitializer } from '@angular/core';
|
|
3
3
|
import { SourceButtonComponent, SourceLoadingComponent } from '@3dsource/source-ui-native';
|
|
4
|
-
import { Subject, skip, share, merge, map, scan, timestamp, startWith, pairwise, concatMap, of, animationFrameScheduler, interval, Observable, timer, take, defer, switchMap, from, throwError, EMPTY, retry, timeout as timeout$1, repeat, BehaviorSubject, takeUntil as takeUntil$1, fromEvent, tap as tap$1, throttleTime, delay, concat, debounceTime, mergeMap, NEVER, ignoreElements, shareReplay, asyncScheduler, filter as filter$1, withLatestFrom as withLatestFrom$1, Subscription, bufferTime, combineLatestWith
|
|
4
|
+
import { Subject, skip, share, merge, map, scan, timestamp, startWith, pairwise, concatMap, of, animationFrameScheduler, interval, Observable, timer, take, defer, switchMap, from, throwError, EMPTY, retry, timeout as timeout$1, repeat, BehaviorSubject, takeUntil as takeUntil$1, fromEvent, tap as tap$1, throttleTime, delay, concat, debounceTime, mergeMap, NEVER, ignoreElements, shareReplay, asyncScheduler, filter as filter$1, withLatestFrom as withLatestFrom$1, Subscription, bufferTime, combineLatestWith } from 'rxjs';
|
|
5
5
|
import { createAction, props, createReducer, on, createFeature, Store, createSelector, provideState } from '@ngrx/store';
|
|
6
|
-
import { whereNot, Falsy, Logger,
|
|
6
|
+
import { whereNot, Falsy, Logger, clampf, lerp, getCanvasCached, getSnapshot, fitIntoRectangle, generateUuid, Truthy, tapLog, Semaphore, COLOR_CODES, where, KeyboardNumericCode, InvertedKeyMap, HEXtoRGB, RGBtoHSV, inverseLerp, HSVtoRGB, RGBtoHEX, fpIsASameAsB } from '@3dsource/utils';
|
|
7
7
|
import { filter, map as map$1, distinctUntilChanged, takeWhile, takeUntil, catchError, tap, timeout, finalize, first, switchMap as switchMap$1, withLatestFrom, exhaustMap, debounceTime as debounceTime$1, take as take$1, startWith as startWith$1 } from 'rxjs/operators';
|
|
8
8
|
import { Actions, ofType, createEffect, provideEffects } from '@ngrx/effects';
|
|
9
9
|
import { DialogRef, DIALOG_DATA, Dialog } from '@angular/cdk/dialog';
|
|
@@ -11,11 +11,8 @@ import { HttpClient } from '@angular/common/http';
|
|
|
11
11
|
import { ScrollStrategyOptions } from '@angular/cdk/overlay';
|
|
12
12
|
import { MetaBoxCommand, EPayloadVersion } from '@3dsource/types-unreal';
|
|
13
13
|
import { toSignal, toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
14
|
-
import { v4 } from 'uuid';
|
|
15
|
-
import { DomSanitizer } from '@angular/platform-browser';
|
|
16
14
|
import { NgOptimizedImage, JsonPipe } from '@angular/common';
|
|
17
|
-
import
|
|
18
|
-
import { FormsModule } from '@angular/forms';
|
|
15
|
+
import { DomSanitizer } from '@angular/platform-browser';
|
|
19
16
|
|
|
20
17
|
const SpecialKeyCodes = {
|
|
21
18
|
BackSpace: 8,
|
|
@@ -872,85 +869,6 @@ function decodeData(anyData) {
|
|
|
872
869
|
}
|
|
873
870
|
}
|
|
874
871
|
|
|
875
|
-
class DataFlowMonitor {
|
|
876
|
-
/**
|
|
877
|
-
* Initializes the DataFlowMonitor monitor.
|
|
878
|
-
* @param yellowFlagThresholdPercentage - The percentage drop to trigger a YELLOW warning (default: 15%).
|
|
879
|
-
* @param redFlagThresholdPercentage - The percentage drop to trigger a RED warning (default: 30%).
|
|
880
|
-
* @param historyBufferLength - buffer length (default: 100).
|
|
881
|
-
* @param splitPoint - The point at which to split the history buffer into two halves (default: 0.5).
|
|
882
|
-
*/
|
|
883
|
-
constructor(yellowFlagThresholdPercentage = 15, redFlagThresholdPercentage = 30, historyBufferLength = 100, splitPoint = 0.5) {
|
|
884
|
-
this.yellowFlagThresholdPercentage = yellowFlagThresholdPercentage;
|
|
885
|
-
this.redFlagThresholdPercentage = redFlagThresholdPercentage;
|
|
886
|
-
this.historyBufferLength = historyBufferLength;
|
|
887
|
-
this.splitPoint = splitPoint;
|
|
888
|
-
this.dataHistory = [];
|
|
889
|
-
}
|
|
890
|
-
reset() {
|
|
891
|
-
this.dataHistory.length = 0;
|
|
892
|
-
}
|
|
893
|
-
config(data) {
|
|
894
|
-
this.reset();
|
|
895
|
-
this.yellowFlagThresholdPercentage = data.yellowFlag;
|
|
896
|
-
this.redFlagThresholdPercentage = data.redFlag;
|
|
897
|
-
}
|
|
898
|
-
/**
|
|
899
|
-
* Adds a new bitrate measurement and checks for significant drops.
|
|
900
|
-
* @param currentValue - The current bitrate in kbps.
|
|
901
|
-
* @returns BitrateCheckResult indicating if a drop was detected.
|
|
902
|
-
*/
|
|
903
|
-
addValue(currentValue) {
|
|
904
|
-
if (isNaN(currentValue) || currentValue < 1) {
|
|
905
|
-
return {};
|
|
906
|
-
}
|
|
907
|
-
const historyLength = this.dataHistory.length;
|
|
908
|
-
if (historyLength > this.historyBufferLength) {
|
|
909
|
-
this.dataHistory.shift();
|
|
910
|
-
}
|
|
911
|
-
this.dataHistory.push(currentValue);
|
|
912
|
-
if (historyLength < this.historyBufferLength) {
|
|
913
|
-
this.dataHistory.length = this.historyBufferLength;
|
|
914
|
-
this.dataHistory.fill(currentValue, 0, this.historyBufferLength);
|
|
915
|
-
}
|
|
916
|
-
const splitIndex = Math.floor(historyLength * this.splitPoint);
|
|
917
|
-
const firstHalf = this.dataHistory.slice(0, splitIndex);
|
|
918
|
-
const secondHalf = this.dataHistory.slice(splitIndex);
|
|
919
|
-
const firstHalfMedian = calculateMedian(firstHalf);
|
|
920
|
-
const secondHalfMedian = calculateMedian(secondHalf);
|
|
921
|
-
const dropPercentage = clampf(0, 100, ((firstHalfMedian - secondHalfMedian) / firstHalfMedian) * 100);
|
|
922
|
-
const isRedFlag = dropPercentage >= this.redFlagThresholdPercentage;
|
|
923
|
-
if (dropPercentage >= this.yellowFlagThresholdPercentage) {
|
|
924
|
-
return {
|
|
925
|
-
config: {
|
|
926
|
-
yellowFlagThresholdPercentage: this.yellowFlagThresholdPercentage,
|
|
927
|
-
redFlagThresholdPercentage: this.redFlagThresholdPercentage,
|
|
928
|
-
historyBufferLength: this.historyBufferLength,
|
|
929
|
-
splitPoint: this.splitPoint,
|
|
930
|
-
},
|
|
931
|
-
isDropDetected: true,
|
|
932
|
-
dropPercentage,
|
|
933
|
-
activeMedian: secondHalfMedian,
|
|
934
|
-
quality: isRedFlag ? 'red' : 'orange',
|
|
935
|
-
message: `Significant flow drop detected: ${dropPercentage.toFixed(2)}% (from ${firstHalfMedian} to ${secondHalfMedian})`,
|
|
936
|
-
};
|
|
937
|
-
}
|
|
938
|
-
return {
|
|
939
|
-
config: {
|
|
940
|
-
yellowFlagThresholdPercentage: this.yellowFlagThresholdPercentage,
|
|
941
|
-
redFlagThresholdPercentage: this.redFlagThresholdPercentage,
|
|
942
|
-
historyBufferLength: this.historyBufferLength,
|
|
943
|
-
splitPoint: this.splitPoint,
|
|
944
|
-
},
|
|
945
|
-
isDropDetected: false,
|
|
946
|
-
dropPercentage,
|
|
947
|
-
activeMedian: secondHalfMedian,
|
|
948
|
-
quality: 'lime',
|
|
949
|
-
message: 'Stable flow',
|
|
950
|
-
};
|
|
951
|
-
}
|
|
952
|
-
}
|
|
953
|
-
|
|
954
872
|
const dispatchResize = () => {
|
|
955
873
|
window.dispatchEvent(new Event('resize'));
|
|
956
874
|
};
|
|
@@ -1033,51 +951,6 @@ function* getActiveUrl(urls) {
|
|
|
1033
951
|
}
|
|
1034
952
|
}
|
|
1035
953
|
|
|
1036
|
-
class KalmanFilter1D {
|
|
1037
|
-
/**
|
|
1038
|
-
* @param initialEstimate Initial guess of the state.
|
|
1039
|
-
* @param initialUncertainty Initial uncertainty in the guess.
|
|
1040
|
-
* @param processNoise Process variance (Q) representing model uncertainty.
|
|
1041
|
-
* @param measurementNoise Measurement variance (R) representing noise in measurements.
|
|
1042
|
-
*/
|
|
1043
|
-
constructor(initialEstimate, initialUncertainty, processNoise, measurementNoise) {
|
|
1044
|
-
this.estimate = initialEstimate;
|
|
1045
|
-
this.uncertainty = initialUncertainty;
|
|
1046
|
-
this.processNoise = processNoise;
|
|
1047
|
-
this.measurementNoise = measurementNoise;
|
|
1048
|
-
}
|
|
1049
|
-
/**
|
|
1050
|
-
* Incorporates a new measurement and returns the updated estimate.
|
|
1051
|
-
* @param measurement The new measurement value.
|
|
1052
|
-
*/
|
|
1053
|
-
update(measurement) {
|
|
1054
|
-
// === Prediction Step ===
|
|
1055
|
-
// For a constant model, the predicted state is the previous estimate.
|
|
1056
|
-
const predictedEstimate = this.estimate;
|
|
1057
|
-
// Increase the uncertainty by the process noise.
|
|
1058
|
-
const predictedUncertainty = this.uncertainty + this.processNoise;
|
|
1059
|
-
// === Update Step ===
|
|
1060
|
-
// Compute the innovation or measurement residual.
|
|
1061
|
-
const innovation = measurement - predictedEstimate;
|
|
1062
|
-
// Compute the innovation covariance.
|
|
1063
|
-
const innovationCovariance = predictedUncertainty + this.measurementNoise;
|
|
1064
|
-
// Compute the Kalman Gain.
|
|
1065
|
-
const kalmanGain = predictedUncertainty / innovationCovariance;
|
|
1066
|
-
// Update the estimate with the measurement, weighted by the Kalman Gain.
|
|
1067
|
-
this.estimate = predictedEstimate + kalmanGain * innovation;
|
|
1068
|
-
// Update the uncertainty.
|
|
1069
|
-
this.uncertainty = (1 - kalmanGain) * predictedUncertainty;
|
|
1070
|
-
return this.estimate;
|
|
1071
|
-
}
|
|
1072
|
-
config(data) {
|
|
1073
|
-
const { initialBitrateEstimate, initialErrorCovariance, processNoise, measurementNoise, } = data;
|
|
1074
|
-
this.estimate = initialBitrateEstimate;
|
|
1075
|
-
this.uncertainty = initialErrorCovariance;
|
|
1076
|
-
this.processNoise = processNoise;
|
|
1077
|
-
this.measurementNoise = measurementNoise;
|
|
1078
|
-
}
|
|
1079
|
-
}
|
|
1080
|
-
|
|
1081
954
|
class LatencyTimings {
|
|
1082
955
|
constructor() {
|
|
1083
956
|
this.TestStartTimeMs = null;
|
|
@@ -1370,11 +1243,11 @@ class WebrtcErrorModalComponent {
|
|
|
1370
1243
|
this.#dialogRef.close();
|
|
1371
1244
|
}
|
|
1372
1245
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: WebrtcErrorModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1373
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.8", type: WebrtcErrorModalComponent, isStandalone: true, selector: "app-webrtc-error-modal", ngImport: i0, template: "<div [attr.data-testid]=\"'webrtc-error-modal'\" class=\"src-modal\">\
|
|
1246
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.8", type: WebrtcErrorModalComponent, isStandalone: true, selector: "app-webrtc-error-modal", ngImport: i0, template: "<div [attr.data-testid]=\"'webrtc-error-modal'\" class=\"src-modal\">\n <header class=\"src-modal__header\"></header>\n <section class=\"src-modal__body\">\n <div [attr.data-testid]=\"'title'\" class=\"src-modal__title\">\n WebRTC error\n </div>\n <div style=\"text-align: left\">\n An internet connection type (WebRTC) appears to be blocked either by your\n browser settings or your current network. If WebRTC is blocked on your\n browser you may be able to adjust these settings yourself based on\n instructions here:\n <a href=\"https://myownconference.com/blog/en/webrtc/\" target=\"blank\"\n >https://myownconference.com/blog/en/webrtc/</a\n >\n <br /><br />\n Trying a different web browser may help confirm this as well. If WebRTC is\n blocked by your network, try switching to a different network if possible\n or contact your network administrator.<br /><br />\n WebRTC is common, safe and increasingly utilised method for streaming real\n time 3D experiences via a web browser. It typically consumes no more\n bandwidth than streaming an HD video.\n </div>\n </section>\n <footer class=\"src-modal__footer\">\n <src-button\n (onClick)=\"closeModalWithCirrusDisconnect()\"\n [data-testid]=\"'close-webrtc-error-modal'\"\n weight=\"primary\"\n >\n Ok\n </src-button>\n </footer>\n</div>\n", styles: [".src-modal{--modalBodyPadding: 20px 8px 20px 20px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto}.src-modal__body{width:100%}.src-modal__body p{color:var(--src-text-body-main, #1f2937);font-size:14px;font-style:normal;font-weight:400;line-height:24px;margin-top:0}.src-modal__body a{word-wrap:break-word;white-space:normal}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1374
1247
|
}
|
|
1375
1248
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: WebrtcErrorModalComponent, decorators: [{
|
|
1376
1249
|
type: Component,
|
|
1377
|
-
args: [{ selector: 'app-webrtc-error-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "<div [attr.data-testid]=\"'webrtc-error-modal'\" class=\"src-modal\">\
|
|
1250
|
+
args: [{ selector: 'app-webrtc-error-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "<div [attr.data-testid]=\"'webrtc-error-modal'\" class=\"src-modal\">\n <header class=\"src-modal__header\"></header>\n <section class=\"src-modal__body\">\n <div [attr.data-testid]=\"'title'\" class=\"src-modal__title\">\n WebRTC error\n </div>\n <div style=\"text-align: left\">\n An internet connection type (WebRTC) appears to be blocked either by your\n browser settings or your current network. If WebRTC is blocked on your\n browser you may be able to adjust these settings yourself based on\n instructions here:\n <a href=\"https://myownconference.com/blog/en/webrtc/\" target=\"blank\"\n >https://myownconference.com/blog/en/webrtc/</a\n >\n <br /><br />\n Trying a different web browser may help confirm this as well. If WebRTC is\n blocked by your network, try switching to a different network if possible\n or contact your network administrator.<br /><br />\n WebRTC is common, safe and increasingly utilised method for streaming real\n time 3D experiences via a web browser. It typically consumes no more\n bandwidth than streaming an HD video.\n </div>\n </section>\n <footer class=\"src-modal__footer\">\n <src-button\n (onClick)=\"closeModalWithCirrusDisconnect()\"\n [data-testid]=\"'close-webrtc-error-modal'\"\n weight=\"primary\"\n >\n Ok\n </src-button>\n </footer>\n</div>\n", styles: [".src-modal{--modalBodyPadding: 20px 8px 20px 20px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto}.src-modal__body{width:100%}.src-modal__body p{color:var(--src-text-body-main, #1f2937);font-size:14px;font-style:normal;font-weight:400;line-height:24px;margin-top:0}.src-modal__body a{word-wrap:break-word;white-space:normal}\n"] }]
|
|
1378
1251
|
}] });
|
|
1379
1252
|
|
|
1380
1253
|
class CommandTelemetryService extends SubService {
|
|
@@ -2565,30 +2438,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
2565
2438
|
args: [{ providedIn: 'root' }]
|
|
2566
2439
|
}], ctorParameters: () => [] });
|
|
2567
2440
|
|
|
2568
|
-
/**
|
|
2569
|
-
* Default LBM Filter Parameters
|
|
2570
|
-
*/
|
|
2571
|
-
const DefaultFilterModel = {
|
|
2572
|
-
minimumBitrate: 1600,
|
|
2573
|
-
yellowFlag: 30,
|
|
2574
|
-
redFlag: 50,
|
|
2575
|
-
minimumFps: 5,
|
|
2576
|
-
monitoringDelayTime: 5000,
|
|
2577
|
-
initialBitrateEstimate: 1600,
|
|
2578
|
-
initialErrorCovariance: 1,
|
|
2579
|
-
processNoise: 3,
|
|
2580
|
-
measurementNoise: 500,
|
|
2581
|
-
panelOpen: false,
|
|
2582
|
-
};
|
|
2583
|
-
/**
|
|
2584
|
-
* Global LBM Filter Parameters
|
|
2585
|
-
*/
|
|
2586
|
-
const FilterModel = { ...DefaultFilterModel };
|
|
2587
|
-
/**
|
|
2588
|
-
* Bitrate Monitor Static Class
|
|
2589
|
-
*/
|
|
2590
|
-
const BITRATE_MONITOR = new DataFlowMonitor(FilterModel.yellowFlag, FilterModel.redFlag, 20);
|
|
2591
|
-
|
|
2592
2441
|
class VideoService extends SubService {
|
|
2593
2442
|
constructor() {
|
|
2594
2443
|
super();
|
|
@@ -2606,21 +2455,66 @@ class VideoService extends SubService {
|
|
|
2606
2455
|
this.videoTrack$ = new BehaviorSubject(null);
|
|
2607
2456
|
this.VideoEncoderQP = 0;
|
|
2608
2457
|
this.aggregatedStats = {};
|
|
2609
|
-
this.kalmanFilter1D = new KalmanFilter1D(FilterModel.initialBitrateEstimate, FilterModel.initialErrorCovariance, FilterModel.processNoise, FilterModel.measurementNoise);
|
|
2610
2458
|
/**
|
|
2611
2459
|
* Aggregate video stats and emit it as videoStats$
|
|
2612
2460
|
*/
|
|
2613
2461
|
this.videoStats$ = this.videoTrack$.pipe(
|
|
2614
2462
|
// If videoTrack$ emits null, switch to EMPTY → the current interval is canceled.
|
|
2615
2463
|
switchMap$1((track) => track
|
|
2616
|
-
?
|
|
2617
|
-
interval(250).pipe(map(() => track.pcClient), switchMap$1((pcClient) => from(this.getStats(pcClient))), filter(Truthy))
|
|
2464
|
+
? interval(250).pipe(map(() => track.pcClient), switchMap$1((pcClient) => from(this.getStats(pcClient))), filter(Truthy))
|
|
2618
2465
|
: of(null)), filter(Truthy), share());
|
|
2619
2466
|
this.destroyAbort = new AbortController();
|
|
2467
|
+
// Teardown is wired ONCE here instead of per `create()`. The per-create
|
|
2468
|
+
// subscription added one more live handler for every session, and the
|
|
2469
|
+
// `take(1)` that bounded it let the shared `disconnect$` refCount fall to
|
|
2470
|
+
// zero between sessions — which re-armed its `skip(1)` and could swallow
|
|
2471
|
+
// the next real disconnect. `destroy()` is idempotent, so reacting to every
|
|
2472
|
+
// emission from a single subscription is equivalent but leak-free.
|
|
2473
|
+
this.disconnect$
|
|
2474
|
+
.pipe(takeUntil$1(this.destroy$))
|
|
2475
|
+
.subscribe(() => this.destroy());
|
|
2620
2476
|
this.destroyRef.onDestroy(() => this.destroy());
|
|
2621
2477
|
}
|
|
2478
|
+
/**
|
|
2479
|
+
* Sets (or replaces) the DOM target for the streaming `<video>`.
|
|
2480
|
+
*
|
|
2481
|
+
* Attaching is idempotent and order-independent on purpose: `create()` is
|
|
2482
|
+
* driven by the network (`config`, or a synchronous prefetch adoption) while
|
|
2483
|
+
* the container comes from the scene component's render pass, so either side
|
|
2484
|
+
* can win the race. If `create()` got there first the element is detached —
|
|
2485
|
+
* adopt it here instead of leaving it orphaned (which showed up as a white
|
|
2486
|
+
* scene with an empty `#player` and no `videoStreamInitialized`).
|
|
2487
|
+
*/
|
|
2622
2488
|
setContainer(container = null) {
|
|
2623
2489
|
this.container = container;
|
|
2490
|
+
this.attachVideoToContainer();
|
|
2491
|
+
}
|
|
2492
|
+
/**
|
|
2493
|
+
* Moves `this.video` under the current container unless it is already there.
|
|
2494
|
+
* `parentElement` (not `isConnected`) is the guard: it also covers a swap to a
|
|
2495
|
+
* different container while the element sits in a still-live old one.
|
|
2496
|
+
*/
|
|
2497
|
+
attachVideoToContainer() {
|
|
2498
|
+
const container = this.container;
|
|
2499
|
+
const video = this.video;
|
|
2500
|
+
if (!container || !video || video.parentElement === container) {
|
|
2501
|
+
return;
|
|
2502
|
+
}
|
|
2503
|
+
container.appendChild(video);
|
|
2504
|
+
// Positive confirmation that the element the stream renders into actually
|
|
2505
|
+
// exists in the document — the failure this guards against is silent
|
|
2506
|
+
// (detached element, white scene), so the healthy path must be visible too.
|
|
2507
|
+
Logger.info(`VideoService: <video id="${video.id}"> attached to #${container.id || '(container without id)'} | inDom=${video.isConnected} | hasStream=${!!video.srcObject}`);
|
|
2508
|
+
// A detached element cannot start playing, so the play() issued by
|
|
2509
|
+
// attachVideoStream before this point was lost — re-issue it now that the
|
|
2510
|
+
// element is in the DOM. Deliberately NOT gated on `video.paused`: per spec
|
|
2511
|
+
// play() clears `paused` synchronously, so a play that was accepted but
|
|
2512
|
+
// never produced frames (detached element) is indistinguishable from a
|
|
2513
|
+
// healthy one by that flag. play() on an already-playing element is a
|
|
2514
|
+
// no-op, which makes the unconditional call the safe direction.
|
|
2515
|
+
if (video.srcObject) {
|
|
2516
|
+
void this.safePlay(video);
|
|
2517
|
+
}
|
|
2624
2518
|
}
|
|
2625
2519
|
setLatencyTimings(latencyTimings) {
|
|
2626
2520
|
this.latencyTestTimings.SetUETimings(latencyTimings);
|
|
@@ -2630,11 +2524,8 @@ class VideoService extends SubService {
|
|
|
2630
2524
|
}
|
|
2631
2525
|
create() {
|
|
2632
2526
|
if (!this.container) {
|
|
2633
|
-
Logger.warn('VideoService.create(): no container set; <video>
|
|
2527
|
+
Logger.warn('VideoService.create(): no container set yet; <video> is built detached and will be attached (and replayed) by the next setContainer().');
|
|
2634
2528
|
}
|
|
2635
|
-
this.disconnect$
|
|
2636
|
-
.pipe(take(1), takeUntil$1(this.destroy$))
|
|
2637
|
-
.subscribe(() => this.destroy());
|
|
2638
2529
|
this.destroy();
|
|
2639
2530
|
this.createWebRtcVideo();
|
|
2640
2531
|
this.createWebRtcAudio();
|
|
@@ -2682,10 +2573,10 @@ class VideoService extends SubService {
|
|
|
2682
2573
|
return;
|
|
2683
2574
|
}
|
|
2684
2575
|
catch (error) {
|
|
2685
|
-
|
|
2686
|
-
|
|
2687
|
-
|
|
2688
|
-
|
|
2576
|
+
// Only an autoplay block is worth retrying. Anything else (AbortError,
|
|
2577
|
+
// a decode failure, a non-Error rejection value) is reported and left
|
|
2578
|
+
// alone — retrying muted or on a gesture cannot fix those.
|
|
2579
|
+
if (!isAutoplayBlocked(error)) {
|
|
2689
2580
|
Logger.warn('safePlay() rejected with non-autoplay error:', error);
|
|
2690
2581
|
return;
|
|
2691
2582
|
}
|
|
@@ -2699,33 +2590,43 @@ class VideoService extends SubService {
|
|
|
2699
2590
|
catch {
|
|
2700
2591
|
/* fall through */
|
|
2701
2592
|
}
|
|
2702
|
-
// Last resort: wait for the next real user gesture
|
|
2703
|
-
|
|
2704
|
-
|
|
2705
|
-
// choose whether to unmute here
|
|
2706
|
-
// video.muted = false;
|
|
2707
|
-
await video.play();
|
|
2708
|
-
}
|
|
2709
|
-
catch {
|
|
2710
|
-
/* ignore, maybe another gesture needed */
|
|
2711
|
-
}
|
|
2712
|
-
finally {
|
|
2713
|
-
window.removeEventListener('pointerdown', resume, true);
|
|
2714
|
-
window.removeEventListener('keydown', resume, true);
|
|
2715
|
-
}
|
|
2716
|
-
};
|
|
2717
|
-
window.addEventListener('pointerdown', resume, {
|
|
2718
|
-
once: true,
|
|
2719
|
-
capture: true,
|
|
2720
|
-
signal: this.destroyAbort.signal,
|
|
2721
|
-
});
|
|
2722
|
-
window.addEventListener('keydown', resume, {
|
|
2723
|
-
once: true,
|
|
2724
|
-
capture: true,
|
|
2725
|
-
signal: this.destroyAbort.signal,
|
|
2726
|
-
});
|
|
2593
|
+
// Last resort: wait for the next real user gesture.
|
|
2594
|
+
// choose whether to unmute in armGestureRetry's caller
|
|
2595
|
+
this.armGestureRetry(video);
|
|
2727
2596
|
}
|
|
2728
2597
|
}
|
|
2598
|
+
/**
|
|
2599
|
+
* Retries playback on the next real user gesture — the only thing that lifts
|
|
2600
|
+
* a browser autoplay block. Shared by `safePlay()` and `playAudio()` so both
|
|
2601
|
+
* media elements use one arming/cleanup path.
|
|
2602
|
+
*
|
|
2603
|
+
* Listeners are `once` + `capture` and bound to `destroyAbort.signal`, so a
|
|
2604
|
+
* `destroy()` in this session drops them instead of leaking into the next one.
|
|
2605
|
+
*/
|
|
2606
|
+
armGestureRetry(element) {
|
|
2607
|
+
const resume = async () => {
|
|
2608
|
+
try {
|
|
2609
|
+
await element.play();
|
|
2610
|
+
}
|
|
2611
|
+
catch {
|
|
2612
|
+
/* ignore — another gesture may be needed */
|
|
2613
|
+
}
|
|
2614
|
+
finally {
|
|
2615
|
+
window.removeEventListener('pointerdown', resume, true);
|
|
2616
|
+
window.removeEventListener('keydown', resume, true);
|
|
2617
|
+
}
|
|
2618
|
+
};
|
|
2619
|
+
window.addEventListener('pointerdown', resume, {
|
|
2620
|
+
once: true,
|
|
2621
|
+
capture: true,
|
|
2622
|
+
signal: this.destroyAbort.signal,
|
|
2623
|
+
});
|
|
2624
|
+
window.addEventListener('keydown', resume, {
|
|
2625
|
+
once: true,
|
|
2626
|
+
capture: true,
|
|
2627
|
+
signal: this.destroyAbort.signal,
|
|
2628
|
+
});
|
|
2629
|
+
}
|
|
2729
2630
|
async getStats(pcClient) {
|
|
2730
2631
|
if (!pcClient || pcClient.connectionState === 'closed') {
|
|
2731
2632
|
return null;
|
|
@@ -2756,47 +2657,7 @@ class VideoService extends SubService {
|
|
|
2756
2657
|
stats.forEach((report) => {
|
|
2757
2658
|
// Get the inbound-rtp for video
|
|
2758
2659
|
if (report.type === 'inbound-rtp' && report.kind === 'video') {
|
|
2759
|
-
|
|
2760
|
-
newStat.bytesReceivedStart =
|
|
2761
|
-
this.aggregatedStats && this.aggregatedStats.bytesReceivedStart
|
|
2762
|
-
? this.aggregatedStats.bytesReceivedStart
|
|
2763
|
-
: report.bytesReceived;
|
|
2764
|
-
newStat.framesDecodedStart =
|
|
2765
|
-
this.aggregatedStats && this.aggregatedStats.framesDecodedStart
|
|
2766
|
-
? this.aggregatedStats.framesDecodedStart
|
|
2767
|
-
: report.framesDecoded;
|
|
2768
|
-
newStat.timestampStart =
|
|
2769
|
-
this.aggregatedStats && this.aggregatedStats.timestampStart
|
|
2770
|
-
? this.aggregatedStats.timestampStart
|
|
2771
|
-
: report.timestamp;
|
|
2772
|
-
if (this.aggregatedStats && this.aggregatedStats.timestamp) {
|
|
2773
|
-
// Get the mimetype of the video codec being used
|
|
2774
|
-
if (report.codecId &&
|
|
2775
|
-
this.aggregatedStats.codecs &&
|
|
2776
|
-
Object.hasOwn(this.aggregatedStats.codecs, report.codecId)) {
|
|
2777
|
-
newStat.videoCodec = this.aggregatedStats.codecs[report.codecId];
|
|
2778
|
-
}
|
|
2779
|
-
if (this.aggregatedStats.bytesReceived) {
|
|
2780
|
-
// bitrate = bits received since last time / number of ms since last time
|
|
2781
|
-
// This is automatically in kbits (where k=1000) since time is in ms and stat we want is in seconds (so a '* 1000' then a '/ 1000' would negate each other)
|
|
2782
|
-
newStat.bitrate = Math.floor((8 *
|
|
2783
|
-
((newStat.bytesReceived || 0) -
|
|
2784
|
-
this.aggregatedStats.bytesReceived)) /
|
|
2785
|
-
(newStat.timestamp - this.aggregatedStats.timestamp));
|
|
2786
|
-
}
|
|
2787
|
-
if (this.aggregatedStats.bytesReceivedStart) {
|
|
2788
|
-
newStat.avgBitrate = Math.floor((8 *
|
|
2789
|
-
((newStat.bytesReceived || 0) -
|
|
2790
|
-
this.aggregatedStats.bytesReceivedStart)) /
|
|
2791
|
-
(newStat.timestamp - this.aggregatedStats.timestampStart));
|
|
2792
|
-
}
|
|
2793
|
-
if (this.aggregatedStats.framesDecodedStart) {
|
|
2794
|
-
newStat.avgFrameRate = Math.floor(((newStat.framesDecoded || 0) -
|
|
2795
|
-
this.aggregatedStats.framesDecodedStart) /
|
|
2796
|
-
((newStat.timestamp - this.aggregatedStats.timestampStart) /
|
|
2797
|
-
1000));
|
|
2798
|
-
}
|
|
2799
|
-
}
|
|
2660
|
+
this.applyInboundVideoReport(newStat, report);
|
|
2800
2661
|
}
|
|
2801
2662
|
// Only read RTT from the *nominated* ICE candidate pair. The
|
|
2802
2663
|
// stats report contains multiple `candidate-pair` entries (one
|
|
@@ -2815,15 +2676,7 @@ class VideoService extends SubService {
|
|
|
2815
2676
|
}
|
|
2816
2677
|
if (report.type === 'transport' &&
|
|
2817
2678
|
Object.hasOwn(report, 'selectedCandidatePairId')) {
|
|
2818
|
-
|
|
2819
|
-
if (selectedPair) {
|
|
2820
|
-
const local = stats.get(selectedPair.localCandidateId);
|
|
2821
|
-
const remote = stats.get(selectedPair.remoteCandidateId);
|
|
2822
|
-
newStat.selectedPair = {
|
|
2823
|
-
local: { type: local?.candidateType, url: local?.url },
|
|
2824
|
-
remote: { type: remote?.candidateType, url: remote?.url },
|
|
2825
|
-
};
|
|
2826
|
-
}
|
|
2679
|
+
this.applySelectedPair(newStat, stats, report.selectedCandidatePairId);
|
|
2827
2680
|
}
|
|
2828
2681
|
// Store mimetype of each codec
|
|
2829
2682
|
if (Object.hasOwn(newStat, 'codecs') &&
|
|
@@ -2836,6 +2689,68 @@ class VideoService extends SubService {
|
|
|
2836
2689
|
.replace('audio/', '');
|
|
2837
2690
|
}
|
|
2838
2691
|
});
|
|
2692
|
+
this.applySessionTotals(newStat);
|
|
2693
|
+
this.aggregatedStats = newStat;
|
|
2694
|
+
return this.onAggregatedStats(newStat);
|
|
2695
|
+
}
|
|
2696
|
+
/**
|
|
2697
|
+
* Folds one `inbound-rtp` video report into the accumulator: copies the raw
|
|
2698
|
+
* report, pins the per-session baselines on the first pass, then derives the
|
|
2699
|
+
* deltas relative to the previous pass.
|
|
2700
|
+
*/
|
|
2701
|
+
applyInboundVideoReport(newStat, report) {
|
|
2702
|
+
Object.assign(newStat, report);
|
|
2703
|
+
const previous = this.aggregatedStats;
|
|
2704
|
+
newStat.bytesReceivedStart = pinBaseline(previous?.bytesReceivedStart, report.bytesReceived);
|
|
2705
|
+
newStat.framesDecodedStart = pinBaseline(previous?.framesDecodedStart, report.framesDecoded);
|
|
2706
|
+
newStat.timestampStart = pinBaseline(previous?.timestampStart, report.timestamp);
|
|
2707
|
+
// Nothing to diff against on the first report of a session.
|
|
2708
|
+
if (!previous?.timestamp) {
|
|
2709
|
+
return;
|
|
2710
|
+
}
|
|
2711
|
+
// Get the mimetype of the video codec being used
|
|
2712
|
+
if (report.codecId &&
|
|
2713
|
+
previous.codecs &&
|
|
2714
|
+
Object.hasOwn(previous.codecs, report.codecId)) {
|
|
2715
|
+
newStat.videoCodec = previous.codecs[report.codecId];
|
|
2716
|
+
}
|
|
2717
|
+
if (previous.bytesReceived) {
|
|
2718
|
+
// bitrate = bits received since last time / number of ms since last time
|
|
2719
|
+
// This is automatically in kbits (where k=1000) since time is in ms and stat we want is in seconds (so a '* 1000' then a '/ 1000' would negate each other)
|
|
2720
|
+
newStat.bitrate = Math.floor((8 * ((newStat.bytesReceived || 0) - previous.bytesReceived)) /
|
|
2721
|
+
(newStat.timestamp - previous.timestamp));
|
|
2722
|
+
}
|
|
2723
|
+
if (previous.bytesReceivedStart) {
|
|
2724
|
+
newStat.avgBitrate = Math.floor((8 * ((newStat.bytesReceived || 0) - previous.bytesReceivedStart)) /
|
|
2725
|
+
(newStat.timestamp - previous.timestampStart));
|
|
2726
|
+
}
|
|
2727
|
+
if (previous.framesDecodedStart) {
|
|
2728
|
+
newStat.avgFrameRate = Math.floor(((newStat.framesDecoded || 0) - previous.framesDecodedStart) /
|
|
2729
|
+
((newStat.timestamp - previous.timestampStart) / 1000));
|
|
2730
|
+
}
|
|
2731
|
+
}
|
|
2732
|
+
/**
|
|
2733
|
+
* Resolves the transport's selected candidate pair into the local/remote
|
|
2734
|
+
* descriptors shown in the stats overlay. Silently skips when the pair (or
|
|
2735
|
+
* either of its candidates) is missing from this report.
|
|
2736
|
+
*/
|
|
2737
|
+
applySelectedPair(newStat, stats, selectedCandidatePairId) {
|
|
2738
|
+
if (!selectedCandidatePairId) {
|
|
2739
|
+
return;
|
|
2740
|
+
}
|
|
2741
|
+
const selectedPair = stats.get(selectedCandidatePairId);
|
|
2742
|
+
if (!selectedPair) {
|
|
2743
|
+
return;
|
|
2744
|
+
}
|
|
2745
|
+
const local = stats.get(selectedPair.localCandidateId);
|
|
2746
|
+
const remote = stats.get(selectedPair.remoteCandidateId);
|
|
2747
|
+
newStat.selectedPair = {
|
|
2748
|
+
local: { type: local?.candidateType, url: local?.url },
|
|
2749
|
+
remote: { type: remote?.candidateType, url: remote?.url },
|
|
2750
|
+
};
|
|
2751
|
+
}
|
|
2752
|
+
/** Per-session values that do not come from a single report. */
|
|
2753
|
+
applySessionTotals(newStat) {
|
|
2839
2754
|
newStat.pixelRatio = +window.devicePixelRatio.toFixed(2);
|
|
2840
2755
|
if (this.aggregatedStats.receiveToCompositeMs) {
|
|
2841
2756
|
newStat.receiveToCompositeMs = this.aggregatedStats.receiveToCompositeMs;
|
|
@@ -2843,11 +2758,6 @@ class VideoService extends SubService {
|
|
|
2843
2758
|
}
|
|
2844
2759
|
// Calculate duration of run
|
|
2845
2760
|
newStat.runTime = Math.floor((newStat.timestamp - newStat.timestampStart) / 1000);
|
|
2846
|
-
newStat.kalmanBitrate = Math.floor(this.kalmanFilter1D.update(newStat.bitrate || FilterModel.initialBitrateEstimate));
|
|
2847
|
-
newStat.dataFlowCheckResult = BITRATE_MONITOR.addValue(newStat.kalmanBitrate);
|
|
2848
|
-
newStat.bitrateDrop = Math.floor(newStat.dataFlowCheckResult.dropPercentage);
|
|
2849
|
-
this.aggregatedStats = newStat;
|
|
2850
|
-
return this.onAggregatedStats(newStat);
|
|
2851
2761
|
}
|
|
2852
2762
|
onAggregatedStats(aggregatedStats) {
|
|
2853
2763
|
return {
|
|
@@ -2872,6 +2782,11 @@ class VideoService extends SubService {
|
|
|
2872
2782
|
// on to the RTCRtpReceiver until GC eventually clears srcObject.
|
|
2873
2783
|
this.video.pause();
|
|
2874
2784
|
this.video.srcObject = null;
|
|
2785
|
+
// Remove exactly the element we own. Clearing every child of
|
|
2786
|
+
// `this.container` instead would wipe DOM this service never created —
|
|
2787
|
+
// including the children of a container that was swapped in after
|
|
2788
|
+
// `create()`, since `container` always points at the newest one.
|
|
2789
|
+
this.video.remove();
|
|
2875
2790
|
if (this.audio) {
|
|
2876
2791
|
this.audio.pause();
|
|
2877
2792
|
this.audio.srcObject = null;
|
|
@@ -2879,14 +2794,12 @@ class VideoService extends SubService {
|
|
|
2879
2794
|
this.video = null;
|
|
2880
2795
|
this.audio = null;
|
|
2881
2796
|
this.videoTrack$.next(null);
|
|
2882
|
-
// Reset stat state to prevent stale deltas on next session
|
|
2797
|
+
// Reset stat state to prevent stale deltas on next session — including the
|
|
2798
|
+
// latency timings, which otherwise carry the previous session's UE/display
|
|
2799
|
+
// deltas into the first measurements of the next one.
|
|
2883
2800
|
this.aggregatedStats = {};
|
|
2884
2801
|
this.VideoEncoderQP = 0;
|
|
2885
|
-
this.
|
|
2886
|
-
BITRATE_MONITOR.reset();
|
|
2887
|
-
while (this.container?.firstChild) {
|
|
2888
|
-
this.container.removeChild(this.container.firstChild);
|
|
2889
|
-
}
|
|
2802
|
+
this.latencyTestTimings = new LatencyTimings();
|
|
2890
2803
|
}
|
|
2891
2804
|
changeStatusMainVideoOnScene(isVideoPlaying) {
|
|
2892
2805
|
if (this.isVideoPlaying() === isVideoPlaying) {
|
|
@@ -2911,7 +2824,8 @@ class VideoService extends SubService {
|
|
|
2911
2824
|
video.preload = 'auto';
|
|
2912
2825
|
video.disablePictureInPicture = true;
|
|
2913
2826
|
this.video = video;
|
|
2914
|
-
this.
|
|
2827
|
+
this.attachVideoToContainer();
|
|
2828
|
+
Logger.info(`VideoService.create(): <video id="${video.id}"> created | inDom=${video.isConnected}`);
|
|
2915
2829
|
fromEvent(this.video, 'play')
|
|
2916
2830
|
.pipe(takeUntil$1(merge(this.disconnect$, this.destroy$)))
|
|
2917
2831
|
.subscribe(() => this.changeStatusMainVideoOnScene(true));
|
|
@@ -2927,32 +2841,11 @@ class VideoService extends SubService {
|
|
|
2927
2841
|
async playAudio(audio) {
|
|
2928
2842
|
try {
|
|
2929
2843
|
await audio.play();
|
|
2930
|
-
return;
|
|
2931
2844
|
}
|
|
2932
2845
|
catch {
|
|
2933
|
-
//
|
|
2934
|
-
|
|
2935
|
-
|
|
2936
|
-
await audio.play();
|
|
2937
|
-
}
|
|
2938
|
-
catch {
|
|
2939
|
-
/* ignore — caller may need another gesture */
|
|
2940
|
-
}
|
|
2941
|
-
finally {
|
|
2942
|
-
window.removeEventListener('pointerdown', resume, true);
|
|
2943
|
-
window.removeEventListener('keydown', resume, true);
|
|
2944
|
-
}
|
|
2945
|
-
};
|
|
2946
|
-
window.addEventListener('pointerdown', resume, {
|
|
2947
|
-
once: true,
|
|
2948
|
-
capture: true,
|
|
2949
|
-
signal: this.destroyAbort.signal,
|
|
2950
|
-
});
|
|
2951
|
-
window.addEventListener('keydown', resume, {
|
|
2952
|
-
once: true,
|
|
2953
|
-
capture: true,
|
|
2954
|
-
signal: this.destroyAbort.signal,
|
|
2955
|
-
});
|
|
2846
|
+
// Any rejection here is treated as "needs a gesture": unlike video, audio
|
|
2847
|
+
// has no muted fallback left to try.
|
|
2848
|
+
this.armGestureRetry(audio);
|
|
2956
2849
|
}
|
|
2957
2850
|
}
|
|
2958
2851
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: VideoService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
@@ -2962,6 +2855,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
2962
2855
|
type: Injectable,
|
|
2963
2856
|
args: [{ providedIn: 'root' }]
|
|
2964
2857
|
}], ctorParameters: () => [] });
|
|
2858
|
+
/**
|
|
2859
|
+
* Keeps a per-session baseline once it has been pinned, otherwise starts it from
|
|
2860
|
+
* the current report. Mirrors the original `previous?.x ? previous.x : now`
|
|
2861
|
+
* chain — `0` counts as "not pinned yet", which is what the deltas below expect.
|
|
2862
|
+
*/
|
|
2863
|
+
function pinBaseline(pinned, current) {
|
|
2864
|
+
return (pinned || current);
|
|
2865
|
+
}
|
|
2866
|
+
/**
|
|
2867
|
+
* Whether a rejected `play()` was blocked by the browser autoplay policy.
|
|
2868
|
+
* Narrows an `unknown` rejection value without assuming it is an Error — a
|
|
2869
|
+
* rejection with a non-object value must NOT be mistaken for an autoplay block,
|
|
2870
|
+
* or it would trigger a pointless muted/gesture retry cycle.
|
|
2871
|
+
*/
|
|
2872
|
+
function isAutoplayBlocked(error) {
|
|
2873
|
+
return (!!error &&
|
|
2874
|
+
typeof error === 'object' &&
|
|
2875
|
+
'name' in error &&
|
|
2876
|
+
error.name === 'NotAllowedError');
|
|
2877
|
+
}
|
|
2965
2878
|
|
|
2966
2879
|
class WebRtcPlayerService extends SubService {
|
|
2967
2880
|
constructor() {
|
|
@@ -3924,11 +3837,11 @@ class UnrealErrorModalComponent {
|
|
|
3924
3837
|
this.#dialogRef.close();
|
|
3925
3838
|
}
|
|
3926
3839
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: UnrealErrorModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3927
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.8", type: UnrealErrorModalComponent, isStandalone: true, selector: "app-unreal-error-modal", ngImport: i0, template: "<div class=\"src-modal src-modal--small\">\
|
|
3840
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.8", type: UnrealErrorModalComponent, isStandalone: true, selector: "app-unreal-error-modal", ngImport: i0, template: "<div class=\"src-modal src-modal--small\">\n <header class=\"src-modal__header\">\n <div\n [attr.data-testid]=\"'unreal-error-header-title'\"\n class=\"src-modal__title\"\n >\n Warning\n </div>\n </header>\n <div class=\"src-modal__body\">\n <div>{{ dialogData.content }}</div>\n </div>\n <div class=\"src-modal__footer\">\n <src-button (onClick)=\"close()\">Ok</src-button>\n </div>\n</div>\n", styles: [".src-modal__header{padding:16px 24px 0}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3928
3841
|
}
|
|
3929
3842
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: UnrealErrorModalComponent, decorators: [{
|
|
3930
3843
|
type: Component,
|
|
3931
|
-
args: [{ selector: 'app-unreal-error-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "<div class=\"src-modal src-modal--small\">\
|
|
3844
|
+
args: [{ selector: 'app-unreal-error-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "<div class=\"src-modal src-modal--small\">\n <header class=\"src-modal__header\">\n <div\n [attr.data-testid]=\"'unreal-error-header-title'\"\n class=\"src-modal__title\"\n >\n Warning\n </div>\n </header>\n <div class=\"src-modal__body\">\n <div>{{ dialogData.content }}</div>\n </div>\n <div class=\"src-modal__footer\">\n <src-button (onClick)=\"close()\">Ok</src-button>\n </div>\n</div>\n", styles: [".src-modal__header{padding:16px 24px 0}\n"] }]
|
|
3932
3845
|
}] });
|
|
3933
3846
|
|
|
3934
3847
|
class UnrealEffects {
|
|
@@ -5900,14 +5813,14 @@ class StreamStatusTelemetryService2 {
|
|
|
5900
5813
|
const existing = localStorage.getItem(USER_ID_STORAGE_KEY);
|
|
5901
5814
|
if (existing && existing.length > 0)
|
|
5902
5815
|
return existing;
|
|
5903
|
-
const fresh =
|
|
5816
|
+
const fresh = generateUuid();
|
|
5904
5817
|
localStorage.setItem(USER_ID_STORAGE_KEY, fresh);
|
|
5905
5818
|
return fresh;
|
|
5906
5819
|
}
|
|
5907
5820
|
catch {
|
|
5908
5821
|
// localStorage disabled (private-mode restrictions, quota, etc.)
|
|
5909
5822
|
// Fall back to a per-tab ephemeral id so telemetry keeps working.
|
|
5910
|
-
return
|
|
5823
|
+
return generateUuid();
|
|
5911
5824
|
}
|
|
5912
5825
|
}
|
|
5913
5826
|
init() {
|
|
@@ -5960,7 +5873,7 @@ class StreamStatusTelemetryService2 {
|
|
|
5960
5873
|
startSession() {
|
|
5961
5874
|
// If a previous session is still active, close it first.
|
|
5962
5875
|
this.endSession('restart');
|
|
5963
|
-
const id =
|
|
5876
|
+
const id = generateUuid();
|
|
5964
5877
|
const startedAt = Date.now();
|
|
5965
5878
|
const startedAtPerf = performance.now();
|
|
5966
5879
|
const sub = new Subscription();
|
|
@@ -7166,11 +7079,11 @@ class AfkTimeoutModalComponent {
|
|
|
7166
7079
|
this.#afkService.reset();
|
|
7167
7080
|
}
|
|
7168
7081
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AfkTimeoutModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7169
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AfkTimeoutModalComponent, isStandalone: true, selector: "app-afk-timeout-modal", ngImport: i0, template: "@if (isShowAfkPopup()) {\
|
|
7082
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AfkTimeoutModalComponent, isStandalone: true, selector: "app-afk-timeout-modal", ngImport: i0, template: "@if (isShowAfkPopup()) {\n <div (click)=\"resetAfk()\" class=\"clickableState\" id=\"videoPlayOverlay\">\n <div class=\"resume-box\">\n <div aria-hidden=\"true\" class=\"resume-box__pic\" role=\"presentation\">\n <div [innerHTML]=\"afkCountdown()\" class=\"text-number\"></div>\n </div>\n <div class=\"resume-box__text\">\n <h3 class=\"resume-box__heading\">Session will time out soon</h3>\n <p>\n No activity detected. Press 'Continue' if you wish to keep your\n session active\n </p>\n </div>\n <src-button\n [isFullWidth]=\"true\"\n [data-testid]=\"'continue-session'\"\n weight=\"primary\"\n size=\"lg\"\n >\n Continue\n </src-button>\n </div>\n </div>\n}\n", styles: ["#videoPlayOverlay{position:absolute;z-index:30;top:0;width:100%;height:100%;font-size:1.8em;font-family:var(--src-font-family-body);background-color:#646464b3}.clickableState{display:flex;justify-content:center;align-items:center;cursor:pointer}.textDisplayState{display:flex}.hiddenState{display:none}.resume-box{width:340px;padding:32px 20px 20px;flex-direction:column;align-items:center;border-radius:var(--src-border-rounded-parent, 8px);background:var(--src-surface-container-main, #fff);box-shadow:0 26px 80px #0003,0 0 1px #0003}.resume-box .resume-box__pic{width:72px;height:72px;margin:0 auto 22px;border-radius:48px;background:#ecf0f2;padding:12px;display:flex;align-items:center;justify-content:center}.resume-box .resume-box__pic .text-number{color:var(--src-colors-text-default, #1f2937);text-align:center;font-family:var(--src-font-family-body);font-size:30px;font-style:normal;font-weight:400;line-height:24px}.resume-box__text{margin-bottom:18px}.resume-box__text p{text-align:center;font-family:var(--src-font-family-body);font-size:var(--src-font-size-sm, 14px);font-style:normal;font-weight:400;line-height:24px;color:var(--src-text-body-secondary, #6b7280)}.resume-box__text .resume-box__heading{color:var(--src-text-body-main, #1f2937);text-align:center;font-family:var(--src-font-family-body);font-size:18px;font-style:normal;font-weight:500;line-height:26px;margin-bottom:8px}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7170
7083
|
}
|
|
7171
7084
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AfkTimeoutModalComponent, decorators: [{
|
|
7172
7085
|
type: Component,
|
|
7173
|
-
args: [{ selector: 'app-afk-timeout-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "@if (isShowAfkPopup()) {\
|
|
7086
|
+
args: [{ selector: 'app-afk-timeout-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "@if (isShowAfkPopup()) {\n <div (click)=\"resetAfk()\" class=\"clickableState\" id=\"videoPlayOverlay\">\n <div class=\"resume-box\">\n <div aria-hidden=\"true\" class=\"resume-box__pic\" role=\"presentation\">\n <div [innerHTML]=\"afkCountdown()\" class=\"text-number\"></div>\n </div>\n <div class=\"resume-box__text\">\n <h3 class=\"resume-box__heading\">Session will time out soon</h3>\n <p>\n No activity detected. Press 'Continue' if you wish to keep your\n session active\n </p>\n </div>\n <src-button\n [isFullWidth]=\"true\"\n [data-testid]=\"'continue-session'\"\n weight=\"primary\"\n size=\"lg\"\n >\n Continue\n </src-button>\n </div>\n </div>\n}\n", styles: ["#videoPlayOverlay{position:absolute;z-index:30;top:0;width:100%;height:100%;font-size:1.8em;font-family:var(--src-font-family-body);background-color:#646464b3}.clickableState{display:flex;justify-content:center;align-items:center;cursor:pointer}.textDisplayState{display:flex}.hiddenState{display:none}.resume-box{width:340px;padding:32px 20px 20px;flex-direction:column;align-items:center;border-radius:var(--src-border-rounded-parent, 8px);background:var(--src-surface-container-main, #fff);box-shadow:0 26px 80px #0003,0 0 1px #0003}.resume-box .resume-box__pic{width:72px;height:72px;margin:0 auto 22px;border-radius:48px;background:#ecf0f2;padding:12px;display:flex;align-items:center;justify-content:center}.resume-box .resume-box__pic .text-number{color:var(--src-colors-text-default, #1f2937);text-align:center;font-family:var(--src-font-family-body);font-size:30px;font-style:normal;font-weight:400;line-height:24px}.resume-box__text{margin-bottom:18px}.resume-box__text p{text-align:center;font-family:var(--src-font-family-body);font-size:var(--src-font-size-sm, 14px);font-style:normal;font-weight:400;line-height:24px;color:var(--src-text-body-secondary, #6b7280)}.resume-box__text .resume-box__heading{color:var(--src-text-body-main, #1f2937);text-align:center;font-family:var(--src-font-family-body);font-size:18px;font-style:normal;font-weight:500;line-height:26px;margin-bottom:8px}\n"] }]
|
|
7174
7087
|
}] });
|
|
7175
7088
|
|
|
7176
7089
|
class FreezeFrameComponent {
|
|
@@ -7181,62 +7094,11 @@ class FreezeFrameComponent {
|
|
|
7181
7094
|
}
|
|
7182
7095
|
#store;
|
|
7183
7096
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: FreezeFrameComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7184
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: FreezeFrameComponent, isStandalone: true, selector: "app-freeze-frame", ngImport: i0, template: "@let image = combinedFreeze();\
|
|
7097
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: FreezeFrameComponent, isStandalone: true, selector: "app-freeze-frame", ngImport: i0, template: "@let image = combinedFreeze();\n@let progress = freezeFrameProgressMessageFromVideo();\n\n<div class=\"freeze-images\">\n @if (image) {\n <img [src]=\"image\" class=\"videoStillImage\" alt=\"freezeFrameImage\" />\n }\n\n @if (progress) {\n <div class=\"progress-status\">\n {{ progress }}\n </div>\n }\n</div>\n", styles: [".freeze-images{pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%;z-index:1}.freeze-images .freezeFrameOverlay{top:0;left:0;width:100%;height:100%;position:absolute;object-fit:cover;object-position:center}.freeze-images .videoStillImage{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;object-fit:cover}.freeze-images .progress-status{position:absolute;top:50%;left:50%;z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:center;width:auto;height:auto;margin:0;padding:10px;background-color:#ffffffb3;border:1px solid grey;transform:translate(-50%,-50%)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7185
7098
|
}
|
|
7186
7099
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: FreezeFrameComponent, decorators: [{
|
|
7187
7100
|
type: Component,
|
|
7188
|
-
args: [{ selector: 'app-freeze-frame', changeDetection: ChangeDetectionStrategy.OnPush, template: "@let image = combinedFreeze();\
|
|
7189
|
-
}] });
|
|
7190
|
-
|
|
7191
|
-
class SafePipe {
|
|
7192
|
-
constructor() {
|
|
7193
|
-
this.sanitizer = inject(DomSanitizer);
|
|
7194
|
-
}
|
|
7195
|
-
transform(value, type) {
|
|
7196
|
-
if (!value) {
|
|
7197
|
-
return value;
|
|
7198
|
-
}
|
|
7199
|
-
const context = (() => {
|
|
7200
|
-
switch (type) {
|
|
7201
|
-
case 'html':
|
|
7202
|
-
return SecurityContext.HTML;
|
|
7203
|
-
case 'style':
|
|
7204
|
-
return SecurityContext.STYLE;
|
|
7205
|
-
case 'script':
|
|
7206
|
-
return SecurityContext.SCRIPT;
|
|
7207
|
-
case 'url':
|
|
7208
|
-
return SecurityContext.URL;
|
|
7209
|
-
case 'resourceUrl':
|
|
7210
|
-
return SecurityContext.RESOURCE_URL;
|
|
7211
|
-
default:
|
|
7212
|
-
throw new Error(`Invalid safe type specified: ${type}`);
|
|
7213
|
-
}
|
|
7214
|
-
})();
|
|
7215
|
-
// Preserve the published return type while returning Angular-sanitized
|
|
7216
|
-
// content instead of disabling framework security checks.
|
|
7217
|
-
return (this.sanitizer.sanitize(context, value) ?? '');
|
|
7218
|
-
}
|
|
7219
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SafePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
7220
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: SafePipe, isStandalone: true, name: "safe" }); }
|
|
7221
|
-
}
|
|
7222
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SafePipe, decorators: [{
|
|
7223
|
-
type: Pipe,
|
|
7224
|
-
args: [{
|
|
7225
|
-
name: 'safe',
|
|
7226
|
-
}]
|
|
7227
|
-
}] });
|
|
7228
|
-
|
|
7229
|
-
class LowBandwidthModalComponent {
|
|
7230
|
-
#dialogRef = inject(DialogRef);
|
|
7231
|
-
close(value) {
|
|
7232
|
-
this.#dialogRef.close(value || false);
|
|
7233
|
-
}
|
|
7234
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: LowBandwidthModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7235
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.8", type: LowBandwidthModalComponent, isStandalone: true, selector: "app-low-bandwidth-modal", ngImport: i0, template: "<div [attr.data-testid]=\"'low-bandwidth'\" class=\"src-modal src-modal--lbm\">\r\n <header class=\"src-modal__header\">\r\n <h6 [attr.data-testid]=\"'title'\" class=\"src-modal__title\">\r\n Unstable Connection\r\n </h6>\r\n </header>\r\n <section class=\"src-modal__body\">\r\n <div\r\n [innerHtml]=\"\r\n 'Fluid Interactivity Modes were disabled due to an unstable connection. Showcase Gallery Mode is enabled. To regain full functionality, switch to Interactive Mode.'\r\n | safe: 'html'\r\n \"\r\n class=\"src-modal__scroll-box\"\r\n ></div>\r\n </section>\r\n <footer class=\"src-modal__footer\">\r\n <div class=\"src-modal__buttons\">\r\n <src-button\r\n (onClick)=\"close(true)\"\r\n [data-testid]=\"'switch-to-interactive-mode'\"\r\n >\r\n Switch\r\n </src-button>\r\n\r\n <src-button\r\n (onClick)=\"close()\"\r\n [data-testid]=\"'close-lbm-modal'\"\r\n weight=\"primary\"\r\n >\r\n Ok\r\n </src-button>\r\n </div>\r\n </footer>\r\n</div>\r\n", styles: [".src-modal--lbm{width:360px}.src-modal--lbm .src-modal__body{font-size:14px;line-height:24px}.src-modal--lbm .src-modal__buttons{display:flex;gap:8px}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }, { kind: "pipe", type: SafePipe, name: "safe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7236
|
-
}
|
|
7237
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: LowBandwidthModalComponent, decorators: [{
|
|
7238
|
-
type: Component,
|
|
7239
|
-
args: [{ selector: 'app-low-bandwidth-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SafePipe, SourceButtonComponent], template: "<div [attr.data-testid]=\"'low-bandwidth'\" class=\"src-modal src-modal--lbm\">\r\n <header class=\"src-modal__header\">\r\n <h6 [attr.data-testid]=\"'title'\" class=\"src-modal__title\">\r\n Unstable Connection\r\n </h6>\r\n </header>\r\n <section class=\"src-modal__body\">\r\n <div\r\n [innerHtml]=\"\r\n 'Fluid Interactivity Modes were disabled due to an unstable connection. Showcase Gallery Mode is enabled. To regain full functionality, switch to Interactive Mode.'\r\n | safe: 'html'\r\n \"\r\n class=\"src-modal__scroll-box\"\r\n ></div>\r\n </section>\r\n <footer class=\"src-modal__footer\">\r\n <div class=\"src-modal__buttons\">\r\n <src-button\r\n (onClick)=\"close(true)\"\r\n [data-testid]=\"'switch-to-interactive-mode'\"\r\n >\r\n Switch\r\n </src-button>\r\n\r\n <src-button\r\n (onClick)=\"close()\"\r\n [data-testid]=\"'close-lbm-modal'\"\r\n weight=\"primary\"\r\n >\r\n Ok\r\n </src-button>\r\n </div>\r\n </footer>\r\n</div>\r\n", styles: [".src-modal--lbm{width:360px}.src-modal--lbm .src-modal__body{font-size:14px;line-height:24px}.src-modal--lbm .src-modal__buttons{display:flex;gap:8px}\n"] }]
|
|
7101
|
+
args: [{ selector: 'app-freeze-frame', changeDetection: ChangeDetectionStrategy.OnPush, template: "@let image = combinedFreeze();\n@let progress = freezeFrameProgressMessageFromVideo();\n\n<div class=\"freeze-images\">\n @if (image) {\n <img [src]=\"image\" class=\"videoStillImage\" alt=\"freezeFrameImage\" />\n }\n\n @if (progress) {\n <div class=\"progress-status\">\n {{ progress }}\n </div>\n }\n</div>\n", styles: [".freeze-images{pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%;z-index:1}.freeze-images .freezeFrameOverlay{top:0;left:0;width:100%;height:100%;position:absolute;object-fit:cover;object-position:center}.freeze-images .videoStillImage{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;object-fit:cover}.freeze-images .progress-status{position:absolute;top:50%;left:50%;z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:center;width:auto;height:auto;margin:0;padding:10px;background-color:#ffffffb3;border:1px solid grey;transform:translate(-50%,-50%)}\n"] }]
|
|
7240
7102
|
}] });
|
|
7241
7103
|
|
|
7242
7104
|
class ImageLoadingSrcComponent {
|
|
@@ -7250,11 +7112,11 @@ class ImageLoadingSrcComponent {
|
|
|
7250
7112
|
this.#store.dispatch(setLoadingImageSrc({ src: '' }));
|
|
7251
7113
|
}
|
|
7252
7114
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: ImageLoadingSrcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7253
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: ImageLoadingSrcComponent, isStandalone: true, selector: "app-image-loading-src", ngImport: i0, template: "@let image = imageLoadingSrc();\
|
|
7115
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: ImageLoadingSrcComponent, isStandalone: true, selector: "app-image-loading-src", ngImport: i0, template: "@let image = imageLoadingSrc();\n@if (isLoaderScreenVisible()) {\n <div class=\"preload\">\n <div class=\"back\">\n @if (image) {\n <img\n (error)=\"loadingImageError()\"\n [ngSrc]=\"image\"\n fill\n loading=\"lazy\"\n alt=\"image loading src\"\n />\n }\n </div>\n </div>\n}\n", styles: [".preload{position:absolute;top:0;left:0;width:100%;height:100%;text-align:center}.preload .back{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%}.preload .back img{width:100%;height:100%;object-fit:cover}.preload .back{background-color:#fff}\n"], dependencies: [{ kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7254
7116
|
}
|
|
7255
7117
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: ImageLoadingSrcComponent, decorators: [{
|
|
7256
7118
|
type: Component,
|
|
7257
|
-
args: [{ selector: 'app-image-loading-src', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgOptimizedImage], template: "@let image = imageLoadingSrc();\
|
|
7119
|
+
args: [{ selector: 'app-image-loading-src', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgOptimizedImage], template: "@let image = imageLoadingSrc();\n@if (isLoaderScreenVisible()) {\n <div class=\"preload\">\n <div class=\"back\">\n @if (image) {\n <img\n (error)=\"loadingImageError()\"\n [ngSrc]=\"image\"\n fill\n loading=\"lazy\"\n alt=\"image loading src\"\n />\n }\n </div>\n </div>\n}\n", styles: [".preload{position:absolute;top:0;left:0;width:100%;height:100%;text-align:center}.preload .back{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%}.preload .back img{width:100%;height:100%;object-fit:cover}.preload .back{background-color:#fff}\n"] }]
|
|
7258
7120
|
}] });
|
|
7259
7121
|
|
|
7260
7122
|
class StatGraphComponent {
|
|
@@ -7336,11 +7198,11 @@ class StatGraphComponent {
|
|
|
7336
7198
|
this.draw();
|
|
7337
7199
|
}
|
|
7338
7200
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: StatGraphComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7339
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.8", type: StatGraphComponent, isStandalone: true, selector: "app-stat-graph", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, stat: { classPropertyName: "stat", publicName: "stat", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, tickStep: { classPropertyName: "tickStep", publicName: "tickStep", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "resize()" } }, viewQueries: [{ propertyName: "graph", first: true, predicate: ["graph"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"content\">\
|
|
7201
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.8", type: StatGraphComponent, isStandalone: true, selector: "app-stat-graph", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, stat: { classPropertyName: "stat", publicName: "stat", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, tickStep: { classPropertyName: "tickStep", publicName: "tickStep", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "resize()" } }, viewQueries: [{ propertyName: "graph", first: true, predicate: ["graph"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"content\">\n <p>{{ label() }}: {{ current() }} | Min:{{ min() }} | Max:{{ max() }}</p>\n <canvas #graph class=\"graph\"></canvas>\n</div>\n", styles: [".content{width:100%;height:100%}.content p{color:#fff;margin:5px 0 0;height:25px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7340
7202
|
}
|
|
7341
7203
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: StatGraphComponent, decorators: [{
|
|
7342
7204
|
type: Component,
|
|
7343
|
-
args: [{ selector: 'app-stat-graph', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"content\">\
|
|
7205
|
+
args: [{ selector: 'app-stat-graph', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"content\">\n <p>{{ label() }}: {{ current() }} | Min:{{ min() }} | Max:{{ max() }}</p>\n <canvas #graph class=\"graph\"></canvas>\n</div>\n", styles: [".content{width:100%;height:100%}.content p{color:#fff;margin:5px 0 0;height:25px}\n"] }]
|
|
7344
7206
|
}], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], stat: [{ type: i0.Input, args: [{ isSignal: true, alias: "stat", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], tickStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "tickStep", required: false }] }], graph: [{ type: i0.ViewChild, args: ['graph', { isSignal: true }] }], resize: [{
|
|
7345
7207
|
type: HostListener,
|
|
7346
7208
|
args: ['window:resize']
|
|
@@ -7360,11 +7222,49 @@ class UnrealStatusComponent {
|
|
|
7360
7222
|
#store;
|
|
7361
7223
|
#loadingProgress;
|
|
7362
7224
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: UnrealStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7363
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: UnrealStatusComponent, isStandalone: true, selector: "app-unreal-status", ngImport: i0, template: "@if (isShowLoadingPercentsPopup()) {\
|
|
7225
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: UnrealStatusComponent, isStandalone: true, selector: "app-unreal-status", ngImport: i0, template: "@if (isShowLoadingPercentsPopup()) {\n @let _awsInstance = awsInstance();\n <div class=\"status-box\">\n @if (_awsInstance?.message) {\n <p>{{ _awsInstance?.message }}</p>\n } @else {\n <div class=\"status-box__message\">\n <src-loading\n [size]=\"30\"\n [backgroundStrokeColor]=\"'#E5E7EB'\"\n [progressStrokeColor]=\"'#1F2937'\"\n />\n {{ smoothPercents() }}%\n </div>\n }\n </div>\n}\n", styles: ["app-stat-graph{height:30px;width:100%}.status-box{position:absolute;top:80%;left:50%;transform:translate(-50%,-50%);z-index:5;display:flex;justify-content:center;align-items:center;width:auto;max-width:500px;margin:0;background:var(--src-surface-container-main, #fff);border:none;border-radius:var(--src-border-rounded-full, 9999px);box-shadow:0 8px 20px #1718181f,0 3px 6px #17181814;pointer-events:none}.status-box p{padding:10px 15px;margin:0;text-align:center}.status-box__message{display:flex;align-items:center;padding:12px 20px 12px 16px;color:var(--src-text-body-main, #1f2937);font-size:16px;font-weight:400;line-height:24px}.status-box__message .status-box__message_text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.status-box__message src-loading{margin-right:12px}\n"], dependencies: [{ kind: "component", type: SourceLoadingComponent, selector: "src-loading", inputs: ["size", "progress", "lineCap", "backgroundStrokeColor", "progressStrokeColor", "strokeWidth", "data-testid", "role", "ariaLabel", "ariaValueNow", "ariaValueMin", "ariaValueMax"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7364
7226
|
}
|
|
7365
7227
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: UnrealStatusComponent, decorators: [{
|
|
7366
7228
|
type: Component,
|
|
7367
|
-
args: [{ selector: 'app-unreal-status', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceLoadingComponent], template: "@if (isShowLoadingPercentsPopup()) {\
|
|
7229
|
+
args: [{ selector: 'app-unreal-status', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceLoadingComponent], template: "@if (isShowLoadingPercentsPopup()) {\n @let _awsInstance = awsInstance();\n <div class=\"status-box\">\n @if (_awsInstance?.message) {\n <p>{{ _awsInstance?.message }}</p>\n } @else {\n <div class=\"status-box__message\">\n <src-loading\n [size]=\"30\"\n [backgroundStrokeColor]=\"'#E5E7EB'\"\n [progressStrokeColor]=\"'#1F2937'\"\n />\n {{ smoothPercents() }}%\n </div>\n }\n </div>\n}\n", styles: ["app-stat-graph{height:30px;width:100%}.status-box{position:absolute;top:80%;left:50%;transform:translate(-50%,-50%);z-index:5;display:flex;justify-content:center;align-items:center;width:auto;max-width:500px;margin:0;background:var(--src-surface-container-main, #fff);border:none;border-radius:var(--src-border-rounded-full, 9999px);box-shadow:0 8px 20px #1718181f,0 3px 6px #17181814;pointer-events:none}.status-box p{padding:10px 15px;margin:0;text-align:center}.status-box__message{display:flex;align-items:center;padding:12px 20px 12px 16px;color:var(--src-text-body-main, #1f2937);font-size:16px;font-weight:400;line-height:24px}.status-box__message .status-box__message_text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.status-box__message src-loading{margin-right:12px}\n"] }]
|
|
7230
|
+
}] });
|
|
7231
|
+
|
|
7232
|
+
class SafePipe {
|
|
7233
|
+
constructor() {
|
|
7234
|
+
this.sanitizer = inject(DomSanitizer);
|
|
7235
|
+
}
|
|
7236
|
+
transform(value, type) {
|
|
7237
|
+
if (!value) {
|
|
7238
|
+
return value;
|
|
7239
|
+
}
|
|
7240
|
+
const context = (() => {
|
|
7241
|
+
switch (type) {
|
|
7242
|
+
case 'html':
|
|
7243
|
+
return SecurityContext.HTML;
|
|
7244
|
+
case 'style':
|
|
7245
|
+
return SecurityContext.STYLE;
|
|
7246
|
+
case 'script':
|
|
7247
|
+
return SecurityContext.SCRIPT;
|
|
7248
|
+
case 'url':
|
|
7249
|
+
return SecurityContext.URL;
|
|
7250
|
+
case 'resourceUrl':
|
|
7251
|
+
return SecurityContext.RESOURCE_URL;
|
|
7252
|
+
default:
|
|
7253
|
+
throw new Error(`Invalid safe type specified: ${type}`);
|
|
7254
|
+
}
|
|
7255
|
+
})();
|
|
7256
|
+
// Preserve the published return type while returning Angular-sanitized
|
|
7257
|
+
// content instead of disabling framework security checks.
|
|
7258
|
+
return (this.sanitizer.sanitize(context, value) ?? '');
|
|
7259
|
+
}
|
|
7260
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SafePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
7261
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: SafePipe, isStandalone: true, name: "safe" }); }
|
|
7262
|
+
}
|
|
7263
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: SafePipe, decorators: [{
|
|
7264
|
+
type: Pipe,
|
|
7265
|
+
args: [{
|
|
7266
|
+
name: 'safe',
|
|
7267
|
+
}]
|
|
7368
7268
|
}] });
|
|
7369
7269
|
|
|
7370
7270
|
class VideoStatsComponent {
|
|
@@ -7404,8 +7304,6 @@ class VideoStatsComponent {
|
|
|
7404
7304
|
}, /* @ts-ignore */
|
|
7405
7305
|
...(ngDevMode ? [{ debugName: "videoStatus" }] : /* istanbul ignore next */ []));
|
|
7406
7306
|
this.fields = [
|
|
7407
|
-
'kalmanBitrate',
|
|
7408
|
-
'bitrateDrop',
|
|
7409
7307
|
'runTime',
|
|
7410
7308
|
'pixelRatio',
|
|
7411
7309
|
'frameHeight',
|
|
@@ -7476,11 +7374,11 @@ class VideoStatsComponent {
|
|
|
7476
7374
|
}));
|
|
7477
7375
|
}
|
|
7478
7376
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: VideoStatsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7479
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: VideoStatsComponent, isStandalone: true, selector: "app-video-stats", ngImport: i0, template: "@if (videoStatus() && viewportReady()) {\
|
|
7377
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: VideoStatsComponent, isStandalone: true, selector: "app-video-stats", ngImport: i0, template: "@if (videoStatus() && viewportReady()) {\n <div class=\"settings-container\">\n <button (click)=\"toggle()\" class=\"gear-button\">Stats</button>\n <div (click)=\"toggle()\" [class.min]=\"collapsed()\" id=\"aggregatedStats\">\n <div class=\"forNerds\">\n <div (click)=\"$event.stopPropagation()\" class=\"static\">\n <li>\n <app-stat-graph\n [stat]=\"fpsTick()!\"\n label=\"FPS (higher is better)\"\n />\n </li>\n <li>\n <app-stat-graph\n [stat]=\"videoQP()!\"\n label=\"QP (lower is better)\"\n color=\"#D5ff07\"\n />\n </li>\n <li>\n <app-stat-graph\n [stat]=\"bitrateTick()!\"\n label=\"Bitrate\"\n color=\"#D57F07\"\n />\n </li>\n </div>\n <div>\n @for (graph of graphList(); track graph.key) {\n <li (click)=\"toggleGraph($event, graph.key, 0)\" class=\"graph\">\n <app-stat-graph\n [label]=\"graph.key\"\n [stat]=\"graph.stat()\"\n [color]=\"graph.color\"\n />\n </li>\n }\n </div>\n </div>\n\n @for (el of videoStatus(); track el.key + $index) {\n <div (click)=\"toggleGraph($event, el.key, el.value)\" class=\"stat\">\n <span>{{ el.key }}: </span>{{ el.value | json }}\n </div>\n }\n </div>\n </div>\n @if (!collapsed()) {\n <div [innerHTML]=\"ssData() | safe: 'html'\" class=\"ssInfo\"></div>\n }\n}\n", styles: [".settings-container{position:absolute;top:65px;left:10px;z-index:1000;bottom:10px}.gear-button{left:0;width:50px;position:absolute;background:none;cursor:pointer;font-size:10px;font-weight:500;border:1px solid;border-radius:9px;background:#0162cc;color:#fff;padding:4px}.gear-button>*{color:#fff;filter:drop-shadow(1px 1px 1px rgb(0,0,0))}#aggregatedStats{max-height:calc(100% - 25px);overflow-y:auto;margin-top:25px;left:20px;z-index:31;max-width:400px;padding:10px;background-color:#fff3;border:1px solid grey}#aggregatedStats>*{color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#aggregatedStats:empty{display:none}#aggregatedStats button{position:absolute;right:5px;top:5px}#aggregatedStats.min{display:none}#aggregatedStats .forNerds{width:100%}#aggregatedStats .forNerds li{list-style-type:none;height:60px}#aggregatedStats .forNerds li app-stat-graph{display:block;width:100%;height:100%}#aggregatedStats .stat span{font-weight:700}#aggregatedStats .stat,#aggregatedStats .graph{cursor:pointer}#aggregatedStats .static{pointer-events:all}.ssInfo{position:absolute;top:0;left:50%;transform:translate(-50%);color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;text-align:center;width:80%;pointer-events:none}\n"], dependencies: [{ kind: "component", type: StatGraphComponent, selector: "app-stat-graph", inputs: ["label", "stat", "color", "tickStep"] }, { kind: "pipe", type: JsonPipe, name: "json" }, { kind: "pipe", type: SafePipe, name: "safe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7480
7378
|
}
|
|
7481
7379
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: VideoStatsComponent, decorators: [{
|
|
7482
7380
|
type: Component,
|
|
7483
|
-
args: [{ selector: 'app-video-stats', changeDetection: ChangeDetectionStrategy.OnPush, imports: [StatGraphComponent, JsonPipe, SafePipe], template: "@if (videoStatus() && viewportReady()) {\
|
|
7381
|
+
args: [{ selector: 'app-video-stats', changeDetection: ChangeDetectionStrategy.OnPush, imports: [StatGraphComponent, JsonPipe, SafePipe], template: "@if (videoStatus() && viewportReady()) {\n <div class=\"settings-container\">\n <button (click)=\"toggle()\" class=\"gear-button\">Stats</button>\n <div (click)=\"toggle()\" [class.min]=\"collapsed()\" id=\"aggregatedStats\">\n <div class=\"forNerds\">\n <div (click)=\"$event.stopPropagation()\" class=\"static\">\n <li>\n <app-stat-graph\n [stat]=\"fpsTick()!\"\n label=\"FPS (higher is better)\"\n />\n </li>\n <li>\n <app-stat-graph\n [stat]=\"videoQP()!\"\n label=\"QP (lower is better)\"\n color=\"#D5ff07\"\n />\n </li>\n <li>\n <app-stat-graph\n [stat]=\"bitrateTick()!\"\n label=\"Bitrate\"\n color=\"#D57F07\"\n />\n </li>\n </div>\n <div>\n @for (graph of graphList(); track graph.key) {\n <li (click)=\"toggleGraph($event, graph.key, 0)\" class=\"graph\">\n <app-stat-graph\n [label]=\"graph.key\"\n [stat]=\"graph.stat()\"\n [color]=\"graph.color\"\n />\n </li>\n }\n </div>\n </div>\n\n @for (el of videoStatus(); track el.key + $index) {\n <div (click)=\"toggleGraph($event, el.key, el.value)\" class=\"stat\">\n <span>{{ el.key }}: </span>{{ el.value | json }}\n </div>\n }\n </div>\n </div>\n @if (!collapsed()) {\n <div [innerHTML]=\"ssData() | safe: 'html'\" class=\"ssInfo\"></div>\n }\n}\n", styles: [".settings-container{position:absolute;top:65px;left:10px;z-index:1000;bottom:10px}.gear-button{left:0;width:50px;position:absolute;background:none;cursor:pointer;font-size:10px;font-weight:500;border:1px solid;border-radius:9px;background:#0162cc;color:#fff;padding:4px}.gear-button>*{color:#fff;filter:drop-shadow(1px 1px 1px rgb(0,0,0))}#aggregatedStats{max-height:calc(100% - 25px);overflow-y:auto;margin-top:25px;left:20px;z-index:31;max-width:400px;padding:10px;background-color:#fff3;border:1px solid grey}#aggregatedStats>*{color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#aggregatedStats:empty{display:none}#aggregatedStats button{position:absolute;right:5px;top:5px}#aggregatedStats.min{display:none}#aggregatedStats .forNerds{width:100%}#aggregatedStats .forNerds li{list-style-type:none;height:60px}#aggregatedStats .forNerds li app-stat-graph{display:block;width:100%;height:100%}#aggregatedStats .stat span{font-weight:700}#aggregatedStats .stat,#aggregatedStats .graph{cursor:pointer}#aggregatedStats .static{pointer-events:all}.ssInfo{position:absolute;top:0;left:50%;transform:translate(-50%);color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;text-align:center;width:80%;pointer-events:none}\n"] }]
|
|
7484
7382
|
}], ctorParameters: () => [] });
|
|
7485
7383
|
|
|
7486
7384
|
class ResumeStreamButtonComponent {
|
|
@@ -7523,11 +7421,11 @@ class ResumeStreamButtonComponent {
|
|
|
7523
7421
|
this.isSecondStart.set(true);
|
|
7524
7422
|
}
|
|
7525
7423
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: ResumeStreamButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7526
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: ResumeStreamButtonComponent, isStandalone: true, selector: "app-resume-stream-button", ngImport: i0, template: "@if (isShowResumeButton()) {\
|
|
7424
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: ResumeStreamButtonComponent, isStandalone: true, selector: "app-resume-stream-button", ngImport: i0, template: "@if (isShowResumeButton()) {\n <div class=\"resume-box\">\n @if (isSecondStart()) {\n <div class=\"resume-box__text\">\n Your stream {{ isAfkDisconnect() ? 'has been' : 'is' }} paused due to\n inactivity\n </div>\n }\n\n <src-button\n (onClick)=\"connect()\"\n [isFullWidth]=\"true\"\n [data-testid]=\"'connect-button'\"\n size=\"lg\"\n weight=\"primary\"\n class=\"connect-button\"\n >\n {{ isSecondStart() ? 'Resume' : 'Start' }}\n </src-button>\n </div>\n}\n", styles: [".resume-box{padding:16px;position:absolute;bottom:0;left:50%;gap:12px;z-index:6;display:flex;transform:translate(-50%,-50%);flex-direction:column;align-items:center;border-radius:var(--src-border-rounded-parent, 8px);background:var(--src-surface-container-main, #fff);box-shadow:0 26px 80px #0003,0 0 1px #0003}.resume-box .connect-button{width:100%}.resume-box .resume-box__text{color:var(--src-color-grey-500, #6b7280);text-align:center;font-family:var(--src-font-family-body);font-size:14px;font-style:normal;font-weight:400;line-height:24px}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7527
7425
|
}
|
|
7528
7426
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: ResumeStreamButtonComponent, decorators: [{
|
|
7529
7427
|
type: Component,
|
|
7530
|
-
args: [{ selector: 'app-resume-stream-button', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "@if (isShowResumeButton()) {\
|
|
7428
|
+
args: [{ selector: 'app-resume-stream-button', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "@if (isShowResumeButton()) {\n <div class=\"resume-box\">\n @if (isSecondStart()) {\n <div class=\"resume-box__text\">\n Your stream {{ isAfkDisconnect() ? 'has been' : 'is' }} paused due to\n inactivity\n </div>\n }\n\n <src-button\n (onClick)=\"connect()\"\n [isFullWidth]=\"true\"\n [data-testid]=\"'connect-button'\"\n size=\"lg\"\n weight=\"primary\"\n class=\"connect-button\"\n >\n {{ isSecondStart() ? 'Resume' : 'Start' }}\n </src-button>\n </div>\n}\n", styles: [".resume-box{padding:16px;position:absolute;bottom:0;left:50%;gap:12px;z-index:6;display:flex;transform:translate(-50%,-50%);flex-direction:column;align-items:center;border-radius:var(--src-border-rounded-parent, 8px);background:var(--src-surface-container-main, #fff);box-shadow:0 26px 80px #0003,0 0 1px #0003}.resume-box .connect-button{width:100%}.resume-box .resume-box__text{color:var(--src-color-grey-500, #6b7280);text-align:center;font-family:var(--src-font-family-body);font-size:14px;font-style:normal;font-weight:400;line-height:24px}\n"] }]
|
|
7531
7429
|
}], ctorParameters: () => [] });
|
|
7532
7430
|
|
|
7533
7431
|
class IntroSrcComponent {
|
|
@@ -7593,11 +7491,11 @@ class IntroSrcComponent {
|
|
|
7593
7491
|
videoContainer.appendChild(videoElement);
|
|
7594
7492
|
}
|
|
7595
7493
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: IntroSrcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7596
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: IntroSrcComponent, isStandalone: true, selector: "app-intro-src", viewQueries: [{ propertyName: "videoElement", first: true, predicate: ["videoPlayerCover"], descendants: true, isSignal: true }], ngImport: i0, template: "@let image = imageIntroSrc();\
|
|
7494
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: IntroSrcComponent, isStandalone: true, selector: "app-intro-src", viewQueries: [{ propertyName: "videoElement", first: true, predicate: ["videoPlayerCover"], descendants: true, isSignal: true }], ngImport: i0, template: "@let image = imageIntroSrc();\n@if (image) {\n <div class=\"backImage\">\n <img (error)=\"loadingImageError()\" [ngSrc]=\"image\" fill alt=\"imageSrc\" />\n </div>\n} @else if (videoIntroSrc()) {\n <div #videoPlayerCover class=\"backVideo\"></div>\n}\n", styles: [".backVideo{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.backVideo video{position:absolute;width:100%;height:100%;object-fit:cover}.backImage{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.backImage img{position:absolute;width:100%;height:100%;object-fit:cover}\n"], dependencies: [{ kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7597
7495
|
}
|
|
7598
7496
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: IntroSrcComponent, decorators: [{
|
|
7599
7497
|
type: Component,
|
|
7600
|
-
args: [{ selector: 'app-intro-src', imports: [NgOptimizedImage], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let image = imageIntroSrc();\
|
|
7498
|
+
args: [{ selector: 'app-intro-src', imports: [NgOptimizedImage], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let image = imageIntroSrc();\n@if (image) {\n <div class=\"backImage\">\n <img (error)=\"loadingImageError()\" [ngSrc]=\"image\" fill alt=\"imageSrc\" />\n </div>\n} @else if (videoIntroSrc()) {\n <div #videoPlayerCover class=\"backVideo\"></div>\n}\n", styles: [".backVideo{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.backVideo video{position:absolute;width:100%;height:100%;object-fit:cover}.backImage{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.backImage img{position:absolute;width:100%;height:100%;object-fit:cover}\n"] }]
|
|
7601
7499
|
}], ctorParameters: () => [], propDecorators: { videoElement: [{ type: i0.ViewChild, args: ['videoPlayerCover', { isSignal: true }] }] } });
|
|
7602
7500
|
|
|
7603
7501
|
class UnrealSceneComponent {
|
|
@@ -7666,6 +7564,12 @@ class UnrealSceneComponent {
|
|
|
7666
7564
|
// keeps the next 3D route's connect unblocked (connectToSignaling$ gates
|
|
7667
7565
|
// on `!cirrusConnected`).
|
|
7668
7566
|
this.#store.dispatch(destroyUnrealScene());
|
|
7567
|
+
// Drop the container reference last: `VideoService` is a root singleton
|
|
7568
|
+
// that outlives this scene, so keeping the old `#player` wired would hold
|
|
7569
|
+
// a detached subtree reachable and let a late `create()` attach the
|
|
7570
|
+
// <video> to DOM nobody can see. The dispatch above already ran the
|
|
7571
|
+
// teardown that removes the element itself.
|
|
7572
|
+
this.videoService.setContainer(null);
|
|
7669
7573
|
});
|
|
7670
7574
|
effect(() => {
|
|
7671
7575
|
const videoElement = this.videoElement();
|
|
@@ -7811,7 +7715,7 @@ class UnrealSceneComponent {
|
|
|
7811
7715
|
});
|
|
7812
7716
|
}
|
|
7813
7717
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: UnrealSceneComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7814
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: UnrealSceneComponent, isStandalone: true, selector: "app-unreal-scene", inputs: { useContainerAsSizeProvider: { classPropertyName: "useContainerAsSizeProvider", publicName: "useContainerAsSizeProvider", isSignal: true, isRequired: false, transformFunction: null }, isStudio: { classPropertyName: "isStudio", publicName: "isStudio", isSignal: true, isRequired: false, transformFunction: null }, resolutionSize: { classPropertyName: "resolutionSize", publicName: "resolutionSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeMouseOverScene: "changeMouseOverScene" }, host: { listeners: { "mouseover": "onMouseOver()", "mouseout": "onMouseOut()", "contextmenu": "onContextMenu($event)" } }, viewQueries: [{ propertyName: "videoElement", first: true, predicate: ["videoContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"frame unreal-container\">\r\n <div #videoContainer id=\"player\"></div>\r\n\r\n <app-intro-src />\r\n <app-image-loading-src />\r\n <app-resume-stream-button />\r\n <app-unreal-status />\r\n <app-freeze-frame />\r\n <app-afk-timeout-modal />\r\n\r\n <ng-content select=\"app-pdf\"></ng-content>\r\n <ng-content select=\"app-show-case\"></ng-content>\r\n\r\n @if (isDevMode) {\r\n <app-video-stats />\r\n }\r\n</div>\r\n", styles: [".unreal-container{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#fff}.unreal-container #player{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center;overflow:hidden}.unreal-container.select{cursor:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M15.15 21.375a1.423 1.423 0 0 1-1.15.063 1.487 1.487 0 0 1-.85-.788l-3-6.45-2.325 3.25c-.283.4-.658.525-1.125.375-.467-.15-.7-.466-.7-.95V4.05c0-.417.188-.717.563-.9.375-.183.729-.142 1.062.125l10.1 7.95c.383.284.496.65.337 1.1-.158.45-.479.675-.962.675h-4.2l2.975 6.375c.183.384.204.767.063 1.15a1.487 1.487 0 0 1-.788.85Z\" fill=\"%23000\"/><path d=\"m12.697 20.861.002.005c.237.495.617.852 1.128 1.04.515.191 1.039.16 1.539-.08a1.987 1.987 0 0 0 1.04-1.128 1.922 1.922 0 0 0-.079-1.536v-.003L13.684 13.5H17.1c.32 0 .628-.075.89-.26.263-.184.438-.447.544-.749.106-.3.135-.617.04-.925a1.458 1.458 0 0 0-.545-.738L7.936 2.883a1.51 1.51 0 0 0-.768-.336 1.471 1.471 0 0 0-.825.154 1.495 1.495 0 0 0-.626.547 1.492 1.492 0 0 0-.217.802v12.825c0 .324.08.634.272.897.193.261.467.43.775.53.31.099.632.12.942.016.31-.103.555-.313.743-.578h.001l1.825-2.552 2.639 5.673Z\" stroke=\"%23fff\" stroke-opacity=\".7\"/></svg>') 6 2,auto}.unreal-container.orbit{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.998 21.6c-1.966 0-3.737-.53-5.312-1.588-1.575-1.058-2.738-2.437-3.488-4.137a.852.852 0 0 1 .013-.713.867.867 0 0 1 .512-.487.86.86 0 0 1 .688.037c.225.109.387.28.487.513.617 1.35 1.559 2.45 2.825 3.3 1.267.85 2.692 1.275 4.275 1.275 1.384 0 2.646-.33 3.788-.988a7.985 7.985 0 0 0 2.762-2.612h-.85a.873.873 0 0 1-.64-.257.863.863 0 0 1-.26-.638.88.88 0 0 1 .26-.643.864.864 0 0 1 .64-.262h3c.255 0 .47.086.642.259a.87.87 0 0 1 .258.64v3a.874.874 0 0 1-.257.642.863.863 0 0 1-.637.259.88.88 0 0 1-.643-.259.865.865 0 0 1-.263-.641v-.725a9.95 9.95 0 0 1-3.35 2.925c-1.35.733-2.833 1.1-4.45 1.1Zm0-17.4c-1.383 0-2.645.33-3.787.987A7.985 7.985 0 0 0 5.448 7.8h.85c.255 0 .47.086.642.257a.863.863 0 0 1 .258.638.88.88 0 0 1-.258.642.864.864 0 0 1-.642.263h-3a.87.87 0 0 1-.64-.259.87.87 0 0 1-.26-.641v-3c0-.255.086-.469.258-.641a.863.863 0 0 1 .637-.26.88.88 0 0 1 .643.26.864.864 0 0 1 .262.64v.726A9.95 9.95 0 0 1 7.548 3.5c1.35-.733 2.834-1.1 4.45-1.1 2 0 3.788.542 5.363 1.625 1.575 1.083 2.736 2.49 3.482 4.22a.724.724 0 0 1-.045.646.926.926 0 0 1-.525.437.87.87 0 0 1-.687-.04.977.977 0 0 1-.488-.513c-.616-1.35-1.558-2.45-2.825-3.3-1.266-.85-2.691-1.275-4.275-1.275Zm0 10.8a2.893 2.893 0 0 1-2.125-.875A2.893 2.893 0 0 1 8.998 12c0-.833.292-1.542.875-2.125A2.893 2.893 0 0 1 11.998 9c.834 0 1.542.292 2.125.875.584.583.875 1.292.875 2.125s-.291 1.542-.875 2.125a2.893 2.893 0 0 1-2.125.875Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"m2.739 16.072.002.005c.789 1.788 2.014 3.24 3.666 4.35 1.66 1.116 3.53 1.673 5.591 1.673 1.696 0 3.262-.386 4.69-1.16a10.54 10.54 0 0 0 2.714-2.097c.069.167.171.32.308.454.272.268.613.403.994.403.38 0 .722-.135.992-.406s.402-.614.402-.994v-3c0-.381-.134-.724-.405-.995a1.37 1.37 0 0 0-.995-.405h-3c-.383 0-.727.137-.997.411a1.38 1.38 0 0 0-.403.994c0 .38.135.723.407.992.238.237.532.369.858.397a7.552 7.552 0 0 1-2.027 1.685c-1.062.613-2.237.92-3.538.92-1.488 0-2.815-.397-3.996-1.19-1.19-.798-2.07-1.826-2.647-3.087-.147-.34-.393-.6-.727-.76a1.36 1.36 0 0 0-1.073-.058c-.37.133-.64.397-.8.754a1.351 1.351 0 0 0-.016 1.114Zm4.553-8.37a1.36 1.36 0 0 0-.858-.396A7.552 7.552 0 0 1 8.46 5.62c1.062-.613 2.237-.921 3.537-.921 1.489 0 2.816.398 3.997 1.19 1.19.8 2.07 1.827 2.646 3.088.148.34.394.6.728.76a1.37 1.37 0 0 0 1.068.063c.347-.12.62-.346.799-.668.187-.338.215-.71.072-1.072l-.003-.007-.003-.007c-.784-1.818-2.006-3.298-3.658-4.434C15.982 2.47 14.094 1.9 11.998 1.9c-1.695 0-3.261.385-4.688 1.16a10.536 10.536 0 0 0-2.715 2.096 1.364 1.364 0 0 0-.308-.453 1.38 1.38 0 0 0-.994-.403c-.38 0-.722.135-.992.406s-.403.614-.403.994v3c0 .38.135.724.406.995.27.27.614.405.994.405h3c.384 0 .727-.137.998-.412a1.38 1.38 0 0 0 .402-.993c0-.38-.135-.723-.406-.992ZM9.52 14.48a3.393 3.393 0 0 0 2.478 1.02c.965 0 1.8-.342 2.479-1.02a3.392 3.392 0 0 0 1.021-2.48c0-.963-.343-1.8-1.021-2.478A3.392 3.392 0 0 0 11.998 8.5c-.964 0-1.8.343-2.478 1.021A3.392 3.392 0 0 0 8.498 12c0 .964.344 1.8 1.022 2.479Z\"/></svg>') 12 12,auto}.unreal-container.pan{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.997 10.075a1.01 1.01 0 0 1-.738-.313 1.008 1.008 0 0 1-.312-.737V6.15l-.95.95a.998.998 0 0 1-.763.312 1.09 1.09 0 0 1-.763-.337 1.06 1.06 0 0 1-.324-.775c0-.3.108-.558.324-.775l2.776-2.775c.117-.116.237-.2.362-.25a1.04 1.04 0 0 1 .775 0c.125.05.246.134.363.25l2.8 2.8c.216.217.32.47.313.762a1.096 1.096 0 0 1-.338.763 1.058 1.058 0 0 1-.775.325c-.3 0-.558-.108-.775-.325l-.925-.925v2.875c0 .283-.104.53-.312.737a1.01 1.01 0 0 1-.738.313Zm0 11.5a1.04 1.04 0 0 1-.388-.075 1.103 1.103 0 0 1-.362-.25l-2.8-2.8a1.002 1.002 0 0 1-.313-.762c.009-.292.121-.546.337-.763.217-.217.475-.325.775-.325.3 0 .559.108.775.325l.926.925v-2.875c0-.283.104-.529.312-.737a1.01 1.01 0 0 1 .738-.313c.283 0 .529.104.738.313.208.208.312.454.312.737v2.875l.95-.95a.998.998 0 0 1 .762-.312c.292.008.546.12.763.337.216.217.324.475.324.775 0 .3-.108.559-.324.775l-2.775 2.775c-.117.116-.238.2-.363.25a1.04 1.04 0 0 1-.387.075Zm4.925-6.05a1.058 1.058 0 0 1-.326-.774c0-.3.109-.559.326-.776l.925-.925H14.97c-.283 0-.528-.104-.736-.312a1.01 1.01 0 0 1-.313-.738c0-.283.104-.53.313-.738.208-.208.453-.312.737-.312h2.875l-.95-.95a.998.998 0 0 1-.313-.762 1.09 1.09 0 0 1 .338-.764 1.06 1.06 0 0 1 .775-.324c.3 0 .558.108.775.324l2.774 2.776c.117.117.2.238.251.363a1.04 1.04 0 0 1 0 .775c-.05.124-.134.245-.25.362l-2.8 2.8c-.217.216-.471.32-.762.313a1.096 1.096 0 0 1-.763-.337Zm-11.4 0L2.746 12.75a1.103 1.103 0 0 1-.25-.362 1.04 1.04 0 0 1 0-.775c.05-.125.133-.246.25-.363l2.8-2.8c.216-.216.47-.32.762-.313.292.01.546.121.763.337.217.217.325.476.325.776 0 .3-.108.558-.325.775l-.925.925h2.875c.283 0 .529.104.737.312.208.209.313.455.313.738s-.105.53-.313.738a1.008 1.008 0 0 1-.737.312H6.147l.95.95c.217.217.32.471.312.762a1.09 1.09 0 0 1-.337.764 1.06 1.06 0 0 1-.775.324c-.3 0-.559-.108-.776-.324Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M9.22 7.912c.436.013.821-.15 1.13-.458l.097-.097v1.668c0 .422.16.793.458 1.09.298.299.67.46 1.092.46.422 0 .793-.161 1.091-.46.298-.297.459-.668.459-1.09V7.357l.071.072c.309.308.693.471 1.13.471.435 0 .82-.163 1.128-.471.301-.303.47-.676.483-1.102v-.001a1.501 1.501 0 0 0-.46-1.13l-2.799-2.8a1.6 1.6 0 0 0-.528-.36l-.003-.001a1.54 1.54 0 0 0-1.145 0l-.002.001a1.6 1.6 0 0 0-.529.36L8.118 5.172l-.001.001a1.56 1.56 0 0 0-.47 1.128c0 .435.163.82.47 1.128.303.303.676.472 1.103.484Zm0 0 .014-.5-.015.5Zm-1.311 6.865a1.497 1.497 0 0 0-.458-1.13l-.097-.097h1.668c.421 0 .793-.16 1.09-.458.298-.299.46-.67.46-1.092a1.51 1.51 0 0 0-.46-1.091 1.507 1.507 0 0 0-1.09-.459H7.354l.071-.072c.309-.308.472-.692.472-1.128 0-.436-.163-.82-.472-1.13a1.596 1.596 0 0 0-1.101-.482h-.002a1.501 1.501 0 0 0-1.129.459l-2.8 2.8a1.6 1.6 0 0 0-.36.528l-.001.003a1.54 1.54 0 0 0 0 1.144v.003c.081.2.208.375.362.529l2.774 2.775c.309.308.693.47 1.129.47.435 0 .82-.162 1.128-.47.303-.302.472-.676.484-1.102Zm0 0-.5-.014.5.015v-.001Zm3.038-8.627-.5.5.5.207V6.15Zm.475 15.814.002.001a1.54 1.54 0 0 0 1.145 0h.002c.2-.081.375-.208.53-.362l2.775-2.774a1.56 1.56 0 0 0 .47-1.129c0-.435-.162-.82-.47-1.128a1.589 1.589 0 0 0-1.103-.484 1.497 1.497 0 0 0-1.13.458l-.096.097v-1.668c0-.421-.161-.793-.459-1.09a1.509 1.509 0 0 0-1.091-.46c-.422 0-.794.161-1.092.46a1.507 1.507 0 0 0-.458 1.09v1.668l-.072-.072a1.558 1.558 0 0 0-1.129-.471c-.436 0-.82.163-1.128.471l-.001.001c-.301.302-.47.675-.483 1.101v.001c-.012.437.151.821.46 1.13l2.8 2.8c.153.153.328.28.528.36Zm5.146-6.085c.303.302.676.47 1.102.484a1.5 1.5 0 0 0 1.13-.46l2.8-2.8a1.6 1.6 0 0 0 .36-.528l.002-.003a1.54 1.54 0 0 0 0-1.144l-.001-.003a1.6 1.6 0 0 0-.361-.529l-2.774-2.775h-.001a1.56 1.56 0 0 0-1.128-.47c-.436 0-.82.162-1.128.47h-.001a1.59 1.59 0 0 0-.484 1.102c-.012.437.15.822.459 1.13l.097.097h-1.668c-.422 0-.793.16-1.09.459-.299.298-.46.67-.46 1.091 0 .422.161.793.46 1.092.297.297.668.458 1.09.458h1.668l-.072.072a1.558 1.558 0 0 0-.472 1.129c0 .435.164.82.472 1.128ZM6.147 13.05l.5.5.207-.5h-.707Z\"/></svg>') 12 12,auto}.unreal-container.dolly{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><mask id=\"a\" width=\"24\" height=\"24\" x=\"0\" y=\"0\" maskUnits=\"userSpaceOnUse\" style=\"mask-type:alpha\"><path fill=\"%23127392\" d=\"M0 0h24v24H0z\"/></mask><g mask=\"url(%23a)\"><path fill=\"%23000\" d=\"M12.002 20.575a1.026 1.026 0 0 1-.75-.325l-2.55-2.55a.933.933 0 0 1-.287-.713c.008-.275.113-.513.313-.713.2-.2.441-.3.725-.3.283 0 .524.1.724.3l.776.776V6.95l-.8.8c-.2.2-.438.296-.712.288a1.018 1.018 0 0 1-.713-.312c-.2-.2-.3-.442-.3-.726s.1-.525.3-.725l2.524-2.525a1.026 1.026 0 0 1 1.5 0l2.55 2.55c.2.2.296.438.289.713a1.023 1.023 0 0 1-.314.713c-.2.2-.441.3-.724.3a.988.988 0 0 1-.725-.3l-.775-.776v10.1l.8-.8c.2-.2.437-.296.712-.288.275.008.512.112.712.312.2.2.3.442.3.726s-.1.525-.3.725l-2.524 2.525a1.026 1.026 0 0 1-.75.325Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M13.553 8.153c.28.245.62.373 1 .373.415 0 .784-.153 1.078-.447.287-.287.446-.644.46-1.05v-.002a1.432 1.432 0 0 0-.435-1.08l-2.55-2.55-.354.353.354-.354a1.526 1.526 0 0 0-2.207 0L8.374 5.921A1.487 1.487 0 0 0 7.928 7c0 .416.152.785.446 1.08.288.287.645.446 1.052.457l4.127-.384Zm0 0v7.693m0-7.693a1.667 1.667 0 0 1-.079-.074l-3.021.075v7.693a1.482 1.482 0 0 0-1-.373c-.416 0-.785.153-1.079.447a1.522 1.522 0 0 0-.46 1.05v.002c-.011.417.14.786.435 1.08l2.55 2.55a1.527 1.527 0 0 0 2.207 0l2.525-2.524c.294-.294.446-.663.446-1.079 0-.416-.152-.785-.446-1.08a1.518 1.518 0 0 0-1.052-.457m0 0-.014.5.014-.5Zm0 0a1.424 1.424 0 0 0-1.027.383m0 0a1.583 1.583 0 0 0-.053.05l.354.354m-.3-.404v.104l.3.3m0 0-.3-.3v.6l.3-.3Z\"/></g></svg>%0D%0A') 12 12,auto}.unreal-container.disabled:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#playerUI{position:absolute;z-index:10;width:100%}#statsContainer{display:none;text-align:left;background-color:#000c}#stats{padding:6px;font-weight:700;font-size:14px;color:#0f0}canvas{position:absolute;image-rendering:crisp-edges}#overlay{position:absolute;top:0;right:2%;z-index:100;padding:4px;border-top-width:0;-webkit-border-bottom-right-radius:5px;-moz-border-radius-bottomright:5px;border-bottom-right-radius:5px;-webkit-border-bottom-left-radius:5px;-moz-border-radius-bottomleft:5px;border-bottom-left-radius:5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}.overlay{font-weight:lighter;font-family:var(--src-font-family-body)}#overlayButton:hover{cursor:pointer}#overlayButton{font-size:40px;text-align:right}#overlaySettings{display:none;width:300px;padding:4px}#videoMessageOverlay{position:absolute;z-index:20;width:100%;margin:auto;font-size:1.8em;font-family:var(--src-font-family-body)}#playButton{display:inline-block;height:auto}img#playButton{width:10%;max-width:241px}#UIInteraction{position:fixed}#UIInteractionButtonBoundary{padding:2px}#UIInteractionButton{cursor:pointer}#hiddenInput{position:absolute;left:-10%;width:0;opacity:0}#editTextButton{position:absolute;width:40px;height:40px}\n"], dependencies: [{ kind: "component", type: AfkTimeoutModalComponent, selector: "app-afk-timeout-modal" }, { kind: "component", type: UnrealStatusComponent, selector: "app-unreal-status" }, { kind: "component", type: FreezeFrameComponent, selector: "app-freeze-frame" }, { kind: "component", type: VideoStatsComponent, selector: "app-video-stats" }, { kind: "component", type: ResumeStreamButtonComponent, selector: "app-resume-stream-button" }, { kind: "component", type: ImageLoadingSrcComponent, selector: "app-image-loading-src" }, { kind: "component", type: IntroSrcComponent, selector: "app-intro-src" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7718
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: UnrealSceneComponent, isStandalone: true, selector: "app-unreal-scene", inputs: { useContainerAsSizeProvider: { classPropertyName: "useContainerAsSizeProvider", publicName: "useContainerAsSizeProvider", isSignal: true, isRequired: false, transformFunction: null }, isStudio: { classPropertyName: "isStudio", publicName: "isStudio", isSignal: true, isRequired: false, transformFunction: null }, resolutionSize: { classPropertyName: "resolutionSize", publicName: "resolutionSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeMouseOverScene: "changeMouseOverScene" }, host: { listeners: { "mouseover": "onMouseOver()", "mouseout": "onMouseOut()", "contextmenu": "onContextMenu($event)" } }, viewQueries: [{ propertyName: "videoElement", first: true, predicate: ["videoContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"frame unreal-container\">\n <div #videoContainer id=\"player\"></div>\n\n <app-intro-src />\n <app-image-loading-src />\n <app-resume-stream-button />\n <app-unreal-status />\n <app-freeze-frame />\n <app-afk-timeout-modal />\n\n <ng-content select=\"app-pdf\"></ng-content>\n <ng-content select=\"app-show-case\"></ng-content>\n\n @if (isDevMode) {\n <app-video-stats />\n }\n</div>\n", styles: [".unreal-container{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#fff}.unreal-container #player{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center;overflow:hidden}.unreal-container.select{cursor:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M15.15 21.375a1.423 1.423 0 0 1-1.15.063 1.487 1.487 0 0 1-.85-.788l-3-6.45-2.325 3.25c-.283.4-.658.525-1.125.375-.467-.15-.7-.466-.7-.95V4.05c0-.417.188-.717.563-.9.375-.183.729-.142 1.062.125l10.1 7.95c.383.284.496.65.337 1.1-.158.45-.479.675-.962.675h-4.2l2.975 6.375c.183.384.204.767.063 1.15a1.487 1.487 0 0 1-.788.85Z\" fill=\"%23000\"/><path d=\"m12.697 20.861.002.005c.237.495.617.852 1.128 1.04.515.191 1.039.16 1.539-.08a1.987 1.987 0 0 0 1.04-1.128 1.922 1.922 0 0 0-.079-1.536v-.003L13.684 13.5H17.1c.32 0 .628-.075.89-.26.263-.184.438-.447.544-.749.106-.3.135-.617.04-.925a1.458 1.458 0 0 0-.545-.738L7.936 2.883a1.51 1.51 0 0 0-.768-.336 1.471 1.471 0 0 0-.825.154 1.495 1.495 0 0 0-.626.547 1.492 1.492 0 0 0-.217.802v12.825c0 .324.08.634.272.897.193.261.467.43.775.53.31.099.632.12.942.016.31-.103.555-.313.743-.578h.001l1.825-2.552 2.639 5.673Z\" stroke=\"%23fff\" stroke-opacity=\".7\"/></svg>') 6 2,auto}.unreal-container.orbit{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.998 21.6c-1.966 0-3.737-.53-5.312-1.588-1.575-1.058-2.738-2.437-3.488-4.137a.852.852 0 0 1 .013-.713.867.867 0 0 1 .512-.487.86.86 0 0 1 .688.037c.225.109.387.28.487.513.617 1.35 1.559 2.45 2.825 3.3 1.267.85 2.692 1.275 4.275 1.275 1.384 0 2.646-.33 3.788-.988a7.985 7.985 0 0 0 2.762-2.612h-.85a.873.873 0 0 1-.64-.257.863.863 0 0 1-.26-.638.88.88 0 0 1 .26-.643.864.864 0 0 1 .64-.262h3c.255 0 .47.086.642.259a.87.87 0 0 1 .258.64v3a.874.874 0 0 1-.257.642.863.863 0 0 1-.637.259.88.88 0 0 1-.643-.259.865.865 0 0 1-.263-.641v-.725a9.95 9.95 0 0 1-3.35 2.925c-1.35.733-2.833 1.1-4.45 1.1Zm0-17.4c-1.383 0-2.645.33-3.787.987A7.985 7.985 0 0 0 5.448 7.8h.85c.255 0 .47.086.642.257a.863.863 0 0 1 .258.638.88.88 0 0 1-.258.642.864.864 0 0 1-.642.263h-3a.87.87 0 0 1-.64-.259.87.87 0 0 1-.26-.641v-3c0-.255.086-.469.258-.641a.863.863 0 0 1 .637-.26.88.88 0 0 1 .643.26.864.864 0 0 1 .262.64v.726A9.95 9.95 0 0 1 7.548 3.5c1.35-.733 2.834-1.1 4.45-1.1 2 0 3.788.542 5.363 1.625 1.575 1.083 2.736 2.49 3.482 4.22a.724.724 0 0 1-.045.646.926.926 0 0 1-.525.437.87.87 0 0 1-.687-.04.977.977 0 0 1-.488-.513c-.616-1.35-1.558-2.45-2.825-3.3-1.266-.85-2.691-1.275-4.275-1.275Zm0 10.8a2.893 2.893 0 0 1-2.125-.875A2.893 2.893 0 0 1 8.998 12c0-.833.292-1.542.875-2.125A2.893 2.893 0 0 1 11.998 9c.834 0 1.542.292 2.125.875.584.583.875 1.292.875 2.125s-.291 1.542-.875 2.125a2.893 2.893 0 0 1-2.125.875Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"m2.739 16.072.002.005c.789 1.788 2.014 3.24 3.666 4.35 1.66 1.116 3.53 1.673 5.591 1.673 1.696 0 3.262-.386 4.69-1.16a10.54 10.54 0 0 0 2.714-2.097c.069.167.171.32.308.454.272.268.613.403.994.403.38 0 .722-.135.992-.406s.402-.614.402-.994v-3c0-.381-.134-.724-.405-.995a1.37 1.37 0 0 0-.995-.405h-3c-.383 0-.727.137-.997.411a1.38 1.38 0 0 0-.403.994c0 .38.135.723.407.992.238.237.532.369.858.397a7.552 7.552 0 0 1-2.027 1.685c-1.062.613-2.237.92-3.538.92-1.488 0-2.815-.397-3.996-1.19-1.19-.798-2.07-1.826-2.647-3.087-.147-.34-.393-.6-.727-.76a1.36 1.36 0 0 0-1.073-.058c-.37.133-.64.397-.8.754a1.351 1.351 0 0 0-.016 1.114Zm4.553-8.37a1.36 1.36 0 0 0-.858-.396A7.552 7.552 0 0 1 8.46 5.62c1.062-.613 2.237-.921 3.537-.921 1.489 0 2.816.398 3.997 1.19 1.19.8 2.07 1.827 2.646 3.088.148.34.394.6.728.76a1.37 1.37 0 0 0 1.068.063c.347-.12.62-.346.799-.668.187-.338.215-.71.072-1.072l-.003-.007-.003-.007c-.784-1.818-2.006-3.298-3.658-4.434C15.982 2.47 14.094 1.9 11.998 1.9c-1.695 0-3.261.385-4.688 1.16a10.536 10.536 0 0 0-2.715 2.096 1.364 1.364 0 0 0-.308-.453 1.38 1.38 0 0 0-.994-.403c-.38 0-.722.135-.992.406s-.403.614-.403.994v3c0 .38.135.724.406.995.27.27.614.405.994.405h3c.384 0 .727-.137.998-.412a1.38 1.38 0 0 0 .402-.993c0-.38-.135-.723-.406-.992ZM9.52 14.48a3.393 3.393 0 0 0 2.478 1.02c.965 0 1.8-.342 2.479-1.02a3.392 3.392 0 0 0 1.021-2.48c0-.963-.343-1.8-1.021-2.478A3.392 3.392 0 0 0 11.998 8.5c-.964 0-1.8.343-2.478 1.021A3.392 3.392 0 0 0 8.498 12c0 .964.344 1.8 1.022 2.479Z\"/></svg>') 12 12,auto}.unreal-container.pan{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.997 10.075a1.01 1.01 0 0 1-.738-.313 1.008 1.008 0 0 1-.312-.737V6.15l-.95.95a.998.998 0 0 1-.763.312 1.09 1.09 0 0 1-.763-.337 1.06 1.06 0 0 1-.324-.775c0-.3.108-.558.324-.775l2.776-2.775c.117-.116.237-.2.362-.25a1.04 1.04 0 0 1 .775 0c.125.05.246.134.363.25l2.8 2.8c.216.217.32.47.313.762a1.096 1.096 0 0 1-.338.763 1.058 1.058 0 0 1-.775.325c-.3 0-.558-.108-.775-.325l-.925-.925v2.875c0 .283-.104.53-.312.737a1.01 1.01 0 0 1-.738.313Zm0 11.5a1.04 1.04 0 0 1-.388-.075 1.103 1.103 0 0 1-.362-.25l-2.8-2.8a1.002 1.002 0 0 1-.313-.762c.009-.292.121-.546.337-.763.217-.217.475-.325.775-.325.3 0 .559.108.775.325l.926.925v-2.875c0-.283.104-.529.312-.737a1.01 1.01 0 0 1 .738-.313c.283 0 .529.104.738.313.208.208.312.454.312.737v2.875l.95-.95a.998.998 0 0 1 .762-.312c.292.008.546.12.763.337.216.217.324.475.324.775 0 .3-.108.559-.324.775l-2.775 2.775c-.117.116-.238.2-.363.25a1.04 1.04 0 0 1-.387.075Zm4.925-6.05a1.058 1.058 0 0 1-.326-.774c0-.3.109-.559.326-.776l.925-.925H14.97c-.283 0-.528-.104-.736-.312a1.01 1.01 0 0 1-.313-.738c0-.283.104-.53.313-.738.208-.208.453-.312.737-.312h2.875l-.95-.95a.998.998 0 0 1-.313-.762 1.09 1.09 0 0 1 .338-.764 1.06 1.06 0 0 1 .775-.324c.3 0 .558.108.775.324l2.774 2.776c.117.117.2.238.251.363a1.04 1.04 0 0 1 0 .775c-.05.124-.134.245-.25.362l-2.8 2.8c-.217.216-.471.32-.762.313a1.096 1.096 0 0 1-.763-.337Zm-11.4 0L2.746 12.75a1.103 1.103 0 0 1-.25-.362 1.04 1.04 0 0 1 0-.775c.05-.125.133-.246.25-.363l2.8-2.8c.216-.216.47-.32.762-.313.292.01.546.121.763.337.217.217.325.476.325.776 0 .3-.108.558-.325.775l-.925.925h2.875c.283 0 .529.104.737.312.208.209.313.455.313.738s-.105.53-.313.738a1.008 1.008 0 0 1-.737.312H6.147l.95.95c.217.217.32.471.312.762a1.09 1.09 0 0 1-.337.764 1.06 1.06 0 0 1-.775.324c-.3 0-.559-.108-.776-.324Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M9.22 7.912c.436.013.821-.15 1.13-.458l.097-.097v1.668c0 .422.16.793.458 1.09.298.299.67.46 1.092.46.422 0 .793-.161 1.091-.46.298-.297.459-.668.459-1.09V7.357l.071.072c.309.308.693.471 1.13.471.435 0 .82-.163 1.128-.471.301-.303.47-.676.483-1.102v-.001a1.501 1.501 0 0 0-.46-1.13l-2.799-2.8a1.6 1.6 0 0 0-.528-.36l-.003-.001a1.54 1.54 0 0 0-1.145 0l-.002.001a1.6 1.6 0 0 0-.529.36L8.118 5.172l-.001.001a1.56 1.56 0 0 0-.47 1.128c0 .435.163.82.47 1.128.303.303.676.472 1.103.484Zm0 0 .014-.5-.015.5Zm-1.311 6.865a1.497 1.497 0 0 0-.458-1.13l-.097-.097h1.668c.421 0 .793-.16 1.09-.458.298-.299.46-.67.46-1.092a1.51 1.51 0 0 0-.46-1.091 1.507 1.507 0 0 0-1.09-.459H7.354l.071-.072c.309-.308.472-.692.472-1.128 0-.436-.163-.82-.472-1.13a1.596 1.596 0 0 0-1.101-.482h-.002a1.501 1.501 0 0 0-1.129.459l-2.8 2.8a1.6 1.6 0 0 0-.36.528l-.001.003a1.54 1.54 0 0 0 0 1.144v.003c.081.2.208.375.362.529l2.774 2.775c.309.308.693.47 1.129.47.435 0 .82-.162 1.128-.47.303-.302.472-.676.484-1.102Zm0 0-.5-.014.5.015v-.001Zm3.038-8.627-.5.5.5.207V6.15Zm.475 15.814.002.001a1.54 1.54 0 0 0 1.145 0h.002c.2-.081.375-.208.53-.362l2.775-2.774a1.56 1.56 0 0 0 .47-1.129c0-.435-.162-.82-.47-1.128a1.589 1.589 0 0 0-1.103-.484 1.497 1.497 0 0 0-1.13.458l-.096.097v-1.668c0-.421-.161-.793-.459-1.09a1.509 1.509 0 0 0-1.091-.46c-.422 0-.794.161-1.092.46a1.507 1.507 0 0 0-.458 1.09v1.668l-.072-.072a1.558 1.558 0 0 0-1.129-.471c-.436 0-.82.163-1.128.471l-.001.001c-.301.302-.47.675-.483 1.101v.001c-.012.437.151.821.46 1.13l2.8 2.8c.153.153.328.28.528.36Zm5.146-6.085c.303.302.676.47 1.102.484a1.5 1.5 0 0 0 1.13-.46l2.8-2.8a1.6 1.6 0 0 0 .36-.528l.002-.003a1.54 1.54 0 0 0 0-1.144l-.001-.003a1.6 1.6 0 0 0-.361-.529l-2.774-2.775h-.001a1.56 1.56 0 0 0-1.128-.47c-.436 0-.82.162-1.128.47h-.001a1.59 1.59 0 0 0-.484 1.102c-.012.437.15.822.459 1.13l.097.097h-1.668c-.422 0-.793.16-1.09.459-.299.298-.46.67-.46 1.091 0 .422.161.793.46 1.092.297.297.668.458 1.09.458h1.668l-.072.072a1.558 1.558 0 0 0-.472 1.129c0 .435.164.82.472 1.128ZM6.147 13.05l.5.5.207-.5h-.707Z\"/></svg>') 12 12,auto}.unreal-container.dolly{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><mask id=\"a\" width=\"24\" height=\"24\" x=\"0\" y=\"0\" maskUnits=\"userSpaceOnUse\" style=\"mask-type:alpha\"><path fill=\"%23127392\" d=\"M0 0h24v24H0z\"/></mask><g mask=\"url(%23a)\"><path fill=\"%23000\" d=\"M12.002 20.575a1.026 1.026 0 0 1-.75-.325l-2.55-2.55a.933.933 0 0 1-.287-.713c.008-.275.113-.513.313-.713.2-.2.441-.3.725-.3.283 0 .524.1.724.3l.776.776V6.95l-.8.8c-.2.2-.438.296-.712.288a1.018 1.018 0 0 1-.713-.312c-.2-.2-.3-.442-.3-.726s.1-.525.3-.725l2.524-2.525a1.026 1.026 0 0 1 1.5 0l2.55 2.55c.2.2.296.438.289.713a1.023 1.023 0 0 1-.314.713c-.2.2-.441.3-.724.3a.988.988 0 0 1-.725-.3l-.775-.776v10.1l.8-.8c.2-.2.437-.296.712-.288.275.008.512.112.712.312.2.2.3.442.3.726s-.1.525-.3.725l-2.524 2.525a1.026 1.026 0 0 1-.75.325Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M13.553 8.153c.28.245.62.373 1 .373.415 0 .784-.153 1.078-.447.287-.287.446-.644.46-1.05v-.002a1.432 1.432 0 0 0-.435-1.08l-2.55-2.55-.354.353.354-.354a1.526 1.526 0 0 0-2.207 0L8.374 5.921A1.487 1.487 0 0 0 7.928 7c0 .416.152.785.446 1.08.288.287.645.446 1.052.457l4.127-.384Zm0 0v7.693m0-7.693a1.667 1.667 0 0 1-.079-.074l-3.021.075v7.693a1.482 1.482 0 0 0-1-.373c-.416 0-.785.153-1.079.447a1.522 1.522 0 0 0-.46 1.05v.002c-.011.417.14.786.435 1.08l2.55 2.55a1.527 1.527 0 0 0 2.207 0l2.525-2.524c.294-.294.446-.663.446-1.079 0-.416-.152-.785-.446-1.08a1.518 1.518 0 0 0-1.052-.457m0 0-.014.5.014-.5Zm0 0a1.424 1.424 0 0 0-1.027.383m0 0a1.583 1.583 0 0 0-.053.05l.354.354m-.3-.404v.104l.3.3m0 0-.3-.3v.6l.3-.3Z\"/></g></svg>%0A') 12 12,auto}.unreal-container.disabled:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#playerUI{position:absolute;z-index:10;width:100%}#statsContainer{display:none;text-align:left;background-color:#000c}#stats{padding:6px;font-weight:700;font-size:14px;color:#0f0}canvas{position:absolute;image-rendering:crisp-edges}#overlay{position:absolute;top:0;right:2%;z-index:100;padding:4px;border-top-width:0;-webkit-border-bottom-right-radius:5px;-moz-border-radius-bottomright:5px;border-bottom-right-radius:5px;-webkit-border-bottom-left-radius:5px;-moz-border-radius-bottomleft:5px;border-bottom-left-radius:5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}.overlay{font-weight:lighter;font-family:var(--src-font-family-body)}#overlayButton:hover{cursor:pointer}#overlayButton{font-size:40px;text-align:right}#overlaySettings{display:none;width:300px;padding:4px}#videoMessageOverlay{position:absolute;z-index:20;width:100%;margin:auto;font-size:1.8em;font-family:var(--src-font-family-body)}#playButton{display:inline-block;height:auto}img#playButton{width:10%;max-width:241px}#UIInteraction{position:fixed}#UIInteractionButtonBoundary{padding:2px}#UIInteractionButton{cursor:pointer}#hiddenInput{position:absolute;left:-10%;width:0;opacity:0}#editTextButton{position:absolute;width:40px;height:40px}\n"], dependencies: [{ kind: "component", type: AfkTimeoutModalComponent, selector: "app-afk-timeout-modal" }, { kind: "component", type: UnrealStatusComponent, selector: "app-unreal-status" }, { kind: "component", type: FreezeFrameComponent, selector: "app-freeze-frame" }, { kind: "component", type: VideoStatsComponent, selector: "app-video-stats" }, { kind: "component", type: ResumeStreamButtonComponent, selector: "app-resume-stream-button" }, { kind: "component", type: ImageLoadingSrcComponent, selector: "app-image-loading-src" }, { kind: "component", type: IntroSrcComponent, selector: "app-intro-src" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7815
7719
|
}
|
|
7816
7720
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: UnrealSceneComponent, decorators: [{
|
|
7817
7721
|
type: Component,
|
|
@@ -7823,7 +7727,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
7823
7727
|
ResumeStreamButtonComponent,
|
|
7824
7728
|
ImageLoadingSrcComponent,
|
|
7825
7729
|
IntroSrcComponent,
|
|
7826
|
-
], template: "<div class=\"frame unreal-container\">\r\n <div #videoContainer id=\"player\"></div>\r\n\r\n <app-intro-src />\r\n <app-image-loading-src />\r\n <app-resume-stream-button />\r\n <app-unreal-status />\r\n <app-freeze-frame />\r\n <app-afk-timeout-modal />\r\n\r\n <ng-content select=\"app-pdf\"></ng-content>\r\n <ng-content select=\"app-show-case\"></ng-content>\r\n\r\n @if (isDevMode) {\r\n <app-video-stats />\r\n }\r\n</div>\r\n", styles: [".unreal-container{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#fff}.unreal-container #player{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center;overflow:hidden}.unreal-container.select{cursor:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M15.15 21.375a1.423 1.423 0 0 1-1.15.063 1.487 1.487 0 0 1-.85-.788l-3-6.45-2.325 3.25c-.283.4-.658.525-1.125.375-.467-.15-.7-.466-.7-.95V4.05c0-.417.188-.717.563-.9.375-.183.729-.142 1.062.125l10.1 7.95c.383.284.496.65.337 1.1-.158.45-.479.675-.962.675h-4.2l2.975 6.375c.183.384.204.767.063 1.15a1.487 1.487 0 0 1-.788.85Z\" fill=\"%23000\"/><path d=\"m12.697 20.861.002.005c.237.495.617.852 1.128 1.04.515.191 1.039.16 1.539-.08a1.987 1.987 0 0 0 1.04-1.128 1.922 1.922 0 0 0-.079-1.536v-.003L13.684 13.5H17.1c.32 0 .628-.075.89-.26.263-.184.438-.447.544-.749.106-.3.135-.617.04-.925a1.458 1.458 0 0 0-.545-.738L7.936 2.883a1.51 1.51 0 0 0-.768-.336 1.471 1.471 0 0 0-.825.154 1.495 1.495 0 0 0-.626.547 1.492 1.492 0 0 0-.217.802v12.825c0 .324.08.634.272.897.193.261.467.43.775.53.31.099.632.12.942.016.31-.103.555-.313.743-.578h.001l1.825-2.552 2.639 5.673Z\" stroke=\"%23fff\" stroke-opacity=\".7\"/></svg>') 6 2,auto}.unreal-container.orbit{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.998 21.6c-1.966 0-3.737-.53-5.312-1.588-1.575-1.058-2.738-2.437-3.488-4.137a.852.852 0 0 1 .013-.713.867.867 0 0 1 .512-.487.86.86 0 0 1 .688.037c.225.109.387.28.487.513.617 1.35 1.559 2.45 2.825 3.3 1.267.85 2.692 1.275 4.275 1.275 1.384 0 2.646-.33 3.788-.988a7.985 7.985 0 0 0 2.762-2.612h-.85a.873.873 0 0 1-.64-.257.863.863 0 0 1-.26-.638.88.88 0 0 1 .26-.643.864.864 0 0 1 .64-.262h3c.255 0 .47.086.642.259a.87.87 0 0 1 .258.64v3a.874.874 0 0 1-.257.642.863.863 0 0 1-.637.259.88.88 0 0 1-.643-.259.865.865 0 0 1-.263-.641v-.725a9.95 9.95 0 0 1-3.35 2.925c-1.35.733-2.833 1.1-4.45 1.1Zm0-17.4c-1.383 0-2.645.33-3.787.987A7.985 7.985 0 0 0 5.448 7.8h.85c.255 0 .47.086.642.257a.863.863 0 0 1 .258.638.88.88 0 0 1-.258.642.864.864 0 0 1-.642.263h-3a.87.87 0 0 1-.64-.259.87.87 0 0 1-.26-.641v-3c0-.255.086-.469.258-.641a.863.863 0 0 1 .637-.26.88.88 0 0 1 .643.26.864.864 0 0 1 .262.64v.726A9.95 9.95 0 0 1 7.548 3.5c1.35-.733 2.834-1.1 4.45-1.1 2 0 3.788.542 5.363 1.625 1.575 1.083 2.736 2.49 3.482 4.22a.724.724 0 0 1-.045.646.926.926 0 0 1-.525.437.87.87 0 0 1-.687-.04.977.977 0 0 1-.488-.513c-.616-1.35-1.558-2.45-2.825-3.3-1.266-.85-2.691-1.275-4.275-1.275Zm0 10.8a2.893 2.893 0 0 1-2.125-.875A2.893 2.893 0 0 1 8.998 12c0-.833.292-1.542.875-2.125A2.893 2.893 0 0 1 11.998 9c.834 0 1.542.292 2.125.875.584.583.875 1.292.875 2.125s-.291 1.542-.875 2.125a2.893 2.893 0 0 1-2.125.875Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"m2.739 16.072.002.005c.789 1.788 2.014 3.24 3.666 4.35 1.66 1.116 3.53 1.673 5.591 1.673 1.696 0 3.262-.386 4.69-1.16a10.54 10.54 0 0 0 2.714-2.097c.069.167.171.32.308.454.272.268.613.403.994.403.38 0 .722-.135.992-.406s.402-.614.402-.994v-3c0-.381-.134-.724-.405-.995a1.37 1.37 0 0 0-.995-.405h-3c-.383 0-.727.137-.997.411a1.38 1.38 0 0 0-.403.994c0 .38.135.723.407.992.238.237.532.369.858.397a7.552 7.552 0 0 1-2.027 1.685c-1.062.613-2.237.92-3.538.92-1.488 0-2.815-.397-3.996-1.19-1.19-.798-2.07-1.826-2.647-3.087-.147-.34-.393-.6-.727-.76a1.36 1.36 0 0 0-1.073-.058c-.37.133-.64.397-.8.754a1.351 1.351 0 0 0-.016 1.114Zm4.553-8.37a1.36 1.36 0 0 0-.858-.396A7.552 7.552 0 0 1 8.46 5.62c1.062-.613 2.237-.921 3.537-.921 1.489 0 2.816.398 3.997 1.19 1.19.8 2.07 1.827 2.646 3.088.148.34.394.6.728.76a1.37 1.37 0 0 0 1.068.063c.347-.12.62-.346.799-.668.187-.338.215-.71.072-1.072l-.003-.007-.003-.007c-.784-1.818-2.006-3.298-3.658-4.434C15.982 2.47 14.094 1.9 11.998 1.9c-1.695 0-3.261.385-4.688 1.16a10.536 10.536 0 0 0-2.715 2.096 1.364 1.364 0 0 0-.308-.453 1.38 1.38 0 0 0-.994-.403c-.38 0-.722.135-.992.406s-.403.614-.403.994v3c0 .38.135.724.406.995.27.27.614.405.994.405h3c.384 0 .727-.137.998-.412a1.38 1.38 0 0 0 .402-.993c0-.38-.135-.723-.406-.992ZM9.52 14.48a3.393 3.393 0 0 0 2.478 1.02c.965 0 1.8-.342 2.479-1.02a3.392 3.392 0 0 0 1.021-2.48c0-.963-.343-1.8-1.021-2.478A3.392 3.392 0 0 0 11.998 8.5c-.964 0-1.8.343-2.478 1.021A3.392 3.392 0 0 0 8.498 12c0 .964.344 1.8 1.022 2.479Z\"/></svg>') 12 12,auto}.unreal-container.pan{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.997 10.075a1.01 1.01 0 0 1-.738-.313 1.008 1.008 0 0 1-.312-.737V6.15l-.95.95a.998.998 0 0 1-.763.312 1.09 1.09 0 0 1-.763-.337 1.06 1.06 0 0 1-.324-.775c0-.3.108-.558.324-.775l2.776-2.775c.117-.116.237-.2.362-.25a1.04 1.04 0 0 1 .775 0c.125.05.246.134.363.25l2.8 2.8c.216.217.32.47.313.762a1.096 1.096 0 0 1-.338.763 1.058 1.058 0 0 1-.775.325c-.3 0-.558-.108-.775-.325l-.925-.925v2.875c0 .283-.104.53-.312.737a1.01 1.01 0 0 1-.738.313Zm0 11.5a1.04 1.04 0 0 1-.388-.075 1.103 1.103 0 0 1-.362-.25l-2.8-2.8a1.002 1.002 0 0 1-.313-.762c.009-.292.121-.546.337-.763.217-.217.475-.325.775-.325.3 0 .559.108.775.325l.926.925v-2.875c0-.283.104-.529.312-.737a1.01 1.01 0 0 1 .738-.313c.283 0 .529.104.738.313.208.208.312.454.312.737v2.875l.95-.95a.998.998 0 0 1 .762-.312c.292.008.546.12.763.337.216.217.324.475.324.775 0 .3-.108.559-.324.775l-2.775 2.775c-.117.116-.238.2-.363.25a1.04 1.04 0 0 1-.387.075Zm4.925-6.05a1.058 1.058 0 0 1-.326-.774c0-.3.109-.559.326-.776l.925-.925H14.97c-.283 0-.528-.104-.736-.312a1.01 1.01 0 0 1-.313-.738c0-.283.104-.53.313-.738.208-.208.453-.312.737-.312h2.875l-.95-.95a.998.998 0 0 1-.313-.762 1.09 1.09 0 0 1 .338-.764 1.06 1.06 0 0 1 .775-.324c.3 0 .558.108.775.324l2.774 2.776c.117.117.2.238.251.363a1.04 1.04 0 0 1 0 .775c-.05.124-.134.245-.25.362l-2.8 2.8c-.217.216-.471.32-.762.313a1.096 1.096 0 0 1-.763-.337Zm-11.4 0L2.746 12.75a1.103 1.103 0 0 1-.25-.362 1.04 1.04 0 0 1 0-.775c.05-.125.133-.246.25-.363l2.8-2.8c.216-.216.47-.32.762-.313.292.01.546.121.763.337.217.217.325.476.325.776 0 .3-.108.558-.325.775l-.925.925h2.875c.283 0 .529.104.737.312.208.209.313.455.313.738s-.105.53-.313.738a1.008 1.008 0 0 1-.737.312H6.147l.95.95c.217.217.32.471.312.762a1.09 1.09 0 0 1-.337.764 1.06 1.06 0 0 1-.775.324c-.3 0-.559-.108-.776-.324Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M9.22 7.912c.436.013.821-.15 1.13-.458l.097-.097v1.668c0 .422.16.793.458 1.09.298.299.67.46 1.092.46.422 0 .793-.161 1.091-.46.298-.297.459-.668.459-1.09V7.357l.071.072c.309.308.693.471 1.13.471.435 0 .82-.163 1.128-.471.301-.303.47-.676.483-1.102v-.001a1.501 1.501 0 0 0-.46-1.13l-2.799-2.8a1.6 1.6 0 0 0-.528-.36l-.003-.001a1.54 1.54 0 0 0-1.145 0l-.002.001a1.6 1.6 0 0 0-.529.36L8.118 5.172l-.001.001a1.56 1.56 0 0 0-.47 1.128c0 .435.163.82.47 1.128.303.303.676.472 1.103.484Zm0 0 .014-.5-.015.5Zm-1.311 6.865a1.497 1.497 0 0 0-.458-1.13l-.097-.097h1.668c.421 0 .793-.16 1.09-.458.298-.299.46-.67.46-1.092a1.51 1.51 0 0 0-.46-1.091 1.507 1.507 0 0 0-1.09-.459H7.354l.071-.072c.309-.308.472-.692.472-1.128 0-.436-.163-.82-.472-1.13a1.596 1.596 0 0 0-1.101-.482h-.002a1.501 1.501 0 0 0-1.129.459l-2.8 2.8a1.6 1.6 0 0 0-.36.528l-.001.003a1.54 1.54 0 0 0 0 1.144v.003c.081.2.208.375.362.529l2.774 2.775c.309.308.693.47 1.129.47.435 0 .82-.162 1.128-.47.303-.302.472-.676.484-1.102Zm0 0-.5-.014.5.015v-.001Zm3.038-8.627-.5.5.5.207V6.15Zm.475 15.814.002.001a1.54 1.54 0 0 0 1.145 0h.002c.2-.081.375-.208.53-.362l2.775-2.774a1.56 1.56 0 0 0 .47-1.129c0-.435-.162-.82-.47-1.128a1.589 1.589 0 0 0-1.103-.484 1.497 1.497 0 0 0-1.13.458l-.096.097v-1.668c0-.421-.161-.793-.459-1.09a1.509 1.509 0 0 0-1.091-.46c-.422 0-.794.161-1.092.46a1.507 1.507 0 0 0-.458 1.09v1.668l-.072-.072a1.558 1.558 0 0 0-1.129-.471c-.436 0-.82.163-1.128.471l-.001.001c-.301.302-.47.675-.483 1.101v.001c-.012.437.151.821.46 1.13l2.8 2.8c.153.153.328.28.528.36Zm5.146-6.085c.303.302.676.47 1.102.484a1.5 1.5 0 0 0 1.13-.46l2.8-2.8a1.6 1.6 0 0 0 .36-.528l.002-.003a1.54 1.54 0 0 0 0-1.144l-.001-.003a1.6 1.6 0 0 0-.361-.529l-2.774-2.775h-.001a1.56 1.56 0 0 0-1.128-.47c-.436 0-.82.162-1.128.47h-.001a1.59 1.59 0 0 0-.484 1.102c-.012.437.15.822.459 1.13l.097.097h-1.668c-.422 0-.793.16-1.09.459-.299.298-.46.67-.46 1.091 0 .422.161.793.46 1.092.297.297.668.458 1.09.458h1.668l-.072.072a1.558 1.558 0 0 0-.472 1.129c0 .435.164.82.472 1.128ZM6.147 13.05l.5.5.207-.5h-.707Z\"/></svg>') 12 12,auto}.unreal-container.dolly{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><mask id=\"a\" width=\"24\" height=\"24\" x=\"0\" y=\"0\" maskUnits=\"userSpaceOnUse\" style=\"mask-type:alpha\"><path fill=\"%23127392\" d=\"M0 0h24v24H0z\"/></mask><g mask=\"url(%23a)\"><path fill=\"%23000\" d=\"M12.002 20.575a1.026 1.026 0 0 1-.75-.325l-2.55-2.55a.933.933 0 0 1-.287-.713c.008-.275.113-.513.313-.713.2-.2.441-.3.725-.3.283 0 .524.1.724.3l.776.776V6.95l-.8.8c-.2.2-.438.296-.712.288a1.018 1.018 0 0 1-.713-.312c-.2-.2-.3-.442-.3-.726s.1-.525.3-.725l2.524-2.525a1.026 1.026 0 0 1 1.5 0l2.55 2.55c.2.2.296.438.289.713a1.023 1.023 0 0 1-.314.713c-.2.2-.441.3-.724.3a.988.988 0 0 1-.725-.3l-.775-.776v10.1l.8-.8c.2-.2.437-.296.712-.288.275.008.512.112.712.312.2.2.3.442.3.726s-.1.525-.3.725l-2.524 2.525a1.026 1.026 0 0 1-.75.325Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M13.553 8.153c.28.245.62.373 1 .373.415 0 .784-.153 1.078-.447.287-.287.446-.644.46-1.05v-.002a1.432 1.432 0 0 0-.435-1.08l-2.55-2.55-.354.353.354-.354a1.526 1.526 0 0 0-2.207 0L8.374 5.921A1.487 1.487 0 0 0 7.928 7c0 .416.152.785.446 1.08.288.287.645.446 1.052.457l4.127-.384Zm0 0v7.693m0-7.693a1.667 1.667 0 0 1-.079-.074l-3.021.075v7.693a1.482 1.482 0 0 0-1-.373c-.416 0-.785.153-1.079.447a1.522 1.522 0 0 0-.46 1.05v.002c-.011.417.14.786.435 1.08l2.55 2.55a1.527 1.527 0 0 0 2.207 0l2.525-2.524c.294-.294.446-.663.446-1.079 0-.416-.152-.785-.446-1.08a1.518 1.518 0 0 0-1.052-.457m0 0-.014.5.014-.5Zm0 0a1.424 1.424 0 0 0-1.027.383m0 0a1.583 1.583 0 0 0-.053.05l.354.354m-.3-.404v.104l.3.3m0 0-.3-.3v.6l.3-.3Z\"/></g></svg>%0D%0A') 12 12,auto}.unreal-container.disabled:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#playerUI{position:absolute;z-index:10;width:100%}#statsContainer{display:none;text-align:left;background-color:#000c}#stats{padding:6px;font-weight:700;font-size:14px;color:#0f0}canvas{position:absolute;image-rendering:crisp-edges}#overlay{position:absolute;top:0;right:2%;z-index:100;padding:4px;border-top-width:0;-webkit-border-bottom-right-radius:5px;-moz-border-radius-bottomright:5px;border-bottom-right-radius:5px;-webkit-border-bottom-left-radius:5px;-moz-border-radius-bottomleft:5px;border-bottom-left-radius:5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}.overlay{font-weight:lighter;font-family:var(--src-font-family-body)}#overlayButton:hover{cursor:pointer}#overlayButton{font-size:40px;text-align:right}#overlaySettings{display:none;width:300px;padding:4px}#videoMessageOverlay{position:absolute;z-index:20;width:100%;margin:auto;font-size:1.8em;font-family:var(--src-font-family-body)}#playButton{display:inline-block;height:auto}img#playButton{width:10%;max-width:241px}#UIInteraction{position:fixed}#UIInteractionButtonBoundary{padding:2px}#UIInteractionButton{cursor:pointer}#hiddenInput{position:absolute;left:-10%;width:0;opacity:0}#editTextButton{position:absolute;width:40px;height:40px}\n"] }]
|
|
7730
|
+
], template: "<div class=\"frame unreal-container\">\n <div #videoContainer id=\"player\"></div>\n\n <app-intro-src />\n <app-image-loading-src />\n <app-resume-stream-button />\n <app-unreal-status />\n <app-freeze-frame />\n <app-afk-timeout-modal />\n\n <ng-content select=\"app-pdf\"></ng-content>\n <ng-content select=\"app-show-case\"></ng-content>\n\n @if (isDevMode) {\n <app-video-stats />\n }\n</div>\n", styles: [".unreal-container{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#fff}.unreal-container #player{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center;overflow:hidden}.unreal-container.select{cursor:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M15.15 21.375a1.423 1.423 0 0 1-1.15.063 1.487 1.487 0 0 1-.85-.788l-3-6.45-2.325 3.25c-.283.4-.658.525-1.125.375-.467-.15-.7-.466-.7-.95V4.05c0-.417.188-.717.563-.9.375-.183.729-.142 1.062.125l10.1 7.95c.383.284.496.65.337 1.1-.158.45-.479.675-.962.675h-4.2l2.975 6.375c.183.384.204.767.063 1.15a1.487 1.487 0 0 1-.788.85Z\" fill=\"%23000\"/><path d=\"m12.697 20.861.002.005c.237.495.617.852 1.128 1.04.515.191 1.039.16 1.539-.08a1.987 1.987 0 0 0 1.04-1.128 1.922 1.922 0 0 0-.079-1.536v-.003L13.684 13.5H17.1c.32 0 .628-.075.89-.26.263-.184.438-.447.544-.749.106-.3.135-.617.04-.925a1.458 1.458 0 0 0-.545-.738L7.936 2.883a1.51 1.51 0 0 0-.768-.336 1.471 1.471 0 0 0-.825.154 1.495 1.495 0 0 0-.626.547 1.492 1.492 0 0 0-.217.802v12.825c0 .324.08.634.272.897.193.261.467.43.775.53.31.099.632.12.942.016.31-.103.555-.313.743-.578h.001l1.825-2.552 2.639 5.673Z\" stroke=\"%23fff\" stroke-opacity=\".7\"/></svg>') 6 2,auto}.unreal-container.orbit{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.998 21.6c-1.966 0-3.737-.53-5.312-1.588-1.575-1.058-2.738-2.437-3.488-4.137a.852.852 0 0 1 .013-.713.867.867 0 0 1 .512-.487.86.86 0 0 1 .688.037c.225.109.387.28.487.513.617 1.35 1.559 2.45 2.825 3.3 1.267.85 2.692 1.275 4.275 1.275 1.384 0 2.646-.33 3.788-.988a7.985 7.985 0 0 0 2.762-2.612h-.85a.873.873 0 0 1-.64-.257.863.863 0 0 1-.26-.638.88.88 0 0 1 .26-.643.864.864 0 0 1 .64-.262h3c.255 0 .47.086.642.259a.87.87 0 0 1 .258.64v3a.874.874 0 0 1-.257.642.863.863 0 0 1-.637.259.88.88 0 0 1-.643-.259.865.865 0 0 1-.263-.641v-.725a9.95 9.95 0 0 1-3.35 2.925c-1.35.733-2.833 1.1-4.45 1.1Zm0-17.4c-1.383 0-2.645.33-3.787.987A7.985 7.985 0 0 0 5.448 7.8h.85c.255 0 .47.086.642.257a.863.863 0 0 1 .258.638.88.88 0 0 1-.258.642.864.864 0 0 1-.642.263h-3a.87.87 0 0 1-.64-.259.87.87 0 0 1-.26-.641v-3c0-.255.086-.469.258-.641a.863.863 0 0 1 .637-.26.88.88 0 0 1 .643.26.864.864 0 0 1 .262.64v.726A9.95 9.95 0 0 1 7.548 3.5c1.35-.733 2.834-1.1 4.45-1.1 2 0 3.788.542 5.363 1.625 1.575 1.083 2.736 2.49 3.482 4.22a.724.724 0 0 1-.045.646.926.926 0 0 1-.525.437.87.87 0 0 1-.687-.04.977.977 0 0 1-.488-.513c-.616-1.35-1.558-2.45-2.825-3.3-1.266-.85-2.691-1.275-4.275-1.275Zm0 10.8a2.893 2.893 0 0 1-2.125-.875A2.893 2.893 0 0 1 8.998 12c0-.833.292-1.542.875-2.125A2.893 2.893 0 0 1 11.998 9c.834 0 1.542.292 2.125.875.584.583.875 1.292.875 2.125s-.291 1.542-.875 2.125a2.893 2.893 0 0 1-2.125.875Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"m2.739 16.072.002.005c.789 1.788 2.014 3.24 3.666 4.35 1.66 1.116 3.53 1.673 5.591 1.673 1.696 0 3.262-.386 4.69-1.16a10.54 10.54 0 0 0 2.714-2.097c.069.167.171.32.308.454.272.268.613.403.994.403.38 0 .722-.135.992-.406s.402-.614.402-.994v-3c0-.381-.134-.724-.405-.995a1.37 1.37 0 0 0-.995-.405h-3c-.383 0-.727.137-.997.411a1.38 1.38 0 0 0-.403.994c0 .38.135.723.407.992.238.237.532.369.858.397a7.552 7.552 0 0 1-2.027 1.685c-1.062.613-2.237.92-3.538.92-1.488 0-2.815-.397-3.996-1.19-1.19-.798-2.07-1.826-2.647-3.087-.147-.34-.393-.6-.727-.76a1.36 1.36 0 0 0-1.073-.058c-.37.133-.64.397-.8.754a1.351 1.351 0 0 0-.016 1.114Zm4.553-8.37a1.36 1.36 0 0 0-.858-.396A7.552 7.552 0 0 1 8.46 5.62c1.062-.613 2.237-.921 3.537-.921 1.489 0 2.816.398 3.997 1.19 1.19.8 2.07 1.827 2.646 3.088.148.34.394.6.728.76a1.37 1.37 0 0 0 1.068.063c.347-.12.62-.346.799-.668.187-.338.215-.71.072-1.072l-.003-.007-.003-.007c-.784-1.818-2.006-3.298-3.658-4.434C15.982 2.47 14.094 1.9 11.998 1.9c-1.695 0-3.261.385-4.688 1.16a10.536 10.536 0 0 0-2.715 2.096 1.364 1.364 0 0 0-.308-.453 1.38 1.38 0 0 0-.994-.403c-.38 0-.722.135-.992.406s-.403.614-.403.994v3c0 .38.135.724.406.995.27.27.614.405.994.405h3c.384 0 .727-.137.998-.412a1.38 1.38 0 0 0 .402-.993c0-.38-.135-.723-.406-.992ZM9.52 14.48a3.393 3.393 0 0 0 2.478 1.02c.965 0 1.8-.342 2.479-1.02a3.392 3.392 0 0 0 1.021-2.48c0-.963-.343-1.8-1.021-2.478A3.392 3.392 0 0 0 11.998 8.5c-.964 0-1.8.343-2.478 1.021A3.392 3.392 0 0 0 8.498 12c0 .964.344 1.8 1.022 2.479Z\"/></svg>') 12 12,auto}.unreal-container.pan{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.997 10.075a1.01 1.01 0 0 1-.738-.313 1.008 1.008 0 0 1-.312-.737V6.15l-.95.95a.998.998 0 0 1-.763.312 1.09 1.09 0 0 1-.763-.337 1.06 1.06 0 0 1-.324-.775c0-.3.108-.558.324-.775l2.776-2.775c.117-.116.237-.2.362-.25a1.04 1.04 0 0 1 .775 0c.125.05.246.134.363.25l2.8 2.8c.216.217.32.47.313.762a1.096 1.096 0 0 1-.338.763 1.058 1.058 0 0 1-.775.325c-.3 0-.558-.108-.775-.325l-.925-.925v2.875c0 .283-.104.53-.312.737a1.01 1.01 0 0 1-.738.313Zm0 11.5a1.04 1.04 0 0 1-.388-.075 1.103 1.103 0 0 1-.362-.25l-2.8-2.8a1.002 1.002 0 0 1-.313-.762c.009-.292.121-.546.337-.763.217-.217.475-.325.775-.325.3 0 .559.108.775.325l.926.925v-2.875c0-.283.104-.529.312-.737a1.01 1.01 0 0 1 .738-.313c.283 0 .529.104.738.313.208.208.312.454.312.737v2.875l.95-.95a.998.998 0 0 1 .762-.312c.292.008.546.12.763.337.216.217.324.475.324.775 0 .3-.108.559-.324.775l-2.775 2.775c-.117.116-.238.2-.363.25a1.04 1.04 0 0 1-.387.075Zm4.925-6.05a1.058 1.058 0 0 1-.326-.774c0-.3.109-.559.326-.776l.925-.925H14.97c-.283 0-.528-.104-.736-.312a1.01 1.01 0 0 1-.313-.738c0-.283.104-.53.313-.738.208-.208.453-.312.737-.312h2.875l-.95-.95a.998.998 0 0 1-.313-.762 1.09 1.09 0 0 1 .338-.764 1.06 1.06 0 0 1 .775-.324c.3 0 .558.108.775.324l2.774 2.776c.117.117.2.238.251.363a1.04 1.04 0 0 1 0 .775c-.05.124-.134.245-.25.362l-2.8 2.8c-.217.216-.471.32-.762.313a1.096 1.096 0 0 1-.763-.337Zm-11.4 0L2.746 12.75a1.103 1.103 0 0 1-.25-.362 1.04 1.04 0 0 1 0-.775c.05-.125.133-.246.25-.363l2.8-2.8c.216-.216.47-.32.762-.313.292.01.546.121.763.337.217.217.325.476.325.776 0 .3-.108.558-.325.775l-.925.925h2.875c.283 0 .529.104.737.312.208.209.313.455.313.738s-.105.53-.313.738a1.008 1.008 0 0 1-.737.312H6.147l.95.95c.217.217.32.471.312.762a1.09 1.09 0 0 1-.337.764 1.06 1.06 0 0 1-.775.324c-.3 0-.559-.108-.776-.324Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M9.22 7.912c.436.013.821-.15 1.13-.458l.097-.097v1.668c0 .422.16.793.458 1.09.298.299.67.46 1.092.46.422 0 .793-.161 1.091-.46.298-.297.459-.668.459-1.09V7.357l.071.072c.309.308.693.471 1.13.471.435 0 .82-.163 1.128-.471.301-.303.47-.676.483-1.102v-.001a1.501 1.501 0 0 0-.46-1.13l-2.799-2.8a1.6 1.6 0 0 0-.528-.36l-.003-.001a1.54 1.54 0 0 0-1.145 0l-.002.001a1.6 1.6 0 0 0-.529.36L8.118 5.172l-.001.001a1.56 1.56 0 0 0-.47 1.128c0 .435.163.82.47 1.128.303.303.676.472 1.103.484Zm0 0 .014-.5-.015.5Zm-1.311 6.865a1.497 1.497 0 0 0-.458-1.13l-.097-.097h1.668c.421 0 .793-.16 1.09-.458.298-.299.46-.67.46-1.092a1.51 1.51 0 0 0-.46-1.091 1.507 1.507 0 0 0-1.09-.459H7.354l.071-.072c.309-.308.472-.692.472-1.128 0-.436-.163-.82-.472-1.13a1.596 1.596 0 0 0-1.101-.482h-.002a1.501 1.501 0 0 0-1.129.459l-2.8 2.8a1.6 1.6 0 0 0-.36.528l-.001.003a1.54 1.54 0 0 0 0 1.144v.003c.081.2.208.375.362.529l2.774 2.775c.309.308.693.47 1.129.47.435 0 .82-.162 1.128-.47.303-.302.472-.676.484-1.102Zm0 0-.5-.014.5.015v-.001Zm3.038-8.627-.5.5.5.207V6.15Zm.475 15.814.002.001a1.54 1.54 0 0 0 1.145 0h.002c.2-.081.375-.208.53-.362l2.775-2.774a1.56 1.56 0 0 0 .47-1.129c0-.435-.162-.82-.47-1.128a1.589 1.589 0 0 0-1.103-.484 1.497 1.497 0 0 0-1.13.458l-.096.097v-1.668c0-.421-.161-.793-.459-1.09a1.509 1.509 0 0 0-1.091-.46c-.422 0-.794.161-1.092.46a1.507 1.507 0 0 0-.458 1.09v1.668l-.072-.072a1.558 1.558 0 0 0-1.129-.471c-.436 0-.82.163-1.128.471l-.001.001c-.301.302-.47.675-.483 1.101v.001c-.012.437.151.821.46 1.13l2.8 2.8c.153.153.328.28.528.36Zm5.146-6.085c.303.302.676.47 1.102.484a1.5 1.5 0 0 0 1.13-.46l2.8-2.8a1.6 1.6 0 0 0 .36-.528l.002-.003a1.54 1.54 0 0 0 0-1.144l-.001-.003a1.6 1.6 0 0 0-.361-.529l-2.774-2.775h-.001a1.56 1.56 0 0 0-1.128-.47c-.436 0-.82.162-1.128.47h-.001a1.59 1.59 0 0 0-.484 1.102c-.012.437.15.822.459 1.13l.097.097h-1.668c-.422 0-.793.16-1.09.459-.299.298-.46.67-.46 1.091 0 .422.161.793.46 1.092.297.297.668.458 1.09.458h1.668l-.072.072a1.558 1.558 0 0 0-.472 1.129c0 .435.164.82.472 1.128ZM6.147 13.05l.5.5.207-.5h-.707Z\"/></svg>') 12 12,auto}.unreal-container.dolly{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><mask id=\"a\" width=\"24\" height=\"24\" x=\"0\" y=\"0\" maskUnits=\"userSpaceOnUse\" style=\"mask-type:alpha\"><path fill=\"%23127392\" d=\"M0 0h24v24H0z\"/></mask><g mask=\"url(%23a)\"><path fill=\"%23000\" d=\"M12.002 20.575a1.026 1.026 0 0 1-.75-.325l-2.55-2.55a.933.933 0 0 1-.287-.713c.008-.275.113-.513.313-.713.2-.2.441-.3.725-.3.283 0 .524.1.724.3l.776.776V6.95l-.8.8c-.2.2-.438.296-.712.288a1.018 1.018 0 0 1-.713-.312c-.2-.2-.3-.442-.3-.726s.1-.525.3-.725l2.524-2.525a1.026 1.026 0 0 1 1.5 0l2.55 2.55c.2.2.296.438.289.713a1.023 1.023 0 0 1-.314.713c-.2.2-.441.3-.724.3a.988.988 0 0 1-.725-.3l-.775-.776v10.1l.8-.8c.2-.2.437-.296.712-.288.275.008.512.112.712.312.2.2.3.442.3.726s-.1.525-.3.725l-2.524 2.525a1.026 1.026 0 0 1-.75.325Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M13.553 8.153c.28.245.62.373 1 .373.415 0 .784-.153 1.078-.447.287-.287.446-.644.46-1.05v-.002a1.432 1.432 0 0 0-.435-1.08l-2.55-2.55-.354.353.354-.354a1.526 1.526 0 0 0-2.207 0L8.374 5.921A1.487 1.487 0 0 0 7.928 7c0 .416.152.785.446 1.08.288.287.645.446 1.052.457l4.127-.384Zm0 0v7.693m0-7.693a1.667 1.667 0 0 1-.079-.074l-3.021.075v7.693a1.482 1.482 0 0 0-1-.373c-.416 0-.785.153-1.079.447a1.522 1.522 0 0 0-.46 1.05v.002c-.011.417.14.786.435 1.08l2.55 2.55a1.527 1.527 0 0 0 2.207 0l2.525-2.524c.294-.294.446-.663.446-1.079 0-.416-.152-.785-.446-1.08a1.518 1.518 0 0 0-1.052-.457m0 0-.014.5.014-.5Zm0 0a1.424 1.424 0 0 0-1.027.383m0 0a1.583 1.583 0 0 0-.053.05l.354.354m-.3-.404v.104l.3.3m0 0-.3-.3v.6l.3-.3Z\"/></g></svg>%0A') 12 12,auto}.unreal-container.disabled:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#playerUI{position:absolute;z-index:10;width:100%}#statsContainer{display:none;text-align:left;background-color:#000c}#stats{padding:6px;font-weight:700;font-size:14px;color:#0f0}canvas{position:absolute;image-rendering:crisp-edges}#overlay{position:absolute;top:0;right:2%;z-index:100;padding:4px;border-top-width:0;-webkit-border-bottom-right-radius:5px;-moz-border-radius-bottomright:5px;border-bottom-right-radius:5px;-webkit-border-bottom-left-radius:5px;-moz-border-radius-bottomleft:5px;border-bottom-left-radius:5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}.overlay{font-weight:lighter;font-family:var(--src-font-family-body)}#overlayButton:hover{cursor:pointer}#overlayButton{font-size:40px;text-align:right}#overlaySettings{display:none;width:300px;padding:4px}#videoMessageOverlay{position:absolute;z-index:20;width:100%;margin:auto;font-size:1.8em;font-family:var(--src-font-family-body)}#playButton{display:inline-block;height:auto}img#playButton{width:10%;max-width:241px}#UIInteraction{position:fixed}#UIInteractionButtonBoundary{padding:2px}#UIInteractionButton{cursor:pointer}#hiddenInput{position:absolute;left:-10%;width:0;opacity:0}#editTextButton{position:absolute;width:40px;height:40px}\n"] }]
|
|
7827
7731
|
}], ctorParameters: () => [], propDecorators: { useContainerAsSizeProvider: [{ type: i0.Input, args: [{ isSignal: true, alias: "useContainerAsSizeProvider", required: false }] }], isStudio: [{ type: i0.Input, args: [{ isSignal: true, alias: "isStudio", required: false }] }], resolutionSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "resolutionSize", required: false }] }], changeMouseOverScene: [{ type: i0.Output, args: ["changeMouseOverScene"] }], videoElement: [{ type: i0.ViewChild, args: ['videoContainer', { isSignal: true }] }], onMouseOver: [{
|
|
7828
7732
|
type: HostListener,
|
|
7829
7733
|
args: ['mouseover']
|
|
@@ -7835,185 +7739,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
7835
7739
|
args: ['contextmenu', ['$event']]
|
|
7836
7740
|
}] } });
|
|
7837
7741
|
|
|
7838
|
-
class FilterSettingsComponent {
|
|
7839
|
-
constructor() {
|
|
7840
|
-
this.storageKey = 'LBMFilterSettings';
|
|
7841
|
-
this.defaultFilterModel = { ...DefaultFilterModel };
|
|
7842
|
-
this.settings = { ...DefaultFilterModel };
|
|
7843
|
-
}
|
|
7844
|
-
ngOnInit() {
|
|
7845
|
-
const savedSettings = localStorage.getItem(this.storageKey);
|
|
7846
|
-
if (savedSettings) {
|
|
7847
|
-
this.dispatch(JSON.parse(savedSettings));
|
|
7848
|
-
}
|
|
7849
|
-
}
|
|
7850
|
-
togglePanel() {
|
|
7851
|
-
this.settings.panelOpen = !this.settings.panelOpen;
|
|
7852
|
-
this.saveSettings();
|
|
7853
|
-
}
|
|
7854
|
-
saveSettings() {
|
|
7855
|
-
const valid = Object.entries(this.settings).reduce((acc, [key, value]) => {
|
|
7856
|
-
return Truthy(value) ? { ...acc, [key]: value } : acc;
|
|
7857
|
-
}, {});
|
|
7858
|
-
this.dispatch({ ...DefaultFilterModel, ...valid });
|
|
7859
|
-
}
|
|
7860
|
-
dispatch(settings) {
|
|
7861
|
-
try {
|
|
7862
|
-
localStorage.setItem(this.storageKey, JSON.stringify(settings));
|
|
7863
|
-
}
|
|
7864
|
-
catch (e) {
|
|
7865
|
-
Logger.error('Storage not available, Error saving filter settings:', e);
|
|
7866
|
-
}
|
|
7867
|
-
Object.assign(this.settings, settings);
|
|
7868
|
-
Object.assign(FilterModel, settings);
|
|
7869
|
-
}
|
|
7870
|
-
reset() {
|
|
7871
|
-
this.dispatch({
|
|
7872
|
-
...DefaultFilterModel,
|
|
7873
|
-
panelOpen: this.settings.panelOpen,
|
|
7874
|
-
});
|
|
7875
|
-
}
|
|
7876
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: FilterSettingsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7877
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: FilterSettingsComponent, isStandalone: true, selector: "app-filter-settings", ngImport: i0, template: "<div class=\"settings-container\">\r\n <button (click)=\"togglePanel()\" class=\"gear-button\">LBM</button>\r\n @if (settings.panelOpen) {\r\n <div class=\"settings-panel\">\r\n <h3>LBM Trigger Settings</h3>\r\n <h5>Data Flow Monitor</h5>\r\n <form>\r\n <label>\r\n Monitoring delay:\r\n <input\r\n [(ngModel)]=\"settings.monitoringDelayTime\"\r\n [placeholder]=\"defaultFilterModel.monitoringDelayTime\"\r\n type=\"number\"\r\n name=\"monitoringDelayTime\"\r\n />\r\n </label>\r\n\r\n <label>\r\n Minimum Bitrate (kbit/s):\r\n <input\r\n [(ngModel)]=\"settings.minimumBitrate\"\r\n [placeholder]=\"defaultFilterModel.minimumBitrate\"\r\n type=\"number\"\r\n name=\"minimumBitrate\"\r\n />\r\n </label>\r\n <label>\r\n Yellow Flag (%):\r\n <input\r\n [(ngModel)]=\"settings.yellowFlag\"\r\n [placeholder]=\"defaultFilterModel.yellowFlag\"\r\n type=\"number\"\r\n name=\"yellowFlag\"\r\n />\r\n </label>\r\n <label>\r\n Red Flag (%):\r\n <input\r\n [(ngModel)]=\"settings.redFlag\"\r\n [placeholder]=\"defaultFilterModel.redFlag\"\r\n type=\"number\"\r\n name=\"redFlag\"\r\n />\r\n </label>\r\n <label>\r\n Minimum FPS:\r\n <input\r\n [(ngModel)]=\"settings.minimumFps\"\r\n [placeholder]=\"defaultFilterModel.minimumFps\"\r\n type=\"number\"\r\n name=\"minimumFps\"\r\n />\r\n </label>\r\n <hr />\r\n <h5>Kalman Filter</h5>\r\n <label>\r\n Initial Bitrate Estimate (kbit/s):\r\n <input\r\n [(ngModel)]=\"settings.initialBitrateEstimate\"\r\n [placeholder]=\"defaultFilterModel.initialBitrateEstimate\"\r\n type=\"number\"\r\n name=\"initialBitrateEstimate\"\r\n />\r\n </label>\r\n <label>\r\n Initial Error Covariance:\r\n <input\r\n [(ngModel)]=\"settings.initialErrorCovariance\"\r\n [placeholder]=\"defaultFilterModel.initialErrorCovariance\"\r\n type=\"number\"\r\n name=\"initialErrorCovariance\"\r\n />\r\n </label>\r\n <label>\r\n Process Noise (Q):\r\n <input\r\n [(ngModel)]=\"settings.processNoise\"\r\n [placeholder]=\"defaultFilterModel.processNoise\"\r\n type=\"number\"\r\n name=\"processNoise\"\r\n />\r\n </label>\r\n <label>\r\n Measurement Noise (R):\r\n <input\r\n [(ngModel)]=\"settings.measurementNoise\"\r\n [placeholder]=\"defaultFilterModel.measurementNoise\"\r\n type=\"number\"\r\n name=\"measurementNoise\"\r\n />\r\n </label>\r\n </form>\r\n <br />\r\n <br />\r\n <div class=\"apply-button-container\">\r\n <button (click)=\"reset()\">Reset</button>\r\n <button (click)=\"saveSettings()\">Apply</button>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".settings-container{position:absolute;top:65px;right:10px;z-index:1000}.gear-button{right:0;width:50px;position:absolute;cursor:pointer;font-size:10px;background:none;font-weight:500;border:1px solid;border-radius:9px;background:#0162cc;color:#fff;padding:4px}.gear-button>*{color:#e6f419;filter:drop-shadow(1px 1px 1px rgb(0,0,0))}.settings-panel{font-size:13px;background:#fff;border:1px solid #ccc;padding:15px;margin-top:25px;border-radius:4px;box-shadow:0 2px 8px #0003}.settings-panel h3{margin-top:0}.settings-panel form{display:flex;flex-direction:column}.settings-panel label{margin-bottom:10px;display:flex;flex-direction:column}.settings-panel input{padding:4px;margin-top:4px;border:1px solid #ccc;border-radius:2px}.apply-button-container{position:absolute;bottom:15px;right:15px}.apply-button-container button{padding:6px 12px;border:none;background-color:#1976d2;color:#fff;border-radius:4px;cursor:pointer;margin:2px}.apply-button-container button:hover{background-color:#1565c0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number]:not([ngNoCva])[formControlName],input[type=number]:not([ngNoCva])[formControl],input[type=number]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7878
|
-
}
|
|
7879
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: FilterSettingsComponent, decorators: [{
|
|
7880
|
-
type: Component,
|
|
7881
|
-
args: [{ selector: 'app-filter-settings', imports: [FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"settings-container\">\r\n <button (click)=\"togglePanel()\" class=\"gear-button\">LBM</button>\r\n @if (settings.panelOpen) {\r\n <div class=\"settings-panel\">\r\n <h3>LBM Trigger Settings</h3>\r\n <h5>Data Flow Monitor</h5>\r\n <form>\r\n <label>\r\n Monitoring delay:\r\n <input\r\n [(ngModel)]=\"settings.monitoringDelayTime\"\r\n [placeholder]=\"defaultFilterModel.monitoringDelayTime\"\r\n type=\"number\"\r\n name=\"monitoringDelayTime\"\r\n />\r\n </label>\r\n\r\n <label>\r\n Minimum Bitrate (kbit/s):\r\n <input\r\n [(ngModel)]=\"settings.minimumBitrate\"\r\n [placeholder]=\"defaultFilterModel.minimumBitrate\"\r\n type=\"number\"\r\n name=\"minimumBitrate\"\r\n />\r\n </label>\r\n <label>\r\n Yellow Flag (%):\r\n <input\r\n [(ngModel)]=\"settings.yellowFlag\"\r\n [placeholder]=\"defaultFilterModel.yellowFlag\"\r\n type=\"number\"\r\n name=\"yellowFlag\"\r\n />\r\n </label>\r\n <label>\r\n Red Flag (%):\r\n <input\r\n [(ngModel)]=\"settings.redFlag\"\r\n [placeholder]=\"defaultFilterModel.redFlag\"\r\n type=\"number\"\r\n name=\"redFlag\"\r\n />\r\n </label>\r\n <label>\r\n Minimum FPS:\r\n <input\r\n [(ngModel)]=\"settings.minimumFps\"\r\n [placeholder]=\"defaultFilterModel.minimumFps\"\r\n type=\"number\"\r\n name=\"minimumFps\"\r\n />\r\n </label>\r\n <hr />\r\n <h5>Kalman Filter</h5>\r\n <label>\r\n Initial Bitrate Estimate (kbit/s):\r\n <input\r\n [(ngModel)]=\"settings.initialBitrateEstimate\"\r\n [placeholder]=\"defaultFilterModel.initialBitrateEstimate\"\r\n type=\"number\"\r\n name=\"initialBitrateEstimate\"\r\n />\r\n </label>\r\n <label>\r\n Initial Error Covariance:\r\n <input\r\n [(ngModel)]=\"settings.initialErrorCovariance\"\r\n [placeholder]=\"defaultFilterModel.initialErrorCovariance\"\r\n type=\"number\"\r\n name=\"initialErrorCovariance\"\r\n />\r\n </label>\r\n <label>\r\n Process Noise (Q):\r\n <input\r\n [(ngModel)]=\"settings.processNoise\"\r\n [placeholder]=\"defaultFilterModel.processNoise\"\r\n type=\"number\"\r\n name=\"processNoise\"\r\n />\r\n </label>\r\n <label>\r\n Measurement Noise (R):\r\n <input\r\n [(ngModel)]=\"settings.measurementNoise\"\r\n [placeholder]=\"defaultFilterModel.measurementNoise\"\r\n type=\"number\"\r\n name=\"measurementNoise\"\r\n />\r\n </label>\r\n </form>\r\n <br />\r\n <br />\r\n <div class=\"apply-button-container\">\r\n <button (click)=\"reset()\">Reset</button>\r\n <button (click)=\"saveSettings()\">Apply</button>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".settings-container{position:absolute;top:65px;right:10px;z-index:1000}.gear-button{right:0;width:50px;position:absolute;cursor:pointer;font-size:10px;background:none;font-weight:500;border:1px solid;border-radius:9px;background:#0162cc;color:#fff;padding:4px}.gear-button>*{color:#e6f419;filter:drop-shadow(1px 1px 1px rgb(0,0,0))}.settings-panel{font-size:13px;background:#fff;border:1px solid #ccc;padding:15px;margin-top:25px;border-radius:4px;box-shadow:0 2px 8px #0003}.settings-panel h3{margin-top:0}.settings-panel form{display:flex;flex-direction:column}.settings-panel label{margin-bottom:10px;display:flex;flex-direction:column}.settings-panel input{padding:4px;margin-top:4px;border:1px solid #ccc;border-radius:2px}.apply-button-container{position:absolute;bottom:15px;right:15px}.apply-button-container button{padding:6px 12px;border:none;background-color:#1976d2;color:#fff;border-radius:4px;cursor:pointer;margin:2px}.apply-button-container button:hover{background-color:#1565c0}\n"] }]
|
|
7882
|
-
}] });
|
|
7883
|
-
|
|
7884
|
-
class LowBandwidthStateService {
|
|
7885
|
-
constructor() {
|
|
7886
|
-
this.#isLowBandwidth = signal(false, /* @ts-ignore */
|
|
7887
|
-
...(ngDevMode ? [{ debugName: "#isLowBandwidth" }] : /* istanbul ignore next */ []));
|
|
7888
|
-
this.isLowBandwidth = this.#isLowBandwidth.asReadonly();
|
|
7889
|
-
this.isLowBandwidth$ = toObservable(this.isLowBandwidth);
|
|
7890
|
-
}
|
|
7891
|
-
#isLowBandwidth;
|
|
7892
|
-
enterLowBandwidthMode() {
|
|
7893
|
-
this.#isLowBandwidth.set(true);
|
|
7894
|
-
}
|
|
7895
|
-
exitLowBandwidthMode() {
|
|
7896
|
-
this.#isLowBandwidth.set(false);
|
|
7897
|
-
}
|
|
7898
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: LowBandwidthStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
7899
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: LowBandwidthStateService, providedIn: 'root' }); }
|
|
7900
|
-
}
|
|
7901
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: LowBandwidthStateService, decorators: [{
|
|
7902
|
-
type: Injectable,
|
|
7903
|
-
args: [{ providedIn: 'root' }]
|
|
7904
|
-
}] });
|
|
7905
|
-
|
|
7906
|
-
class LowBandwidthDetectorComponent {
|
|
7907
|
-
constructor() {
|
|
7908
|
-
this.#store = inject(Store);
|
|
7909
|
-
this.dialog = inject(Dialog);
|
|
7910
|
-
this.destroyRef = inject(DestroyRef);
|
|
7911
|
-
this.videoService = inject(VideoService);
|
|
7912
|
-
this.lowBandwidthState = inject(LowBandwidthStateService);
|
|
7913
|
-
this.isDevMode = inject(DevModeService).isDevMode;
|
|
7914
|
-
this.viewportReady$ = this.#store.select(unrealFeature.selectViewportReady);
|
|
7915
|
-
this.isLowBandwidth$ = this.lowBandwidthState.isLowBandwidth$;
|
|
7916
|
-
this.lowBandwidthTrigger$ = this.isLowBandwidth$.pipe(distinctUntilChanged$1(), filter(Truthy));
|
|
7917
|
-
this.highBandwidthTrigger$ = this.isLowBandwidth$.pipe(distinctUntilChanged$1(), filter(Falsy));
|
|
7918
|
-
this.viewPortDestroyedTrigger$ = this.viewportReady$.pipe(distinctUntilChanged$1(), filter(Falsy));
|
|
7919
|
-
this.aggregatedStats$ = this.videoService.videoStats$.pipe(map((data) => data.aggregatedStats), share());
|
|
7920
|
-
this.nativeQuality$ = this.videoService.videoStats$.pipe(map((data) => data.quality));
|
|
7921
|
-
this.monitoringTrigger$ = this.viewportReady$
|
|
7922
|
-
.pipe(combineLatestWith(this.isLowBandwidth$), map(([viewPortReady, isLowBandwidth]) => viewPortReady && !isLowBandwidth))
|
|
7923
|
-
.pipe(share());
|
|
7924
|
-
this.reTrigger$ = this.monitoringTrigger$.pipe(map(() => ({ quality: 'lime' })));
|
|
7925
|
-
this.canSwitchToLowBand$ = this.monitoringTrigger$.pipe(debounceTime(100), switchMap((canSwitch) => concat(of(false), timer(FilterModel.monitoringDelayTime).pipe(map(() => canSwitch))).pipe(take(2), takeUntil$1(this.monitoringTrigger$))), distinctUntilChanged$1(), share());
|
|
7926
|
-
this.videoQuality$ = merge(this.nativeQuality$, this.reTrigger$).pipe(share(), takeUntil$1(this.viewPortDestroyedTrigger$));
|
|
7927
|
-
this.fps$ = this.aggregatedStats$.pipe(map((data) => data.framesPerSecond || 0));
|
|
7928
|
-
this.bitrateDrop$ = this.aggregatedStats$.pipe(map((data) => data.dataFlowCheckResult), filter((br) => br.isDropDetected), takeUntil$1(merge(this.viewPortDestroyedTrigger$, this.reTrigger$)));
|
|
7929
|
-
this.fps = toSignal(this.fps$, { initialValue: 0 });
|
|
7930
|
-
this.nativeQuality = toSignal(this.nativeQuality$);
|
|
7931
|
-
this.isLowBandwidth = this.lowBandwidthState.isLowBandwidth;
|
|
7932
|
-
this.aggregatedStats = toSignal(this.aggregatedStats$);
|
|
7933
|
-
this.isReducedQuality = signal(false, /* @ts-ignore */
|
|
7934
|
-
...(ngDevMode ? [{ debugName: "isReducedQuality" }] : /* istanbul ignore next */ []));
|
|
7935
|
-
this.isIndicatorExpanded = signal(false, /* @ts-ignore */
|
|
7936
|
-
...(ngDevMode ? [{ debugName: "isIndicatorExpanded" }] : /* istanbul ignore next */ []));
|
|
7937
|
-
this.isIndicatorExpandedTrigger$ = toObservable(this.isIndicatorExpanded).pipe(skip(1), distinctUntilChanged$1(), filter(Falsy));
|
|
7938
|
-
}
|
|
7939
|
-
#store;
|
|
7940
|
-
ngOnInit() {
|
|
7941
|
-
this.lowBandwidthTrigger$
|
|
7942
|
-
.pipe(takeUntilDestroyed(this.destroyRef))
|
|
7943
|
-
.subscribe(() => this.toggleIndicator(true));
|
|
7944
|
-
merge(this.viewPortDestroyedTrigger$, this.highBandwidthTrigger$)
|
|
7945
|
-
.pipe(takeUntilDestroyed(this.destroyRef))
|
|
7946
|
-
.subscribe(() => this.isReducedQuality.set(false));
|
|
7947
|
-
this.canSwitchToLowBand$
|
|
7948
|
-
.pipe(filter(Truthy), tap(() => {
|
|
7949
|
-
BITRATE_MONITOR.reset();
|
|
7950
|
-
this.isReducedQuality.set(false);
|
|
7951
|
-
}), switchMap(() => this.bitrateDrop$), tap(this.trySetLowBandwidth.bind(this)), map((dataFlowResult) => dataFlowResult?.isDropDetected), distinctUntilChanged$1(), tap(() => {
|
|
7952
|
-
this.isReducedQuality.set(true);
|
|
7953
|
-
}), switchMap(() => this.videoQuality$), filter((quality) => quality === 'lime'), tap(() => this.isReducedQuality.set(false)), takeUntilDestroyed(this.destroyRef))
|
|
7954
|
-
.subscribe();
|
|
7955
|
-
}
|
|
7956
|
-
trySetLowBandwidth(dataFlowResult) {
|
|
7957
|
-
// Evaluate FPS and native quality
|
|
7958
|
-
const isFpsLow = this.fps() < FilterModel.minimumFps;
|
|
7959
|
-
const isNativeQualityRed = this.nativeQuality() === 'red';
|
|
7960
|
-
const shouldSwitch = isNativeQualityRed || isFpsLow;
|
|
7961
|
-
// Exit if conditions are not met or already in low bandwidth
|
|
7962
|
-
if (!shouldSwitch || this.isLowBandwidth())
|
|
7963
|
-
return;
|
|
7964
|
-
const { quality, activeMedian } = dataFlowResult;
|
|
7965
|
-
const isQualityRed = quality === 'red';
|
|
7966
|
-
const isLowBitrate = activeMedian < FilterModel.minimumBitrate;
|
|
7967
|
-
// Final check for a red drop or low bitrate, or low FPS
|
|
7968
|
-
if (isQualityRed || isLowBitrate || isFpsLow) {
|
|
7969
|
-
let reason;
|
|
7970
|
-
if (isFpsLow) {
|
|
7971
|
-
reason = `FPS < ${FilterModel.minimumFps}`;
|
|
7972
|
-
}
|
|
7973
|
-
else if (quality === 'red') {
|
|
7974
|
-
reason = `Drop > ${FilterModel.redFlag}%`;
|
|
7975
|
-
}
|
|
7976
|
-
else {
|
|
7977
|
-
reason = `Speed < ${FilterModel.minimumBitrate}`;
|
|
7978
|
-
}
|
|
7979
|
-
Logger.info(`LBM DETECTED: ${reason}, switching to low bandwidth; `, dataFlowResult.message, {
|
|
7980
|
-
stats: {
|
|
7981
|
-
dataFlowResult,
|
|
7982
|
-
reason,
|
|
7983
|
-
triggerTime: this.aggregatedStats()?.runTime ?? 0,
|
|
7984
|
-
},
|
|
7985
|
-
});
|
|
7986
|
-
this.lowBandwidthState.enterLowBandwidthMode();
|
|
7987
|
-
}
|
|
7988
|
-
}
|
|
7989
|
-
toggleIndicator(value) {
|
|
7990
|
-
this.isIndicatorExpanded.set(value);
|
|
7991
|
-
if (value) {
|
|
7992
|
-
this.hideIndicatorAfterDelay();
|
|
7993
|
-
}
|
|
7994
|
-
}
|
|
7995
|
-
hideIndicatorAfterDelay() {
|
|
7996
|
-
timer(3000)
|
|
7997
|
-
.pipe(take(1), takeUntil$1(this.isIndicatorExpandedTrigger$))
|
|
7998
|
-
.subscribe(() => this.toggleIndicator(false));
|
|
7999
|
-
}
|
|
8000
|
-
openLBMDialog() {
|
|
8001
|
-
this.dialog
|
|
8002
|
-
.open(LowBandwidthModalComponent)
|
|
8003
|
-
.closed.pipe(filter(Truthy))
|
|
8004
|
-
.subscribe(() => {
|
|
8005
|
-
this.lowBandwidthState.exitLowBandwidthMode();
|
|
8006
|
-
this.toggleIndicator(false);
|
|
8007
|
-
});
|
|
8008
|
-
}
|
|
8009
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: LowBandwidthDetectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8010
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: LowBandwidthDetectorComponent, isStandalone: true, selector: "app-low-bandwidth-detector", ngImport: i0, template: "@if (isReducedQuality() || isLowBandwidth()) {\r\n <div\r\n [class.expanded]=\"isIndicatorExpanded() && isLowBandwidth()\"\r\n class=\"lbm-indicator freeze-loader\"\r\n >\r\n <button (click)=\"toggleIndicator(true)\" class=\"lbm-icon\" type=\"button\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 20 20\">\r\n <path\r\n fill=\"#85888E\"\r\n d=\"M7.189 3.605c-.73.145-1.438.35-2.126.614A14.412 14.412 0 0 0 .896 6.666a1.08 1.08 0 0 0-.375.844c0 .34.118.629.354.865s.524.36.865.375c.34.014.65-.09.927-.313a11.89 11.89 0 0 1 3.385-1.916 10.94 10.94 0 0 1 1.235-.375l-.098-2.541ZM7.385 8.708a9.107 9.107 0 0 0-2.906 1.48c-.264.194-.402.464-.416.812-.014.347.104.646.354.896.236.236.524.364.864.385.34.02.664-.073.97-.281.422-.29.878-.53 1.368-.721a2.545 2.545 0 0 1-.166-.814l-.068-1.757ZM12.386 11.267c.094-.25.15-.52.161-.802l.068-1.755a9.019 9.019 0 0 1 2.927 1.52c.264.193.4.46.406.801.007.34-.114.635-.364.885a1.213 1.213 0 0 1-.865.365A1.614 1.614 0 0 1 13.77 12a6.574 6.574 0 0 0-1.385-.733ZM12.713 6.146l.098-2.542c.73.146 1.438.351 2.127.615 1.541.59 2.93 1.406 4.166 2.447.25.223.379.5.386.834.007.333-.115.625-.365.875a1.253 1.253 0 0 1-.864.375c-.34.014-.65-.09-.927-.313a11.892 11.892 0 0 0-3.386-1.916 10.94 10.94 0 0 0-1.235-.375ZM8.813 16.187c.32.32.715.48 1.187.48.472 0 .868-.16 1.188-.48.32-.32.479-.715.479-1.187 0-.473-.16-.868-.48-1.188-.319-.32-.715-.479-1.187-.479-.472 0-.868.16-1.187.48-.32.319-.48.714-.48 1.187 0 .472.16.868.48 1.187Z\"\r\n />\r\n <path\r\n fill=\"#fff\"\r\n fill-rule=\"evenodd\"\r\n d=\"M10 .833c-.91 0-1.637.756-1.602 1.665l.304 7.92a1.299 1.299 0 0 0 2.596 0l.305-7.92A1.604 1.604 0 0 0 10 .833ZM8.813 16.187c.32.32.715.48 1.187.48.472 0 .868-.16 1.188-.48.32-.32.479-.715.479-1.187 0-.473-.16-.868-.48-1.188-.319-.32-.715-.479-1.187-.479-.472 0-.868.16-1.187.48-.32.319-.48.714-.48 1.187 0 .472.16.868.48 1.187Z\"\r\n clip-rule=\"evenodd\"\r\n />\r\n </svg>\r\n </button>\r\n\r\n <div\r\n [class.lbm-message--open]=\"isLowBandwidth() && isIndicatorExpanded()\"\r\n class=\"lbm-message\"\r\n >\r\n <p class=\"lbm-description\">\r\n Fluid Interactivity Modes were disabled due to an unstable connection.\r\n\r\n <button\r\n (click)=\"openLBMDialog()\"\r\n [attr.data-testid]=\"'learn-more-lbm'\"\r\n type=\"button\"\r\n class=\"lbm-learn-more\"\r\n >\r\n Learn more\r\n </button>\r\n </p>\r\n <button\r\n (click)=\"toggleIndicator(false)\"\r\n [attr.data-testid]=\"'close-lbm-indicator'\"\r\n type=\"button\"\r\n class=\"lbm-close\"\r\n >\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\"\r\n height=\"20\"\r\n viewBox=\"0 0 20 20\"\r\n fill=\"none\"\r\n >\r\n <path\r\n d=\"M10.0001 11.2289L6.68618 14.5428C6.51951 14.7095 6.31818 14.7895 6.08218 14.7828C5.84618 14.7755 5.64485 14.6885 5.47818 14.5218C5.31151 14.3552 5.22818 14.1505 5.22818 13.9078C5.22818 13.6645 5.31151 13.4595 5.47818 13.2928L8.77107 9.99992L5.45718 6.68603C5.29051 6.51936 5.21051 6.3147 5.21718 6.07203C5.22451 5.8287 5.31151 5.6237 5.47818 5.45703C5.64485 5.29036 5.84951 5.20703 6.09218 5.20703C6.33551 5.20703 6.54051 5.29036 6.70718 5.45703L10.0001 8.77092L13.314 5.45703C13.4806 5.29036 13.6853 5.20703 13.928 5.20703C14.1713 5.20703 14.3763 5.29036 14.543 5.45703C14.7096 5.6237 14.793 5.8287 14.793 6.07203C14.793 6.3147 14.7096 6.51936 14.543 6.68603L11.2291 9.99992L14.543 13.3138C14.7096 13.4805 14.793 13.6818 14.793 13.9178C14.793 14.1538 14.7096 14.3552 14.543 14.5218C14.3763 14.6885 14.1713 14.7718 13.928 14.7718C13.6853 14.7718 13.4806 14.6885 13.314 14.5218L10.0001 11.2289Z\"\r\n fill=\"white\"\r\n />\r\n </svg>\r\n </button>\r\n </div>\r\n </div>\r\n}\r\n\r\n@if (isDevMode) {\r\n <app-filter-settings />\r\n}\r\n", styles: [".freeze-loader,.lbm-indicator{--lbmPositionTop: 18px;--lbmPositionLeft: 18px;--lbmPositionRight: 18px;--lbmIndicatorSize: 36px;--lbmIndicatorBorderRadius: 8px;--lbmIndicatorCloseSize: 20px;--lbmPadding: 10px;--lbmTextSize: 13px;--lbmLineHeight: 20px;--lbmTextColor: #ffffff;--lbmBackgroundColor: rgba(17, 24, 39, .7);position:absolute;top:var(--lbmPositionTop);left:var(--lbmPositionLeft);z-index:10;display:flex;justify-content:center;align-items:flex-start;min-width:var(--lbmIndicatorSize);min-height:var(--lbmIndicatorSize);overflow:hidden}.freeze-loader.expanded,.lbm-indicator.expanded{--lbmPositionTop: 8px;--lbmPositionLeft: 8px;--lbmPositionRight: 8px;width:auto;max-width:calc(100% - var(--lbmPositionLeft) - var(--lbmPositionRight));padding:var(--lbmPadding);background:var(--lbmBackgroundColor);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--lbmIndicatorBorderRadius);gap:12px}.freeze-loader .lbm-icon,.lbm-indicator .lbm-icon{display:flex;width:var(--lbmIndicatorSize);height:var(--lbmIndicatorSize);padding:8px;color:#fff;background-color:var(--lbmBackgroundColor);border-radius:50%;flex-shrink:0;cursor:pointer}.freeze-loader .lbm-icon svg,.freeze-loader .lbm-icon img,.lbm-indicator .lbm-icon svg,.lbm-indicator .lbm-icon img{width:100%;height:100%}.freeze-loader .lbm-close,.lbm-indicator .lbm-close{position:absolute;top:0;right:0;width:var(--lbmIndicatorCloseSize);height:var(--lbmIndicatorCloseSize);background-color:transparent;border:none;padding:0;cursor:pointer}.freeze-loader .lbm-message,.lbm-indicator .lbm-message{position:relative;opacity:0;height:0;max-width:0;padding-right:24px;pointer-events:none;visibility:hidden;animation:closeMessage .3s forwards}.freeze-loader .lbm-message--open,.lbm-indicator .lbm-message--open{position:relative;visibility:visible;display:flex;align-items:center;align-self:center;pointer-events:all;gap:12px;max-width:fit-content;height:auto;opacity:1;animation:openMessage .3s forwards}.freeze-loader .lbm-description,.lbm-indicator .lbm-description{margin:0;font-size:var(--lbmTextSize);font-weight:400;line-height:var(--lbmLineHeight);color:var(--lbmTextColor)}.freeze-loader .lbm-learn-more,.lbm-indicator .lbm-learn-more{display:inline-flex;padding:0;font-size:var(--lbmTextSize);font-weight:400;line-height:var(--lbmLineHeight);color:var(--lbmTextColor);text-decoration-line:underline;background-color:transparent;border:none;cursor:pointer}.freeze-loader .lbm-learn-more:hover,.lbm-indicator .lbm-learn-more:hover{text-decoration:none}@keyframes openMessage{0%{opacity:0;max-width:0;height:0}10%{height:auto;max-width:fit-content}to{opacity:1;height:auto;max-width:fit-content}}@keyframes closeMessage{0%{opacity:1;max-width:fit-content}to{opacity:0;max-width:0}}\n"], dependencies: [{ kind: "component", type: FilterSettingsComponent, selector: "app-filter-settings" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
8011
|
-
}
|
|
8012
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: LowBandwidthDetectorComponent, decorators: [{
|
|
8013
|
-
type: Component,
|
|
8014
|
-
args: [{ selector: 'app-low-bandwidth-detector', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FilterSettingsComponent], template: "@if (isReducedQuality() || isLowBandwidth()) {\r\n <div\r\n [class.expanded]=\"isIndicatorExpanded() && isLowBandwidth()\"\r\n class=\"lbm-indicator freeze-loader\"\r\n >\r\n <button (click)=\"toggleIndicator(true)\" class=\"lbm-icon\" type=\"button\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 20 20\">\r\n <path\r\n fill=\"#85888E\"\r\n d=\"M7.189 3.605c-.73.145-1.438.35-2.126.614A14.412 14.412 0 0 0 .896 6.666a1.08 1.08 0 0 0-.375.844c0 .34.118.629.354.865s.524.36.865.375c.34.014.65-.09.927-.313a11.89 11.89 0 0 1 3.385-1.916 10.94 10.94 0 0 1 1.235-.375l-.098-2.541ZM7.385 8.708a9.107 9.107 0 0 0-2.906 1.48c-.264.194-.402.464-.416.812-.014.347.104.646.354.896.236.236.524.364.864.385.34.02.664-.073.97-.281.422-.29.878-.53 1.368-.721a2.545 2.545 0 0 1-.166-.814l-.068-1.757ZM12.386 11.267c.094-.25.15-.52.161-.802l.068-1.755a9.019 9.019 0 0 1 2.927 1.52c.264.193.4.46.406.801.007.34-.114.635-.364.885a1.213 1.213 0 0 1-.865.365A1.614 1.614 0 0 1 13.77 12a6.574 6.574 0 0 0-1.385-.733ZM12.713 6.146l.098-2.542c.73.146 1.438.351 2.127.615 1.541.59 2.93 1.406 4.166 2.447.25.223.379.5.386.834.007.333-.115.625-.365.875a1.253 1.253 0 0 1-.864.375c-.34.014-.65-.09-.927-.313a11.892 11.892 0 0 0-3.386-1.916 10.94 10.94 0 0 0-1.235-.375ZM8.813 16.187c.32.32.715.48 1.187.48.472 0 .868-.16 1.188-.48.32-.32.479-.715.479-1.187 0-.473-.16-.868-.48-1.188-.319-.32-.715-.479-1.187-.479-.472 0-.868.16-1.187.48-.32.319-.48.714-.48 1.187 0 .472.16.868.48 1.187Z\"\r\n />\r\n <path\r\n fill=\"#fff\"\r\n fill-rule=\"evenodd\"\r\n d=\"M10 .833c-.91 0-1.637.756-1.602 1.665l.304 7.92a1.299 1.299 0 0 0 2.596 0l.305-7.92A1.604 1.604 0 0 0 10 .833ZM8.813 16.187c.32.32.715.48 1.187.48.472 0 .868-.16 1.188-.48.32-.32.479-.715.479-1.187 0-.473-.16-.868-.48-1.188-.319-.32-.715-.479-1.187-.479-.472 0-.868.16-1.187.48-.32.319-.48.714-.48 1.187 0 .472.16.868.48 1.187Z\"\r\n clip-rule=\"evenodd\"\r\n />\r\n </svg>\r\n </button>\r\n\r\n <div\r\n [class.lbm-message--open]=\"isLowBandwidth() && isIndicatorExpanded()\"\r\n class=\"lbm-message\"\r\n >\r\n <p class=\"lbm-description\">\r\n Fluid Interactivity Modes were disabled due to an unstable connection.\r\n\r\n <button\r\n (click)=\"openLBMDialog()\"\r\n [attr.data-testid]=\"'learn-more-lbm'\"\r\n type=\"button\"\r\n class=\"lbm-learn-more\"\r\n >\r\n Learn more\r\n </button>\r\n </p>\r\n <button\r\n (click)=\"toggleIndicator(false)\"\r\n [attr.data-testid]=\"'close-lbm-indicator'\"\r\n type=\"button\"\r\n class=\"lbm-close\"\r\n >\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\"\r\n height=\"20\"\r\n viewBox=\"0 0 20 20\"\r\n fill=\"none\"\r\n >\r\n <path\r\n d=\"M10.0001 11.2289L6.68618 14.5428C6.51951 14.7095 6.31818 14.7895 6.08218 14.7828C5.84618 14.7755 5.64485 14.6885 5.47818 14.5218C5.31151 14.3552 5.22818 14.1505 5.22818 13.9078C5.22818 13.6645 5.31151 13.4595 5.47818 13.2928L8.77107 9.99992L5.45718 6.68603C5.29051 6.51936 5.21051 6.3147 5.21718 6.07203C5.22451 5.8287 5.31151 5.6237 5.47818 5.45703C5.64485 5.29036 5.84951 5.20703 6.09218 5.20703C6.33551 5.20703 6.54051 5.29036 6.70718 5.45703L10.0001 8.77092L13.314 5.45703C13.4806 5.29036 13.6853 5.20703 13.928 5.20703C14.1713 5.20703 14.3763 5.29036 14.543 5.45703C14.7096 5.6237 14.793 5.8287 14.793 6.07203C14.793 6.3147 14.7096 6.51936 14.543 6.68603L11.2291 9.99992L14.543 13.3138C14.7096 13.4805 14.793 13.6818 14.793 13.9178C14.793 14.1538 14.7096 14.3552 14.543 14.5218C14.3763 14.6885 14.1713 14.7718 13.928 14.7718C13.6853 14.7718 13.4806 14.6885 13.314 14.5218L10.0001 11.2289Z\"\r\n fill=\"white\"\r\n />\r\n </svg>\r\n </button>\r\n </div>\r\n </div>\r\n}\r\n\r\n@if (isDevMode) {\r\n <app-filter-settings />\r\n}\r\n", styles: [".freeze-loader,.lbm-indicator{--lbmPositionTop: 18px;--lbmPositionLeft: 18px;--lbmPositionRight: 18px;--lbmIndicatorSize: 36px;--lbmIndicatorBorderRadius: 8px;--lbmIndicatorCloseSize: 20px;--lbmPadding: 10px;--lbmTextSize: 13px;--lbmLineHeight: 20px;--lbmTextColor: #ffffff;--lbmBackgroundColor: rgba(17, 24, 39, .7);position:absolute;top:var(--lbmPositionTop);left:var(--lbmPositionLeft);z-index:10;display:flex;justify-content:center;align-items:flex-start;min-width:var(--lbmIndicatorSize);min-height:var(--lbmIndicatorSize);overflow:hidden}.freeze-loader.expanded,.lbm-indicator.expanded{--lbmPositionTop: 8px;--lbmPositionLeft: 8px;--lbmPositionRight: 8px;width:auto;max-width:calc(100% - var(--lbmPositionLeft) - var(--lbmPositionRight));padding:var(--lbmPadding);background:var(--lbmBackgroundColor);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--lbmIndicatorBorderRadius);gap:12px}.freeze-loader .lbm-icon,.lbm-indicator .lbm-icon{display:flex;width:var(--lbmIndicatorSize);height:var(--lbmIndicatorSize);padding:8px;color:#fff;background-color:var(--lbmBackgroundColor);border-radius:50%;flex-shrink:0;cursor:pointer}.freeze-loader .lbm-icon svg,.freeze-loader .lbm-icon img,.lbm-indicator .lbm-icon svg,.lbm-indicator .lbm-icon img{width:100%;height:100%}.freeze-loader .lbm-close,.lbm-indicator .lbm-close{position:absolute;top:0;right:0;width:var(--lbmIndicatorCloseSize);height:var(--lbmIndicatorCloseSize);background-color:transparent;border:none;padding:0;cursor:pointer}.freeze-loader .lbm-message,.lbm-indicator .lbm-message{position:relative;opacity:0;height:0;max-width:0;padding-right:24px;pointer-events:none;visibility:hidden;animation:closeMessage .3s forwards}.freeze-loader .lbm-message--open,.lbm-indicator .lbm-message--open{position:relative;visibility:visible;display:flex;align-items:center;align-self:center;pointer-events:all;gap:12px;max-width:fit-content;height:auto;opacity:1;animation:openMessage .3s forwards}.freeze-loader .lbm-description,.lbm-indicator .lbm-description{margin:0;font-size:var(--lbmTextSize);font-weight:400;line-height:var(--lbmLineHeight);color:var(--lbmTextColor)}.freeze-loader .lbm-learn-more,.lbm-indicator .lbm-learn-more{display:inline-flex;padding:0;font-size:var(--lbmTextSize);font-weight:400;line-height:var(--lbmLineHeight);color:var(--lbmTextColor);text-decoration-line:underline;background-color:transparent;border:none;cursor:pointer}.freeze-loader .lbm-learn-more:hover,.lbm-indicator .lbm-learn-more:hover{text-decoration:none}@keyframes openMessage{0%{opacity:0;max-width:0;height:0}10%{height:auto;max-width:fit-content}to{opacity:1;height:auto;max-width:fit-content}}@keyframes closeMessage{0%{opacity:1;max-width:fit-content}to{opacity:0;max-width:0}}\n"] }]
|
|
8015
|
-
}] });
|
|
8016
|
-
|
|
8017
7742
|
/**
|
|
8018
7743
|
* Registers the Unreal NgRx feature state. Call this ONCE at the application
|
|
8019
7744
|
* root.
|
|
@@ -8060,5 +7785,5 @@ function provideUnrealModule() {
|
|
|
8060
7785
|
* Generated bundle index. Do not edit.
|
|
8061
7786
|
*/
|
|
8062
7787
|
|
|
8063
|
-
export { AFKService, AUTO_HIGH_RESOLUTION_IDLE_MS, AfkTimeoutModalComponent, AggregatorService, AnalyticsService, AnswerHandler, CommandTelemetryService, ConfigHandler, ConsoleExtensionsService, ControlScheme, DATA_CHANNEL_CONNECTION_TIMEOUT, DEBOUNCE_TO_MANY_RESIZE_CALLS, DEFAULT_AFK_TIMEOUT, DEFAULT_AFK_TIMEOUT_PERIOD, DESTROY_DISCONNECT_REASONS,
|
|
7788
|
+
export { AFKService, AUTO_HIGH_RESOLUTION_IDLE_MS, AfkTimeoutModalComponent, AggregatorService, AnalyticsService, AnswerHandler, CommandTelemetryService, ConfigHandler, ConsoleExtensionsService, ControlScheme, DATA_CHANNEL_CONNECTION_TIMEOUT, DEBOUNCE_TO_MANY_RESIZE_CALLS, DEFAULT_AFK_TIMEOUT, DEFAULT_AFK_TIMEOUT_PERIOD, DESTROY_DISCONNECT_REASONS, DevModeService, DisconnectReason, FULL_HD_HEIGHT, FULL_HD_WIDTH, FileHandlerService, FileReceiverService, FpsMonitorService, FreezeFrameComponent, FreezeFrameService, INNER_RETRY_LIMIT, IceCandidateHandler, ImageLoadingSrcComponent, InputOptions, InputService, InstanceReadyHandler, InstanceReservedHandler, IntroSrcComponent, LatencyTimings, LoadingProgressService, MINIMAL_FPS, MIN_CONTAINER_SIZE, MessageType, MouseButton, MouseButtonsMask, OUTER_RETRY_DELAY, OnCloseHandler, OnErrorHandler, OnMessageHandler, OnOpenHandler, OrchestrationMessageTypes, POLLING_TIME, PingHandler, PlayerCountHandler, RECONNECT_CONFIG, REGION_PING_ACCURATE_SAMPLES, REGION_PING_BACKGROUND_REFRESH_DELAY_MS, REGION_PING_CACHE_KEY, REGION_PING_CACHE_TTL_MS, REGION_PING_WARMUP_DEADLINE_MS, RegionsPingService, SAME_SIZE_THRESHOLD, SCREEN_LOCKER_CONTAINER_ID, SIGNALLING_PERCENT_VALUE, SSInfoHandler, STREAMING_AUDIO_ID, STREAMING_VIDEO_ID, SafePipe, SignallingService, SpecialKeyCodes, StatGraphComponent, StreamAdoptionService, StreamStatusTelemetryService, StreamStatusTelemetryService2, SubService, ToClientMessage, UNREAL_CONFIG, UnrealCallbackService, UnrealCommunicatorService, UnrealEffects, UnrealSceneComponent, UnrealStatusMessage, VideoService, VideoStatsComponent, WSCloseCode_CIRRUS_ABNORMAL_CLOSURE, WSCloseCode_CIRRUS_MAX_PLAYERS_ERROR, WSCloseCode_CIRRUS_PLAYER_DISCONNECTED, WSCloseCode_CIRRUS_STREAMER_KIKED_PLAYER, WSCloseCode_FORCE_CIRRUS_CLOSE, WSCloseCode_NORMAL_AFK_TIMEOUT, WSCloseCode_NORMAL_CLOSURE, WSCloseCode_NORMAL_MANUAL_DISCONNECT, WSCloseCode_UNKNOWN, WSCloseCodes, WS_OPEN_STATE, WS_RETRY_PER_INSTANCE, WS_TIMEOUT, WebRtcPlayerService, WebrtcErrorModalComponent, abortEstablishingConnection, answerSent, changeStatusMainVideoOnScene, changeStreamResolutionAction, commandCompleted, commandStarted, dataChannelConnected, dataChannelReady, decodeData, destroyRemoteConnections, destroyUnrealScene, disconnectStream, dispatchResize, dropConnection, dropDC, dropPC, floatToPercents, floatToSmoothPercents, forceResizeViewport, fromResizeObserver, getActiveUrl, getImageFromVideoStream, getResizeStudioValues, getResizeValuesUniversal, getRtcErrorMessage, iceConnectionFailed, initSignalling, instanceReady, keepMaxUntilReset, makeEven, pollingEnded, pollingStarted, provideUnrealModule, provideUnrealState, qpToQuality, reconnectPeer, reconnectPeerFailed, reconnectPeerSuccess, regionPingFetchEnd, regionPingFetchStart, regionResolved, resetAfk, resetConfig, resetDataChannelForReconnect, resetIntroSrc, resetUserInactivityTimeout, resetWarnTimeout, saveAnalyticsEvent, selectCirrusConnectionId, selectClientAndViewIds, selectCommandProgress, selectFreezeFrameCombinedDataUrl, selectFreezeFrameDataUrl, selectFreezeFrameDataUrlFromVideo, selectFreezeFrameProgressMessageFromVideo, selectIsAutostart, selectIsExistMatchUrls, selectIsFreezeFrameLoading, selectIsFullyConnected, selectIsLoaderScreenVisible, selectIsVideoPlayingAndDataChannelConnected, selectShowLoader, selectShowReconnectPopup, selectSignalingParameters, selectStreamConfig, selectTotalProgress, selectUserInactivityDetected, selectWarnTimeout, setAfkTimerCountdown, setAfkTimerHide, setAfkTimerVisible, setAwsInstance, setCirrusConnected, setCirrusDisconnected, setConfig, setEstablishingConnection, setFreezeFrame, setFreezeFrameFromVideo, setIntroImageSrc, setIntroVideoSrc, setLoadingImageSrc, setLoopBackCommandIsCompleted, setMaxFps, setOrchestrationContext, setOrchestrationMessage, setOrchestrationParameters, setOrchestrationProgress, setSignalingName, setStatusMessage, setStatusPercentSignallingServer, setStreamClientCompanyId, setStreamViewId, setUnrealPlaywrightConfig, setUserInactivityTimeout, setViewportNotReady, setViewportReady, showLoadingProgress, showResumeStreamPopup, showUnrealErrorMessage, showUserInactivityTimeoutPopup, signalingRetryAttempted, smoothTransition, startStream, streamAdopted, trackMixpanelEvent, trackTelemetryData, uint8ToBase64, unrealCommandCallback, unrealFeature, unrealReducer, updateCirrusInfo, videoAdaptedToContainer, videoStreamInitialized };
|
|
8064
7789
|
//# sourceMappingURL=3dsource-angular-unreal-module.mjs.map
|