stormcloud-video-player 0.6.0 → 0.6.1

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.
Files changed (19) hide show
  1. package/dist/stormcloud-vp.min.js +1 -1
  2. package/lib/index.cjs +305 -158
  3. package/lib/index.cjs.map +1 -1
  4. package/lib/index.d.cts +2 -0
  5. package/lib/index.d.ts +2 -0
  6. package/lib/index.js +305 -158
  7. package/lib/index.js.map +1 -1
  8. package/lib/player/StormcloudVideoPlayer.cjs +305 -158
  9. package/lib/player/StormcloudVideoPlayer.cjs.map +1 -1
  10. package/lib/players/HlsPlayer.cjs +305 -158
  11. package/lib/players/HlsPlayer.cjs.map +1 -1
  12. package/lib/players/index.cjs +305 -158
  13. package/lib/players/index.cjs.map +1 -1
  14. package/lib/sdk/vastAdLayer.cjs +253 -128
  15. package/lib/sdk/vastAdLayer.cjs.map +1 -1
  16. package/lib/sdk/vastAdLayer.d.cts +2 -0
  17. package/lib/ui/StormcloudVideoPlayer.cjs +305 -158
  18. package/lib/ui/StormcloudVideoPlayer.cjs.map +1 -1
  19. package/package.json +1 -1
package/lib/sdk/vastAdLayer.cjs CHANGED
@@ -599,14 +599,16 @@ function resolveBidToVastAd(winner, logPrefix) {
599
599
  return Promise.resolve(null);
600
600
  }
