@banou/media-player 0.10.7 → 0.10.8
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/index.js +311 -300
- package/dist/react/player.d.ts +1 -0
- package/dist/react/source-feature.d.ts +14 -0
- package/package.json +1 -1
- package/src/lib/react/components/progress-bar.tsx +30 -0
- package/src/lib/react/components/skip-chapter.tsx +7 -1
- package/src/lib/react/source-feature.ts +8 -0
- package/src/lib/utils/chapters.ts +7 -3
package/dist/index.js
CHANGED
|
@@ -5,13 +5,14 @@ import { createPlayer as v, useContainerAttach as y, useMediaAttach as b } from
|
|
|
5
5
|
import { definePlayerFeature as x, videoFeatures as S } from "@videojs/core/dom";
|
|
6
6
|
import { Fragment as C, jsx as w, jsxs as T } from "@emotion/react/jsx-runtime";
|
|
7
7
|
import { AlertTriangle as E, Check as D, ChevronLeft as O, ChevronRight as k, Copy as A, Maximize as j, Minimize as M, Pause as N, Play as P, RotateCcw as F, Settings as I, Volume1 as L, Volume2 as R, VolumeX as z } from "react-feather";
|
|
8
|
-
import { Tooltip as
|
|
8
|
+
import { Tooltip as ee } from "react-tooltip";
|
|
9
9
|
//#region src/lib/react/source-feature.ts
|
|
10
|
-
var
|
|
10
|
+
var B = {
|
|
11
11
|
indexes: [],
|
|
12
12
|
chapters: [],
|
|
13
13
|
thumbnails: [],
|
|
14
14
|
requestThumbnail: () => {},
|
|
15
|
+
seekPreview: !1,
|
|
15
16
|
subtitleTracks: [],
|
|
16
17
|
selectedSubtitleTrack: void 0,
|
|
17
18
|
selectSubtitleTrack: () => {},
|
|
@@ -29,19 +30,19 @@ var V = {
|
|
|
29
30
|
playbackErrors: [],
|
|
30
31
|
ready: !1,
|
|
31
32
|
setSourceState: () => {}
|
|
32
|
-
},
|
|
33
|
+
}, V = x({
|
|
33
34
|
name: "source",
|
|
34
|
-
state: () => ({ ...
|
|
35
|
+
state: () => ({ ...B }),
|
|
35
36
|
attach({ set: e }) {
|
|
36
37
|
e({
|
|
37
38
|
setSourceState: (t) => e(t),
|
|
38
39
|
setHideUI: (t) => e({ hideUI: t })
|
|
39
40
|
});
|
|
40
41
|
}
|
|
41
|
-
}),
|
|
42
|
-
features: [...S,
|
|
42
|
+
}), H = v({
|
|
43
|
+
features: [...S, V],
|
|
43
44
|
displayName: "MediaPlayer"
|
|
44
|
-
}),
|
|
45
|
+
}), U = H.usePlayer, te = (e) => {
|
|
45
46
|
if (e && e !== "und") try {
|
|
46
47
|
return new Intl.DisplayNames([navigator.language || "en"], {
|
|
47
48
|
type: "language",
|
|
@@ -50,39 +51,39 @@ var V = {
|
|
|
50
51
|
} catch {
|
|
51
52
|
return;
|
|
52
53
|
}
|
|
53
|
-
},
|
|
54
|
-
let t = e.map((e) =>
|
|
54
|
+
}, ne = (e) => e?.replace(/_/g, " ").trim() || void 0, W = (e) => {
|
|
55
|
+
let t = e.map((e) => te(e.language) ?? ne(e.title) ?? `Track ${e.streamIndex}`), n = t.reduce((e, t) => ({
|
|
55
56
|
...e,
|
|
56
57
|
[t]: (e[t] ?? 0) + 1
|
|
57
58
|
}), {});
|
|
58
59
|
return e.map((e, r) => {
|
|
59
|
-
let i = t[r], a =
|
|
60
|
+
let i = t[r], a = ne(e.title);
|
|
60
61
|
return {
|
|
61
62
|
track: e,
|
|
62
63
|
label: (n[i] ?? 0) > 1 && a && a !== i ? `${i} (${a})` : i
|
|
63
64
|
};
|
|
64
65
|
});
|
|
65
|
-
},
|
|
66
|
+
}, G = (e) => W(e).map(({ track: e, label: t }) => ({
|
|
66
67
|
id: e.streamIndex,
|
|
67
68
|
label: t
|
|
68
|
-
})),
|
|
69
|
+
})), K = [
|
|
69
70
|
0,
|
|
70
71
|
250,
|
|
71
72
|
1e3,
|
|
72
73
|
3e3,
|
|
73
74
|
1e4
|
|
74
|
-
],
|
|
75
|
+
], re = 6e4, ie = 500, q = 15e3, J = (e) => e instanceof Error ? e.message : String(e), ae = (e) => {
|
|
75
76
|
let t = [], n = e?.cause;
|
|
76
77
|
for (let e = 0; n != null && e < 8; e++) {
|
|
77
78
|
if (typeof MediaError < "u" && n instanceof MediaError) {
|
|
78
79
|
t.push(`MediaError code ${n.code}${n.message ? `: ${n.message}` : ""}`);
|
|
79
80
|
break;
|
|
80
81
|
}
|
|
81
|
-
t.push(
|
|
82
|
+
t.push(J(n)), n = n?.cause;
|
|
82
83
|
}
|
|
83
84
|
return t.length ? t.join("\n") : void 0;
|
|
84
|
-
},
|
|
85
|
-
let a =
|
|
85
|
+
}, oe = (e, t, r) => {
|
|
86
|
+
let a = U(), { read: o, size: s, publicPath: c = "", libavWorkerUrl: l = "", jassubWorkerUrl: f = "", jassubWasmUrl: h = "", jassubLegacyWasmUrl: g, defaultFontUrl: _, bufferSize: v, autoplay: y = !1, chapters: b, seekPrepareBudgetMs: x = ie } = r ?? {}, S = p(b);
|
|
86
87
|
S.current = b;
|
|
87
88
|
let [C, w] = m(void 0), [T, E] = m(0), D = p({
|
|
88
89
|
count: 0,
|
|
@@ -119,7 +120,7 @@ var V = {
|
|
|
119
120
|
a.setSourceState({ seekingTo: e });
|
|
120
121
|
let c = t.videoElement, l = () => {
|
|
121
122
|
c?.removeEventListener("seeked", l), clearTimeout(u), a.setSourceState({ seekingTo: void 0 });
|
|
122
|
-
}, u = setTimeout(l,
|
|
123
|
+
}, u = setTimeout(l, q);
|
|
123
124
|
c?.addEventListener("seeked", l);
|
|
124
125
|
let d = setTimeout(() => {
|
|
125
126
|
o = "deadline", s();
|
|
@@ -129,7 +130,7 @@ var V = {
|
|
|
129
130
|
});
|
|
130
131
|
}, [a, x]), L = u((e) => {
|
|
131
132
|
typeof e == "number" && (a.setSourceState({ selectedAudioTrack: e }), w(e));
|
|
132
|
-
}, [a]), R =
|
|
133
|
+
}, [a]), R = U((e) => e.setSourceState);
|
|
133
134
|
d(() => {
|
|
134
135
|
R({
|
|
135
136
|
selectSubtitleTrack: F,
|
|
@@ -149,7 +150,7 @@ var V = {
|
|
|
149
150
|
ready: !1
|
|
150
151
|
});
|
|
151
152
|
let u = (t, n) => {
|
|
152
|
-
let r = Date.now(), i =
|
|
153
|
+
let r = Date.now(), i = J(t), o = ae(t), s = a.playbackErrors, c = s[s.length - 1];
|
|
153
154
|
if (c && c.message === i && c.detail === o && c.recovered === n) {
|
|
154
155
|
let e = {
|
|
155
156
|
...c,
|
|
@@ -174,11 +175,11 @@ var V = {
|
|
|
174
175
|
let t = n(e);
|
|
175
176
|
if (u(e, t), t) {
|
|
176
177
|
let t = performance.now();
|
|
177
|
-
t - D.current.at >
|
|
178
|
+
t - D.current.at > re && (D.current = {
|
|
178
179
|
count: 0,
|
|
179
180
|
at: t
|
|
180
181
|
});
|
|
181
|
-
let n =
|
|
182
|
+
let n = K[Math.min(D.current.count, K.length - 1)];
|
|
182
183
|
D.current = {
|
|
183
184
|
count: D.current.count + 1,
|
|
184
185
|
at: t
|
|
@@ -215,13 +216,13 @@ var V = {
|
|
|
215
216
|
onSeek: (e) => N.current?.(e),
|
|
216
217
|
onSubtitleStreams: (e) => {
|
|
217
218
|
r || a.setSourceState({
|
|
218
|
-
subtitleTracks:
|
|
219
|
+
subtitleTracks: G(e),
|
|
219
220
|
...j.current ? {} : { selectedSubtitleTrack: e[0]?.streamIndex }
|
|
220
221
|
});
|
|
221
222
|
},
|
|
222
223
|
onAudioStreams: (e, t) => {
|
|
223
224
|
r || a.setSourceState({
|
|
224
|
-
audioTracks:
|
|
225
|
+
audioTracks: G(e),
|
|
225
226
|
selectedAudioTrack: t
|
|
226
227
|
});
|
|
227
228
|
}
|
|
@@ -261,13 +262,13 @@ var V = {
|
|
|
261
262
|
y,
|
|
262
263
|
T
|
|
263
264
|
]);
|
|
264
|
-
},
|
|
265
|
+
}, se = 5e3, ce = 6e4, le = ({ publicPath: e, workerUrl: t, length: n, read: i, downloadedRanges: a }) => {
|
|
265
266
|
let [o, s] = m([]), c = p(null), l = p(i);
|
|
266
267
|
l.current = i;
|
|
267
268
|
let h = f(() => a?.map(({ startByteOffset: e, endByteOffset: t }) => [e, t]), [a?.map(({ startByteOffset: e, endByteOffset: t }) => `${e}-${t}`).join(",")]), g = p(h);
|
|
268
269
|
return g.current = h, d(() => {
|
|
269
270
|
if (!n || !i || !e || !t) return;
|
|
270
|
-
let a = !1, o = null, u, d =
|
|
271
|
+
let a = !1, o = null, u, d = se, f = () => {
|
|
271
272
|
r({
|
|
272
273
|
publicPath: e,
|
|
273
274
|
workerUrl: t,
|
|
@@ -283,7 +284,7 @@ var V = {
|
|
|
283
284
|
}
|
|
284
285
|
o = e, c.current = e, e.update(g.current);
|
|
285
286
|
}, () => {
|
|
286
|
-
a || (u = setTimeout(f, d), d = Math.min(d * 2,
|
|
287
|
+
a || (u = setTimeout(f, d), d = Math.min(d * 2, ce));
|
|
287
288
|
});
|
|
288
289
|
};
|
|
289
290
|
return f(), () => {
|
|
@@ -301,7 +302,7 @@ var V = {
|
|
|
301
302
|
c.current?.prioritize(e);
|
|
302
303
|
}, [])
|
|
303
304
|
};
|
|
304
|
-
},
|
|
305
|
+
}, ue = (e, n) => {
|
|
305
306
|
let r = p(null), [i, o] = m(!1), [s] = m(() => t());
|
|
306
307
|
d(() => {
|
|
307
308
|
if (!e || !n || !s) return;
|
|
@@ -329,10 +330,10 @@ var V = {
|
|
|
329
330
|
mode: s,
|
|
330
331
|
burnedIn: i
|
|
331
332
|
};
|
|
332
|
-
},
|
|
333
|
-
let t =
|
|
333
|
+
}, de = "(hover: hover) and (pointer: fine)", fe = () => typeof matchMedia == "function" ? matchMedia(de) : void 0, pe = (e) => {
|
|
334
|
+
let t = fe();
|
|
334
335
|
return t?.addEventListener("change", e), () => t?.removeEventListener("change", e);
|
|
335
|
-
},
|
|
336
|
+
}, me = () => !!fe()?.matches, he = () => !1, ge = (e, t) => {
|
|
336
337
|
let [n, r] = m(!1), [i, a] = m(), o = p(t);
|
|
337
338
|
t && (o.current = t);
|
|
338
339
|
let s = p(!1), c = u((e) => {
|
|
@@ -355,7 +356,7 @@ var V = {
|
|
|
355
356
|
_,
|
|
356
357
|
g
|
|
357
358
|
]);
|
|
358
|
-
let v = h(me, he
|
|
359
|
+
let v = h(pe, me, he), [y, b] = m(!1);
|
|
359
360
|
d(() => {
|
|
360
361
|
if (!_) return;
|
|
361
362
|
let e = (e) => {
|
|
@@ -396,7 +397,7 @@ var V = {
|
|
|
396
397
|
g,
|
|
397
398
|
S
|
|
398
399
|
]);
|
|
399
|
-
},
|
|
400
|
+
}, Y = {
|
|
400
401
|
headings: {
|
|
401
402
|
large: "\n font-weight: 600;\n font-size: calc(2.8 * var(--mp-unit));\n line-height: calc(3.4 * var(--mp-unit));\n @media (min-width: 960px) {\n font-size: calc(3.4 * var(--mp-unit));\n line-height: calc(4.1 * var(--mp-unit));\n }\n ",
|
|
402
403
|
medium: "\n font-weight: 600;\n font-size: calc(2.4 * var(--mp-unit));\n line-height: calc(2.9 * var(--mp-unit));\n @media (min-width: 960px) {\n font-size: calc(2.8 * var(--mp-unit));\n line-height: calc(3.4 * var(--mp-unit));\n }\n ",
|
|
@@ -423,7 +424,7 @@ var V = {
|
|
|
423
424
|
medium: "\n font-weight: 500;\n font-size: calc(0.8 * var(--mp-unit));\n line-height: calc(1.1 * var(--mp-unit));\n @media (min-width: 960px) {\n font-size: calc(1 * var(--mp-unit));\n line-height: calc(1.4 * var(--mp-unit));\n }\n ",
|
|
424
425
|
regular: "\n font-weight: 400;\n font-size: calc(0.8 * var(--mp-unit));\n line-height: calc(1.1 * var(--mp-unit));\n @media (min-width: 960px) {\n font-size: calc(1 * var(--mp-unit));\n line-height: calc(1.4 * var(--mp-unit));\n }\n "
|
|
425
426
|
}
|
|
426
|
-
},
|
|
427
|
+
}, _e = g`
|
|
427
428
|
display: flex;
|
|
428
429
|
justify-content: center;
|
|
429
430
|
align-items: center;
|
|
@@ -436,7 +437,7 @@ var V = {
|
|
|
436
437
|
margin: auto;
|
|
437
438
|
pointer-events: none;
|
|
438
439
|
}
|
|
439
|
-
`,
|
|
440
|
+
`, ve = g`
|
|
440
441
|
position: absolute;
|
|
441
442
|
top: 0;
|
|
442
443
|
left: 0;
|
|
@@ -444,7 +445,7 @@ var V = {
|
|
|
444
445
|
padding: calc(1.2 * var(--mp-unit)) calc(1.6 * var(--mp-unit));
|
|
445
446
|
/* clears a notch once the player is fullscreen; resolves to zero everywhere else */
|
|
446
447
|
padding-top: calc(calc(1.2 * var(--mp-unit)) + env(safe-area-inset-top, 0px));
|
|
447
|
-
${
|
|
448
|
+
${Y.headings.small}
|
|
448
449
|
color: white;
|
|
449
450
|
text-shadow: 0 0 4px rgba(0, 0, 0, 1);
|
|
450
451
|
z-index: 2;
|
|
@@ -465,9 +466,9 @@ var V = {
|
|
|
465
466
|
|
|
466
467
|
background: linear-gradient(180deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.3) 30%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.1) 80%, transparent 100%);
|
|
467
468
|
transition: opacity 0.1s cubic-bezier(.4,0,1,1);
|
|
468
|
-
`,
|
|
469
|
+
`, ye = _`
|
|
469
470
|
to { transform: rotate(360deg); }
|
|
470
|
-
`,
|
|
471
|
+
`, be = g`
|
|
471
472
|
position: absolute;
|
|
472
473
|
inset: 0;
|
|
473
474
|
z-index: 2;
|
|
@@ -483,46 +484,46 @@ var V = {
|
|
|
483
484
|
border-radius: 50%;
|
|
484
485
|
border: 3px solid rgba(255, 255, 255, 0.25);
|
|
485
486
|
border-top-color: #fff;
|
|
486
|
-
animation: ${
|
|
487
|
+
animation: ${ye} 0.8s linear infinite;
|
|
487
488
|
}
|
|
488
|
-
`,
|
|
489
|
+
`, xe = g`
|
|
489
490
|
position: absolute;
|
|
490
491
|
inset: auto 0 20%;
|
|
491
492
|
z-index: 3;
|
|
492
493
|
padding: 0 calc(2 * var(--mp-unit));
|
|
493
494
|
text-align: center;
|
|
494
495
|
color: #fff;
|
|
495
|
-
${
|
|
496
|
+
${Y.bLarge.regular}
|
|
496
497
|
text-shadow: 0 0 4px rgba(0, 0, 0, 1);
|
|
497
498
|
pointer-events: none;
|
|
498
|
-
`,
|
|
499
|
-
let t =
|
|
499
|
+
`, Se = (e) => e instanceof Error ? e.message : typeof e == "string" ? e : "Playback failed", Ce = ({ onSubtitleRef: e }) => {
|
|
500
|
+
let t = U((e) => e.title), n = U((e) => e.hideUI), r = U((e) => e.playbackError), i = U((e) => e.ready), a = U((e) => e.size), o = U((e) => e.waiting), s = U((e) => e.seekingTo);
|
|
500
501
|
return /* @__PURE__ */ T(C, { children: [
|
|
501
502
|
t ? /* @__PURE__ */ w("div", {
|
|
502
503
|
className: "title",
|
|
503
|
-
css:
|
|
504
|
+
css: ve,
|
|
504
505
|
style: { ...n ? {
|
|
505
506
|
opacity: "0",
|
|
506
507
|
pointerEvents: "none"
|
|
507
508
|
} : {} },
|
|
508
509
|
children: t
|
|
509
510
|
}) : void 0,
|
|
510
|
-
((a ? !i : o) || s !== void 0) && !r ? /* @__PURE__ */ w("div", { css:
|
|
511
|
+
((a ? !i : o) || s !== void 0) && !r ? /* @__PURE__ */ w("div", { css: be }) : void 0,
|
|
511
512
|
r ? /* @__PURE__ */ w("div", {
|
|
512
|
-
css:
|
|
513
|
-
children:
|
|
513
|
+
css: xe,
|
|
514
|
+
children: Se(r)
|
|
514
515
|
}) : void 0,
|
|
515
516
|
/* @__PURE__ */ w("div", {
|
|
516
517
|
className: "subtitles",
|
|
517
518
|
ref: e,
|
|
518
|
-
css:
|
|
519
|
+
css: _e
|
|
519
520
|
})
|
|
520
521
|
] });
|
|
521
|
-
},
|
|
522
|
+
}, we = 1e-4, Te = 1, Ee = (e) => Math.max(we, Math.min(Te, e)) ** 2, De = (e) => Math.max(we, Math.min(Te, e)) ** (Te / 2), X = (e) => {
|
|
522
523
|
if (e === void 0) return "0:00";
|
|
523
524
|
let t = Math.floor(e / 3600), n = Math.floor(e % 3600 / 60), r = Math.floor(e % 60);
|
|
524
525
|
return t > 0 ? `${t}:${n < 10 ? "0" : ""}${n}:${r < 10 ? "0" : ""}${r}` : `${n}:${r < 10 ? "0" : ""}${r}`;
|
|
525
|
-
},
|
|
526
|
+
}, Oe = (e, t) => `${X(e)} / ${X(t)}`, ke = (e) => g`
|
|
526
527
|
display: flex;
|
|
527
528
|
justify-content: flex-start;
|
|
528
529
|
|
|
@@ -554,7 +555,7 @@ var V = {
|
|
|
554
555
|
z-index: 3;
|
|
555
556
|
|
|
556
557
|
* {
|
|
557
|
-
${
|
|
558
|
+
${Y.bMedium.regular}
|
|
558
559
|
}
|
|
559
560
|
|
|
560
561
|
${e === "sm" && g`
|
|
@@ -566,25 +567,25 @@ var V = {
|
|
|
566
567
|
${e === "lg" && g`
|
|
567
568
|
padding: calc(1.2 * var(--mp-unit))!important;
|
|
568
569
|
`}
|
|
569
|
-
`,
|
|
570
|
+
`, Z = {
|
|
570
571
|
x: -1,
|
|
571
572
|
y: -1,
|
|
572
573
|
anchors: 0
|
|
573
|
-
},
|
|
574
|
-
|
|
575
|
-
},
|
|
574
|
+
}, Ae = (e) => {
|
|
575
|
+
Z.x = e.clientX, Z.y = e.clientY;
|
|
576
|
+
}, je = () => (Z.anchors++ === 0 && window.addEventListener("pointermove", Ae, {
|
|
576
577
|
capture: !0,
|
|
577
578
|
passive: !0
|
|
578
579
|
}), () => {
|
|
579
|
-
--
|
|
580
|
-
}),
|
|
580
|
+
--Z.anchors === 0 && window.removeEventListener("pointermove", Ae, { capture: !0 });
|
|
581
|
+
}), Q = ({ id: e, toolTipText: t, text: n, delayShow: r = 0, closeDelay: i = 0, offset: a = 20, tooltipPlace: o = "top", disabled: s = !1, size: c = "md" }) => {
|
|
581
582
|
let l = p(null), u = p(null);
|
|
582
583
|
return d(() => {
|
|
583
|
-
let e =
|
|
584
|
+
let e = je(), t = () => {
|
|
584
585
|
let e = l.current;
|
|
585
586
|
if (!e) return;
|
|
586
587
|
let { left: t, right: n, top: r, bottom: i } = e.getBoundingClientRect();
|
|
587
|
-
|
|
588
|
+
Z.x >= t && Z.x < n && Z.y >= r && Z.y < i || u.current?.close();
|
|
588
589
|
}, n = ["fullscreenchange", "webkitfullscreenchange"];
|
|
589
590
|
for (let e of n) document.addEventListener(e, t);
|
|
590
591
|
return () => {
|
|
@@ -600,14 +601,14 @@ var V = {
|
|
|
600
601
|
"data-tooltip-delay-hide": i,
|
|
601
602
|
"data-tooltip-place": o,
|
|
602
603
|
children: n
|
|
603
|
-
}), !s && /* @__PURE__ */ w(
|
|
604
|
+
}), !s && /* @__PURE__ */ w(ee, {
|
|
604
605
|
ref: u,
|
|
605
|
-
css:
|
|
606
|
+
css: ke(c),
|
|
606
607
|
id: e,
|
|
607
608
|
noArrow: !0,
|
|
608
609
|
children: t
|
|
609
610
|
})] });
|
|
610
|
-
},
|
|
611
|
+
}, Me = ({ ref: e, onChange: t, orientation: n = "horizontal", disabled: r = !1 }) => {
|
|
611
612
|
let [i, a] = m(!1), o = p(t);
|
|
612
613
|
o.current = t;
|
|
613
614
|
let s = p(null), c = u((t, r) => {
|
|
@@ -646,26 +647,26 @@ var V = {
|
|
|
646
647
|
style: { touchAction: "none" }
|
|
647
648
|
}
|
|
648
649
|
};
|
|
649
|
-
},
|
|
650
|
+
}, Ne = 2, Pe = .005, Fe = "#000", Ie = "#0000", Le = (e, t) => {
|
|
650
651
|
if (!t) return [];
|
|
651
652
|
let n = /* @__PURE__ */ new Set();
|
|
652
653
|
for (let { start: r, end: i } of e) for (let e of [r, i]) {
|
|
653
654
|
let r = e / t;
|
|
654
|
-
r <=
|
|
655
|
+
r <= Pe || r >= .995 || n.add(Number((r * 100).toFixed(4)));
|
|
655
656
|
}
|
|
656
657
|
return n.size ? [
|
|
657
658
|
0,
|
|
658
659
|
...[...n].sort((e, t) => e - t),
|
|
659
660
|
100
|
|
660
661
|
] : [];
|
|
661
|
-
},
|
|
662
|
-
let n =
|
|
662
|
+
}, Re = (e, t) => {
|
|
663
|
+
let n = Ne / 2, r = e.length - 2, i = [];
|
|
663
664
|
for (let a = 0; a <= r; a += 1) {
|
|
664
665
|
let o = e[a], s = e[a + 1], c = a === 0 ? "0%" : `calc(${o}% + ${n}px)`, l = a === r ? "100%" : `calc(${s}% - ${n}px)`;
|
|
665
|
-
i.push(`${t(a) ?
|
|
666
|
+
i.push(`${t(a) ? Fe : Ie} ${c} ${l}`), a !== r && i.push(`${Ie} calc(${s}% - ${n}px) calc(${s}% + ${n}px)`);
|
|
666
667
|
}
|
|
667
668
|
return `linear-gradient(90deg, ${i.join(", ")})`;
|
|
668
|
-
},
|
|
669
|
+
}, ze = /* @__PURE__ */ new Set([
|
|
669
670
|
"op",
|
|
670
671
|
"ops",
|
|
671
672
|
"opening",
|
|
@@ -673,7 +674,7 @@ var V = {
|
|
|
673
674
|
"ncop",
|
|
674
675
|
"オープニング",
|
|
675
676
|
"op主題歌"
|
|
676
|
-
]),
|
|
677
|
+
]), Be = /* @__PURE__ */ new Set([
|
|
677
678
|
"ed",
|
|
678
679
|
"eds",
|
|
679
680
|
"ending",
|
|
@@ -686,13 +687,13 @@ var V = {
|
|
|
686
687
|
"エンドカード",
|
|
687
688
|
"エンドロール",
|
|
688
689
|
"ed主題歌"
|
|
689
|
-
]),
|
|
690
|
+
]), Ve = /* @__PURE__ */ new Set(["intro", "イントロ"]), He = /* @__PURE__ */ new Set(["outro", "アウトロ"]), Ue = {
|
|
690
691
|
"credits start": "ending",
|
|
691
692
|
"credits end": null,
|
|
692
693
|
"preview end": null,
|
|
693
694
|
"end credits": "ending",
|
|
694
695
|
"closing credits": "ending"
|
|
695
|
-
},
|
|
696
|
+
}, We = /* @__PURE__ */ new Set([
|
|
696
697
|
"theme",
|
|
697
698
|
"themes",
|
|
698
699
|
"song",
|
|
@@ -711,53 +712,53 @@ var V = {
|
|
|
711
712
|
"the",
|
|
712
713
|
"主題歌",
|
|
713
714
|
"ノンクレジット"
|
|
714
|
-
]),
|
|
715
|
+
]), Ge = /* @__PURE__ */ new Set([
|
|
715
716
|
"post",
|
|
716
717
|
"pre",
|
|
717
718
|
"after",
|
|
718
719
|
"before",
|
|
719
720
|
"non"
|
|
720
|
-
]),
|
|
721
|
-
if (
|
|
722
|
-
if (
|
|
721
|
+
]), Ke = /[-:|~/\\[\]()「」『』【】,.!?"'’]|\s+by\s+/u, qe = (e) => !e.trim() || /^chapter\s*\d+$/i.test(e.trim()) || /^\d{1,2}:\d{2}:\d{2}([.,]\d+)?$/.test(e.trim()), Je = (e) => e.replace(/([a-z-ヿ一-鿿])\s*\d+\s*$/u, "$1").split(/[\s_]+/u).map((e) => e.replace(/^[^\w-ヿ一-鿿]+|[^\w-ヿ一-鿿]+$/gu, "")).filter((e) => e && !/^\d+$/.test(e) && !We.has(e)), Ye = (e, t) => {
|
|
722
|
+
if (ze.has(e)) return "opening";
|
|
723
|
+
if (Be.has(e)) return "ending";
|
|
723
724
|
if (t) {
|
|
724
|
-
if (
|
|
725
|
-
if (
|
|
725
|
+
if (Ve.has(e)) return "opening";
|
|
726
|
+
if (He.has(e)) return "ending";
|
|
726
727
|
}
|
|
727
|
-
},
|
|
728
|
-
if (
|
|
728
|
+
}, Xe = (e, t) => {
|
|
729
|
+
if (qe(e)) return;
|
|
729
730
|
let n = e.trim().toLowerCase().replace(/\s+/gu, " ");
|
|
730
|
-
if (n in
|
|
731
|
-
let r = n.split(
|
|
732
|
-
if (r.some((e) => e.split(/[\s_]+/u).some((e) =>
|
|
731
|
+
if (n in Ue) return Ue[n] ?? void 0;
|
|
732
|
+
let r = n.split(Ke).map((e) => e.trim()).filter(Boolean);
|
|
733
|
+
if (r.some((e) => e.split(/[\s_]+/u).some((e) => Ge.has(e)))) return;
|
|
733
734
|
let i = r.length > 1 ? [r[0], r.at(-1)] : r;
|
|
734
735
|
for (let e of i) {
|
|
735
|
-
let n =
|
|
736
|
+
let n = Je(e);
|
|
736
737
|
if (n.length !== 1) continue;
|
|
737
|
-
let r =
|
|
738
|
+
let r = Ye(n[0], t);
|
|
738
739
|
if (r) return r;
|
|
739
740
|
}
|
|
740
|
-
},
|
|
741
|
+
}, Ze = 15, Qe = 87, $e = 93, et = (e) => {
|
|
741
742
|
let t = e.map(() => void 0), n = e.at(-1)?.end ?? 0;
|
|
742
743
|
if (!n) return t;
|
|
743
744
|
let r = e.map((e, t) => ({
|
|
744
745
|
index: t,
|
|
745
746
|
start: e.start,
|
|
746
747
|
length: e.end - e.start
|
|
747
|
-
})).filter(({ length: e }) => e >=
|
|
748
|
+
})).filter(({ length: e }) => e >= Qe && e <= $e), i = n / 2, a = r.filter(({ start: e }) => e < i), o = r.filter(({ start: e }) => e >= i);
|
|
748
749
|
return a.length === 1 && (t[a[0].index] = "opening"), o.length === 1 && (t[o[0].index] = "ending"), t;
|
|
749
|
-
},
|
|
750
|
-
let t = e.map(({ title: e }) =>
|
|
750
|
+
}, tt = (e) => {
|
|
751
|
+
let t = e.map(({ title: e }) => Xe(e, !1)), n = e.reduce((e, n, r) => e + (t[r] ? n.end - n.start : 0), 0), r = e.reduce((e, t) => e + (t.end - t.start), 0);
|
|
751
752
|
if (r > 0 && n * 2 > r) return e.map(() => void 0);
|
|
752
753
|
let i = e.map((e, n) => {
|
|
753
|
-
if (e.end - e.start <
|
|
754
|
+
if (e.end - e.start < Ze) return;
|
|
754
755
|
let r = t[n];
|
|
755
756
|
if (r) return r;
|
|
756
|
-
let i =
|
|
757
|
+
let i = Xe(e.title, !0);
|
|
757
758
|
return i && !t.includes(i) ? i : void 0;
|
|
758
759
|
});
|
|
759
|
-
return
|
|
760
|
-
},
|
|
760
|
+
return e.every(({ title: e }) => qe(e)) ? et(e) : i;
|
|
761
|
+
}, nt = g`
|
|
761
762
|
position: relative;
|
|
762
763
|
height: calc(.4 * var(--mp-unit));
|
|
763
764
|
|
|
@@ -842,7 +843,7 @@ var V = {
|
|
|
842
843
|
box-shadow: 0 0 calc(1 * var(--mp-unit)) rgba(0, 0, 0, .5);
|
|
843
844
|
|
|
844
845
|
text-shadow: 0 0 4px rgba(0, 0, 0, 1);
|
|
845
|
-
${
|
|
846
|
+
${Y.bMedium.bold}
|
|
846
847
|
|
|
847
848
|
gap: calc(.6 * var(--mp-unit));
|
|
848
849
|
|
|
@@ -976,38 +977,46 @@ var V = {
|
|
|
976
977
|
--thumbnail-width: calc(18 * var(--mp-unit));
|
|
977
978
|
--thumbnail-half: calc(9 * var(--mp-unit));
|
|
978
979
|
}
|
|
979
|
-
`,
|
|
980
|
-
let e =
|
|
981
|
-
|
|
982
|
-
},
|
|
983
|
-
|
|
980
|
+
`, rt = 4, it = () => {
|
|
981
|
+
let e = U(), t = U((e) => e.currentTime), n = U((e) => e.requestSeek), r = U((e) => e.duration), i = U((e) => e.size), a = U((e) => e.downloadedRanges), o = U((e) => e.buffered), s = U((e) => e.indexes), c = U((e) => e.thumbnails), l = U((e) => e.thumbnailAt), u = U((e) => e.requestThumbnail), h = U((e) => e.chapters), g = U((e) => e.seekingTo), _ = U((e) => e.setSourceState), v = U((e) => e.hideUI), y = p(null), [b, x] = m(void 0), [S, C] = m(void 0), E = (e) => {
|
|
982
|
+
C(e), u(e);
|
|
983
|
+
}, D = !!S;
|
|
984
|
+
d(() => {
|
|
985
|
+
if (D) return _({ seekPreview: !0 }), () => _({ seekPreview: !1 });
|
|
986
|
+
}, [_, D]), d(() => {
|
|
987
|
+
v && E(void 0);
|
|
988
|
+
}, [v]);
|
|
989
|
+
let O = p(void 0), k = p(0), A = p(void 0), j = p(void 0), M = p(!1), { dragging: N, handlers: P } = Me({
|
|
990
|
+
ref: y,
|
|
984
991
|
onChange: (e) => {
|
|
985
|
-
if (
|
|
986
|
-
else if (!
|
|
987
|
-
let t =
|
|
988
|
-
Math.abs(e -
|
|
992
|
+
if (k.current += 1, A.current = e, j.current === void 0) j.current = e;
|
|
993
|
+
else if (!M.current) {
|
|
994
|
+
let t = y.current?.getBoundingClientRect().width ?? 0;
|
|
995
|
+
Math.abs(e - j.current) * t > rt && (M.current = !0);
|
|
989
996
|
}
|
|
990
|
-
|
|
997
|
+
x(e), O.current !== "mouse" && E(e * r);
|
|
991
998
|
}
|
|
992
|
-
}),
|
|
993
|
-
|
|
994
|
-
},
|
|
995
|
-
|
|
996
|
-
let i =
|
|
999
|
+
}), F = (e) => {
|
|
1000
|
+
O.current = e.pointerType, k.current = 0, j.current = void 0, M.current = !1, P.onPointerDown(e);
|
|
1001
|
+
}, I = (t) => {
|
|
1002
|
+
P.onPointerUp(t);
|
|
1003
|
+
let i = k.current > 0 ? A.current : void 0;
|
|
997
1004
|
if (i !== void 0 && r) {
|
|
998
1005
|
let t = i * r;
|
|
999
1006
|
n ? n(t) : e.seek(t);
|
|
1000
1007
|
}
|
|
1001
|
-
|
|
1002
|
-
},
|
|
1003
|
-
if (!
|
|
1004
|
-
let { left: t, right: n } =
|
|
1008
|
+
k.current = 0, M.current = !1, j.current = void 0, t.pointerType !== "mouse" && E(void 0);
|
|
1009
|
+
}, L = (e) => {
|
|
1010
|
+
if (!y.current) return;
|
|
1011
|
+
let { left: t, right: n } = y.current.getBoundingClientRect();
|
|
1005
1012
|
return Math.min(Math.max((e - t) / (n - t), 0), 1) * r;
|
|
1006
|
-
},
|
|
1007
|
-
|
|
1008
|
-
},
|
|
1009
|
-
|
|
1010
|
-
},
|
|
1013
|
+
}, R = p("mouse"), z = (e) => {
|
|
1014
|
+
R.current = e.pointerType;
|
|
1015
|
+
}, ee = (e) => {
|
|
1016
|
+
R.current !== "touch" && E(L(e.clientX));
|
|
1017
|
+
}, B = () => {
|
|
1018
|
+
y.current && E(void 0);
|
|
1019
|
+
}, V = (e) => r ? e / r * 100 : 0, H = (e, t, n) => {
|
|
1011
1020
|
let r = Number((n - t).toFixed(4)), i = t * 100;
|
|
1012
1021
|
return /* @__PURE__ */ w("div", {
|
|
1013
1022
|
className: "loaded-part",
|
|
@@ -1016,10 +1025,10 @@ var V = {
|
|
|
1016
1025
|
marginLeft: `${i}%`
|
|
1017
1026
|
}
|
|
1018
1027
|
}, e);
|
|
1019
|
-
},
|
|
1028
|
+
}, te = f(() => i === void 0 ? r ? o.map(([e, t], n) => H(n, e / r, t / r)) : [] : a?.map((e, t) => {
|
|
1020
1029
|
if (!i || !r) return null;
|
|
1021
1030
|
let n = s.filter((t) => e.startByteOffset <= t.pos && t.pos <= e.endByteOffset), a = n.at(0), o = n.at(-1);
|
|
1022
|
-
return !a || !o ? null :
|
|
1031
|
+
return !a || !o ? null : H(t, a.timestamp / r, o.timestamp / r);
|
|
1023
1032
|
}) ?? [], [
|
|
1024
1033
|
r,
|
|
1025
1034
|
i,
|
|
@@ -1028,111 +1037,113 @@ var V = {
|
|
|
1028
1037
|
a?.map(({ startByteOffset: e, endByteOffset: t }) => `${e}/${t}`).join(",")
|
|
1029
1038
|
]);
|
|
1030
1039
|
d(() => {
|
|
1031
|
-
|
|
1040
|
+
b !== void 0 && r && N && M.current && e.seek(b * r);
|
|
1032
1041
|
}, [
|
|
1033
1042
|
e,
|
|
1034
|
-
|
|
1035
|
-
|
|
1043
|
+
N,
|
|
1044
|
+
b,
|
|
1036
1045
|
r
|
|
1037
1046
|
]);
|
|
1038
|
-
let
|
|
1047
|
+
let ne = f(() => {
|
|
1039
1048
|
if (!r) return 0;
|
|
1040
|
-
if (
|
|
1049
|
+
if (N && b !== void 0) return b;
|
|
1041
1050
|
let e = g ?? t;
|
|
1042
1051
|
return typeof e == "number" ? e / r : 0;
|
|
1043
1052
|
}, [
|
|
1044
1053
|
r,
|
|
1045
1054
|
t,
|
|
1046
|
-
|
|
1047
|
-
|
|
1055
|
+
N,
|
|
1056
|
+
b,
|
|
1048
1057
|
g
|
|
1049
|
-
]),
|
|
1050
|
-
if (!
|
|
1051
|
-
let e =
|
|
1052
|
-
return t >= 0 ? t :
|
|
1058
|
+
]), W = f(() => Le(h, r), [h, r]), G = W.length > 0, K = f(() => {
|
|
1059
|
+
if (!G || S === void 0 || !r) return -1;
|
|
1060
|
+
let e = S / r * 100, t = W.findIndex((t, n) => n < W.length - 1 && e >= t && e < W[n + 1]);
|
|
1061
|
+
return t >= 0 ? t : W.length - 2;
|
|
1053
1062
|
}, [
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
|
|
1063
|
+
G,
|
|
1064
|
+
W,
|
|
1065
|
+
S,
|
|
1057
1066
|
r
|
|
1058
|
-
]),
|
|
1059
|
-
|
|
1060
|
-
|
|
1061
|
-
|
|
1062
|
-
]),
|
|
1063
|
-
if (
|
|
1064
|
-
}, [h,
|
|
1065
|
-
if (
|
|
1066
|
-
if (l) return l(
|
|
1067
|
-
if (c.length) return c.find(({ startTime: e, endTime: t }) => e <=
|
|
1067
|
+
]), re = f(() => G ? Re(W, (e) => e !== K) : void 0, [
|
|
1068
|
+
G,
|
|
1069
|
+
W,
|
|
1070
|
+
K
|
|
1071
|
+
]), ie = f(() => K >= 0 ? Re(W, (e) => e === K) : void 0, [W, K]), q = f(() => {
|
|
1072
|
+
if (S !== void 0) return h.find(({ start: e, end: t }) => e <= S && S < t);
|
|
1073
|
+
}, [h, S]), J = f(() => {
|
|
1074
|
+
if (S) {
|
|
1075
|
+
if (l) return l(S);
|
|
1076
|
+
if (c.length) return c.find(({ startTime: e, endTime: t }) => e <= S && S < t);
|
|
1068
1077
|
}
|
|
1069
1078
|
}, [
|
|
1070
1079
|
c,
|
|
1071
1080
|
l,
|
|
1072
|
-
|
|
1073
|
-
]),
|
|
1081
|
+
S
|
|
1082
|
+
]), ae = (e, t) => /* @__PURE__ */ T("div", {
|
|
1074
1083
|
className: e ? `track ${e}` : "track",
|
|
1075
1084
|
style: t ? { maskImage: t } : void 0,
|
|
1076
1085
|
children: [
|
|
1077
1086
|
/* @__PURE__ */ w("div", { className: "background-bar" }),
|
|
1078
1087
|
/* @__PURE__ */ w("div", {
|
|
1079
1088
|
className: "loaded",
|
|
1080
|
-
children:
|
|
1089
|
+
children: te
|
|
1081
1090
|
}),
|
|
1082
1091
|
/* @__PURE__ */ w("div", {
|
|
1083
1092
|
className: "play-container",
|
|
1084
1093
|
children: /* @__PURE__ */ w("div", {
|
|
1085
1094
|
className: "play",
|
|
1086
|
-
style: { transform: `scaleX(${
|
|
1095
|
+
style: { transform: `scaleX(${ne})` }
|
|
1087
1096
|
})
|
|
1088
1097
|
})
|
|
1089
1098
|
]
|
|
1090
1099
|
});
|
|
1091
1100
|
return /* @__PURE__ */ T("div", {
|
|
1092
|
-
css:
|
|
1093
|
-
ref:
|
|
1101
|
+
css: nt,
|
|
1102
|
+
ref: y,
|
|
1094
1103
|
className: [
|
|
1095
1104
|
"progress-bar",
|
|
1096
|
-
|
|
1097
|
-
|
|
1105
|
+
N ? "dragging" : "",
|
|
1106
|
+
G ? "segmented" : ""
|
|
1098
1107
|
].filter(Boolean).join(" "),
|
|
1099
|
-
|
|
1100
|
-
|
|
1108
|
+
onPointerDown: z,
|
|
1109
|
+
onPointerMove: z,
|
|
1110
|
+
onMouseMove: ee,
|
|
1111
|
+
onMouseOut: B,
|
|
1101
1112
|
children: [
|
|
1102
|
-
|
|
1103
|
-
|
|
1113
|
+
ae(void 0, re),
|
|
1114
|
+
S ? /* @__PURE__ */ T("div", {
|
|
1104
1115
|
className: "cursor-time",
|
|
1105
1116
|
style: {
|
|
1106
|
-
left:
|
|
1107
|
-
maxWidth:
|
|
1117
|
+
left: q ? `clamp(var(--thumbnail-half), ${V(S)}%, calc(100% - var(--thumbnail-half)))` : `clamp(calc(3 * var(--mp-unit)), ${V(S)}%, calc(100% - calc(3 * var(--mp-unit))))`,
|
|
1118
|
+
maxWidth: q ? "var(--thumbnail-width)" : void 0
|
|
1108
1119
|
},
|
|
1109
1120
|
children: [/* @__PURE__ */ w("span", {
|
|
1110
1121
|
className: "cursor-time-value",
|
|
1111
|
-
children:
|
|
1112
|
-
}),
|
|
1122
|
+
children: X(S)
|
|
1123
|
+
}), q ? /* @__PURE__ */ w("span", {
|
|
1113
1124
|
className: "chapter-title",
|
|
1114
|
-
children:
|
|
1125
|
+
children: q.title
|
|
1115
1126
|
}) : void 0]
|
|
1116
1127
|
}) : void 0,
|
|
1117
1128
|
/* @__PURE__ */ w("div", { className: "progress" }),
|
|
1118
1129
|
/* @__PURE__ */ w("div", { className: "hover" }),
|
|
1119
|
-
|
|
1130
|
+
ie ? ae("focus", ie) : void 0,
|
|
1120
1131
|
/* @__PURE__ */ w("div", { className: "scrubber" }),
|
|
1121
1132
|
/* @__PURE__ */ w("div", {
|
|
1122
1133
|
className: "padding",
|
|
1123
|
-
...
|
|
1124
|
-
onPointerDown:
|
|
1125
|
-
onPointerUp:
|
|
1126
|
-
onPointerCancel:
|
|
1134
|
+
...P,
|
|
1135
|
+
onPointerDown: F,
|
|
1136
|
+
onPointerUp: I,
|
|
1137
|
+
onPointerCancel: I
|
|
1127
1138
|
}),
|
|
1128
1139
|
/* @__PURE__ */ w("div", {
|
|
1129
1140
|
className: "thumbnail",
|
|
1130
|
-
style: { left: `clamp(var(--thumbnail-half), ${
|
|
1131
|
-
children:
|
|
1141
|
+
style: { left: `clamp(var(--thumbnail-half), ${V(S ?? 1)}%, calc(100% - var(--thumbnail-half)))` },
|
|
1142
|
+
children: J?.url ? /* @__PURE__ */ w("img", { src: J.url }) : void 0
|
|
1132
1143
|
})
|
|
1133
1144
|
]
|
|
1134
1145
|
});
|
|
1135
|
-
},
|
|
1146
|
+
}, at = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23fff'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20class='icon%20icon-tabler%20icons-tabler-outline%20icon-tabler-picture-in-picture'%3e%3cpath%20stroke='none'%20d='M0%200h24v24H0z'%20fill='none'%20/%3e%3cpath%20d='M11%2019h-6a2%202%200%200%201%20-2%20-2v-10a2%202%200%200%201%202%20-2h14a2%202%200%200%201%202%202v4'%20/%3e%3cpath%20d='M14%2014m0%201a1%201%200%200%201%201%20-1h5a1%201%200%200%201%201%201v3a1%201%200%200%201%20-1%201h-5a1%201%200%200%201%20-1%20-1z'%20/%3e%3c/svg%3e", $ = {
|
|
1136
1147
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1137
1148
|
width: 24,
|
|
1138
1149
|
height: 24,
|
|
@@ -1142,8 +1153,8 @@ var V = {
|
|
|
1142
1153
|
strokeWidth: 2,
|
|
1143
1154
|
strokeLinecap: "round",
|
|
1144
1155
|
strokeLinejoin: "round"
|
|
1145
|
-
},
|
|
1146
|
-
|
|
1156
|
+
}, ot = (e) => /* @__PURE__ */ T("svg", {
|
|
1157
|
+
...$,
|
|
1147
1158
|
...e,
|
|
1148
1159
|
children: [/* @__PURE__ */ w("rect", {
|
|
1149
1160
|
x: "3",
|
|
@@ -1153,8 +1164,8 @@ var V = {
|
|
|
1153
1164
|
rx: "2",
|
|
1154
1165
|
ry: "2"
|
|
1155
1166
|
}), /* @__PURE__ */ w("path", { d: "M7 15h4m4 0h2M7 11h2m4 0h4" })]
|
|
1156
|
-
}),
|
|
1157
|
-
|
|
1167
|
+
}), st = (e) => /* @__PURE__ */ T("svg", {
|
|
1168
|
+
...$,
|
|
1158
1169
|
...e,
|
|
1159
1170
|
children: [
|
|
1160
1171
|
/* @__PURE__ */ w("rect", {
|
|
@@ -1173,8 +1184,8 @@ var V = {
|
|
|
1173
1184
|
y2: "22"
|
|
1174
1185
|
})
|
|
1175
1186
|
]
|
|
1176
|
-
}),
|
|
1177
|
-
|
|
1187
|
+
}), ct = (e) => /* @__PURE__ */ T("svg", {
|
|
1188
|
+
...$,
|
|
1178
1189
|
...e,
|
|
1179
1190
|
children: [
|
|
1180
1191
|
/* @__PURE__ */ w("path", { d: "M21 11V7a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h5" }),
|
|
@@ -1188,8 +1199,8 @@ var V = {
|
|
|
1188
1199
|
}),
|
|
1189
1200
|
/* @__PURE__ */ w("path", { d: "M14.5 18.5h2m2 0h1" })
|
|
1190
1201
|
]
|
|
1191
|
-
}),
|
|
1192
|
-
|
|
1202
|
+
}), lt = (e) => /* @__PURE__ */ T("svg", {
|
|
1203
|
+
...$,
|
|
1193
1204
|
...e,
|
|
1194
1205
|
children: [
|
|
1195
1206
|
/* @__PURE__ */ w("path", { d: "M21 11V7a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h5" }),
|
|
@@ -1203,7 +1214,7 @@ var V = {
|
|
|
1203
1214
|
}),
|
|
1204
1215
|
/* @__PURE__ */ w("path", { d: "M6 9h3m2 0h2" })
|
|
1205
1216
|
]
|
|
1206
|
-
}),
|
|
1217
|
+
}), ut = g`
|
|
1207
1218
|
.popover {
|
|
1208
1219
|
position: absolute;
|
|
1209
1220
|
/* Anchored to the PLAYER's right edge, never to the gear. The gear is not the last control in the
|
|
@@ -1242,7 +1253,7 @@ var V = {
|
|
|
1242
1253
|
|
|
1243
1254
|
border-radius: 8px;
|
|
1244
1255
|
background-color: rgba(28,28,28,0.95);
|
|
1245
|
-
${
|
|
1256
|
+
${Y.bMedium.regular}
|
|
1246
1257
|
|
|
1247
1258
|
z-index: 4;
|
|
1248
1259
|
|
|
@@ -1285,7 +1296,7 @@ var V = {
|
|
|
1285
1296
|
|
|
1286
1297
|
.secondary {
|
|
1287
1298
|
color: #eee;
|
|
1288
|
-
${
|
|
1299
|
+
${Y.bSmall.regular}
|
|
1289
1300
|
}
|
|
1290
1301
|
}
|
|
1291
1302
|
}
|
|
@@ -1327,10 +1338,10 @@ var V = {
|
|
|
1327
1338
|
.failed {
|
|
1328
1339
|
border-bottom: 1px solid #4D4D4E;
|
|
1329
1340
|
color: #f66;
|
|
1330
|
-
${
|
|
1341
|
+
${Y.bSmall.regular}
|
|
1331
1342
|
}
|
|
1332
1343
|
}
|
|
1333
|
-
`,
|
|
1344
|
+
`, dt = ({ title: e, tracks: t, selected: n, onSelect: r, onBack: i, offLabel: a, pending: o, failed: s }) => {
|
|
1334
1345
|
let c = o !== void 0, l = (e, i, a) => {
|
|
1335
1346
|
let s = c && o === e, l = c || t.find((t) => t.id === e)?.disabled;
|
|
1336
1347
|
return /* @__PURE__ */ T("div", {
|
|
@@ -1357,7 +1368,7 @@ var V = {
|
|
|
1357
1368
|
t.map(({ id: e, label: t }) => l(e, t, "description"))
|
|
1358
1369
|
]
|
|
1359
1370
|
});
|
|
1360
|
-
},
|
|
1371
|
+
}, ft = ({ onReset: e } = {}) => {
|
|
1361
1372
|
let t = p(null), [n, r] = m(!1), [i, a] = m(void 0), [o, s] = m(!1), c = p(e);
|
|
1362
1373
|
c.current = e;
|
|
1363
1374
|
let l = () => {
|
|
@@ -1398,7 +1409,7 @@ var V = {
|
|
|
1398
1409
|
});
|
|
1399
1410
|
}
|
|
1400
1411
|
};
|
|
1401
|
-
},
|
|
1412
|
+
}, pt = g`
|
|
1402
1413
|
/* Not a containing block, for the reason given on popoverStyle: the menu anchors to the control bar,
|
|
1403
1414
|
which is the width of the player box, so it can be clamped to it. */
|
|
1404
1415
|
position: static;
|
|
@@ -1414,7 +1425,7 @@ position: static;
|
|
|
1414
1425
|
}
|
|
1415
1426
|
}
|
|
1416
1427
|
|
|
1417
|
-
${
|
|
1428
|
+
${ut}
|
|
1418
1429
|
|
|
1419
1430
|
.popover.error-list {
|
|
1420
1431
|
/* Wider than a track menu and taller, because these rows are sentences rather than labels, and a
|
|
@@ -1442,7 +1453,7 @@ ${dt}
|
|
|
1442
1453
|
|
|
1443
1454
|
color: #fff;
|
|
1444
1455
|
cursor: pointer;
|
|
1445
|
-
${
|
|
1456
|
+
${Y.bSmall.regular}
|
|
1446
1457
|
|
|
1447
1458
|
&:hover {
|
|
1448
1459
|
background-color: rgba(255,255,255,.1);
|
|
@@ -1463,7 +1474,7 @@ ${dt}
|
|
|
1463
1474
|
|
|
1464
1475
|
.when {
|
|
1465
1476
|
color: #bbb;
|
|
1466
|
-
${
|
|
1477
|
+
${Y.bSmall.regular}
|
|
1467
1478
|
|
|
1468
1479
|
/* the one part of the line worth scanning for, so it is the one part at full brightness */
|
|
1469
1480
|
.count {
|
|
@@ -1482,29 +1493,29 @@ ${dt}
|
|
|
1482
1493
|
color: #ddd;
|
|
1483
1494
|
overflow-wrap: anywhere;
|
|
1484
1495
|
white-space: pre-wrap;
|
|
1485
|
-
${
|
|
1496
|
+
${Y.bSmall.regular}
|
|
1486
1497
|
}
|
|
1487
1498
|
}
|
|
1488
1499
|
}
|
|
1489
|
-
`,
|
|
1490
|
-
let n =
|
|
1500
|
+
`, mt = (e) => new Date(e).toLocaleTimeString(), ht = (e) => e === void 0 || !Number.isFinite(e) ? void 0 : X(Math.max(0, e)), gt = (e) => e.reduce((e, t) => e + t.count, 0), _t = (e) => e.map((e, t) => {
|
|
1501
|
+
let n = ht(e.atMediaTime), r = e.count > 1 ? `${new Date(e.at).toISOString()} to ${new Date(e.lastAt).toISOString()} ×${e.count}` : new Date(e.at).toISOString();
|
|
1491
1502
|
return [
|
|
1492
1503
|
`${t + 1}. ${r}${n ? ` (at ${n})` : ""}${e.recovered ? " [recovered]" : ""}`,
|
|
1493
1504
|
e.message,
|
|
1494
1505
|
e.detail
|
|
1495
1506
|
].filter(Boolean).join("\n");
|
|
1496
|
-
}).join("\n\n"),
|
|
1497
|
-
let e =
|
|
1507
|
+
}).join("\n\n"), vt = () => {
|
|
1508
|
+
let e = U((e) => e.playbackErrors), { open: t, toggle: n, containerRef: r } = ft(), [i, a] = m(!1);
|
|
1498
1509
|
if (e.length === 0) return null;
|
|
1499
1510
|
let o = () => {
|
|
1500
|
-
navigator.clipboard?.writeText(
|
|
1511
|
+
navigator.clipboard?.writeText(_t(e)).then(() => {
|
|
1501
1512
|
a(!0), setTimeout(() => a(!1), 2e3);
|
|
1502
1513
|
}, (e) => console.warn("[media-player] could not copy the errors:", e));
|
|
1503
|
-
}, s = `Playback errors (${
|
|
1514
|
+
}, s = `Playback errors (${gt(e)})`;
|
|
1504
1515
|
return /* @__PURE__ */ T("div", {
|
|
1505
|
-
css:
|
|
1516
|
+
css: pt,
|
|
1506
1517
|
ref: r,
|
|
1507
|
-
children: [/* @__PURE__ */ w(
|
|
1518
|
+
children: [/* @__PURE__ */ w(Q, {
|
|
1508
1519
|
id: "errors",
|
|
1509
1520
|
disabled: t,
|
|
1510
1521
|
text: /* @__PURE__ */ w("button", {
|
|
@@ -1533,9 +1544,9 @@ ${dt}
|
|
|
1533
1544
|
/* @__PURE__ */ T("span", {
|
|
1534
1545
|
className: "when",
|
|
1535
1546
|
children: [
|
|
1536
|
-
|
|
1537
|
-
e.count > 1 ? ` to ${
|
|
1538
|
-
|
|
1547
|
+
mt(e.at),
|
|
1548
|
+
e.count > 1 ? ` to ${mt(e.lastAt)}` : "",
|
|
1549
|
+
ht(e.atMediaTime) ? ` at ${ht(e.atMediaTime)}` : "",
|
|
1539
1550
|
e.recovered ? " recovered" : "",
|
|
1540
1551
|
e.count > 1 ? /* @__PURE__ */ w("span", {
|
|
1541
1552
|
className: "count",
|
|
@@ -1555,7 +1566,7 @@ ${dt}
|
|
|
1555
1566
|
}, `${e.at}-${t}`))]
|
|
1556
1567
|
})]
|
|
1557
1568
|
});
|
|
1558
|
-
},
|
|
1569
|
+
}, yt = g`
|
|
1559
1570
|
display: flex;
|
|
1560
1571
|
align-items: center;
|
|
1561
1572
|
justify-content: center;
|
|
@@ -1608,8 +1619,8 @@ width: 100%;
|
|
|
1608
1619
|
}
|
|
1609
1620
|
}
|
|
1610
1621
|
}
|
|
1611
|
-
`,
|
|
1612
|
-
let e =
|
|
1622
|
+
`, bt = () => {
|
|
1623
|
+
let e = U(), t = U((e) => e.playbackRate), n = p(null), r = p(null), i = .25, a = 2.75, o = (e, t = .05) => Math.round(e / t) * t, s = o(t || 1), c = (e) => (e - i) / a * 100, l = (e) => o(i + e * a), { handlers: u } = Me({
|
|
1613
1624
|
ref: r,
|
|
1614
1625
|
onChange: (t) => e.setPlaybackRate(l(t))
|
|
1615
1626
|
}), f = (t) => {
|
|
@@ -1625,7 +1636,7 @@ width: 100%;
|
|
|
1625
1636
|
}, [t]);
|
|
1626
1637
|
let m = c(s);
|
|
1627
1638
|
return /* @__PURE__ */ T("div", {
|
|
1628
|
-
css:
|
|
1639
|
+
css: yt,
|
|
1629
1640
|
children: [/* @__PURE__ */ T("div", { children: [s.toFixed(2), "x"] }), /* @__PURE__ */ w("div", {
|
|
1630
1641
|
className: "playback-slider",
|
|
1631
1642
|
ref: n,
|
|
@@ -1643,7 +1654,7 @@ width: 100%;
|
|
|
1643
1654
|
})
|
|
1644
1655
|
})]
|
|
1645
1656
|
});
|
|
1646
|
-
},
|
|
1657
|
+
}, xt = g`
|
|
1647
1658
|
/* Deliberately NOT a containing block. The menu anchors to the control bar instead, which is exactly
|
|
1648
1659
|
as wide as the player box and can therefore be clamped to it. The outside-click check uses
|
|
1649
1660
|
\`contains\` on the ref, which is DOM containment and needs no position, and the bar's other
|
|
@@ -1661,7 +1672,7 @@ position: static;
|
|
|
1661
1672
|
}
|
|
1662
1673
|
}
|
|
1663
1674
|
|
|
1664
|
-
${
|
|
1675
|
+
${ut}
|
|
1665
1676
|
|
|
1666
1677
|
.playback-rate {
|
|
1667
1678
|
.slider {
|
|
@@ -1702,8 +1713,8 @@ ${dt}
|
|
|
1702
1713
|
}
|
|
1703
1714
|
}
|
|
1704
1715
|
|
|
1705
|
-
`,
|
|
1706
|
-
let e =
|
|
1716
|
+
`, St = () => {
|
|
1717
|
+
let e = U(), t = U((e) => e.playbackRate), n = U((e) => e.audioTracks), r = U((e) => e.selectedAudioTrack), i = U((e) => e.selectAudioTrack), [a, o] = m(0), { open: s, toggle: c, containerRef: l, pending: u, failed: d, runSelect: f } = ft({ onReset: () => o(0) }), p = (t) => {
|
|
1707
1718
|
e.setPlaybackRate(t), o(0);
|
|
1708
1719
|
}, h = (e) => {
|
|
1709
1720
|
e !== void 0 && f(e, () => i(e));
|
|
@@ -1711,10 +1722,10 @@ ${dt}
|
|
|
1711
1722
|
o(e);
|
|
1712
1723
|
};
|
|
1713
1724
|
return /* @__PURE__ */ T("div", {
|
|
1714
|
-
css:
|
|
1725
|
+
css: xt,
|
|
1715
1726
|
ref: l,
|
|
1716
1727
|
children: [
|
|
1717
|
-
/* @__PURE__ */ w(
|
|
1728
|
+
/* @__PURE__ */ w(Q, {
|
|
1718
1729
|
id: "settings",
|
|
1719
1730
|
disabled: s,
|
|
1720
1731
|
text: /* @__PURE__ */ w("button", {
|
|
@@ -1750,7 +1761,7 @@ ${dt}
|
|
|
1750
1761
|
}),
|
|
1751
1762
|
/* @__PURE__ */ w("div", {
|
|
1752
1763
|
className: "slider no-hover",
|
|
1753
|
-
children: /* @__PURE__ */ w(
|
|
1764
|
+
children: /* @__PURE__ */ w(bt, {})
|
|
1754
1765
|
}),
|
|
1755
1766
|
/* @__PURE__ */ T("div", {
|
|
1756
1767
|
className: "options no-hover",
|
|
@@ -1775,7 +1786,7 @@ ${dt}
|
|
|
1775
1786
|
})
|
|
1776
1787
|
]
|
|
1777
1788
|
}),
|
|
1778
|
-
s && a === 2 && /* @__PURE__ */ w(
|
|
1789
|
+
s && a === 2 && /* @__PURE__ */ w(dt, {
|
|
1779
1790
|
title: "Audio",
|
|
1780
1791
|
tracks: n,
|
|
1781
1792
|
selected: r,
|
|
@@ -1786,7 +1797,7 @@ ${dt}
|
|
|
1786
1797
|
})
|
|
1787
1798
|
]
|
|
1788
1799
|
});
|
|
1789
|
-
},
|
|
1800
|
+
}, Ct = g`
|
|
1790
1801
|
/* Not a containing block, for the reason given on popoverStyle: the menu anchors to the control bar,
|
|
1791
1802
|
which is the width of the player box, so it can be clamped to it. */
|
|
1792
1803
|
position: static;
|
|
@@ -1802,15 +1813,15 @@ position: static;
|
|
|
1802
1813
|
}
|
|
1803
1814
|
}
|
|
1804
1815
|
|
|
1805
|
-
${
|
|
1806
|
-
`,
|
|
1807
|
-
let e =
|
|
1816
|
+
${ut}
|
|
1817
|
+
`, wt = () => {
|
|
1818
|
+
let e = U((e) => e.subtitleTracks), t = U((e) => e.selectedSubtitleTrack), n = U((e) => e.selectSubtitleTrack), r = U((e) => e.subtitleOffLabel), { open: i, toggle: a, containerRef: o, pending: s, failed: c, runSelect: l } = ft();
|
|
1808
1819
|
if (e.length === 0) return null;
|
|
1809
1820
|
let u = t !== void 0;
|
|
1810
1821
|
return /* @__PURE__ */ T("div", {
|
|
1811
|
-
css:
|
|
1822
|
+
css: Ct,
|
|
1812
1823
|
ref: o,
|
|
1813
|
-
children: [/* @__PURE__ */ w(
|
|
1824
|
+
children: [/* @__PURE__ */ w(Q, {
|
|
1814
1825
|
id: "subtitles",
|
|
1815
1826
|
disabled: i,
|
|
1816
1827
|
text: /* @__PURE__ */ w("button", {
|
|
@@ -1820,10 +1831,10 @@ ${dt}
|
|
|
1820
1831
|
"aria-label": "Subtitles",
|
|
1821
1832
|
"aria-expanded": i,
|
|
1822
1833
|
"aria-pressed": u,
|
|
1823
|
-
children: u ? /* @__PURE__ */ w(
|
|
1834
|
+
children: u ? /* @__PURE__ */ w(ot, { className: "captions" }) : /* @__PURE__ */ w(st, { className: "captions-off" })
|
|
1824
1835
|
}),
|
|
1825
1836
|
toolTipText: /* @__PURE__ */ w("span", { children: "Subtitles" })
|
|
1826
|
-
}), i && /* @__PURE__ */ w(
|
|
1837
|
+
}), i && /* @__PURE__ */ w(dt, {
|
|
1827
1838
|
title: "Subtitles",
|
|
1828
1839
|
tracks: e,
|
|
1829
1840
|
selected: t,
|
|
@@ -1833,13 +1844,13 @@ ${dt}
|
|
|
1833
1844
|
failed: c
|
|
1834
1845
|
})]
|
|
1835
1846
|
});
|
|
1836
|
-
},
|
|
1847
|
+
}, Tt = {
|
|
1837
1848
|
primary: "#EAEBEE",
|
|
1838
1849
|
secondary: "#D0D0D9",
|
|
1839
1850
|
hover: "rgba(255, 255, 255, 0.13)",
|
|
1840
1851
|
borderPrimary: "#384F70",
|
|
1841
1852
|
backgroundTooltip: "#222222"
|
|
1842
|
-
},
|
|
1853
|
+
}, Et = g`
|
|
1843
1854
|
display: flex;
|
|
1844
1855
|
align-items: center;
|
|
1845
1856
|
|
|
@@ -1882,8 +1893,8 @@ ${dt}
|
|
|
1882
1893
|
width: 10px;
|
|
1883
1894
|
height: 10px;
|
|
1884
1895
|
}
|
|
1885
|
-
`,
|
|
1886
|
-
let n =
|
|
1896
|
+
`, Dt = ({ value: e, onChange: t }) => {
|
|
1897
|
+
let n = U((e) => e.volume), r = U((e) => e.muted), i = p(null), a = p(null), { handlers: o } = Me({
|
|
1887
1898
|
ref: a,
|
|
1888
1899
|
onChange: t
|
|
1889
1900
|
}), s = (n) => {
|
|
@@ -1897,12 +1908,12 @@ ${dt}
|
|
|
1897
1908
|
e && e.removeEventListener("wheel", s);
|
|
1898
1909
|
};
|
|
1899
1910
|
}, [e]);
|
|
1900
|
-
let c = e * 100, l = f(() => Math.round(r ? 0 :
|
|
1901
|
-
return /* @__PURE__ */ w(
|
|
1911
|
+
let c = e * 100, l = f(() => Math.round(r ? 0 : De(n) * 100), [n, r]);
|
|
1912
|
+
return /* @__PURE__ */ w(Q, {
|
|
1902
1913
|
id: "volume-slider",
|
|
1903
1914
|
text: /* @__PURE__ */ w("div", {
|
|
1904
1915
|
ref: i,
|
|
1905
|
-
css:
|
|
1916
|
+
css: Et,
|
|
1906
1917
|
...o,
|
|
1907
1918
|
children: /* @__PURE__ */ w("div", {
|
|
1908
1919
|
ref: a,
|
|
@@ -1921,7 +1932,7 @@ ${dt}
|
|
|
1921
1932
|
children: [l, "%"]
|
|
1922
1933
|
})
|
|
1923
1934
|
});
|
|
1924
|
-
},
|
|
1935
|
+
}, Ot = g`
|
|
1925
1936
|
position: relative;
|
|
1926
1937
|
display: flex;
|
|
1927
1938
|
align-items: center;
|
|
@@ -1946,7 +1957,7 @@ ${dt}
|
|
|
1946
1957
|
border-radius: 4px;
|
|
1947
1958
|
|
|
1948
1959
|
.volume-value {
|
|
1949
|
-
${
|
|
1960
|
+
${Y.bMedium.regular};
|
|
1950
1961
|
color: #ffffff;
|
|
1951
1962
|
}
|
|
1952
1963
|
}
|
|
@@ -1984,11 +1995,11 @@ ${dt}
|
|
|
1984
1995
|
}
|
|
1985
1996
|
}
|
|
1986
1997
|
|
|
1987
|
-
`,
|
|
1988
|
-
let t =
|
|
1998
|
+
`, kt = ({ ref: e }) => {
|
|
1999
|
+
let t = U(), n = U((e) => e.volume), r = U((e) => e.muted), i = f(() => De(n), [n]);
|
|
1989
2000
|
return /* @__PURE__ */ T("div", {
|
|
1990
|
-
css:
|
|
1991
|
-
children: [/* @__PURE__ */ w(
|
|
2001
|
+
css: Ot,
|
|
2002
|
+
children: [/* @__PURE__ */ w(Q, {
|
|
1992
2003
|
id: "sound",
|
|
1993
2004
|
text: /* @__PURE__ */ w("button", {
|
|
1994
2005
|
className: "sound",
|
|
@@ -2007,16 +2018,16 @@ ${dt}
|
|
|
2007
2018
|
className: "volume-slider-container",
|
|
2008
2019
|
children: /* @__PURE__ */ w("div", {
|
|
2009
2020
|
className: "volume-slider-background",
|
|
2010
|
-
children: /* @__PURE__ */ w(
|
|
2021
|
+
children: /* @__PURE__ */ w(Dt, {
|
|
2011
2022
|
value: r ? 0 : i,
|
|
2012
2023
|
onChange: (e) => {
|
|
2013
|
-
t.setVolume(
|
|
2024
|
+
t.setVolume(Ee(e));
|
|
2014
2025
|
}
|
|
2015
2026
|
})
|
|
2016
2027
|
})
|
|
2017
2028
|
})]
|
|
2018
2029
|
});
|
|
2019
|
-
},
|
|
2030
|
+
}, At = .05, jt = 5, Mt = 50, Nt = 1e3, Pt = g`
|
|
2020
2031
|
display: flex;
|
|
2021
2032
|
flex-direction: column;
|
|
2022
2033
|
gap: calc(0.4 * var(--mp-unit));
|
|
@@ -2117,7 +2128,7 @@ ${dt}
|
|
|
2117
2128
|
/* .armed is the hover of a control letting its click through, which takes no pointer events
|
|
2118
2129
|
of its own and so is never :hover */
|
|
2119
2130
|
:hover, &.armed {
|
|
2120
|
-
background-color: ${
|
|
2131
|
+
background-color: ${Tt.hover};
|
|
2121
2132
|
}
|
|
2122
2133
|
|
|
2123
2134
|
/* the hit area grows, the icon does not, keyed on the pointer because a narrow desktop
|
|
@@ -2134,7 +2145,7 @@ ${dt}
|
|
|
2134
2145
|
|
|
2135
2146
|
.left {
|
|
2136
2147
|
.time {
|
|
2137
|
-
${
|
|
2148
|
+
${Y.bMedium.regular}
|
|
2138
2149
|
text-shadow: 0 0 4px rgba(0, 0, 0, 1);
|
|
2139
2150
|
}
|
|
2140
2151
|
}
|
|
@@ -2156,9 +2167,9 @@ ${dt}
|
|
|
2156
2167
|
}
|
|
2157
2168
|
}
|
|
2158
2169
|
`, It = () => {
|
|
2159
|
-
let e =
|
|
2160
|
-
let r =
|
|
2161
|
-
e.setVolume(
|
|
2170
|
+
let e = U(), t = U((e) => e.paused), n = U((e) => e.currentTime), r = U((e) => e.duration), i = U((e) => e.seekingTo), a = U((e) => e.fullscreen), o = U((e) => e.hideUI), s = U((e) => e.togglePictureInPicture), c = U((e) => e.pictureInPictureMode), l = U((e) => e.burnedInSubtitles), f = U((e) => e.passThroughPictureInPicture), h = U((e) => e.subtitleTracks), g = U((e) => e.requestSeek), [_, v] = m(null), y = p(null), b = p(void 0), x = c === "burn-in", S = h.length > 0, C = r > 0 && n === r, E = u(({ direction: t, stepSize: n }) => {
|
|
2171
|
+
let r = De(e.volume), i = t === "up" ? n : -n, a = Math.max(0, Math.min(1, r + i)), o = e.muted;
|
|
2172
|
+
e.setVolume(Ee(a)), o && !e.muted && e.toggleMuted();
|
|
2162
2173
|
}, [e]);
|
|
2163
2174
|
d(() => {
|
|
2164
2175
|
let t = (t) => g ? g(t) : e.seek(t), n = (n) => {
|
|
@@ -2171,11 +2182,11 @@ ${dt}
|
|
|
2171
2182
|
else if (n.key === "m") e.toggleMuted();
|
|
2172
2183
|
else if (n.key === "ArrowUp") E({
|
|
2173
2184
|
direction: "up",
|
|
2174
|
-
stepSize:
|
|
2185
|
+
stepSize: At
|
|
2175
2186
|
});
|
|
2176
2187
|
else if (n.key === "ArrowDown") E({
|
|
2177
2188
|
direction: "down",
|
|
2178
|
-
stepSize:
|
|
2189
|
+
stepSize: At
|
|
2179
2190
|
});
|
|
2180
2191
|
else if (n.key === "ArrowRight") {
|
|
2181
2192
|
if (!e.duration) return;
|
|
@@ -2192,10 +2203,10 @@ ${dt}
|
|
|
2192
2203
|
let D = u((e) => {
|
|
2193
2204
|
e.preventDefault(), e.deltaY < 0 ? E({
|
|
2194
2205
|
direction: "up",
|
|
2195
|
-
stepSize:
|
|
2206
|
+
stepSize: At
|
|
2196
2207
|
}) : E({
|
|
2197
2208
|
direction: "down",
|
|
2198
|
-
stepSize:
|
|
2209
|
+
stepSize: At
|
|
2199
2210
|
});
|
|
2200
2211
|
}, [E]);
|
|
2201
2212
|
d(() => {
|
|
@@ -2231,12 +2242,12 @@ ${dt}
|
|
|
2231
2242
|
opacity: "0",
|
|
2232
2243
|
pointerEvents: "none"
|
|
2233
2244
|
} : k ? { pointerEvents: "none" } : {} },
|
|
2234
|
-
children: [/* @__PURE__ */ w(
|
|
2245
|
+
children: [/* @__PURE__ */ w(it, {}), /* @__PURE__ */ T("div", {
|
|
2235
2246
|
className: "actions",
|
|
2236
2247
|
children: [/* @__PURE__ */ T("div", {
|
|
2237
2248
|
className: "left",
|
|
2238
2249
|
children: [
|
|
2239
|
-
/* @__PURE__ */ w(
|
|
2250
|
+
/* @__PURE__ */ w(Q, {
|
|
2240
2251
|
id: "play",
|
|
2241
2252
|
tooltipPlace: "top-start",
|
|
2242
2253
|
text: /* @__PURE__ */ w("button", {
|
|
@@ -2248,19 +2259,19 @@ ${dt}
|
|
|
2248
2259
|
}),
|
|
2249
2260
|
toolTipText: /* @__PURE__ */ w("span", { children: C ? "Replay (k)" : t ? "Play (k)" : "Pause (k)" })
|
|
2250
2261
|
}),
|
|
2251
|
-
/* @__PURE__ */ w(
|
|
2262
|
+
/* @__PURE__ */ w(kt, { ref: v }),
|
|
2252
2263
|
/* @__PURE__ */ w("div", {
|
|
2253
2264
|
className: "time",
|
|
2254
|
-
children:
|
|
2265
|
+
children: Oe(i ?? n, r)
|
|
2255
2266
|
})
|
|
2256
2267
|
]
|
|
2257
2268
|
}), /* @__PURE__ */ T("div", {
|
|
2258
2269
|
className: "right",
|
|
2259
2270
|
children: [
|
|
2260
|
-
/* @__PURE__ */ w(
|
|
2261
|
-
/* @__PURE__ */ w(
|
|
2262
|
-
/* @__PURE__ */ w(
|
|
2263
|
-
f ? /* @__PURE__ */ w(
|
|
2271
|
+
/* @__PURE__ */ w(vt, {}),
|
|
2272
|
+
/* @__PURE__ */ w(wt, {}),
|
|
2273
|
+
/* @__PURE__ */ w(St, {}),
|
|
2274
|
+
f ? /* @__PURE__ */ w(Q, {
|
|
2264
2275
|
id: "picture-in-picture",
|
|
2265
2276
|
tooltipPlace: "top-end",
|
|
2266
2277
|
text: /* @__PURE__ */ w("button", {
|
|
@@ -2273,12 +2284,12 @@ ${dt}
|
|
|
2273
2284
|
"aria-label": "Picture in picture",
|
|
2274
2285
|
"aria-pressed": f.active,
|
|
2275
2286
|
children: /* @__PURE__ */ w("img", {
|
|
2276
|
-
src:
|
|
2287
|
+
src: at,
|
|
2277
2288
|
alt: ""
|
|
2278
2289
|
})
|
|
2279
2290
|
}),
|
|
2280
2291
|
toolTipText: /* @__PURE__ */ w("span", { children: f.active ? "Exit picture in picture" : "Picture in picture" })
|
|
2281
|
-
}) : s ? /* @__PURE__ */ w(
|
|
2292
|
+
}) : s ? /* @__PURE__ */ w(Q, {
|
|
2282
2293
|
id: "picture-in-picture",
|
|
2283
2294
|
tooltipPlace: "top-end",
|
|
2284
2295
|
text: /* @__PURE__ */ w("button", {
|
|
@@ -2288,8 +2299,8 @@ ${dt}
|
|
|
2288
2299
|
disabled: x && !S,
|
|
2289
2300
|
"aria-label": x ? "Put the subtitles in the video" : "Picture in picture",
|
|
2290
2301
|
"aria-pressed": x ? l : void 0,
|
|
2291
|
-
children: x ? w(l ?
|
|
2292
|
-
src:
|
|
2302
|
+
children: x ? w(l ? ct : lt, {}) : /* @__PURE__ */ w("img", {
|
|
2303
|
+
src: at,
|
|
2293
2304
|
alt: ""
|
|
2294
2305
|
})
|
|
2295
2306
|
}),
|
|
@@ -2304,7 +2315,7 @@ ${dt}
|
|
|
2304
2315
|
}) : null]
|
|
2305
2316
|
})
|
|
2306
2317
|
}) : null,
|
|
2307
|
-
/* @__PURE__ */ w(
|
|
2318
|
+
/* @__PURE__ */ w(Q, {
|
|
2308
2319
|
id: "full-screen",
|
|
2309
2320
|
tooltipPlace: "top-end",
|
|
2310
2321
|
text: /* @__PURE__ */ w("button", {
|
|
@@ -2359,12 +2370,12 @@ ${dt}
|
|
|
2359
2370
|
}
|
|
2360
2371
|
|
|
2361
2372
|
.title {
|
|
2362
|
-
${
|
|
2373
|
+
${Y.bMedium.bold}
|
|
2363
2374
|
color: #fff;
|
|
2364
2375
|
}
|
|
2365
2376
|
|
|
2366
2377
|
.body {
|
|
2367
|
-
${
|
|
2378
|
+
${Y.bSmall.regular}
|
|
2368
2379
|
color: rgba(255, 255, 255, 0.75);
|
|
2369
2380
|
}
|
|
2370
2381
|
|
|
@@ -2376,7 +2387,7 @@ ${dt}
|
|
|
2376
2387
|
color: #fff;
|
|
2377
2388
|
}
|
|
2378
2389
|
`, zt = () => {
|
|
2379
|
-
let e =
|
|
2390
|
+
let e = U((e) => e.burnedInSubtitles), t = U((e) => e.pictureInPictureMode), [n, r] = m(!1);
|
|
2380
2391
|
return d(() => {
|
|
2381
2392
|
if (t !== "burn-in" || !e) {
|
|
2382
2393
|
r(!1);
|
|
@@ -2427,7 +2438,7 @@ ${dt}
|
|
|
2427
2438
|
pointer-events: auto;
|
|
2428
2439
|
cursor: pointer;
|
|
2429
2440
|
|
|
2430
|
-
${
|
|
2441
|
+
${Y.bMedium.bold}
|
|
2431
2442
|
color: #fff;
|
|
2432
2443
|
padding: calc(1 * var(--mp-unit)) calc(1.8 * var(--mp-unit));
|
|
2433
2444
|
border: 1px solid rgba(255, 255, 255, .55);
|
|
@@ -2462,43 +2473,43 @@ ${dt}
|
|
|
2462
2473
|
}
|
|
2463
2474
|
}
|
|
2464
2475
|
`, Gt = () => {
|
|
2465
|
-
let e =
|
|
2476
|
+
let e = U((e) => e.chapters), t = U((e) => e.currentTime), n = U((e) => e.requestSeek), r = U((e) => e.seekPreview), i = U(), a = f(() => tt(e), [e]), o = f(() => {
|
|
2466
2477
|
if (typeof t != "number") return;
|
|
2467
|
-
let n = e.findIndex((e, n) =>
|
|
2478
|
+
let n = e.findIndex((e, n) => a[n] !== void 0 && e.start - Bt <= t && t < e.end), r = n >= 0 ? a[n] : void 0;
|
|
2468
2479
|
return r ? {
|
|
2469
2480
|
kind: r,
|
|
2470
2481
|
end: e[n].end
|
|
2471
2482
|
} : void 0;
|
|
2472
2483
|
}, [
|
|
2473
2484
|
e,
|
|
2474
|
-
|
|
2485
|
+
a,
|
|
2475
2486
|
t
|
|
2476
|
-
]),
|
|
2487
|
+
]), s = p(0), [c, l] = m(0);
|
|
2477
2488
|
d(() => {
|
|
2478
|
-
let e = typeof t == "number" ? t : 0, n =
|
|
2479
|
-
|
|
2489
|
+
let e = typeof t == "number" ? t : 0, n = s.current;
|
|
2490
|
+
s.current = e, e < n - Ht && l((e) => e + 1);
|
|
2480
2491
|
}, [t]);
|
|
2481
|
-
let [
|
|
2492
|
+
let [u, h] = m(!1), g = o ? `${o.kind}@${o.end}` : "";
|
|
2482
2493
|
return d(() => {
|
|
2483
|
-
if (!
|
|
2484
|
-
|
|
2494
|
+
if (!g) {
|
|
2495
|
+
h(!1);
|
|
2485
2496
|
return;
|
|
2486
2497
|
}
|
|
2487
|
-
|
|
2488
|
-
let e = setTimeout(() =>
|
|
2498
|
+
h(!0);
|
|
2499
|
+
let e = setTimeout(() => h(!1), Vt);
|
|
2489
2500
|
return () => clearTimeout(e);
|
|
2490
|
-
}, [
|
|
2491
|
-
|
|
2492
|
-
}, [
|
|
2501
|
+
}, [g, c]), d(() => {
|
|
2502
|
+
o || h(!1);
|
|
2503
|
+
}, [o]), o ? /* @__PURE__ */ w("div", {
|
|
2493
2504
|
css: Wt,
|
|
2494
|
-
className:
|
|
2505
|
+
className: u && !r ? "show" : "",
|
|
2495
2506
|
children: /* @__PURE__ */ w("button", {
|
|
2496
2507
|
type: "button",
|
|
2497
2508
|
className: "skip-chapter",
|
|
2498
2509
|
onClick: () => {
|
|
2499
|
-
|
|
2510
|
+
h(!1), n ? n(o.end) : i.seek(o.end);
|
|
2500
2511
|
},
|
|
2501
|
-
children: Ut[
|
|
2512
|
+
children: Ut[o.kind]
|
|
2502
2513
|
})
|
|
2503
2514
|
}) : null;
|
|
2504
2515
|
}, Kt = 3e3, qt = g`
|
|
@@ -2576,7 +2587,7 @@ ${dt}
|
|
|
2576
2587
|
item: e
|
|
2577
2588
|
}];
|
|
2578
2589
|
}), Zt = ({ ref: e, onVideoRef: t, onSubtitleRef: n, overlay: r, controls: i, children: a }) => {
|
|
2579
|
-
let o =
|
|
2590
|
+
let o = U(), s = U((e) => e.hideUI), c = U((e) => e.setHideUI), l = U((e) => e.hasMedia), u = U((e) => e.passThroughPictureInPicture), f = p(void 0), m = p("mouse"), h = p({
|
|
2580
2591
|
x: -1,
|
|
2581
2592
|
y: -1
|
|
2582
2593
|
}), g = p(null);
|
|
@@ -2623,7 +2634,7 @@ ${dt}
|
|
|
2623
2634
|
},
|
|
2624
2635
|
className: s ? "hide" : "",
|
|
2625
2636
|
children: [
|
|
2626
|
-
/* @__PURE__ */ w(
|
|
2637
|
+
/* @__PURE__ */ w(Ce, { onSubtitleRef: n }),
|
|
2627
2638
|
Xt(r).map(({ key: e, item: t }) => /* @__PURE__ */ w("div", {
|
|
2628
2639
|
css: qt,
|
|
2629
2640
|
style: { ...s ? {
|
|
@@ -2677,33 +2688,33 @@ ${dt}
|
|
|
2677
2688
|
k,
|
|
2678
2689
|
A,
|
|
2679
2690
|
j
|
|
2680
|
-
]),
|
|
2681
|
-
let { thumbnails: M, requestThumbnail: N } =
|
|
2691
|
+
]), oe(v, S, r);
|
|
2692
|
+
let { thumbnails: M, requestThumbnail: N } = le({
|
|
2682
2693
|
publicPath: c,
|
|
2683
2694
|
workerUrl: l,
|
|
2684
2695
|
length: h === !1 ? void 0 : o,
|
|
2685
2696
|
read: f ?? u,
|
|
2686
2697
|
downloadedRanges: s
|
|
2687
|
-
}), P = n?.thumbnails?.all ?? M, { toggle: F, mode: I, burnedIn: L } =
|
|
2698
|
+
}), P = n?.thumbnails?.all ?? M, { toggle: F, mode: I, burnedIn: L } = ue(v, S), R = ge(n?.media ?? null, n?.pictureInPicture), z = U((e) => e.setSourceState), ee = n ? !!n.media : o !== void 0;
|
|
2688
2699
|
d(() => {
|
|
2689
2700
|
z({
|
|
2690
2701
|
title: i,
|
|
2691
2702
|
size: o,
|
|
2692
2703
|
downloadedRanges: s,
|
|
2693
|
-
hasMedia:
|
|
2704
|
+
hasMedia: ee
|
|
2694
2705
|
});
|
|
2695
2706
|
}, [
|
|
2696
2707
|
z,
|
|
2697
2708
|
i,
|
|
2698
2709
|
o,
|
|
2699
2710
|
s,
|
|
2700
|
-
|
|
2711
|
+
ee
|
|
2701
2712
|
]);
|
|
2702
|
-
let
|
|
2713
|
+
let B = n?.thumbnails?.at;
|
|
2703
2714
|
d(() => {
|
|
2704
2715
|
z({
|
|
2705
2716
|
thumbnails: P,
|
|
2706
|
-
thumbnailAt:
|
|
2717
|
+
thumbnailAt: B,
|
|
2707
2718
|
requestThumbnail: N,
|
|
2708
2719
|
togglePictureInPicture: F,
|
|
2709
2720
|
pictureInPictureMode: I,
|
|
@@ -2712,7 +2723,7 @@ ${dt}
|
|
|
2712
2723
|
}, [
|
|
2713
2724
|
z,
|
|
2714
2725
|
P,
|
|
2715
|
-
|
|
2726
|
+
B,
|
|
2716
2727
|
N,
|
|
2717
2728
|
F,
|
|
2718
2729
|
I,
|
|
@@ -2720,29 +2731,29 @@ ${dt}
|
|
|
2720
2731
|
]), d(() => {
|
|
2721
2732
|
z({ passThroughPictureInPicture: R });
|
|
2722
2733
|
}, [z, R]);
|
|
2723
|
-
let
|
|
2734
|
+
let V = n?.subtitles?.selection, H = n?.audioTracks?.selection;
|
|
2724
2735
|
return d(() => {
|
|
2725
|
-
|
|
2726
|
-
subtitleTracks:
|
|
2736
|
+
V && z({
|
|
2737
|
+
subtitleTracks: V.options.map(({ id: e, label: t, disabled: n }) => ({
|
|
2727
2738
|
id: e,
|
|
2728
2739
|
label: t,
|
|
2729
2740
|
disabled: n
|
|
2730
2741
|
})),
|
|
2731
|
-
selectedSubtitleTrack:
|
|
2732
|
-
selectSubtitleTrack: (e) =>
|
|
2733
|
-
subtitleOffLabel:
|
|
2742
|
+
selectedSubtitleTrack: V.selectedId ?? void 0,
|
|
2743
|
+
selectSubtitleTrack: (e) => V.select(e == null ? null : String(e)),
|
|
2744
|
+
subtitleOffLabel: V.offLabel
|
|
2734
2745
|
});
|
|
2735
|
-
}, [z,
|
|
2736
|
-
|
|
2737
|
-
audioTracks:
|
|
2746
|
+
}, [z, V]), d(() => {
|
|
2747
|
+
H && z({
|
|
2748
|
+
audioTracks: H.options.map(({ id: e, label: t, disabled: n }) => ({
|
|
2738
2749
|
id: e,
|
|
2739
2750
|
label: t,
|
|
2740
2751
|
disabled: n
|
|
2741
2752
|
})),
|
|
2742
|
-
selectedAudioTrack:
|
|
2743
|
-
selectAudioTrack: (e) =>
|
|
2753
|
+
selectedAudioTrack: H.selectedId ?? void 0,
|
|
2754
|
+
selectAudioTrack: (e) => H.select(String(e))
|
|
2744
2755
|
});
|
|
2745
|
-
}, [z,
|
|
2756
|
+
}, [z, H]), d(() => {
|
|
2746
2757
|
a && z({ chapters: a });
|
|
2747
2758
|
}, [z, a]), /* @__PURE__ */ w(Zt, {
|
|
2748
2759
|
ref: _,
|
|
@@ -2824,7 +2835,7 @@ ${dt}
|
|
|
2824
2835
|
overflow: hidden;
|
|
2825
2836
|
`, en = (e) => /* @__PURE__ */ w("div", {
|
|
2826
2837
|
css: $t,
|
|
2827
|
-
children: /* @__PURE__ */ w(
|
|
2838
|
+
children: /* @__PURE__ */ w(H.Provider, { children: /* @__PURE__ */ w(Qt, {
|
|
2828
2839
|
options: e,
|
|
2829
2840
|
children: e.children
|
|
2830
2841
|
}) })
|
|
@@ -2869,4 +2880,4 @@ ${dt}
|
|
|
2869
2880
|
throw Error(`Unknown source type: ${e}`);
|
|
2870
2881
|
};
|
|
2871
2882
|
//#endregion
|
|
2872
|
-
export { en as MediaPlayer, en as default,
|
|
2883
|
+
export { en as MediaPlayer, en as default, H as Player, e as SUBTITLES_OFF, a as createPictureInPicture, o as createSubtitleRenderer, r as createThumbnailGenerator, sn as inputToRemuxerInput, nn as isDelegatedTracks, tn as isExternalThumbnails, V as sourceFeature, i as startPlayback, ue as usePictureInPicture, U as usePlayer, le as useSeekThumbnails };
|