@3dsource/angular-unreal-module 0.0.146-dev.1 → 0.0.146-dev.11

package/fesm2022/3dsource-angular-unreal-module.mjs

@@ -4,7 +4,7 @@ import { SourceButtonComponent, SourceLoadingComponent } from '@3dsource/source-
 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, ignoreElements, shareReplay, NEVER, asyncScheduler, filter as filter$1, withLatestFrom as withLatestFrom$1, Subscription, bufferTime, combineLatestWith, distinctUntilChanged as distinctUntilChanged$1 } from 'rxjs';
 import { createAction, props, createReducer, on, createFeature, Store, createSelector, provideState } from '@ngrx/store';
 import { whereNot, Falsy, Logger, calculateMedian, clampf, lerp, getCanvasCached, getSnapshot, fitIntoRectangle, generateUuid, Truthy, tapLog, Semaphore, COLOR_CODES, where, KeyboardNumericCode, InvertedKeyMap, HEXtoRGB, RGBtoHSV, inverseLerp, HSVtoRGB, RGBtoHEX, fpIsASameAsB } from '@3dsource/utils';
-import { filter, map as map$1, distinctUntilChanged, takeWhile, takeUntil, catchError, tap, timeout, finalize, first, switchMap as switchMap$1, last, withLatestFrom, exhaustMap, debounceTime as debounceTime$1, take as take$1, startWith as startWith$1 } from 'rxjs/operators';
+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';
 import { Actions, ofType, createEffect, provideEffects } from '@ngrx/effects';
 import { concatLatestFrom } from '@ngrx/operators';
 import { DialogRef, DIALOG_DATA, Dialog } from '@angular/cdk/dialog';
