stormcloud-video-player 0.2.13 → 0.2.14
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 +238 -117
- 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 +238 -117
- package/lib/index.js.map +1 -1
- package/lib/player/StormcloudVideoPlayer.cjs +196 -92
- package/lib/player/StormcloudVideoPlayer.cjs.map +1 -1
- package/lib/players/FilePlayer.cjs +14 -7
- package/lib/players/FilePlayer.cjs.map +1 -1
- package/lib/players/HlsPlayer.cjs +204 -97
- package/lib/players/HlsPlayer.cjs.map +1 -1
- package/lib/players/index.cjs +218 -104
- package/lib/players/index.cjs.map +1 -1
- package/lib/sdk/hlsAdPlayer.cjs +89 -16
- package/lib/sdk/hlsAdPlayer.cjs.map +1 -1
- package/lib/sdk/hlsAdPlayer.d.cts +2 -0
- package/lib/sdk/ima.cjs +34 -24
- package/lib/sdk/ima.cjs.map +1 -1
- package/lib/ui/StormcloudVideoPlayer.cjs +203 -97
- package/lib/ui/StormcloudVideoPlayer.cjs.map +1 -1
- package/lib/utils/browserCompat.cjs +2 -1
- package/lib/utils/browserCompat.cjs.map +1 -1
- package/lib/utils/tracking.cjs +10 -9
- package/lib/utils/tracking.cjs.map +1 -1
- package/package.json +1 -1
package/lib/players/index.cjs
CHANGED
|
@@ -87,7 +87,8 @@ function getWebKitVersion(ua) {
|
|
|
87
87
|
return match && match[1] ? parseInt(match[1], 10) : 0;
|
|
88
88
|
}
|
|
89
89
|
function getPlatform() {
|
|
90
|
-
|
|
90
|
+
var _a;
|
|
91
|
+
if ("userAgentData" in navigator && ((_a = navigator.userAgentData) == null ? void 0 : _a.platform)) {
|
|
91
92
|
return navigator.userAgentData.platform;
|
|
92
93
|
}
|
|
93
94
|
const ua = navigator.userAgent;
|
|
@@ -252,6 +253,7 @@ function createImaController(video, options) {
|
|
|
252
253
|
}
|
|
253
254
|
}
|
|
254
255
|
function ensureImaLoaded() {
|
|
256
|
+
var _a, _b, _c;
|
|
255
257
|
if (!supportsGoogleIMA()) {
|
|
256
258
|
console.warn(
|
|
257
259
|
"[IMA] Google IMA SDK is not supported on this browser. Please use HLS ad player instead."
|
|
@@ -262,7 +264,7 @@ function createImaController(video, options) {
|
|
|
262
264
|
}
|
|
263
265
|
try {
|
|
264
266
|
const frameEl = window.frameElement;
|
|
265
|
-
const sandboxAttr = frameEl
|
|
267
|
+
const sandboxAttr = ((_a = frameEl == null ? void 0 : frameEl.getAttribute) == null ? void 0 : _a.call(frameEl, "sandbox")) || "";
|
|
266
268
|
if (sandboxAttr) {
|
|
267
269
|
const tokens = new Set(
|
|
268
270
|
sandboxAttr.split(/\s+/).map((t) => t.trim()).filter((t) => t.length > 0)
|
|
@@ -276,13 +278,13 @@ function createImaController(video, options) {
|
|
|
276
278
|
}
|
|
277
279
|
} catch {
|
|
278
280
|
}
|
|
279
|
-
if (typeof window !== "undefined" && window.google
|
|
281
|
+
if (typeof window !== "undefined" && ((_b = window.google) == null ? void 0 : _b.ima))
|
|
280
282
|
return Promise.resolve();
|
|
281
283
|
const existing = document.querySelector(
|
|
282
284
|
'script[data-ima="true"]'
|
|
283
285
|
);
|
|
284
286
|
if (existing) {
|
|
285
|
-
if (window.google
|
|
287
|
+
if ((_c = window.google) == null ? void 0 : _c.ima) {
|
|
286
288
|
return Promise.resolve();
|
|
287
289
|
}
|
|
288
290
|
return new Promise((resolve, reject) => {
|
|
@@ -340,6 +342,7 @@ function createImaController(video, options) {
|
|
|
340
342
|
return {
|
|
341
343
|
initialize() {
|
|
342
344
|
ensureImaLoaded().then(() => {
|
|
345
|
+
var _a, _b;
|
|
343
346
|
const google = window.google;
|
|
344
347
|
if (!adDisplayContainer) {
|
|
345
348
|
const container = document.createElement("div");
|
|
@@ -353,14 +356,14 @@ function createImaController(video, options) {
|
|
|
353
356
|
container.style.justifyContent = "center";
|
|
354
357
|
container.style.pointerEvents = "none";
|
|
355
358
|
container.style.zIndex = "2";
|
|
356
|
-
video.parentElement
|
|
359
|
+
(_a = video.parentElement) == null ? void 0 : _a.appendChild(container);
|
|
357
360
|
adContainerEl = container;
|
|
358
361
|
adDisplayContainer = new google.ima.AdDisplayContainer(
|
|
359
362
|
container,
|
|
360
363
|
video
|
|
361
364
|
);
|
|
362
365
|
try {
|
|
363
|
-
adDisplayContainer.initialize
|
|
366
|
+
(_b = adDisplayContainer.initialize) == null ? void 0 : _b.call(adDisplayContainer);
|
|
364
367
|
} catch {
|
|
365
368
|
}
|
|
366
369
|
}
|
|
@@ -445,6 +448,7 @@ function createImaController(video, options) {
|
|
|
445
448
|
adsManager.addEventListener(
|
|
446
449
|
AdErrorEvent.AD_ERROR,
|
|
447
450
|
(errorEvent) => {
|
|
451
|
+
var _a;
|
|
448
452
|
console.error("[IMA] Ad error:", errorEvent.getError());
|
|
449
453
|
destroyAdsManager();
|
|
450
454
|
adPlaying = false;
|
|
@@ -475,10 +479,10 @@ function createImaController(video, options) {
|
|
|
475
479
|
"[IMA] Max retries reached, emitting ad_error"
|
|
476
480
|
);
|
|
477
481
|
emit("ad_error");
|
|
478
|
-
if (!options
|
|
482
|
+
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
479
483
|
if (video.paused) {
|
|
480
484
|
console.log("[IMA] Resuming paused video after ad error");
|
|
481
|
-
video.play()
|
|
485
|
+
(_a = video.play()) == null ? void 0 : _a.catch(() => {
|
|
482
486
|
});
|
|
483
487
|
}
|
|
484
488
|
}
|
|
@@ -489,7 +493,7 @@ function createImaController(video, options) {
|
|
|
489
493
|
AdEvent.CONTENT_PAUSE_REQUESTED,
|
|
490
494
|
() => {
|
|
491
495
|
console.log("[IMA] Content pause requested");
|
|
492
|
-
if (!options
|
|
496
|
+
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
493
497
|
video.pause();
|
|
494
498
|
console.log("[IMA] Video paused (VOD mode)");
|
|
495
499
|
} else {
|
|
@@ -515,6 +519,7 @@ function createImaController(video, options) {
|
|
|
515
519
|
adsManager.addEventListener(
|
|
516
520
|
AdEvent.CONTENT_RESUME_REQUESTED,
|
|
517
521
|
() => {
|
|
522
|
+
var _a;
|
|
518
523
|
console.log("[IMA] Content resume requested");
|
|
519
524
|
adPlaying = false;
|
|
520
525
|
video.muted = originalMutedState;
|
|
@@ -525,8 +530,8 @@ function createImaController(video, options) {
|
|
|
525
530
|
"[IMA] Ad container hidden - pointer events disabled"
|
|
526
531
|
);
|
|
527
532
|
}
|
|
528
|
-
if (!options
|
|
529
|
-
video.play()
|
|
533
|
+
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
534
|
+
(_a = video.play()) == null ? void 0 : _a.catch(() => {
|
|
530
535
|
});
|
|
531
536
|
console.log("[IMA] Video resumed (VOD mode)");
|
|
532
537
|
} else {
|
|
@@ -548,7 +553,7 @@ function createImaController(video, options) {
|
|
|
548
553
|
"[IMA] Ad container hidden after all ads completed"
|
|
549
554
|
);
|
|
550
555
|
}
|
|
551
|
-
if (!options
|
|
556
|
+
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
552
557
|
video.play().catch(() => {
|
|
553
558
|
});
|
|
554
559
|
console.log(
|
|
@@ -576,7 +581,7 @@ function createImaController(video, options) {
|
|
|
576
581
|
adContainerEl.style.display = "none";
|
|
577
582
|
console.log("[IMA] Ad container hidden after setup error");
|
|
578
583
|
}
|
|
579
|
-
if (!options
|
|
584
|
+
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
580
585
|
if (video.paused) {
|
|
581
586
|
console.log("[IMA] Resuming paused video after setup error");
|
|
582
587
|
video.play().catch(() => {
|
|
@@ -604,7 +609,7 @@ function createImaController(video, options) {
|
|
|
604
609
|
adContainerEl.style.display = "none";
|
|
605
610
|
console.log("[IMA] Ad container hidden after loader error");
|
|
606
611
|
}
|
|
607
|
-
if (!options
|
|
612
|
+
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
608
613
|
if (video.paused) {
|
|
609
614
|
console.log("[IMA] Resuming paused video after loader error");
|
|
610
615
|
video.play().catch(() => {
|
|
@@ -626,14 +631,15 @@ function createImaController(video, options) {
|
|
|
626
631
|
return adsLoadedPromise;
|
|
627
632
|
} catch (error) {
|
|
628
633
|
console.error("[IMA] Failed to request ads:", error);
|
|
629
|
-
currentReject
|
|
634
|
+
currentReject == null ? void 0 : currentReject(error);
|
|
630
635
|
adsLoadedReject = void 0;
|
|
631
636
|
adsLoadedResolve = void 0;
|
|
632
637
|
return Promise.reject(error);
|
|
633
638
|
}
|
|
634
639
|
},
|
|
635
640
|
async play() {
|
|
636
|
-
|
|
641
|
+
var _a, _b;
|
|
642
|
+
if (!((_a = window.google) == null ? void 0 : _a.ima) || !adDisplayContainer) {
|
|
637
643
|
console.warn(
|
|
638
644
|
"[IMA] Cannot play ad: IMA SDK or ad container not available"
|
|
639
645
|
);
|
|
@@ -655,14 +661,15 @@ function createImaController(video, options) {
|
|
|
655
661
|
} catch (error) {
|
|
656
662
|
console.error("[IMA] Error starting ad playback:", error);
|
|
657
663
|
adPlaying = false;
|
|
658
|
-
if (!options
|
|
659
|
-
video.play()
|
|
664
|
+
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
665
|
+
(_b = video.play()) == null ? void 0 : _b.catch(() => {
|
|
660
666
|
});
|
|
661
667
|
}
|
|
662
668
|
return Promise.reject(error);
|
|
663
669
|
}
|
|
664
670
|
},
|
|
665
671
|
async stop() {
|
|
672
|
+
var _a;
|
|
666
673
|
adPlaying = false;
|
|
667
674
|
video.muted = originalMutedState;
|
|
668
675
|
if (adContainerEl) {
|
|
@@ -671,11 +678,11 @@ function createImaController(video, options) {
|
|
|
671
678
|
console.log("[IMA] Ad container hidden after stop");
|
|
672
679
|
}
|
|
673
680
|
try {
|
|
674
|
-
adsManager
|
|
681
|
+
(_a = adsManager == null ? void 0 : adsManager.stop) == null ? void 0 : _a.call(adsManager);
|
|
675
682
|
} catch {
|
|
676
683
|
}
|
|
677
684
|
destroyAdsManager();
|
|
678
|
-
if (!options
|
|
685
|
+
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
679
686
|
video.play().catch(() => {
|
|
680
687
|
});
|
|
681
688
|
console.log("[IMA] Video resumed after stop (VOD mode)");
|
|
@@ -684,6 +691,7 @@ function createImaController(video, options) {
|
|
|
684
691
|
}
|
|
685
692
|
},
|
|
686
693
|
destroy() {
|
|
694
|
+
var _a;
|
|
687
695
|
destroyAdsManager();
|
|
688
696
|
adPlaying = false;
|
|
689
697
|
video.muted = originalMutedState;
|
|
@@ -692,10 +700,10 @@ function createImaController(video, options) {
|
|
|
692
700
|
adContainerEl.style.display = "none";
|
|
693
701
|
}
|
|
694
702
|
try {
|
|
695
|
-
adsLoader
|
|
703
|
+
(_a = adsLoader == null ? void 0 : adsLoader.destroy) == null ? void 0 : _a.call(adsLoader);
|
|
696
704
|
} catch {
|
|
697
705
|
}
|
|
698
|
-
if (adContainerEl
|
|
706
|
+
if (adContainerEl == null ? void 0 : adContainerEl.parentElement) {
|
|
699
707
|
adContainerEl.parentElement.removeChild(adContainerEl);
|
|
700
708
|
}
|
|
701
709
|
adContainerEl = void 0;
|
|
@@ -706,7 +714,8 @@ function createImaController(video, options) {
|
|
|
706
714
|
return adPlaying;
|
|
707
715
|
},
|
|
708
716
|
resize(width, height) {
|
|
709
|
-
|
|
717
|
+
var _a;
|
|
718
|
+
if (!adsManager || !((_a = window.google) == null ? void 0 : _a.ima)) {
|
|
710
719
|
console.warn(
|
|
711
720
|
"[IMA] Cannot resize: No ads manager or IMA SDK available"
|
|
712
721
|
);
|
|
@@ -724,7 +733,8 @@ function createImaController(video, options) {
|
|
|
724
733
|
listeners.get(event).add(listener);
|
|
725
734
|
},
|
|
726
735
|
off(event, listener) {
|
|
727
|
-
|
|
736
|
+
var _a;
|
|
737
|
+
(_a = listeners.get(event)) == null ? void 0 : _a.delete(listener);
|
|
728
738
|
},
|
|
729
739
|
updateOriginalMutedState(muted) {
|
|
730
740
|
originalMutedState = muted;
|
|
@@ -761,7 +771,8 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
761
771
|
let adPlaying = false;
|
|
762
772
|
let originalMutedState = false;
|
|
763
773
|
const listeners = /* @__PURE__ */ new Map();
|
|
764
|
-
const licenseKey = options
|
|
774
|
+
const licenseKey = options == null ? void 0 : options.licenseKey;
|
|
775
|
+
const mainHlsInstance = options == null ? void 0 : options.mainHlsInstance;
|
|
765
776
|
let adVideoElement;
|
|
766
777
|
let adHls;
|
|
767
778
|
let adContainerEl;
|
|
@@ -808,7 +819,74 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
808
819
|
}
|
|
809
820
|
});
|
|
810
821
|
}
|
|
822
|
+
function getMainStreamQuality() {
|
|
823
|
+
if (!mainHlsInstance || !mainHlsInstance.levels) {
|
|
824
|
+
return null;
|
|
825
|
+
}
|
|
826
|
+
const currentLevel = mainHlsInstance.currentLevel;
|
|
827
|
+
if (currentLevel === -1 || !mainHlsInstance.levels[currentLevel]) {
|
|
828
|
+
const autoLevel = mainHlsInstance.loadLevel;
|
|
829
|
+
if (autoLevel !== -1 && mainHlsInstance.levels[autoLevel]) {
|
|
830
|
+
const level2 = mainHlsInstance.levels[autoLevel];
|
|
831
|
+
return {
|
|
832
|
+
width: level2.width || 1920,
|
|
833
|
+
height: level2.height || 1080,
|
|
834
|
+
bitrate: level2.bitrate || 5e6
|
|
835
|
+
};
|
|
836
|
+
}
|
|
837
|
+
return null;
|
|
838
|
+
}
|
|
839
|
+
const level = mainHlsInstance.levels[currentLevel];
|
|
840
|
+
return {
|
|
841
|
+
width: level.width || 1920,
|
|
842
|
+
height: level.height || 1080,
|
|
843
|
+
bitrate: level.bitrate || 5e6
|
|
844
|
+
};
|
|
845
|
+
}
|
|
846
|
+
function selectBestMediaFile(mediaFiles) {
|
|
847
|
+
if (mediaFiles.length === 0) {
|
|
848
|
+
throw new Error("No media files available");
|
|
849
|
+
}
|
|
850
|
+
const firstFile = mediaFiles[0];
|
|
851
|
+
if (!firstFile) {
|
|
852
|
+
throw new Error("No media files available");
|
|
853
|
+
}
|
|
854
|
+
if (mediaFiles.length === 1) {
|
|
855
|
+
return firstFile;
|
|
856
|
+
}
|
|
857
|
+
const mainQuality = getMainStreamQuality();
|
|
858
|
+
if (!mainQuality) {
|
|
859
|
+
console.log("[HlsAdPlayer] No main stream quality info, using first media file");
|
|
860
|
+
return firstFile;
|
|
861
|
+
}
|
|
862
|
+
console.log("[HlsAdPlayer] Main stream quality:", mainQuality);
|
|
863
|
+
const scoredFiles = mediaFiles.map((file) => {
|
|
864
|
+
const widthDiff = Math.abs(file.width - mainQuality.width);
|
|
865
|
+
const heightDiff = Math.abs(file.height - mainQuality.height);
|
|
866
|
+
const resolutionDiff = widthDiff + heightDiff;
|
|
867
|
+
const fileBitrate = (file.bitrate || 5e3) * 1e3;
|
|
868
|
+
const bitrateDiff = Math.abs(fileBitrate - mainQuality.bitrate);
|
|
869
|
+
const score = resolutionDiff * 2 + bitrateDiff / 1e3;
|
|
870
|
+
return { file, score, resolutionDiff, bitrateDiff };
|
|
871
|
+
});
|
|
872
|
+
scoredFiles.sort((a, b) => a.score - b.score);
|
|
873
|
+
const bestMatch = scoredFiles[0];
|
|
874
|
+
if (!bestMatch) {
|
|
875
|
+
console.log("[HlsAdPlayer] No best match found, using first media file");
|
|
876
|
+
return firstFile;
|
|
877
|
+
}
|
|
878
|
+
console.log("[HlsAdPlayer] Selected media file:", {
|
|
879
|
+
url: bestMatch.file.url,
|
|
880
|
+
resolution: `${bestMatch.file.width}x${bestMatch.file.height}`,
|
|
881
|
+
bitrate: bestMatch.file.bitrate,
|
|
882
|
+
score: bestMatch.score,
|
|
883
|
+
resolutionDiff: bestMatch.resolutionDiff,
|
|
884
|
+
bitrateDiff: bestMatch.bitrateDiff
|
|
885
|
+
});
|
|
886
|
+
return bestMatch.file;
|
|
887
|
+
}
|
|
811
888
|
function parseVastXml(xmlString) {
|
|
889
|
+
var _a, _b, _c, _d;
|
|
812
890
|
try {
|
|
813
891
|
const parser = new DOMParser();
|
|
814
892
|
const xmlDoc = parser.parseFromString(xmlString, "text/xml");
|
|
@@ -823,19 +901,20 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
823
901
|
return null;
|
|
824
902
|
}
|
|
825
903
|
const adId = adElement.getAttribute("id") || "unknown";
|
|
826
|
-
const title = xmlDoc.querySelector("AdTitle")
|
|
827
|
-
const durationText = xmlDoc.querySelector("Duration")
|
|
904
|
+
const title = ((_a = xmlDoc.querySelector("AdTitle")) == null ? void 0 : _a.textContent) || "Ad";
|
|
905
|
+
const durationText = ((_b = xmlDoc.querySelector("Duration")) == null ? void 0 : _b.textContent) || "00:00:30";
|
|
828
906
|
const durationParts = durationText.split(":");
|
|
829
907
|
const duration = parseInt(durationParts[0] || "0", 10) * 3600 + parseInt(durationParts[1] || "0", 10) * 60 + parseInt(durationParts[2] || "0", 10);
|
|
830
908
|
const mediaFileElements = xmlDoc.querySelectorAll("MediaFile");
|
|
831
909
|
const mediaFiles = [];
|
|
832
910
|
mediaFileElements.forEach((mf) => {
|
|
911
|
+
var _a2;
|
|
833
912
|
const type = mf.getAttribute("type") || "";
|
|
834
913
|
if (type === "application/x-mpegURL" || type.includes("m3u8")) {
|
|
835
914
|
const bitrateAttr = mf.getAttribute("bitrate");
|
|
836
915
|
const bitrateValue = bitrateAttr ? parseInt(bitrateAttr, 10) : void 0;
|
|
837
916
|
mediaFiles.push({
|
|
838
|
-
url: mf.textContent
|
|
917
|
+
url: ((_a2 = mf.textContent) == null ? void 0 : _a2.trim()) || "",
|
|
839
918
|
type,
|
|
840
919
|
width: parseInt(mf.getAttribute("width") || "1920", 10),
|
|
841
920
|
height: parseInt(mf.getAttribute("height") || "1080", 10),
|
|
@@ -864,12 +943,14 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
864
943
|
error: []
|
|
865
944
|
};
|
|
866
945
|
xmlDoc.querySelectorAll("Impression").forEach((el) => {
|
|
867
|
-
|
|
946
|
+
var _a2;
|
|
947
|
+
const url = (_a2 = el.textContent) == null ? void 0 : _a2.trim();
|
|
868
948
|
if (url) trackingUrls.impression.push(url);
|
|
869
949
|
});
|
|
870
950
|
xmlDoc.querySelectorAll("Tracking").forEach((el) => {
|
|
951
|
+
var _a2;
|
|
871
952
|
const event = el.getAttribute("event");
|
|
872
|
-
const url = el.textContent
|
|
953
|
+
const url = (_a2 = el.textContent) == null ? void 0 : _a2.trim();
|
|
873
954
|
if (event && url) {
|
|
874
955
|
const eventKey = event;
|
|
875
956
|
if (trackingUrls[eventKey]) {
|
|
@@ -877,7 +958,7 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
877
958
|
}
|
|
878
959
|
}
|
|
879
960
|
});
|
|
880
|
-
const clickThrough = xmlDoc.querySelector("ClickThrough")
|
|
961
|
+
const clickThrough = (_d = (_c = xmlDoc.querySelector("ClickThrough")) == null ? void 0 : _c.textContent) == null ? void 0 : _d.trim();
|
|
881
962
|
return {
|
|
882
963
|
id: adId,
|
|
883
964
|
title,
|
|
@@ -969,7 +1050,7 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
969
1050
|
adContainerEl.style.display = "none";
|
|
970
1051
|
adContainerEl.style.pointerEvents = "none";
|
|
971
1052
|
}
|
|
972
|
-
if (!options
|
|
1053
|
+
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
973
1054
|
contentVideo.play().catch(() => {
|
|
974
1055
|
});
|
|
975
1056
|
console.log("[HlsAdPlayer] Content resumed (VOD mode)");
|
|
@@ -987,7 +1068,7 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
987
1068
|
adContainerEl.style.display = "none";
|
|
988
1069
|
adContainerEl.style.pointerEvents = "none";
|
|
989
1070
|
}
|
|
990
|
-
if (!options
|
|
1071
|
+
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
991
1072
|
if (contentVideo.paused) {
|
|
992
1073
|
contentVideo.play().catch(() => {
|
|
993
1074
|
});
|
|
@@ -997,6 +1078,7 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
997
1078
|
}
|
|
998
1079
|
return {
|
|
999
1080
|
initialize() {
|
|
1081
|
+
var _a;
|
|
1000
1082
|
console.log("[HlsAdPlayer] Initializing");
|
|
1001
1083
|
if (!adContainerEl) {
|
|
1002
1084
|
const container = document.createElement("div");
|
|
@@ -1011,7 +1093,7 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
1011
1093
|
container.style.pointerEvents = "none";
|
|
1012
1094
|
container.style.zIndex = "2";
|
|
1013
1095
|
container.style.backgroundColor = "#000";
|
|
1014
|
-
contentVideo.parentElement
|
|
1096
|
+
(_a = contentVideo.parentElement) == null ? void 0 : _a.appendChild(container);
|
|
1015
1097
|
adContainerEl = container;
|
|
1016
1098
|
}
|
|
1017
1099
|
},
|
|
@@ -1053,7 +1135,7 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
1053
1135
|
try {
|
|
1054
1136
|
if (!adVideoElement) {
|
|
1055
1137
|
adVideoElement = createAdVideoElement();
|
|
1056
|
-
adContainerEl
|
|
1138
|
+
adContainerEl == null ? void 0 : adContainerEl.appendChild(adVideoElement);
|
|
1057
1139
|
setupAdEventListeners();
|
|
1058
1140
|
}
|
|
1059
1141
|
trackingFired = {
|
|
@@ -1064,7 +1146,7 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
1064
1146
|
thirdQuartile: false,
|
|
1065
1147
|
complete: false
|
|
1066
1148
|
};
|
|
1067
|
-
if (!options
|
|
1149
|
+
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
1068
1150
|
contentVideo.pause();
|
|
1069
1151
|
console.log("[HlsAdPlayer] Content paused (VOD mode)");
|
|
1070
1152
|
} else {
|
|
@@ -1077,7 +1159,7 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
1077
1159
|
adContainerEl.style.pointerEvents = "auto";
|
|
1078
1160
|
}
|
|
1079
1161
|
emit("content_pause");
|
|
1080
|
-
const mediaFile = currentAd.mediaFiles
|
|
1162
|
+
const mediaFile = selectBestMediaFile(currentAd.mediaFiles);
|
|
1081
1163
|
if (!mediaFile) {
|
|
1082
1164
|
throw new Error("No media file available for ad");
|
|
1083
1165
|
}
|
|
@@ -1137,7 +1219,7 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
1137
1219
|
adVideoElement.pause();
|
|
1138
1220
|
adVideoElement.src = "";
|
|
1139
1221
|
}
|
|
1140
|
-
if (!options
|
|
1222
|
+
if (!(options == null ? void 0 : options.continueLiveStreamDuringAds)) {
|
|
1141
1223
|
contentVideo.play().catch(() => {
|
|
1142
1224
|
});
|
|
1143
1225
|
}
|
|
@@ -1157,7 +1239,7 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
1157
1239
|
adVideoElement.remove();
|
|
1158
1240
|
adVideoElement = void 0;
|
|
1159
1241
|
}
|
|
1160
|
-
if (adContainerEl
|
|
1242
|
+
if (adContainerEl == null ? void 0 : adContainerEl.parentElement) {
|
|
1161
1243
|
adContainerEl.parentElement.removeChild(adContainerEl);
|
|
1162
1244
|
}
|
|
1163
1245
|
adContainerEl = void 0;
|
|
@@ -1183,7 +1265,8 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
1183
1265
|
listeners.get(event).add(listener);
|
|
1184
1266
|
},
|
|
1185
1267
|
off(event, listener) {
|
|
1186
|
-
|
|
1268
|
+
var _a;
|
|
1269
|
+
(_a = listeners.get(event)) == null ? void 0 : _a.delete(listener);
|
|
1187
1270
|
},
|
|
1188
1271
|
updateOriginalMutedState(muted) {
|
|
1189
1272
|
originalMutedState = muted;
|
|
@@ -1208,6 +1291,7 @@ function createHlsAdPlayer(contentVideo, options) {
|
|
|
1208
1291
|
// src/utils/tracking.ts
|
|
1209
1292
|
var cachedBrowserId = null;
|
|
1210
1293
|
function getClientInfo() {
|
|
1294
|
+
var _a, _b, _c, _d;
|
|
1211
1295
|
const ua = navigator.userAgent;
|
|
1212
1296
|
const platform = navigator.platform;
|
|
1213
1297
|
const vendor = navigator.vendor || "";
|
|
@@ -1215,12 +1299,12 @@ function getClientInfo() {
|
|
|
1215
1299
|
const memory = navigator.deviceMemory || null;
|
|
1216
1300
|
const hardwareConcurrency = navigator.hardwareConcurrency || 1;
|
|
1217
1301
|
const screenInfo = {
|
|
1218
|
-
width: screen
|
|
1219
|
-
height: screen
|
|
1220
|
-
availWidth: screen
|
|
1221
|
-
availHeight: screen
|
|
1222
|
-
orientation: screen
|
|
1223
|
-
pixelDepth: screen
|
|
1302
|
+
width: screen == null ? void 0 : screen.width,
|
|
1303
|
+
height: screen == null ? void 0 : screen.height,
|
|
1304
|
+
availWidth: screen == null ? void 0 : screen.availWidth,
|
|
1305
|
+
availHeight: screen == null ? void 0 : screen.availHeight,
|
|
1306
|
+
orientation: ((_a = screen == null ? void 0 : screen.orientation) == null ? void 0 : _a.type) || "",
|
|
1307
|
+
pixelDepth: screen == null ? void 0 : screen.pixelDepth
|
|
1224
1308
|
};
|
|
1225
1309
|
let deviceType = "desktop";
|
|
1226
1310
|
let brand = "Unknown";
|
|
@@ -1317,10 +1401,10 @@ function getClientInfo() {
|
|
|
1317
1401
|
if (vendor.includes("Samsung") || ua.includes("SM-")) brand = "Samsung";
|
|
1318
1402
|
}
|
|
1319
1403
|
isWebView = /wv|WebView|Linux; U;/.test(ua);
|
|
1320
|
-
if (window
|
|
1404
|
+
if ((window == null ? void 0 : window.outerHeight) === 0 && (window == null ? void 0 : window.outerWidth) === 0) {
|
|
1321
1405
|
isWebView = true;
|
|
1322
1406
|
}
|
|
1323
|
-
isWebApp = window.matchMedia("(display-mode: standalone)").matches || window.navigator.standalone === true || window.screen
|
|
1407
|
+
isWebApp = window.matchMedia("(display-mode: standalone)").matches || window.navigator.standalone === true || ((_c = (_b = window.screen) == null ? void 0 : _b.orientation) == null ? void 0 : _c.angle) !== void 0;
|
|
1324
1408
|
return {
|
|
1325
1409
|
brand,
|
|
1326
1410
|
os,
|
|
@@ -1341,7 +1425,7 @@ function getClientInfo() {
|
|
|
1341
1425
|
deviceMemory: memory,
|
|
1342
1426
|
maxTouchPoints,
|
|
1343
1427
|
language: navigator.language,
|
|
1344
|
-
languages: navigator.languages
|
|
1428
|
+
languages: ((_d = navigator.languages) == null ? void 0 : _d.join(",")) || "",
|
|
1345
1429
|
cookieEnabled: navigator.cookieEnabled,
|
|
1346
1430
|
doNotTrack: navigator.doNotTrack || "",
|
|
1347
1431
|
referrer: document.referrer,
|
|
@@ -1699,7 +1783,8 @@ var StormcloudVideoPlayer = class {
|
|
|
1699
1783
|
}
|
|
1700
1784
|
return createHlsAdPlayer(this.video, {
|
|
1701
1785
|
continueLiveStreamDuringAds,
|
|
1702
|
-
...this.config.licenseKey ? { licenseKey: this.config.licenseKey } : {}
|
|
1786
|
+
...this.config.licenseKey ? { licenseKey: this.config.licenseKey } : {},
|
|
1787
|
+
...this.hls ? { mainHlsInstance: this.hls } : {}
|
|
1703
1788
|
});
|
|
1704
1789
|
} else {
|
|
1705
1790
|
if (this.config.debugAdTiming) {
|
|
@@ -1711,6 +1796,7 @@ var StormcloudVideoPlayer = class {
|
|
|
1711
1796
|
}
|
|
1712
1797
|
}
|
|
1713
1798
|
async load() {
|
|
1799
|
+
var _a, _b;
|
|
1714
1800
|
if (!this.attached) {
|
|
1715
1801
|
this.attach();
|
|
1716
1802
|
}
|
|
@@ -1727,7 +1813,7 @@ var StormcloudVideoPlayer = class {
|
|
|
1727
1813
|
this.initializeTracking();
|
|
1728
1814
|
if (this.shouldUseNativeHls()) {
|
|
1729
1815
|
this.video.src = this.config.src;
|
|
1730
|
-
this.isLiveStream = this.config.lowLatencyMode
|
|
1816
|
+
this.isLiveStream = (_a = this.config.lowLatencyMode) != null ? _a : false;
|
|
1731
1817
|
if (this.config.debugAdTiming) {
|
|
1732
1818
|
console.log(
|
|
1733
1819
|
"[StormcloudVideoPlayer] allowNativeHls: true - VOD mode detected:",
|
|
@@ -1742,8 +1828,8 @@ var StormcloudVideoPlayer = class {
|
|
|
1742
1828
|
this.ima = this.createAdPlayer(false);
|
|
1743
1829
|
this.ima.initialize();
|
|
1744
1830
|
if (this.config.autoplay) {
|
|
1745
|
-
await this.video.play()
|
|
1746
|
-
});
|
|
1831
|
+
await ((_b = this.video.play()) == null ? void 0 : _b.catch(() => {
|
|
1832
|
+
}));
|
|
1747
1833
|
}
|
|
1748
1834
|
return;
|
|
1749
1835
|
}
|
|
@@ -1756,12 +1842,17 @@ var StormcloudVideoPlayer = class {
|
|
|
1756
1842
|
...this.config.lowLatencyMode ? { liveSyncDuration: 2 } : {}
|
|
1757
1843
|
});
|
|
1758
1844
|
this.hls.on(import_hls2.default.Events.MEDIA_ATTACHED, () => {
|
|
1759
|
-
|
|
1845
|
+
var _a2;
|
|
1846
|
+
(_a2 = this.hls) == null ? void 0 : _a2.loadSource(this.config.src);
|
|
1760
1847
|
});
|
|
1761
1848
|
this.hls.on(import_hls2.default.Events.MANIFEST_PARSED, async (_, data) => {
|
|
1762
|
-
|
|
1763
|
-
|
|
1764
|
-
|
|
1849
|
+
var _a2, _b2, _c, _d;
|
|
1850
|
+
this.isLiveStream = (_c = (_b2 = (_a2 = this.hls) == null ? void 0 : _a2.levels) == null ? void 0 : _b2.some(
|
|
1851
|
+
(level) => {
|
|
1852
|
+
var _a3, _b3;
|
|
1853
|
+
return ((_a3 = level == null ? void 0 : level.details) == null ? void 0 : _a3.live) === true || ((_b3 = level == null ? void 0 : level.details) == null ? void 0 : _b3.type) === "LIVE";
|
|
1854
|
+
}
|
|
1855
|
+
)) != null ? _c : false;
|
|
1765
1856
|
if (this.config.debugAdTiming) {
|
|
1766
1857
|
const adBehavior = this.shouldContinueLiveStreamDuringAds() ? "live (main video continues muted during ads)" : "vod (main video pauses during ads)";
|
|
1767
1858
|
console.log("[StormcloudVideoPlayer] Stream type detected:", {
|
|
@@ -1774,28 +1865,29 @@ var StormcloudVideoPlayer = class {
|
|
|
1774
1865
|
this.ima = this.createAdPlayer(this.shouldContinueLiveStreamDuringAds());
|
|
1775
1866
|
this.ima.initialize();
|
|
1776
1867
|
if (this.config.autoplay) {
|
|
1777
|
-
await this.video.play()
|
|
1778
|
-
});
|
|
1868
|
+
await ((_d = this.video.play()) == null ? void 0 : _d.catch(() => {
|
|
1869
|
+
}));
|
|
1779
1870
|
}
|
|
1780
1871
|
});
|
|
1781
1872
|
this.hls.on(import_hls2.default.Events.FRAG_PARSING_METADATA, (_evt, data) => {
|
|
1782
|
-
const id3Tags = (data
|
|
1873
|
+
const id3Tags = ((data == null ? void 0 : data.samples) || []).map((s) => ({
|
|
1783
1874
|
key: "ID3",
|
|
1784
|
-
value: s
|
|
1785
|
-
ptsSeconds: s
|
|
1875
|
+
value: s == null ? void 0 : s.data,
|
|
1876
|
+
ptsSeconds: s == null ? void 0 : s.pts
|
|
1786
1877
|
}));
|
|
1787
1878
|
id3Tags.forEach((tag) => this.onId3Tag(tag));
|
|
1788
1879
|
});
|
|
1789
1880
|
this.hls.on(import_hls2.default.Events.FRAG_CHANGED, (_evt, data) => {
|
|
1790
|
-
|
|
1791
|
-
const
|
|
1881
|
+
var _a2, _b2, _c;
|
|
1882
|
+
const frag = data == null ? void 0 : data.frag;
|
|
1883
|
+
const tagList = frag == null ? void 0 : frag.tagList;
|
|
1792
1884
|
if (!Array.isArray(tagList)) return;
|
|
1793
1885
|
for (const entry of tagList) {
|
|
1794
1886
|
let tag = "";
|
|
1795
1887
|
let value = "";
|
|
1796
1888
|
if (Array.isArray(entry)) {
|
|
1797
|
-
tag = String(entry[0]
|
|
1798
|
-
value = String(entry[1]
|
|
1889
|
+
tag = String((_a2 = entry[0]) != null ? _a2 : "");
|
|
1890
|
+
value = String((_b2 = entry[1]) != null ? _b2 : "");
|
|
1799
1891
|
} else if (typeof entry === "string") {
|
|
1800
1892
|
const idx = entry.indexOf(":");
|
|
1801
1893
|
if (idx >= 0) {
|
|
@@ -1819,8 +1911,8 @@ var StormcloudVideoPlayer = class {
|
|
|
1819
1911
|
const prog = this.parseCueOutCont(value);
|
|
1820
1912
|
const marker = {
|
|
1821
1913
|
type: "progress",
|
|
1822
|
-
...prog
|
|
1823
|
-
...prog
|
|
1914
|
+
...(prog == null ? void 0 : prog.duration) !== void 0 ? { durationSeconds: prog.duration } : {},
|
|
1915
|
+
...(prog == null ? void 0 : prog.elapsed) !== void 0 ? { ptsSeconds: prog.elapsed } : {},
|
|
1824
1916
|
raw: { tag, value }
|
|
1825
1917
|
};
|
|
1826
1918
|
this.onScte35Marker(marker);
|
|
@@ -1830,7 +1922,7 @@ var StormcloudVideoPlayer = class {
|
|
|
1830
1922
|
const attrs = this.parseAttributeList(value);
|
|
1831
1923
|
const hasScteOut = "SCTE35-OUT" in attrs || attrs["SCTE35-OUT"] !== void 0;
|
|
1832
1924
|
const hasScteIn = "SCTE35-IN" in attrs || attrs["SCTE35-IN"] !== void 0;
|
|
1833
|
-
const klass = String(attrs["CLASS"]
|
|
1925
|
+
const klass = String((_c = attrs["CLASS"]) != null ? _c : "");
|
|
1834
1926
|
const duration = this.toNumber(attrs["DURATION"]);
|
|
1835
1927
|
if (hasScteOut || /com\.apple\.hls\.cue/i.test(klass)) {
|
|
1836
1928
|
const marker = {
|
|
@@ -1847,13 +1939,14 @@ var StormcloudVideoPlayer = class {
|
|
|
1847
1939
|
}
|
|
1848
1940
|
});
|
|
1849
1941
|
this.hls.on(import_hls2.default.Events.ERROR, (_evt, data) => {
|
|
1850
|
-
|
|
1942
|
+
var _a2, _b2;
|
|
1943
|
+
if (data == null ? void 0 : data.fatal) {
|
|
1851
1944
|
switch (data.type) {
|
|
1852
1945
|
case import_hls2.default.ErrorTypes.NETWORK_ERROR:
|
|
1853
|
-
this.hls
|
|
1946
|
+
(_a2 = this.hls) == null ? void 0 : _a2.startLoad();
|
|
1854
1947
|
break;
|
|
1855
1948
|
case import_hls2.default.ErrorTypes.MEDIA_ERROR:
|
|
1856
|
-
this.hls
|
|
1949
|
+
(_b2 = this.hls) == null ? void 0 : _b2.recoverMediaError();
|
|
1857
1950
|
break;
|
|
1858
1951
|
default:
|
|
1859
1952
|
this.destroy();
|
|
@@ -1955,11 +2048,12 @@ var StormcloudVideoPlayer = class {
|
|
|
1955
2048
|
}
|
|
1956
2049
|
}
|
|
1957
2050
|
parseScte35FromId3(tag) {
|
|
2051
|
+
var _a, _b, _c, _d;
|
|
1958
2052
|
const text = this.decodeId3ValueToText(tag.value);
|
|
1959
2053
|
if (!text) return void 0;
|
|
1960
2054
|
const cueOutMatch = text.match(/EXT-X-CUE-OUT(?::([^\r\n]*))?/i) || text.match(/CUE-OUT(?::([^\r\n]*))?/i);
|
|
1961
2055
|
if (cueOutMatch) {
|
|
1962
|
-
const arg = (cueOutMatch[1]
|
|
2056
|
+
const arg = ((_a = cueOutMatch[1]) != null ? _a : "").trim();
|
|
1963
2057
|
const dur = this.parseCueOutDuration(arg);
|
|
1964
2058
|
const marker = {
|
|
1965
2059
|
type: "start",
|
|
@@ -1971,12 +2065,12 @@ var StormcloudVideoPlayer = class {
|
|
|
1971
2065
|
}
|
|
1972
2066
|
const cueOutContMatch = text.match(/EXT-X-CUE-OUT-CONT:([^\r\n]*)/i);
|
|
1973
2067
|
if (cueOutContMatch) {
|
|
1974
|
-
const arg = (cueOutContMatch[1]
|
|
2068
|
+
const arg = ((_b = cueOutContMatch[1]) != null ? _b : "").trim();
|
|
1975
2069
|
const cont = this.parseCueOutCont(arg);
|
|
1976
2070
|
const marker = {
|
|
1977
2071
|
type: "progress",
|
|
1978
2072
|
...tag.ptsSeconds !== void 0 ? { ptsSeconds: tag.ptsSeconds } : {},
|
|
1979
|
-
...cont
|
|
2073
|
+
...(cont == null ? void 0 : cont.duration) !== void 0 ? { durationSeconds: cont.duration } : {},
|
|
1980
2074
|
raw: { id3: text }
|
|
1981
2075
|
};
|
|
1982
2076
|
return marker;
|
|
@@ -1992,10 +2086,10 @@ var StormcloudVideoPlayer = class {
|
|
|
1992
2086
|
}
|
|
1993
2087
|
const daterangeMatch = text.match(/EXT-X-DATERANGE:([^\r\n]*)/i);
|
|
1994
2088
|
if (daterangeMatch) {
|
|
1995
|
-
const attrs = this.parseAttributeList(daterangeMatch[1]
|
|
2089
|
+
const attrs = this.parseAttributeList((_c = daterangeMatch[1]) != null ? _c : "");
|
|
1996
2090
|
const hasScteOut = "SCTE35-OUT" in attrs || attrs["SCTE35-OUT"] !== void 0;
|
|
1997
2091
|
const hasScteIn = "SCTE35-IN" in attrs || attrs["SCTE35-IN"] !== void 0;
|
|
1998
|
-
const klass = String(attrs["CLASS"]
|
|
2092
|
+
const klass = String((_d = attrs["CLASS"]) != null ? _d : "");
|
|
1999
2093
|
const duration = this.toNumber(attrs["DURATION"]);
|
|
2000
2094
|
if (hasScteOut || /com\.apple\.hls\.cue/i.test(klass)) {
|
|
2001
2095
|
const marker = {
|
|
@@ -2052,6 +2146,7 @@ var StormcloudVideoPlayer = class {
|
|
|
2052
2146
|
}
|
|
2053
2147
|
}
|
|
2054
2148
|
onScte35Marker(marker) {
|
|
2149
|
+
var _a, _b;
|
|
2055
2150
|
if (this.config.debugAdTiming) {
|
|
2056
2151
|
console.log("[StormcloudVideoPlayer] SCTE-35 marker detected:", {
|
|
2057
2152
|
type: marker.type,
|
|
@@ -2067,7 +2162,7 @@ var StormcloudVideoPlayer = class {
|
|
|
2067
2162
|
this.expectedAdBreakDurationMs = durationMs;
|
|
2068
2163
|
this.currentAdBreakStartWallClockMs = Date.now();
|
|
2069
2164
|
const isManifestMarker = this.isManifestBasedMarker(marker);
|
|
2070
|
-
const forceImmediate = this.config.immediateManifestAds
|
|
2165
|
+
const forceImmediate = (_a = this.config.immediateManifestAds) != null ? _a : true;
|
|
2071
2166
|
if (this.config.debugAdTiming) {
|
|
2072
2167
|
console.log("[StormcloudVideoPlayer] Ad start decision:", {
|
|
2073
2168
|
isManifestMarker,
|
|
@@ -2084,7 +2179,7 @@ var StormcloudVideoPlayer = class {
|
|
|
2084
2179
|
this.clearAdStartTimer();
|
|
2085
2180
|
this.handleAdStart(marker);
|
|
2086
2181
|
} else if (typeof marker.ptsSeconds === "number") {
|
|
2087
|
-
const tol = this.config.driftToleranceMs
|
|
2182
|
+
const tol = (_b = this.config.driftToleranceMs) != null ? _b : 1e3;
|
|
2088
2183
|
const nowMs = this.video.currentTime * 1e3;
|
|
2089
2184
|
const estCurrentPtsMs = nowMs - this.ptsDriftEmaMs;
|
|
2090
2185
|
const deltaMs = Math.floor(marker.ptsSeconds * 1e3 - estCurrentPtsMs);
|
|
@@ -2194,12 +2289,13 @@ var StormcloudVideoPlayer = class {
|
|
|
2194
2289
|
return void 0;
|
|
2195
2290
|
}
|
|
2196
2291
|
parseAttributeList(value) {
|
|
2292
|
+
var _a, _b, _c;
|
|
2197
2293
|
const attrs = {};
|
|
2198
2294
|
const regex = /([A-Z0-9-]+)=(("[^"]*")|([^",]*))(?:,|$)/gi;
|
|
2199
2295
|
let match;
|
|
2200
2296
|
while ((match = regex.exec(value)) !== null) {
|
|
2201
|
-
const key = match[1]
|
|
2202
|
-
let rawVal = match[3]
|
|
2297
|
+
const key = (_a = match[1]) != null ? _a : "";
|
|
2298
|
+
let rawVal = (_c = (_b = match[3]) != null ? _b : match[4]) != null ? _c : "";
|
|
2203
2299
|
if (rawVal.startsWith('"') && rawVal.endsWith('"')) {
|
|
2204
2300
|
rawVal = rawVal.slice(1, -1);
|
|
2205
2301
|
}
|
|
@@ -2363,6 +2459,7 @@ var StormcloudVideoPlayer = class {
|
|
|
2363
2459
|
}
|
|
2364
2460
|
}
|
|
2365
2461
|
async fetchAdConfiguration() {
|
|
2462
|
+
var _a, _b, _c;
|
|
2366
2463
|
const vastMode = this.config.vastMode || "default";
|
|
2367
2464
|
if (this.config.debugAdTiming) {
|
|
2368
2465
|
console.log(
|
|
@@ -2420,7 +2517,7 @@ var StormcloudVideoPlayer = class {
|
|
|
2420
2517
|
return;
|
|
2421
2518
|
}
|
|
2422
2519
|
const data = await response.json();
|
|
2423
|
-
const imaPayload = data.response
|
|
2520
|
+
const imaPayload = (_c = (_b = (_a = data.response) == null ? void 0 : _a.ima) == null ? void 0 : _b["publisherdesk.ima"]) == null ? void 0 : _c.payload;
|
|
2424
2521
|
if (imaPayload) {
|
|
2425
2522
|
this.apiVastTagUrl = decodeURIComponent(imaPayload);
|
|
2426
2523
|
if (this.config.debugAdTiming) {
|
|
@@ -2457,11 +2554,12 @@ var StormcloudVideoPlayer = class {
|
|
|
2457
2554
|
return "other";
|
|
2458
2555
|
}
|
|
2459
2556
|
shouldShowNativeControls() {
|
|
2557
|
+
var _a, _b;
|
|
2460
2558
|
const streamType = this.getStreamType();
|
|
2461
2559
|
if (streamType === "other") {
|
|
2462
|
-
return !(this.config.showCustomControls
|
|
2560
|
+
return !((_a = this.config.showCustomControls) != null ? _a : false);
|
|
2463
2561
|
}
|
|
2464
|
-
return !!(this.config.allowNativeHls && !(this.config.showCustomControls
|
|
2562
|
+
return !!(this.config.allowNativeHls && !((_b = this.config.showCustomControls) != null ? _b : false));
|
|
2465
2563
|
}
|
|
2466
2564
|
shouldContinueLiveStreamDuringAds() {
|
|
2467
2565
|
if (this.config.allowNativeHls) {
|
|
@@ -2473,6 +2571,7 @@ var StormcloudVideoPlayer = class {
|
|
|
2473
2571
|
return true;
|
|
2474
2572
|
}
|
|
2475
2573
|
async handleAdStart(_marker) {
|
|
2574
|
+
var _a;
|
|
2476
2575
|
const scheduled = this.findCurrentOrNextBreak(
|
|
2477
2576
|
this.video.currentTime * 1e3
|
|
2478
2577
|
);
|
|
@@ -2523,17 +2622,18 @@ var StormcloudVideoPlayer = class {
|
|
|
2523
2622
|
this.handleAdFailure();
|
|
2524
2623
|
}
|
|
2525
2624
|
}
|
|
2526
|
-
if (this.expectedAdBreakDurationMs == null && scheduled
|
|
2625
|
+
if (this.expectedAdBreakDurationMs == null && (scheduled == null ? void 0 : scheduled.durationMs) != null) {
|
|
2527
2626
|
this.expectedAdBreakDurationMs = scheduled.durationMs;
|
|
2528
|
-
this.currentAdBreakStartWallClockMs = this.currentAdBreakStartWallClockMs
|
|
2627
|
+
this.currentAdBreakStartWallClockMs = (_a = this.currentAdBreakStartWallClockMs) != null ? _a : Date.now();
|
|
2529
2628
|
this.scheduleAdStopCountdown(this.expectedAdBreakDurationMs);
|
|
2530
2629
|
}
|
|
2531
2630
|
}
|
|
2532
2631
|
findCurrentOrNextBreak(nowMs) {
|
|
2632
|
+
var _a;
|
|
2533
2633
|
const schedule = [];
|
|
2534
2634
|
let candidate;
|
|
2535
2635
|
for (const b of schedule) {
|
|
2536
|
-
const tol = this.config.driftToleranceMs
|
|
2636
|
+
const tol = (_a = this.config.driftToleranceMs) != null ? _a : 1e3;
|
|
2537
2637
|
if (b.startTimeMs <= nowMs + tol && (candidate == null || b.startTimeMs > (candidate.startTimeMs || 0))) {
|
|
2538
2638
|
candidate = b;
|
|
2539
2639
|
}
|
|
@@ -2549,7 +2649,8 @@ var StormcloudVideoPlayer = class {
|
|
|
2549
2649
|
}
|
|
2550
2650
|
}
|
|
2551
2651
|
async handleMidAdJoin(adBreak, nowMs) {
|
|
2552
|
-
|
|
2652
|
+
var _a;
|
|
2653
|
+
const durationMs = (_a = adBreak.durationMs) != null ? _a : 0;
|
|
2553
2654
|
const endMs = adBreak.startTimeMs + durationMs;
|
|
2554
2655
|
if (durationMs > 0 && nowMs > adBreak.startTimeMs && nowMs < endMs) {
|
|
2555
2656
|
const remainingMs = endMs - nowMs;
|
|
@@ -2650,6 +2751,7 @@ var StormcloudVideoPlayer = class {
|
|
|
2650
2751
|
}
|
|
2651
2752
|
}
|
|
2652
2753
|
handleAdFailure() {
|
|
2754
|
+
var _a;
|
|
2653
2755
|
if (this.config.debugAdTiming) {
|
|
2654
2756
|
console.log(
|
|
2655
2757
|
"[StormcloudVideoPlayer] Handling ad failure - resuming content",
|
|
@@ -2682,7 +2784,7 @@ var StormcloudVideoPlayer = class {
|
|
|
2682
2784
|
if (this.config.debugAdTiming) {
|
|
2683
2785
|
console.log("[StormcloudVideoPlayer] Resuming paused video");
|
|
2684
2786
|
}
|
|
2685
|
-
this.video.play()
|
|
2787
|
+
(_a = this.video.play()) == null ? void 0 : _a.catch((error) => {
|
|
2686
2788
|
if (this.config.debugAdTiming) {
|
|
2687
2789
|
console.error(
|
|
2688
2790
|
"[StormcloudVideoPlayer] Failed to resume video after ad failure:",
|
|
@@ -2697,8 +2799,9 @@ var StormcloudVideoPlayer = class {
|
|
|
2697
2799
|
}
|
|
2698
2800
|
}
|
|
2699
2801
|
startAdFailsafeTimer() {
|
|
2802
|
+
var _a;
|
|
2700
2803
|
this.clearAdFailsafeTimer();
|
|
2701
|
-
const failsafeMs = this.config.adFailsafeTimeoutMs
|
|
2804
|
+
const failsafeMs = (_a = this.config.adFailsafeTimeoutMs) != null ? _a : 1e4;
|
|
2702
2805
|
if (this.config.debugAdTiming) {
|
|
2703
2806
|
console.log(
|
|
2704
2807
|
`[StormcloudVideoPlayer] Starting failsafe timer (${failsafeMs}ms)`
|
|
@@ -2834,6 +2937,7 @@ var StormcloudVideoPlayer = class {
|
|
|
2834
2937
|
}
|
|
2835
2938
|
}
|
|
2836
2939
|
destroy() {
|
|
2940
|
+
var _a, _b;
|
|
2837
2941
|
this.clearAdStartTimer();
|
|
2838
2942
|
this.clearAdStopTimer();
|
|
2839
2943
|
this.clearAdFailsafeTimer();
|
|
@@ -2841,8 +2945,8 @@ var StormcloudVideoPlayer = class {
|
|
|
2841
2945
|
clearInterval(this.heartbeatInterval);
|
|
2842
2946
|
this.heartbeatInterval = void 0;
|
|
2843
2947
|
}
|
|
2844
|
-
this.hls
|
|
2845
|
-
this.ima
|
|
2948
|
+
(_a = this.hls) == null ? void 0 : _a.destroy();
|
|
2949
|
+
(_b = this.ima) == null ? void 0 : _b.destroy();
|
|
2846
2950
|
}
|
|
2847
2951
|
};
|
|
2848
2952
|
|
|
@@ -2853,6 +2957,7 @@ var HlsPlayer = class extends import_react2.Component {
|
|
|
2853
2957
|
this.player = null;
|
|
2854
2958
|
this.mounted = false;
|
|
2855
2959
|
this.load = async () => {
|
|
2960
|
+
var _a, _b, _c, _d, _e, _f;
|
|
2856
2961
|
if (!this.props.videoElement || !this.props.src) return;
|
|
2857
2962
|
try {
|
|
2858
2963
|
if (this.player) {
|
|
@@ -2889,27 +2994,29 @@ var HlsPlayer = class extends import_react2.Component {
|
|
|
2889
2994
|
if (this.props.adFailsafeTimeoutMs !== void 0)
|
|
2890
2995
|
config.adFailsafeTimeoutMs = this.props.adFailsafeTimeoutMs;
|
|
2891
2996
|
this.player = new StormcloudVideoPlayer(config);
|
|
2892
|
-
this.props.onMount
|
|
2997
|
+
(_b = (_a = this.props).onMount) == null ? void 0 : _b.call(_a, this);
|
|
2893
2998
|
await this.player.load();
|
|
2894
2999
|
if (this.mounted) {
|
|
2895
|
-
this.props.onReady
|
|
3000
|
+
(_d = (_c = this.props).onReady) == null ? void 0 : _d.call(_c);
|
|
2896
3001
|
}
|
|
2897
3002
|
} catch (error) {
|
|
2898
3003
|
if (this.mounted) {
|
|
2899
|
-
this.props.onError
|
|
3004
|
+
(_f = (_e = this.props).onError) == null ? void 0 : _f.call(_e, error);
|
|
2900
3005
|
}
|
|
2901
3006
|
}
|
|
2902
3007
|
};
|
|
2903
3008
|
this.play = () => {
|
|
3009
|
+
var _a, _b;
|
|
2904
3010
|
if (this.props.videoElement) {
|
|
2905
3011
|
this.props.videoElement.play();
|
|
2906
|
-
this.props.onPlay
|
|
3012
|
+
(_b = (_a = this.props).onPlay) == null ? void 0 : _b.call(_a);
|
|
2907
3013
|
}
|
|
2908
3014
|
};
|
|
2909
3015
|
this.pause = () => {
|
|
3016
|
+
var _a, _b;
|
|
2910
3017
|
if (this.props.videoElement) {
|
|
2911
3018
|
this.props.videoElement.pause();
|
|
2912
|
-
this.props.onPause
|
|
3019
|
+
(_b = (_a = this.props).onPause) == null ? void 0 : _b.call(_a);
|
|
2913
3020
|
}
|
|
2914
3021
|
};
|
|
2915
3022
|
this.stop = () => {
|
|
@@ -3004,37 +3111,44 @@ var FilePlayer = class extends import_react3.Component {
|
|
|
3004
3111
|
this.mounted = false;
|
|
3005
3112
|
this.ready = false;
|
|
3006
3113
|
this.load = () => {
|
|
3114
|
+
var _a, _b;
|
|
3007
3115
|
if (!this.props.videoElement || !this.props.src) return;
|
|
3008
3116
|
const video = this.props.videoElement;
|
|
3009
3117
|
const handleLoadedMetadata = () => {
|
|
3118
|
+
var _a2, _b2;
|
|
3010
3119
|
if (this.mounted && !this.ready) {
|
|
3011
3120
|
this.ready = true;
|
|
3012
|
-
this.props.onReady
|
|
3121
|
+
(_b2 = (_a2 = this.props).onReady) == null ? void 0 : _b2.call(_a2);
|
|
3013
3122
|
}
|
|
3014
3123
|
};
|
|
3015
3124
|
const handlePlay = () => {
|
|
3125
|
+
var _a2, _b2;
|
|
3016
3126
|
if (this.mounted) {
|
|
3017
|
-
this.props.onPlay
|
|
3127
|
+
(_b2 = (_a2 = this.props).onPlay) == null ? void 0 : _b2.call(_a2);
|
|
3018
3128
|
}
|
|
3019
3129
|
};
|
|
3020
3130
|
const handlePause = () => {
|
|
3131
|
+
var _a2, _b2;
|
|
3021
3132
|
if (this.mounted) {
|
|
3022
|
-
this.props.onPause
|
|
3133
|
+
(_b2 = (_a2 = this.props).onPause) == null ? void 0 : _b2.call(_a2);
|
|
3023
3134
|
}
|
|
3024
3135
|
};
|
|
3025
3136
|
const handleEnded = () => {
|
|
3137
|
+
var _a2, _b2;
|
|
3026
3138
|
if (this.mounted) {
|
|
3027
|
-
this.props.onEnded
|
|
3139
|
+
(_b2 = (_a2 = this.props).onEnded) == null ? void 0 : _b2.call(_a2);
|
|
3028
3140
|
}
|
|
3029
3141
|
};
|
|
3030
3142
|
const handleError = (error) => {
|
|
3143
|
+
var _a2, _b2;
|
|
3031
3144
|
if (this.mounted) {
|
|
3032
|
-
this.props.onError
|
|
3145
|
+
(_b2 = (_a2 = this.props).onError) == null ? void 0 : _b2.call(_a2, error);
|
|
3033
3146
|
}
|
|
3034
3147
|
};
|
|
3035
3148
|
const handleLoadedData = () => {
|
|
3149
|
+
var _a2, _b2;
|
|
3036
3150
|
if (this.mounted) {
|
|
3037
|
-
this.props.onLoaded
|
|
3151
|
+
(_b2 = (_a2 = this.props).onLoaded) == null ? void 0 : _b2.call(_a2);
|
|
3038
3152
|
}
|
|
3039
3153
|
};
|
|
3040
3154
|
video.addEventListener("loadedmetadata", handleLoadedMetadata);
|
|
@@ -3053,7 +3167,7 @@ var FilePlayer = class extends import_react3.Component {
|
|
|
3053
3167
|
if (this.props.preload !== void 0)
|
|
3054
3168
|
video.preload = this.props.preload;
|
|
3055
3169
|
if (this.props.poster !== void 0) video.poster = this.props.poster;
|
|
3056
|
-
this.props.onMount
|
|
3170
|
+
(_b = (_a = this.props).onMount) == null ? void 0 : _b.call(_a, this);
|
|
3057
3171
|
return () => {
|
|
3058
3172
|
video.removeEventListener("loadedmetadata", handleLoadedMetadata);
|
|
3059
3173
|
video.removeEventListener("play", handlePlay);
|