@arcware-cloud/pixelstreaming-websdk 1.3.4 → 1.3.6

package/index.umd.js

@@ -23430,7 +23430,7 @@ class ArcwareConfig extends lib_pixelstreamingfrontend_ue5_5_1.Config {
         if (!config.initialSettings.ss)
             config.initialSettings.ss = exports.DefaultUrl;
         super(config);
-        this.VERSION = "1.3.4";
+        this.VERSION = "1.3.6";
         this.settings = settings;
         this.session = new Session_1.Session();
         this._initialSettings = config.initialSettings;
@@ -23584,8 +23584,19 @@ const MicrophoneOverlay_1 = __webpack_require__(3613);
 const ConnectionIdentifier_1 = __webpack_require__(5999);
 const DiagnosticsCollector_1 = __webpack_require__(8429);
 class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStreaming {
+    resetInitGuardsAndHooks() {
+        this.videoInitializedSent = false;
+        this._postInitSideEffectsDone = false;
+        this.cancelFirstRenderedFrameHook(); // just in case
+        this.attachFirstRenderedFrameOnce(); // re-arm rVFC/resize on current video element
+        this.bindTransportEvents(); // ensure listeners are bound to current transport
+    }
+    reconnect() {
+        super.reconnect();
+        this.resetInitGuardsAndHooks();
+    }
     bindTransportEvents() {
-        var _a, _b, _c, _d, _f, _g, _h;
+        var _a, _b, _c, _d, _e, _f, _g;
         const current = (_a = this.webRtcController) === null || _a === void 0 ? void 0 : _a.transport;
         if (!current || current === this._boundTransport)
             return;
@@ -23594,13 +23605,24 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
             if (this._onWsOpen)
                 (_c = (_b = this._boundTransport).removeEventListener) === null || _c === void 0 ? void 0 : _c.call(_b, "open", this._onWsOpen);
             if (this._onWsClose)
-                (_f = (_d = this._boundTransport).removeEventListener) === null || _f === void 0 ? void 0 : _f.call(_d, "close", this._onWsClose);
+                (_e = (_d = this._boundTransport).removeEventListener) === null || _e === void 0 ? void 0 : _e.call(_d, "close", this._onWsClose);
         }
         // Define (or reuse) callbacks
         if (!this._onWsOpen) {
             this._onWsOpen = () => {
                 this.flushOutbox();
-                this.startVideoInitWatchdog(); // only start, no send
+                this.attachFirstRenderedFrameOnce();
+                // no watchdog anymore
+                setTimeout(() => {
+                    var _a, _b, _c;
+                    if (!this.videoInitializedSent) {
+                        const v = (_c = (_b = (_a = this.webRtcController) === null || _a === void 0 ? void 0 : _a.videoPlayer) === null || _b === void 0 ? void 0 : _b.getVideoElement) === null || _c === void 0 ? void 0 : _c.call(_b);
+                        if (v && v.videoWidth > 0 && v.videoHeight > 0 && v.readyState >= HTMLMediaElement.HAVE_CURRENT_DATA) {
+                            this.sendVideoInitializedOnce();
+                            this.runPostInitSideEffectsOnce();
+                        }
+                    }
+                }, 1200);
             };
         }
         if (!this._onWsClose) {
@@ -23610,85 +23632,10 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
             };
         }
         // Bind to current
-        (_g = current.addEventListener) === null || _g === void 0 ? void 0 : _g.call(current, "open", this._onWsOpen);
-        (_h = current.addEventListener) === null || _h === void 0 ? void 0 : _h.call(current, "close", this._onWsClose);
+        (_f = current.addEventListener) === null || _f === void 0 ? void 0 : _f.call(current, "open", this._onWsOpen);
+        (_g = current.addEventListener) === null || _g === void 0 ? void 0 : _g.call(current, "close", this._onWsClose);
         this._boundTransport = current;
     }
