stormcloud-video-player 0.7.14 → 0.7.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.
Files changed (21) hide show
  1. package/dist/stormcloud-vp.min.js +1 -1
  2. package/lib/index.cjs +422 -53
  3. package/lib/index.cjs.map +1 -1
  4. package/lib/index.d.cts +16 -0
  5. package/lib/index.d.ts +16 -0
  6. package/lib/index.js +424 -55
  7. package/lib/index.js.map +1 -1
  8. package/lib/player/StormcloudVideoPlayer.cjs +27 -6
  9. package/lib/player/StormcloudVideoPlayer.cjs.map +1 -1
  10. package/lib/player/StormcloudVideoPlayer.d.cts +3 -0
  11. package/lib/players/HlsPlayer.cjs +27 -6
  12. package/lib/players/HlsPlayer.cjs.map +1 -1
  13. package/lib/players/index.cjs +27 -6
  14. package/lib/players/index.cjs.map +1 -1
  15. package/lib/ui/OverlayRenderer.cjs +408 -37
  16. package/lib/ui/OverlayRenderer.cjs.map +1 -1
  17. package/lib/ui/StormcloudVideoPlayer.cjs +422 -53
  18. package/lib/ui/StormcloudVideoPlayer.cjs.map +1 -1
  19. package/lib/ui/StormcloudVideoPlayer.d.cts +5 -0
  20. package/lib/utils/overlays.d.cts +8 -0
  21. package/package.json +1 -1
package/lib/index.cjs CHANGED
@@ -2931,6 +2931,7 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
2931
2931
  this.maxTotalAdRequestsPerBreak = 20;
2932
2932
  this.pendingAdBreak = null;
2933
2933
  this.savedMutedStateBeforeAd = null;
2934
+ this.adLayerInitialized = false;
2934
2935
  this.consecutiveFailures = 0;
2935
2936
  this.maxConsecutiveFailures = 5;
2936
2937
  this.lastAdRequestTime = 0;
@@ -3579,12 +3580,7 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
3579
3580
  this.video.autoplay = !!this.config.autoplay;
3580
3581
  this.video.muted = !!this.config.muted;
3581
3582
  if (!this.config.disableAds) {
3582
- this.adLayer.initialize();
3583
- if (!this.config.disableFiller) {
3584
- this.ensureFillerVideo();
3585
- }
3586
- this.adLayer.updateOriginalMutedState(this.video.muted, this.video.volume);
3587
- this.attachAdLayerEventListeners();
3583
+ this.initializeAdLayer();
3588
3584
  }
3589
3585
  this.timeUpdateHandler = function() {
3590
3586
  _this.onTimeUpdate(_this.video.currentTime);
@@ -3685,6 +3681,31 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
3685
3681
  return this.showAds;
3686
3682
  }
3687
3683
  },
3684
+ {
3685
+ key: "initializeAdLayer",
3686
+ value: function initializeAdLayer() {
3687
+ if (this.adLayerInitialized) return;
3688
+ this.adLayer.initialize();
3689
+ if (!this.config.disableFiller) {
3690
+ this.ensureFillerVideo();
3691
+ }
3692
+ this.adLayer.updateOriginalMutedState(this.video.muted, this.video.volume);
3693
+ this.attachAdLayerEventListeners();
3694
+ this.adLayerInitialized = true;
3695
+ }
3696
+ },
3697
+ {
3698
+ key: "setDisableAds",
3699
+ value: function setDisableAds(disabled) {
3700
+ this.config.disableAds = disabled;
3701
+ if (!disabled && this.attached) {
3702
+ this.initializeAdLayer();
3703
+ }
3704
+ if (this.config.debugAdTiming) {
3705
+ console.log("[StormcloudVideoPlayer] setDisableAds:", disabled);
3706
+ }
3707
+ }
3708
+ },
3688
3709
  {
3689
3710
  key: "syncMainContentAudioWhenVisible",
3690
3711
  value: function syncMainContentAudioWhenVisible() {
@@ -5919,60 +5940,303 @@ function TextOverlay(param) {
5919
5940
  children: text
5920
5941
  });
5921
5942
  }
