stormcloud-video-player 0.3.56 → 0.3.58

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 (22) hide show
  1. package/README.md +243 -10
  2. package/dist/stormcloud-vp.min.js +1 -1
  3. package/lib/index.cjs +147 -58
  4. package/lib/index.cjs.map +1 -1
  5. package/lib/index.d.cts +1 -0
  6. package/lib/index.d.ts +1 -0
  7. package/lib/index.js +148 -59
  8. package/lib/index.js.map +1 -1
  9. package/lib/player/StormcloudVideoPlayer.cjs +39 -35
  10. package/lib/player/StormcloudVideoPlayer.cjs.map +1 -1
  11. package/lib/player/StormcloudVideoPlayer.d.cts +1 -0
  12. package/lib/players/HlsPlayer.cjs +39 -35
  13. package/lib/players/HlsPlayer.cjs.map +1 -1
  14. package/lib/players/index.cjs +39 -35
  15. package/lib/players/index.cjs.map +1 -1
  16. package/lib/sdk/hlsAdPlayer.cjs +1 -1
  17. package/lib/sdk/hlsAdPlayer.cjs.map +1 -1
  18. package/lib/sdk/ima.cjs +3 -3
  19. package/lib/sdk/ima.cjs.map +1 -1
  20. package/lib/ui/StormcloudVideoPlayer.cjs +147 -58
  21. package/lib/ui/StormcloudVideoPlayer.cjs.map +1 -1
  22. package/package.json +1 -1
