stormcloud-video-player 0.6.2 → 0.6.4

package/lib/ui/StormcloudVideoPlayer.cjs

@@ -979,6 +979,7 @@ function createVastAdLayer(contentVideo, options) {
     var destroyed = false;
     var tornDown = false;
     var trackingFired = createEmptyTrackingState();
+    var adStallTimerId;
     var currentAdEventHandlers;
     var preloadSlots = /* @__PURE__ */ new Map();
     function emit(event, payload) {
@@ -1094,7 +1095,14 @@ function createVastAdLayer(contentVideo, options) {
         video.volume = 1;
         return video;
     }
+    function clearAdStallTimer() {
+        if (adStallTimerId != null) {
+            clearTimeout(adStallTimerId);
+            adStallTimerId = void 0;
+        }
+    }
     function removeAdEventListeners() {
+        clearAdStallTimer();
         if (!currentAdEventHandlers || !adVideoElement) return;
         var el = adVideoElement;
         el.removeEventListener("timeupdate", currentAdEventHandlers.timeupdate);
@@ -1104,6 +1112,7 @@ function createVastAdLayer(contentVideo, options) {
         el.removeEventListener("volumechange", currentAdEventHandlers.volumechange);
         el.removeEventListener("pause", currentAdEventHandlers.pause);
         el.removeEventListener("play", currentAdEventHandlers.play);
+        el.removeEventListener("waiting", currentAdEventHandlers.waiting);
         currentAdEventHandlers = void 0;
     }
     function setupAdEventListeners() {
@@ -1128,6 +1137,7 @@ function createVastAdLayer(contentVideo, options) {
                 }
             },
             playing: function playing() {
+                clearAdStallTimer();
                 var ad = currentAd;
                 if (!ad || trackingFired.start) return;
                 trackingFired.start = true;
@@ -1164,6 +1174,16 @@ function createVastAdLayer(contentVideo, options) {
                 if (currentAd && adVideoElement && adVideoElement.currentTime > 0) {
                     fireTrackingPixels2(currentAd.trackingUrls.resume);
                 }
+            },
+            waiting: function waiting() {
+                clearAdStallTimer();
+                adStallTimerId = setTimeout(function() {
+                    adStallTimerId = void 0;
+                    if (adPlaying) {
+                        if (debug) console.warn("".concat(LOG, " Ad video stalled for too long, treating as error"));
+                        handleAdError();
+                    }
+                }, 8e3);
             }
         };
         adVideoElement.addEventListener("timeupdate", handlers.timeupdate);
@@ -1173,6 +1193,7 @@ function createVastAdLayer(contentVideo, options) {
         adVideoElement.addEventListener("volumechange", handlers.volumechange);
         adVideoElement.addEventListener("pause", handlers.pause);
         adVideoElement.addEventListener("play", handlers.play);
+        adVideoElement.addEventListener("waiting", handlers.waiting);
         currentAdEventHandlers = handlers;
     }
     function setAdPlayingFlag(isPlaying) {
@@ -1184,6 +1205,7 @@ function createVastAdLayer(contentVideo, options) {
     }
     function handleAdComplete() {
         if (tornDown) return;
+        clearAdStallTimer();
         if (debug) console.log("".concat(LOG, " Handling ad completion"));
         adPlaying = false;
         setAdPlayingFlag(false);
@@ -1197,6 +1219,7 @@ function createVastAdLayer(contentVideo, options) {
     function handleAdError() {
         if (tornDown) return;
         if (!adPlaying) return;
+        clearAdStallTimer();
         if (debug) console.log("".concat(LOG, " Handling ad error"));
         adPlaying = false;
         setAdPlayingFlag(false);
@@ -1247,6 +1270,7 @@ function createVastAdLayer(contentVideo, options) {
             adHls.loadSource(mediaFile.url);
             adHls.attachMedia(adVideoElement);
             adHls.on(import_hls.default.Events.MANIFEST_PARSED, function() {
+                if (!adPlaying) return;
                 adVideoElement.play().catch(function(error) {
                     console.error("".concat(LOG, " Error starting HLS ad playback:"), error);
                     handleAdError();
@@ -1295,7 +1319,7 @@ function createVastAdLayer(contentVideo, options) {
     }
     function playAd(bids) {
         return _async_to_generator(function() {
-            var winner, ad, contentVolume, _contentVideo_parentElement, container, adVolume, mediaFile;
+            var winner, ad, contentVolume, adVolume2, mediaFile2, _contentVideo_parentElement, container, adVolume, mediaFile;
             return _ts_generator(this, function(_state) {
                 switch(_state.label){
                     case 0:
@@ -1339,37 +1363,71 @@ function createVastAdLayer(contentVideo, options) {
                         trackingFired.impression = true;
                         contentVolume = contentVideo.volume;
                         originalVolume = Math.max(0, Math.min(1, contentVolume || originalVolume));
-                        if (singleElementMode) {
-                            mainHlsInstance === null || mainHlsInstance === void 0 ? void 0 : mainHlsInstance.detachMedia();
-                            teardownCurrentPlayback();
-                            adVideoElement = contentVideo;
-                            adHls = void 0;
+                        if (!singleElementMode) return [
+                            3,
+                            3
+                        ];
+                        mainHlsInstance === null || mainHlsInstance === void 0 ? void 0 : mainHlsInstance.detachMedia();
+                        teardownCurrentPlayback();
+                        adVideoElement = contentVideo;
+                        adHls = void 0;
+                        adPlaying = true;
+                        setAdPlayingFlag(true);
+                        contentVideo.removeAttribute("src");
+                        contentVideo.load();
+                        if (!continueLiveStreamDuringAds) {
+                            contentVideo.pause();
+                        }
+                        contentVideo.muted = true;
+                        contentVideo.volume = 0;
+                        return [
+                            4,
+                            new Promise(function(resolve) {
+                                return setTimeout(resolve, 200);
+                            })
+                        ];
+                    case 2:
+                        _state.sent();
+                        if (destroyed || tornDown) return [
+                            2
+                        ];
+                        contentVideo.style.visibility = "visible";
+                        contentVideo.style.opacity = "1";
+                        emit("content_pause");
+                        setupAdEventListeners();
+                        adVolume2 = originalMutedState ? 1 : originalVolume;
+                        adVideoElement.volume = Math.max(0, Math.min(1, adVolume2));
+                        adVideoElement.muted = false;
+                        mediaFile2 = selectBestMediaFile(ad.mediaFiles);
+                        if (debug) console.log("".concat(LOG, " Loading ad from: ").concat(mediaFile2.url));
+                        startPlayback(mediaFile2);
+                        return [
+                            2
+                        ];
+                    case 3:
+                        if (!adContainerEl) {
+                            ;
+                            container = document.createElement("div");
+                            container.style.position = "absolute";
+                            container.style.left = "0";
+                            container.style.top = "0";
+                            container.style.right = "0";
+                            container.style.bottom = "0";
+                            container.style.display = "none";
+                            container.style.alignItems = "center";
+                            container.style.justifyContent = "center";
+                            container.style.pointerEvents = "none";
+                            container.style.zIndex = "10";
+                            container.style.backgroundColor = "#000";
+                            (_contentVideo_parentElement = contentVideo.parentElement) === null || _contentVideo_parentElement === void 0 ? void 0 : _contentVideo_parentElement.appendChild(container);
+                            adContainerEl = container;
+                        }
+                        if (!adVideoElement) {
+                            adVideoElement = createAdVideoElement();
+                            adContainerEl.appendChild(adVideoElement);
                             setupAdEventListeners();
                         } else {
-                            if (!adContainerEl) {
-                                ;
-                                container = document.createElement("div");
-                                container.style.position = "absolute";
-                                container.style.left = "0";
-                                container.style.top = "0";
-                                container.style.right = "0";
-                                container.style.bottom = "0";
-                                container.style.display = "none";
-                                container.style.alignItems = "center";
-                                container.style.justifyContent = "center";
-                                container.style.pointerEvents = "none";
-                                container.style.zIndex = "10";
-                                container.style.backgroundColor = "#000";
-                                (_contentVideo_parentElement = contentVideo.parentElement) === null || _contentVideo_parentElement === void 0 ? void 0 : _contentVideo_parentElement.appendChild(container);
-                                adContainerEl = container;
-                            }
-                            if (!adVideoElement) {
-                                adVideoElement = createAdVideoElement();
-                                adContainerEl.appendChild(adVideoElement);
-                                setupAdEventListeners();
-                            } else {
-                                teardownCurrentPlayback();
-                            }
+                            teardownCurrentPlayback();
                         }
                         if (!continueLiveStreamDuringAds) {
                             contentVideo.pause();
@@ -1381,7 +1439,7 @@ function createVastAdLayer(contentVideo, options) {
                         adVolume = originalMutedState ? 1 : originalVolume;
                         adVideoElement.volume = Math.max(0, Math.min(1, adVolume));
                         adVideoElement.muted = false;
-                        if (!singleElementMode && adContainerEl) {
+                        if (adContainerEl) {
                             adContainerEl.style.display = "flex";
                             adContainerEl.style.pointerEvents = "auto";
                         }
@@ -1485,6 +1543,7 @@ function createVastAdLayer(contentVideo, options) {
                                 if (debug) console.log("".concat(LOG, " [preload] HLS manifest parsed, token=").concat(token));
                             });
                             hls.on(import_hls.default.Events.ERROR, function(_evt, data) {
+                                if (!preloadSlots.has(token)) return;
                                 if (data.fatal) {
                                     if (debug) console.warn("".concat(LOG, " [preload] HLS error for token=").concat(token));
                                     preloadSlots.delete(token);
@@ -1521,113 +1580,146 @@ function createVastAdLayer(contentVideo, options) {
     }
     function playPreloaded(token) {
         return _async_to_generator(function() {
-            var slot, contentVolume, adVolume2, videoEl, container2, adVolume21, adVolume, container;
+            var slot, contentVolume, adVolume2, videoEl, container2, adVolume21, nonFatalNetworkErrors, adVolume, container;
             return _ts_generator(this, function(_state) {
-                if (destroyed) return [
-                    2,
-                    Promise.reject(new Error("Layer has been destroyed"))
-                ];
-                slot = preloadSlots.get(token);
-                if (!slot) {
-                    if (debug) console.warn("".concat(LOG, " [preload] No slot found for token=").concat(token, ", nothing to play"));
-                    return [
-                        2
-                    ];
-                }
-                preloadSlots.delete(token);
-                if (debug) console.log("".concat(LOG, " [preload] Playing preloaded ad, token=").concat(token, ", ready=").concat(slot.ready));
-                contentVolume = contentVideo.volume;
-                originalVolume = Math.max(0, Math.min(1, contentVolume || originalVolume));
-                sessionId = generateSessionId();
-                currentAd = slot.ad;
-                trackingFired = _object_spread({}, createEmptyTrackingState());
-                fireTrackingPixels2(slot.ad.trackingUrls.impression);
-                trackingFired.impression = true;
-                if (singleElementMode) {
-                    mainHlsInstance === null || mainHlsInstance === void 0 ? void 0 : mainHlsInstance.detachMedia();
-                    teardownCurrentPlayback();
-                    adVideoElement = contentVideo;
-                    adHls = void 0;
-                    setupAdEventListeners();
-                    if (!continueLiveStreamDuringAds) {
-                        contentVideo.pause();
-                    }
-                    contentVideo.muted = true;
-                    contentVideo.volume = 0;
-                    adPlaying = true;
-                    setAdPlayingFlag(true);
-                    adVolume2 = originalMutedState ? 1 : originalVolume;
-                    contentVideo.volume = Math.max(0, Math.min(1, adVolume2));
-                    contentVideo.muted = false;
-                    emit("content_pause");
-                    if (debug) console.log("".concat(LOG, " [preload] singleElementMode: attaching ad to contentVideo, url=").concat(slot.mediaFile.url));
-                    startPlayback(slot.mediaFile);
-                    return [
-                        2
-                    ];
-                }
-                if (smartTVMode && !slot.videoEl) {
-                    teardownCurrentPlayback();
-                    if (adVideoElement) {
-                        adVideoElement.remove();
-                        adVideoElement = void 0;
-                    }
-                    videoEl = createAdVideoElement();
-                    videoEl.style.visibility = "visible";
-                    videoEl.style.pointerEvents = "none";
-                    container2 = ensureAdContainer();
-                    container2.appendChild(videoEl);
-                    adVideoElement = videoEl;
-                    setupAdEventListeners();
-                    if (!continueLiveStreamDuringAds) {
-                        contentVideo.pause();
-                    }
-                    contentVideo.muted = true;
-                    contentVideo.volume = 0;
-                    adPlaying = true;
-                    setAdPlayingFlag(true);
-                    adVolume21 = originalMutedState ? 1 : originalVolume;
-                    adVideoElement.volume = Math.max(0, Math.min(1, adVolume21));
-                    adVideoElement.muted = false;
-                    container2.style.display = "flex";
-                    container2.style.pointerEvents = "auto";
-                    emit("content_pause");
-                    if (debug) console.log("".concat(LOG, " [preload] smartTVMode deferred: creating video element and loading, url=").concat(slot.mediaFile.url));
-                    startPlayback(slot.mediaFile);
-                    return [
-                        2
-                    ];
-                }
-                teardownCurrentPlayback();
-                if (adVideoElement && adVideoElement !== slot.videoEl) {
-                    adVideoElement.remove();
-                }
-                slot.videoEl.style.visibility = "visible";
-                slot.videoEl.style.pointerEvents = "none";
-                adVideoElement = slot.videoEl;
-                adHls = slot.hlsInstance;
-                setupAdEventListeners();
-                if (!continueLiveStreamDuringAds) {
-                    contentVideo.pause();
+                switch(_state.label){
+                    case 0:
+                        if (destroyed) return [
+                            2,
+                            Promise.reject(new Error("Layer has been destroyed"))
+                        ];
+                        slot = preloadSlots.get(token);
+                        if (!slot) {
+                            if (debug) console.warn("".concat(LOG, " [preload] No slot found for token=").concat(token, ", nothing to play"));
+                            return [
+                                2
+                            ];
+                        }
+                        preloadSlots.delete(token);
+                        if (debug) console.log("".concat(LOG, " [preload] Playing preloaded ad, token=").concat(token, ", ready=").concat(slot.ready));
+                        contentVolume = contentVideo.volume;
+                        originalVolume = Math.max(0, Math.min(1, contentVolume || originalVolume));
+                        sessionId = generateSessionId();
+                        currentAd = slot.ad;
+                        trackingFired = _object_spread({}, createEmptyTrackingState());
+                        fireTrackingPixels2(slot.ad.trackingUrls.impression);
+                        trackingFired.impression = true;
+                        if (!singleElementMode) return [
+                            3,
+                            2
+                        ];
+                        mainHlsInstance === null || mainHlsInstance === void 0 ? void 0 : mainHlsInstance.detachMedia();
+                        teardownCurrentPlayback();
+                        adVideoElement = contentVideo;
+                        adHls = void 0;
+                        adPlaying = true;
+                        setAdPlayingFlag(true);
+                        contentVideo.removeAttribute("src");
+                        contentVideo.load();
+                        contentVideo.muted = true;
+                        contentVideo.volume = 0;
+                        return [
+                            4,
+                            new Promise(function(resolve) {
+                                return setTimeout(resolve, 200);
+                            })
+                        ];
+                    case 1:
+                        _state.sent();
+                        if (destroyed || tornDown) return [
+                            2
+                        ];
+                        contentVideo.style.visibility = "visible";
+                        contentVideo.style.opacity = "1";
+                        emit("content_pause");
+                        setupAdEventListeners();
+                        adVolume2 = originalMutedState ? 1 : originalVolume;
+                        contentVideo.volume = Math.max(0, Math.min(1, adVolume2));
+                        contentVideo.muted = false;
+                        if (debug) console.log("".concat(LOG, " [preload] singleElementMode: attaching ad to contentVideo, url=").concat(slot.mediaFile.url));
+                        startPlayback(slot.mediaFile);
+                        return [
+                            2
+                        ];
+                    case 2:
+                        if (smartTVMode && !slot.videoEl) {
+                            teardownCurrentPlayback();
+                            if (adVideoElement) {
+                                adVideoElement.remove();
+                                adVideoElement = void 0;
+                            }
+                            videoEl = createAdVideoElement();
+                            videoEl.style.visibility = "visible";
+                            videoEl.style.pointerEvents = "none";
+                            container2 = ensureAdContainer();
+                            container2.appendChild(videoEl);
+                            adVideoElement = videoEl;
+                            setupAdEventListeners();
+                            if (!continueLiveStreamDuringAds) {
+                                contentVideo.pause();
+                            }
+                            contentVideo.muted = true;
+                            contentVideo.volume = 0;
+                            adPlaying = true;
+                            setAdPlayingFlag(true);
+                            adVolume21 = originalMutedState ? 1 : originalVolume;
+                            adVideoElement.volume = Math.max(0, Math.min(1, adVolume21));
+                            adVideoElement.muted = false;
+                            container2.style.display = "flex";
+                            container2.style.pointerEvents = "auto";
+                            emit("content_pause");
+                            if (debug) console.log("".concat(LOG, " [preload] smartTVMode deferred: creating video element and loading, url=").concat(slot.mediaFile.url));
+                            startPlayback(slot.mediaFile);
+                            return [
+                                2
+                            ];
+                        }
+                        teardownCurrentPlayback();
+                        if (adVideoElement && adVideoElement !== slot.videoEl) {
+                            adVideoElement.remove();
+                        }
+                        slot.videoEl.style.visibility = "visible";
+                        slot.videoEl.style.pointerEvents = "none";
+                        adVideoElement = slot.videoEl;
+                        adHls = slot.hlsInstance;
+                        if (adHls) {
+                            nonFatalNetworkErrors = 0;
+                            adHls.on(import_hls.default.Events.ERROR, function(_event, data) {
+                                if (!adPlaying) return;
+                                if (data.fatal) {
+                                    handleAdError();
+                                } else if (data.type === import_hls.default.ErrorTypes.NETWORK_ERROR) {
+                                    nonFatalNetworkErrors++;
+                                    if (nonFatalNetworkErrors >= 3) {
+                                        if (debug) console.warn("".concat(LOG, " [preload] Too many non-fatal HLS network errors during playback, treating as fatal"));
+                                        handleAdError();
+                                    }
+                                }
+                            });
+                        }
+                        setupAdEventListeners();
+                        if (!continueLiveStreamDuringAds) {
+                            contentVideo.pause();
+                        }
+                        contentVideo.muted = true;
+                        contentVideo.volume = 0;
+                        adPlaying = true;
+                        setAdPlayingFlag(true);
+                        adVolume = originalMutedState ? 1 : originalVolume;
+                        adVideoElement.volume = Math.max(0, Math.min(1, adVolume));
+                        adVideoElement.muted = false;
+                        container = ensureAdContainer();
+                        container.style.display = "flex";
+                        container.style.pointerEvents = "auto";
+                        emit("content_pause");
+                        adVideoElement.play().catch(function(error) {
+                            console.error("".concat(LOG, " [preload] Error playing preloaded ad:"), error);
+                            handleAdError();
+                        });
+                        return [
+                            2
+                        ];
                 }
-                contentVideo.muted = true;
-                contentVideo.volume = 0;
-                adPlaying = true;
-                setAdPlayingFlag(true);
-                adVolume = originalMutedState ? 1 : originalVolume;
-                adVideoElement.volume = Math.max(0, Math.min(1, adVolume));
-                adVideoElement.muted = false;
-                container = ensureAdContainer();
-                container.style.display = "flex";
-                container.style.pointerEvents = "auto";
-                emit("content_pause");
-                adVideoElement.play().catch(function(error) {
-                    console.error("".concat(LOG, " [preload] Error playing preloaded ad:"), error);
-                    handleAdError();
-                });
-                return [
-                    2
-                ];
             });
         })();
     }
@@ -1812,6 +1904,7 @@ function createVastAdLayer(contentVideo, options) {
             return 1;
         },
         showPlaceholder: function showPlaceholder() {
+            if (singleElementMode) return;
             contentVideo.style.opacity = "0";
             contentVideo.style.visibility = "hidden";
             if (!adContainerEl) {
@@ -3508,7 +3601,9 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
                             }
                             _this.adLayer.cancelPreload(token);
                         } else {
-                            _this.showPlaceholderLayer();
+                            if (!_this.config.singlePipelineMode) {
+                                _this.showPlaceholderLayer();
+                            }
                             _this.adLayer.showPlaceholder();
                             _this.isInAdTransition = true;
                             setTimeout(function() {
@@ -3532,7 +3627,9 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
                                 console.log("[StormcloudVideoPlayer] content_resume: skip pending bids, only", remainingNow1, "ms left");
                             }
                         } else {
-                            _this.showPlaceholderLayer();
+                            if (!_this.config.singlePipelineMode) {
+                                _this.showPlaceholderLayer();
+                            }
                             _this.adLayer.showPlaceholder();
                             _this.isInAdTransition = true;
                             setTimeout(function() {
@@ -3883,7 +3980,7 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
                         };
                         this.adLayer.updateOriginalMutedState(this.video.muted, this.video.volume);
                     }
-                    if (!this.config.disableFiller && !this.video.muted) {
+                    if (!this.config.disableFiller && !this.video.muted && !this.adLayer.isAdPlaying()) {
                         this.video.muted = true;
                         this.video.volume = 0;
                         if (this.config.debugAdTiming) {
@@ -4900,7 +4997,7 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
                                 if (!this.config.disableFiller) this.showAds = true;
                                 if (adBreakDurationMs != null) {
                                     this.startFillerBreakTimer(adBreakDurationMs);
-                                } else if (!this.config.disableFiller) {
+                                } else if (!this.config.disableFiller && this.preloadedTokens.length === 0) {
                                     this.showPlaceholderLayer();
                                 }
                                 if (!this.config.disableFiller) this.adLayer.showPlaceholder();
@@ -5517,7 +5614,6 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
                                 console.log("[StormcloudVideoPlayer] Smart TV: audio state restored on MANIFEST_PARSED after re-attach");
                             }
                             hlsRef.startLoad(-1);
-                            tryPlay(0);
                             if (debugEnabled) {
                                 console.log("[StormcloudVideoPlayer] Smart TV: seeking to live edge and resuming playback after re-attach");
                             }