5943
+ function fetchRSSItems(rssUrl, maxItems) {
5944
+ return _async_to_generator(function() {
5945
+ var resp, data, parser, doc;
5946
+ return _ts_generator(this, function(_state) {
5947
+ switch(_state.label){
5948
+ case 0:
5949
+ return [
5950
+ 4,
5951
+ fetch("https://api.allorigins.win/get?url=".concat(encodeURIComponent(rssUrl)))
5952
+ ];
5953
+ case 1:
5954
+ resp = _state.sent();
5955
+ return [
5956
+ 4,
5957
+ resp.json()
5958
+ ];
5959
+ case 2:
5960
+ data = _state.sent();
5961
+ if (!data.contents) throw new Error("No content from RSS feed");
5962
+ parser = new DOMParser();
5963
+ doc = parser.parseFromString(data.contents, "text/xml");
5964
+ if (doc.querySelector("parsererror")) throw new Error("Invalid RSS XML");
5965
+ return [
5966
+ 2,
5967
+ Array.from(doc.querySelectorAll("item")).map(function(item) {
5968
+ var _item_querySelector, _item_querySelector1, _item_querySelector2, _item_querySelector3, _item_querySelector4;
5969
+ return {
5970
+ title: (((_item_querySelector = item.querySelector("title")) === null || _item_querySelector === void 0 ? void 0 : _item_querySelector.textContent) || "").replace(/<[^>]*>/g, "").trim(),
5971
+ description: (((_item_querySelector1 = item.querySelector("description")) === null || _item_querySelector1 === void 0 ? void 0 : _item_querySelector1.textContent) || "").replace(/<[^>]*>/g, "").trim(),
5972
+ pubDate: ((_item_querySelector2 = item.querySelector("pubDate")) === null || _item_querySelector2 === void 0 ? void 0 : _item_querySelector2.textContent) || "",
5973
+ author: ((_item_querySelector3 = item.querySelector("author, dc\\:creator")) === null || _item_querySelector3 === void 0 ? void 0 : _item_querySelector3.textContent) || "",
5974
+ category: ((_item_querySelector4 = item.querySelector("category")) === null || _item_querySelector4 === void 0 ? void 0 : _item_querySelector4.textContent) || ""
5975
+ };
5976
+ }).filter(function(i) {
5977
+ return i.title;
5978
+ }).slice(0, maxItems)
5979
+ ];
5980
+ }
5981
+ });
5982
+ })();
5983
+ }
5922
5984
  function ScrollerOverlay(param) {
5923
5985
  var overlay = param.overlay;
5924
- var _ref, _ref1, _ref2, _ref3, _ref4;
5986
+ var _ref, _ref1, _ref2, _ref3, _ref4, _ref5, _ref6, _ref7, _ref8, _ref9, _ref10, _ref11, _ref12;
5925
5987
  var cfg = overlay.scroller_config;
5926
- var text = (cfg === null || cfg === void 0 ? void 0 : cfg.use_custom_text) && cfg.custom_text ? cfg.custom_text : overlay.content || (cfg === null || cfg === void 0 ? void 0 : cfg.custom_text) || "";
5927
- var scrollSpeed = (_ref = cfg === null || cfg === void 0 ? void 0 : cfg.scroll_speed) !== null && _ref !== void 0 ? _ref : 50;
5928
- var direction = (_ref1 = cfg === null || cfg === void 0 ? void 0 : cfg.direction) !== null && _ref1 !== void 0 ? _ref1 : "left";
5929
- var fontSize = (cfg === null || cfg === void 0 ? void 0 : cfg.font_size) ? "".concat(cfg.font_size, "px") : "clamp(10px, 1.2vw, 18px)";
5988
+ var uid = (0, import_react.useId)().replace(/:/g, "");
5989
+ var _ref13 = _sliced_to_array((0, import_react.useState)([]), 2), rssItems = _ref13[0], setRssItems = _ref13[1];
5990
+ var _ref14 = _sliced_to_array((0, import_react.useState)(false), 2), rssLoading = _ref14[0], setRssLoading = _ref14[1];
5991
+ var rssUrl = (cfg === null || cfg === void 0 ? void 0 : cfg.rss_url) || "";
5992
+ var maxItems = (_ref = cfg === null || cfg === void 0 ? void 0 : cfg.max_items) !== null && _ref !== void 0 ? _ref : 10;
5993
+ var autoRefresh = (cfg === null || cfg === void 0 ? void 0 : cfg.auto_refresh) !== false;
5994
+ var updateInterval = (_ref1 = cfg === null || cfg === void 0 ? void 0 : cfg.update_interval) !== null && _ref1 !== void 0 ? _ref1 : 5;
5995
+ (0, import_react.useEffect)(function() {
5996
+ if (!rssUrl || (cfg === null || cfg === void 0 ? void 0 : cfg.use_custom_text) && (cfg === null || cfg === void 0 ? void 0 : cfg.custom_text)) return;
5997
+ var cancelled = false;
5998
+ setRssLoading(true);
5999
+ fetchRSSItems(rssUrl, maxItems).then(function(items) {
6000
+ if (!cancelled) setRssItems(items);
6001
+ }).catch(function() {}).finally(function() {
6002
+ if (!cancelled) setRssLoading(false);
6003
+ });
6004
+ return function() {
6005
+ cancelled = true;
6006
+ };
6007
+ }, [
6008
+ rssUrl,
6009
+ maxItems,
6010
+ cfg === null || cfg === void 0 ? void 0 : cfg.use_custom_text,
6011
+ cfg === null || cfg === void 0 ? void 0 : cfg.custom_text
6012
+ ]);
6013
+ (0, import_react.useEffect)(function() {
6014
+ if (!rssUrl || !autoRefresh || (cfg === null || cfg === void 0 ? void 0 : cfg.use_custom_text) && (cfg === null || cfg === void 0 ? void 0 : cfg.custom_text)) return;
6015
+ var interval = setInterval(function() {
6016
+ fetchRSSItems(rssUrl, maxItems).then(setRssItems).catch(function() {});
6017
+ }, updateInterval * 60 * 1e3);
6018
+ return function() {
6019
+ return clearInterval(interval);
6020
+ };
6021
+ }, [
6022
+ rssUrl,
6023
+ autoRefresh,
6024
+ updateInterval,
6025
+ maxItems,
6026
+ cfg === null || cfg === void 0 ? void 0 : cfg.use_custom_text,
6027
+ cfg === null || cfg === void 0 ? void 0 : cfg.custom_text
6028
+ ]);
6029
+ var sep = (_ref2 = cfg === null || cfg === void 0 ? void 0 : cfg.separator_char) !== null && _ref2 !== void 0 ? _ref2 : "\u25C6";
6030
+ var segments;
6031
+ if ((cfg === null || cfg === void 0 ? void 0 : cfg.use_custom_text) && (cfg === null || cfg === void 0 ? void 0 : cfg.custom_text)) {
6032
+ segments = [
6033
+ cfg.custom_text
6034
+ ];
6035
+ } else if (rssItems.length > 0) {
6036
+ segments = rssItems.map(function(item) {
6037
+ var parts = [];
6038
+ if ((cfg === null || cfg === void 0 ? void 0 : cfg.show_title) !== false && item.title) parts.push(item.title);
6039
+ if ((cfg === null || cfg === void 0 ? void 0 : cfg.show_description) && item.description) parts.push(item.description);
6040
+ if ((cfg === null || cfg === void 0 ? void 0 : cfg.show_timestamp) && item.pubDate) {
6041
+ try {
6042
+ parts.push(new Date(item.pubDate).toLocaleDateString());
6043
+ } catch (unused) {}
6044
+ }
6045
+ if ((cfg === null || cfg === void 0 ? void 0 : cfg.show_author) && item.author) parts.push("— ".concat(item.author));
6046
+ if ((cfg === null || cfg === void 0 ? void 0 : cfg.show_category) && item.category) parts.push("[".concat(item.category, "]"));
6047
+ return parts.join(" ");
6048
+ });
6049
+ } else if (rssLoading) {
6050
+ segments = [
6051
+ "Loading feed\u2026"
6052
+ ];
6053
+ } else if (overlay.content) {
6054
+ segments = [
6055
+ overlay.content
6056
+ ];
6057
+ } else {
6058
+ segments = rssUrl ? [
6059
+ "Fetching RSS feed\u2026"
6060
+ ] : [
6061
+ "RSS Ticker"
6062
+ ];
6063
+ }
6064
+ var scrollSpeed = (_ref3 = cfg === null || cfg === void 0 ? void 0 : cfg.scroll_speed) !== null && _ref3 !== void 0 ? _ref3 : 40;
6065
+ var direction = (_ref4 = cfg === null || cfg === void 0 ? void 0 : cfg.direction) !== null && _ref4 !== void 0 ? _ref4 : "left";
6066
+ var fontSize = (_ref5 = cfg === null || cfg === void 0 ? void 0 : cfg.font_size) !== null && _ref5 !== void 0 ? _ref5 : 15;
5930
6067
  var fontFamily = (cfg === null || cfg === void 0 ? void 0 : cfg.font_family) || "Roboto, 'Segoe UI', Arial, sans-serif";
5931
- var fontWeight = (cfg === null || cfg === void 0 ? void 0 : cfg.font_weight) || "600";
6068
+ var fontWeight = (cfg === null || cfg === void 0 ? void 0 : cfg.font_weight) || "700";
5932
6069
  var textColor = (cfg === null || cfg === void 0 ? void 0 : cfg.text_color) || "#ffffff";
5933
- var bgColor = (cfg === null || cfg === void 0 ? void 0 : cfg.background_color) || "transparent";
5934
- var bgOpacity = (cfg === null || cfg === void 0 ? void 0 : cfg.background_opacity) !== void 0 ? cfg.background_opacity / 100 : 0;
5935
- var borderColor = (cfg === null || cfg === void 0 ? void 0 : cfg.border_color) || "transparent";
5936
- var borderWidth = (_ref2 = cfg === null || cfg === void 0 ? void 0 : cfg.border_width) !== null && _ref2 !== void 0 ? _ref2 : 0;
5937
- var borderRadius = (_ref3 = cfg === null || cfg === void 0 ? void 0 : cfg.border_radius) !== null && _ref3 !== void 0 ? _ref3 : 0;
5938
- var padding = (_ref4 = cfg === null || cfg === void 0 ? void 0 : cfg.padding) !== null && _ref4 !== void 0 ? _ref4 : 4;
5939
- var isVertical = direction === "up" || direction === "down";
6070
+ var bgColor = (cfg === null || cfg === void 0 ? void 0 : cfg.background_color) || "#0d0d1a";
6071
+ var bgOpacity = (cfg === null || cfg === void 0 ? void 0 : cfg.background_opacity) !== void 0 ? cfg.background_opacity / 100 : 0.95;
6072
+ var borderRadius = (_ref6 = cfg === null || cfg === void 0 ? void 0 : cfg.border_radius) !== null && _ref6 !== void 0 ? _ref6 : 0;
6073
+ var itemSpacing = (_ref7 = cfg === null || cfg === void 0 ? void 0 : cfg.item_spacing) !== null && _ref7 !== void 0 ? _ref7 : 60;
6074
+ var label = (_ref8 = cfg === null || cfg === void 0 ? void 0 : cfg.label) !== null && _ref8 !== void 0 ? _ref8 : "NEWS";
6075
+ var labelLine2 = (_ref9 = cfg === null || cfg === void 0 ? void 0 : cfg.label_line2) !== null && _ref9 !== void 0 ? _ref9 : "";
6076
+ var labelColor = (_ref10 = cfg === null || cfg === void 0 ? void 0 : cfg.label_color) !== null && _ref10 !== void 0 ? _ref10 : "#f97316";
6077
+ var labelTextColor = (_ref11 = cfg === null || cfg === void 0 ? void 0 : cfg.label_text_color) !== null && _ref11 !== void 0 ? _ref11 : "#ffffff";
6078
+ var accentColor = (_ref12 = cfg === null || cfg === void 0 ? void 0 : cfg.accent_color) !== null && _ref12 !== void 0 ? _ref12 : labelColor;
6079
+ var showAccentLine = (cfg === null || cfg === void 0 ? void 0 : cfg.show_accent_line) !== false;
6080
+ var isHorizontal = direction === "left" || direction === "right";
5940
6081
  var isReverse = direction === "right" || direction === "down";
5941
- var durationSec = Math.max(3, 120 - scrollSpeed);
5942
- var animId = "sc-scroller-".concat(overlay.id);
5943
- var keyframes = isVertical ? "@keyframes ".concat(animId, " {\n 0% { transform: translateY(").concat(isReverse ? "-100%" : "100%", "); }\n 100% { transform: translateY(").concat(isReverse ? "100%" : "-100%", "); }\n }") : "@keyframes ".concat(animId, " {\n 0% { transform: translateX(").concat(isReverse ? "-100%" : "100%", "); }\n 100% { transform: translateX(").concat(isReverse ? "100%" : "-100%", "); }\n }");
6082
+ var fullText = segments.join(" ".concat(sep, " "));
6083
+ var durationSec = Math.max(6, fullText.length * 9 / scrollSpeed);
6084
+ var animId = "sc-ticker-".concat(overlay.id, "-").concat(uid);
6085
+ var keyframes = isHorizontal ? "@keyframes ".concat(animId, " {\n ").concat(isReverse ? "0% { transform: translateX(-50%); } 100% { transform: translateX(0%); }" : "0% { transform: translateX(0); } 100% { transform: translateX(-50%); }", "\n }") : "@keyframes ".concat(animId, " {\n ").concat(isReverse ? "0% { transform: translateY(-50%); } 100% { transform: translateY(0%); }" : "0% { transform: translateY(0); } 100% { transform: translateY(-50%); }", "\n }");
5944
6086
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
5945
6087
  children: [
5946
6088
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("style", {
5947
6089
  children: keyframes
5948
6090
  }),
5949
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
6091
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
5950
6092
  style: {
5951
6093
  width: "100%",
5952
6094
  height: "100%",
5953
- overflow: "hidden",
5954
6095
  display: "flex",
5955
- alignItems: "center",
5956
- backgroundColor: bgOpacity > 0 ? "rgba(".concat(hexToRgb(bgColor), ", ").concat(bgOpacity, ")") : void 0,
5957
- border: borderWidth > 0 ? "".concat(borderWidth, "px solid ").concat(borderColor) : void 0,
6096
+ flexDirection: "column",
6097
+ overflow: "hidden",
5958
6098
  borderRadius: borderRadius > 0 ? "".concat(borderRadius, "px") : void 0,
5959
- padding: "".concat(padding, "px"),
5960
- boxSizing: "border-box",
5961
- pointerEvents: "none"
6099
+ backgroundColor: "rgba(".concat(hexToRgb(bgColor), ", ").concat(bgOpacity, ")"),
6100
+ fontFamily: fontFamily,
6101
+ fontSize: "".concat(fontSize, "px"),
6102
+ fontWeight: fontWeight,
6103
+ color: textColor,
6104
+ pointerEvents: "none",
6105
+ userSelect: "none"
5962
6106
  },
5963
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
5964
- style: {
5965
- whiteSpace: "nowrap",
5966
- fontSize: fontSize,
5967
- fontFamily: fontFamily,
5968
- fontWeight: fontWeight,
5969
- color: textColor,
5970
- animation: "".concat(animId, " ").concat(durationSec, "s linear infinite"),
5971
- textShadow: "0 1px 4px rgba(0,0,0,0.5)",
5972
- userSelect: "none"
5973
- },
5974
- children: text
5975
- })
6107
+ children: [
6108
+ showAccentLine && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
6109
+ style: {
6110
+ height: 3,
6111
+ background: accentColor,
6112
+ flexShrink: 0,
6113
+ width: "100%"
6114
+ }
6115
+ }),
6116
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
6117
+ style: {
6118
+ display: "flex",
6119
+ flex: 1,
6120
+ overflow: "hidden",
6121
+ minHeight: 0
6122
+ },
6123
+ children: [
6124
+ label && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
6125
+ style: {
6126
+ background: labelColor,
6127
+ color: labelTextColor,
6128
+ padding: "0 14px",
6129
+ display: "flex",
6130
+ flexDirection: "column",
6131
+ alignItems: "center",
6132
+ justifyContent: "center",
6133
+ flexShrink: 0,
6134
+ minWidth: 72,
6135
+ textAlign: "center",
6136
+ gap: 1
6137
+ },
6138
+ children: [
6139
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
6140
+ style: {
6141
+ fontWeight: 800,
6142
+ fontSize: "0.82em",
6143
+ letterSpacing: "0.05em",
6144
+ lineHeight: 1.1,
6145
+ textTransform: "uppercase",
6146
+ whiteSpace: "nowrap"
6147
+ },
6148
+ children: label
6149
+ }),
6150
+ labelLine2 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
6151
+ style: {
6152
+ fontWeight: 500,
6153
+ fontSize: "0.62em",
6154
+ letterSpacing: "0.03em",
6155
+ lineHeight: 1.1,
6156
+ opacity: 0.85,
6157
+ whiteSpace: "nowrap"
6158
+ },
6159
+ children: labelLine2
6160
+ })
6161
+ ]
6162
+ }),
6163
+ label && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
6164
+ style: {
6165
+ width: 3,
6166
+ background: accentColor,
6167
+ flexShrink: 0
6168
+ }
6169
+ }),
6170
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
6171
+ style: {
6172
+ flex: 1,
6173
+ overflow: "hidden",
6174
+ position: "relative",
6175
+ display: "flex",
6176
+ alignItems: "center"
6177
+ },
6178
+ children: isHorizontal ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
6179
+ style: {
6180
+ display: "inline-flex",
6181
+ whiteSpace: "nowrap",
6182
+ animation: "".concat(animId, " ").concat(durationSec, "s linear infinite"),
6183
+ willChange: "transform"
6184
+ },
6185
+ children: [
6186
+ 0,
6187
+ 1
6188
+ ].map(function(copy) {
6189
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
6190
+ style: {
6191
+ paddingRight: "".concat(itemSpacing, "px")
6192
+ },
6193
+ children: segments.map(function(seg, i) {
6194
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react.default.Fragment, {
6195
+ children: [
6196
+ i > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
6197
+ style: {
6198
+ opacity: 0.5,
6199
+ margin: "0 8px"
6200
+ },
6201
+ children: sep
6202
+ }),
6203
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
6204
+ style: {
6205
+ textShadow: "0 1px 3px rgba(0,0,0,0.6)"
6206
+ },
6207
+ children: seg
6208
+ })
6209
+ ]
6210
+ }, i);
6211
+ })
6212
+ }, copy);
6213
+ })
6214
+ }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
6215
+ style: {
6216
+ display: "flex",
6217
+ flexDirection: "column",
6218
+ whiteSpace: "nowrap",
6219
+ animation: "".concat(animId, " ").concat(durationSec, "s linear infinite"),
6220
+ willChange: "transform"
6221
+ },
6222
+ children: [
6223
+ 0,
6224
+ 1
6225
+ ].map(function(copy) {
6226
+ return segments.map(function(seg, i) {
6227
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
6228
+ style: {
6229
+ paddingBottom: "".concat(itemSpacing / 4, "px")
6230
+ },
6231
+ children: seg
6232
+ }, "".concat(copy, "-").concat(i));
6233
+ });
6234
+ })
6235
+ })
6236
+ })
6237
+ ]
6238
+ })
6239
+ ]
5976
6240
  })
