stormcloud-video-player 0.2.15 → 0.2.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/stormcloud-vp.min.js +2 -2
- package/lib/index.cjs +388 -245
- package/lib/index.cjs.map +1 -1
- package/lib/index.d.cts +2 -0
- package/lib/index.d.ts +2 -0
- package/lib/index.js +388 -245
- package/lib/index.js.map +1 -1
- package/lib/player/StormcloudVideoPlayer.cjs +90 -20
- package/lib/player/StormcloudVideoPlayer.cjs.map +1 -1
- package/lib/player/StormcloudVideoPlayer.d.cts +2 -0
- package/lib/players/FilePlayer.cjs +12 -1
- package/lib/players/FilePlayer.cjs.map +1 -1
- package/lib/players/HlsPlayer.cjs +103 -23
- package/lib/players/HlsPlayer.cjs.map +1 -1
- package/lib/players/index.cjs +115 -24
- package/lib/players/index.cjs.map +1 -1
- package/lib/sdk/ima.cjs +38 -2
- package/lib/sdk/ima.cjs.map +1 -1
- package/lib/ui/StormcloudVideoPlayer.cjs +363 -241
- package/lib/ui/StormcloudVideoPlayer.cjs.map +1 -1
- package/package.json +1 -1
|
@@ -284,6 +284,14 @@ function createImaController(video, options) {
|
|
|
284
284
|
function makeAdsRequest(google, vastTagUrl) {
|
|
285
285
|
const adsRequest = new google.ima.AdsRequest();
|
|
286
286
|
adsRequest.adTagUrl = vastTagUrl;
|
|
287
|
+
const videoWidth = video.offsetWidth || video.clientWidth || 640;
|
|
288
|
+
const videoHeight = video.offsetHeight || video.clientHeight || 360;
|
|
289
|
+
adsRequest.linearAdSlotWidth = videoWidth;
|
|
290
|
+
adsRequest.linearAdSlotHeight = videoHeight;
|
|
291
|
+
adsRequest.nonLinearAdSlotWidth = videoWidth;
|
|
292
|
+
adsRequest.nonLinearAdSlotHeight = videoHeight;
|
|
293
|
+
adsRequest.vastLoadTimeout = 5e3;
|
|
294
|
+
console.log(`[IMA] Ads request dimensions: ${videoWidth}x${videoHeight}`);
|
|
287
295
|
adsLoader.requestAds(adsRequest);
|
|
288
296
|
}
|
|
289
297
|
function destroyAdsManager() {
|
|
@@ -330,6 +338,18 @@ function createImaController(video, options) {
|
|
|
330
338
|
},
|
|
331
339
|
async requestAds(vastTagUrl) {
|
|
332
340
|
console.log("[IMA] Requesting ads:", vastTagUrl);
|
|
341
|
+
if (!vastTagUrl || vastTagUrl.trim() === "") {
|
|
342
|
+
const error = new Error("VAST tag URL is empty or undefined");
|
|
343
|
+
console.warn("[IMA]", error.message);
|
|
344
|
+
return Promise.reject(error);
|
|
345
|
+
}
|
|
346
|
+
try {
|
|
347
|
+
new URL(vastTagUrl);
|
|
348
|
+
} catch (e) {
|
|
349
|
+
const error = new Error(`Invalid VAST tag URL format: ${vastTagUrl}`);
|
|
350
|
+
console.warn("[IMA]", error.message);
|
|
351
|
+
return Promise.reject(error);
|
|
352
|
+
}
|
|
333
353
|
if (adPlaying) {
|
|
334
354
|
console.warn(
|
|
335
355
|
"[IMA] Cannot request new ads while an ad is playing. Call stop() first."
|
|
@@ -391,6 +411,18 @@ function createImaController(video, options) {
|
|
|
391
411
|
);
|
|
392
412
|
}
|
|
393
413
|
}
|
|
414
|
+
const videoWidth = video.offsetWidth || video.clientWidth;
|
|
415
|
+
const videoHeight = video.offsetHeight || video.clientHeight;
|
|
416
|
+
if (!videoWidth || !videoHeight || videoWidth === 0 || videoHeight === 0) {
|
|
417
|
+
const error = new Error(
|
|
418
|
+
`Invalid video dimensions: ${videoWidth}x${videoHeight}. Cannot initialize ads.`
|
|
419
|
+
);
|
|
420
|
+
console.warn("[IMA]", error.message);
|
|
421
|
+
currentReject == null ? void 0 : currentReject(error);
|
|
422
|
+
adsLoadedReject = void 0;
|
|
423
|
+
adsLoadedResolve = void 0;
|
|
424
|
+
return Promise.reject(error);
|
|
425
|
+
}
|
|
394
426
|
if (!adsLoader) {
|
|
395
427
|
console.log("[IMA] Creating ads loader");
|
|
396
428
|
const adsLoaderCls = new google.ima.AdsLoader(adDisplayContainer);
|
|
@@ -439,7 +471,9 @@ function createImaController(video, options) {
|
|
|
439
471
|
emit("ad_error");
|
|
440
472
|
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
441
473
|
if (video.paused) {
|
|
442
|
-
console.log(
|
|
474
|
+
console.log(
|
|
475
|
+
"[IMA] Resuming paused video after ad error"
|
|
476
|
+
);
|
|
443
477
|
(_a = video.play()) == null ? void 0 : _a.catch(() => {
|
|
444
478
|
});
|
|
445
479
|
}
|
|
@@ -541,7 +575,9 @@ function createImaController(video, options) {
|
|
|
541
575
|
}
|
|
542
576
|
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
543
577
|
if (video.paused) {
|
|
544
|
-
console.log(
|
|
578
|
+
console.log(
|
|
579
|
+
"[IMA] Resuming paused video after setup error"
|
|
580
|
+
);
|
|
545
581
|
video.play().catch(() => {
|
|
546
582
|
});
|
|
547
583
|
}
|
|
@@ -1736,6 +1772,8 @@ var StormcloudVideoPlayer = class {
|
|
|
1736
1772
|
this.totalAdsInBreak = 0;
|
|
1737
1773
|
this.showAds = false;
|
|
1738
1774
|
this.isLiveStream = false;
|
|
1775
|
+
this.nativeHlsMode = false;
|
|
1776
|
+
this.videoSrcProtection = null;
|
|
1739
1777
|
initializePolyfills();
|
|
1740
1778
|
const browserOverrides = getBrowserConfigOverrides();
|
|
1741
1779
|
this.config = { ...config, ...browserOverrides };
|
|
@@ -1756,7 +1794,9 @@ var StormcloudVideoPlayer = class {
|
|
|
1756
1794
|
}
|
|
1757
1795
|
if (adPlayerType === "hls") {
|
|
1758
1796
|
if (this.config.debugAdTiming) {
|
|
1759
|
-
console.log(
|
|
1797
|
+
console.log(
|
|
1798
|
+
"[StormcloudVideoPlayer] Creating HLS ad player (AdStorm mode)"
|
|
1799
|
+
);
|
|
1760
1800
|
}
|
|
1761
1801
|
return createHlsAdPlayer(this.video, {
|
|
1762
1802
|
continueLiveStreamDuringAds,
|
|
@@ -1765,7 +1805,9 @@ var StormcloudVideoPlayer = class {
|
|
|
1765
1805
|
});
|
|
1766
1806
|
} else {
|
|
1767
1807
|
if (this.config.debugAdTiming) {
|
|
1768
|
-
console.log(
|
|
1808
|
+
console.log(
|
|
1809
|
+
"[StormcloudVideoPlayer] Creating Google IMA ad player (Default mode)"
|
|
1810
|
+
);
|
|
1769
1811
|
}
|
|
1770
1812
|
return createImaController(this.video, {
|
|
1771
1813
|
continueLiveStreamDuringAds
|
|
@@ -1789,11 +1831,13 @@ var StormcloudVideoPlayer = class {
|
|
|
1789
1831
|
}
|
|
1790
1832
|
this.initializeTracking();
|
|
1791
1833
|
if (this.shouldUseNativeHls()) {
|
|
1834
|
+
this.nativeHlsMode = true;
|
|
1835
|
+
this.videoSrcProtection = this.config.src;
|
|
1792
1836
|
this.video.src = this.config.src;
|
|
1793
1837
|
this.isLiveStream = (_a = this.config.lowLatencyMode) != null ? _a : false;
|
|
1794
1838
|
if (this.config.debugAdTiming) {
|
|
1795
1839
|
console.log(
|
|
1796
|
-
"[StormcloudVideoPlayer]
|
|
1840
|
+
"[StormcloudVideoPlayer] Using native HLS playback - VOD mode:",
|
|
1797
1841
|
{
|
|
1798
1842
|
isLive: this.isLiveStream,
|
|
1799
1843
|
allowNativeHls: this.config.allowNativeHls,
|
|
@@ -1941,7 +1985,9 @@ var StormcloudVideoPlayer = class {
|
|
|
1941
1985
|
this.ima.initialize();
|
|
1942
1986
|
this.ima.on("all_ads_completed", () => {
|
|
1943
1987
|
if (this.config.debugAdTiming) {
|
|
1944
|
-
console.log(
|
|
1988
|
+
console.log(
|
|
1989
|
+
"[StormcloudVideoPlayer] IMA all_ads_completed event received"
|
|
1990
|
+
);
|
|
1945
1991
|
}
|
|
1946
1992
|
});
|
|
1947
1993
|
this.ima.on("ad_error", () => {
|
|
@@ -2006,13 +2052,31 @@ var StormcloudVideoPlayer = class {
|
|
|
2006
2052
|
this.video.addEventListener("timeupdate", () => {
|
|
2007
2053
|
this.onTimeUpdate(this.video.currentTime);
|
|
2008
2054
|
});
|
|
2055
|
+
this.video.addEventListener("emptied", () => {
|
|
2056
|
+
if (this.nativeHlsMode && this.videoSrcProtection && !this.ima.isAdPlaying()) {
|
|
2057
|
+
if (this.config.debugAdTiming) {
|
|
2058
|
+
console.log(
|
|
2059
|
+
"[StormcloudVideoPlayer] Video src was cleared, restoring:",
|
|
2060
|
+
this.videoSrcProtection
|
|
2061
|
+
);
|
|
2062
|
+
}
|
|
2063
|
+
const currentTime = this.video.currentTime;
|
|
2064
|
+
const wasPaused = this.video.paused;
|
|
2065
|
+
this.video.src = this.videoSrcProtection;
|
|
2066
|
+
this.video.currentTime = currentTime;
|
|
2067
|
+
if (!wasPaused) {
|
|
2068
|
+
this.video.play().catch(() => {
|
|
2069
|
+
});
|
|
2070
|
+
}
|
|
2071
|
+
}
|
|
2072
|
+
});
|
|
2009
2073
|
}
|
|
2010
2074
|
shouldUseNativeHls() {
|
|
2011
2075
|
const streamType = this.getStreamType();
|
|
2012
2076
|
if (streamType === "other") {
|
|
2013
2077
|
return true;
|
|
2014
2078
|
}
|
|
2015
|
-
const canNative = this.video.canPlayType("application/vnd.apple.
|
|
2079
|
+
const canNative = this.video.canPlayType("application/vnd.apple.mpegurl");
|
|
2016
2080
|
return !!(this.config.allowNativeHls && canNative);
|
|
2017
2081
|
}
|
|
2018
2082
|
onId3Tag(tag) {
|
|
@@ -2439,10 +2503,7 @@ var StormcloudVideoPlayer = class {
|
|
|
2439
2503
|
var _a, _b, _c;
|
|
2440
2504
|
const vastMode = this.config.vastMode || "default";
|
|
2441
2505
|
if (this.config.debugAdTiming) {
|
|
2442
|
-
console.log(
|
|
2443
|
-
"[StormcloudVideoPlayer] VAST mode:",
|
|
2444
|
-
vastMode
|
|
2445
|
-
);
|
|
2506
|
+
console.log("[StormcloudVideoPlayer] VAST mode:", vastMode);
|
|
2446
2507
|
}
|
|
2447
2508
|
if (vastMode === "adstorm") {
|
|
2448
2509
|
if (!this.config.licenseKey) {
|
|
@@ -2560,10 +2621,7 @@ var StormcloudVideoPlayer = class {
|
|
|
2560
2621
|
this.currentAdIndex = 0;
|
|
2561
2622
|
this.totalAdsInBreak = 1;
|
|
2562
2623
|
if (this.config.debugAdTiming) {
|
|
2563
|
-
console.log(
|
|
2564
|
-
"[StormcloudVideoPlayer] Using VAST endpoint:",
|
|
2565
|
-
vastTagUrl
|
|
2566
|
-
);
|
|
2624
|
+
console.log("[StormcloudVideoPlayer] Using VAST endpoint:", vastTagUrl);
|
|
2567
2625
|
}
|
|
2568
2626
|
} else if (tags && tags.length > 0) {
|
|
2569
2627
|
vastTagUrl = tags[0];
|
|
@@ -2715,15 +2773,21 @@ var StormcloudVideoPlayer = class {
|
|
|
2715
2773
|
await this.ima.requestAds(vastTagUrl);
|
|
2716
2774
|
try {
|
|
2717
2775
|
if (this.config.debugAdTiming) {
|
|
2718
|
-
console.log(
|
|
2776
|
+
console.log(
|
|
2777
|
+
"[StormcloudVideoPlayer] Ad request completed, attempting playback"
|
|
2778
|
+
);
|
|
2719
2779
|
}
|
|
2720
2780
|
await this.ima.play();
|
|
2721
2781
|
if (this.config.debugAdTiming) {
|
|
2722
|
-
console.log(
|
|
2782
|
+
console.log(
|
|
2783
|
+
"[StormcloudVideoPlayer] Ad playback started successfully"
|
|
2784
|
+
);
|
|
2723
2785
|
}
|
|
2724
2786
|
} catch (playError) {
|
|
2725
2787
|
if (this.config.debugAdTiming) {
|
|
2726
|
-
console.log(
|
|
2788
|
+
console.log(
|
|
2789
|
+
"[StormcloudVideoPlayer] No ads available, skipping playback"
|
|
2790
|
+
);
|
|
2727
2791
|
}
|
|
2728
2792
|
this.handleAdFailure();
|
|
2729
2793
|
return;
|
|
@@ -2779,7 +2843,9 @@ var StormcloudVideoPlayer = class {
|
|
|
2779
2843
|
});
|
|
2780
2844
|
} else {
|
|
2781
2845
|
if (this.config.debugAdTiming) {
|
|
2782
|
-
console.log(
|
|
2846
|
+
console.log(
|
|
2847
|
+
"[StormcloudVideoPlayer] Video is already playing, no resume needed"
|
|
2848
|
+
);
|
|
2783
2849
|
}
|
|
2784
2850
|
}
|
|
2785
2851
|
}
|
|
@@ -2798,7 +2864,11 @@ var StormcloudVideoPlayer = class {
|
|
|
2798
2864
|
if (this.config.debugAdTiming) {
|
|
2799
2865
|
console.warn(
|
|
2800
2866
|
"[StormcloudVideoPlayer] Failsafe timer triggered - forcing video resume",
|
|
2801
|
-
{
|
|
2867
|
+
{
|
|
2868
|
+
paused: this.video.paused,
|
|
2869
|
+
showAds: this.showAds,
|
|
2870
|
+
adPlaying: this.ima.isAdPlaying()
|
|
2871
|
+
}
|
|
2802
2872
|
);
|
|
2803
2873
|
}
|
|
2804
2874
|
this.handleAdFailure();
|