@arcware-cloud/pixelstreaming-websdk 1.3.16 → 1.3.18

package/README.md

@@ -80,6 +80,10 @@ For more detailed examples and advanced usage, please refer to our documentation
 
 # Changelog
 
+### 1.3.17
+
+- added support for videos in white labelling
+
 ### 1.3.16
 
 - added white labeling options for loader icon and screen

package/index.cjs.js

@@ -23432,7 +23432,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.16";
+        this.VERSION = "1.3.18";
         this.whiteLabellingChanged = new EventHandler_1.EventHandler();
         this.signallingWlURL = "https://signalling-client.arcware.cloud/whiteLabel/";
         console.log(config);
@@ -24051,34 +24051,38 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
         }
     }
     runPostInitSideEffectsOnce() {
-        var _a, _b, _c, _d, _e, _f, _g;
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         if (this._postInitSideEffectsDone)
             return;
         this._postInitSideEffectsDone = true;
         try {
             (_a = this.handleMouseLock) === null || _a === void 0 ? void 0 : _a.call(this);
         }
-        catch (_h) { }
+        catch (_j) { }
         try {
             (_b = this.handleResolutionChange) === null || _b === void 0 ? void 0 : _b.call(this);
         }
-        catch (_j) { }
+        catch (_k) { }
         try {
             (_c = this.handleRemoveLoveLetters) === null || _c === void 0 ? void 0 : _c.call(this);
         }
-        catch (_k) { }
+        catch (_l) { }
         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) { }
+        catch (_m) { }
         try {
             (_f = this.applyResolutionIfPlaying) === null || _f === void 0 ? void 0 : _f.call(this);
         }
-        catch (_m) { }
+        catch (_o) { }
         try {
             (_g = this.removeXRIconIfDisabled) === null || _g === void 0 ? void 0 : _g.call(this);
         }