-    // conservative media-evidence check (no stats involved)
-    hasMediaEvidence() {
-        var _a, _b, _c;
-        const videoEl = (_c = (_b = (_a = this === null || this === void 0 ? void 0 : this.webRtcController) === null || _a === void 0 ? void 0 : _a.videoPlayer) === null || _b === void 0 ? void 0 : _b.getVideoElement) === null || _c === void 0 ? void 0 : _c.call(_b);
-        if (!videoEl)
-            return false;
-        const dimensions = videoEl.videoWidth > 0 && videoEl.videoHeight > 0;
-        const ready = videoEl.readyState >= HTMLMediaElement.HAVE_CURRENT_DATA; // >= 2
-        const activelyPlaying = !videoEl.paused && !videoEl.ended;
-        // Require at least two signals to avoid false positives on metadata-only loads
-        const strong = (dimensions && ready) || (dimensions && activelyPlaying) || (ready && activelyPlaying);
-        // also allow explicit 'playing' evidence we latched separately
-        return strong || this.seenVideoPlaying;
-    }
-    startVideoInitWatchdog() {
-        // restart the interval
-        this.stopVideoInitWatchdog();
-        const startedAt = Date.now();
-        this.videoInitWatchdogInterval = window.setInterval(() => {
-            if (this.videoInitializedSent) {
-                this.stopVideoInitWatchdog();
-                return;
-            }
-            if (this.hasMediaEvidence()) {
-                this.sendVideoInitializedOnce();
-                this.stopVideoInitWatchdog();
-                return;
-            }
-            // Optional maximum wait: if set and exceeded, backfill only if we saw playing
-            if (this.videoInitMaxWaitMs && Date.now() - startedAt > this.videoInitMaxWaitMs) {
-                if (this.seenVideoPlaying && !this.videoInitializedSent) {
-                    this.sendVideoInitializedOnce();
-                }
-                this.stopVideoInitWatchdog();
-            }
-        }, this.videoInitCheckMs);
-    }
-    stopVideoInitWatchdog() {
-        if (this.videoInitWatchdogInterval) {
-            window.clearInterval(this.videoInitWatchdogInterval);
-            this.videoInitWatchdogInterval = undefined;
-        }
-    }
-    startTransportWatcher() {
-        // Rebind if the transport object reference changes (cheap safety net)
-        if (this._transportWatchTimer)
-            return;
-        this._transportWatchTimer = window.setInterval(() => {
-            var _a;
-            const cur = (_a = this.webRtcController) === null || _a === void 0 ? void 0 : _a.transport;
-            if (cur && cur !== this._boundTransport)
-                this.bindTransportEvents();
-        }, 3000); // light-touch; adjust if you like
-    }
-    stopTransportWatcher() {
-        if (this._transportWatchTimer) {
-            window.clearInterval(this._transportWatchTimer);
-            this._transportWatchTimer = undefined;
-        }
-    }
-    bindVideoElPlayingOnce() {
-        var _a, _b, _c;
-        const videoEl = (_c = (_b = (_a = this === null || this === void 0 ? void 0 : this.webRtcController) === null || _a === void 0 ? void 0 : _a.videoPlayer) === null || _b === void 0 ? void 0 : _b.getVideoElement) === null || _c === void 0 ? void 0 : _c.call(_b);
-        if (!videoEl || videoEl === this._boundVideoEl)
-            return;
-        // Unbind older one if replaced
-        if (this._boundVideoEl && this._onVideoPlaying) {
-            this._boundVideoEl.removeEventListener("playing", this._onVideoPlaying);
-        }
-        this._onVideoPlaying = () => {
-            this.seenVideoPlaying = true;
-        };
-        videoEl.addEventListener("playing", this._onVideoPlaying, { once: true });
-        this._boundVideoEl = videoEl;
-    }
     get isWsOpen() {
         var _a, _b;
         const ws = (_b = (_a = this.webRtcController) === null || _a === void 0 ? void 0 : _a.transport) === null || _b === void 0 ? void 0 : _b.webSocket;
@@ -23709,7 +23656,7 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
         return state !== undefined ? state : WebSocket.CLOSED;
     }
     constructor(config, overrides) {
-        var _a, _b, _c, _d, _f, _g, _h;
+        var _a, _b, _c;
         /** As soon as upstream is fixed, we got to adjust the url building process. */
         (0, ApplyUrlHack_1.ApplyUrlHack)();
         super(config, overrides);
@@ -23717,25 +23664,18 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
         this.isProcessingQueue = false;
         // --- reliable send / idempotence ---
         this.outbox = [];
-        this.retryTimers = new Map(); // reserved if you later add ACKs
         this.videoInitializedSent = false;
-        this.versionReplyInFlight = false;
-        this.nextMsgId = 1;
-        this.videoInitCheckMs = 250; // default poll; can be overridden from config
-        this.seenVideoPlaying = false;
+        // --- first-frame (rVFC) detection + element swap handling ---
+        this._rVFCsupported = "requestVideoFrameCallback" in HTMLVideoElement.prototype;
+        this._postInitSideEffectsDone = false;
         // Externalized
-        /** On ping the session creation timestamp will be updated. */
         this.queueHandler = new EventHandler_1.EventHandler();
-        /** Error receiver. */
         this.errorHandler = new EventHandler_1.EventHandler();
-        /** LoveLetter */
         this.loveLetterHandler = new EventHandler_1.EventHandler();
-        /** SessionId */
         this.sessionIdHandler = new EventHandler_1.EventHandler();
-        /** VideoInitialized */
+        /** VideoInitialized (native Epic event) */
         this.videoInitializedHandler = new EventHandler_1.EventHandler();
         // Internal
-        /** WebSocket Close */
         this.websocketOnCloseHandler = new EventHandler_1.EventHandler();
         /** Theoretically this call should be used to implement the signalling url, but this would not work at all, if config is setup for "AutoConnect=true"
          * Instead we use ApplyUrlHack();
@@ -23748,19 +23688,15 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
         const transport = (_a = this.webRtcController) === null || _a === void 0 ? void 0 : _a.transport;
         (_b = transport === null || transport === void 0 ? void 0 : transport.addEventListener) === null || _b === void 0 ? void 0 : _b.call(transport, "open", () => {
             this.flushOutbox();
-            this.startVideoInitWatchdog(); // only start, no send
+            // no polling watchdog
         });
         (_c = transport === null || transport === void 0 ? void 0 : transport.addEventListener) === null || _c === void 0 ? void 0 : _c.call(transport, "close", (evt) => {
-            // Bubble to your public close handler if you expose one
             if (this.websocketOnCloseHandler) {
                 EventHandler_1.EventHandler.Emit(this.websocketOnCloseHandler, evt);
             }
         });
-        this.setupVideoInitFallbacks();
         // Set override config.
         this.config = config;
-        this.videoInitCheckMs = (_f = (_d = this.config.settings) === null || _d === void 0 ? void 0 : _d.videoInitCheckMs) !== null && _f !== void 0 ? _f : this.videoInitCheckMs;
-        this.videoInitMaxWaitMs = (_h = (_g = this.config.settings) === null || _g === void 0 ? void 0 : _g.videoInitMaxWaitMs) !== null && _h !== void 0 ? _h : undefined;
         this.loveLettersList = [];
         this.microphoneOverlay = new MicrophoneOverlay_1.MicrophoneOverlay(this);
         this.diagnosticsCollector = new DiagnosticsCollector_1.DiagnosticsCollector({
@@ -23769,9 +23705,9 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
         // after super(...) and once webRtcController is available
         this.bindTransportEvents();
         this.startTransportWatcher();
-        // ensure video 'playing' fallback is attached to the current element
-        this.bindVideoElPlayingOnce();
-        // this.loveLettersContainer = null;
+        // Arm first-frame detector & watch for element swaps
+        this.attachFirstRenderedFrameOnce();
+        this.watchVideoElementReplacement();
         this.wrapWebSocketOnCloseHandler();
         // Bind the event listener function to the class instance
         this.handleResolutionChange = this.handleResolutionChange.bind(this);
@@ -23839,14 +23775,13 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
                 (_a = lib_pixelstreamingfrontend_ue5_5_1.Logger.Warning) === null || _a === void 0 ? void 0 : _a.call(lib_pixelstreamingfrontend_ue5_5_1.Logger, `Diagnostics collection failed: ${(_b = e === null || e === void 0 ? void 0 : e.message) !== null && _b !== void 0 ? _b : e}`);
             }
             finally {
-                // Build payload with required fields only; append diagnostics if available
                 const payload = {
                     type: "version",
                     version: this.config.VERSION
                 };
                 if (diagnostics !== undefined)
                     payload.diagnostics = diagnostics;
-                this.send(payload); // uses your buffered send
+                this.send(payload); // uses buffered send
             }
         });
     }
@@ -23859,14 +23794,10 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
             this.session.set(this.session.current);
     }
     /** Handle incoming configurations. */
-    // public readonly streamInfoHandler = new EventHandler<never>();
     onStreamInfo(streamInfo) {
         var _a, _b, _c, _d;
         lib_pixelstreamingfrontend_ue5_5_1.Logger.Info(`StreamInfo received.`);
-        // Save the streamInfo to the instance variable
         this.streamInfo = streamInfo;
-        // By setting this hidden flag, the evaluation of the streamInfo can be cut off.
-        // Cutting of the streamInfo can lead to unwanted behavior, therefore it's not advertised.
         if (!((_b = (_a = this.config) === null || _a === void 0 ? void 0 : _a.settings) === null || _b === void 0 ? void 0 : _b["do-not-eval-streamInfo"])) {
             const { afk } = streamInfo.streamInfo;
             if (afk) {
@@ -23876,7 +23807,6 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
                 const { afkController } = this.webRtcController;
                 afkController.countDown = afk.action;
             }
-            // Relevant settings need to be interpreted when they come through the streamInfo to the client.
             if ((_c = streamInfo.streamInfo.webSdkSettings) === null || _c === void 0 ? void 0 : _c.init) {
                 this.config.setSettings(streamInfo.streamInfo.webSdkSettings.init);
             }
@@ -23891,7 +23821,6 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
         }
         this.handleMouseLock();
         this.injectCustomUI();
-        // EventHandler.Emit(this.streamInfoHandler, undefined as never);
     }
     onQueue(message) {
         lib_pixelstreamingfrontend_ue5_5_1.Logger.Info(`QueueInfo received.`);
@@ -23902,7 +23831,6 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
         EventHandler_1.EventHandler.Emit(this.errorHandler, error);
     }
     onLoveLetter(loveLetter) {
-        // Logger.Info(Logger.GetStackTrace(), loveLetter.reason);
         if (this.config.settings.loveLetterLogging)
             console.info(loveLetter.reason);
         EventHandler_1.EventHandler.Emit(this.loveLetterHandler, loveLetter);
@@ -23910,7 +23838,6 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
     }
     onSessionId(message) {
         lib_pixelstreamingfrontend_ue5_5_1.Logger.Info(message.sessionId);
-        // console.info(`Session: ${message.sessionId}`);
         this.session.set(message.sessionId);
         EventHandler_1.EventHandler.Emit(this.sessionIdHandler, message.sessionId);
     }
@@ -23918,59 +23845,112 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
         if (this.videoInitializedSent)
             return;
         this.videoInitializedSent = true;
-        // Use withId if you plan to support idempotence on the server
-        this.send(/* this.withId( */ { type: "onVideoInitialized" } /* ) */);
+        // cancel rVFC if still armed (we've already initialized)
+        this.cancelFirstRenderedFrameHook();
+        this.send({ type: "onVideoInitialized" });
         if (this.videoInitializedHandler) {
             EventHandler_1.EventHandler.Emit(this.videoInitializedHandler, undefined);
         }
     }
