stormcloud-video-player 0.7.45 → 0.7.47

package/lib/index.js

@@ -7211,7 +7211,8 @@ var SHOWCASE_PERSISTENT_TYPES = /* @__PURE__ */ new Set([
     "text",
     "shape",
     "countdown",
-    "qr_code"
+    "qr_code",
+    "coming_up_next"
 ]);
 function easeOutCubic(t) {
     var u = 1 - t;
@@ -7334,6 +7335,21 @@ var OverlayRenderer = function OverlayRenderer(param) {
     var rafRef = useRef(null);
     var _useState1 = _sliced_to_array(useState(/* @__PURE__ */ new Map()), 2), fadeMap = _useState1[0], setFadeMap = _useState1[1];
     var removeTimers = useRef(/* @__PURE__ */ new Map());
+    var mountTimeRef = useRef(Date.now());
+    var _useState2 = _sliced_to_array(useState(0), 2), wallclockSec = _useState2[0], setWallclockSec = _useState2[1];
+    useEffect(function() {
+        if (!showcaseMode) return;
+        var tick = function tick() {
+            return setWallclockSec((Date.now() - mountTimeRef.current) / 1e3);
+        };
+        tick();
+        var id = window.setInterval(tick, 200);
+        return function() {
+            return clearInterval(id);
+        };
+    }, [
+        showcaseMode
+    ]);
     var _useMemo = useMemo(function() {
         return partitionShowcase(overlays);
     }, [
@@ -7390,7 +7406,10 @@ var OverlayRenderer = function OverlayRenderer(param) {
         if (showcaseMode) {
             var _showcaseBeats_showcaseBeatIndex;
             var beat = (_showcaseBeats_showcaseBeatIndex = showcaseBeats[showcaseBeatIndex]) !== null && _showcaseBeats_showcaseBeatIndex !== void 0 ? _showcaseBeats_showcaseBeatIndex : [];
-            return _to_consumable_array(showcasePersistent).concat(_to_consumable_array(beat));
+            var scheduledPersistent = showcasePersistent.filter(function(o) {
+                return isOverlayActive(o, wallclockSec);
+            });
+            return _to_consumable_array(scheduledPersistent).concat(_to_consumable_array(beat));
         }
         return overlays.filter(function(o) {
             return isOverlayActive(o, currentTime);
@@ -7398,6 +7417,7 @@ var OverlayRenderer = function OverlayRenderer(param) {
     }, [
         overlays,
         currentTime,
+        wallclockSec,
         showcaseMode,
         showcasePersistent,
         showcaseBeats,
@@ -8110,6 +8130,7 @@ var StormcloudVideoPlayerComponent = React2.memo(function(props) {
             var _player_getMinHlsResolution;
             var fixed = swirlOverlayCoordinateSpace;
             if (fixed && fixed.width > 0 && fixed.height > 0) {
+                console.debug("[StormcloudVideoPlayer] overlay coord space (prop):", fixed.width, "x", fixed.height);
                 setOverlayCoordSpace({
                     width: fixed.width,
                     height: fixed.height
@@ -8120,6 +8141,7 @@ var StormcloudVideoPlayerComponent = React2.memo(function(props) {
             if (!player) return false;
             var minRes = (_player_getMinHlsResolution = player.getMinHlsResolution) === null || _player_getMinHlsResolution === void 0 ? void 0 : _player_getMinHlsResolution.call(player);
             if (minRes && minRes.width > 0 && minRes.height > 0) {
+                console.debug("[StormcloudVideoPlayer] overlay coord space (minHlsResolution):", minRes.width, "x", minRes.height);
                 setOverlayCoordSpace({
                     width: minRes.width,
                     height: minRes.height
@@ -8128,6 +8150,7 @@ var StormcloudVideoPlayerComponent = React2.memo(function(props) {
             }
             var video2 = player.videoElement;
             if (video2 && video2.videoWidth > 0 && video2.videoHeight > 0) {
+                console.debug("[StormcloudVideoPlayer] overlay coord space (videoNative):", video2.videoWidth, "x", video2.videoHeight);
                 setOverlayCoordSpace({
                     width: video2.videoWidth,
                     height: video2.videoHeight
@@ -8160,8 +8183,7 @@ var StormcloudVideoPlayerComponent = React2.memo(function(props) {
     }, [
         swirlProjectId,
         criticalPropsKey,
-        swirlOverlayCoordinateSpace,
-        overlays
+        swirlOverlayCoordinateSpace
     ]);
     useEffect2(function() {
         if (!playerRef.current) return;
@@ -8588,11 +8610,11 @@ var StormcloudVideoPlayerComponent = React2.memo(function(props) {
                     }, restVideoAttrs), {
                         children: children
                     })),
-                    displayOverlays.length > 0 && !adStatus.showAds && !overlaysDisabled && /* @__PURE__ */ jsx2(OverlayRenderer, {
+                    displayOverlays.length > 0 && !adStatus.showAds && !overlaysDisabled && overlayCoordSpace && /* @__PURE__ */ jsx2(OverlayRenderer, {
                         overlays: displayOverlays,
                         currentTime: currentTime,
                         videoRef: videoRef,
-                        coordinateSpace: swirlOverlayCoordinateSpace && swirlOverlayCoordinateSpace.width > 0 && swirlOverlayCoordinateSpace.height > 0 ? swirlOverlayCoordinateSpace : null,
+                        coordinateSpace: overlayCoordSpace,
                         showcaseMode: !!swirlShowcaseDemo
                     }),
                     (isLoading || isBuffering) && !hideLoadingIndicator && /* @__PURE__ */ jsxs2("div", {