stormcloud-video-player 0.2.3 → 0.2.4

package/lib/index.d.cts

@@ -91,6 +91,7 @@ declare class StormcloudVideoPlayer {
     private currentAdIndex;
     private totalAdsInBreak;
     private showAds;
+    private isLiveStream;
     constructor(config: StormcloudVideoPlayerConfig);
     load(): Promise<void>;
     private attach;
@@ -114,6 +115,7 @@ declare class StormcloudVideoPlayer {
     isShowingAds(): boolean;
     getStreamType(): "hls" | "other";
     shouldShowNativeControls(): boolean;
+    private shouldContinueLiveStreamDuringAds;
     loadDefaultVastFromAdstorm(adstormApiUrl: string, params?: Record<string, string>): Promise<void>;
     private handleAdStart;
     private findCurrentOrNextBreak;
@@ -136,6 +138,7 @@ declare class StormcloudVideoPlayer {
     toggleFullscreen(): Promise<void>;
     isMuted(): boolean;
     isFullscreen(): boolean;
+    isLive(): boolean;
     get videoElement(): HTMLVideoElement;
     resize(): void;
     destroy(): void;

package/lib/index.d.ts

@@ -91,6 +91,7 @@ declare class StormcloudVideoPlayer {
     private currentAdIndex;
     private totalAdsInBreak;
     private showAds;
+    private isLiveStream;
     constructor(config: StormcloudVideoPlayerConfig);
     load(): Promise<void>;
     private attach;
@@ -114,6 +115,7 @@ declare class StormcloudVideoPlayer {
     isShowingAds(): boolean;
     getStreamType(): "hls" | "other";
     shouldShowNativeControls(): boolean;
+    private shouldContinueLiveStreamDuringAds;
     loadDefaultVastFromAdstorm(adstormApiUrl: string, params?: Record<string, string>): Promise<void>;
     private handleAdStart;
     private findCurrentOrNextBreak;
@@ -136,6 +138,7 @@ declare class StormcloudVideoPlayer {
     toggleFullscreen(): Promise<void>;
     isMuted(): boolean;
     isFullscreen(): boolean;
+    isLive(): boolean;
     get videoElement(): HTMLVideoElement;
     resize(): void;
     destroy(): void;

package/lib/index.js

@@ -5,7 +5,7 @@ import React, { useEffect, useRef, useMemo } from "react";
 import Hls from "hls.js";
 
 // src/sdk/ima.ts
-function createImaController(video) {
+function createImaController(video, options) {
   let adPlaying = false;
   let originalMutedState = false;
   const listeners = /* @__PURE__ */ new Map();
@@ -198,8 +198,10 @@ function createImaController(video) {
                         "[IMA] Max retries reached, emitting ad_error"
                       );
                       emit("ad_error");
-                      video.play().catch(() => {
-                      });
+                      if (!options?.continueLiveStreamDuringAds) {
+                        video.play().catch(() => {
+                        });
+                      }
                     }
                   }
                 );
@@ -209,7 +211,14 @@ function createImaController(video) {
                     console.log("[IMA] Content pause requested");
                     originalMutedState = video.muted;
                     video.muted = true;
-                    video.pause();
+                    if (!options?.continueLiveStreamDuringAds) {
+                      video.pause();
+                      console.log("[IMA] Video paused (VOD mode)");
+                    } else {
+                      console.log(
+                        "[IMA] Video continues playing but muted (Live mode)"
+                      );
+                    }
                     adPlaying = true;
                     if (adContainerEl)
                       adContainerEl.style.pointerEvents = "auto";
@@ -224,8 +233,15 @@ function createImaController(video) {
                     video.muted = originalMutedState;
                     if (adContainerEl)
                       adContainerEl.style.pointerEvents = "none";
-                    video.play().catch(() => {
-                    });
+                    if (!options?.continueLiveStreamDuringAds) {
+                      video.play().catch(() => {
+                      });
+                      console.log("[IMA] Video resumed (VOD mode)");
+                    } else {
+                      console.log(
+                        "[IMA] Video unmuted (Live mode - was never paused)"
+                      );
+                    }
                     emit("content_resume");
                   }
                 );
@@ -234,8 +250,17 @@ function createImaController(video) {
                   adPlaying = false;
                   video.muted = originalMutedState;
                   if (adContainerEl) adContainerEl.style.pointerEvents = "none";
-                  video.play().catch(() => {
-                  });
+                  if (!options?.continueLiveStreamDuringAds) {
+                    video.play().catch(() => {
+                    });
+                    console.log(
+                      "[IMA] Video resumed after all ads completed (VOD mode)"
+                    );
+                  } else {
+                    console.log(
+                      "[IMA] Video unmuted after all ads completed (Live mode)"
+                    );
+                  }
                   emit("all_ads_completed");
                 });
                 console.log("[IMA] Ads manager event listeners attached");
@@ -249,8 +274,10 @@ function createImaController(video) {
                 adPlaying = false;
                 video.muted = originalMutedState;
                 if (adContainerEl) adContainerEl.style.pointerEvents = "none";
-                video.play().catch(() => {
-                });
+                if (!options?.continueLiveStreamDuringAds) {
+                  video.play().catch(() => {
+                  });
+                }
                 if (adsLoadedReject) {
                   adsLoadedReject(new Error("Failed to setup ads manager"));
                   adsLoadedReject = void 0;
@@ -304,8 +331,14 @@ function createImaController(video) {
         const height = video.clientHeight || 360;
         console.log(`[IMA] Initializing ads manager (${width}x${height})`);
         adsManager.init(width, height, window.google.ima.ViewMode.NORMAL);
-        console.log("[IMA] Pausing video for ad playback");
-        video.pause();
+        if (!options?.continueLiveStreamDuringAds) {
+          console.log("[IMA] Pausing video for ad playback (VOD mode)");
+          video.pause();
+        } else {
+          console.log(
+            "[IMA] Keeping video playing but muted for ad playback (Live mode)"
+          );
+        }
         adPlaying = true;
         console.log("[IMA] Starting ad playback");
         adsManager.start();
@@ -313,8 +346,10 @@ function createImaController(video) {
       } catch (error) {
         console.error("[IMA] Error starting ad playback:", error);
         adPlaying = false;
-        video.play().catch(() => {
-        });
+        if (!options?.continueLiveStreamDuringAds) {
+          video.play().catch(() => {
+          });
+        }
         return Promise.reject(error);
       }
     },
@@ -325,8 +360,13 @@ function createImaController(video) {
         adsManager?.stop?.();
       } catch {
       }
-      video.play().catch(() => {
-      });
+      if (!options?.continueLiveStreamDuringAds) {
+        video.play().catch(() => {
+        });
+        console.log("[IMA] Video resumed after stop (VOD mode)");
+      } else {
+        console.log("[IMA] Video unmuted after stop (Live mode)");
+      }
     },
     destroy() {
       try {
@@ -623,9 +663,12 @@ var StormcloudVideoPlayer = class {
     this.currentAdIndex = 0;
     this.totalAdsInBreak = 0;
     this.showAds = false;
+    this.isLiveStream = false;
     this.config = config;
     this.video = config.videoElement;
-    this.ima = createImaController(this.video);
+    this.ima = createImaController(this.video, {
+      continueLiveStreamDuringAds: false
+    });
   }
   async load() {
     if (!this.attached) {
@@ -644,6 +687,22 @@ var StormcloudVideoPlayer = class {
     this.initializeTracking();
     if (this.shouldUseNativeHls()) {
       this.video.src = this.config.src;
+      this.isLiveStream = this.config.lowLatencyMode ?? false;
+      if (this.config.debugAdTiming) {
+        console.log(
+          "[StormcloudVideoPlayer] allowNativeHls: true - VOD mode detected:",
+          {
+            isLive: this.isLiveStream,
+            allowNativeHls: this.config.allowNativeHls,
+            adBehavior: "vod (main video pauses during ads)"
+          }
+        );
+      }
+      this.ima.destroy();
+      this.ima = createImaController(this.video, {
+        continueLiveStreamDuringAds: false
+      });
+      this.ima.initialize();
       if (this.config.autoplay) {
         await this.video.play().catch(() => {
         });
@@ -661,7 +720,23 @@ var StormcloudVideoPlayer = class {
     this.hls.on(Hls.Events.MEDIA_ATTACHED, () => {
       this.hls?.loadSource(this.config.src);
     });
-    this.hls.on(Hls.Events.MANIFEST_PARSED, async () => {
+    this.hls.on(Hls.Events.MANIFEST_PARSED, async (_, data) => {
+      this.isLiveStream = this.hls?.levels?.some(
+        (level) => level?.details?.live === true || level?.details?.type === "LIVE"
+      ) ?? false;
+      if (this.config.debugAdTiming) {
+        const adBehavior = this.shouldContinueLiveStreamDuringAds() ? "live (main video continues muted during ads)" : "vod (main video pauses during ads)";
+        console.log("[StormcloudVideoPlayer] Stream type detected:", {
+          isLive: this.isLiveStream,
+          allowNativeHls: this.config.allowNativeHls,
+          adBehavior
+        });
+      }
+      this.ima.destroy();
+      this.ima = createImaController(this.video, {
+        continueLiveStreamDuringAds: this.shouldContinueLiveStreamDuringAds()
+      });
+      this.ima.initialize();
       if (this.config.autoplay) {
         await this.video.play().catch(() => {
         });
@@ -1287,6 +1362,15 @@ var StormcloudVideoPlayer = class {
     }
     return !!(this.config.allowNativeHls && !(this.config.showCustomControls ?? false));
   }
+  shouldContinueLiveStreamDuringAds() {
+    if (this.config.allowNativeHls) {
+      return false;
+    }
+    if (!this.isLiveStream) {
+      return false;
+    }
+    return true;
+  }
   async loadDefaultVastFromAdstorm(adstormApiUrl, params) {
     const usp = new URLSearchParams(params || {});
     const url = `${adstormApiUrl}?${usp.toString()}`;
@@ -1601,6 +1685,9 @@ var StormcloudVideoPlayer = class {
   isFullscreen() {
     return !!document.fullscreenElement;
   }
+  isLive() {
+    return this.isLiveStream;
+  }
   get videoElement() {
     return this.video;
   }