-    // Attach fallbacks once (call this in constructor after transport wiring)
-    setupVideoInitFallbacks() {
-        var _a, _b, _c, _d, _f, _g, _h;
-        // Fallback #1: HTMLVideoElement 'playing'
-        const videoEl = (_c = (_b = (_a = this.webRtcController) === null || _a === void 0 ? void 0 : _a.videoPlayer) === null || _b === void 0 ? void 0 : _b.getVideoElement) === null || _c === void 0 ? void 0 : _c.call(_b);
-        (_d = videoEl === null || videoEl === void 0 ? void 0 : videoEl.addEventListener) === null || _d === void 0 ? void 0 : _d.call(videoEl, "playing", () => {
-            this.seenVideoPlaying = true;
-        }, { once: true });
-        (_f = this.addEventListener) === null || _f === void 0 ? void 0 : _f.call(this, "statsReceived", (_e) => {
-            /* no-op for video init */
-        });
-        // Fallback #3: after socket opens, give it a tick
-        const transport = (_g = this.webRtcController) === null || _g === void 0 ? void 0 : _g.transport;
-        (_h = transport === null || transport === void 0 ? void 0 : transport.addEventListener) === null || _h === void 0 ? void 0 : _h.call(transport, "open", () => {
-            this.startVideoInitWatchdog(); // only start, no send
-        });
-    }
-    onVideoInitialized() {
-        var _a, _b, _c, _d, _f, _g, _h;
-        // send early and once
-        this.stopVideoInitWatchdog(); // PS event arrived, cancel backup
-        this.sendVideoInitializedOnce();
-        // keep side-effects guarded so they can't break the send
+    runPostInitSideEffectsOnce() {
+        var _a, _b, _c, _d, _e, _f, _g;
+        if (this._postInitSideEffectsDone)
+            return;
+        this._postInitSideEffectsDone = true;
         try {
             (_a = this.handleMouseLock) === null || _a === void 0 ? void 0 : _a.call(this);
         }
-        catch (_j) { }
+        catch (_h) { }
         try {
             (_b = this.handleResolutionChange) === null || _b === void 0 ? void 0 : _b.call(this);
         }
-        catch (_k) { }
+        catch (_j) { }
         try {
             (_c = this.handleRemoveLoveLetters) === null || _c === void 0 ? void 0 : _c.call(this);
         }
+        catch (_k) { }
+        try {
+            (_e = (_d = this.microphoneOverlay) === null || _d === void 0 ? void 0 : _d.toggleVisibility) === null || _e === void 0 ? void 0 : _e.call(_d, false);
+        }
         catch (_l) { }
         try {
-            (_f = (_d = this.microphoneOverlay) === null || _d === void 0 ? void 0 : _d.toggleVisibility) === null || _f === void 0 ? void 0 : _f.call(_d, false);
+            (_f = this.applyResolutionIfPlaying) === null || _f === void 0 ? void 0 : _f.call(this);
         }
         catch (_m) { }
         try {
-            (_g = this.applyResolutionIfPlaying) === null || _g === void 0 ? void 0 : _g.call(this);
+            (_g = this.removeXRIconIfDisabled) === null || _g === void 0 ? void 0 : _g.call(this);
         }
         catch (_o) { }
+    }
+    onVideoInitialized() {
+        if (this.videoInitializedSent) {
+            // Init was already sent by rVFC; ensure side-effects run once, then bail.
+            this.runPostInitSideEffectsOnce();
+            return;
+        }
+        //console.log("Ran from Epic");
+        this.sendVideoInitializedOnce();
+        this.runPostInitSideEffectsOnce();
+    }
+    // --- First-frame detection (rVFC/resize) ---
+    attachFirstRenderedFrameOnce() {
+        var _a, _b, _c, _d;
+        const v = (_c = (_b = (_a = this.webRtcController) === null || _a === void 0 ? void 0 : _a.videoPlayer) === null || _b === void 0 ? void 0 : _b.getVideoElement) === null || _c === void 0 ? void 0 : _c.call(_b);
+        if (!v)
+            return;
+        if (this._rVFCArmedForElement === v)
+            return;
+        this.cancelFirstRenderedFrameHook();
+        this._rVFCArmedForElement = v;
+        // Modern path
+        if (this._rVFCsupported) {
+            const anyV = v;
+            this._rvfcHandle = (_d = anyV.requestVideoFrameCallback) === null || _d === void 0 ? void 0 : _d.call(anyV, (_now, _meta) => {
+                this.sendVideoInitializedOnce();
+                this.runPostInitSideEffectsOnce();
+                this._rvfcHandle = undefined;
+            });
+        }
+        // Always attach resize once as a parallel fallback
+        const onResize = () => {
+            v.removeEventListener("resize", onResize);
+            this.sendVideoInitializedOnce();
+            this.runPostInitSideEffectsOnce();
+        };
+        v.addEventListener("resize", onResize, { once: true });
+    }
+    cancelFirstRenderedFrameHook() {
+        var _a;
+        const v = this._rVFCArmedForElement;
+        if (!v)
+            return;
+        if (this._rvfcHandle && "cancelVideoFrameCallback" in HTMLVideoElement.prototype) {
+            const anyV = v;
+            try {
+                (_a = anyV.cancelVideoFrameCallback) === null || _a === void 0 ? void 0 : _a.call(anyV, this._rvfcHandle);
+            }
+            catch (_b) { }
+        }
+        this._rvfcHandle = undefined;
+        this._rVFCArmedForElement = undefined;
+    }
+    watchVideoElementReplacement() {
+        var _a, _b, _c, _d;
+        // Observe the player container; if a new <video> is inserted/replaced, re-arm rVFC
         try {
-            (_h = this.removeXRIconIfDisabled) === null || _h === void 0 ? void 0 : _h.call(this);
+            const parent = (_c = (_b = (_a = this === null || this === void 0 ? void 0 : this.webRtcController) === null || _a === void 0 ? void 0 : _a.videoPlayer) === null || _b === void 0 ? void 0 : _b.getVideoParentElement) === null || _c === void 0 ? void 0 : _c.call(_b);
+            if (!parent)
+                return;
+            (_d = this._mo) === null || _d === void 0 ? void 0 : _d.disconnect();
+            this._mo = new MutationObserver(() => {
+                // Try to re-attach on any child change (cheap and reliable)
+                this.attachFirstRenderedFrameOnce();
+            });
+            this._mo.observe(parent, { childList: true, subtree: true });
+        }
+        catch (_e) {
+            // noop
         }
-        catch (_p) { }
     }
     /** Adding a zod-safe handler. */
     addMessageHandler(type, zod, boundMethod) {
@@ -23979,13 +23959,12 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
             if (parsed.success)
                 boundMethod.call(this, parsed.data);
             else {
-                // This cast has to be done, since Frontend does not use typescript-strict setting.
                 const parsedError = parsed;
                 const error = new Error(`Unexpected message content. Event:'${type}', ZodError: ${parsedError.error.message}`);
                 lib_pixelstreamingfrontend_ue5_5_1.Logger.Error(error.message);
             }
             if (type === "error") {
-                //this.disconnect();
+                // this.disconnect();
             }
         });
     }