5977
6241
  ]
5978
6242
  });
@@ -7123,7 +7387,7 @@ var PANEL_BASE_RIGHT_OFFSET = 10;
7123
7387
  var StormcloudVideoPlayerComponent = import_react2.default.memo(function(props) {
7124
7388
  var _ref;
7125
7389
  var _aiLiveContext_context;
7126
- var src = props.src, autoplay = props.autoplay, muted = props.muted, lowLatencyMode = props.lowLatencyMode, allowNativeHls = props.allowNativeHls, driftToleranceMs = props.driftToleranceMs, immediateManifestAds = props.immediateManifestAds, debugAdTiming = props.debugAdTiming, showCustomControls = props.showCustomControls, hideLoadingIndicator = props.hideLoadingIndicator, onVolumeToggle = props.onVolumeToggle, onFullscreenToggle = props.onFullscreenToggle, onControlClick = props.onControlClick, onReady = props.onReady, wrapperClassName = props.wrapperClassName, wrapperStyle = props.wrapperStyle, className = props.className, style = props.style, controls = props.controls, playsInline = props.playsInline, preload = props.preload, poster = props.poster, children = props.children, licenseKey = props.licenseKey, minSegmentsBeforePlay = props.minSegmentsBeforePlay, disableAds = props.disableAds, disableFiller = props.disableFiller, swirlProjectId = props.swirlProjectId, restVideoAttrs = _object_without_properties(props, [
7390
+ var src = props.src, autoplay = props.autoplay, muted = props.muted, lowLatencyMode = props.lowLatencyMode, allowNativeHls = props.allowNativeHls, driftToleranceMs = props.driftToleranceMs, immediateManifestAds = props.immediateManifestAds, debugAdTiming = props.debugAdTiming, showCustomControls = props.showCustomControls, hideLoadingIndicator = props.hideLoadingIndicator, onVolumeToggle = props.onVolumeToggle, onFullscreenToggle = props.onFullscreenToggle, onControlClick = props.onControlClick, onReady = props.onReady, wrapperClassName = props.wrapperClassName, wrapperStyle = props.wrapperStyle, className = props.className, style = props.style, controls = props.controls, playsInline = props.playsInline, preload = props.preload, poster = props.poster, children = props.children, licenseKey = props.licenseKey, minSegmentsBeforePlay = props.minSegmentsBeforePlay, disableAds = props.disableAds, disableFiller = props.disableFiller, swirlProjectId = props.swirlProjectId, disableOverlays = props.disableOverlays, showAdsControl = props.showAdsControl, showOverlaysControl = props.showOverlaysControl, showAiContextControl = props.showAiContextControl, showDebugControl = props.showDebugControl, restVideoAttrs = _object_without_properties(props, [
7127
7391
  "src",
7128
7392
  "autoplay",
7129
7393
  "muted",
@@ -7151,7 +7415,12 @@ var StormcloudVideoPlayerComponent = import_react2.default.memo(function(props)
7151
7415
  "minSegmentsBeforePlay",
7152
7416
  "disableAds",
7153
7417
  "disableFiller",
7154
- "swirlProjectId"
7418
+ "swirlProjectId",
7419
+ "disableOverlays",
7420
+ "showAdsControl",
7421
+ "showOverlaysControl",
7422
+ "showAiContextControl",
7423
+ "showDebugControl"
7155
7424
  ]);
7156
7425
  var videoRef = (0, import_react2.useRef)(null);
7157
7426
  var playerRef = (0, import_react2.useRef)(null);
@@ -7187,12 +7456,14 @@ var StormcloudVideoPlayerComponent = import_react2.default.memo(function(props)
7187
7456
  var _import_react2_default_useState21 = _sliced_to_array(import_react2.default.useState(false), 2), showDebugPanel = _import_react2_default_useState21[0], setShowDebugPanel = _import_react2_default_useState21[1];
7188
7457
  var _import_react2_default_useState22 = _sliced_to_array(import_react2.default.useState([]), 2), debugMarkers = _import_react2_default_useState22[0], setDebugMarkers = _import_react2_default_useState22[1];
7189
7458
  var _import_react2_default_useState23 = _sliced_to_array(import_react2.default.useState(false), 2), showAiPanel = _import_react2_default_useState23[0], setShowAiPanel = _import_react2_default_useState23[1];
7190
- var _import_react2_default_useState24 = _sliced_to_array(import_react2.default.useState({
7459
+ var _import_react2_default_useState24 = _sliced_to_array(import_react2.default.useState(disableAds !== null && disableAds !== void 0 ? disableAds : false), 2), adsDisabled = _import_react2_default_useState24[0], setAdsDisabled = _import_react2_default_useState24[1];
7460
+ var _import_react2_default_useState25 = _sliced_to_array(import_react2.default.useState(disableOverlays !== null && disableOverlays !== void 0 ? disableOverlays : false), 2), overlaysDisabled = _import_react2_default_useState25[0], setOverlaysDisabled = _import_react2_default_useState25[1];
7461
+ var _import_react2_default_useState26 = _sliced_to_array(import_react2.default.useState({
7191
7462
  context: null,
7192
7463
  isLoading: false,
7193
7464
  error: null,
7194
7465
  lastPolledAt: null
7195
- }), 2), aiLiveContext = _import_react2_default_useState24[0], setAiLiveContext = _import_react2_default_useState24[1];
7466
+ }), 2), aiLiveContext = _import_react2_default_useState26[0], setAiLiveContext = _import_react2_default_useState26[1];
7196
7467
  var getResponsiveScale = function getResponsiveScale() {
7197
7468
  if (viewportWidth < 480) return 0.7;
7198
7469
  if (viewportWidth < 768) return 0.8;
@@ -7867,7 +8138,7 @@ var StormcloudVideoPlayerComponent = import_react2.default.memo(function(props)
7867
8138
  }, restVideoAttrs), {
7868
8139
  children: children
7869
8140
  })),
7870
- overlays.length > 0 && !adStatus.showAds && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(OverlayRenderer, {
8141
+ overlays.length > 0 && !adStatus.showAds && !overlaysDisabled && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(OverlayRenderer, {
7871
8142
  overlays: overlays,
7872
8143
  currentTime: currentTime,
7873
8144
  videoRef: videoRef,
@@ -8679,7 +8950,54 @@ var StormcloudVideoPlayerComponent = import_react2.default.memo(function(props)
8679
8950
  gap: "".concat(8 * responsiveScale, "px")
8680
8951
  },
8681
8952
  children: [
8682
- swirlProjectId && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", {
8953
+ (showAdsControl !== null && showAdsControl !== void 0 ? showAdsControl : true) && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", {
8954
+ className: "sc-ctrl-btn",
8955
+ onClick: function onClick() {
8956
+ var _playerRef_current;
8957
+ var next = !adsDisabled;
8958
+ setAdsDisabled(next);
8959
+ (_playerRef_current = playerRef.current) === null || _playerRef_current === void 0 ? void 0 : _playerRef_current.setDisableAds(next);
8960
+ resetControlsTimer();
8961
+ },
8962
+ style: {
8963
+ padding: "".concat(8 * responsiveScale, "px"),
8964
+ borderRadius: "50%",
8965
+ minWidth: "".concat(36 * responsiveScale, "px"),
8966
+ minHeight: "".concat(36 * responsiveScale, "px"),
8967
+ background: adsDisabled ? "rgba(239, 68, 68, 0.28)" : "transparent",
8968
+ fontFamily: "'SF Mono', 'Cascadia Code', monospace",
8969
+ fontSize: "".concat(12 * responsiveScale, "px"),
8970
+ fontWeight: 700,
8971
+ letterSpacing: "0.03em",
8972
+ color: adsDisabled ? "rgba(252, 165, 165, 0.9)" : "rgba(255, 255, 255, 0.75)",
8973
+ textDecoration: adsDisabled ? "line-through" : "none"
8974
+ },
8975
+ title: adsDisabled ? "Enable ads" : "Disable ads",
8976
+ children: "AD"
8977
+ }),
8978
+ swirlProjectId && (showOverlaysControl !== null && showOverlaysControl !== void 0 ? showOverlaysControl : true) && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", {
8979
+ className: "sc-ctrl-btn",
8980
+ onClick: function onClick() {
8981
+ setOverlaysDisabled(function(prev) {
8982
+ return !prev;
8983
+ });
8984
+ resetControlsTimer();
8985
+ },
8986
+ style: {
8987
+ padding: "".concat(8 * responsiveScale, "px"),
8988
+ borderRadius: "50%",
8989
+ minWidth: "".concat(36 * responsiveScale, "px"),
8990
+ minHeight: "".concat(36 * responsiveScale, "px"),
8991
+ background: overlaysDisabled ? "rgba(239, 68, 68, 0.28)" : "transparent",
8992
+ color: overlaysDisabled ? "rgba(252, 165, 165, 0.9)" : "rgba(255, 255, 255, 0.75)",
8993
+ opacity: overlaysDisabled ? 1 : 0.9
8994
+ },
8995
+ title: overlaysDisabled ? "Enable overlays" : "Disable overlays",
8996
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_fa.FaLayerGroup, {
8997
+ size: Math.max(14, 18 * responsiveScale)
8998
+ })
8999
+ }),
9000
+ swirlProjectId && (showAiContextControl !== null && showAiContextControl !== void 0 ? showAiContextControl : true) && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", {
8683
9001
  className: "sc-ctrl-btn",
8684
9002
  onClick: function onClick() {
8685
9003
  setShowAiPanel(function(prev) {
@@ -8701,7 +9019,7 @@ var StormcloudVideoPlayerComponent = import_react2.default.memo(function(props)
8701
9019
  title: showAiPanel ? "Hide AI context" : "Show AI context",
8702
9020
  children: "AI"
8703
9021
  }),
8704
- debugAdTiming && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", {
9022
+ debugAdTiming && (showDebugControl !== null && showDebugControl !== void 0 ? showDebugControl : true) && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", {
8705
9023
  className: "sc-ctrl-btn",
8706
9024
  onClick: function onClick() {
8707
9025
  setShowDebugPanel(function(prev) {
@@ -8972,7 +9290,53 @@ var StormcloudVideoPlayerComponent = import_react2.default.memo(function(props)
8972
9290
  })
8973
9291
  ]
8974
9292
  }),
8975
- swirlProjectId && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", {
9293
+ (showAdsControl !== null && showAdsControl !== void 0 ? showAdsControl : true) && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", {
9294
+ className: "sc-ctrl-btn",
9295
+ onClick: function onClick() {
9296
+ var _playerRef_current;
9297
+ var next = !adsDisabled;
9298
+ setAdsDisabled(next);
9299
+ (_playerRef_current = playerRef.current) === null || _playerRef_current === void 0 ? void 0 : _playerRef_current.setDisableAds(next);
9300
+ resetControlsTimer();
9301
+ },
9302
+ style: {
9303
+ padding: "".concat(8 * responsiveScale, "px"),
9304
+ borderRadius: "50%",
9305
+ minWidth: "".concat(36 * responsiveScale, "px"),
9306
+ minHeight: "".concat(36 * responsiveScale, "px"),
9307
+ background: adsDisabled ? "rgba(239, 68, 68, 0.28)" : "rgba(0, 0, 0, 0.6)",
9308
+ fontFamily: "'SF Mono', 'Cascadia Code', monospace",
9309
+ fontSize: "".concat(12 * responsiveScale, "px"),
9310
+ fontWeight: 700,
9311
+ letterSpacing: "0.03em",
9312
+ color: adsDisabled ? "rgba(252, 165, 165, 0.9)" : "rgba(255, 255, 255, 0.75)",
9313
+ textDecoration: adsDisabled ? "line-through" : "none"
9314
+ },
9315
+ title: adsDisabled ? "Enable ads" : "Disable ads",
9316
+ children: "AD"
9317
+ }),
9318
+ swirlProjectId && (showOverlaysControl !== null && showOverlaysControl !== void 0 ? showOverlaysControl : true) && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", {
9319
+ className: "sc-ctrl-btn",
9320
+ onClick: function onClick() {
9321
+ setOverlaysDisabled(function(prev) {
9322
+ return !prev;
9323
+ });
9324
+ resetControlsTimer();
9325
+ },
9326
+ style: {
9327
+ padding: "".concat(8 * responsiveScale, "px"),
9328
+ borderRadius: "50%",
9329
+ minWidth: "".concat(36 * responsiveScale, "px"),
9330
+ minHeight: "".concat(36 * responsiveScale, "px"),
9331
+ background: overlaysDisabled ? "rgba(239, 68, 68, 0.28)" : "rgba(0, 0, 0, 0.6)",
9332
+ color: overlaysDisabled ? "rgba(252, 165, 165, 0.9)" : "rgba(255, 255, 255, 0.75)"
9333
+ },
9334
+ title: overlaysDisabled ? "Enable overlays" : "Disable overlays",
9335
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_fa.FaLayerGroup, {
9336
+ size: Math.max(14, 18 * responsiveScale)
9337
+ })
9338
+ }),
9339
+ swirlProjectId && (showAiContextControl !== null && showAiContextControl !== void 0 ? showAiContextControl : true) && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", {
8976
9340
  className: "sc-ctrl-btn",