-        catch (_o) { }
+        catch (_p) { }
+        try {
+            (_h = this.hideSplashVideo) === null || _h === void 0 ? void 0 : _h.call(this);
+        }
+        catch (_q) { } // ← hide splash video when streaming
     }
     onVideoInitialized() {
         if (this.videoInitializedSent) {
@@ -24458,7 +24462,7 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
     applyBrandingFromSettings() {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
         const cfg = ((_b = (_a = this === null || this === void 0 ? void 0 : this.config) === null || _a === void 0 ? void 0 : _a.settings.whiteLabelling) !== null && _b !== void 0 ? _b : {});
-        // Loader image + fade
+        // Loader
         try {
             if (this.logoLoader) {
                 (_d = (_c = this.logoLoader).setImage) === null || _d === void 0 ? void 0 : _d.call(_c, cfg.loadingIconUrl);
@@ -24466,68 +24470,149 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
             }
         }
         catch (_q) { }
-        // Pick splash host: loveLettersContainer (preferred) or player parent
-        try {
-            const el = (_m = (_g = this.loveLettersContainer) !== null && _g !== void 0 ? _g : (_l = (_k = (_j = (_h = this.webRtcController) === null || _h === void 0 ? void 0 : _h.videoPlayer) === null || _j === void 0 ? void 0 : _j.getVideoParentElement) === null || _k === void 0 ? void 0 : _k.call(_j)) === null || _l === void 0 ? void 0 : _l.parentElement) !== null && _m !== void 0 ? _m : null;
-            if (!el)
-                return;
-            const s = el.style;
-            // Nuke previous inline styles (longhands only; never touch 'background' shorthand here)
-            s.removeProperty("background-image");
-            s.removeProperty("background-size");
-            s.removeProperty("background-repeat");
-            s.removeProperty("background-position");
-            s.removeProperty("background-color");
-            // Also clear any earlier 'background' inline shorthand that might have been set elsewhere
-            // (we set to 'initial' first, then re-apply longhands)
-            s.setProperty("background", "initial");
-            el.classList.remove("aw-splash");
-            // If neither color nor image is provided, nothing to do
-            const haveColor = !!cfg.splashScreenBgColor;
-            const haveImage = !!cfg.splashScreenUrl;
-            if (!haveColor && !haveImage)
-                return;
-            // Always ensure our class is present when we brand
-            el.classList.add("aw-splash");
-            // Apply color with !important so external 'background: ... !important' can't wipe it
-            const bgColor = (_o = cfg.splashScreenBgColor) !== null && _o !== void 0 ? _o : "var(--color0)";
-            s.setProperty("background-color", bgColor, "important");
-            if (haveImage) {
-                // Mode → size/repeat mapping
-                const mode = ((_p = cfg.splashScreenMode) !== null && _p !== void 0 ? _p : "contain");
-                switch (mode) {
-                    case "contain":
-                        s.backgroundSize = "contain";
-                        s.backgroundRepeat = "no-repeat";
-                        break;
-                    case "cover":
-                        s.backgroundSize = "cover";
-                        s.backgroundRepeat = "no-repeat";
-                        break;
-                    case "stretch":
-                        s.backgroundSize = "100% 100%";
-                        s.backgroundRepeat = "no-repeat";
-                        break;
-                    case "repeat":
-                        s.backgroundSize = "auto"; // intrinsic
-                        s.backgroundRepeat = "repeat";
-                        break;
-                }
-                // Position
-                s.backgroundPosition = cfg.splashScreenPosition || "center center";
-                // Image last (longhand so it won't reset color)
-                // Use quotes to be safe with URLs containing parentheses/spaces
-                s.backgroundImage = `url("${cfg.splashScreenUrl}")`;
+        const host = (_m = (_g = this.loveLettersContainer) !== null && _g !== void 0 ? _g : (_l = (_k = (_j = (_h = this.webRtcController) === null || _h === void 0 ? void 0 : _h.videoPlayer) === null || _j === void 0 ? void 0 : _j.getVideoParentElement) === null || _k === void 0 ? void 0 : _k.call(_j)) === null || _l === void 0 ? void 0 : _l.parentElement) !== null && _m !== void 0 ? _m : null;
+        if (!host)
+            return;
+        const s = host.style;
+        // Reset background longhands (never use shorthand to avoid nuking color)
+        s.removeProperty("background-image");
+        s.removeProperty("background-size");
+        s.removeProperty("background-repeat");
+        s.removeProperty("background-position");
+        s.removeProperty("background-color");
+        s.setProperty("background", "initial");
+        host.classList.remove("aw-splash");
+        // Clear any previous splash video unless re-used below
+        this.destroySplashVideo();
+        const haveUrl = !!cfg.splashScreenUrl;
+        const haveColor = !!cfg.splashScreenBgColor;
+        // Nothing to apply?
+        if (!haveUrl && !haveColor)
+            return;
+        host.classList.add("aw-splash");
+        // Always apply color (visible behind image/video / letterboxing)
+        const bgColor = (_o = cfg.splashScreenBgColor) !== null && _o !== void 0 ? _o : "var(--color0)";
+        s.setProperty("background-color", bgColor, "important");
+        // Decide: video or image from the same URL
+        const isVideo = this.isVideoUrl(cfg.splashScreenUrl);
+        if (haveUrl && isVideo) {
+            // map splashScreenMode to object-fit
+            const fit = cfg.splashScreenMode === "cover" ? "cover" : cfg.splashScreenMode === "stretch" ? "fill" : "contain";
+            const pos = cfg.splashScreenPosition || "center center";
+            this.upsertSplashVideo(cfg.splashScreenUrl, { fit, position: pos, bgColor });
+            // keep background image cleared to avoid layering
+            s.backgroundImage = "none";
+            s.backgroundRepeat = "no-repeat";
+            s.backgroundPosition = "center center";
+            s.backgroundSize = "auto";
+        }
+        else if (haveUrl) {
+            // IMAGE path
+            const mode = ((_p = cfg.splashScreenMode) !== null && _p !== void 0 ? _p : "contain");
+            switch (mode) {
+                case "contain":
+                    s.backgroundSize = "contain";
+                    s.backgroundRepeat = "no-repeat";
+                    break;
+                case "cover":
+                    s.backgroundSize = "cover";
+                    s.backgroundRepeat = "no-repeat";
+                    break;
+                case "stretch":
+                    s.backgroundSize = "100% 100%";
+                    s.backgroundRepeat = "no-repeat";
+                    break;
+                case "repeat":
+                    s.backgroundSize = "auto";
+                    s.backgroundRepeat = "repeat";
+                    break;
             }
-            else {
-                // No image → ensure any previous image is cleared
-                s.backgroundImage = "none";
-                s.backgroundRepeat = "no-repeat";
-                s.backgroundPosition = "center center";
-                s.backgroundSize = "auto";
+            s.backgroundPosition = cfg.splashScreenPosition || "center center";
+            s.backgroundImage = `url("${cfg.splashScreenUrl}")`;
+        }
+        else {
+            // COLOR only
+            s.backgroundImage = "none";
+            s.backgroundRepeat = "no-repeat";
+            s.backgroundPosition = "center center";
+            s.backgroundSize = "auto";
+        }
+    }
+    ensureSplashHost() {
+        var _a, _b, _c, _d, _e, _f;
+        const el = (_f = (_a = this.loveLettersContainer) !== null && _a !== void 0 ? _a : (_e = (_d = (_c = (_b = this.webRtcController) === null || _b === void 0 ? void 0 : _b.videoPlayer) === null || _c === void 0 ? void 0 : _c.getVideoParentElement) === null || _d === void 0 ? void 0 : _d.call(_c)) === null || _e === void 0 ? void 0 : _e.parentElement) !== null && _f !== void 0 ? _f : null;
+        if (!el)
+            return null;
+        this._splashHost = el;
+        // ensure stacking works
+        if (getComputedStyle(this._splashHost).position === "static")
+            this._splashHost.style.position = "relative";
+        return this._splashHost;
+    }
+    destroySplashVideo() {
+        if (this._splashVideo) {
+            try {
+                this._splashVideo.pause();
+            }
+            catch (_a) { }
+            try {
+                this._splashVideo.remove();
+            }
+            catch (_b) { }
+            this._splashVideo = undefined;
+        }
+    }
+    upsertSplashVideo(url, opts) {
+        var _a, _b;
+        const host = this.ensureSplashHost();
+        if (!host)
+            return;
+        let v = this._splashVideo;
+        if (!v) {
+            v = document.createElement("video");
+            v.playsInline = true;
+            v.setAttribute("webkit-playsinline", "true");
+            v.muted = true; // for autoplay
+            v.autoplay = true;
+            v.loop = true;
+            v.style.position = "absolute";
+            v.style.inset = "0";
+            v.style.width = "100%";
+            v.style.height = "100%";
+            v.style.objectFit = "contain";
+            v.style.objectPosition = "center center";
+            v.style.pointerEvents = "none";
+            v.style.zIndex = "0";
+            host.appendChild(v);
+            this._splashVideo = v;
+        }
+        v.src = url;
+        v.style.objectFit = (_a = opts.fit) !== null && _a !== void 0 ? _a : "contain";
+        v.style.objectPosition = (_b = opts.position) !== null && _b !== void 0 ? _b : "center center";
+        if (opts.bgColor)
+            host.style.setProperty("background-color", opts.bgColor, "important");
+        v.style.display = "";
+        v.play().catch(() => { });
+    }
+    hideSplashVideo() {
+        if (this._splashVideo) {
+            try {
+                this._splashVideo.pause();
             }
+            catch (_a) { }
+            this._splashVideo.style.display = "none";
         }
-        catch (_r) { }
+    }
+    isVideoUrl(u) {
+        if (!u)
+            return false;
+        const s = u.split("?")[0].toLowerCase();
+        return (s.startsWith("blob:") ||
+            s.endsWith(".mp4") ||
+            s.endsWith(".webm") ||
+            s.endsWith(".ogg") ||
+            s.endsWith(".ogv") ||
+            s.endsWith(".m3u8"));
     }
 }
 exports.ArcwarePixelStreaming = ArcwarePixelStreaming;

package/index.esm.js

@@ -23444,7 +23444,7 @@ class ArcwareConfig extends _epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBP
         if (!config.initialSettings.ss)
             config.initialSettings.ss = DefaultUrl;
         super(config);
-        this.VERSION = "1.3.16";
+        this.VERSION = "1.3.18";
         this.whiteLabellingChanged = new _domain_EventHandler__WEBPACK_IMPORTED_MODULE_7__.EventHandler();
         this.signallingWlURL = "https://signalling-client.arcware.cloud/whiteLabel/";
         console.log(config);
@@ -24081,34 +24081,38 @@ class ArcwarePixelStreaming extends _epicgames_ps_lib_pixelstreamingfrontend_ue5
         }
     }
     runPostInitSideEffectsOnce() {
-        var _a, _b, _c, _d, _e, _f, _g;
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         if (this._postInitSideEffectsDone)
             return;
         this._postInitSideEffectsDone = true;
         try {
             (_a = this.handleMouseLock) === null || _a === void 0 ? void 0 : _a.call(this);
         }
-        catch (_h) { }
+        catch (_j) { }
         try {
             (_b = this.handleResolutionChange) === null || _b === void 0 ? void 0 : _b.call(this);
         }
-        catch (_j) { }
+        catch (_k) { }
         try {
             (_c = this.handleRemoveLoveLetters) === null || _c === void 0 ? void 0 : _c.call(this);
         }
-        catch (_k) { }
+        catch (_l) { }
         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) { }
+        catch (_m) { }
         try {
             (_f = this.applyResolutionIfPlaying) === null || _f === void 0 ? void 0 : _f.call(this);
         }
-        catch (_m) { }
+        catch (_o) { }
         try {
             (_g = this.removeXRIconIfDisabled) === null || _g === void 0 ? void 0 : _g.call(this);
         }
-        catch (_o) { }
+        catch (_p) { }
+        try {
+            (_h = this.hideSplashVideo) === null || _h === void 0 ? void 0 : _h.call(this);
+        }
+        catch (_q) { } // ← hide splash video when streaming
     }
     onVideoInitialized() {
         if (this.videoInitializedSent) {
@@ -24488,7 +24492,7 @@ class ArcwarePixelStreaming extends _epicgames_ps_lib_pixelstreamingfrontend_ue5
     applyBrandingFromSettings() {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
         const cfg = ((_b = (_a = this === null || this === void 0 ? void 0 : this.config) === null || _a === void 0 ? void 0 : _a.settings.whiteLabelling) !== null && _b !== void 0 ? _b : {});
-        // Loader image + fade
+        // Loader
         try {
             if (this.logoLoader) {
                 (_d = (_c = this.logoLoader).setImage) === null || _d === void 0 ? void 0 : _d.call(_c, cfg.loadingIconUrl);
@@ -24496,68 +24500,149 @@ class ArcwarePixelStreaming extends _epicgames_ps_lib_pixelstreamingfrontend_ue5
             }
         }
         catch (_q) { }
-        // Pick splash host: loveLettersContainer (preferred) or player parent
-        try {
-            const el = (_m = (_g = this.loveLettersContainer) !== null && _g !== void 0 ? _g : (_l = (_k = (_j = (_h = this.webRtcController) === null || _h === void 0 ? void 0 : _h.videoPlayer) === null || _j === void 0 ? void 0 : _j.getVideoParentElement) === null || _k === void 0 ? void 0 : _k.call(_j)) === null || _l === void 0 ? void 0 : _l.parentElement) !== null && _m !== void 0 ? _m : null;
-            if (!el)
-                return;
-            const s = el.style;
-            // Nuke previous inline styles (longhands only; never touch 'background' shorthand here)
-            s.removeProperty("background-image");
-            s.removeProperty("background-size");
-            s.removeProperty("background-repeat");
-            s.removeProperty("background-position");
-            s.removeProperty("background-color");
-            // Also clear any earlier 'background' inline shorthand that might have been set elsewhere
-            // (we set to 'initial' first, then re-apply longhands)
-            s.setProperty("background", "initial");
-            el.classList.remove("aw-splash");
-            // If neither color nor image is provided, nothing to do
-            const haveColor = !!cfg.splashScreenBgColor;
-            const haveImage = !!cfg.splashScreenUrl;
-            if (!haveColor && !haveImage)
-                return;
-            // Always ensure our class is present when we brand
-            el.classList.add("aw-splash");
-            // Apply color with !important so external 'background: ... !important' can't wipe it
-            const bgColor = (_o = cfg.splashScreenBgColor) !== null && _o !== void 0 ? _o : "var(--color0)";
-            s.setProperty("background-color", bgColor, "important");
-            if (haveImage) {
-                // Mode → size/repeat mapping
-                const mode = ((_p = cfg.splashScreenMode) !== null && _p !== void 0 ? _p : "contain");
-                switch (mode) {
-                    case "contain":
-                        s.backgroundSize = "contain";
-                        s.backgroundRepeat = "no-repeat";
-                        break;
-                    case "cover":
-                        s.backgroundSize = "cover";
-                        s.backgroundRepeat = "no-repeat";
-                        break;
-                    case "stretch":
-                        s.backgroundSize = "100% 100%";
-                        s.backgroundRepeat = "no-repeat";
-                        break;
-                    case "repeat":
-                        s.backgroundSize = "auto"; // intrinsic
-                        s.backgroundRepeat = "repeat";
-                        break;
-                }
-                // Position
-                s.backgroundPosition = cfg.splashScreenPosition || "center center";
-                // Image last (longhand so it won't reset color)
-                // Use quotes to be safe with URLs containing parentheses/spaces
-                s.backgroundImage = `url("${cfg.splashScreenUrl}")`;
+        const host = (_m = (_g = this.loveLettersContainer) !== null && _g !== void 0 ? _g : (_l = (_k = (_j = (_h = this.webRtcController) === null || _h === void 0 ? void 0 : _h.videoPlayer) === null || _j === void 0 ? void 0 : _j.getVideoParentElement) === null || _k === void 0 ? void 0 : _k.call(_j)) === null || _l === void 0 ? void 0 : _l.parentElement) !== null && _m !== void 0 ? _m : null;
+        if (!host)
+            return;
+        const s = host.style;
+        // Reset background longhands (never use shorthand to avoid nuking color)
+        s.removeProperty("background-image");
+        s.removeProperty("background-size");
+        s.removeProperty("background-repeat");
+        s.removeProperty("background-position");
+        s.removeProperty("background-color");
+        s.setProperty("background", "initial");
+        host.classList.remove("aw-splash");
+        // Clear any previous splash video unless re-used below
+        this.destroySplashVideo();
+        const haveUrl = !!cfg.splashScreenUrl;
+        const haveColor = !!cfg.splashScreenBgColor;
+        // Nothing to apply?
+        if (!haveUrl && !haveColor)
+            return;
+        host.classList.add("aw-splash");
+        // Always apply color (visible behind image/video / letterboxing)
+        const bgColor = (_o = cfg.splashScreenBgColor) !== null && _o !== void 0 ? _o : "var(--color0)";
+        s.setProperty("background-color", bgColor, "important");
+        // Decide: video or image from the same URL
+        const isVideo = this.isVideoUrl(cfg.splashScreenUrl);
+        if (haveUrl && isVideo) {
+            // map splashScreenMode to object-fit
+            const fit = cfg.splashScreenMode === "cover" ? "cover" : cfg.splashScreenMode === "stretch" ? "fill" : "contain";
+            const pos = cfg.splashScreenPosition || "center center";
+            this.upsertSplashVideo(cfg.splashScreenUrl, { fit, position: pos, bgColor });
+            // keep background image cleared to avoid layering
+            s.backgroundImage = "none";
+            s.backgroundRepeat = "no-repeat";
+            s.backgroundPosition = "center center";
+            s.backgroundSize = "auto";
+        }
+        else if (haveUrl) {
+            // IMAGE path
+            const mode = ((_p = cfg.splashScreenMode) !== null && _p !== void 0 ? _p : "contain");
+            switch (mode) {
+                case "contain":
+                    s.backgroundSize = "contain";
+                    s.backgroundRepeat = "no-repeat";
+                    break;
+                case "cover":
+                    s.backgroundSize = "cover";
+                    s.backgroundRepeat = "no-repeat";
+                    break;
+                case "stretch":
+                    s.backgroundSize = "100% 100%";
+                    s.backgroundRepeat = "no-repeat";
+                    break;
+                case "repeat":
+                    s.backgroundSize = "auto";
+                    s.backgroundRepeat = "repeat";
+                    break;
             }
-            else {
-                // No image → ensure any previous image is cleared
-                s.backgroundImage = "none";
-                s.backgroundRepeat = "no-repeat";
-                s.backgroundPosition = "center center";
-                s.backgroundSize = "auto";
+            s.backgroundPosition = cfg.splashScreenPosition || "center center";
+            s.backgroundImage = `url("${cfg.splashScreenUrl}")`;
+        }
+        else {
+            // COLOR only
+            s.backgroundImage = "none";
+            s.backgroundRepeat = "no-repeat";
+            s.backgroundPosition = "center center";
+            s.backgroundSize = "auto";
+        }
+    }
+    ensureSplashHost() {
+        var _a, _b, _c, _d, _e, _f;
+        const el = (_f = (_a = this.loveLettersContainer) !== null && _a !== void 0 ? _a : (_e = (_d = (_c = (_b = this.webRtcController) === null || _b === void 0 ? void 0 : _b.videoPlayer) === null || _c === void 0 ? void 0 : _c.getVideoParentElement) === null || _d === void 0 ? void 0 : _d.call(_c)) === null || _e === void 0 ? void 0 : _e.parentElement) !== null && _f !== void 0 ? _f : null;
+        if (!el)
+            return null;
+        this._splashHost = el;
+        // ensure stacking works
+        if (getComputedStyle(this._splashHost).position === "static")
+            this._splashHost.style.position = "relative";
+        return this._splashHost;
+    }
+    destroySplashVideo() {
+        if (this._splashVideo) {
+            try {
+                this._splashVideo.pause();
+            }
+            catch (_a) { }
+            try {
+                this._splashVideo.remove();
+            }
+            catch (_b) { }
+            this._splashVideo = undefined;
+        }
+    }
+    upsertSplashVideo(url, opts) {
+        var _a, _b;
+        const host = this.ensureSplashHost();
+        if (!host)
+            return;
+        let v = this._splashVideo;
+        if (!v) {
+            v = document.createElement("video");
+            v.playsInline = true;
+            v.setAttribute("webkit-playsinline", "true");
+            v.muted = true; // for autoplay
+            v.autoplay = true;
+            v.loop = true;
+            v.style.position = "absolute";
+            v.style.inset = "0";
+            v.style.width = "100%";
+            v.style.height = "100%";
+            v.style.objectFit = "contain";
+            v.style.objectPosition = "center center";
+            v.style.pointerEvents = "none";
+            v.style.zIndex = "0";
+            host.appendChild(v);
+            this._splashVideo = v;
+        }
+        v.src = url;
+        v.style.objectFit = (_a = opts.fit) !== null && _a !== void 0 ? _a : "contain";
+        v.style.objectPosition = (_b = opts.position) !== null && _b !== void 0 ? _b : "center center";
+        if (opts.bgColor)
+            host.style.setProperty("background-color", opts.bgColor, "important");
+        v.style.display = "";
+        v.play().catch(() => { });
+    }
+    hideSplashVideo() {
+        if (this._splashVideo) {
+            try {
+                this._splashVideo.pause();
             }
+            catch (_a) { }
+            this._splashVideo.style.display = "none";
         }
-        catch (_r) { }
+    }
+    isVideoUrl(u) {
+        if (!u)
+            return false;
+        const s = u.split("?")[0].toLowerCase();
+        return (s.startsWith("blob:") ||
+            s.endsWith(".mp4") ||
+            s.endsWith(".webm") ||
+            s.endsWith(".ogg") ||
+            s.endsWith(".ogv") ||
+            s.endsWith(".m3u8"));
     }
 }
 

package/index.umd.js

@@ -23442,7 +23442,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.16";
+        this.VERSION = "1.3.18";
         this.whiteLabellingChanged = new EventHandler_1.EventHandler();
         this.signallingWlURL = "https://signalling-client.arcware.cloud/whiteLabel/";
         console.log(config);
@@ -24061,34 +24061,38 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
         }
     }
     runPostInitSideEffectsOnce() {
-        var _a, _b, _c, _d, _e, _f, _g;
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         if (this._postInitSideEffectsDone)
             return;
         this._postInitSideEffectsDone = true;
         try {
             (_a = this.handleMouseLock) === null || _a === void 0 ? void 0 : _a.call(this);
         }
-        catch (_h) { }
+        catch (_j) { }
         try {
             (_b = this.handleResolutionChange) === null || _b === void 0 ? void 0 : _b.call(this);
         }
-        catch (_j) { }
+        catch (_k) { }
         try {
             (_c = this.handleRemoveLoveLetters) === null || _c === void 0 ? void 0 : _c.call(this);
         }
-        catch (_k) { }
+        catch (_l) { }
         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) { }
+        catch (_m) { }
         try {
             (_f = this.applyResolutionIfPlaying) === null || _f === void 0 ? void 0 : _f.call(this);
         }
-        catch (_m) { }
+        catch (_o) { }
         try {
             (_g = this.removeXRIconIfDisabled) === null || _g === void 0 ? void 0 : _g.call(this);
         }
-        catch (_o) { }
+        catch (_p) { }
+        try {
+            (_h = this.hideSplashVideo) === null || _h === void 0 ? void 0 : _h.call(this);
+        }
+        catch (_q) { } // ← hide splash video when streaming
     }
     onVideoInitialized() {
         if (this.videoInitializedSent) {
@@ -24468,7 +24472,7 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
     applyBrandingFromSettings() {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
         const cfg = ((_b = (_a = this === null || this === void 0 ? void 0 : this.config) === null || _a === void 0 ? void 0 : _a.settings.whiteLabelling) !== null && _b !== void 0 ? _b : {});
-        // Loader image + fade
+        // Loader
         try {
             if (this.logoLoader) {
                 (_d = (_c = this.logoLoader).setImage) === null || _d === void 0 ? void 0 : _d.call(_c, cfg.loadingIconUrl);
@@ -24476,68 +24480,149 @@ class ArcwarePixelStreaming extends lib_pixelstreamingfrontend_ue5_5_1.PixelStre
             }
         }
         catch (_q) { }
-        // Pick splash host: loveLettersContainer (preferred) or player parent
-        try {
-            const el = (_m = (_g = this.loveLettersContainer) !== null && _g !== void 0 ? _g : (_l = (_k = (_j = (_h = this.webRtcController) === null || _h === void 0 ? void 0 : _h.videoPlayer) === null || _j === void 0 ? void 0 : _j.getVideoParentElement) === null || _k === void 0 ? void 0 : _k.call(_j)) === null || _l === void 0 ? void 0 : _l.parentElement) !== null && _m !== void 0 ? _m : null;
-            if (!el)
-                return;
-            const s = el.style;
-            // Nuke previous inline styles (longhands only; never touch 'background' shorthand here)
-            s.removeProperty("background-image");
-            s.removeProperty("background-size");
-            s.removeProperty("background-repeat");
-            s.removeProperty("background-position");
-            s.removeProperty("background-color");
-            // Also clear any earlier 'background' inline shorthand that might have been set elsewhere
-            // (we set to 'initial' first, then re-apply longhands)
-            s.setProperty("background", "initial");
-            el.classList.remove("aw-splash");
-            // If neither color nor image is provided, nothing to do
-            const haveColor = !!cfg.splashScreenBgColor;
-            const haveImage = !!cfg.splashScreenUrl;
-            if (!haveColor && !haveImage)
-                return;
-            // Always ensure our class is present when we brand
-            el.classList.add("aw-splash");
-            // Apply color with !important so external 'background: ... !important' can't wipe it
-            const bgColor = (_o = cfg.splashScreenBgColor) !== null && _o !== void 0 ? _o : "var(--color0)";
-            s.setProperty("background-color", bgColor, "important");
-            if (haveImage) {
-                // Mode → size/repeat mapping
-                const mode = ((_p = cfg.splashScreenMode) !== null && _p !== void 0 ? _p : "contain");
-                switch (mode) {
-                    case "contain":
-                        s.backgroundSize = "contain";
-                        s.backgroundRepeat = "no-repeat";
-                        break;
-                    case "cover":
-                        s.backgroundSize = "cover";
-                        s.backgroundRepeat = "no-repeat";
-                        break;
-                    case "stretch":
-                        s.backgroundSize = "100% 100%";
-                        s.backgroundRepeat = "no-repeat";
-                        break;
-                    case "repeat":
-                        s.backgroundSize = "auto"; // intrinsic
-                        s.backgroundRepeat = "repeat";
-                        break;
-                }
-                // Position
-                s.backgroundPosition = cfg.splashScreenPosition || "center center";
-                // Image last (longhand so it won't reset color)
-                // Use quotes to be safe with URLs containing parentheses/spaces
-                s.backgroundImage = `url("${cfg.splashScreenUrl}")`;
+        const host = (_m = (_g = this.loveLettersContainer) !== null && _g !== void 0 ? _g : (_l = (_k = (_j = (_h = this.webRtcController) === null || _h === void 0 ? void 0 : _h.videoPlayer) === null || _j === void 0 ? void 0 : _j.getVideoParentElement) === null || _k === void 0 ? void 0 : _k.call(_j)) === null || _l === void 0 ? void 0 : _l.parentElement) !== null && _m !== void 0 ? _m : null;
+        if (!host)
+            return;
+        const s = host.style;
+        // Reset background longhands (never use shorthand to avoid nuking color)
+        s.removeProperty("background-image");
+        s.removeProperty("background-size");
+        s.removeProperty("background-repeat");
+        s.removeProperty("background-position");
+        s.removeProperty("background-color");
+        s.setProperty("background", "initial");
+        host.classList.remove("aw-splash");
+        // Clear any previous splash video unless re-used below
+        this.destroySplashVideo();
+        const haveUrl = !!cfg.splashScreenUrl;
+        const haveColor = !!cfg.splashScreenBgColor;
+        // Nothing to apply?
+        if (!haveUrl && !haveColor)
+            return;
+        host.classList.add("aw-splash");
+        // Always apply color (visible behind image/video / letterboxing)
+        const bgColor = (_o = cfg.splashScreenBgColor) !== null && _o !== void 0 ? _o : "var(--color0)";
+        s.setProperty("background-color", bgColor, "important");
+        // Decide: video or image from the same URL
+        const isVideo = this.isVideoUrl(cfg.splashScreenUrl);
+        if (haveUrl && isVideo) {
+            // map splashScreenMode to object-fit
+            const fit = cfg.splashScreenMode === "cover" ? "cover" : cfg.splashScreenMode === "stretch" ? "fill" : "contain";
+            const pos = cfg.splashScreenPosition || "center center";
+            this.upsertSplashVideo(cfg.splashScreenUrl, { fit, position: pos, bgColor });
+            // keep background image cleared to avoid layering
+            s.backgroundImage = "none";
+            s.backgroundRepeat = "no-repeat";
+            s.backgroundPosition = "center center";
+            s.backgroundSize = "auto";
+        }
+        else if (haveUrl) {
+            // IMAGE path
+            const mode = ((_p = cfg.splashScreenMode) !== null && _p !== void 0 ? _p : "contain");
+            switch (mode) {
+                case "contain":
+                    s.backgroundSize = "contain";
+                    s.backgroundRepeat = "no-repeat";
+                    break;
+                case "cover":
+                    s.backgroundSize = "cover";
+                    s.backgroundRepeat = "no-repeat";
+                    break;
+                case "stretch":
+                    s.backgroundSize = "100% 100%";
+                    s.backgroundRepeat = "no-repeat";
+                    break;
+                case "repeat":
+                    s.backgroundSize = "auto";
+                    s.backgroundRepeat = "repeat";
+                    break;
             }
-            else {
-                // No image → ensure any previous image is cleared
-                s.backgroundImage = "none";
-                s.backgroundRepeat = "no-repeat";
-                s.backgroundPosition = "center center";
-                s.backgroundSize = "auto";
+            s.backgroundPosition = cfg.splashScreenPosition || "center center";
+            s.backgroundImage = `url("${cfg.splashScreenUrl}")`;
+        }
+        else {
+            // COLOR only
+            s.backgroundImage = "none";
+            s.backgroundRepeat = "no-repeat";
+            s.backgroundPosition = "center center";
+            s.backgroundSize = "auto";
+        }
+    }
+    ensureSplashHost() {
+        var _a, _b, _c, _d, _e, _f;
+        const el = (_f = (_a = this.loveLettersContainer) !== null && _a !== void 0 ? _a : (_e = (_d = (_c = (_b = this.webRtcController) === null || _b === void 0 ? void 0 : _b.videoPlayer) === null || _c === void 0 ? void 0 : _c.getVideoParentElement) === null || _d === void 0 ? void 0 : _d.call(_c)) === null || _e === void 0 ? void 0 : _e.parentElement) !== null && _f !== void 0 ? _f : null;
+        if (!el)
+            return null;
+        this._splashHost = el;
+        // ensure stacking works
+        if (getComputedStyle(this._splashHost).position === "static")
+            this._splashHost.style.position = "relative";
+        return this._splashHost;
+    }
+    destroySplashVideo() {
+        if (this._splashVideo) {
+            try {
+                this._splashVideo.pause();
+            }
+            catch (_a) { }
+            try {
+                this._splashVideo.remove();
+            }
+            catch (_b) { }
+            this._splashVideo = undefined;
+        }
+    }
+    upsertSplashVideo(url, opts) {
+        var _a, _b;
+        const host = this.ensureSplashHost();
+        if (!host)
+            return;
+        let v = this._splashVideo;
+        if (!v) {
+            v = document.createElement("video");
+            v.playsInline = true;
+            v.setAttribute("webkit-playsinline", "true");
+            v.muted = true; // for autoplay
+            v.autoplay = true;
+            v.loop = true;
+            v.style.position = "absolute";
+            v.style.inset = "0";
+            v.style.width = "100%";
+            v.style.height = "100%";
+            v.style.objectFit = "contain";
+            v.style.objectPosition = "center center";
+            v.style.pointerEvents = "none";
+            v.style.zIndex = "0";
+            host.appendChild(v);
+            this._splashVideo = v;
+        }
+        v.src = url;
+        v.style.objectFit = (_a = opts.fit) !== null && _a !== void 0 ? _a : "contain";
+        v.style.objectPosition = (_b = opts.position) !== null && _b !== void 0 ? _b : "center center";
+        if (opts.bgColor)
+            host.style.setProperty("background-color", opts.bgColor, "important");
+        v.style.display = "";
+        v.play().catch(() => { });
+    }
+    hideSplashVideo() {
+        if (this._splashVideo) {
+            try {
+                this._splashVideo.pause();
             }
+            catch (_a) { }
+            this._splashVideo.style.display = "none";
         }
-        catch (_r) { }
+    }
+    isVideoUrl(u) {
+        if (!u)
+            return false;
+        const s = u.split("?")[0].toLowerCase();
+        return (s.startsWith("blob:") ||
+            s.endsWith(".mp4") ||
+            s.endsWith(".webm") ||
+            s.endsWith(".ogg") ||
+            s.endsWith(".ogv") ||
+            s.endsWith(".m3u8"));
     }
 }
 exports.ArcwarePixelStreaming = ArcwarePixelStreaming;

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.16",
+  "version": "1.3.18",
   "type": "commonjs",
   "main": "./index.umd.js",
   "module": "./index.umd.js",

package/types/lib/ArcwareConfig.d.ts

@@ -29,7 +29,7 @@ export declare class ArcwareConfig extends Config {
     readonly session: Session;
     readonly settings: Settings;
     private _initialSettings;
-    readonly VERSION = "1.3.16";
+    readonly VERSION = "1.3.18";
     readonly whiteLabellingChanged: EventHandler<{
         loadingIconUrl?: string;
         loadingIconFadeMs?: number;

package/types/lib/ArcwarePixelStreaming.d.ts

@@ -18,6 +18,8 @@ export declare class ArcwarePixelStreaming extends PixelStreaming {
     private isProcessingQueue;
     private microphoneOverlay;
     private diagnosticsCollector;
+    private _splashHost?;
+    private _splashVideo?;
     private outbox;
     private videoInitializedSent;
     private _boundTransport?;
@@ -128,5 +130,10 @@ export declare class ArcwarePixelStreaming extends PixelStreaming {
     private removeXRIconIfDisabled;
     private injectCustomUI;
     private applyBrandingFromSettings;
+    private ensureSplashHost;
+    private destroySplashVideo;
+    private upsertSplashVideo;
+    private hideSplashVideo;
+    private isVideoUrl;
 }
 export {};