stormcloud-video-player 0.7.25 → 0.7.27
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 +1 -1
- package/lib/index.cjs +136 -77
- package/lib/index.cjs.map +1 -1
- package/lib/index.d.cts +1 -0
- package/lib/index.d.ts +1 -0
- package/lib/index.js +136 -77
- package/lib/index.js.map +1 -1
- package/lib/player/StormcloudVideoPlayer.cjs +17 -12
- package/lib/player/StormcloudVideoPlayer.cjs.map +1 -1
- package/lib/player/StormcloudVideoPlayer.d.cts +1 -0
- package/lib/players/HlsPlayer.cjs +17 -12
- package/lib/players/HlsPlayer.cjs.map +1 -1
- package/lib/players/index.cjs +17 -12
- package/lib/players/index.cjs.map +1 -1
- package/lib/sdk/adstormPlayer.cjs +1 -1
- package/lib/sdk/adstormPlayer.cjs.map +1 -1
- package/lib/ui/StormcloudVideoPlayer.cjs +136 -77
- package/lib/ui/StormcloudVideoPlayer.cjs.map +1 -1
- package/package.json +1 -1
package/lib/index.d.cts
CHANGED
|
@@ -194,6 +194,7 @@ declare class StormcloudVideoPlayer {
|
|
|
194
194
|
getRemainingAdSeconds(): number;
|
|
195
195
|
isAdPlaying(): boolean;
|
|
196
196
|
isShowingAds(): boolean;
|
|
197
|
+
isInAdBreak(): boolean;
|
|
197
198
|
private initializeAdLayer;
|
|
198
199
|
setDisableAds(disabled: boolean): void;
|
|
199
200
|
private syncMainContentAudioWhenVisible;
|
package/lib/index.d.ts
CHANGED
|
@@ -194,6 +194,7 @@ declare class StormcloudVideoPlayer {
|
|
|
194
194
|
getRemainingAdSeconds(): number;
|
|
195
195
|
isAdPlaying(): boolean;
|
|
196
196
|
isShowingAds(): boolean;
|
|
197
|
+
isInAdBreak(): boolean;
|
|
197
198
|
private initializeAdLayer;
|
|
198
199
|
setDisableAds(disabled: boolean): void;
|
|
199
200
|
private syncMainContentAudioWhenVisible;
|
package/lib/index.js
CHANGED
|
@@ -760,7 +760,7 @@ function createAdStormPlayer(contentVideo, options) {
|
|
|
760
760
|
adVideoElement.load();
|
|
761
761
|
}
|
|
762
762
|
function buildVastUrl(durationSeconds) {
|
|
763
|
-
var baseUrl = "https://adstorm.co/api/adstorm/nab/vast/pod";
|
|
763
|
+
var baseUrl = "https://adstorm.co/api-adstorm-dev/adstorm/nab/vast/pod";
|
|
764
764
|
var params = new URLSearchParams();
|
|
765
765
|
if (channelId != null) {
|
|
766
766
|
params.set("channel_id", String(channelId));
|
|
@@ -3248,6 +3248,9 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3248
3248
|
}
|
|
3249
3249
|
_this.adLayer.cancelPreload(token);
|
|
3250
3250
|
} else {
|
|
3251
|
+
_this.video.style.transition = "none";
|
|
3252
|
+
_this.video.style.opacity = "0";
|
|
3253
|
+
_this.video.style.visibility = "hidden";
|
|
3251
3254
|
if (!_this.config.singlePipelineMode) {
|
|
3252
3255
|
_this.showPlaceholderLayer();
|
|
3253
3256
|
}
|
|
@@ -3274,6 +3277,9 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3274
3277
|
console.log("[StormcloudVideoPlayer] content_resume: skip pending bids, only", remainingNow1, "ms left");
|
|
3275
3278
|
}
|
|
3276
3279
|
} else {
|
|
3280
|
+
_this.video.style.transition = "none";
|
|
3281
|
+
_this.video.style.opacity = "0";
|
|
3282
|
+
_this.video.style.visibility = "hidden";
|
|
3277
3283
|
if (!_this.config.singlePipelineMode) {
|
|
3278
3284
|
_this.showPlaceholderLayer();
|
|
3279
3285
|
}
|
|
@@ -3303,17 +3309,10 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3303
3309
|
_this.showPlaceholderLayer();
|
|
3304
3310
|
_this.adLayer.showPlaceholder();
|
|
3305
3311
|
} else {
|
|
3306
|
-
_this.
|
|
3307
|
-
|
|
3308
|
-
|
|
3309
|
-
|
|
3310
|
-
if (Math.abs(_this.video.volume - breakVolume) > 0.01) {
|
|
3311
|
-
_this.video.volume = breakVolume;
|
|
3312
|
-
}
|
|
3313
|
-
if (_this.video.paused) {
|
|
3314
|
-
var _this_video_play;
|
|
3315
|
-
(_this_video_play = _this.video.play()) === null || _this_video_play === void 0 ? void 0 : _this_video_play.catch(function() {});
|
|
3316
|
-
}
|
|
3312
|
+
_this.video.style.transition = "none";
|
|
3313
|
+
_this.video.style.opacity = "0";
|
|
3314
|
+
_this.video.style.visibility = "hidden";
|
|
3315
|
+
_this.adLayer.showPlaceholder();
|
|
3317
3316
|
}
|
|
3318
3317
|
_this.continuousFetchingActive = true;
|
|
3319
3318
|
_this.startContinuousFetchLoop();
|
|
@@ -3525,6 +3524,12 @@ var StormcloudVideoPlayer = /*#__PURE__*/ function() {
|
|
|
3525
3524
|
return this.showAds;
|
|
3526
3525
|
}
|
|
3527
3526
|
},
|
|
3527
|
+
{
|
|
3528
|
+
key: "isInAdBreak",
|
|
3529
|
+
value: function isInAdBreak() {
|
|
3530
|
+
return this.inAdBreak;
|
|
3531
|
+
}
|
|
3532
|
+
},
|
|
3528
3533
|
{
|
|
3529
3534
|
key: "initializeAdLayer",
|
|
3530
3535
|
value: function initializeAdLayer() {
|
|
@@ -7327,6 +7332,7 @@ var StormcloudVideoPlayerComponent = React2.memo(function(props) {
|
|
|
7327
7332
|
var wrapperRef = useRef2(null);
|
|
7328
7333
|
var _React2_useState = _sliced_to_array(React2.useState({
|
|
7329
7334
|
showAds: false,
|
|
7335
|
+
inAdBreak: false,
|
|
7330
7336
|
currentIndex: 0,
|
|
7331
7337
|
totalAds: 0,
|
|
7332
7338
|
remainingSeconds: 0
|
|
@@ -7687,20 +7693,23 @@ var StormcloudVideoPlayerComponent = React2.memo(function(props) {
|
|
|
7687
7693
|
if (!playerRef.current) return;
|
|
7688
7694
|
var checkAdStatus = function checkAdStatus() {
|
|
7689
7695
|
if (playerRef.current) {
|
|
7690
|
-
var
|
|
7696
|
+
var _ref;
|
|
7697
|
+
var _videoRef_current_dataset, _videoRef_current, _playerRef_current_isInAdBreak, _playerRef_current;
|
|
7691
7698
|
var showAdsFromMethod = playerRef.current.isShowingAds();
|
|
7692
7699
|
var showAdsFromAttribute = ((_videoRef_current = videoRef.current) === null || _videoRef_current === void 0 ? void 0 : (_videoRef_current_dataset = _videoRef_current.dataset) === null || _videoRef_current_dataset === void 0 ? void 0 : _videoRef_current_dataset.stormcloudAdPlaying) === "true";
|
|
7693
7700
|
var showAds = showAdsFromMethod || showAdsFromAttribute;
|
|
7701
|
+
var inAdBreak = (_ref = (_playerRef_current_isInAdBreak = (_playerRef_current = playerRef.current).isInAdBreak) === null || _playerRef_current_isInAdBreak === void 0 ? void 0 : _playerRef_current_isInAdBreak.call(_playerRef_current)) !== null && _ref !== void 0 ? _ref : showAds;
|
|
7694
7702
|
var currentIndex = playerRef.current.getCurrentAdIndex();
|
|
7695
7703
|
var totalAds = playerRef.current.getTotalAdsInBreak();
|
|
7696
7704
|
var remainingSeconds = playerRef.current.getRemainingAdSeconds();
|
|
7697
7705
|
setAdStatus(function(prev) {
|
|
7698
|
-
if (prev.showAds !== showAds || prev.currentIndex !== currentIndex || prev.totalAds !== totalAds || prev.remainingSeconds !== remainingSeconds) {
|
|
7706
|
+
if (prev.showAds !== showAds || prev.inAdBreak !== inAdBreak || prev.currentIndex !== currentIndex || prev.totalAds !== totalAds || prev.remainingSeconds !== remainingSeconds) {
|
|
7699
7707
|
if (showAds && !prev.showAds) {
|
|
7700
7708
|
setShowCenterPlay(false);
|
|
7701
7709
|
}
|
|
7702
7710
|
return {
|
|
7703
7711
|
showAds: showAds,
|
|
7712
|
+
inAdBreak: inAdBreak,
|
|
7704
7713
|
currentIndex: currentIndex,
|
|
7705
7714
|
totalAds: totalAds,
|
|
7706
7715
|
remainingSeconds: remainingSeconds
|
|
@@ -8354,7 +8363,7 @@ var StormcloudVideoPlayerComponent = React2.memo(function(props) {
|
|
|
8354
8363
|
})
|
|
8355
8364
|
]
|
|
8356
8365
|
}),
|
|
8357
|
-
/* @__PURE__ */
|
|
8366
|
+
/* @__PURE__ */ jsx2("div", {
|
|
8358
8367
|
className: "sc-ai-scroll",
|
|
8359
8368
|
style: {
|
|
8360
8369
|
padding: "12px",
|
|
@@ -8364,68 +8373,118 @@ var StormcloudVideoPlayerComponent = React2.memo(function(props) {
|
|
|
8364
8373
|
display: "grid",
|
|
8365
8374
|
gap: "12px"
|
|
8366
8375
|
},
|
|
8367
|
-
children:
|
|
8368
|
-
|
|
8369
|
-
|
|
8370
|
-
|
|
8371
|
-
|
|
8372
|
-
|
|
8373
|
-
|
|
8374
|
-
|
|
8375
|
-
|
|
8376
|
-
|
|
8377
|
-
|
|
8378
|
-
|
|
8379
|
-
|
|
8380
|
-
|
|
8381
|
-
|
|
8382
|
-
|
|
8383
|
-
|
|
8384
|
-
|
|
8385
|
-
|
|
8386
|
-
|
|
8387
|
-
|
|
8388
|
-
|
|
8389
|
-
|
|
8390
|
-
|
|
8391
|
-
|
|
8392
|
-
|
|
8393
|
-
|
|
8394
|
-
|
|
8395
|
-
|
|
8396
|
-
|
|
8397
|
-
|
|
8398
|
-
|
|
8399
|
-
|
|
8400
|
-
|
|
8401
|
-
|
|
8402
|
-
|
|
8403
|
-
|
|
8404
|
-
|
|
8405
|
-
|
|
8406
|
-
|
|
8407
|
-
|
|
8408
|
-
|
|
8409
|
-
|
|
8410
|
-
|
|
8411
|
-
|
|
8412
|
-
|
|
8413
|
-
|
|
8414
|
-
|
|
8415
|
-
|
|
8416
|
-
|
|
8417
|
-
|
|
8418
|
-
|
|
8419
|
-
|
|
8420
|
-
|
|
8421
|
-
|
|
8422
|
-
|
|
8423
|
-
|
|
8424
|
-
|
|
8425
|
-
}
|
|
8426
|
-
|
|
8427
|
-
|
|
8428
|
-
|
|
8376
|
+
children: adStatus.inAdBreak ? /* @__PURE__ */ jsxs2("div", {
|
|
8377
|
+
style: {
|
|
8378
|
+
display: "flex",
|
|
8379
|
+
flexDirection: "column",
|
|
8380
|
+
alignItems: "center",
|
|
8381
|
+
justifyContent: "center",
|
|
8382
|
+
gap: "12px",
|
|
8383
|
+
padding: "24px 12px",
|
|
8384
|
+
borderRadius: "10px",
|
|
8385
|
+
border: "1px solid rgba(234, 179, 8, 0.5)",
|
|
8386
|
+
background: "linear-gradient(155deg, rgba(92, 64, 0, 0.45) 0%, rgba(17, 24, 39, 0.62) 100%)",
|
|
8387
|
+
boxShadow: "0 8px 24px rgba(234, 179, 8, 0.12)"
|
|
8388
|
+
},
|
|
8389
|
+
children: [
|
|
8390
|
+
/* @__PURE__ */ jsx2("div", {
|
|
8391
|
+
style: {
|
|
8392
|
+
width: "36px",
|
|
8393
|
+
height: "36px",
|
|
8394
|
+
borderRadius: "50%",
|
|
8395
|
+
background: "rgba(234, 179, 8, 0.18)",
|
|
8396
|
+
border: "2px solid rgba(234, 179, 8, 0.7)",
|
|
8397
|
+
display: "flex",
|
|
8398
|
+
alignItems: "center",
|
|
8399
|
+
justifyContent: "center",
|
|
8400
|
+
fontSize: "16px"
|
|
8401
|
+
},
|
|
8402
|
+
children: "\uD83D\uDCFA"
|
|
8403
|
+
}),
|
|
8404
|
+
/* @__PURE__ */ jsx2("div", {
|
|
8405
|
+
style: {
|
|
8406
|
+
fontSize: "13px",
|
|
8407
|
+
fontWeight: 700,
|
|
8408
|
+
color: "#fde68a",
|
|
8409
|
+
letterSpacing: "0.04em",
|
|
8410
|
+
textAlign: "center"
|
|
8411
|
+
},
|
|
8412
|
+
children: "Now Ad Playing"
|
|
8413
|
+
}),
|
|
8414
|
+
/* @__PURE__ */ jsx2("div", {
|
|
8415
|
+
style: {
|
|
8416
|
+
fontSize: "11px",
|
|
8417
|
+
color: "rgba(255,255,255,0.55)",
|
|
8418
|
+
textAlign: "center",
|
|
8419
|
+
lineHeight: "1.5"
|
|
8420
|
+
},
|
|
8421
|
+
children: "AI context will resume after the ad break."
|
|
8422
|
+
})
|
|
8423
|
+
]
|
|
8424
|
+
}) : /* @__PURE__ */ jsxs2(Fragment2, {
|
|
8425
|
+
children: [
|
|
8426
|
+
aiLiveContext.error && /* @__PURE__ */ jsx2("div", {
|
|
8427
|
+
style: {
|
|
8428
|
+
fontSize: "12px",
|
|
8429
|
+
color: "#fecaca",
|
|
8430
|
+
background: "rgba(220, 38, 38, 0.2)",
|
|
8431
|
+
border: "1px solid rgba(248, 113, 113, 0.5)",
|
|
8432
|
+
borderRadius: "10px",
|
|
8433
|
+
padding: "9px 10px"
|
|
8434
|
+
},
|
|
8435
|
+
children: aiLiveContext.error
|
|
8436
|
+
}),
|
|
8437
|
+
/* @__PURE__ */ jsxs2("div", {
|
|
8438
|
+
style: {
|
|
8439
|
+
padding: "11px 12px",
|
|
8440
|
+
borderRadius: "10px",
|
|
8441
|
+
border: "1px solid rgba(236, 72, 153, 0.5)",
|
|
8442
|
+
background: "linear-gradient(155deg, rgba(88, 28, 135, 0.35) 0%, rgba(17, 24, 39, 0.62) 100%)",
|
|
8443
|
+
boxShadow: "0 8px 24px rgba(236, 72, 153, 0.12)"
|
|
8444
|
+
},
|
|
8445
|
+
children: [
|
|
8446
|
+
/* @__PURE__ */ jsxs2("div", {
|
|
8447
|
+
style: {
|
|
8448
|
+
display: "flex",
|
|
8449
|
+
alignItems: "center",
|
|
8450
|
+
justifyContent: "space-between",
|
|
8451
|
+
gap: "8px",
|
|
8452
|
+
marginBottom: "7px"
|
|
8453
|
+
},
|
|
8454
|
+
children: [
|
|
8455
|
+
/* @__PURE__ */ jsx2("div", {
|
|
8456
|
+
style: {
|
|
8457
|
+
fontSize: "11px",
|
|
8458
|
+
fontWeight: 800,
|
|
8459
|
+
textTransform: "uppercase",
|
|
8460
|
+
letterSpacing: "0.1em",
|
|
8461
|
+
color: "#f9a8d4"
|
|
8462
|
+
},
|
|
8463
|
+
children: "AI Context"
|
|
8464
|
+
}),
|
|
8465
|
+
/* @__PURE__ */ jsx2("div", {
|
|
8466
|
+
style: {
|
|
8467
|
+
fontSize: "10px",
|
|
8468
|
+
color: "rgba(255,255,255,0.72)",
|
|
8469
|
+
fontFamily: "'SF Mono', 'Cascadia Code', monospace"
|
|
8470
|
+
},
|
|
8471
|
+
children: aiLiveContext.context ? formatAiRelativeTime(aiLiveContext.context.updated_at) : "--"
|
|
8472
|
+
})
|
|
8473
|
+
]
|
|
8474
|
+
}),
|
|
8475
|
+
/* @__PURE__ */ jsx2("div", {
|
|
8476
|
+
style: {
|
|
8477
|
+
fontSize: "13px",
|
|
8478
|
+
lineHeight: "1.58",
|
|
8479
|
+
color: "rgba(255,255,255,0.95)",
|
|
8480
|
+
whiteSpace: "pre-wrap"
|
|
8481
|
+
},
|
|
8482
|
+
children: (_ref = (_aiLiveContext_context = aiLiveContext.context) === null || _aiLiveContext_context === void 0 ? void 0 : _aiLiveContext_context.context) !== null && _ref !== void 0 ? _ref : aiLiveContext.isLoading ? "Analyzing live stream..." : "Waiting for AI context response."
|
|
8483
|
+
})
|
|
8484
|
+
]
|
|
8485
|
+
})
|
|
8486
|
+
]
|
|
8487
|
+
})
|
|
8429
8488
|
})
|
|
8430
8489
|
]
|
|
8431
8490
|
}),
|