stormcloud-video-player 0.2.9 → 0.2.10

package/lib/player/StormcloudVideoPlayer.cjs

@@ -73,9 +73,22 @@ function createImaController(video, options) {
       'script[data-ima="true"]'
     );
     if (existing) {
-      return new Promise(
-        (resolve) => existing.addEventListener("load", () => resolve())
-      );
+      if (window.google?.ima) {
+        return Promise.resolve();
+      }
+      return new Promise((resolve, reject) => {
+        const timeout = setTimeout(() => {
+          reject(new Error("IMA SDK load timeout"));
+        }, 1e4);
+        existing.addEventListener("load", () => {
+          clearTimeout(timeout);
+          resolve();
+        });
+        existing.addEventListener("error", () => {
+          clearTimeout(timeout);
+          reject(new Error("IMA SDK load failed"));
+        });
+      });
     }
     return new Promise((resolve, reject) => {
       const script = document.createElement("script");
@@ -104,6 +117,17 @@ function createImaController(video, options) {
     adsRequest.adTagUrl = vastTagUrl;
     adsLoader.requestAds(adsRequest);
   }
+  function destroyAdsManager() {
+    if (adsManager) {
+      try {
+        console.log("[IMA] Destroying existing ads manager");
+        adsManager.destroy();
+      } catch (error) {
+        console.warn("[IMA] Error destroying ads manager:", error);
+      }
+      adsManager = void 0;
+    }
+  }
   return {
     initialize() {
       ensureImaLoaded().then(() => {
@@ -136,9 +160,22 @@ function createImaController(video, options) {
     },
     async requestAds(vastTagUrl) {
       console.log("[IMA] Requesting ads:", vastTagUrl);
+      if (adPlaying) {
+        console.warn(
+          "[IMA] Cannot request new ads while an ad is playing. Call stop() first."
+        );
+        return Promise.reject(
+          new Error("Ad already playing - cannot request new ads")
+        );
+      }
+      destroyAdsManager();
+      adsLoadedReject = void 0;
+      adsLoadedResolve = void 0;
+      let currentReject;
       adsLoadedPromise = new Promise((resolve, reject) => {
         adsLoadedResolve = resolve;
         adsLoadedReject = reject;
+        currentReject = reject;
         setTimeout(() => {
           if (adsLoadedReject) {
             adsLoadedReject(new Error("Ad request timeout"));
@@ -160,7 +197,7 @@ function createImaController(video, options) {
           container.style.top = "0";
           container.style.right = "0";
           container.style.bottom = "0";
-          container.style.display = "flex";
+          container.style.display = "none";
           container.style.alignItems = "center";
           container.style.justifyContent = "center";
           container.style.pointerEvents = "none";
@@ -200,14 +237,14 @@ function createImaController(video, options) {
                   AdErrorEvent.AD_ERROR,
                   (errorEvent) => {
                     console.error("[IMA] Ad error:", errorEvent.getError());
-                    try {
-                      adsManager?.destroy?.();
-                    } catch {
-                    }
+                    destroyAdsManager();
                     adPlaying = false;
                     video.muted = originalMutedState;
-                    if (adContainerEl)
+                    if (adContainerEl) {
                       adContainerEl.style.pointerEvents = "none";
+                      adContainerEl.style.display = "none";
+                      console.log("[IMA] Ad container hidden after error");
+                    }
                     if (adsLoadedReject) {
                       adsLoadedReject(new Error("Ad playback error"));
                       adsLoadedReject = void 0;
@@ -240,10 +277,6 @@ function createImaController(video, options) {
                   AdEvent.CONTENT_PAUSE_REQUESTED,
                   () => {
                     console.log("[IMA] Content pause requested");
-                    if (!adPlaying) {
-                      originalMutedState = video.muted;
-                    }
-                    video.muted = true;
                     if (!options?.continueLiveStreamDuringAds) {
                       video.pause();
                       console.log("[IMA] Video paused (VOD mode)");
@@ -252,20 +285,34 @@ function createImaController(video, options) {
                         "[IMA] Video continues playing but muted (Live mode)"
                       );
                     }
+                    video.muted = true;
                     adPlaying = true;
-                    if (adContainerEl)
-                      adContainerEl.style.pointerEvents = "auto";
                     emit("content_pause");
                   }
                 );
+                adsManager.addEventListener(AdEvent.STARTED, () => {
+                  console.log("[IMA] Ad started playing");
+                  if (adContainerEl) {
+                    adContainerEl.style.pointerEvents = "auto";
+                    adContainerEl.style.display = "flex";
+                    console.log(
+                      "[IMA] Ad container visibility set to flex with pointer events enabled"
+                    );
+                  }
+                });
                 adsManager.addEventListener(
                   AdEvent.CONTENT_RESUME_REQUESTED,
                   () => {
                     console.log("[IMA] Content resume requested");
                     adPlaying = false;
                     video.muted = originalMutedState;
-                    if (adContainerEl)
+                    if (adContainerEl) {
                       adContainerEl.style.pointerEvents = "none";
+                      adContainerEl.style.display = "none";
+                      console.log(
+                        "[IMA] Ad container hidden - pointer events disabled"
+                      );
+                    }
                     if (!options?.continueLiveStreamDuringAds) {
                       video.play()?.catch(() => {
                       });
@@ -282,7 +329,13 @@ function createImaController(video, options) {
                   console.log("[IMA] All ads completed");
                   adPlaying = false;
                   video.muted = originalMutedState;
-                  if (adContainerEl) adContainerEl.style.pointerEvents = "none";
+                  if (adContainerEl) {
+                    adContainerEl.style.pointerEvents = "none";
+                    adContainerEl.style.display = "none";
+                    console.log(
+                      "[IMA] Ad container hidden after all ads completed"
+                    );
+                  }
                   if (!options?.continueLiveStreamDuringAds) {
                     video.play().catch(() => {
                     });
@@ -325,6 +378,13 @@ function createImaController(video, options) {
             google.ima.AdErrorEvent.Type.AD_ERROR,
             (adErrorEvent) => {
               console.error("[IMA] Ads loader error:", adErrorEvent.getError());
+              adPlaying = false;
+              video.muted = originalMutedState;
+              if (adContainerEl) adContainerEl.style.pointerEvents = "none";
+              if (!options?.continueLiveStreamDuringAds) {
+                video.play().catch(() => {
+                });
+              }
               if (adsLoadedReject) {
                 adsLoadedReject(new Error("Ads loader error"));
                 adsLoadedReject = void 0;
@@ -340,11 +400,9 @@ function createImaController(video, options) {
         return adsLoadedPromise;
       } catch (error) {
         console.error("[IMA] Failed to request ads:", error);
-        if (adsLoadedReject) {
-          adsLoadedReject(error);
-          adsLoadedReject = void 0;
-          adsLoadedResolve = void 0;
-        }
+        currentReject?.(error);
+        adsLoadedReject = void 0;
+        adsLoadedResolve = void 0;
         return Promise.reject(error);
       }
     },
@@ -381,10 +439,16 @@ function createImaController(video, options) {
     async stop() {
       adPlaying = false;
       video.muted = originalMutedState;
+      if (adContainerEl) {
+        adContainerEl.style.pointerEvents = "none";
+        adContainerEl.style.display = "none";
+        console.log("[IMA] Ad container hidden after stop");
+      }
       try {
         adsManager?.stop?.();
       } catch {
       }
+      destroyAdsManager();
       if (!options?.continueLiveStreamDuringAds) {
         video.play().catch(() => {
         });
@@ -394,12 +458,13 @@ function createImaController(video, options) {
       }
     },
     destroy() {
-      try {
-        adsManager?.destroy?.();
-      } catch {
-      }
+      destroyAdsManager();
       adPlaying = false;
       video.muted = originalMutedState;
+      if (adContainerEl) {
+        adContainerEl.style.pointerEvents = "none";
+        adContainerEl.style.display = "none";
+      }
       try {
         adsLoader?.destroy?.();
       } catch {
@@ -407,6 +472,9 @@ function createImaController(video, options) {
       if (adContainerEl?.parentElement) {
         adContainerEl.parentElement.removeChild(adContainerEl);
       }
+      adContainerEl = void 0;
+      adDisplayContainer = void 0;
+      adsLoader = void 0;
     },
     isAdPlaying() {
       return adPlaying;
@@ -884,17 +952,8 @@ var StormcloudVideoPlayer = class {
     this.video.muted = !!this.config.muted;
     this.ima.initialize();
     this.ima.on("all_ads_completed", () => {
-      if (!this.inAdBreak) return;
-      const remaining = this.getRemainingAdMs();
-      if (remaining > 500 && this.adPodQueue.length > 0) {
-        const next = this.adPodQueue.shift();
-        this.currentAdIndex++;
-        this.playSingleAd(next).catch(() => {
-        });
-      } else {
-        this.currentAdIndex = 0;
-        this.totalAdsInBreak = 0;
-        this.showAds = false;
+      if (this.config.debugAdTiming) {
+        console.log("[StormcloudVideoPlayer] IMA all_ads_completed event received");
       }
     });
     this.ima.on("ad_error", () => {
@@ -925,6 +984,26 @@ var StormcloudVideoPlayer = class {
         );
       }
       this.clearAdFailsafeTimer();
+      if (!this.inAdBreak) return;
+      const remaining = this.getRemainingAdMs();
+      if (remaining > 500 && this.adPodQueue.length > 0) {
+        const next = this.adPodQueue.shift();
+        this.currentAdIndex++;
+        if (this.config.debugAdTiming) {
+          console.log(
+            `[StormcloudVideoPlayer] Playing next ad in pod (${this.currentAdIndex}/${this.totalAdsInBreak})`
+          );
+        }
+        this.playSingleAd(next).catch(() => {
+        });
+      } else {
+        if (this.config.debugAdTiming) {
+          console.log("[StormcloudVideoPlayer] Ad pod completed");
+        }
+        this.currentAdIndex = 0;
+        this.totalAdsInBreak = 0;
+        this.showAds = false;
+      }
     });
     this.video.addEventListener("timeupdate", () => {
       this.onTimeUpdate(this.video.currentTime);
@@ -1574,21 +1653,21 @@ var StormcloudVideoPlayer = class {
     if (this.config.debugAdTiming) {
       console.log("[StormcloudVideoPlayer] Attempting to play ad:", vastTagUrl);
     }
-    this.ima.updateOriginalMutedState(this.video.muted);
-    if (!this.shouldContinueLiveStreamDuringAds()) {
-      if (this.config.debugAdTiming) {
-        console.log("[StormcloudVideoPlayer] Pausing video immediately for ad (VOD mode)");
-      }
-      this.video.pause();
-    } else {
+    if (this.ima.isAdPlaying()) {
       if (this.config.debugAdTiming) {
-        console.log("[StormcloudVideoPlayer] Muting video for ad (Live mode)");
+        console.warn(
+          "[StormcloudVideoPlayer] Ad already playing - skipping new ad request"
+        );
       }
-      this.video.muted = true;
+      return;
     }
+    this.ima.updateOriginalMutedState(this.video.muted);
     this.startAdFailsafeTimer();
     try {
       await this.ima.requestAds(vastTagUrl);
+      if (this.config.debugAdTiming) {
+        console.log("[StormcloudVideoPlayer] Ad request successful, starting playback");
+      }
       await this.ima.play();
       if (this.config.debugAdTiming) {
         console.log("[StormcloudVideoPlayer] Ad playback started successfully");
@@ -1616,6 +1695,13 @@ var StormcloudVideoPlayer = class {
     this.showAds = false;
     this.currentAdIndex = 0;
     this.totalAdsInBreak = 0;
+    const originalMutedState = this.ima.getOriginalMutedState();
+    this.video.muted = originalMutedState;
+    if (this.config.debugAdTiming) {
+      console.log(
+        `[StormcloudVideoPlayer] Restored mute state to: ${originalMutedState}`
+      );
+    }
     if (this.video.paused) {
       this.video.play()?.catch(() => {
         if (this.config.debugAdTiming) {