stormcloud-video-player 0.2.9 → 0.2.11

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;
@@ -230,8 +267,11 @@ function createImaController(video, options) {
                       );
                       emit("ad_error");
                       if (!options?.continueLiveStreamDuringAds) {
-                        video.play()?.catch(() => {
-                        });
+                        if (video.paused) {
+                          console.log("[IMA] Resuming paused video after ad error");
+                          video.play()?.catch(() => {
+                          });
+                        }
                       }
                     }
                   }
@@ -240,10 +280,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 +288,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 +332,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(() => {
                     });
@@ -306,10 +362,17 @@ function createImaController(video, options) {
                 console.error("[IMA] Error setting up ads manager:", e);
                 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 setup error");
+                }
                 if (!options?.continueLiveStreamDuringAds) {
-                  video.play().catch(() => {
-                  });
+                  if (video.paused) {
+                    console.log("[IMA] Resuming paused video after setup error");
+                    video.play().catch(() => {
+                    });
+                  }
                 }
                 if (adsLoadedReject) {
                   adsLoadedReject(new Error("Failed to setup ads manager"));
@@ -325,6 +388,20 @@ 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";
+                adContainerEl.style.display = "none";
+                console.log("[IMA] Ad container hidden after loader error");
+              }
+              if (!options?.continueLiveStreamDuringAds) {
+                if (video.paused) {
+                  console.log("[IMA] Resuming paused video after loader error");
+                  video.play().catch(() => {
+                  });
+                }
+              }
               if (adsLoadedReject) {
                 adsLoadedReject(new Error("Ads loader error"));
                 adsLoadedReject = void 0;
@@ -340,11 +417,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 +456,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 +475,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 +489,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,32 +969,33 @@ 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", () => {
       if (this.config.debugAdTiming) {
         console.log("[StormcloudVideoPlayer] IMA ad_error event received");
       }
-      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.handleAdFailure();
+      if (this.showAds) {
+        if (this.inAdBreak) {
+          const remaining = this.getRemainingAdMs();
+          if (remaining > 500 && this.adPodQueue.length > 0) {
+            const next = this.adPodQueue.shift();
+            this.currentAdIndex++;
+            this.playSingleAd(next).catch(() => {
+            });
+          } else {
+            this.handleAdFailure();
+          }
+        } else {
+          if (this.config.debugAdTiming) {
+            console.log(
+              "[StormcloudVideoPlayer] Ad error before ad break established - cleaning up"
+            );
+          }
+          this.handleAdFailure();
+        }
       }
     });
     this.ima.on("content_pause", () => {
@@ -925,6 +1011,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);
@@ -1470,9 +1576,20 @@ var StormcloudVideoPlayer = class {
       return;
     }
     if (vastTagUrl) {
+      this.inAdBreak = true;
       this.showAds = true;
       this.currentAdIndex++;
-      await this.playSingleAd(vastTagUrl);
+      try {
+        await this.playSingleAd(vastTagUrl);
+      } catch (error) {
+        if (this.config.debugAdTiming) {
+          console.error(
+            "[StormcloudVideoPlayer] Ad playback failed in handleAdStart:",
+            error
+          );
+        }
+        this.handleAdFailure();
+      }
     }
     if (this.expectedAdBreakDurationMs == null && scheduled?.durationMs != null) {
       this.expectedAdBreakDurationMs = scheduled.durationMs;
@@ -1574,21 +1691,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");
@@ -1603,7 +1720,13 @@ var StormcloudVideoPlayer = class {
   handleAdFailure() {
     if (this.config.debugAdTiming) {
       console.log(
-        "[StormcloudVideoPlayer] Handling ad failure - resuming content"
+        "[StormcloudVideoPlayer] Handling ad failure - resuming content",
+        {
+          inAdBreak: this.inAdBreak,
+          showAds: this.showAds,
+          videoPaused: this.video.paused,
+          adPlaying: this.ima.isAdPlaying()
+        }
       );
     }
     this.inAdBreak = false;
@@ -1616,14 +1739,29 @@ 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) {
+        console.log("[StormcloudVideoPlayer] Resuming paused video");
+      }
+      this.video.play()?.catch((error) => {
         if (this.config.debugAdTiming) {
           console.error(
-            "[StormcloudVideoPlayer] Failed to resume video after ad failure"
+            "[StormcloudVideoPlayer] Failed to resume video after ad failure:",
+            error
           );
         }
       });
+    } else {
+      if (this.config.debugAdTiming) {
+        console.log("[StormcloudVideoPlayer] Video is already playing, no resume needed");
+      }
     }
   }
   startAdFailsafeTimer() {
@@ -1635,10 +1773,12 @@ var StormcloudVideoPlayer = class {
       );
     }
     this.adFailsafeTimerId = window.setTimeout(() => {
-      if (this.video.paused) {
+      const shouldTrigger = this.video.paused || this.showAds && !this.ima.isAdPlaying();
+      if (shouldTrigger) {
         if (this.config.debugAdTiming) {
           console.warn(
-            "[StormcloudVideoPlayer] Failsafe timer triggered - forcing video resume"
+            "[StormcloudVideoPlayer] Failsafe timer triggered - forcing video resume",
+            { paused: this.video.paused, showAds: this.showAds, adPlaying: this.ima.isAdPlaying() }
           );
         }
         this.handleAdFailure();