@@ -444,6 +444,7 @@ const initialState = {
     isAfkTimerVisible: false,
     afkCountdown: 0,
     cirrusConnected: false,
+    adopted: false,
     establishingConnection: false,
     isReconnecting: false,
     viewportReady: false,
@@ -580,7 +581,11 @@ const unrealReducer = createReducer(initialState, on(changeStatusMainVideoOnScen
         },
     };
 }), on(initSignalling, (state) => {
-    return { ...state, disconnectReason: DisconnectReason.None };
+    return {
+        ...state,
+        adopted: false,
+        disconnectReason: DisconnectReason.None,
+    };
 }), on(reconnectPeerSuccess, (state) => {
     return { ...state, isReconnecting: false };
 }), on(setSignalingName, (state, { instanceName }) => {
@@ -647,6 +652,7 @@ const unrealReducer = createReducer(initialState, on(changeStatusMainVideoOnScen
     return {
         ...state,
         cirrusConnected: true,
+        adopted: true,
         ssData: ssData ?? state.ssData,
         awsInstance: {
             ...state.awsInstance,
@@ -677,6 +683,7 @@ const unrealReducer = createReducer(initialState, on(changeStatusMainVideoOnScen
     return {
         ...state,
         cirrusConnected: false,
+        adopted: false,
         dataChannelConnected: false,
         viewportReady: false,
         isVideoPlaying: false,
@@ -1670,6 +1677,10 @@ class RegionsPingService {
      * entry is well-formed and still within {@link REGION_PING_CACHE_TTL_MS}.
      * All access is guarded — `localStorage` can throw (private mode, disabled
      * storage) or be absent (non-browser).
+     *
+     * Public so adopted connections (which skip `getFastest`) can replay the
+     * region-resolving telemetry phase from the same cached winner — see
+     * `UnrealEffects.regionTelemetryOnAdopt$`.
      */
     readCachedWinner() {
         try {
@@ -3578,8 +3589,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });
 
-// How often to re-check `window.__stream.state` while a prefetch is connecting.
-const ADOPT_POLL_MS = 100;
 /**
  * Adopts a WebRTC connection prefetched by the `stream-prefetch.js` head-script
  * and parked on `window.__stream`, instead of running `connectToSignaling` from
@@ -3598,26 +3607,64 @@ class StreamAdoptionService {
      *
      * - nothing parked → emit `false` at once (caller connects normally).
      * - already settled (`ready`/`failed`/`adopted`) → adopt-if-ready at once.
-     * - still `connecting` → poll until it settles, then adopt-if-ready. Bounded
-     *   by `timeoutMs` so a stuck prefetch can't block the fallback forever.
+     * - still `connecting` → wait for the script's `onSettled` callback and
+     *   adopt-if-ready the instant it fires (event-driven, zero polling latency).
      *
-     * Emits exactly once. Cancel by unsubscribing (the effect does this on
-     * teardown via `takeUntil`) — no adoption runs after cancellation, which is
-     * what stops a fast route-switch from starting overlapping connections.
+     * Deliberately NO time budget: for DIRECT orchestration the prefetch holds
+     * the socket open while the orchestrator provisions a machine, which can take
+     * minutes (150–200s+). A fixed deadline would make Angular give up and open a
+     * second connection mid-provisioning — exactly the race/orphan this avoids.
+     * The wait is bounded by liveness instead: the script flips the parked state
+     * to `failed` on a dead socket (`ws.onclose`/`onerror`), and the caller wraps
+     * this in `takeUntil(abortEstablishingConnection)`, so a route change / teardown
+     * cancels it. Emits exactly once. Cancelling runs no adoption — which is what
+     * stops a fast route-switch from starting overlapping connections.
+     *
+     * Wrapped in `defer` so the `tryAdopt()` side effect (which dispatches
+     * `streamAdopted`) runs at SUBSCRIPTION time, not when the observable is
+     * built. The effect prepends `startWith(setEstablishingConnection(true))`,
+     * which starts the telemetry session and subscribes its phase catalog; that
+     * must happen BEFORE `streamAdopted` → `regionTelemetryOnAdopt$` replays
+     * `regionResolved`, or the region phase fires into a session that doesn't
+     * exist yet and is lost. `defer` guarantees that ordering.
      */
-    awaitAndAdopt$(timeoutMs) {
-        const parked = window.__stream;
-        if (!parked) {
-            return of(false);
-        }
-        if (parked.state !== 'connecting') {
-            return of(this.tryAdopt());
-        }
-        Logger.info('[Adoption] Prefetch in progress — waiting before connecting');
-        return timer(0, ADOPT_POLL_MS).pipe(map$1(() => window.__stream?.state ?? 'failed'), 
-        // Keep polling while still connecting AND within budget; the `true`
-        // (inclusive) emits the settling value (or the last one at the deadline).
-        takeWhile((state, i) => state === 'connecting' && i * ADOPT_POLL_MS < timeoutMs, true), last(), map$1(() => this.tryAdopt()));
+    awaitAndAdopt$() {
+        return defer(() => {
+            const parked = window.__stream;
+            if (!parked) {
+                return of(false);
+            }
+            if (parked.state !== 'connecting') {
+                return of(this.tryAdopt());
+            }
+            Logger.info('[Adoption] Prefetch in progress — waiting before connecting');
+            return this.awaitSettled$(parked);
+        });
+    }
+    /**
+     * Event-driven wait: the script fires `onSettled` the instant it parks
+     * `ready`/`failed`, so we adopt with zero polling lag. Emits exactly once.
+     *
+     * No timer/budget by design: an indefinitely `connecting` stream is valid
+     * (DIRECT orchestration holds the socket open for minutes while it
+     * provisions), and every terminal state — including a dead socket — flips to
+     * `ready`/`failed` and fires the hook. Teardown (route change → unsubscribe)
+     * sets `done`, so a late callback after cancel can't trigger a stray adoption.
+     */
+    awaitSettled$(parked) {
+        return new Observable((subscriber) => {
+            let done = false;
+            parked.onSettled(() => {
+                if (done)
+                    return;
+                done = true;
+                subscriber.next(this.tryAdopt());
+                subscriber.complete();
+            });
+            return () => {
+                done = true;
+            };
+        });
     }
     /**
      * @returns `true` if a ready parked stream was adopted (caller must NOT
@@ -3638,7 +3685,7 @@ class StreamAdoptionService {
             return false;
         }
         Logger.info('[Adoption] Adopting prefetched stream', parked.timings);
-        // Stop the script's watchdog and mark the handoff complete.
+        // Clear the script's timers and mark the handoff complete.
         parked.adopt();
         // Flag cirrus connected (so a later `initSignalling` won't open a 2nd
         // connection), record the adopted machine, and hydrate the streamer info
@@ -3649,6 +3696,7 @@ class StreamAdoptionService {
         this.store.dispatch(streamAdopted({
             machineId: parked.machineId ?? null,
             ssData: parked.ssData ?? null,
+            timings: parked.timings ?? null,
         }));
         // Hand the live socket over without re-sending `requestStream`, reusing the
         // script's correlationId (the one `requestStream` was already sent with).
@@ -4197,9 +4245,7 @@ class UnrealEffects {
             // connection; otherwise fall back to a fresh signalling connection.
             // `takeUntil(abort)` cancels the wait on teardown / route change so a
             // fast switch can't leave overlapping connections.
-            this.streamAdoptionService
-                .awaitAndAdopt$(this.dataChannelConnectionTimeout)
-                .pipe(switchMap((adopted) => adopted ? EMPTY : this.signallingService.connectToSignaling(urls)), takeUntil(this.actions$.pipe(ofType(abortEstablishingConnection))), 
+            this.streamAdoptionService.awaitAndAdopt$().pipe(switchMap((adopted) => adopted ? EMPTY : this.signallingService.connectToSignaling(urls)), takeUntil(this.actions$.pipe(ofType(abortEstablishingConnection))), 
             // The adopt/connect stream is side-effect-only (its values aren't
             // actions) — swallow them, and emit `setEstablishingConnection`
             // first so the reconnect/resume popup stays hidden during the
@@ -5508,6 +5554,19 @@ const QP_RED_THRESHOLD = 35;
 const FPS_LOW_RATIO = 0.7; // p50 fps below 70% of target
 const UNLIMITED_REFERENCE_FPS = 60;
 const SAMPLE_WINDOW_MS = 5000;
+/**
+ * Catalog phase ids the prefetch establishes invisibly. For an adopted
+ * connection their live closers are suppressed and the phases are emitted by
+ * {@link StreamStatusTelemetryService2.emitAdoptedConnection} instead, timed
+ * from the prefetch's own marks and anchored at the moment Angular reached the
+ * connect call (session start) — so the waterfall shows the time the prefetch
+ * actually SAVED, not the prefetch's page-load-parallel raw timeline.
+ */
+const PREFETCHED_PHASE_IDS = new Set([
+    'region-resolving',
+    'signaling-connection',
+    'webrtc-negotiation',
+]);
 // Persistent per-browser identifier — survives page reloads. Used to group
 // multiple sessions of the same anonymous user for funnel / retention analysis.
 const USER_ID_STORAGE_KEY = 'source3d.streamTelemetry.userId';
@@ -5538,6 +5597,17 @@ class StreamStatusTelemetryService2 {
         this.disconnectReason$ = this.store.selectSignal(unrealFeature.selectDisconnectReason);
         this.errorMessage$ = this.store.selectSignal(unrealFeature.selectErrorMessage);
         this.viewPortReady$ = this.store.selectSignal(unrealFeature.selectViewportReady);
+        /**
+         * Synchronous adoption flag. The `streamAdopted` reducer sets it BEFORE any
+         * action subscriber runs, so the connection-phase closers (which fire inside
+         * the same dispatch, e.g. `ssinfo-received` off the `ssData` state change)
+         * can read it and defer to the prefetch-timed attribution emitted by
+         * {@link emitAdoptedConnection} instead of recording the live wall-clock.
+         */
+        this.adopted$ = this.store.selectSignal(unrealFeature.selectAdopted);
+        /** Streamer identity for the adopted signaling phase params. */
+        this.ssData$ = this.store.selectSignal(unrealFeature.selectSsData);
+        this.awsInstance$ = this.store.selectSignal(unrealFeature.selectAwsInstance);
         this.session = null;
         /**
          * Whether a session has already started during the current page lifetime.
@@ -5615,7 +5685,10 @@ class StreamStatusTelemetryService2 {
                     // CLOSER — the `regionResolved` action carries the raw ping
                     // samples (one per probe) from `RegionsPingService`; the
                     // catalog flattens them to a comma-separated string since
-                    // `toPhaseParams` only accepts primitives.
+                    // `toPhaseParams` only accepts primitives. Adopted connections never
+                    // run `getRegion`, but `UnrealEffects.regionTelemetryOnAdopt$` replays
+                    // the region waterfall (start → end → resolved) from the cached winner,
+                    // so this phase still appears with its ping samples.
                     {
                         id: 'region-resolved',
                         event: this.actions$.pipe(ofType(regionResolved), take(1), map(({ region, pingsMs }) => ({
@@ -5927,6 +6000,13 @@ class StreamStatusTelemetryService2 {
                     if (!this.session)
                         return;
                     if (isCloser) {
+                        // Adopted connections receive the region / signaling / webrtc
+                        // phases from `emitAdoptedConnection` (timed from the prefetch's
+                        // own marks). Skip the live closer for those, so the whole
+                        // pre-adoption wait isn't dumped onto whichever connection closer
+                        // happens to fire first at the adoption instant.
+                        if (this.adopted$() && PREFETCHED_PHASE_IDS.has(bucket.id))
+                            return;
                         this.emitPhaseEnded(bucket, bucketIdx, value);
                         return;
                     }
@@ -5937,6 +6017,12 @@ class StreamStatusTelemetryService2 {
                 }));
             });
         });
+        // Adopted connection: emit the region / signaling / webrtc phases timed
+        // from the prefetch marks, anchored at session start (see method doc). The
+        // live closers for these phases are suppressed (PREFETCHED_PHASE_IDS).
+        sub.add(this.actions$
+            .pipe(ofType(streamAdopted))
+            .subscribe(({ timings }) => this.emitAdoptedConnection(timings)));
         const bootstrapInfo = this.collectBootstrapInfo();
         this.emitLifecycle('stream.session_started', {
             sessionId: id,
@@ -6054,6 +6140,154 @@ class StreamStatusTelemetryService2 {
             overlays,
         });
     }
+    /**
+     * Emit the region / signaling / webrtc phases for an ADOPTED connection.
+     *
+     * The prefetch script established the connection in PARALLEL with page load,
+     * so the phases are positioned at their real (anchor-relative) spans — shifted
+     * LEFT to overlap the HTML-loading / route-idle rows — rather than sequentially
+     * after them. That's the whole point of the prefetch: the handshake already
+     * happened while the page was loading. Each phase ships:
+     *  - `duration` — the real sub-step time the prefetch spent.
+     *  - `spanStartMs` — anchor-relative start, so the viewer left-shifts the bar.
+     *  - `adoptionAtMs` — where Angular took over (the next phase, Unreal
+     *    communication, resumes here on the sequential timeline).
+     *  - savings params: `prefetchConnectMs` (full handshake), `prefetchSavedMs`
+     *    (done before Angular was ready), `adoptionWaitMs` (real connect→adopted
+     *    wait), `adoptionOverheadMs` (prefetch-ready → adopted gap).
+     */
+    emitAdoptedConnection(timings) {
+        const s = this.session;
+        if (!s)
+            return;
+        const t = timings ?? {};
+        const now = performance.now();
+        // Everything in anchor-relative ms — the same scale the viewer renders on
+        // (and the prefetch marks share the page `performance` clock).
+        const toMs = (perf) => Math.round(perf - s.anchorPerf);
+        const startMs = toMs(t['prefetch_start'] ?? s.startedAtPerf);
+        const wsOpenMs = Math.max(startMs, toMs(t['ws_open'] ?? t['prefetch_start'] ?? s.startedAtPerf));
+        const readyMs = Math.max(wsOpenMs, toMs(t['ready'] ?? t['dc_open'] ?? t['ws_open'] ?? s.startedAtPerf));
+        const adoptionAtMs = toMs(now);
+        const sessionStartMs = toMs(s.startedAtPerf);
+        const sigDur = wsOpenMs - startMs;
+        const webDur = readyMs - wsOpenMs;
+        const connectMs = readyMs - startMs;
+        // Main-thread blocking from the OPTIONAL `perf-longtask.js` head-script. If
+        // that script isn't on the page `window.__streamPerf` is undefined and
+        // these stay 0 — nothing breaks. Tasks carry page-`performance.now()` start
+        // times, so window them against the raw (pre-`toMs`) ready/adoption marks:
+        //   bootBlockingMs  — total over [0, adoption]: overall JS cost to boot.
+        //   adoptBlockingMs — within [ready, adoption]: how much of the
+        //                     "awaiting Angular code" gap was the thread actually
+        //                     blocked by JS (vs idle waiting). ≈gap ⇒ JS-bound;
+        //                     ≈0 ⇒ the app was just slow to reach the adopt call.
+        const readyPerf = t['ready'] ?? t['dc_open'] ?? t['ws_open'] ?? s.startedAtPerf;
+        const tasks = window.__streamPerf?.longTasks ?? [];
+        let bootBlockingMs = 0;
+        let adoptBlockingMs = 0;
+        let maxLongTaskMs = 0;
+        for (const lt of tasks) {
+            if (lt.start > now)
+                continue; // ignore tasks after adoption
+            bootBlockingMs += lt.dur;
+            if (lt.dur > maxLongTaskMs)
+                maxLongTaskMs = lt.dur;
+            if (lt.start >= readyPerf)
+                adoptBlockingMs += lt.dur;
+        }
+        // Savings, anchored at the moment Angular reached the connect call.
+        const savings = {
+            prefetched: true,
+            prefetchConnectMs: connectMs,
+            // How much of the handshake finished before Angular was ready (the win).
+            prefetchSavedMs: Math.max(0, Math.min(connectMs, sessionStartMs - startMs)),
+            // The real wait Angular experienced (connect call → adopted).
+            adoptionWaitMs: Math.max(0, adoptionAtMs - sessionStartMs),
+            // Gap between the prefetch being ready and Angular adopting it.
+            adoptionOverheadMs: Math.max(0, adoptionAtMs - readyMs),
+            // Main-thread blocking (longtask) — diagnoses whether the gap is JS-bound.
+            bootBlockingMs: Math.round(bootBlockingMs),
+            adoptBlockingMs: Math.round(adoptBlockingMs),
+            maxLongTaskMs: Math.round(maxLongTaskMs),
+        };
+        // Region (phaseNo 1) — served from the ping cache during prefetch (~0),
+        // positioned at the prefetch start; ship the samples.
+        const region = this.readRegionCache();
+        this.emitAdoptedPhase(0, startMs, 0, adoptionAtMs, {
+            region: region?.region_code ?? '',
+            pingsMs: region?.result.length ? `${region.result.join(', ')} ms` : null,
+        });
+        // Signaling (phaseNo 2) — [prefetch_start → ws_open]; streamer identity +
+        // savings; ws-connected marker sits at the phase's own end.
+        this.emitAdoptedPhase(1, startMs, sigDur, adoptionAtMs, {
+            ...this.adoptedSignalingParams(),
+            ...savings,
+            prefetchSignalingMs: sigDur,
+        }, [{ id: 'signaling-ws-connected', time: wsOpenMs }]);
+        // WebRTC negotiation (phaseNo 3) — [ws_open → ready].
+        this.emitAdoptedPhase(2, wsOpenMs, webDur, adoptionAtMs, {
+            iceCandidateCount: 0,
+            prefetchWebrtcMs: webDur,
+        });
+        // Unreal communication chains from the adoption moment (real wall-clock).
+        s.lastMilestonePerf = now;
+    }
+    /**
+     * Emit one adopted phase positioned at its real `spanStartMs` (left-shifted
+     * to overlap page load) with its real prefetch `duration`. `prefetched`,
+     * `spanStartMs` and `adoptionAtMs` ride as top-level wire fields the viewer
+     * uses to lay the bar out; the rest become display params.
+     */
+    emitAdoptedPhase(bucketIdx, spanStartMs, durationMs, adoptionAtMs, extras, milestones = []) {
+        const s = this.session;
+        if (!s)
+            return;
+        const bucket = this.phaseCatalog[bucketIdx];
+        this.track('stream.phase_ended', {
+            sessionId: s.id,
+            phaseNo: bucketIdx + 1,
+            id: bucket.id,
+            color: bucket.color,
+            duration: durationMs,
+            prefetched: true,
+            spanStartMs,
+            adoptionAtMs,
+            milestones,
+            params: toPhaseParams({ ...extras, prefetched: true }),
+            overlays: [],
+        });
+    }
+    /** Streamer identity params for the adopted signaling phase — mirrors the
+     *  `ssinfo-received` closer's shape (client / instanceName / …ssData). */
+    adoptedSignalingParams() {
+        const aws = this.awsInstance$();
+        const ssData = this.ssData$();
+        return {
+            client: aws?.wsUrl ?? null,
+            instanceName: aws?.instanceName ?? null,
+            ...(ssData ?? {}),
+        };
+    }
+    /** Read the region-ping cache the prefetch reused (localStorage), so the
+     *  adopted region phase can still report the winning region + samples. */
+    readRegionCache() {
+        try {
+            const raw = localStorage.getItem(REGION_PING_CACHE_KEY);
+            if (!raw)
+                return null;
+            const parsed = JSON.parse(raw);
+            return {
+                region_code: typeof parsed.region_code === 'string' ? parsed.region_code : '',
+                result: Array.isArray(parsed.result)
+                    ? parsed.result.filter((n) => typeof n === 'number')
+                    : [],
+            };
+        }
+        catch {
+            return null;
+        }
+    }
     handleWindow(samples) {
         if (!this.session)
             return;