601
601
  function createVastAdLayer(contentVideo, options) {
602
- var _ref, _ref1;
602
+ var _ref, _ref1, _ref2, _ref3;
603
603
  var adPlaying = false;
604
604
  var originalMutedState = false;
605
605
  var originalVolume = Math.max(0, Math.min(1, contentVideo.volume || 1));
606
606
  var listeners = /* @__PURE__ */ new Map();
607
607
  var mainHlsInstance = options === null || options === void 0 ? void 0 : options.mainHlsInstance;
608
608
  var continueLiveStreamDuringAds = (_ref = options === null || options === void 0 ? void 0 : options.continueLiveStreamDuringAds) !== null && _ref !== void 0 ? _ref : false;
609
- var debug = (_ref1 = options === null || options === void 0 ? void 0 : options.debug) !== null && _ref1 !== void 0 ? _ref1 : false;
609
+ var smartTVMode = (_ref1 = options === null || options === void 0 ? void 0 : options.smartTVMode) !== null && _ref1 !== void 0 ? _ref1 : false;
610
+ var singleElementMode = (_ref2 = options === null || options === void 0 ? void 0 : options.singleElementMode) !== null && _ref2 !== void 0 ? _ref2 : false;
611
+ var debug = (_ref3 = options === null || options === void 0 ? void 0 : options.debug) !== null && _ref3 !== void 0 ? _ref3 : false;
610
612
  var adVideoElement;
611
613
  var adHls;
612
614
  var adContainerEl;
@@ -615,6 +617,7 @@ function createVastAdLayer(contentVideo, options) {
615
617
  var destroyed = false;
616
618
  var tornDown = false;
617
619
  var trackingFired = createEmptyTrackingState();
620
+ var currentAdEventHandlers;
618
621
  var preloadSlots = /* @__PURE__ */ new Map();
619
622
  function emit(event, payload) {
620
623
  var set = listeners.get(event);
@@ -717,63 +720,86 @@ function createVastAdLayer(contentVideo, options) {
717
720
  video.volume = 1;
718
721
  return video;
719
722
  }
723
+ function removeAdEventListeners() {
724
+ if (!currentAdEventHandlers || !adVideoElement) return;
725
+ var el = adVideoElement;
726
+ el.removeEventListener("timeupdate", currentAdEventHandlers.timeupdate);
727
+ el.removeEventListener("playing", currentAdEventHandlers.playing);
728
+ el.removeEventListener("ended", currentAdEventHandlers.ended);
729
+ el.removeEventListener("error", currentAdEventHandlers.error);
730
+ el.removeEventListener("volumechange", currentAdEventHandlers.volumechange);
731
+ el.removeEventListener("pause", currentAdEventHandlers.pause);
732
+ el.removeEventListener("play", currentAdEventHandlers.play);
733
+ currentAdEventHandlers = void 0;
734
+ }
720
735
  function setupAdEventListeners() {
721
736
  if (!adVideoElement) return;
722
- adVideoElement.addEventListener("timeupdate", function() {
723
- var ad = currentAd;
724
- if (!ad || !adVideoElement) return;
725
- var progress = adVideoElement.currentTime / ad.duration;
726
- if (progress >= 0.25 && !trackingFired.firstQuartile) {
727
- trackingFired.firstQuartile = true;
728
- fireTrackingPixels2(ad.trackingUrls.firstQuartile);
729
- }
730
- if (progress >= 0.5 && !trackingFired.midpoint) {
731
- trackingFired.midpoint = true;
732
- fireTrackingPixels2(ad.trackingUrls.midpoint);
733
- }
734
- if (progress >= 0.75 && !trackingFired.thirdQuartile) {
735
- trackingFired.thirdQuartile = true;
736
- fireTrackingPixels2(ad.trackingUrls.thirdQuartile);
737
- }
738
- });
739
- adVideoElement.addEventListener("playing", function() {
740
- var ad = currentAd;
741
- if (!ad || trackingFired.start) return;
742
- trackingFired.start = true;
743
- fireTrackingPixels2(ad.trackingUrls.start);
744
- if (debug) console.log("".concat(LOG, " Ad started playing"));
745
- });
746
- adVideoElement.addEventListener("ended", function() {
747
- if (tornDown || !currentAd || trackingFired.complete) return;
748
- trackingFired.complete = true;
749
- fireTrackingPixels2(currentAd.trackingUrls.complete);
750
- if (debug) console.log("".concat(LOG, " Ad completed"));
751
- handleAdComplete();
752
- });
753
- adVideoElement.addEventListener("error", function(e) {
754
- if (tornDown) return;
755
- console.error("".concat(LOG, " Ad video error:"), e);
756
- if (currentAd) fireTrackingPixels2(currentAd.trackingUrls.error);
757
- handleAdError();
758
- });
759
- adVideoElement.addEventListener("volumechange", function() {
760
- if (!currentAd || !adVideoElement) return;
761
- if (adVideoElement.muted) {
762
- fireTrackingPixels2(currentAd.trackingUrls.mute);
763
- } else {
764
- fireTrackingPixels2(currentAd.trackingUrls.unmute);
765
- }
766
- });
767
- adVideoElement.addEventListener("pause", function() {
768
- if (currentAd && adVideoElement && !adVideoElement.ended) {
769
- fireTrackingPixels2(currentAd.trackingUrls.pause);
770
- }
771
- });
772
- adVideoElement.addEventListener("play", function() {
773
- if (currentAd && adVideoElement && adVideoElement.currentTime > 0) {
774
- fireTrackingPixels2(currentAd.trackingUrls.resume);
737
+ removeAdEventListeners();
738
+ var handlers = {
739
+ timeupdate: function timeupdate() {
740
+ var ad = currentAd;
741
+ if (!ad || !adVideoElement) return;
742
+ var progress = adVideoElement.currentTime / ad.duration;
743
+ if (progress >= 0.25 && !trackingFired.firstQuartile) {
744
+ trackingFired.firstQuartile = true;
745
+ fireTrackingPixels2(ad.trackingUrls.firstQuartile);
746
+ }
747
+ if (progress >= 0.5 && !trackingFired.midpoint) {
748
+ trackingFired.midpoint = true;
749
+ fireTrackingPixels2(ad.trackingUrls.midpoint);
750
+ }
751
+ if (progress >= 0.75 && !trackingFired.thirdQuartile) {
752
+ trackingFired.thirdQuartile = true;
753
+ fireTrackingPixels2(ad.trackingUrls.thirdQuartile);
754
+ }
755
+ },
756
+ playing: function playing() {
757
+ var ad = currentAd;
758
+ if (!ad || trackingFired.start) return;
759
+ trackingFired.start = true;
760
+ fireTrackingPixels2(ad.trackingUrls.start);
761
+ if (debug) console.log("".concat(LOG, " Ad started playing"));
762
+ },
763
+ ended: function ended() {
764
+ if (tornDown || !currentAd || trackingFired.complete) return;
765
+ trackingFired.complete = true;
766
+ fireTrackingPixels2(currentAd.trackingUrls.complete);
767
+ if (debug) console.log("".concat(LOG, " Ad completed"));
768
+ handleAdComplete();
769
+ },
770
+ error: function error(e) {
771
+ if (tornDown) return;
772
+ console.error("".concat(LOG, " Ad video error:"), e);
773
+ if (currentAd) fireTrackingPixels2(currentAd.trackingUrls.error);
774
+ handleAdError();
775
+ },
776
+ volumechange: function volumechange() {
777
+ if (!currentAd || !adVideoElement) return;
778
+ if (adVideoElement.muted) {
779
+ fireTrackingPixels2(currentAd.trackingUrls.mute);
780
+ } else {
781
+ fireTrackingPixels2(currentAd.trackingUrls.unmute);
782
+ }
783
+ },
784
+ pause: function pause() {
785
+ if (currentAd && adVideoElement && !adVideoElement.ended) {
786
+ fireTrackingPixels2(currentAd.trackingUrls.pause);
787
+ }
788
+ },
789
+ play: function play() {
790
+ if (currentAd && adVideoElement && adVideoElement.currentTime > 0) {
791
+ fireTrackingPixels2(currentAd.trackingUrls.resume);
792
+ }
775
793
  }
776
- });
794
+ };
795
+ adVideoElement.addEventListener("timeupdate", handlers.timeupdate);
796
+ adVideoElement.addEventListener("playing", handlers.playing);
797
+ adVideoElement.addEventListener("ended", handlers.ended);
798
+ adVideoElement.addEventListener("error", handlers.error);
799
+ adVideoElement.addEventListener("volumechange", handlers.volumechange);
800
+ adVideoElement.addEventListener("pause", handlers.pause);
801
+ adVideoElement.addEventListener("play", handlers.play);
802
+ currentAdEventHandlers = handlers;
777
803
  }
778
804
  function setAdPlayingFlag(isPlaying) {
779
805
  if (isPlaying) {
@@ -796,6 +822,7 @@ function createVastAdLayer(contentVideo, options) {
796
822
  }
797
823
  function handleAdError() {
798
824
  if (tornDown) return;
825
+ if (!adPlaying) return;
799
826
  if (debug) console.log("".concat(LOG, " Handling ad error"));
800
827
  adPlaying = false;
801
828
  setAdPlayingFlag(false);
@@ -806,14 +833,19 @@ function createVastAdLayer(contentVideo, options) {
806
833
  emit("ad_error");
807
834
  }
808
835
  function teardownCurrentPlayback() {
836
+ removeAdEventListeners();
809
837
  if (adHls) {
810
838
  adHls.destroy();
811
839
  adHls = void 0;
812
840
  }
813
841
  if (adVideoElement) {
814
- adVideoElement.pause();
815
- adVideoElement.removeAttribute("src");
816
- adVideoElement.load();
842
+ if (singleElementMode && adVideoElement === contentVideo) {
843
+ contentVideo.pause();
844
+ } else {
845
+ adVideoElement.pause();
846
+ adVideoElement.removeAttribute("src");
847
+ adVideoElement.load();
848
+ }
817
849
  }
818
850
  }
819
851
  function startNativePlayback(mediaFile) {
@@ -846,8 +878,17 @@ function createVastAdLayer(contentVideo, options) {
846
878
  handleAdError();
847
879
  });
848
880
  });
881
+ var nonFatalNetworkErrors = 0;
849
882
  adHls.on(import_hls.default.Events.ERROR, function(_event, data) {
850
- if (data.fatal) handleAdError();
883
+ if (data.fatal) {
884
+ handleAdError();
885
+ } else if (data.type === import_hls.default.ErrorTypes.NETWORK_ERROR) {
886
+ nonFatalNetworkErrors++;
887
+ if (nonFatalNetworkErrors >= 3) {
888
+ if (debug) console.warn("".concat(LOG, " Too many non-fatal HLS network errors (").concat(nonFatalNetworkErrors, "), treating as fatal"));
889
+ handleAdError();
890
+ }
891
+ }
851
892
  });
852
893
  } else if (adVideoElement.canPlayType("application/vnd.apple.mpegurl")) {
853
894
  adVideoElement.src = mediaFile.url;
@@ -870,7 +911,7 @@ function createVastAdLayer(contentVideo, options) {
870
911
  }
871
912
  function playAd(bids) {
872
913
  return _async_to_generator(function() {
873
- var winner, ad, _contentVideo_parentElement, container, contentVolume, adVolume, mediaFile;
914
+ var winner, ad, contentVolume, _contentVideo_parentElement, container, adVolume, mediaFile;
874
915
  return _ts_generator(this, function(_state) {
875
916
  switch(_state.label){
876
917
  case 0:
@@ -912,32 +953,40 @@ function createVastAdLayer(contentVideo, options) {
912
953
  trackingFired = _object_spread({}, createEmptyTrackingState());
913
954
  fireTrackingPixels2(ad.trackingUrls.impression);
914
955
  trackingFired.impression = true;
915
- if (!adContainerEl) {
916
- ;
917
- container = document.createElement("div");
918
- container.style.position = "absolute";
919
- container.style.left = "0";
920
- container.style.top = "0";
921
- container.style.right = "0";
922
- container.style.bottom = "0";
923
- container.style.display = "none";
924
- container.style.alignItems = "center";
925
- container.style.justifyContent = "center";
926
- container.style.pointerEvents = "none";
927
- container.style.zIndex = "10";
928
- container.style.backgroundColor = "#000";
929
- (_contentVideo_parentElement = contentVideo.parentElement) === null || _contentVideo_parentElement === void 0 ? void 0 : _contentVideo_parentElement.appendChild(container);
930
- adContainerEl = container;
931
- }
932
- if (!adVideoElement) {
933
- adVideoElement = createAdVideoElement();
934
- adContainerEl.appendChild(adVideoElement);
956
+ contentVolume = contentVideo.volume;
957
+ originalVolume = Math.max(0, Math.min(1, contentVolume || originalVolume));
958
+ if (singleElementMode) {
959
+ mainHlsInstance === null || mainHlsInstance === void 0 ? void 0 : mainHlsInstance.detachMedia();
960
+ teardownCurrentPlayback();
961
+ adVideoElement = contentVideo;
962
+ adHls = void 0;
935
963
  setupAdEventListeners();
936
964
  } else {
937
- teardownCurrentPlayback();
965
+ if (!adContainerEl) {
966
+ ;
967
+ container = document.createElement("div");
968
+ container.style.position = "absolute";
969
+ container.style.left = "0";
970
+ container.style.top = "0";
971
+ container.style.right = "0";
972
+ container.style.bottom = "0";
973
+ container.style.display = "none";
974
+ container.style.alignItems = "center";
975
+ container.style.justifyContent = "center";
976
+ container.style.pointerEvents = "none";
977
+ container.style.zIndex = "10";
978
+ container.style.backgroundColor = "#000";
979
+ (_contentVideo_parentElement = contentVideo.parentElement) === null || _contentVideo_parentElement === void 0 ? void 0 : _contentVideo_parentElement.appendChild(container);
980
+ adContainerEl = container;
981
+ }
982
+ if (!adVideoElement) {
983
+ adVideoElement = createAdVideoElement();
984
+ adContainerEl.appendChild(adVideoElement);
985
+ setupAdEventListeners();
986
+ } else {
987
+ teardownCurrentPlayback();
988
+ }
938
989
  }
939
- contentVolume = contentVideo.volume;
940
- originalVolume = Math.max(0, Math.min(1, contentVolume || originalVolume));
941
990
  if (!continueLiveStreamDuringAds) {
942
991
  contentVideo.pause();
943
992
  }
@@ -948,7 +997,7 @@ function createVastAdLayer(contentVideo, options) {
948
997
  adVolume = originalMutedState ? 1 : originalVolume;
949
998
  adVideoElement.volume = Math.max(0, Math.min(1, adVolume));
950
999
  adVideoElement.muted = false;
951
- if (adContainerEl) {
1000
+ if (!singleElementMode && adContainerEl) {
952
1001
  adContainerEl.style.display = "flex";
953
1002
  adContainerEl.style.pointerEvents = "auto";
954
1003
  }
@@ -985,7 +1034,7 @@ function createVastAdLayer(contentVideo, options) {
985
1034
  }
986
1035
  function preloadAd(bids, token) {
987
1036
  return _async_to_generator(function() {
988
- var winner, ad, mediaFile, videoEl, container, hls, slot, slot1;
1037
+ var winner, ad, mediaFile, slot, videoEl, container, hls, slot1, slot2;
989
1038
  return _ts_generator(this, function(_state) {
990
1039
  switch(_state.label){
991
1040
  case 0:
@@ -1010,6 +1059,20 @@ function createVastAdLayer(contentVideo, options) {
1010
1059
  if (!mediaFile) return [
1011
1060
  2
1012
1061
  ];
1062
+ if (smartTVMode || singleElementMode) {
1063
+ slot = {
1064
+ bids: bids,
1065
+ ad: ad,
1066
+ mediaFile: mediaFile,
1067
+ videoEl: null,
1068
+ ready: true
1069
+ };
1070
+ preloadSlots.set(token, slot);
1071
+ if (debug) console.log("".concat(LOG, " [preload] Metadata-only preload (smartTV/singleElement), token=").concat(token, ", url=").concat(mediaFile.url));
1072
+ return [
1073
+ 2
1074
+ ];
1075
+ }
1013
1076
  videoEl = createAdVideoElement();
1014
1077
  videoEl.style.visibility = "hidden";
1015
1078
  videoEl.style.pointerEvents = "none";
@@ -1023,7 +1086,7 @@ function createVastAdLayer(contentVideo, options) {
1023
1086
  });
1024
1087
  hls.loadSource(mediaFile.url);
1025
1088
  hls.attachMedia(videoEl);
1026
- slot = {
1089
+ slot1 = {
1027
1090
  bids: bids,
1028
1091
  ad: ad,
1029
1092
  mediaFile: mediaFile,
@@ -1031,7 +1094,7 @@ function createVastAdLayer(contentVideo, options) {
1031
1094
  hlsInstance: hls,
1032
1095
  ready: false
1033
1096
  };
1034
- preloadSlots.set(token, slot);
1097
+ preloadSlots.set(token, slot1);
1035
1098
  hls.on(import_hls.default.Events.MANIFEST_PARSED, function() {
1036
1099
  var s = preloadSlots.get(token);
1037
1100
  if (s) s.ready = true;
@@ -1048,14 +1111,14 @@ function createVastAdLayer(contentVideo, options) {
1048
1111
  } else {
1049
1112
  videoEl.src = mediaFile.url;
1050
1113
  videoEl.load();
1051
- slot1 = {
1114
+ slot2 = {
1052
1115
  bids: bids,
1053
1116
  ad: ad,
1054
1117
  mediaFile: mediaFile,
1055
1118
  videoEl: videoEl,
1056
1119
  ready: false
1057
1120
  };
1058
- preloadSlots.set(token, slot1);
1121
+ preloadSlots.set(token, slot2);
1059
1122
  videoEl.addEventListener("canplay", function() {
1060
1123
  var s = preloadSlots.get(token);
1061
1124
  if (s) s.ready = true;
@@ -1074,7 +1137,7 @@ function createVastAdLayer(contentVideo, options) {
1074
1137
  }
1075
1138
  function playPreloaded(token) {
1076
1139
  return _async_to_generator(function() {
1077
- var slot, contentVolume, adVolume, container;
1140
+ var slot, contentVolume, adVolume2, videoEl, container2, adVolume21, adVolume, container;
1078
1141
  return _ts_generator(this, function(_state) {
1079
1142
  if (destroyed) return [
1080
1143
  2,
@@ -1089,6 +1152,68 @@ function createVastAdLayer(contentVideo, options) {
1089
1152
  }
1090
1153
  preloadSlots.delete(token);
1091
1154
  if (debug) console.log("".concat(LOG, " [preload] Playing preloaded ad, token=").concat(token, ", ready=").concat(slot.ready));
1155
+ contentVolume = contentVideo.volume;
1156
+ originalVolume = Math.max(0, Math.min(1, contentVolume || originalVolume));
1157
+ sessionId = generateSessionId();
1158
+ currentAd = slot.ad;
1159
+ trackingFired = _object_spread({}, createEmptyTrackingState());
1160
+ fireTrackingPixels2(slot.ad.trackingUrls.impression);
1161
+ trackingFired.impression = true;
1162
+ if (singleElementMode) {
1163
+ mainHlsInstance === null || mainHlsInstance === void 0 ? void 0 : mainHlsInstance.detachMedia();
1164
+ teardownCurrentPlayback();
1165
+ adVideoElement = contentVideo;
1166
+ adHls = void 0;
1167
+ setupAdEventListeners();
1168
+ if (!continueLiveStreamDuringAds) {
1169
+ contentVideo.pause();
1170
+ }
1171
+ contentVideo.muted = true;
1172
+ contentVideo.volume = 0;
1173
+ adPlaying = true;
1174
+ setAdPlayingFlag(true);
1175
+ adVolume2 = originalMutedState ? 1 : originalVolume;
1176
+ contentVideo.volume = Math.max(0, Math.min(1, adVolume2));
1177
+ contentVideo.muted = false;
1178
+ emit("content_pause");
1179
+ if (debug) console.log("".concat(LOG, " [preload] singleElementMode: attaching ad to contentVideo, url=").concat(slot.mediaFile.url));
1180
+ startPlayback(slot.mediaFile);
1181
+ return [
1182
+ 2
1183
+ ];
1184
+ }
1185
+ if (smartTVMode && !slot.videoEl) {
1186
+ teardownCurrentPlayback();
1187
+ if (adVideoElement) {
1188
+ adVideoElement.remove();
1189
+ adVideoElement = void 0;
1190
+ }
1191
+ videoEl = createAdVideoElement();
1192
+ videoEl.style.visibility = "visible";
1193
+ videoEl.style.pointerEvents = "none";
1194
+ container2 = ensureAdContainer();
1195
+ container2.appendChild(videoEl);
1196
+ adVideoElement = videoEl;
1197
+ setupAdEventListeners();
1198
+ if (!continueLiveStreamDuringAds) {
1199
+ contentVideo.pause();
1200
+ }
1201
+ contentVideo.muted = true;
1202
+ contentVideo.volume = 0;
1203
+ adPlaying = true;
1204
+ setAdPlayingFlag(true);
1205
+ adVolume21 = originalMutedState ? 1 : originalVolume;
1206
+ adVideoElement.volume = Math.max(0, Math.min(1, adVolume21));
1207
+ adVideoElement.muted = false;
1208
+ container2.style.display = "flex";
1209
+ container2.style.pointerEvents = "auto";
1210
+ emit("content_pause");
1211
+ if (debug) console.log("".concat(LOG, " [preload] smartTVMode deferred: creating video element and loading, url=").concat(slot.mediaFile.url));
1212
+ startPlayback(slot.mediaFile);
1213
+ return [
1214
+ 2
1215
+ ];
1216
+ }
1092
1217
  teardownCurrentPlayback();
1093
1218
  if (adVideoElement && adVideoElement !== slot.videoEl) {
1094
1219
  adVideoElement.remove();
@@ -1098,13 +1223,6 @@ function createVastAdLayer(contentVideo, options) {
1098
1223
  adVideoElement = slot.videoEl;
1099
1224
  adHls = slot.hlsInstance;
1100
1225
  setupAdEventListeners();
1101
- sessionId = generateSessionId();
1102
- currentAd = slot.ad;
1103
- trackingFired = _object_spread({}, createEmptyTrackingState());
1104
- fireTrackingPixels2(slot.ad.trackingUrls.impression);
1105
- trackingFired.impression = true;
1106
- contentVolume = contentVideo.volume;
1107
- originalVolume = Math.max(0, Math.min(1, contentVolume || originalVolume));
1108
1226
  if (!continueLiveStreamDuringAds) {
1109
1227
  contentVideo.pause();
1110
1228
  }
@@ -1119,17 +1237,10 @@ function createVastAdLayer(contentVideo, options) {
1119
1237
  container.style.display = "flex";
1120
1238
  container.style.pointerEvents = "auto";
1121
1239
  emit("content_pause");
1122
- if (slot.hlsInstance) {
1123
- adVideoElement.play().catch(function(error) {
1124
- console.error("".concat(LOG, " [preload] Error playing preloaded HLS ad:"), error);
1125
- handleAdError();
1126
- });
1127
- } else {
1128
- adVideoElement.play().catch(function(error) {
1129
- console.error("".concat(LOG, " [preload] Error playing preloaded ad:"), error);
1130
- handleAdError();
1131
- });
1132
- }
1240
+ adVideoElement.play().catch(function(error) {
1241
+ console.error("".concat(LOG, " [preload] Error playing preloaded ad:"), error);
1242
+ handleAdError();
1243
+ });
1133
1244
  return [
1134
1245
  2
1135
1246
  ];
@@ -1143,10 +1254,12 @@ function createVastAdLayer(contentVideo, options) {
1143
1254
  if (slot.hlsInstance) {
1144
1255
  slot.hlsInstance.destroy();
1145
1256
  }
1146
- slot.videoEl.pause();
1147
- slot.videoEl.removeAttribute("src");
1148
- slot.videoEl.load();
1149
- slot.videoEl.remove();
1257
+ if (slot.videoEl) {
1258
+ slot.videoEl.pause();
1259
+ slot.videoEl.removeAttribute("src");
1260
+ slot.videoEl.load();
1261
+ slot.videoEl.remove();
1262
+ }
1150
1263
  if (debug) console.log("".concat(LOG, " [preload] Cancelled and cleaned up token=").concat(token));
1151
1264
  }
1152
1265
  return {
@@ -1194,20 +1307,27 @@ function createVastAdLayer(contentVideo, options) {
1194
1307
  setAdPlayingFlag(false);
1195
1308
  contentVideo.muted = originalMutedState;
1196
1309
  contentVideo.volume = originalMutedState ? 0 : originalVolume;
1197
- if (adContainerEl) {
1198
- adContainerEl.style.display = "none";
1199
- adContainerEl.style.pointerEvents = "none";
1200
- }
1201
1310
  contentVideo.style.visibility = "visible";
1202
1311
  contentVideo.style.opacity = "1";
1203
- if (continueLiveStreamDuringAds) {
1204
- contentVideo.play().catch(function() {});
1205
- }
1206
- teardownCurrentPlayback();
1207
- if (adVideoElement) {
1208
- adVideoElement.pause();
1209
- adVideoElement.removeAttribute("src");
1210
- adVideoElement.load();
1312
+ if (singleElementMode) {
1313
+ teardownCurrentPlayback();
1314
+ contentVideo.removeAttribute("src");
1315
+ contentVideo.load();
1316
+ adVideoElement = void 0;
1317
+ } else {
1318
+ if (adContainerEl) {
1319
+ adContainerEl.style.display = "none";
1320
+ adContainerEl.style.pointerEvents = "none";
1321
+ }
1322
+ if (continueLiveStreamDuringAds) {
1323
+ contentVideo.play().catch(function() {});
1324
+ }
1325
+ teardownCurrentPlayback();
1326
+ if (adVideoElement) {
1327
+ adVideoElement.pause();
1328
+ adVideoElement.removeAttribute("src");
1329
+ adVideoElement.load();
1330
+ }
1211
1331
  }
1212
1332
  currentAd = void 0;
1213
1333
  tornDown = false;
@@ -1247,9 +1367,14 @@ function createVastAdLayer(contentVideo, options) {
1247
1367
  }
1248
1368
  teardownCurrentPlayback();
1249
1369
  if (adVideoElement) {
1250
- adVideoElement.pause();
1251
- adVideoElement.removeAttribute("src");
1252
- adVideoElement.remove();
1370
+ if (singleElementMode && adVideoElement === contentVideo) {
1371
+ contentVideo.removeAttribute("src");
1372
+ contentVideo.load();
1373
+ } else {
1374
+ adVideoElement.pause();
1375
+ adVideoElement.removeAttribute("src");
1376
+ adVideoElement.remove();
1377
+ }
1253
1378
  adVideoElement = void 0;
1254
1379
  }
1255
1380
  if (adContainerEl === null || adContainerEl === void 0 ? void 0 : adContainerEl.parentElement) {