stormcloud-video-player 0.7.48 → 0.7.49
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 +103 -7
- package/lib/index.cjs.map +1 -1
- package/lib/index.js +103 -7
- package/lib/index.js.map +1 -1
- package/lib/ui/OverlayRenderer.cjs +103 -7
- package/lib/ui/OverlayRenderer.cjs.map +1 -1
- package/lib/ui/StormcloudVideoPlayer.cjs +103 -7
- package/lib/ui/StormcloudVideoPlayer.cjs.map +1 -1
- package/package.json +1 -1
package/lib/index.cjs
CHANGED
|
@@ -6505,11 +6505,62 @@ function parseConfig(content) {
|
|
|
6505
6505
|
return null;
|
|
6506
6506
|
}
|
|
6507
6507
|
}
|
|
6508
|
+
function parseClockMMSS(clock) {
|
|
6509
|
+
if (!clock) return null;
|
|
6510
|
+
var m = /^\s*(\d{1,3}):([0-5]?\d)\s*$/.exec(clock);
|
|
6511
|
+
if (!m) return null;
|
|
6512
|
+
return parseInt(m[1], 10) * 60 + parseInt(m[2], 10);
|
|
6513
|
+
}
|
|
6514
|
+
function formatClockMMSS(totalSec) {
|
|
6515
|
+
var s = Math.max(0, Math.floor(totalSec));
|
|
6516
|
+
var mm = Math.floor(s / 60);
|
|
6517
|
+
var ss = s % 60;
|
|
6518
|
+
return "".concat(mm, ":").concat(ss.toString().padStart(2, "0"));
|
|
6519
|
+
}
|
|
6520
|
+
function useScoreBugClock(overlayId, sourceClock) {
|
|
6521
|
+
var initialSec = parseClockMMSS(sourceClock);
|
|
6522
|
+
var _ref = _sliced_to_array((0, import_react.useState)(function() {
|
|
6523
|
+
return Date.now();
|
|
6524
|
+
}), 2), now = _ref[0], setNow = _ref[1];
|
|
6525
|
+
var startRef = (0, import_react.useRef)(null);
|
|
6526
|
+
(0, import_react.useEffect)(function() {
|
|
6527
|
+
if (initialSec === null) {
|
|
6528
|
+
startRef.current = null;
|
|
6529
|
+
return;
|
|
6530
|
+
}
|
|
6531
|
+
startRef.current = {
|
|
6532
|
+
id: overlayId,
|
|
6533
|
+
source: sourceClock || "",
|
|
6534
|
+
at: Date.now(),
|
|
6535
|
+
seconds: initialSec
|
|
6536
|
+
};
|
|
6537
|
+
setNow(Date.now());
|
|
6538
|
+
var tick = window.setInterval(function() {
|
|
6539
|
+
return setNow(Date.now());
|
|
6540
|
+
}, 500);
|
|
6541
|
+
return function() {
|
|
6542
|
+
return clearInterval(tick);
|
|
6543
|
+
};
|
|
6544
|
+
}, [
|
|
6545
|
+
overlayId,
|
|
6546
|
+
sourceClock,
|
|
6547
|
+
initialSec
|
|
6548
|
+
]);
|
|
6549
|
+
if (initialSec === null || !startRef.current) return null;
|
|
6550
|
+
var elapsed = Math.floor((now - startRef.current.at) / 1e3);
|
|
6551
|
+
var remaining = Math.max(0, startRef.current.seconds - elapsed);
|
|
6552
|
+
return formatClockMMSS(remaining);
|
|
6553
|
+
}
|
|
6508
6554
|
function ScoreBugOverlay(param) {
|
|
6509
6555
|
var overlay = param.overlay, size = param.size;
|
|
6556
|
+
var _ref, _cfg_period;
|
|
6510
6557
|
var cfg = parseConfig(overlay.content);
|
|
6558
|
+
var liveClock = useScoreBugClock(overlay.id, cfg === null || cfg === void 0 ? void 0 : cfg.clock);
|
|
6511
6559
|
if (!cfg) return null;
|
|
6512
6560
|
var f = Math.max(6, size.w * 0.052);
|
|
6561
|
+
var displayClock = (_ref = liveClock !== null && liveClock !== void 0 ? liveClock : cfg.clock) !== null && _ref !== void 0 ? _ref : "";
|
|
6562
|
+
var displayPeriod = (_cfg_period = cfg.period) !== null && _cfg_period !== void 0 ? _cfg_period : "";
|
|
6563
|
+
var showMiddleCol = Boolean(displayPeriod || displayClock);
|
|
6513
6564
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
|
6514
6565
|
style: {
|
|
6515
6566
|
width: "100%",
|
|
@@ -6567,7 +6618,7 @@ function ScoreBugOverlay(param) {
|
|
|
6567
6618
|
})
|
|
6568
6619
|
]
|
|
6569
6620
|
}),
|
|
6570
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
|
6621
|
+
showMiddleCol && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
|
6571
6622
|
style: {
|
|
6572
6623
|
fontSize: "0.88em",
|
|
6573
6624
|
textAlign: "center",
|
|
@@ -6581,15 +6632,15 @@ function ScoreBugOverlay(param) {
|
|
|
6581
6632
|
letterSpacing: "0.04em"
|
|
6582
6633
|
},
|
|
6583
6634
|
children: [
|
|
6584
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
6585
|
-
children:
|
|
6635
|
+
displayPeriod && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
6636
|
+
children: displayPeriod
|
|
6586
6637
|
}),
|
|
6587
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
6638
|
+
displayClock && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
6588
6639
|
style: {
|
|
6589
6640
|
fontWeight: 700,
|
|
6590
6641
|
opacity: 1
|
|
6591
6642
|
},
|
|
6592
|
-
children:
|
|
6643
|
+
children: displayClock
|
|
6593
6644
|
})
|
|
6594
6645
|
]
|
|
6595
6646
|
}),
|
|
@@ -7372,6 +7423,43 @@ function hexToRgb(hex) {
|
|
|
7372
7423
|
return "".concat(num >> 16 & 255, ",").concat(num >> 8 & 255, ",").concat(num & 255);
|
|
7373
7424
|
}
|
|
7374
7425
|
var FADE_DURATION_MS = 1e3;
|
|
7426
|
+
var VALID_ENTER_ANIMATIONS = /* @__PURE__ */ new Set([
|
|
7427
|
+
"fade",
|
|
7428
|
+
"slide_left",
|
|
7429
|
+
"slide_right",
|
|
7430
|
+
"slide_up",
|
|
7431
|
+
"slide_down"
|
|
7432
|
+
]);
|
|
7433
|
+
function getEnterAnimation(overlay) {
|
|
7434
|
+
var flat = overlay.enter_animation;
|
|
7435
|
+
if (typeof flat === "string" && VALID_ENTER_ANIMATIONS.has(flat)) {
|
|
7436
|
+
return flat;
|
|
7437
|
+
}
|
|
7438
|
+
if (overlay.content) {
|
|
7439
|
+
try {
|
|
7440
|
+
var parsed = JSON.parse(overlay.content);
|
|
7441
|
+
var v = parsed === null || parsed === void 0 ? void 0 : parsed.enterAnimation;
|
|
7442
|
+
if (typeof v === "string" && VALID_ENTER_ANIMATIONS.has(v)) {
|
|
7443
|
+
return v;
|
|
7444
|
+
}
|
|
7445
|
+
} catch (unused) {}
|
|
7446
|
+
}
|
|
7447
|
+
return "fade";
|
|
7448
|
+
}
|
|
7449
|
+
function enterHiddenTransform(anim) {
|
|
7450
|
+
switch(anim){
|
|
7451
|
+
case "slide_left":
|
|
7452
|
+
return "translateX(-120%)";
|
|
7453
|
+
case "slide_right":
|
|
7454
|
+
return "translateX(120%)";
|
|
7455
|
+
case "slide_up":
|
|
7456
|
+
return "translateY(-120%)";
|
|
7457
|
+
case "slide_down":
|
|
7458
|
+
return "translateY(120%)";
|
|
7459
|
+
default:
|
|
7460
|
+
return "";
|
|
7461
|
+
}
|
|
7462
|
+
}
|
|
7375
7463
|
var SHOWCASE_CYCLE_MS_DEFAULT = 36e3;
|
|
7376
7464
|
var SHOWCASE_MIN_BEAT_MS = 6e3;
|
|
7377
7465
|
var BEAT_POP_IN_MS = 520;
|
|
@@ -7794,6 +7882,14 @@ var OverlayRenderer = function OverlayRenderer(param) {
|
|
|
7794
7882
|
w: width,
|
|
7795
7883
|
h: height
|
|
7796
7884
|
};
|
|
7885
|
+
var enterAnim = getEnterAnimation(overlay);
|
|
7886
|
+
var hasSlide = enterAnim !== "fade" && !useShowcasePop;
|
|
7887
|
+
var slideTransform = hasSlide && !visible ? enterHiddenTransform(enterAnim) : "";
|
|
7888
|
+
var popTransform = showcaseMode && useShowcasePop ? "scale(".concat(popScale, ")") : "";
|
|
7889
|
+
var combinedTransform = [
|
|
7890
|
+
slideTransform,
|
|
7891
|
+
popTransform
|
|
7892
|
+
].filter(Boolean).join(" ");
|
|
7797
7893
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
|
|
7798
7894
|
style: {
|
|
7799
7895
|
position: "absolute",
|
|
@@ -7802,8 +7898,8 @@ var OverlayRenderer = function OverlayRenderer(param) {
|
|
|
7802
7898
|
width: "".concat(width, "px"),
|
|
7803
7899
|
height: "".concat(height, "px"),
|
|
7804
7900
|
opacity: opacity,
|
|
7805
|
-
transition: useShowcasePop ? "none" : "opacity ".concat(FADE_DURATION_MS, "ms ease"),
|
|
7806
|
-
transform:
|
|
7901
|
+
transition: useShowcasePop ? "none" : hasSlide ? "opacity ".concat(FADE_DURATION_MS, "ms ease, transform ").concat(FADE_DURATION_MS, "ms cubic-bezier(0.22, 1, 0.36, 1)") : "opacity ".concat(FADE_DURATION_MS, "ms ease"),
|
|
7902
|
+
transform: combinedTransform || void 0,
|
|
7807
7903
|
transformOrigin: showcaseMode && useShowcasePop ? "center center" : void 0,
|
|
7808
7904
|
zIndex: overlay.z_index,
|
|
7809
7905
|
overflow: "hidden"
|