package/lib/player/StormcloudVideoPlayer.cjs CHANGED
@@ -654,7 +654,7 @@ function createImaController(video, options) {
654
654
  adVideo.style.height = "100%";
655
655
  adVideo.style.objectFit = "contain";
656
656
  adVideo.style.backgroundColor = "transparent";
657
- adVideo.style.zIndex = "15";
657
+ adVideo.style.zIndex = "2";
658
658
  adVideo.playsInline = true;
659
659
  adVideo.volume = originalVolume;
660
660
  adVideo.muted = originalMutedState;
@@ -947,7 +947,7 @@ function createImaController(video, options) {
947
947
  container.style.alignItems = "center";
948
948
  container.style.justifyContent = "center";
949
949
  container.style.pointerEvents = "none";
950
- container.style.zIndex = "10";
950
+ container.style.zIndex = "30";
951
951
  container.style.backgroundColor = "#000";
952
952
  container.style.transition = "opacity 0.3s ease-in-out";
953
953
  container.style.opacity = "0";
@@ -1062,7 +1062,7 @@ function createImaController(video, options) {
1062
1062
  container.style.alignItems = "center";
1063
1063
  container.style.justifyContent = "center";
1064
1064
  container.style.pointerEvents = "none";
1065
- container.style.zIndex = "10";
1065
+ container.style.zIndex = "30";
1066
1066
  container.style.backgroundColor = "transparent";
1067
1067
  container.style.transition = "opacity 0.3s ease-in-out, background-color 0.3s ease-in-out";
1068
1068
  container.style.opacity = "0";
@@ -1977,7 +1977,7 @@ function createHlsAdPlayer(contentVideo, options) {
1977
1977
  container.style.alignItems = "center";
1978
1978
  container.style.justifyContent = "center";
1979
1979
  container.style.pointerEvents = "none";
1980
- container.style.zIndex = "10";
1980
+ container.style.zIndex = "30";
1981
1981
  container.style.backgroundColor = "#000";
1982
1982
  (_contentVideo_parentElement = contentVideo.parentElement) === null || _contentVideo_parentElement === void 0 ? void 0 : _contentVideo_parentElement.appendChild(container);
1983
1983
  adContainerEl = container;
@@ -3757,13 +3757,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
3757
3757
  _this.activeAdRequestToken = null;
3758
3758
  _this.showAds = true;
3759
3759
  _this.resetGamNoFillCounter();
3760
- if (_this.inAdBreak && _this.expectedAdBreakDurationMs != null) {
3761
- if (_this.adStopTimerId == null) {
3762
- _this.currentAdBreakStartWallClockMs = Date.now();
3763
- _this.scheduleAdStopCountdown(_this.expectedAdBreakDurationMs);
3764
- if (_this.config.debugAdTiming) {
3765
- console.log("[StormcloudVideoPlayer] Starting ad break timer on content_pause (first ad starting)");
3766
- }
3760
+ if (_this.inAdBreak && _this.expectedAdBreakDurationMs != null && _this.adStopTimerId == null) {
3761
+ _this.scheduleAdStopCountdown(_this.getRemainingAdMs());
3762
+ if (_this.config.debugAdTiming) {
3763
+ console.log("[StormcloudVideoPlayer] Starting ad break timer on content_pause (first ad starting)");
3767
3764
  }
3768
3765
  }
3769
3766
  var currentMuted = _this.video.muted;
@@ -3826,6 +3823,8 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
3826
3823
  this.ima.showPlaceholder();
3827
3824
  this.isShowingPlaceholder = true;
3828
3825
  }
3826
+ var preservedMutedState = this.ima.getOriginalMutedState();
3827
+ var preservedVolumeState = this.ima.getOriginalVolume();
3829
3828
  if (this.ima) {
3830
3829
  try {
3831
3830
  this.ima.destroy();
@@ -3840,7 +3839,7 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
3840
3839
  var continueLiveStreamDuringAds = this.shouldContinueLiveStreamDuringAds();
3841
3840
  this.ima = this.createAdPlayer(continueLiveStreamDuringAds);
3842
3841
  this.ima.initialize();
3843
- this.ima.updateOriginalMutedState(this.video.muted, this.video.volume);
3842
+ this.ima.updateOriginalMutedState(preservedMutedState, preservedVolumeState);
3844
3843
  this.attachImaEventListeners();
3845
3844
  if (shouldShowPlaceholder) {
3846
3845
  this.showPlaceholderLayer();
@@ -4156,12 +4155,17 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
4156
4155
  }
4157
4156
  }
4158
4157
  if (this.inAdBreak) {
4159
- if (this.expectedAdBreakDurationMs == null && marker.durationSeconds != null) {
4160
- this.expectedAdBreakDurationMs = marker.durationSeconds * 1e3;
4161
- if (this.config.debugAdTiming) {
4162
- console.log("[StormcloudVideoPlayer] Updated ad break duration from subsequent marker: ".concat(this.expectedAdBreakDurationMs, "ms"));
4158
+ if (marker.durationSeconds != null) {
4159
+ var newDurationMs = marker.durationSeconds * 1e3;
4160
+ if (this.expectedAdBreakDurationMs == null || newDurationMs > this.expectedAdBreakDurationMs) {
4161
+ this.expectedAdBreakDurationMs = newDurationMs;
4162
+ var elapsedMs = this.currentAdBreakStartWallClockMs != null ? Date.now() - this.currentAdBreakStartWallClockMs : 0;
4163
+ var remainingMs = Math.max(0, newDurationMs - elapsedMs);
4164
+ this.scheduleAdStopCountdown(remainingMs);
4165
+ if (this.config.debugAdTiming) {
4166
+ console.log("[StormcloudVideoPlayer] Updated ad break duration from subsequent marker: ".concat(newDurationMs, "ms, remaining: ").concat(remainingMs, "ms"));
4167
+ }
4163
4168
  }
4164
- this.scheduleAdStopCountdown(this.expectedAdBreakDurationMs);
4165
4169
  }
4166
4170
  return;
4167
4171
  }
@@ -4237,9 +4241,9 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
4237
4241
  this.expectedAdBreakDurationMs = marker.durationSeconds * 1e3;
4238
4242
  }
4239
4243
  if (this.expectedAdBreakDurationMs != null && this.currentAdBreakStartWallClockMs != null) {
4240
- var elapsedMs = Date.now() - this.currentAdBreakStartWallClockMs;
4241
- var remainingMs = Math.max(0, this.expectedAdBreakDurationMs - elapsedMs);
4242
- this.scheduleAdStopCountdown(remainingMs);
4244
+ var elapsedMs1 = Date.now() - this.currentAdBreakStartWallClockMs;
4245
+ var remainingMs1 = Math.max(0, this.expectedAdBreakDurationMs - elapsedMs1);
4246
+ this.scheduleAdStopCountdown(remainingMs1);
4243
4247
  }
4244
4248
  if (!this.ima.isAdPlaying() && this.activeAdRequestToken === null && this.adRequestQueue.length > 0) {
4245
4249
  this.tryNextAvailableAdWithRateLimit();
@@ -4807,6 +4811,12 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
4807
4811
  return this.totalAdsInBreak;
4808
4812
  }
4809
4813
  },
4814
+ {
4815
+ key: "getAdRemainingMs",
4816
+ value: function getAdRemainingMs() {
4817
+ return this.getRemainingAdMs();
4818
+ }
4819
+ },
4810
4820
  {
4811
4821
  key: "generateVastUrlsWithCorrelators",
4812
4822
  value: function generateVastUrlsWithCorrelators(baseUrl, count) {
@@ -5459,9 +5469,8 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
5459
5469
  ];
5460
5470
  case 2:
5461
5471
  _state.sent();
5462
- if (this.expectedAdBreakDurationMs != null) {
5463
- this.currentAdBreakStartWallClockMs = Date.now();
5464
- this.scheduleAdStopCountdown(this.expectedAdBreakDurationMs);
5472
+ if (this.expectedAdBreakDurationMs != null && this.adStopTimerId == null) {
5473
+ this.scheduleAdStopCountdown(this.getRemainingAdMs());
5465
5474
  }
5466
5475
  adVolume = currentMuted ? 0 : currentVolume;
5467
5476
  this.ima.setAdVolume(adVolume);
@@ -5502,9 +5511,8 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
5502
5511
  ];
5503
5512
  case 6:
5504
5513
  _state.sent();
5505
- if (this.expectedAdBreakDurationMs != null) {
5506
- this.currentAdBreakStartWallClockMs = Date.now();
5507
- this.scheduleAdStopCountdown(this.expectedAdBreakDurationMs);
5514
+ if (this.expectedAdBreakDurationMs != null && this.adStopTimerId == null) {
5515
+ this.scheduleAdStopCountdown(this.getRemainingAdMs());
5508
5516
  }
5509
5517
  adVolume1 = currentMuted ? 0 : currentVolume;
5510
5518
  this.ima.setAdVolume(adVolume1);
@@ -5558,9 +5566,8 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
5558
5566
  ];
5559
5567
  case 10:
5560
5568
  _state.sent();
5561
- if (this.expectedAdBreakDurationMs != null) {
5562
- this.currentAdBreakStartWallClockMs = Date.now();
5563
- this.scheduleAdStopCountdown(this.expectedAdBreakDurationMs);
5569
+ if (this.expectedAdBreakDurationMs != null && this.adStopTimerId == null) {
5570
+ this.scheduleAdStopCountdown(this.getRemainingAdMs());
5564
5571
  }
5565
5572
  adVolume2 = currentMuted ? 0 : currentVolume;
5566
5573
  this.ima.setAdVolume(adVolume2);
@@ -5911,8 +5918,7 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
5911
5918
  case 2:
5912
5919
  _state.sent();
5913
5920
  if (this.expectedAdBreakDurationMs != null && this.adStopTimerId == null) {
5914
- this.currentAdBreakStartWallClockMs = Date.now();
5915
- this.scheduleAdStopCountdown(this.expectedAdBreakDurationMs);
5921
+ this.scheduleAdStopCountdown(this.getRemainingAdMs());
5916
5922
  }
5917
5923
  currentMuted = this.video.muted;
5918
5924
  currentVolume = this.video.volume;
@@ -6665,8 +6671,7 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
6665
6671
  case 5:
6666
6672
  _state.sent();
6667
6673
  if (this.expectedAdBreakDurationMs != null && this.adStopTimerId == null) {
6668
- this.currentAdBreakStartWallClockMs = Date.now();
6669
- this.scheduleAdStopCountdown(this.expectedAdBreakDurationMs);
6674
+ this.scheduleAdStopCountdown(this.getRemainingAdMs());
6670
6675
  }
6671
6676
  currentMuted = this.video.muted;
6672
6677
  currentVolume = this.video.volume;
@@ -6716,8 +6721,7 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
6716
6721
  case 8:
6717
6722
  _state.sent();
6718
6723
  if (this.expectedAdBreakDurationMs != null && this.adStopTimerId == null) {
6719
- this.currentAdBreakStartWallClockMs = Date.now();
6720
- this.scheduleAdStopCountdown(this.expectedAdBreakDurationMs);
6724
+ this.scheduleAdStopCountdown(this.getRemainingAdMs());
6721
6725
  }
6722
6726
  currentMuted1 = this.video.muted;
6723
6727
  currentVolume1 = this.video.volume;