@@ -23996,7 +23975,6 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
      */
     sendStats(stats) {
         const message = { type: "stats", stats: (0, Stats_1.Stats)(stats) };
-        // This cast has to be done, since Frontend does not use typescript-strict setting.
         this.send(message);
     }
     send(a, b) {
@@ -24037,22 +24015,18 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
                 this.signallingProtocol.sendMessage(m);
             }
             catch (_a) {
-                // if we fail mid-flush, put remaining back and bail
                 this.outbox.unshift(m, ...batch.slice(batch.indexOf(m) + 1));
                 break;
             }
         }
     }
     handleResolutionChange() {
-        var _a, _b, _c, _d, _f, _g, _h;
-        // Get the resolution from the streamInfo if available
+        var _a, _b, _c, _d, _e, _f, _g;
         if (!(this === null || this === void 0 ? void 0 : this.streamInfo) || !(this === null || this === void 0 ? void 0 : this.webRtcController) || !((_b = (_a = this === null || this === void 0 ? void 0 : this.webRtcController) === null || _a === void 0 ? void 0 : _a.videoPlayer) === null || _b === void 0 ? void 0 : _b.getVideoElement())) {
             return;
         }
-        // Get the resolution from the streamInfo if available
         const resolution = (_d = (_c = this === null || this === void 0 ? void 0 : this.streamInfo) === null || _c === void 0 ? void 0 : _c.streamInfo) === null || _d === void 0 ? void 0 : _d.resolution;
-        const unrealVersion = (_h = (_g = (_f = this === null || this === void 0 ? void 0 : this.streamInfo) === null || _f === void 0 ? void 0 : _f.streamInfo) === null || _g === void 0 ? void 0 : _g.meta) === null || _h === void 0 ? void 0 : _h.version;
-        // Check if resolution.dynamic is true
+        const unrealVersion = (_g = (_f = (_e = this === null || this === void 0 ? void 0 : this.streamInfo) === null || _e === void 0 ? void 0 : _e.streamInfo) === null || _f === void 0 ? void 0 : _f.meta) === null || _g === void 0 ? void 0 : _g.version;
         if (resolution && (resolution === null || resolution === void 0 ? void 0 : resolution.dynamic)) {
             setTimeout(() => {
                 var _a;
@@ -24060,32 +24034,24 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
                 const videoElementParent = videoPlayer === null || videoPlayer === void 0 ? void 0 : videoPlayer.getVideoParentElement();
                 const browserWidth = videoElementParent === null || videoElementParent === void 0 ? void 0 : videoElementParent.getBoundingClientRect().width;
                 const browserHeight = videoElementParent === null || videoElementParent === void 0 ? void 0 : videoElementParent.getBoundingClientRect().height;
-                // Define maximum allowed resolution
                 const maxWidth = resolution === null || resolution === void 0 ? void 0 : resolution.width;
                 const maxHeight = resolution === null || resolution === void 0 ? void 0 : resolution.height;
-                // Calculate the aspect ratio of the browser viewport
                 const aspectRatio = browserWidth / browserHeight;
-                // Calculate the new width and height based on the aspect ratio
                 let limitedWidth, limitedHeight;
                 if (aspectRatio > maxWidth / maxHeight) {
-                    // Width is the limiting factor
                     limitedWidth = maxWidth;
                     limitedHeight = maxWidth / aspectRatio;
                 }
                 else {
-                    // Height is the limiting factor
                     limitedHeight = maxHeight;
                     limitedWidth = maxHeight * aspectRatio;
                 }
                 if (videoPlayer) {
-                    // Check Unreal Engine version
                     if (!unrealVersion || (unrealVersion === null || unrealVersion === void 0 ? void 0 : unrealVersion.startsWith("4.27"))) {
-                        // Use the aspect ratio limited resolution for the r.setres command
                         const descriptor = { Console: `r.setres ${Math.round(limitedWidth)}x${Math.round(limitedHeight)}w` };
                         (_a = this === null || this === void 0 ? void 0 : this.webRtcController) === null || _a === void 0 ? void 0 : _a.emitUIInteraction(descriptor);
                     }
                     else {
-                        // Use the aspect ratio limited resolution for the onMatchViewportResolutionCallback
                         videoPlayer.onMatchViewportResolutionCallback(Math.round(limitedWidth), Math.round(limitedHeight));
                     }
                 }
@@ -24104,21 +24070,39 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
         }
     }
     removePlayer() {
-        var _a, _b, _c, _d;
-        this.stopVideoInitWatchdog(); // PS event arrived, cancel backup
+        var _a, _b, _c, _d, _e;
         this.stopTransportWatcher();
-        // Optional: unbind handlers
+        // Unbind transport listeners
         if (this._boundTransport) {
             if (this._onWsOpen)
                 (_b = (_a = this._boundTransport).removeEventListener) === null || _b === void 0 ? void 0 : _b.call(_a, "open", this._onWsOpen);
             if (this._onWsClose)
                 (_d = (_c = this._boundTransport).removeEventListener) === null || _d === void 0 ? void 0 : _d.call(_c, "close", this._onWsClose);
         }
-        if (this._boundVideoEl && this._onVideoPlaying) {
-            this._boundVideoEl.removeEventListener("playing", this._onVideoPlaying);
+        // Cancel rVFC + observer
+        this.cancelFirstRenderedFrameHook();
+        try {
+            (_e = this._mo) === null || _e === void 0 ? void 0 : _e.disconnect();
         }
+        catch (_f) { }
         this.disconnect();
     }
+    startTransportWatcher() {
+        if (this._transportWatchTimer)
+            return;
+        this._transportWatchTimer = window.setInterval(() => {
+            var _a;
+            const cur = (_a = this.webRtcController) === null || _a === void 0 ? void 0 : _a.transport;
+            if (cur && cur !== this._boundTransport)
+                this.bindTransportEvents();
+        }, 3000);
+    }
+    stopTransportWatcher() {
+        if (this._transportWatchTimer) {
+            window.clearInterval(this._transportWatchTimer);
+            this._transportWatchTimer = undefined;
+        }
+    }
     handleMouseLock() {
         var _a, _b, _c;
         (_a = this === null || this === void 0 ? void 0 : this.config) === null || _a === void 0 ? void 0 : _a.modifyInitialSettings(!((_c = (_b = this === null || this === void 0 ? void 0 : this.streamInfo) === null || _b === void 0 ? void 0 : _b.streamInfo.meta) === null || _c === void 0 ? void 0 : _c.mouseLock));
@@ -24150,31 +24134,25 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
     }
     pushLetter(letter) {
         var _a;
-        // Add the letter to the queue
         (_a = this === null || this === void 0 ? void 0 : this.loveLettersQueue) === null || _a === void 0 ? void 0 : _a.push(letter);
-        // If not already processing the queue, start processing
         if (!this.isProcessingQueue) {
             this === null || this === void 0 ? void 0 : this.processLoveLetterQueue();
         }
     }
     processLoveLetterQueue() {
         var _a, _b;
-        // Set the flag to indicate that we are processing the queue
         this.isProcessingQueue = true;
-        // Take the first item from the queue
         const letter = this.loveLettersQueue.shift();
         if (letter !== undefined) {
             const formattedLoveLetter = letter === null || letter === void 0 ? void 0 : letter.replace(/LL: |\.$/g, "");
             (_a = this === null || this === void 0 ? void 0 : this.loveLettersList) === null || _a === void 0 ? void 0 : _a.push(formattedLoveLetter);
             const loveLettersBox = new LoveLetters_1.LoveLetters();
             loveLettersBox === null || loveLettersBox === void 0 ? void 0 : loveLettersBox.addLetter(formattedLoveLetter, (_b = this === null || this === void 0 ? void 0 : this.loveLettersList) === null || _b === void 0 ? void 0 : _b.length);
-            // Process the next item in the queue after a delay
             setTimeout(() => {
                 this.processLoveLetterQueue();
             }, 1000);
         }
         else {
-            // If the queue is empty, reset the flag
             this.isProcessingQueue = false;
         }
     }
@@ -24216,9 +24194,10 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
             (_b = this === null || this === void 0 ? void 0 : this.microphoneOverlay) === null || _b === void 0 ? void 0 : _b.toggleMessage(enable);
             setTimeout(() => { var _a; return (_a = this === null || this === void 0 ? void 0 : this.microphoneOverlay) === null || _a === void 0 ? void 0 : _a.toggleVisibility(true); }, 200);
             setTimeout(() => {
-                this.videoInitializedSent = false; // <-- reset before a real media restart
-                this.bindVideoElPlayingOnce(); // in case a new element will appear
-                this.bindTransportEvents(); // cheap rebind now
+                this.videoInitializedSent = false; // reset before a real media restart
+                // Re-arm rVFC on the current (or new) video element
+                this.attachFirstRenderedFrameOnce();
+                this.bindTransportEvents();
                 this.reconnect();
             }, 1000);
         }
@@ -24232,12 +24211,10 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
     }
     onStreamingStateChange(callback) {
         var _a, _b, _c, _d;
-        // Listen to video element events
         const videoElement = (_b = (_a = this === null || this === void 0 ? void 0 : this.webRtcController) === null || _a === void 0 ? void 0 : _a.videoPlayer) === null || _b === void 0 ? void 0 : _b.getVideoElement();
         videoElement === null || videoElement === void 0 ? void 0 : videoElement.addEventListener("play", () => callback(true));
         videoElement === null || videoElement === void 0 ? void 0 : videoElement.addEventListener("pause", () => callback(false));
         videoElement === null || videoElement === void 0 ? void 0 : videoElement.addEventListener("ended", () => callback(false));
-        // Listen to WebSocket events
         (_c = this.webRtcController) === null || _c === void 0 ? void 0 : _c.transport.addEventListener("open", () => {
             callback(true);
         });
@@ -24246,12 +24223,12 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
         });
     }
     removeXRIconIfDisabled() {
-        var _a, _b, _c, _d, _f;
+        var _a, _b, _c, _d, _e;
         if (!((_b = (_a = this === null || this === void 0 ? void 0 : this.config) === null || _a === void 0 ? void 0 : _a.initialSettings) === null || _b === void 0 ? void 0 : _b.XRControllerInput)) {
             (_c = this === null || this === void 0 ? void 0 : this.config) === null || _c === void 0 ? void 0 : _c.setFlagEnabled(lib_pixelstreamingfrontend_ue5_5_1.Flags.XRControllerInput, false);
             if (this.videoElementParent) {
                 if ((_d = this === null || this === void 0 ? void 0 : this.videoElementParent) === null || _d === void 0 ? void 0 : _d.parentElement) {
-                    const xrBtn = (_f = this === null || this === void 0 ? void 0 : this.videoElementParent) === null || _f === void 0 ? void 0 : _f.parentElement.querySelector("#xrBtn");
+                    const xrBtn = (_e = this === null || this === void 0 ? void 0 : this.videoElementParent) === null || _e === void 0 ? void 0 : _e.parentElement.querySelector("#xrBtn");
                     xrBtn === null || xrBtn === void 0 ? void 0 : xrBtn.remove();
                 }
             }
@@ -24393,7 +24370,7 @@ class ConnectionIdentifier {
             return;
         const activeStates = this.GetWebSocketStates().filter((state) => state <= WebsocketState.OPEN);
         if (activeStates.length === 1) {
-            console.log(`PixelStreaming Instance is connected.`);
+            //console.log(`PixelStreaming Instance is connected.`);
         }
         else if (activeStates.length !== 0) {
             console.warn(`${activeStates.length} PixelStreaming Instances are connected!`);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@arcware-cloud/pixelstreaming-websdk",
   "description": "WebSDK for easy implementation of pixel streaming with Arcware Cloud Services. Heavily based on the '@epicgames-ps' library.",
-  "version": "1.3.4",
+  "version": "1.3.6",
   "type": "commonjs",
   "main": "./index.umd.js",
   "module": "./index.umd.js",

package/types/lib/ArcwareConfig.d.ts

@@ -26,7 +26,7 @@ export declare class ArcwareConfig extends Config {
     readonly session: Session;
     readonly settings: Settings;
     private _initialSettings;
-    readonly VERSION = "1.3.4";
+    readonly VERSION = "1.3.6";
     constructor(config: ArcwareConfigParams);
     /** Setup connection string. */
     get urlFlags(): string;