stormcloud-video-player 0.3.9 → 0.3.11

package/lib/ui/StormcloudVideoPlayer.cjs

@@ -2085,6 +2085,12 @@ var StormcloudVideoPlayer = class {
     this.targetAdBreakDurationMs = null;
     this.isAdaptiveMode = false;
     this.failedVastUrls = /* @__PURE__ */ new Set();
+    this.continuousFetchingActive = false;
+    this.adRequestQueue = [];
+    this.successfulAdRequests = [];
+    this.maxPlaceholderDurationMs = 5e3;
+    this.placeholderStartTimeMs = null;
+    this.isShowingPlaceholder = false;
     initializePolyfills();
     const browserOverrides = getBrowserConfigOverrides();
     this.config = { ...config, ...browserOverrides };
@@ -2391,16 +2397,11 @@ var StormcloudVideoPlayer = class {
         return;
       }
       const remaining = this.getRemainingAdMs();
-      if (remaining > 500 && this.adPodQueue.length > 0) {
-        const nextPreloaded = this.findNextPreloadedAd();
-        if (nextPreloaded) {
-          this.currentAdIndex++;
-          this.playSingleAd(nextPreloaded).catch(() => {
-            this.handleAdPodComplete();
-          });
-        } else {
-          this.handleAdPodComplete();
-        }
+      if (this.config.debugAdTiming) {
+        console.log(`[CONTINUOUS-FETCH] content_resume event: remaining=${remaining}ms, queued ads=${this.adRequestQueue.length}`);
+      }
+      if (remaining > 500) {
+        this.tryNextAvailableAd();
       } else {
         this.handleAdPodComplete();
       }
@@ -3000,155 +3001,251 @@ var StormcloudVideoPlayer = class {
     return true;
   }
   async handleAdStart(_marker) {
-    var _a;
     const scheduled = this.findCurrentOrNextBreak(
       this.video.currentTime * 1e3
     );
     const tags = this.selectVastTagsForBreak(scheduled);
-    let vastTagUrls = [];
+    let baseVastUrl;
     if (this.apiVastTagUrl) {
-      let numberOfAds = 1;
-      if (this.isLiveStream) {
-        const adBreakDurationMs = _marker.durationSeconds != null ? _marker.durationSeconds * 1e3 : scheduled == null ? void 0 : scheduled.durationMs;
-        if (adBreakDurationMs != null && adBreakDurationMs > 0) {
-          this.isAdaptiveMode = true;
-          this.targetAdBreakDurationMs = adBreakDurationMs;
-          this.fetchedAdDurations.clear();
-          numberOfAds = 2;
-          if (this.config.debugAdTiming) {
-            console.log(
-              `[ADAPTIVE-POD] \u{1F4FA} LIVE MODE (ADAPTIVE): Target duration=${adBreakDurationMs}ms | Starting with ${numberOfAds} ads, will fetch actual durations and add more dynamically`
-            );
-          }
-        } else {
-          if (this.config.debugAdTiming) {
-            console.warn(
-              "[DEBUG-POD] \u26A0\uFE0F LIVE MODE: No duration available, defaulting to 1 ad"
-            );
-          }
+      baseVastUrl = this.apiVastTagUrl;
+    } else if (tags && tags.length > 0 && tags[0]) {
+      baseVastUrl = tags[0];
+    } else {
+      return;
+    }
+    const adBreakDurationMs = _marker.durationSeconds != null ? _marker.durationSeconds * 1e3 : scheduled == null ? void 0 : scheduled.durationMs;
+    if (this.isLiveStream && adBreakDurationMs != null && adBreakDurationMs > 0) {
+      this.isAdaptiveMode = true;
+      this.targetAdBreakDurationMs = adBreakDurationMs;
+      this.fetchedAdDurations.clear();
+      if (this.config.debugAdTiming) {
+        console.log(
+          `[CONTINUOUS-FETCH] \u{1F4FA} LIVE MODE: Target duration=${adBreakDurationMs}ms | Will continuously fetch ads during break`
+        );
+      }
+    } else {
+      this.isAdaptiveMode = false;
+      this.targetAdBreakDurationMs = null;
+      this.fetchedAdDurations.clear();
+      if (this.config.debugAdTiming) {
+        console.log(
+          `[CONTINUOUS-FETCH] \u{1F3AC} VOD MODE: Using fixed ad strategy`
+        );
+      }
+    }
+    this.adPodAllUrls = [];
+    this.preloadingAdUrls.clear();
+    this.vastToMediaUrlMap.clear();
+    this.preloadedMediaUrls.clear();
+    this.preloadingMediaUrls.clear();
+    this.failedVastUrls.clear();
+    this.adRequestQueue = [];
+    this.successfulAdRequests = [];
+    this.continuousFetchingActive = true;
+    this.isShowingPlaceholder = false;
+    this.placeholderStartTimeMs = null;
+    const currentMuted = this.video.muted;
+    const currentVolume = this.video.volume;
+    this.ima.updateOriginalMutedState(currentMuted, currentVolume);
+    this.inAdBreak = true;
+    this.currentAdIndex = 0;
+    this.totalAdsInBreak = 1;
+    this.adPodQueue = [];
+    if (this.expectedAdBreakDurationMs == null && adBreakDurationMs != null) {
+      this.expectedAdBreakDurationMs = adBreakDurationMs;
+      this.currentAdBreakStartWallClockMs = Date.now();
+      this.scheduleAdStopCountdown(this.expectedAdBreakDurationMs);
+    }
+    if (this.config.debugAdTiming) {
+      console.log("[CONTINUOUS-FETCH] \u{1F680} Immediately requesting first ad...");
+    }
+    const firstAdUrlArray = this.generateVastUrlsWithCorrelators(baseVastUrl, 1);
+    const firstAdUrl = firstAdUrlArray[0];
+    if (!firstAdUrl) {
+      if (this.config.debugAdTiming) {
+        console.warn("[CONTINUOUS-FETCH] \u26A0\uFE0F Failed to generate first ad URL");
+      }
+      this.handleAdPodComplete();
+      return;
+    }
+    try {
+      await this.ima.requestAds(firstAdUrl);
+      if (this.config.debugAdTiming) {
+        console.log("[CONTINUOUS-FETCH] \u2705 First ad request successful, starting playback");
+      }
+      this.successfulAdRequests.push(firstAdUrl);
+      this.currentAdIndex++;
+      this.startContinuousFetching(baseVastUrl);
+      await this.ima.play();
+    } catch (error) {
+      if (this.config.debugAdTiming) {
+        console.warn("[CONTINUOUS-FETCH] \u26A0\uFE0F First ad request failed:", error);
+      }
+      this.failedVastUrls.add(firstAdUrl);
+      this.startContinuousFetching(baseVastUrl);
+      this.tryNextAvailableAd();
+    }
+  }
+  startContinuousFetching(baseVastUrl) {
+    if (!this.continuousFetchingActive) {
+      return;
+    }
+    if (this.config.debugAdTiming) {
+      console.log("[CONTINUOUS-FETCH] \u{1F504} Starting continuous ad fetching loop");
+    }
+    this.continuousFetchLoop(baseVastUrl);
+  }
+  async continuousFetchLoop(baseVastUrl) {
+    while (this.continuousFetchingActive && this.inAdBreak) {
+      const remaining = this.getRemainingAdMs();
+      if (remaining <= 0) {
+        if (this.config.debugAdTiming) {
+          console.log("[CONTINUOUS-FETCH] \u23F9\uFE0F Ad break time expired, stopping fetch loop");
         }
-      } else {
-        this.isAdaptiveMode = false;
-        this.targetAdBreakDurationMs = null;
-        this.fetchedAdDurations.clear();
-        if (this.apiNumberAds && this.apiNumberAds > 1) {
-          numberOfAds = this.apiNumberAds;
+        break;
+      }
+      const maxQueueSize = 3;
+      if (this.adRequestQueue.length >= maxQueueSize) {
+        if (this.config.debugAdTiming) {
+          console.log(`[CONTINUOUS-FETCH] \u23F8\uFE0F Queue full (${this.adRequestQueue.length}), pausing fetching...`);
+        }
+        await new Promise((resolve) => setTimeout(resolve, 2e3));
+        continue;
+      }
+      const newAdUrl = this.generateVastUrlsWithCorrelators(baseVastUrl, 1)[0];
+      if (!newAdUrl || this.failedVastUrls.has(newAdUrl)) {
+        await new Promise((resolve) => setTimeout(resolve, 1e3));
+        continue;
+      }
+      if (this.config.debugAdTiming) {
+        console.log(`[CONTINUOUS-FETCH] \u{1F4E1} Attempting to fetch ad (${this.successfulAdRequests.length + this.adRequestQueue.length + 1} total)...`);
+      }
+      try {
+        const response = await fetch(newAdUrl, { mode: "cors" });
+        if (!response.ok) {
+          throw new Error(`Failed to fetch VAST: ${response.status}`);
+        }
+        const xmlText = await response.text();
+        const parser = new DOMParser();
+        const xmlDoc = parser.parseFromString(xmlText, "text/xml");
+        const mediaFiles = xmlDoc.querySelectorAll("MediaFile");
+        if (mediaFiles.length === 0) {
           if (this.config.debugAdTiming) {
-            console.log(
-              `[DEBUG-POD] \u{1F3AC} VOD MODE (FIXED): Using number_ads=${numberOfAds} from API`
-            );
+            console.log("[CONTINUOUS-FETCH] \u26A0\uFE0F VAST response has no media files, skipping");
           }
+          this.failedVastUrls.add(newAdUrl);
+          await new Promise((resolve) => setTimeout(resolve, 1e3));
+          continue;
         }
-      }
-      if (numberOfAds > 1) {
-        vastTagUrls = this.generateVastUrlsWithCorrelators(
-          this.apiVastTagUrl,
-          numberOfAds
-        );
         if (this.config.debugAdTiming) {
-          console.log(
-            `[DEBUG-POD] \u{1F504} Generated ${vastTagUrls.length} initial VAST URLs with unique correlators`
-          );
+          console.log(`[CONTINUOUS-FETCH] \u2705 Successfully fetched ad, adding to queue (queue size: ${this.adRequestQueue.length + 1})`);
         }
-      } else {
-        vastTagUrls = [this.apiVastTagUrl];
+        this.adRequestQueue.push(newAdUrl);
+        this.totalAdsInBreak++;
+        await new Promise((resolve) => setTimeout(resolve, 500));
+      } catch (error) {
+        if (this.config.debugAdTiming) {
+          console.log("[CONTINUOUS-FETCH] \u274C Ad fetch failed:", error.message);
+        }
+        this.failedVastUrls.add(newAdUrl);
+        await new Promise((resolve) => setTimeout(resolve, 2e3));
       }
-    } else if (tags && tags.length > 0) {
-      vastTagUrls = tags;
-    } else {
+    }
+    if (this.config.debugAdTiming) {
+      console.log("[CONTINUOUS-FETCH] \u{1F6D1} Continuous fetch loop ended");
+    }
+  }
+  stopContinuousFetching() {
+    this.continuousFetchingActive = false;
+    if (this.config.debugAdTiming) {
+      console.log("[CONTINUOUS-FETCH] \u{1F6D1} Stopping continuous ad fetching");
+    }
+  }
+  async tryNextAvailableAd(retryCount = 0) {
+    const remaining = this.getRemainingAdMs();
+    if (remaining <= 500) {
+      if (this.config.debugAdTiming) {
+        console.log("[CONTINUOUS-FETCH] \u23F9\uFE0F No time remaining, ending ad break");
+      }
+      this.handleAdPodComplete();
       return;
     }
-    if (vastTagUrls.length > 0) {
-      this.adPodAllUrls = [...vastTagUrls];
-      this.preloadingAdUrls.clear();
-      this.vastToMediaUrlMap.clear();
-      this.preloadedMediaUrls.clear();
-      this.preloadingMediaUrls.clear();
-      this.failedVastUrls.clear();
-      const currentMuted = this.video.muted;
-      const currentVolume = this.video.volume;
-      this.ima.updateOriginalMutedState(currentMuted, currentVolume);
-      this.inAdBreak = true;
-      this.currentAdIndex = 0;
-      this.totalAdsInBreak = vastTagUrls.length;
-      this.adPodQueue = [...vastTagUrls];
-      if (this.isAdaptiveMode) {
+    if (this.adRequestQueue.length > 0) {
+      const nextAdUrl = this.adRequestQueue.shift();
+      if (nextAdUrl) {
         if (this.config.debugAdTiming) {
-          console.log("[ADAPTIVE-POD] \u{1F680} Preloading first 2 ads before starting playback...");
+          console.log(`[CONTINUOUS-FETCH] \u{1F3AC} Playing next queued ad (${this.currentAdIndex + 1}/${this.totalAdsInBreak}, ${this.adRequestQueue.length} remaining in queue)`);
         }
-        try {
-          const adsToPreloadBeforeStart = Math.min(2, this.adPodAllUrls.length);
-          for (let i = 0; i < adsToPreloadBeforeStart; i++) {
-            const url = this.adPodAllUrls[i];
-            if (url) {
-              await this.preloadSingleAd(url);
-              if (this.config.debugAdTiming) {
-                console.log(`[ADAPTIVE-POD] \u2705 Preloaded ad ${i + 1}/${adsToPreloadBeforeStart}`);
-              }
-            }
-          }
-          if (this.config.debugAdTiming) {
-            console.log("[ADAPTIVE-POD] \u{1F3AC} First ads preloaded, starting playback immediately");
-          }
-        } catch (error) {
-          if (this.config.debugAdTiming) {
-            console.warn(
-              "[ADAPTIVE-POD] \u26A0\uFE0F Error preloading initial ads:",
-              error
-            );
-          }
-        }
-        this.preloadAllAdsInBackground().catch((error) => {
-          if (this.config.debugAdTiming) {
-            console.warn(
-              "[ADAPTIVE-POD] Error in background preloading:",
-              error
-            );
-          }
-        });
-        await this.playAdPod();
-      } else {
-        this.preloadAllAdsInBackground().catch((error) => {
-          if (this.config.debugAdTiming) {
-            console.warn(
-              "[StormcloudVideoPlayer] Error in background preloading:",
-              error
-            );
-          }
+        this.currentAdIndex++;
+        this.successfulAdRequests.push(nextAdUrl);
+        await this.playSingleAd(nextAdUrl).catch(() => {
+          this.tryNextAvailableAd(0);
         });
-        await this.playAdPod();
+        return;
       }
     }
-    if (this.expectedAdBreakDurationMs == null && (scheduled == null ? void 0 : scheduled.durationMs) != null) {
-      this.expectedAdBreakDurationMs = scheduled.durationMs;
-      this.currentAdBreakStartWallClockMs = (_a = this.currentAdBreakStartWallClockMs) != null ? _a : Date.now();
-      this.scheduleAdStopCountdown(this.expectedAdBreakDurationMs);
+    const maxRetries = 5;
+    if (this.continuousFetchingActive && retryCount < maxRetries && remaining > 2e3) {
+      if (this.config.debugAdTiming) {
+        console.log(`[CONTINUOUS-FETCH] \u23F3 Queue empty but fetching active, waiting... (retry ${retryCount + 1}/${maxRetries})`);
+      }
+      await new Promise((resolve) => setTimeout(resolve, 1e3));
+      await this.tryNextAvailableAd(retryCount + 1);
+      return;
+    }
+    if (!this.isShowingPlaceholder && remaining > 1e3) {
+      this.showPlaceholderAndWaitForAds();
+    } else {
+      if (this.config.debugAdTiming) {
+        console.log("[CONTINUOUS-FETCH] \u23F9\uFE0F No more ads available, ending ad break");
+      }
+      this.handleAdPodComplete();
     }
   }
-  async playAdPod() {
-    if (this.adPodQueue.length === 0) {
+  async showPlaceholderAndWaitForAds() {
+    const remaining = this.getRemainingAdMs();
+    const waitTime = Math.min(this.maxPlaceholderDurationMs, remaining);
+    if (waitTime < 1e3) {
+      this.handleAdPodComplete();
       return;
     }
-    const waitTime = this.isAdaptiveMode ? 50 : 500;
-    await new Promise((resolve) => setTimeout(resolve, waitTime));
-    const firstPreloaded = this.findNextPreloadedAd();
-    if (!firstPreloaded) {
-      const firstAd = this.adPodQueue.shift();
-      if (firstAd) {
-        this.currentAdIndex++;
-        try {
-          await this.playSingleAd(firstAd);
-        } catch (error) {
-          return;
+    if (this.config.debugAdTiming) {
+      console.log(`[CONTINUOUS-FETCH] \u2B1B Showing black placeholder for ${waitTime}ms while waiting for ads`);
+    }
+    this.isShowingPlaceholder = true;
+    this.placeholderStartTimeMs = Date.now();
+    this.ima.showPlaceholder();
+    const checkInterval = 500;
+    const maxChecks = Math.floor(waitTime / checkInterval);
+    for (let i = 0; i < maxChecks; i++) {
+      await new Promise((resolve) => setTimeout(resolve, checkInterval));
+      if (!this.inAdBreak) {
+        return;
+      }
+      if (this.adRequestQueue.length > 0) {
+        if (this.config.debugAdTiming) {
+          console.log("[CONTINUOUS-FETCH] \u2705 New ad became available during placeholder");
+        }
+        this.isShowingPlaceholder = false;
+        this.placeholderStartTimeMs = null;
+        this.ima.hidePlaceholder();
+        const nextAdUrl = this.adRequestQueue.shift();
+        if (nextAdUrl) {
+          this.currentAdIndex++;
+          await this.playSingleAd(nextAdUrl).catch(() => {
+            this.tryNextAvailableAd();
+          });
         }
+        return;
       }
-      return;
     }
-    this.currentAdIndex++;
-    try {
-      await this.playSingleAd(firstPreloaded);
-    } catch (error) {
+    if (this.config.debugAdTiming) {
+      console.log("[CONTINUOUS-FETCH] \u23F0 Placeholder timeout reached, no ads fetched");
     }
+    this.isShowingPlaceholder = false;
+    this.placeholderStartTimeMs = null;
+    this.ima.hidePlaceholder();
+    this.handleAdPodComplete();
   }
   findCurrentOrNextBreak(nowMs) {
     var _a;
@@ -3308,10 +3405,18 @@ var StormcloudVideoPlayer = class {
     this.clearAdRequestWatchdog();
     this.clearAdFailsafeTimer();
     this.activeAdRequestToken = null;
+    this.stopContinuousFetching();
+    if (this.isShowingPlaceholder) {
+      this.ima.hidePlaceholder();
+      this.isShowingPlaceholder = false;
+      this.placeholderStartTimeMs = null;
+    }
     this.preloadingAdUrls.clear();
     this.vastToMediaUrlMap.clear();
     this.preloadedMediaUrls.clear();
     this.preloadingMediaUrls.clear();
+    this.adRequestQueue = [];
+    this.successfulAdRequests = [];
     this.inAdBreak = false;
     this.expectedAdBreakDurationMs = void 0;
     this.currentAdBreakStartWallClockMs = void 0;
@@ -3338,61 +3443,14 @@ var StormcloudVideoPlayer = class {
     }
   }
   handleAdFailure() {
-    const remaining = this.getRemainingAdMs();
-    const availableAds = this.adPodQueue.filter((url) => !this.failedVastUrls.has(url)).length;
-    if (remaining > 500 && availableAds > 0) {
-      if (this.isAdaptiveMode && this.currentAdIndex <= 1) {
-        console.log("[ADAPTIVE-POD] \u23F3 First ad failed, waiting for sequential preload to catch up...");
-        setTimeout(() => {
-          this.tryNextAdWithRetry(0);
-        }, 1500);
-        return;
-      }
-      const nextPreloaded = this.findNextPreloadedAd();
-      if (nextPreloaded) {
-        this.currentAdIndex++;
-        this.playSingleAd(nextPreloaded).catch(() => {
-          this.handleAdPodComplete();
-        });
-        return;
-      }
-    }
-    console.error("[AD-ERROR] All ads failed or time expired. Failed URLs:", this.failedVastUrls.size);
-    this.handleAdPodComplete();
-  }
-  tryNextAdWithRetry(retryCount) {
-    const maxRetries = 3;
     const remaining = this.getRemainingAdMs();
     if (this.config.debugAdTiming) {
-      console.log(
-        `[ADAPTIVE-POD] \u{1F50D} Retry attempt ${retryCount}: remaining=${remaining}ms, queue=${this.adPodQueue.length}, totalAds=${this.totalAdsInBreak}`
-      );
-    }
-    if (remaining <= 500 || this.adPodQueue.length === 0) {
-      console.log("[ADAPTIVE-POD] \u23F9\uFE0F No more time or ads available");
-      this.handleAdPodComplete();
-      return;
+      console.log(`[CONTINUOUS-FETCH] Ad failure: remaining=${remaining}ms, queued ads=${this.adRequestQueue.length}`);
     }
-    const nextPreloaded = this.findNextPreloadedAd();
-    if (nextPreloaded) {
-      this.currentAdIndex++;
-      console.log(
-        `[ADAPTIVE-POD] \u2705 Found preloaded ad after retry ${retryCount}, playing (${this.currentAdIndex}/${this.totalAdsInBreak})`
-      );
-      this.playSingleAd(nextPreloaded).catch(() => {
-        this.handleAdPodComplete();
-      });
-    } else if (retryCount < maxRetries) {
-      console.log(
-        `[ADAPTIVE-POD] \u23F3 No preloaded ads yet (queue has ${this.adPodQueue.length} URLs), retry ${retryCount + 1}/${maxRetries} in 1s...`
-      );
-      setTimeout(() => {
-        this.tryNextAdWithRetry(retryCount + 1);
-      }, 1e3);
+    if (remaining > 500) {
+      this.tryNextAvailableAd();
     } else {
-      console.log(
-        `[ADAPTIVE-POD] \u274C Max retries reached, no preloaded ads available (queue=${this.adPodQueue.length} URLs)`
-      );
+      console.error("[AD-ERROR] Ad failed and no time remaining. Failed URLs:", this.failedVastUrls.size);
       this.handleAdPodComplete();
     }
   }
@@ -3990,6 +4048,7 @@ var StormcloudVideoPlayer = class {
   }
   destroy() {
     var _a, _b;
+    this.stopContinuousFetching();
     this.clearAdStartTimer();
     this.clearAdStopTimer();
     this.clearAdFailsafeTimer();
@@ -4004,6 +4063,8 @@ var StormcloudVideoPlayer = class {
     this.preloadedMediaUrls.clear();
     this.preloadingMediaUrls.clear();
     this.adPodAllUrls = [];
+    this.adRequestQueue = [];
+    this.successfulAdRequests = [];
   }
 };