8977
9341
  onClick: function onClick() {
8978
9342
  setShowAiPanel(function(prev) {
@@ -8994,7 +9358,7 @@ var StormcloudVideoPlayerComponent = import_react2.default.memo(function(props)
8994
9358
  title: showAiPanel ? "Hide AI context" : "Show AI context",
8995
9359
  children: "AI"
8996
9360
  }),
8997
- debugAdTiming && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", {
9361
+ debugAdTiming && (showDebugControl !== null && showDebugControl !== void 0 ? showDebugControl : true) && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", {
8998
9362
  className: "sc-ctrl-btn",
8999
9363
  onClick: function onClick() {
9000
9364
  setShowDebugPanel(function(prev) {
@@ -9096,7 +9460,12 @@ var StormcloudVideoPlayerComponent = import_react2.default.memo(function(props)
9096
9460
  "preload",
9097
9461
  "poster",
9098
9462
  "children",
9099
- "swirlProjectId"
9463
+ "swirlProjectId",
9464
+ "disableOverlays",
9465
+ "showAdsControl",
9466
+ "showOverlaysControl",
9467
+ "showAiContextControl",
9468
+ "showDebugControl"
9100
9469
  ];
9101
9470
  var _iteratorNormalCompletion1 = true, _didIteratorError1 = false, _iteratorError1 = undefined;
9102
9471
  try {