@instructure/studio-player 0.2.13 → 0.2.14
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/studio-player.es.js
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import './index-
|
|
2
|
-
var
|
|
3
|
-
var N = (e, n, o) =>
|
|
4
|
-
import { jsx as t, jsxs as
|
|
5
|
-
import { createContext as te, useContext as x, useState as T, useCallback as p, useEffect as
|
|
6
|
-
import { useMediaPlayer as
|
|
7
|
-
import { initReactI18next as
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import { useFloating as
|
|
11
|
-
const
|
|
1
|
+
import './index-BDj52-Kq.css';var Ke = Object.defineProperty;
|
|
2
|
+
var De = (e, n, o) => n in e ? Ke(e, n, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[n] = o;
|
|
3
|
+
var N = (e, n, o) => De(e, typeof n != "symbol" ? n + "" : n, o);
|
|
4
|
+
import { jsx as t, jsxs as a, Fragment as ee } from "react/jsx-runtime";
|
|
5
|
+
import { createContext as te, useContext as x, useState as T, useCallback as p, useEffect as B, useMemo as $, useRef as Ce } from "react";
|
|
6
|
+
import { useMediaPlayer as A, Spinner as X, useMediaRemote as G, useMediaState as _, isTrackCaptionKind as ze, Track as Ue, Captions as je, usePlaybackRateOptions as qe, useCaptionOptions as We, useVideoQualityOptions as Ge, useMediaStore as ve, Poster as Qe, FullscreenButton as Ye, Time as re, TimeSlider as O, VolumeSlider as U, MediaPlayer as Xe, MediaProvider as Je } from "@vidstack/react";
|
|
7
|
+
import { initReactI18next as et, useTranslation as C } from "react-i18next";
|
|
8
|
+
import tt from "i18next";
|
|
9
|
+
import nt from "i18next-resources-to-backend";
|
|
10
|
+
import { useFloating as ge, autoUpdate as be, flip as we, arrow as ke, useDismiss as ye, useInteractions as Le, FloatingFocusManager as ot, FloatingArrow as xe, shift as it, offset as st } from "@floating-ui/react";
|
|
11
|
+
const at = (e, n, o) => {
|
|
12
12
|
const i = e[n];
|
|
13
|
-
return i ? typeof i == "function" ? i() : Promise.resolve(i) : new Promise((
|
|
13
|
+
return i ? typeof i == "function" ? i() : Promise.resolve(i) : new Promise((s, c) => {
|
|
14
14
|
(typeof queueMicrotask == "function" ? queueMicrotask : setTimeout)(
|
|
15
15
|
c.bind(
|
|
16
16
|
null,
|
|
@@ -21,9 +21,9 @@ const lt = (e, n, o) => {
|
|
|
21
21
|
);
|
|
22
22
|
});
|
|
23
23
|
};
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
(e) =>
|
|
24
|
+
tt.use(et).use(
|
|
25
|
+
nt(
|
|
26
|
+
(e) => at(/* @__PURE__ */ Object.assign({ "./locales/en.json": () => import("./en-BlhWGmnp.js"), "./locales/kl.json": () => import("./kl-BRha3TKE.js") }), `./locales/${e}.json`, 3)
|
|
27
27
|
)
|
|
28
28
|
).init({
|
|
29
29
|
fallbackLng: "en",
|
|
@@ -34,28 +34,28 @@ ot.use(nt).use(
|
|
|
34
34
|
escapeValue: !1
|
|
35
35
|
}
|
|
36
36
|
});
|
|
37
|
-
const
|
|
38
|
-
function
|
|
37
|
+
const Pe = te(null);
|
|
38
|
+
function ct({
|
|
39
39
|
children: e,
|
|
40
40
|
contextValue: n
|
|
41
41
|
}) {
|
|
42
|
-
return /* @__PURE__ */ t(
|
|
42
|
+
return /* @__PURE__ */ t(Pe.Provider, { value: n, children: e });
|
|
43
43
|
}
|
|
44
|
-
function
|
|
45
|
-
const e = x(
|
|
44
|
+
function v() {
|
|
45
|
+
const e = x(Pe);
|
|
46
46
|
if (!e)
|
|
47
47
|
throw new Error(
|
|
48
48
|
"useStudioPlayerContext must be used within a StudioPlayerContextProvider"
|
|
49
49
|
);
|
|
50
50
|
return e;
|
|
51
51
|
}
|
|
52
|
-
const
|
|
53
|
-
function
|
|
52
|
+
const Ne = te(null);
|
|
53
|
+
function lt({
|
|
54
54
|
hideFullScreen: e,
|
|
55
55
|
comments: n,
|
|
56
56
|
annotations: o,
|
|
57
57
|
quizMarkers: i,
|
|
58
|
-
interactive:
|
|
58
|
+
interactive: s,
|
|
59
59
|
onAnnotationClick: c,
|
|
60
60
|
onQuizMarkerClick: l,
|
|
61
61
|
onInteractivePinClick: u,
|
|
@@ -70,7 +70,7 @@ function ut({
|
|
|
70
70
|
comments: n,
|
|
71
71
|
annotations: o,
|
|
72
72
|
quizMarkers: i,
|
|
73
|
-
interactive:
|
|
73
|
+
interactive: s,
|
|
74
74
|
onAnnotationClick: c,
|
|
75
75
|
onQuizMarkerClick: l,
|
|
76
76
|
onInteractivePinClick: u,
|
|
@@ -82,28 +82,28 @@ function ut({
|
|
|
82
82
|
forceComments: y,
|
|
83
83
|
disableCaptionSettings: k
|
|
84
84
|
};
|
|
85
|
-
return /* @__PURE__ */ t(
|
|
85
|
+
return /* @__PURE__ */ t(Ne.Provider, { value: b, children: g });
|
|
86
86
|
}
|
|
87
87
|
function S() {
|
|
88
|
-
const e = x(
|
|
88
|
+
const e = x(Ne);
|
|
89
89
|
if (!e)
|
|
90
90
|
throw new Error(
|
|
91
91
|
"useStudioPlayerPropsContext must be used within a StudioPlayerPropsContextProvider"
|
|
92
92
|
);
|
|
93
93
|
return e;
|
|
94
94
|
}
|
|
95
|
-
const
|
|
95
|
+
const rt = "_annotation-overlay_1kxzn_1", ut = {
|
|
96
96
|
"annotation-overlay": "_annotation-overlay_1kxzn_1",
|
|
97
|
-
annotationOverlay:
|
|
98
|
-
}, ue = 0.25,
|
|
97
|
+
annotationOverlay: rt
|
|
98
|
+
}, ue = 0.25, dt = (e, n) => {
|
|
99
99
|
let o = !1;
|
|
100
100
|
return (i) => {
|
|
101
|
-
const
|
|
102
|
-
|
|
101
|
+
const s = i.detail.currentTime;
|
|
102
|
+
s >= e.time && s < e.time + ue && !o && (o = !0, n(e)), (s < e.time || s >= e.time + ue) && o && (o = !1);
|
|
103
103
|
};
|
|
104
104
|
};
|
|
105
|
-
function
|
|
106
|
-
const n =
|
|
105
|
+
function mt({ annotations: e }) {
|
|
106
|
+
const n = A(), o = v(), i = S(), [s, c] = T(
|
|
107
107
|
null
|
|
108
108
|
), l = p(
|
|
109
109
|
(m) => {
|
|
@@ -113,17 +113,17 @@ function pt({ annotations: e }) {
|
|
|
113
113
|
), u = () => {
|
|
114
114
|
i.interactive || (n == null || n.play(), o.enableInteractions()), c(null);
|
|
115
115
|
};
|
|
116
|
-
return
|
|
116
|
+
return B(() => {
|
|
117
117
|
if (!n)
|
|
118
118
|
return;
|
|
119
119
|
const m = [];
|
|
120
120
|
for (const h of e) {
|
|
121
|
-
const g =
|
|
121
|
+
const g = dt(h, l);
|
|
122
122
|
n.addEventListener("time-update", g), m.push(g);
|
|
123
123
|
}
|
|
124
|
-
if (
|
|
124
|
+
if (s) {
|
|
125
125
|
const h = e.find(
|
|
126
|
-
(g) => g.id ===
|
|
126
|
+
(g) => g.id === s.id
|
|
127
127
|
);
|
|
128
128
|
h ? c(h) : (c(null), o.enableInteractions());
|
|
129
129
|
}
|
|
@@ -131,41 +131,41 @@ function pt({ annotations: e }) {
|
|
|
131
131
|
for (const h of m)
|
|
132
132
|
n.removeEventListener("time-update", h);
|
|
133
133
|
};
|
|
134
|
-
}, [n, e]),
|
|
134
|
+
}, [n, e]), s ? /* @__PURE__ */ t("div", { className: ut.annotationOverlay, children: s.render(u) }) : null;
|
|
135
135
|
}
|
|
136
|
-
const
|
|
136
|
+
const ht = "_media-buffering-indicator_1fwjr_1", pt = "_media-buffering-spinner_1fwjr_17", _t = "_media-buffering-spin_1fwjr_17", ft = "_media-buffering-track_1fwjr_22", Ct = "_media-buffering-track-fill_1fwjr_27", j = {
|
|
137
137
|
"media-buffering-indicator": "_media-buffering-indicator_1fwjr_1",
|
|
138
|
-
mediaBufferingIndicator:
|
|
138
|
+
mediaBufferingIndicator: ht,
|
|
139
139
|
"media-buffering-spinner": "_media-buffering-spinner_1fwjr_17",
|
|
140
|
-
mediaBufferingSpinner:
|
|
140
|
+
mediaBufferingSpinner: pt,
|
|
141
141
|
"media-buffering-spin": "_media-buffering-spin_1fwjr_17",
|
|
142
|
-
mediaBufferingSpin:
|
|
142
|
+
mediaBufferingSpin: _t,
|
|
143
143
|
"media-buffering-track": "_media-buffering-track_1fwjr_22",
|
|
144
|
-
mediaBufferingTrack:
|
|
144
|
+
mediaBufferingTrack: ft,
|
|
145
145
|
"media-buffering-track-fill": "_media-buffering-track-fill_1fwjr_27",
|
|
146
|
-
mediaBufferingTrackFill:
|
|
146
|
+
mediaBufferingTrackFill: Ct
|
|
147
147
|
};
|
|
148
|
-
function
|
|
149
|
-
return /* @__PURE__ */ t("div", { className:
|
|
150
|
-
/* @__PURE__ */ t(X.Track, { className:
|
|
148
|
+
function vt() {
|
|
149
|
+
return /* @__PURE__ */ t("div", { className: j.mediaBufferingIndicator, children: /* @__PURE__ */ a(X.Root, { className: j.mediaBufferingSpinner, size: 96, children: [
|
|
150
|
+
/* @__PURE__ */ t(X.Track, { className: j.mediaBufferingTrack, width: 8 }),
|
|
151
151
|
/* @__PURE__ */ t(
|
|
152
152
|
X.TrackFill,
|
|
153
153
|
{
|
|
154
|
-
className:
|
|
154
|
+
className: j.mediaBufferingTrackFill,
|
|
155
155
|
width: 8
|
|
156
156
|
}
|
|
157
157
|
)
|
|
158
158
|
] }) });
|
|
159
159
|
}
|
|
160
|
-
const
|
|
160
|
+
const Te = (e) => /* @__PURE__ */ a("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
|
|
161
161
|
/* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_149_104418", children: /* @__PURE__ */ t("rect", { width: 24, height: 24, fill: "white" }) }) }),
|
|
162
162
|
/* @__PURE__ */ t("g", { clipPath: "url(#clip0_149_104418)", children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M22.5 21.8125V2.3125C22.5 1.9 22.1625 1.5625 21.75 1.5625H2.25C1.8375 1.5625 1.5 1.9 1.5 2.3125V21.8125C1.5 22.225 1.8375 22.5625 2.25 22.5625H21.75C22.1625 22.5625 22.5 22.225 22.5 21.8125ZM21.75 0.0625C22.9905 0.0625 24 1.072 24 2.3125V21.8125C24 23.053 22.9905 24.0625 21.75 24.0625H2.25C1.0095 24.0625 0 23.053 0 21.8125V2.3125C0 1.072 1.0095 0.0625 2.25 0.0625H21.75ZM10.744 10.6709H8.74403V10.0042H6.07736V14.0042H8.74403V13.3375H10.744V14.6709C10.744 15.4042 10.144 16.0042 9.41069 16.0042H5.41069C4.67736 16.0042 4.07736 15.4042 4.07736 14.6709V9.33753C4.07736 8.6042 4.67736 8.0042 5.41069 8.0042H9.41069C10.144 8.0042 10.744 8.6042 10.744 9.33753V10.6709ZM19.8065 10.6709H17.8065V10.0042H15.1399V14.0042H17.8065V13.3375H19.8065V14.6709C19.8065 15.4042 19.2065 16.0042 18.4732 16.0042H14.4732C13.7399 16.0042 13.1399 15.4042 13.1399 14.6709V9.33753C13.1399 8.6042 13.7399 8.0042 14.4732 8.0042H18.4732C19.2065 8.0042 19.8065 8.6042 19.8065 9.33753V10.6709Z", fill: "currentColor" }) })
|
|
163
|
-
] }),
|
|
163
|
+
] }), Me = (e) => /* @__PURE__ */ a("svg", { width: 24, height: 24, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
|
|
164
164
|
/* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_149_104406", children: /* @__PURE__ */ t("rect", { width: 24, height: 24, fill: "white" }) }) }),
|
|
165
165
|
/* @__PURE__ */ t("g", { clipPath: "url(#clip0_149_104406)", children: /* @__PURE__ */ t("path", { d: "M21.3333 0H2.66666C1.18666 0 0 1.35 0 3V21C0 22.65 1.18666 24 2.66666 24H21.3333C22.8 24 24 22.65 24 21V3C24 1.35 22.8 0 21.3333 0ZM10.6667 10.6667H8.66666V10H6V14H8.66666V13.3333H10.6667V14.6667C10.6667 15.4 10.0667 16 9.33334 16H5.33334C4.6 16 4 15.4 4 14.6667V9.33334C4 8.6 4.6 8 5.33334 8H9.33334C10.0667 8 10.6667 8.6 10.6667 9.33334V10.6667ZM20.0042 10.6667H18.0042V10H15.3375V14H18.0042V13.3333H20.0042V14.6667C20.0042 15.4 19.4042 16 18.6708 16H14.6708C13.9375 16 13.3375 15.4 13.3375 14.6667V9.33334C13.3375 8.6 13.9375 8 14.6708 8H18.6708C19.4042 8 20.0042 8.6 20.0042 9.33334V10.6667Z", fill: "currentColor" }) })
|
|
166
166
|
] });
|
|
167
|
-
function
|
|
168
|
-
const e = G(), n = _("textTrack"), o = _("hasCaptions"), i = n &&
|
|
167
|
+
function gt() {
|
|
168
|
+
const e = G(), n = _("textTrack"), o = _("hasCaptions"), i = n && ze(n), s = v(), c = p(
|
|
169
169
|
(l) => {
|
|
170
170
|
e.toggleCaptions(l.nativeEvent);
|
|
171
171
|
},
|
|
@@ -179,19 +179,19 @@ function wt() {
|
|
|
179
179
|
onClick: c,
|
|
180
180
|
"aria-label": "Captions",
|
|
181
181
|
"aria-pressed": i ? "true" : "false",
|
|
182
|
-
tabIndex:
|
|
183
|
-
children: i ? /* @__PURE__ */ t(
|
|
182
|
+
tabIndex: s.state.interactionsDisabled ? -1 : 0,
|
|
183
|
+
children: i ? /* @__PURE__ */ t(Me, { className: "controls-button-icon" }) : /* @__PURE__ */ t(Te, { className: "controls-button-icon" })
|
|
184
184
|
}
|
|
185
185
|
) : null;
|
|
186
186
|
}
|
|
187
|
-
const
|
|
188
|
-
captions:
|
|
187
|
+
const bt = "_captions_13epz_1", wt = {
|
|
188
|
+
captions: bt
|
|
189
189
|
};
|
|
190
|
-
function
|
|
191
|
-
const n = _("hasCaptions"), o =
|
|
192
|
-
return /* @__PURE__ */
|
|
190
|
+
function kt({ captions: e }) {
|
|
191
|
+
const n = _("hasCaptions"), o = v();
|
|
192
|
+
return /* @__PURE__ */ a(ee, { children: [
|
|
193
193
|
e.map((i) => /* @__PURE__ */ t(
|
|
194
|
-
|
|
194
|
+
Ue,
|
|
195
195
|
{
|
|
196
196
|
kind: "subtitles",
|
|
197
197
|
type: i.type,
|
|
@@ -211,21 +211,21 @@ function Lt({ captions: e }) {
|
|
|
211
211
|
"--captions-color": o.state.captionsInvertColors ? "rgba(22, 22, 22)" : "white",
|
|
212
212
|
"--captions-background-color": o.state.captionsInvertColors ? "rgba(255, 255, 255, 0.75)" : "rgba(22, 22, 22, 0.75)"
|
|
213
213
|
},
|
|
214
|
-
children: /* @__PURE__ */ t(
|
|
214
|
+
children: /* @__PURE__ */ t(je, { className: wt.captions })
|
|
215
215
|
}
|
|
216
216
|
) : null
|
|
217
217
|
] });
|
|
218
218
|
}
|
|
219
|
-
const V = [0.5, 0.75, 1, 1.25, 1.5, 2],
|
|
219
|
+
const V = [0.5, 0.75, 1, 1.25, 1.5, 2], yt = [0.5, 1, 2, 3, 4], Ie = 5, Lt = (e) => {
|
|
220
220
|
const [, n] = T({});
|
|
221
|
-
return
|
|
221
|
+
return $(() => {
|
|
222
222
|
let o = [];
|
|
223
223
|
return {
|
|
224
224
|
add(i) {
|
|
225
225
|
o.length >= e && o.shift(), o.push(i), n({});
|
|
226
226
|
},
|
|
227
227
|
remove(i) {
|
|
228
|
-
o = o.filter((
|
|
228
|
+
o = o.filter((s) => s !== i), n({});
|
|
229
229
|
},
|
|
230
230
|
clear() {
|
|
231
231
|
o = [], n({});
|
|
@@ -235,193 +235,193 @@ const V = [0.5, 0.75, 1, 1.25, 1.5, 2], xt = [0.5, 1, 2, 3, 4], Se = 5, Pt = (e)
|
|
|
235
235
|
}
|
|
236
236
|
};
|
|
237
237
|
}, []);
|
|
238
|
-
},
|
|
238
|
+
}, xt = (e, n, o) => {
|
|
239
239
|
let i = !1;
|
|
240
|
-
return (
|
|
241
|
-
const c =
|
|
240
|
+
return (s) => {
|
|
241
|
+
const c = s.detail.currentTime;
|
|
242
242
|
c >= e.timestamp && c < e.timestamp + n && !i && (o.add(e), i = !0), (c < e.timestamp || c >= e.timestamp + n) && i && (o.remove(e), i = !1);
|
|
243
243
|
};
|
|
244
|
-
},
|
|
245
|
-
const o =
|
|
246
|
-
return
|
|
244
|
+
}, Pt = (e, n = 5) => {
|
|
245
|
+
const o = A(), i = Lt(n);
|
|
246
|
+
return B(() => {
|
|
247
247
|
if (!o)
|
|
248
248
|
return;
|
|
249
|
-
const
|
|
249
|
+
const s = [];
|
|
250
250
|
for (const c of e) {
|
|
251
|
-
const l =
|
|
252
|
-
|
|
251
|
+
const l = xt(c, Ie, i);
|
|
252
|
+
s.push(l), o.addEventListener("time-update", l);
|
|
253
253
|
}
|
|
254
254
|
return o.dispatchEvent(
|
|
255
255
|
new CustomEvent("time-update", {
|
|
256
256
|
detail: { currentTime: o.currentTime }
|
|
257
257
|
})
|
|
258
258
|
), () => {
|
|
259
|
-
for (const c of
|
|
259
|
+
for (const c of s)
|
|
260
260
|
o.removeEventListener("time-update", c);
|
|
261
261
|
i.clear();
|
|
262
262
|
};
|
|
263
263
|
}, [o, i, e]), i;
|
|
264
|
-
},
|
|
264
|
+
}, Nt = "_comments-overlay_2woxe_1", Tt = "_comments-container_2woxe_9", Mt = "_comment_2woxe_1", It = "_comment-text_2woxe_45", St = "_comment-author-avatar_2woxe_68", Ht = "_comment-author-name_2woxe_87", E = {
|
|
265
265
|
"comments-overlay": "_comments-overlay_2woxe_1",
|
|
266
|
-
commentsOverlay:
|
|
266
|
+
commentsOverlay: Nt,
|
|
267
267
|
"comments-container": "_comments-container_2woxe_9",
|
|
268
|
-
commentsContainer:
|
|
269
|
-
comment:
|
|
268
|
+
commentsContainer: Tt,
|
|
269
|
+
comment: Mt,
|
|
270
270
|
"comment-text": "_comment-text_2woxe_45",
|
|
271
|
-
commentText:
|
|
271
|
+
commentText: It,
|
|
272
272
|
"comment-author-avatar": "_comment-author-avatar_2woxe_68",
|
|
273
|
-
commentAuthorAvatar:
|
|
273
|
+
commentAuthorAvatar: St,
|
|
274
274
|
"comment-author-name": "_comment-author-name_2woxe_87",
|
|
275
|
-
commentAuthorName:
|
|
275
|
+
commentAuthorName: Ht
|
|
276
276
|
};
|
|
277
|
-
function
|
|
278
|
-
return /* @__PURE__ */
|
|
277
|
+
function Rt({ comment: e }) {
|
|
278
|
+
return /* @__PURE__ */ a("div", { className: E.comment, onClick: () => {
|
|
279
279
|
var n;
|
|
280
280
|
return (n = e.onClick) == null ? void 0 : n.call(e, e);
|
|
281
281
|
}, children: [
|
|
282
282
|
/* @__PURE__ */ t(
|
|
283
283
|
"img",
|
|
284
284
|
{
|
|
285
|
-
className:
|
|
285
|
+
className: E.commentAuthorAvatar,
|
|
286
286
|
src: e.user.avatar,
|
|
287
287
|
alt: e.user.name
|
|
288
288
|
}
|
|
289
289
|
),
|
|
290
|
-
/* @__PURE__ */ t("span", { className:
|
|
291
|
-
/* @__PURE__ */ t("span", { className:
|
|
290
|
+
/* @__PURE__ */ t("span", { className: E.commentText, children: e.text }),
|
|
291
|
+
/* @__PURE__ */ t("span", { className: E.commentAuthorName, children: e.user.name })
|
|
292
292
|
] });
|
|
293
293
|
}
|
|
294
|
-
const
|
|
295
|
-
function
|
|
296
|
-
const n =
|
|
294
|
+
const Vt = 5;
|
|
295
|
+
function Et({ comments: e }) {
|
|
296
|
+
const n = v(), o = Pt(e, Vt), i = !!_("textTrack"), s = o.map((c) => /* @__PURE__ */ t(Rt, { comment: c }, c.id));
|
|
297
297
|
return e.length > 0 && n.state.commentsEnabled ? /* @__PURE__ */ t(
|
|
298
298
|
"div",
|
|
299
299
|
{
|
|
300
|
-
className:
|
|
300
|
+
className: E.commentsOverlay,
|
|
301
301
|
style: {
|
|
302
302
|
flexDirection: n.state.captionPositionOnTop && i ? "column-reverse" : "column"
|
|
303
303
|
},
|
|
304
|
-
children: /* @__PURE__ */ t("div", { className:
|
|
304
|
+
children: /* @__PURE__ */ t("div", { className: E.commentsContainer, children: i ? s.slice(-4) : s })
|
|
305
305
|
}
|
|
306
306
|
) : null;
|
|
307
307
|
}
|
|
308
|
-
const
|
|
309
|
-
root:
|
|
308
|
+
const Bt = "_root_1x28e_1", At = "_left-controls_1x28e_28", Ot = "_right-controls_1x28e_34", Ft = "_indicators_1x28e_40", Zt = "_normal-timeline_1x28e_49", $t = "_compact-timeline_1x28e_55", R = {
|
|
309
|
+
root: Bt,
|
|
310
310
|
"left-controls": "_left-controls_1x28e_28",
|
|
311
|
-
leftControls:
|
|
311
|
+
leftControls: At,
|
|
312
312
|
"right-controls": "_right-controls_1x28e_34",
|
|
313
|
-
rightControls:
|
|
314
|
-
indicators:
|
|
313
|
+
rightControls: Ot,
|
|
314
|
+
indicators: Ft,
|
|
315
315
|
"normal-timeline": "_normal-timeline_1x28e_49",
|
|
316
|
-
normalTimeline:
|
|
316
|
+
normalTimeline: Zt,
|
|
317
317
|
"compact-timeline": "_compact-timeline_1x28e_55",
|
|
318
|
-
compactTimeline:
|
|
318
|
+
compactTimeline: $t
|
|
319
319
|
};
|
|
320
|
-
function
|
|
320
|
+
function Kt({
|
|
321
321
|
darkMode: e,
|
|
322
322
|
playerRef: n,
|
|
323
323
|
showCaptionsButton: o = !0
|
|
324
324
|
}) {
|
|
325
|
-
const i =
|
|
326
|
-
return
|
|
325
|
+
const i = A();
|
|
326
|
+
return B(() => {
|
|
327
327
|
i && (i.remoteControl.pauseControls(), n && (n.current = i));
|
|
328
|
-
}, [i, n]), /* @__PURE__ */
|
|
328
|
+
}, [i, n]), /* @__PURE__ */ a("div", { "data-darkmode": e, className: R.root, children: [
|
|
329
329
|
/* @__PURE__ */ t(he, { className: R.normalTimeline }),
|
|
330
|
-
/* @__PURE__ */
|
|
331
|
-
/* @__PURE__ */ t(
|
|
332
|
-
/* @__PURE__ */ t(
|
|
330
|
+
/* @__PURE__ */ a("div", { className: R.leftControls, children: [
|
|
331
|
+
/* @__PURE__ */ t(ro, {}),
|
|
332
|
+
/* @__PURE__ */ t(hi, {})
|
|
333
333
|
] }),
|
|
334
|
-
/* @__PURE__ */ t("div", { className: R.indicators, children: /* @__PURE__ */ t(
|
|
334
|
+
/* @__PURE__ */ t("div", { className: R.indicators, children: /* @__PURE__ */ t(yo, {}) }),
|
|
335
335
|
/* @__PURE__ */ t(he, { className: R.compactTimeline }),
|
|
336
|
-
/* @__PURE__ */
|
|
337
|
-
o && /* @__PURE__ */ t(
|
|
338
|
-
/* @__PURE__ */ t(
|
|
339
|
-
/* @__PURE__ */ t(
|
|
336
|
+
/* @__PURE__ */ a("div", { className: R.rightControls, children: [
|
|
337
|
+
o && /* @__PURE__ */ t(gt, {}),
|
|
338
|
+
/* @__PURE__ */ t(Vn, {}),
|
|
339
|
+
/* @__PURE__ */ t(Qn, {})
|
|
340
340
|
] })
|
|
341
341
|
] });
|
|
342
342
|
}
|
|
343
|
-
const P = te(null),
|
|
343
|
+
const P = te(null), Dt = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6 3.03704L7.03704 2L14.037 9L7.03704 16L6 14.963L11.963 9L6 3.03704Z", fill: "currentColor" }) }), zt = "_menu-hint_k49ve_1", Ut = "_menu-button_k49ve_5", jt = "_menu-label_k49ve_37", qt = "_menu-icon_k49ve_42", q = {
|
|
344
344
|
"menu-hint": "_menu-hint_k49ve_1",
|
|
345
|
-
menuHint:
|
|
345
|
+
menuHint: zt,
|
|
346
346
|
"menu-button": "_menu-button_k49ve_5",
|
|
347
|
-
menuButton:
|
|
347
|
+
menuButton: Ut,
|
|
348
348
|
"menu-label": "_menu-label_k49ve_37",
|
|
349
|
-
menuLabel:
|
|
349
|
+
menuLabel: jt,
|
|
350
350
|
"menu-icon": "_menu-icon_k49ve_42",
|
|
351
|
-
menuIcon:
|
|
351
|
+
menuIcon: qt
|
|
352
352
|
};
|
|
353
|
-
function
|
|
354
|
-
return /* @__PURE__ */
|
|
355
|
-
i && /* @__PURE__ */ t(i, { className:
|
|
356
|
-
/* @__PURE__ */ t("span", { className:
|
|
357
|
-
/* @__PURE__ */ t("span", { className:
|
|
358
|
-
/* @__PURE__ */ t(
|
|
353
|
+
function K({ label: e, hint: n, onClick: o, Icon: i }) {
|
|
354
|
+
return /* @__PURE__ */ a("button", { type: "button", className: q.menuButton, onClick: o, children: [
|
|
355
|
+
i && /* @__PURE__ */ t(i, { className: q.menuIcon }),
|
|
356
|
+
/* @__PURE__ */ t("span", { className: q.menuLabel, children: e }),
|
|
357
|
+
/* @__PURE__ */ t("span", { className: q.menuHint, children: n }),
|
|
358
|
+
/* @__PURE__ */ t(Dt, {})
|
|
359
359
|
] });
|
|
360
360
|
}
|
|
361
|
-
const
|
|
362
|
-
function
|
|
363
|
-
const e = x(P), n = _("playbackRate"), { t: o } =
|
|
361
|
+
const Wt = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.42229 2.82911C4.71149 1.83006 6.23876 1.19768 7.8383 1L7.96797 2.05432C6.55867 2.22862 5.21101 2.7866 4.07273 3.66874L3.42229 2.82911ZM5.44493 6.71393L9.49745 10.7665L17.0924 3.1705L17.8438 3.92297L9.49745 12.2693L4.69352 7.46534L5.44493 6.71393ZM17.932 8.83829C17.8618 8.27074 17.7364 7.70745 17.5589 7.16222L16.5482 7.49276C16.7055 7.97209 16.816 8.46843 16.8766 8.96689C16.917 9.29742 16.9372 9.6269 16.9372 9.96594C16.9372 10.305 16.917 10.6344 16.8777 10.9639C16.7033 12.3732 16.1454 13.7209 15.2632 14.8592L16.1029 15.5096C17.1019 14.2204 17.7343 12.6931 17.932 11.0925C17.9766 10.7205 18 10.3486 18 9.96594C18 9.58332 17.9766 9.21134 17.932 8.83829ZM1.05432 8.96795L0 8.83829C0.197684 7.23874 0.830061 5.71147 1.82911 4.42228L2.66874 5.07272C1.7866 6.211 1.22862 7.55865 1.05432 8.96795ZM0 11.0936C0.197684 12.6931 0.830061 14.2204 1.82911 15.5096L2.66874 14.8591C1.7866 13.7209 1.22862 12.3732 1.05432 10.9639L0 11.0936ZM10.0939 1.00011C11.6935 1.19673 13.2207 1.83017 14.5099 2.82922L13.8595 3.66884C12.7202 2.7867 11.3736 2.22872 9.96426 2.05442L10.0939 1.00011Z", fill: "currentColor" }) });
|
|
362
|
+
function Gt() {
|
|
363
|
+
const e = x(P), n = _("playbackRate"), { t: o } = C(), i = p(() => {
|
|
364
364
|
e && e.setPage("speed");
|
|
365
365
|
}, [e]);
|
|
366
366
|
return e ? /* @__PURE__ */ t(
|
|
367
|
-
|
|
367
|
+
K,
|
|
368
368
|
{
|
|
369
369
|
label: o("PLAYBACK_SPEED"),
|
|
370
370
|
hint: `${n}x`,
|
|
371
371
|
onClick: i,
|
|
372
|
-
Icon:
|
|
372
|
+
Icon: Wt
|
|
373
373
|
}
|
|
374
374
|
) : null;
|
|
375
375
|
}
|
|
376
|
-
function
|
|
377
|
-
const e = x(P), n = _("hasCaptions"), o = _("textTrack"), { t: i } =
|
|
376
|
+
function Qt() {
|
|
377
|
+
const e = x(P), n = _("hasCaptions"), o = _("textTrack"), { t: i } = C(), s = p(() => {
|
|
378
378
|
e && e.setPage("captions");
|
|
379
379
|
}, [e]);
|
|
380
380
|
return e && n ? /* @__PURE__ */ t(
|
|
381
|
-
|
|
381
|
+
K,
|
|
382
382
|
{
|
|
383
383
|
label: i("CAPTIONS"),
|
|
384
384
|
hint: (o == null ? void 0 : o.label) ?? i("OFF"),
|
|
385
|
-
onClick:
|
|
386
|
-
Icon:
|
|
385
|
+
onClick: s,
|
|
386
|
+
Icon: Te
|
|
387
387
|
}
|
|
388
388
|
) : null;
|
|
389
389
|
}
|
|
390
|
-
const
|
|
390
|
+
const Yt = (e) => /* @__PURE__ */ a("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: [
|
|
391
391
|
/* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_412_23039", children: /* @__PURE__ */ t("rect", { width: 18, height: 18, fill: "white" }) }) }),
|
|
392
|
-
/* @__PURE__ */
|
|
392
|
+
/* @__PURE__ */ a("g", { clipPath: "url(#clip0_412_23039)", children: [
|
|
393
393
|
/* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2.46326 3.85039H0V2.65039H2.46326C2.7388 1.36449 3.88181 0.400391 5.24999 0.400391C6.61818 0.400391 7.76119 1.36449 8.03673 2.65039H18V3.85039H8.03673C7.76119 5.13629 6.61818 6.10039 5.24999 6.10039C3.88181 6.10039 2.7388 5.13629 2.46326 3.85039ZM3.59999 3.25039C3.59999 2.33912 4.33872 1.60039 5.24999 1.60039C6.16126 1.60039 6.89999 2.33912 6.89999 3.25039C6.89999 4.16166 6.16126 4.90039 5.24999 4.90039C4.33872 4.90039 3.59999 4.16166 3.59999 3.25039Z", fill: "currentColor" }),
|
|
394
394
|
/* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0 8.40039H9.46326C9.7388 7.11449 10.8818 6.15039 12.25 6.15039C13.6182 6.15039 14.7612 7.11449 15.0367 8.40039H18V9.60039H15.0367C14.7612 10.8863 13.6182 11.8504 12.25 11.8504C10.8818 11.8504 9.7388 10.8863 9.46326 9.60039H0V8.40039ZM12.25 7.35039C11.3387 7.35039 10.6 8.08912 10.6 9.00039C10.6 9.91166 11.3387 10.6504 12.25 10.6504C13.1613 10.6504 13.9 9.91166 13.9 9.00039C13.9 8.08912 13.1613 7.35039 12.25 7.35039Z", fill: "currentColor" }),
|
|
395
395
|
/* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.24999 17.6004C6.61818 17.6004 7.76119 16.6363 8.03673 15.3504H18V14.1504H8.03673C7.76119 12.8645 6.61818 11.9004 5.24999 11.9004C3.88181 11.9004 2.7388 12.8645 2.46326 14.1504H0V15.3504H2.46326C2.7388 16.6363 3.88181 17.6004 5.24999 17.6004ZM5.24999 13.1004C4.33872 13.1004 3.59999 13.8391 3.59999 14.7504C3.59999 15.6617 4.33872 16.4004 5.24999 16.4004C6.16126 16.4004 6.89999 15.6617 6.89999 14.7504C6.89999 13.8391 6.16126 13.1004 5.24999 13.1004Z", fill: "currentColor" })
|
|
396
396
|
] })
|
|
397
397
|
] });
|
|
398
|
-
function
|
|
399
|
-
const e = x(P), n = _("autoQuality"), o = _("quality"), { t: i } =
|
|
398
|
+
function Xt() {
|
|
399
|
+
const e = x(P), n = _("autoQuality"), o = _("quality"), { t: i } = C(), s = p(() => {
|
|
400
400
|
e && e.setPage("quality");
|
|
401
401
|
}, [e]);
|
|
402
402
|
return e && o ? /* @__PURE__ */ t(
|
|
403
|
-
|
|
403
|
+
K,
|
|
404
404
|
{
|
|
405
405
|
label: i("QUALITY"),
|
|
406
406
|
hint: n ? i("AUTO", { quality: o.height }) : `${o.height}p`,
|
|
407
|
-
onClick:
|
|
408
|
-
Icon:
|
|
407
|
+
onClick: s,
|
|
408
|
+
Icon: Yt
|
|
409
409
|
}
|
|
410
410
|
) : null;
|
|
411
411
|
}
|
|
412
|
-
const
|
|
412
|
+
const Jt = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { d: "M 21.798373,3.342155 8.8843977,16.256145 2.2000774,9.571825 0,11.771895 8.8843977,20.657845 24,5.543795 Z", fill: "currentColor" }) }), en = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { d: "M 9.64706,12 4,17.64706 6.35293,20 12,14.35293 17.64706,20 20,17.64706 14.35293,12 20,6.35293 17.64706,4 12,9.64706 6.35293,4 4,6.35293 Z", fill: "currentColor" }) }), tn = "_switch-track_vptv3_1", nn = "_switch-thumb_vptv3_11", on = "_switch-icon_vptv3_25", sn = "_switch-body_vptv3_31", an = "_switch-label_vptv3_68", cn = "_menu-icon_vptv3_72", I = {
|
|
413
413
|
"switch-track": "_switch-track_vptv3_1",
|
|
414
|
-
switchTrack:
|
|
414
|
+
switchTrack: tn,
|
|
415
415
|
"switch-thumb": "_switch-thumb_vptv3_11",
|
|
416
|
-
switchThumb:
|
|
416
|
+
switchThumb: nn,
|
|
417
417
|
"switch-icon": "_switch-icon_vptv3_25",
|
|
418
|
-
switchIcon:
|
|
418
|
+
switchIcon: on,
|
|
419
419
|
"switch-body": "_switch-body_vptv3_31",
|
|
420
|
-
switchBody:
|
|
420
|
+
switchBody: sn,
|
|
421
421
|
"switch-label": "_switch-label_vptv3_68",
|
|
422
|
-
switchLabel:
|
|
422
|
+
switchLabel: an,
|
|
423
423
|
"menu-icon": "_menu-icon_vptv3_72",
|
|
424
|
-
menuIcon:
|
|
424
|
+
menuIcon: cn
|
|
425
425
|
};
|
|
426
426
|
function ne({
|
|
427
427
|
label: e,
|
|
@@ -429,36 +429,36 @@ function ne({
|
|
|
429
429
|
onClick: o,
|
|
430
430
|
Icon: i
|
|
431
431
|
}) {
|
|
432
|
-
const
|
|
432
|
+
const s = p(
|
|
433
433
|
(c) => {
|
|
434
434
|
(c.key === "Enter" || c.key === " ") && (o == null || o());
|
|
435
435
|
},
|
|
436
436
|
[o]
|
|
437
437
|
);
|
|
438
|
-
return /* @__PURE__ */
|
|
438
|
+
return /* @__PURE__ */ a(
|
|
439
439
|
"div",
|
|
440
440
|
{
|
|
441
441
|
className: I.switchBody,
|
|
442
442
|
role: "menuitemcheckbox",
|
|
443
443
|
"aria-checked": n,
|
|
444
444
|
onClick: o,
|
|
445
|
-
onKeyDown:
|
|
445
|
+
onKeyDown: s,
|
|
446
446
|
tabIndex: 0,
|
|
447
447
|
children: [
|
|
448
448
|
i && /* @__PURE__ */ t(i, { className: I.menuIcon }),
|
|
449
449
|
/* @__PURE__ */ t("span", { className: I.switchLabel, children: e }),
|
|
450
|
-
/* @__PURE__ */ t("div", { className: I.switchTrack, children: /* @__PURE__ */ t("div", { className: I.switchThumb, children: n ? /* @__PURE__ */ t(
|
|
450
|
+
/* @__PURE__ */ t("div", { className: I.switchTrack, children: /* @__PURE__ */ t("div", { className: I.switchThumb, children: n ? /* @__PURE__ */ t(Jt, { className: I.switchIcon }) : /* @__PURE__ */ t(en, { className: I.switchIcon }) }) })
|
|
451
451
|
]
|
|
452
452
|
}
|
|
453
453
|
);
|
|
454
454
|
}
|
|
455
|
-
const
|
|
456
|
-
function
|
|
457
|
-
const { t: e } =
|
|
455
|
+
const ln = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1 0V12.7489H5.44V18L10.5007 12.7489H16.582V0H1ZM2 1H15.58V11.7339H9.98655L6.52667 15.25V11.7339H2V1ZM5.24963 5.35011H12.3323V4.24835H5.24963V5.35011ZM5.24963 8.18462H9.50067V7.08285H5.24963V8.18462Z", fill: "currentColor" }) });
|
|
456
|
+
function rn() {
|
|
457
|
+
const { t: e } = C(), n = S(), o = v();
|
|
458
458
|
return !n.forceComments && n.hasComments ? /* @__PURE__ */ t(
|
|
459
459
|
ne,
|
|
460
460
|
{
|
|
461
|
-
Icon:
|
|
461
|
+
Icon: ln,
|
|
462
462
|
label: e("COMMENTS"),
|
|
463
463
|
onClick: o.toggleComments,
|
|
464
464
|
checked: o.state.commentsEnabled
|
|
@@ -466,7 +466,7 @@ function dn() {
|
|
|
466
466
|
) : null;
|
|
467
467
|
}
|
|
468
468
|
function H(e) {
|
|
469
|
-
|
|
469
|
+
B(() => {
|
|
470
470
|
const n = (o) => {
|
|
471
471
|
o.key === "Escape" && (e == null || e());
|
|
472
472
|
};
|
|
@@ -475,55 +475,55 @@ function H(e) {
|
|
|
475
475
|
};
|
|
476
476
|
}, []);
|
|
477
477
|
}
|
|
478
|
-
const
|
|
478
|
+
const un = "_main-menu_7h96l_1", dn = {
|
|
479
479
|
"main-menu": "_main-menu_7h96l_1",
|
|
480
|
-
mainMenu:
|
|
480
|
+
mainMenu: un
|
|
481
481
|
};
|
|
482
|
-
function
|
|
482
|
+
function mn() {
|
|
483
483
|
const e = x(P);
|
|
484
|
-
return H(e == null ? void 0 : e.toggle), /* @__PURE__ */
|
|
485
|
-
/* @__PURE__ */ t(
|
|
486
|
-
/* @__PURE__ */ t(
|
|
487
|
-
/* @__PURE__ */ t(
|
|
488
|
-
/* @__PURE__ */ t(
|
|
484
|
+
return H(e == null ? void 0 : e.toggle), /* @__PURE__ */ a("div", { className: dn.mainMenu, children: [
|
|
485
|
+
/* @__PURE__ */ t(Gt, {}),
|
|
486
|
+
/* @__PURE__ */ t(Qt, {}),
|
|
487
|
+
/* @__PURE__ */ t(rn, {}),
|
|
488
|
+
/* @__PURE__ */ t(Xt, {})
|
|
489
489
|
] });
|
|
490
490
|
}
|
|
491
|
-
const Q = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M17.1347 3.00061L6.55157 13.5825L0.865302 7.89624L0 8.76154L6.55157 15.3131L17.9988 3.86469L17.1347 3.00061Z", fill: "currentColor" }) }),
|
|
491
|
+
const Q = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M17.1347 3.00061L6.55157 13.5825L0.865302 7.89624L0 8.76154L6.55157 15.3131L17.9988 3.86469L17.1347 3.00061Z", fill: "currentColor" }) }), D = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.037 3.03704L6.07407 9L12.037 14.963L11 16L4 9L11 2L12.037 3.03704Z", fill: "currentColor" }) }), hn = "_menu-container_1bjr3_1", pn = "_menu-options_1bjr3_6", _n = "_menu-heading_1bjr3_11", fn = "_check-icon_1bjr3_27", Cn = "_menu-item-label_1bjr3_33", vn = "_menu-item_1bjr3_33", gn = "_menu-back-button_1bjr3_66", r = {
|
|
492
492
|
"menu-container": "_menu-container_1bjr3_1",
|
|
493
|
-
menuContainer:
|
|
493
|
+
menuContainer: hn,
|
|
494
494
|
"menu-options": "_menu-options_1bjr3_6",
|
|
495
|
-
menuOptions:
|
|
495
|
+
menuOptions: pn,
|
|
496
496
|
"menu-heading": "_menu-heading_1bjr3_11",
|
|
497
|
-
menuHeading:
|
|
497
|
+
menuHeading: _n,
|
|
498
498
|
"check-icon": "_check-icon_1bjr3_27",
|
|
499
|
-
checkIcon:
|
|
499
|
+
checkIcon: fn,
|
|
500
500
|
"menu-item-label": "_menu-item-label_1bjr3_33",
|
|
501
|
-
menuItemLabel:
|
|
501
|
+
menuItemLabel: Cn,
|
|
502
502
|
"menu-item": "_menu-item_1bjr3_33",
|
|
503
|
-
menuItem:
|
|
503
|
+
menuItem: vn,
|
|
504
504
|
"menu-back-button": "_menu-back-button_1bjr3_66",
|
|
505
|
-
menuBackButton:
|
|
505
|
+
menuBackButton: gn
|
|
506
506
|
};
|
|
507
|
-
function
|
|
508
|
-
const e = x(P), n =
|
|
507
|
+
function bn() {
|
|
508
|
+
const e = x(P), n = qe({
|
|
509
509
|
rates: V,
|
|
510
510
|
normalLabel: "1x"
|
|
511
|
-
}), { t: o } =
|
|
512
|
-
return H(e == null ? void 0 : e.backToMain), e ? /* @__PURE__ */
|
|
513
|
-
/* @__PURE__ */
|
|
511
|
+
}), { t: o } = C();
|
|
512
|
+
return H(e == null ? void 0 : e.backToMain), e ? /* @__PURE__ */ a("div", { className: r.menuContainer, children: [
|
|
513
|
+
/* @__PURE__ */ a(
|
|
514
514
|
"button",
|
|
515
515
|
{
|
|
516
516
|
type: "button",
|
|
517
517
|
className: r.menuBackButton,
|
|
518
518
|
onClick: e.backToMain,
|
|
519
519
|
children: [
|
|
520
|
-
/* @__PURE__ */ t(
|
|
520
|
+
/* @__PURE__ */ t(D, {}),
|
|
521
521
|
/* @__PURE__ */ t("span", { children: o("BACK") })
|
|
522
522
|
]
|
|
523
523
|
}
|
|
524
524
|
),
|
|
525
525
|
/* @__PURE__ */ t("strong", { className: r.menuHeading, children: o("PLAYBACK_SPEED") }),
|
|
526
|
-
/* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: n.map(({ value: i, label:
|
|
526
|
+
/* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: n.map(({ value: i, label: s, select: c, selected: l }) => /* @__PURE__ */ a(
|
|
527
527
|
"button",
|
|
528
528
|
{
|
|
529
529
|
type: "button",
|
|
@@ -535,19 +535,19 @@ function kn() {
|
|
|
535
535
|
className: r.menuItem,
|
|
536
536
|
children: [
|
|
537
537
|
/* @__PURE__ */ t(Q, { className: r.checkIcon }),
|
|
538
|
-
/* @__PURE__ */ t("span", { className: r.menuItemLabel, children:
|
|
538
|
+
/* @__PURE__ */ t("span", { className: r.menuItemLabel, children: s })
|
|
539
539
|
]
|
|
540
540
|
},
|
|
541
541
|
i
|
|
542
542
|
)) })
|
|
543
543
|
] }) : null;
|
|
544
544
|
}
|
|
545
|
-
function
|
|
546
|
-
const e = x(P), n = _("textTrack"), { t: o } =
|
|
545
|
+
function wn() {
|
|
546
|
+
const e = x(P), n = _("textTrack"), { t: o } = C(), i = p(() => {
|
|
547
547
|
e && e.setPage("captionLanguage");
|
|
548
548
|
}, [e]);
|
|
549
549
|
return e ? /* @__PURE__ */ t(
|
|
550
|
-
|
|
550
|
+
K,
|
|
551
551
|
{
|
|
552
552
|
label: o("LANGUAGE"),
|
|
553
553
|
hint: (n == null ? void 0 : n.label) ?? o("OFF"),
|
|
@@ -555,12 +555,12 @@ function yn() {
|
|
|
555
555
|
}
|
|
556
556
|
) : null;
|
|
557
557
|
}
|
|
558
|
-
function
|
|
559
|
-
const { t: e } =
|
|
558
|
+
function kn() {
|
|
559
|
+
const { t: e } = C(), n = v(), o = x(P), i = p(() => {
|
|
560
560
|
o && o.setPage("captionFontSize");
|
|
561
561
|
}, [o]);
|
|
562
562
|
return o ? /* @__PURE__ */ t(
|
|
563
|
-
|
|
563
|
+
K,
|
|
564
564
|
{
|
|
565
565
|
label: e("CAPTION_FONT_SIZE"),
|
|
566
566
|
hint: `${n.state.captionsFontSizeMultiplier * 100}%`,
|
|
@@ -568,8 +568,8 @@ function Ln() {
|
|
|
568
568
|
}
|
|
569
569
|
) : null;
|
|
570
570
|
}
|
|
571
|
-
function
|
|
572
|
-
const { t: e } =
|
|
571
|
+
function yn() {
|
|
572
|
+
const { t: e } = C(), n = v();
|
|
573
573
|
return /* @__PURE__ */ t(
|
|
574
574
|
ne,
|
|
575
575
|
{
|
|
@@ -579,8 +579,8 @@ function xn() {
|
|
|
579
579
|
}
|
|
580
580
|
);
|
|
581
581
|
}
|
|
582
|
-
function
|
|
583
|
-
const { t: e } =
|
|
582
|
+
function Ln() {
|
|
583
|
+
const { t: e } = C(), n = v();
|
|
584
584
|
return /* @__PURE__ */ t(
|
|
585
585
|
ne,
|
|
586
586
|
{
|
|
@@ -590,45 +590,45 @@ function Pn() {
|
|
|
590
590
|
}
|
|
591
591
|
);
|
|
592
592
|
}
|
|
593
|
-
function
|
|
594
|
-
const e = x(P), { t: n } =
|
|
595
|
-
return H(e == null ? void 0 : e.backToMain), e ? /* @__PURE__ */
|
|
596
|
-
/* @__PURE__ */
|
|
593
|
+
function xn() {
|
|
594
|
+
const e = x(P), { t: n } = C(), { disableCaptionSettings: o } = v();
|
|
595
|
+
return H(e == null ? void 0 : e.backToMain), e ? /* @__PURE__ */ a("div", { className: r.menuContainer, children: [
|
|
596
|
+
/* @__PURE__ */ a(
|
|
597
597
|
"button",
|
|
598
598
|
{
|
|
599
599
|
type: "button",
|
|
600
600
|
className: r.menuBackButton,
|
|
601
601
|
onClick: e.backToMain,
|
|
602
602
|
children: [
|
|
603
|
-
/* @__PURE__ */ t(
|
|
603
|
+
/* @__PURE__ */ t(D, {}),
|
|
604
604
|
/* @__PURE__ */ t("span", { children: n("BACK") })
|
|
605
605
|
]
|
|
606
606
|
}
|
|
607
607
|
),
|
|
608
608
|
/* @__PURE__ */ t("strong", { className: r.menuHeading, children: n("CAPTIONS") }),
|
|
609
|
-
!o && /* @__PURE__ */ t(
|
|
610
|
-
/* @__PURE__ */ t(
|
|
611
|
-
/* @__PURE__ */ t(
|
|
612
|
-
/* @__PURE__ */ t(
|
|
609
|
+
!o && /* @__PURE__ */ t(wn, {}),
|
|
610
|
+
/* @__PURE__ */ t(kn, {}),
|
|
611
|
+
/* @__PURE__ */ t(yn, {}),
|
|
612
|
+
/* @__PURE__ */ t(Ln, {})
|
|
613
613
|
] }) : null;
|
|
614
614
|
}
|
|
615
|
-
function
|
|
616
|
-
const e = x(P), n =
|
|
617
|
-
return H(e == null ? void 0 : e.backToCaptions), e ? /* @__PURE__ */
|
|
618
|
-
/* @__PURE__ */
|
|
615
|
+
function Pn() {
|
|
616
|
+
const e = x(P), n = We(), { t: o } = C();
|
|
617
|
+
return H(e == null ? void 0 : e.backToCaptions), e ? /* @__PURE__ */ a("div", { className: r.menuContainer, children: [
|
|
618
|
+
/* @__PURE__ */ a(
|
|
619
619
|
"button",
|
|
620
620
|
{
|
|
621
621
|
type: "button",
|
|
622
622
|
className: r.menuBackButton,
|
|
623
623
|
onClick: e.backToCaptions,
|
|
624
624
|
children: [
|
|
625
|
-
/* @__PURE__ */ t(
|
|
625
|
+
/* @__PURE__ */ t(D, {}),
|
|
626
626
|
/* @__PURE__ */ t("span", { children: o("BACK") })
|
|
627
627
|
]
|
|
628
628
|
}
|
|
629
629
|
),
|
|
630
630
|
/* @__PURE__ */ t("strong", { className: r.menuHeading, children: o("CAPTIONS") }),
|
|
631
|
-
/* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: n.map(({ value: i, label:
|
|
631
|
+
/* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: n.map(({ value: i, label: s, select: c, selected: l }) => /* @__PURE__ */ a(
|
|
632
632
|
"button",
|
|
633
633
|
{
|
|
634
634
|
type: "button",
|
|
@@ -640,30 +640,30 @@ function Tn() {
|
|
|
640
640
|
className: r.menuItem,
|
|
641
641
|
children: [
|
|
642
642
|
/* @__PURE__ */ t(Q, { className: r.checkIcon }),
|
|
643
|
-
/* @__PURE__ */ t("span", { className: r.menuItemLabel, children:
|
|
643
|
+
/* @__PURE__ */ t("span", { className: r.menuItemLabel, children: s })
|
|
644
644
|
]
|
|
645
645
|
},
|
|
646
646
|
i
|
|
647
647
|
)) })
|
|
648
648
|
] }) : null;
|
|
649
649
|
}
|
|
650
|
-
function
|
|
651
|
-
const e =
|
|
652
|
-
return H(n == null ? void 0 : n.backToCaptions), n ? /* @__PURE__ */
|
|
653
|
-
/* @__PURE__ */
|
|
650
|
+
function Nn() {
|
|
651
|
+
const e = v(), n = x(P), { t: o } = C();
|
|
652
|
+
return H(n == null ? void 0 : n.backToCaptions), n ? /* @__PURE__ */ a("div", { className: r.menuContainer, children: [
|
|
653
|
+
/* @__PURE__ */ a(
|
|
654
654
|
"button",
|
|
655
655
|
{
|
|
656
656
|
type: "button",
|
|
657
657
|
className: r.menuBackButton,
|
|
658
658
|
onClick: n.backToCaptions,
|
|
659
659
|
children: [
|
|
660
|
-
/* @__PURE__ */ t(
|
|
660
|
+
/* @__PURE__ */ t(D, {}),
|
|
661
661
|
/* @__PURE__ */ t("span", { children: o("BACK") })
|
|
662
662
|
]
|
|
663
663
|
}
|
|
664
664
|
),
|
|
665
665
|
/* @__PURE__ */ t("strong", { className: r.menuHeading, children: o("CAPTIONS") }),
|
|
666
|
-
/* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children:
|
|
666
|
+
/* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: yt.map((i) => /* @__PURE__ */ a(
|
|
667
667
|
"button",
|
|
668
668
|
{
|
|
669
669
|
type: "button",
|
|
@@ -675,7 +675,7 @@ function Mn() {
|
|
|
675
675
|
className: r.menuItem,
|
|
676
676
|
children: [
|
|
677
677
|
/* @__PURE__ */ t(Q, { className: r.checkIcon }),
|
|
678
|
-
/* @__PURE__ */
|
|
678
|
+
/* @__PURE__ */ a("span", { className: r.menuItemLabel, children: [
|
|
679
679
|
i * 100,
|
|
680
680
|
"%"
|
|
681
681
|
] })
|
|
@@ -685,28 +685,28 @@ function Mn() {
|
|
|
685
685
|
)) })
|
|
686
686
|
] }) : null;
|
|
687
687
|
}
|
|
688
|
-
function
|
|
689
|
-
const e = x(P), n =
|
|
690
|
-
return H(e == null ? void 0 : e.backToMain), e ? /* @__PURE__ */
|
|
691
|
-
/* @__PURE__ */
|
|
688
|
+
function Tn() {
|
|
689
|
+
const e = x(P), n = Ge({ sort: "descending" }), o = _("autoQuality"), { t: i } = C();
|
|
690
|
+
return H(e == null ? void 0 : e.backToMain), e ? /* @__PURE__ */ a("div", { className: r.menuContainer, children: [
|
|
691
|
+
/* @__PURE__ */ a(
|
|
692
692
|
"button",
|
|
693
693
|
{
|
|
694
694
|
type: "button",
|
|
695
695
|
className: r.menuBackButton,
|
|
696
696
|
onClick: e.backToMain,
|
|
697
697
|
children: [
|
|
698
|
-
/* @__PURE__ */ t(
|
|
698
|
+
/* @__PURE__ */ t(D, {}),
|
|
699
699
|
/* @__PURE__ */ t("span", { children: i("BACK") })
|
|
700
700
|
]
|
|
701
701
|
}
|
|
702
702
|
),
|
|
703
703
|
/* @__PURE__ */ t("strong", { className: r.menuHeading, children: i("QUALITY") }),
|
|
704
|
-
/* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: n.map(({ value:
|
|
704
|
+
/* @__PURE__ */ t("div", { role: "menu", className: r.menuOptions, children: n.map(({ value: s, label: c, select: l, selected: u }) => /* @__PURE__ */ a(
|
|
705
705
|
"button",
|
|
706
706
|
{
|
|
707
707
|
type: "button",
|
|
708
708
|
role: "menuitemradio",
|
|
709
|
-
"aria-checked":
|
|
709
|
+
"aria-checked": s === "auto" && o || u && !o,
|
|
710
710
|
onClick: () => {
|
|
711
711
|
l(), e.backToMain(), e.toggle();
|
|
712
712
|
},
|
|
@@ -716,20 +716,20 @@ function In() {
|
|
|
716
716
|
/* @__PURE__ */ t("span", { className: r.menuItemLabel, children: c })
|
|
717
717
|
]
|
|
718
718
|
},
|
|
719
|
-
|
|
719
|
+
s
|
|
720
720
|
)) })
|
|
721
721
|
] }) : null;
|
|
722
722
|
}
|
|
723
|
-
const
|
|
724
|
-
main:
|
|
725
|
-
speed:
|
|
726
|
-
captions:
|
|
727
|
-
captionLanguage:
|
|
728
|
-
captionFontSize:
|
|
729
|
-
quality:
|
|
723
|
+
const Mn = {
|
|
724
|
+
main: mn,
|
|
725
|
+
speed: bn,
|
|
726
|
+
captions: xn,
|
|
727
|
+
captionLanguage: Pn,
|
|
728
|
+
captionFontSize: Nn,
|
|
729
|
+
quality: Tn
|
|
730
730
|
};
|
|
731
|
-
function
|
|
732
|
-
const [e, n] = T("main"), [o, i] = T(!1),
|
|
731
|
+
function In() {
|
|
732
|
+
const [e, n] = T("main"), [o, i] = T(!1), s = p(() => {
|
|
733
733
|
i((M) => !M);
|
|
734
734
|
}, []), c = p((M) => {
|
|
735
735
|
n(M);
|
|
@@ -737,24 +737,24 @@ function Hn() {
|
|
|
737
737
|
n("captions");
|
|
738
738
|
}, []), u = p(() => {
|
|
739
739
|
n("main");
|
|
740
|
-
}, []), m =
|
|
740
|
+
}, []), m = $(() => Mn[e], [e]), h = Ce(null), { refs: g, floatingStyles: y, context: k } = ge({
|
|
741
741
|
open: o,
|
|
742
742
|
onOpenChange: (M) => {
|
|
743
743
|
i(M), u();
|
|
744
744
|
},
|
|
745
745
|
placement: "top-end",
|
|
746
|
-
whileElementsMounted:
|
|
746
|
+
whileElementsMounted: be,
|
|
747
747
|
middleware: [
|
|
748
|
-
|
|
749
|
-
|
|
748
|
+
we(),
|
|
749
|
+
ke({
|
|
750
750
|
element: h
|
|
751
751
|
})
|
|
752
752
|
]
|
|
753
|
-
}), b =
|
|
753
|
+
}), b = ye(k, { escapeKey: !1 }), { getReferenceProps: f, getFloatingProps: w } = Le([b]);
|
|
754
754
|
return {
|
|
755
755
|
Page: m,
|
|
756
756
|
open: o,
|
|
757
|
-
toggle:
|
|
757
|
+
toggle: s,
|
|
758
758
|
setPage: c,
|
|
759
759
|
backToCaptions: l,
|
|
760
760
|
backToMain: u,
|
|
@@ -766,18 +766,18 @@ function Hn() {
|
|
|
766
766
|
getFloatingProps: w
|
|
767
767
|
};
|
|
768
768
|
}
|
|
769
|
-
const
|
|
769
|
+
const Sn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M21.0692 12C21.0692 11.4776 21.0212 10.944 20.9238 10.4104L23.5511 8.13318L21.0579 3.87247L17.7431 4.97788C16.9059 4.28329 15.9515 3.73553 14.9449 3.37271L14.2616 0H9.28941L8.60612 3.37129C7.58823 3.73553 6.65082 4.27482 5.80659 4.97647L2.49318 3.87247L0 8.13318L2.62729 10.4104C2.52988 10.944 2.48188 11.4776 2.48188 12C2.48188 12.5224 2.52988 13.056 2.62729 13.5896L0 15.8668L2.49318 20.1275L5.808 19.0221C6.64518 19.7167 7.59953 20.2645 8.60612 20.6273L9.28941 24H14.2616L14.9449 20.6287C15.9614 20.2645 16.9002 19.7252 17.7445 19.0235L21.0579 20.1289L23.5511 15.8682L20.9238 13.5911C21.0212 13.056 21.0692 12.5224 21.0692 12ZM11.7755 16.9412C9.05082 16.9412 6.83435 14.7247 6.83435 12C6.83435 9.2753 9.05082 7.05883 11.7755 7.05883C14.5002 7.05883 16.7167 9.2753 16.7167 12C16.7167 14.7247 14.5002 16.9412 11.7755 16.9412Z", fill: "currentColor" }) }), Hn = "_settings-menu_hxlsv_1", Rn = "_arrow_hxlsv_15", de = {
|
|
770
770
|
"settings-menu": "_settings-menu_hxlsv_1",
|
|
771
|
-
settingsMenu:
|
|
772
|
-
arrow:
|
|
771
|
+
settingsMenu: Hn,
|
|
772
|
+
arrow: Rn
|
|
773
773
|
};
|
|
774
|
-
function
|
|
774
|
+
function Vn() {
|
|
775
775
|
const {
|
|
776
776
|
Page: e,
|
|
777
777
|
arrowRef: n,
|
|
778
778
|
backToCaptions: o,
|
|
779
779
|
backToMain: i,
|
|
780
|
-
context:
|
|
780
|
+
context: s,
|
|
781
781
|
floatingStyles: c,
|
|
782
782
|
getFloatingProps: l,
|
|
783
783
|
getReferenceProps: u,
|
|
@@ -785,8 +785,8 @@ function En() {
|
|
|
785
785
|
refs: h,
|
|
786
786
|
setPage: g,
|
|
787
787
|
toggle: y
|
|
788
|
-
} =
|
|
789
|
-
return /* @__PURE__ */
|
|
788
|
+
} = In(), k = v(), { t: b } = C();
|
|
789
|
+
return /* @__PURE__ */ a(ee, { children: [
|
|
790
790
|
/* @__PURE__ */ t(
|
|
791
791
|
"button",
|
|
792
792
|
{
|
|
@@ -798,10 +798,10 @@ function En() {
|
|
|
798
798
|
"aria-expanded": m,
|
|
799
799
|
tabIndex: k != null && k.state.interactionsDisabled ? -1 : 0,
|
|
800
800
|
...u(),
|
|
801
|
-
children: /* @__PURE__ */ t(
|
|
801
|
+
children: /* @__PURE__ */ t(Sn, { className: "controls-button-icon icon-rotate" })
|
|
802
802
|
}
|
|
803
803
|
),
|
|
804
|
-
m && /* @__PURE__ */ t(
|
|
804
|
+
m && /* @__PURE__ */ t(ot, { context: s, initialFocus: -1, modal: !1, children: /* @__PURE__ */ a(
|
|
805
805
|
"div",
|
|
806
806
|
{
|
|
807
807
|
className: de.settingsMenu,
|
|
@@ -817,10 +817,10 @@ function En() {
|
|
|
817
817
|
}
|
|
818
818
|
),
|
|
819
819
|
/* @__PURE__ */ t(
|
|
820
|
-
|
|
820
|
+
xe,
|
|
821
821
|
{
|
|
822
822
|
ref: n,
|
|
823
|
-
context:
|
|
823
|
+
context: s,
|
|
824
824
|
className: de.arrow
|
|
825
825
|
}
|
|
826
826
|
)
|
|
@@ -829,53 +829,53 @@ function En() {
|
|
|
829
829
|
) })
|
|
830
830
|
] });
|
|
831
831
|
}
|
|
832
|
-
function
|
|
832
|
+
function Se(e, n = 1e3) {
|
|
833
833
|
return function() {
|
|
834
|
-
const i = _("lastKeyboardAction"), [
|
|
835
|
-
return
|
|
834
|
+
const i = _("lastKeyboardAction"), [s, c] = T(!1), l = p(() => c(!1), []);
|
|
835
|
+
return B(() => {
|
|
836
836
|
c(!!i);
|
|
837
837
|
const u = setTimeout(l, n);
|
|
838
838
|
return () => clearTimeout(u);
|
|
839
|
-
}, [i, n]),
|
|
839
|
+
}, [i, n]), s ? /* @__PURE__ */ t(e, {}) : null;
|
|
840
840
|
};
|
|
841
841
|
}
|
|
842
|
-
const oe = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { d: "M 11,21 H 5 V 3 h 6 z m 8,0 H 13 V 3 h 6 z", fill: "currentColor" }) }), ie = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { d: "M 5,2 V 22 L 21,12.000665 Z", fill: "currentColor" }) }),
|
|
842
|
+
const oe = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { d: "M 11,21 H 5 V 3 h 6 z m 8,0 H 13 V 3 h 6 z", fill: "currentColor" }) }), ie = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { d: "M 5,2 V 22 L 21,12.000665 Z", fill: "currentColor" }) }), He = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.1179 1.41211V22.589H11.2943L5.64717 16.9418V7.05928L11.2943 1.41211H14.1179ZM4.23537 7.05928V16.9418H2.11769C0.957618 16.9418 0.0189406 16.0147 0.00028305 14.8592L0 14.8241V9.17696C0 8.01689 0.927077 7.07822 2.0826 7.05956L2.11769 7.05928H4.23537ZM22.3744 7.93711L24 9.56119L21.5623 11.9988L24 14.4365L22.3744 16.0621L19.9383 13.6245L17.5006 16.0621L15.875 14.4365L18.3127 11.9988L15.875 9.56119L17.5006 7.93711L19.9383 10.3748L22.3744 7.93711Z", fill: "currentColor" }) }), Re = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.64714 6.98017V16.8627L11.2943 22.5099H14.1179V1.33301H11.2943L5.64714 6.98017ZM0 9.09785V14.745C0 15.9168 0.945899 16.8627 2.11768 16.8627H4.23537V6.98017H2.11768C0.945899 6.98017 0 7.92607 0 9.09785ZM18.3527 11.9207C18.3527 10.6134 17.8388 9.36962 16.9056 8.4209L17.9094 7.43123C19.1066 8.64396 19.7645 10.2393 19.7645 11.9207C19.7645 13.6036 19.1066 15.1989 17.9094 16.4116L16.9056 15.422C17.8388 14.4732 18.3527 13.2295 18.3527 11.9207Z", fill: "currentColor" }) }), Ve = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.64714 16.8627V6.98017L11.2943 1.33301H14.1179V22.5099H11.2943L5.64714 16.8627ZM0 14.745V9.09785C0 7.92607 0.945899 6.98017 2.11768 6.98017H4.23537V16.8627H2.11768C0.945899 16.8627 0 15.9168 0 14.745ZM16.9056 8.4209C17.8388 9.36962 18.3527 10.6134 18.3527 11.9207C18.3527 13.2295 17.8388 14.4732 16.9056 15.422L17.9094 16.4116C19.1066 15.1989 19.7645 13.6036 19.7645 11.9207C19.7645 10.2393 19.1066 8.64396 17.9094 7.43123L16.9056 8.4209ZM19.9016 5.43185L20.8997 4.43372C22.9002 6.43422 24 9.09403 24 11.9219C24 14.7497 22.9002 17.4081 20.8997 19.4086L19.9016 18.4104C21.6353 16.6782 22.5882 14.3727 22.5882 11.9219C22.5882 9.46957 21.6353 7.16553 19.9016 5.43185Z", fill: "currentColor" }) }), En = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M10.691 3.99987V10.5281L0 4.00655V20.2596L10.691 13.7367V20.2663L23.9987 12.1331L10.691 3.99987Z", fill: "currentColor" }) }), Bn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.309 3.99987L0 12.1331L13.309 20.2663V13.7367L23.9987 20.2596V4.00655L13.309 10.5281V3.99987Z", fill: "currentColor" }) }), An = "_feedback-overlay_v4lbu_1", On = "_feedback-message_v4lbu_14", Fn = "_feedback-icon_v4lbu_30", Zn = "_feedback-icon-animation_v4lbu_1", L = {
|
|
843
843
|
"feedback-overlay": "_feedback-overlay_v4lbu_1",
|
|
844
|
-
feedbackOverlay:
|
|
844
|
+
feedbackOverlay: An,
|
|
845
845
|
"feedback-message": "_feedback-message_v4lbu_14",
|
|
846
|
-
feedbackMessage:
|
|
846
|
+
feedbackMessage: On,
|
|
847
847
|
"feedback-icon": "_feedback-icon_v4lbu_30",
|
|
848
|
-
feedbackIcon:
|
|
848
|
+
feedbackIcon: Fn,
|
|
849
849
|
"feedback-icon-animation": "_feedback-icon-animation_v4lbu_1",
|
|
850
|
-
feedbackIconAnimation:
|
|
850
|
+
feedbackIconAnimation: Zn
|
|
851
851
|
};
|
|
852
|
-
function
|
|
852
|
+
function $n() {
|
|
853
853
|
var o;
|
|
854
|
-
const e =
|
|
854
|
+
const e = ve();
|
|
855
855
|
switch ((o = e.lastKeyboardAction) == null ? void 0 : o.action) {
|
|
856
856
|
case "togglePaused":
|
|
857
857
|
return /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: e.paused ? /* @__PURE__ */ t(oe, {}) : /* @__PURE__ */ t(ie, {}) });
|
|
858
858
|
case "toggleCaptions":
|
|
859
859
|
case "nextCaptionLanguage":
|
|
860
860
|
case "previousCaptionLanguage":
|
|
861
|
-
return e.hasCaptions ? /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: /* @__PURE__ */ t(
|
|
861
|
+
return e.hasCaptions ? /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: /* @__PURE__ */ t(Me, {}) }) : null;
|
|
862
862
|
case "volumeUp":
|
|
863
863
|
case "volumeDown":
|
|
864
864
|
case "toggleMuted":
|
|
865
|
-
return /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: e.muted || e.volume === 0 ? /* @__PURE__ */ t(
|
|
865
|
+
return /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: e.muted || e.volume === 0 ? /* @__PURE__ */ t(He, {}) : e.volume >= 0.5 ? /* @__PURE__ */ t(Ve, {}) : /* @__PURE__ */ t(Re, {}) });
|
|
866
866
|
case "seekForward":
|
|
867
867
|
case "seekForward10":
|
|
868
|
-
return /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: /* @__PURE__ */ t(
|
|
868
|
+
return /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: /* @__PURE__ */ t(En, { className: "right" }) });
|
|
869
869
|
case "seekBackward":
|
|
870
870
|
case "seekBackward10":
|
|
871
|
-
return /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: /* @__PURE__ */ t(
|
|
871
|
+
return /* @__PURE__ */ t("i", { className: L.feedbackIcon, children: /* @__PURE__ */ t(Bn, { className: "left" }) });
|
|
872
872
|
default:
|
|
873
873
|
return null;
|
|
874
874
|
}
|
|
875
875
|
}
|
|
876
|
-
function
|
|
876
|
+
function Kn() {
|
|
877
877
|
var i;
|
|
878
|
-
const { t: e } =
|
|
878
|
+
const { t: e } = C(), n = ve();
|
|
879
879
|
switch ((i = n.lastKeyboardAction) == null ? void 0 : i.action) {
|
|
880
880
|
case "toggleCaptions":
|
|
881
881
|
case "nextCaptionLanguage":
|
|
@@ -901,157 +901,162 @@ function zn() {
|
|
|
901
901
|
return null;
|
|
902
902
|
}
|
|
903
903
|
}
|
|
904
|
-
const
|
|
905
|
-
function
|
|
906
|
-
return /* @__PURE__ */
|
|
907
|
-
/* @__PURE__ */ t(
|
|
908
|
-
/* @__PURE__ */ t(
|
|
904
|
+
const Dn = Se($n, 500), zn = Se(Kn, 1e3);
|
|
905
|
+
function Un() {
|
|
906
|
+
return /* @__PURE__ */ a("div", { className: L.feedbackOverlay, children: [
|
|
907
|
+
/* @__PURE__ */ t(Dn, {}),
|
|
908
|
+
/* @__PURE__ */ t(zn, {})
|
|
909
909
|
] });
|
|
910
910
|
}
|
|
911
|
-
const
|
|
911
|
+
const jn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.1383 0.999867V3.66268H18.4561L3.66281 18.4546V14.1382H1V23H9.86449V20.3372H5.54542L20.3387 5.54528V9.86303H23.0001V0.999867H14.1383Z", fill: "currentColor" }) }), qn = (e) => /* @__PURE__ */ t("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15.562 6.58944L22.1514 0L24.0005 1.84907L17.4111 8.43851H21.6506V11.0552H12.9453V2.34861H15.562V6.58944ZM2.34861 15.5615V12.9461H11.0539V21.6501H8.43982V17.4106L1.84907 24L0 22.1509L6.59075 15.5615H2.34861Z", fill: "currentColor" }) }), Wn = "_full-screen-button_1xm32_2", Gn = {
|
|
912
912
|
"full-screen-button": "_full-screen-button_1xm32_2",
|
|
913
|
-
fullScreenButton:
|
|
913
|
+
fullScreenButton: Wn
|
|
914
914
|
};
|
|
915
|
-
function
|
|
916
|
-
const e = _("fullscreen"), n =
|
|
917
|
-
return
|
|
918
|
-
|
|
915
|
+
function Qn() {
|
|
916
|
+
const e = _("fullscreen"), n = A(), o = v(), i = S(), { t: s } = C();
|
|
917
|
+
return i.hideFullScreen ? null : /* @__PURE__ */ t(
|
|
918
|
+
"button",
|
|
919
919
|
{
|
|
920
|
-
|
|
921
|
-
|
|
922
|
-
"aria-label":
|
|
923
|
-
|
|
920
|
+
role: "button",
|
|
921
|
+
type: "button",
|
|
922
|
+
"aria-label": s(e ? "EXIT_FSCREEN" : "FSCREEN"),
|
|
923
|
+
tabIndex: o.state.interactionsDisabled ? -1 : 0,
|
|
924
|
+
className: `controls-button ${Gn.fullScreenButton}`,
|
|
925
|
+
onClick: () => {
|
|
926
|
+
e ? n == null || n.exitFullscreen() : n == null || n.enterFullscreen();
|
|
927
|
+
},
|
|
928
|
+
children: e ? /* @__PURE__ */ t(qn, { className: "controls-button-icon" }) : /* @__PURE__ */ t(jn, { className: "controls-button-icon" })
|
|
924
929
|
}
|
|
925
930
|
);
|
|
926
931
|
}
|
|
927
|
-
const
|
|
932
|
+
const Yn = "_gestures-container_1fn3b_1", Xn = "_gesture_1fn3b_1", me = {
|
|
928
933
|
"gestures-container": "_gestures-container_1fn3b_1",
|
|
929
|
-
gesturesContainer:
|
|
930
|
-
gesture:
|
|
934
|
+
gesturesContainer: Yn,
|
|
935
|
+
gesture: Xn
|
|
931
936
|
};
|
|
932
|
-
function
|
|
937
|
+
function Jn() {
|
|
933
938
|
const e = G(), n = () => {
|
|
934
939
|
e.togglePaused();
|
|
935
940
|
};
|
|
936
941
|
return /* @__PURE__ */ t("div", { className: me.gesturesContainer, children: /* @__PURE__ */ t("div", { "aria-hidden": !0, className: me.gesture, onClick: n }) });
|
|
937
942
|
}
|
|
938
|
-
const
|
|
943
|
+
const eo = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.76472 10.5294C5.05696 10.5294 5.29413 10.2922 5.29413 9.99999V8.94117C5.29413 8.64893 5.05696 8.41175 4.76472 8.41175H3.7059C3.41366 8.41175 3.17649 8.64893 3.17649 8.94117V9.99999C3.17649 10.2922 3.41366 10.5294 3.7059 10.5294H4.76472ZM11.1177 10.5294C11.4099 10.5294 11.6471 10.2922 11.6471 9.99999V8.94117C11.6471 8.64893 11.4099 8.41175 11.1177 8.41175H10.0588C9.76661 8.41175 9.52944 8.64893 9.52944 8.94117V9.99999C9.52944 10.2922 9.76661 10.5294 10.0588 10.5294H11.1177ZM14.8235 9.99999C14.8235 10.2922 14.5864 10.5294 14.2941 10.5294H13.2353C12.9431 10.5294 12.7059 10.2922 12.7059 9.99999V8.94117C12.7059 8.64893 12.9431 8.41175 13.2353 8.41175H14.2941C14.5864 8.41175 14.8235 8.64893 14.8235 8.94117V9.99999ZM14.8235 13.1765C14.8235 13.4687 14.5864 13.7059 14.2941 13.7059H13.2353C12.9431 13.7059 12.7059 13.4687 12.7059 13.1765V12.1176C12.7059 11.8254 12.9431 11.5882 13.2353 11.5882H14.2941C14.5864 11.5882 14.8235 11.8254 14.8235 12.1176V13.1765ZM11.6471 13.1765C11.6471 13.4687 11.4099 13.7059 11.1177 13.7059H6.88239C6.59015 13.7059 6.35297 13.4687 6.35297 13.1765V12.1176C6.35297 11.8254 6.59015 11.5882 6.88239 11.5882H11.1177C11.4099 11.5882 11.6471 11.8254 11.6471 12.1176V13.1765ZM5.29413 13.1765C5.29413 13.4687 5.05696 13.7059 4.76472 13.7059H3.7059C3.41366 13.7059 3.17649 13.4687 3.17649 13.1765V12.1176C3.17649 11.8254 3.41366 11.5882 3.7059 11.5882H4.76472C5.05696 11.5882 5.29413 11.8254 5.29413 12.1176V13.1765ZM6.88238 8.41175C6.59015 8.41175 6.35297 8.64893 6.35297 8.94117V9.99999C6.35297 10.2922 6.59015 10.5294 6.88238 10.5294H7.94121C8.23344 10.5294 8.47062 10.2922 8.47062 9.99999V8.94117C8.47062 8.64893 8.23344 8.41175 7.94121 8.41175H6.88238ZM16.4118 5.23529H9.57494C9.71471 4.42 10.1933 4.17118 10.8254 3.85565C11.6629 3.43741 12.7059 2.91541 12.7059 1H11.6471C11.6471 2.26106 11.1039 2.53212 10.3511 2.90906C9.59824 3.28494 8.68659 3.75506 8.50871 5.23529H1.58824C0.712588 5.23529 0 5.94788 0 6.82353V15.2941C0 16.1698 0.712588 16.8824 1.58824 16.8824H16.4118C17.2874 16.8824 18 16.1698 18 15.2941V6.82353C18 5.94788 17.2874 5.23529 16.4118 5.23529Z", fill: "currentColor" }) }), Ee = (e) => /* @__PURE__ */ t("svg", { width: 18, height: 18, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e, children: /* @__PURE__ */ t("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8.94968 7.74766L3.99993 2.79791L2.79785 3.99999L7.7476 8.94974L2.79785 13.8995L3.99993 15.1016L8.94968 10.1518L13.8994 15.1016L15.1015 13.8995L10.1518 8.94974L15.1015 3.99999L13.8994 2.79791L8.94968 7.74766Z", fill: "currentColor" }) }), to = "_keyboard-shortcuts-overlay_dr03d_1", no = "_screen-reader-content_dr03d_66", oo = "_keyboard-shortcuts-button_dr03d_80", io = "_close-button_dr03d_106", W = {
|
|
939
944
|
"keyboard-shortcuts-overlay": "_keyboard-shortcuts-overlay_dr03d_1",
|
|
940
|
-
keyboardShortcutsOverlay:
|
|
945
|
+
keyboardShortcutsOverlay: to,
|
|
941
946
|
"screen-reader-content": "_screen-reader-content_dr03d_66",
|
|
942
|
-
screenReaderContent:
|
|
947
|
+
screenReaderContent: no,
|
|
943
948
|
"keyboard-shortcuts-button": "_keyboard-shortcuts-button_dr03d_80",
|
|
944
|
-
keyboardShortcutsButton:
|
|
949
|
+
keyboardShortcutsButton: oo,
|
|
945
950
|
"close-button": "_close-button_dr03d_106",
|
|
946
|
-
closeButton:
|
|
951
|
+
closeButton: io
|
|
947
952
|
};
|
|
948
|
-
function
|
|
949
|
-
const { t: n } =
|
|
953
|
+
function so({ onClose: e }) {
|
|
954
|
+
const { t: n } = C();
|
|
950
955
|
H(e);
|
|
951
956
|
const o = (i) => {
|
|
952
957
|
i && i.focus();
|
|
953
958
|
};
|
|
954
|
-
return /* @__PURE__ */
|
|
959
|
+
return /* @__PURE__ */ a(
|
|
955
960
|
"div",
|
|
956
961
|
{
|
|
957
|
-
className:
|
|
962
|
+
className: W.keyboardShortcutsOverlay,
|
|
958
963
|
tabIndex: 0,
|
|
959
964
|
ref: o,
|
|
960
965
|
role: "dialog",
|
|
961
966
|
"aria-label": n("KEYBOARD_SHORTCUTS"),
|
|
962
967
|
children: [
|
|
963
|
-
/* @__PURE__ */
|
|
968
|
+
/* @__PURE__ */ a("header", { children: [
|
|
964
969
|
/* @__PURE__ */ t("h2", { children: n("KEYBOARD_SHORTCUTS") }),
|
|
965
970
|
/* @__PURE__ */ t(
|
|
966
971
|
"button",
|
|
967
972
|
{
|
|
968
973
|
type: "button",
|
|
969
|
-
className:
|
|
974
|
+
className: W.closeButton,
|
|
970
975
|
onClick: e,
|
|
971
976
|
"aria-label": n("CLOSE"),
|
|
972
977
|
children: /* @__PURE__ */ t(Ee, {})
|
|
973
978
|
}
|
|
974
979
|
)
|
|
975
980
|
] }),
|
|
976
|
-
/* @__PURE__ */
|
|
977
|
-
/* @__PURE__ */ t("caption", { className:
|
|
978
|
-
/* @__PURE__ */ t("thead", { children: /* @__PURE__ */
|
|
981
|
+
/* @__PURE__ */ a("table", { children: [
|
|
982
|
+
/* @__PURE__ */ t("caption", { className: W.screenReaderContent, children: n("KEYBOARD_SHORTCUTS") }),
|
|
983
|
+
/* @__PURE__ */ t("thead", { children: /* @__PURE__ */ a("tr", { children: [
|
|
979
984
|
/* @__PURE__ */ t("th", { children: n("ACTION") }),
|
|
980
985
|
/* @__PURE__ */ t("th", { children: n("SHORTCUT") })
|
|
981
986
|
] }) }),
|
|
982
|
-
/* @__PURE__ */
|
|
983
|
-
/* @__PURE__ */
|
|
987
|
+
/* @__PURE__ */ a("tbody", { children: [
|
|
988
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
984
989
|
/* @__PURE__ */ t("td", { children: n("SEEK_BACKWARD", { seconds: 5 }) }),
|
|
985
990
|
/* @__PURE__ */ t("td", { children: n("LEFT_ARROW") })
|
|
986
991
|
] }),
|
|
987
|
-
/* @__PURE__ */
|
|
992
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
988
993
|
/* @__PURE__ */ t("td", { children: n("SEEK_FORWARD", { seconds: 5 }) }),
|
|
989
994
|
/* @__PURE__ */ t("td", { children: n("RIGHT_ARROW") })
|
|
990
995
|
] }),
|
|
991
|
-
/* @__PURE__ */
|
|
996
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
992
997
|
/* @__PURE__ */ t("td", { children: n("SEEK_BACKWARD", { seconds: 10 }) }),
|
|
993
998
|
/* @__PURE__ */ t("td", { children: "J" })
|
|
994
999
|
] }),
|
|
995
|
-
/* @__PURE__ */
|
|
1000
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
996
1001
|
/* @__PURE__ */ t("td", { children: n("SEEK_FORWARD", { seconds: 10 }) }),
|
|
997
1002
|
/* @__PURE__ */ t("td", { children: "L" })
|
|
998
1003
|
] }),
|
|
999
|
-
/* @__PURE__ */
|
|
1004
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1000
1005
|
/* @__PURE__ */ t("td", { children: n("INCREASE_VOLUME", { percent: 5 }) }),
|
|
1001
1006
|
/* @__PURE__ */ t("td", { children: n("UP_ARROW") })
|
|
1002
1007
|
] }),
|
|
1003
|
-
/* @__PURE__ */
|
|
1008
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1004
1009
|
/* @__PURE__ */ t("td", { children: n("DECREASE_VOLUME", { percent: 5 }) }),
|
|
1005
1010
|
/* @__PURE__ */ t("td", { children: n("DOWN_ARROW") })
|
|
1006
1011
|
] }),
|
|
1007
|
-
/* @__PURE__ */
|
|
1012
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1008
1013
|
/* @__PURE__ */ t("td", { children: n("TOGGLE_MUTED") }),
|
|
1009
1014
|
/* @__PURE__ */ t("td", { children: "M" })
|
|
1010
1015
|
] }),
|
|
1011
|
-
/* @__PURE__ */
|
|
1016
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1012
1017
|
/* @__PURE__ */ t("td", { children: n("TOGGLE_PLAY_PAUSE") }),
|
|
1013
|
-
/* @__PURE__ */
|
|
1018
|
+
/* @__PURE__ */ a("td", { children: [
|
|
1014
1019
|
n("SPACE"),
|
|
1015
1020
|
", K"
|
|
1016
1021
|
] })
|
|
1017
1022
|
] }),
|
|
1018
|
-
/* @__PURE__ */
|
|
1023
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1019
1024
|
/* @__PURE__ */ t("td", { children: n("ENTER_FULLSCREEN") }),
|
|
1020
1025
|
/* @__PURE__ */ t("td", { children: "F" })
|
|
1021
1026
|
] }),
|
|
1022
|
-
/* @__PURE__ */
|
|
1027
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1023
1028
|
/* @__PURE__ */ t("td", { children: n("EXIT_FULLSCREEN") }),
|
|
1024
1029
|
/* @__PURE__ */ t("td", { children: "Esc, F" })
|
|
1025
1030
|
] }),
|
|
1026
|
-
/* @__PURE__ */
|
|
1031
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1027
1032
|
/* @__PURE__ */ t("td", { children: n("TOGGLE_CAPTIONS") }),
|
|
1028
1033
|
/* @__PURE__ */ t("td", { children: "C" })
|
|
1029
1034
|
] }),
|
|
1030
|
-
/* @__PURE__ */
|
|
1035
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1031
1036
|
/* @__PURE__ */ t("td", { children: n("NEXT_CAPTION_LANGUAGE") }),
|
|
1032
1037
|
/* @__PURE__ */ t("td", { children: "V" })
|
|
1033
1038
|
] }),
|
|
1034
|
-
/* @__PURE__ */
|
|
1039
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1035
1040
|
/* @__PURE__ */ t("td", { children: n("PREVIOUS_CAPTION_LANGUAGE") }),
|
|
1036
1041
|
/* @__PURE__ */ t("td", { children: "X" })
|
|
1037
1042
|
] }),
|
|
1038
|
-
/* @__PURE__ */
|
|
1043
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1039
1044
|
/* @__PURE__ */ t("td", { children: n("DECREASE_PLAYBACK_SPEED") }),
|
|
1040
1045
|
/* @__PURE__ */ t("td", { children: "A" })
|
|
1041
1046
|
] }),
|
|
1042
|
-
/* @__PURE__ */
|
|
1047
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1043
1048
|
/* @__PURE__ */ t("td", { children: n("RESET_PLAYBACK_SPEED") }),
|
|
1044
1049
|
/* @__PURE__ */ t("td", { children: "S" })
|
|
1045
1050
|
] }),
|
|
1046
|
-
/* @__PURE__ */
|
|
1051
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1047
1052
|
/* @__PURE__ */ t("td", { children: n("INCREASE_PLAYBACK_SPEED") }),
|
|
1048
1053
|
/* @__PURE__ */ t("td", { children: "D" })
|
|
1049
1054
|
] }),
|
|
1050
|
-
/* @__PURE__ */
|
|
1055
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1051
1056
|
/* @__PURE__ */ t("td", { children: n("JUMP_TO_START") }),
|
|
1052
1057
|
/* @__PURE__ */ t("td", { children: "0" })
|
|
1053
1058
|
] }),
|
|
1054
|
-
/* @__PURE__ */
|
|
1059
|
+
/* @__PURE__ */ a("tr", { children: [
|
|
1055
1060
|
/* @__PURE__ */ t("td", { children: n("JUMP_TO_PERCENTAGE") }),
|
|
1056
1061
|
/* @__PURE__ */ t("td", { children: "1-9" })
|
|
1057
1062
|
] })
|
|
@@ -1061,157 +1066,162 @@ function co({ onClose: e }) {
|
|
|
1061
1066
|
}
|
|
1062
1067
|
);
|
|
1063
1068
|
}
|
|
1064
|
-
function
|
|
1065
|
-
const [e, n] = T(!1), [o, i] = T(!1), [
|
|
1069
|
+
function ao() {
|
|
1070
|
+
const [e, n] = T(!1), [o, i] = T(!1), [s, c] = T(!1), l = v(), u = _("playing"), m = G(), { t: h } = C(), g = p(() => {
|
|
1066
1071
|
n(!0), l.disableInteractions(), u && (c(!0), m.pause());
|
|
1067
1072
|
}, [u, m, l]), y = p(() => {
|
|
1068
|
-
n(!1), i(!0), l.enableInteractions(),
|
|
1069
|
-
}, [
|
|
1073
|
+
n(!1), i(!0), l.enableInteractions(), s && (c(!1), m.play());
|
|
1074
|
+
}, [s, m, l]), k = p(
|
|
1070
1075
|
(b) => o && (b == null ? void 0 : b.focus()),
|
|
1071
1076
|
[o]
|
|
1072
1077
|
);
|
|
1073
|
-
return e ? /* @__PURE__ */ t(
|
|
1078
|
+
return e ? /* @__PURE__ */ t(so, { onClose: y }) : /* @__PURE__ */ t(
|
|
1074
1079
|
"button",
|
|
1075
1080
|
{
|
|
1076
1081
|
ref: k,
|
|
1077
1082
|
"aria-label": h("KEYBOARD_SHORTCUTS"),
|
|
1078
1083
|
type: "button",
|
|
1079
|
-
className:
|
|
1084
|
+
className: W.keyboardShortcutsButton,
|
|
1080
1085
|
onClick: g,
|
|
1081
1086
|
tabIndex: l.state.interactionsDisabled ? -1 : 0,
|
|
1082
|
-
children: /* @__PURE__ */ t(
|
|
1087
|
+
children: /* @__PURE__ */ t(eo, {})
|
|
1083
1088
|
}
|
|
1084
1089
|
);
|
|
1085
1090
|
}
|
|
1086
|
-
const
|
|
1087
|
-
"play-pause-button": "_play-pause-
|
|
1088
|
-
playPauseButton:
|
|
1091
|
+
const co = "_play-pause-button_1834v_1", lo = {
|
|
1092
|
+
"play-pause-button": "_play-pause-button_1834v_1",
|
|
1093
|
+
playPauseButton: co
|
|
1089
1094
|
};
|
|
1090
|
-
function
|
|
1091
|
-
const e =
|
|
1095
|
+
function ro() {
|
|
1096
|
+
const e = A(), n = v(), o = _("paused"), { t: i } = C();
|
|
1092
1097
|
return e ? /* @__PURE__ */ t(
|
|
1093
|
-
|
|
1098
|
+
"button",
|
|
1094
1099
|
{
|
|
1100
|
+
role: "button",
|
|
1101
|
+
type: "button",
|
|
1102
|
+
className: `controls-button ${lo.playPauseButton}`,
|
|
1095
1103
|
"aria-label": i(o ? "PLAY" : "PAUSE"),
|
|
1096
1104
|
tabIndex: n.state.interactionsDisabled ? -1 : 0,
|
|
1097
|
-
|
|
1098
|
-
|
|
1099
|
-
|
|
1105
|
+
onClick: () => {
|
|
1106
|
+
e.paused ? e.remoteControl.play() : e.remoteControl.pause();
|
|
1107
|
+
},
|
|
1108
|
+
onKeyDown: (s) => {
|
|
1109
|
+
s.key === " " && (e == null || e.$state.lastKeyboardAction.set({
|
|
1100
1110
|
action: "togglePaused",
|
|
1101
|
-
event:
|
|
1111
|
+
event: s.nativeEvent
|
|
1102
1112
|
}));
|
|
1103
1113
|
},
|
|
1104
1114
|
children: o ? /* @__PURE__ */ t(ie, { className: "controls-button-icon" }) : /* @__PURE__ */ t(oe, { className: "controls-button-icon" })
|
|
1105
1115
|
}
|
|
1106
1116
|
) : null;
|
|
1107
1117
|
}
|
|
1108
|
-
const
|
|
1109
|
-
poster:
|
|
1118
|
+
const uo = "_poster_195hi_1", mo = {
|
|
1119
|
+
poster: uo
|
|
1110
1120
|
};
|
|
1111
|
-
function
|
|
1121
|
+
function ho({ src: e }) {
|
|
1112
1122
|
const n = _("source");
|
|
1113
|
-
return n.type === "video/youtube" || n.type === "video/vimeo" ? null : /* @__PURE__ */ t(
|
|
1123
|
+
return n.type === "video/youtube" || n.type === "video/vimeo" ? null : /* @__PURE__ */ t(Qe, { src: e, className: mo.poster });
|
|
1114
1124
|
}
|
|
1115
|
-
const
|
|
1125
|
+
const po = "_small-layout-overlay_1vli4_1", _o = "_small-layout-button_1vli4_14", fo = "_small-layout-icon-play_1vli4_24", Co = "_small-layout-icon-pause_1vli4_30", vo = "_full-screen-close-icon_1vli4_36", go = "_fade-out_1vli4_1", F = {
|
|
1116
1126
|
"small-layout-overlay": "_small-layout-overlay_1vli4_1",
|
|
1117
|
-
smallLayoutOverlay:
|
|
1127
|
+
smallLayoutOverlay: po,
|
|
1118
1128
|
"small-layout-button": "_small-layout-button_1vli4_14",
|
|
1119
|
-
smallLayoutButton:
|
|
1129
|
+
smallLayoutButton: _o,
|
|
1120
1130
|
"small-layout-icon-play": "_small-layout-icon-play_1vli4_24",
|
|
1121
|
-
smallLayoutIconPlay:
|
|
1131
|
+
smallLayoutIconPlay: fo,
|
|
1122
1132
|
"small-layout-icon-pause": "_small-layout-icon-pause_1vli4_30",
|
|
1123
|
-
smallLayoutIconPause:
|
|
1133
|
+
smallLayoutIconPause: Co,
|
|
1124
1134
|
"full-screen-close-icon": "_full-screen-close-icon_1vli4_36",
|
|
1125
|
-
fullScreenCloseIcon:
|
|
1135
|
+
fullScreenCloseIcon: vo,
|
|
1126
1136
|
"fade-out": "_fade-out_1vli4_1",
|
|
1127
|
-
fadeOut:
|
|
1137
|
+
fadeOut: go
|
|
1128
1138
|
};
|
|
1129
|
-
function
|
|
1130
|
-
return /* @__PURE__ */
|
|
1131
|
-
/* @__PURE__ */ t(
|
|
1132
|
-
/* @__PURE__ */
|
|
1133
|
-
/* @__PURE__ */ t(ie, { className:
|
|
1134
|
-
/* @__PURE__ */ t(oe, { className:
|
|
1139
|
+
function bo() {
|
|
1140
|
+
return /* @__PURE__ */ a("div", { className: F.smallLayoutOverlay, children: [
|
|
1141
|
+
/* @__PURE__ */ t(Ye, { className: F.fullScreenCloseIcon, children: /* @__PURE__ */ t(Ee, {}) }),
|
|
1142
|
+
/* @__PURE__ */ a("i", { className: F.smallLayoutButton, children: [
|
|
1143
|
+
/* @__PURE__ */ t(ie, { className: F.smallLayoutIconPlay }),
|
|
1144
|
+
/* @__PURE__ */ t(oe, { className: F.smallLayoutIconPause })
|
|
1135
1145
|
] })
|
|
1136
1146
|
] });
|
|
1137
1147
|
}
|
|
1138
|
-
const
|
|
1148
|
+
const wo = "_time-indicator_1rlpb_1", ko = {
|
|
1139
1149
|
"time-indicator": "_time-indicator_1rlpb_1",
|
|
1140
|
-
timeIndicator:
|
|
1150
|
+
timeIndicator: wo
|
|
1141
1151
|
};
|
|
1142
|
-
function
|
|
1143
|
-
return /* @__PURE__ */
|
|
1152
|
+
function yo() {
|
|
1153
|
+
return /* @__PURE__ */ a("div", { className: ko.timeIndicator, children: [
|
|
1144
1154
|
/* @__PURE__ */ t(re, { type: "current" }),
|
|
1145
1155
|
"/",
|
|
1146
1156
|
/* @__PURE__ */ t(re, { type: "duration" })
|
|
1147
1157
|
] });
|
|
1148
1158
|
}
|
|
1149
|
-
const
|
|
1159
|
+
const Lo = "_comment-markers_49pse_1", xo = "_comment-marker_49pse_1", Po = "_timeline-wrapper_49pse_21", No = "_track_49pse_35", To = "_thumb_49pse_48", Mo = "_root_49pse_62", Io = "_track-inner_49pse_92", So = "_progress_49pse_98", Ho = "_track-fill_49pse_104", Ro = "_pins_49pse_121", Vo = "_pin-button_49pse_134", Eo = "_annotation-pin_49pse_154", Bo = "_quiz-pin_49pse_159", Ao = "_annotation-pin-child_49pse_164", Oo = "_quiz-pin-child_49pse_168", Fo = "_interactive-pin-container_49pse_173", Zo = "_interactive-pin-wrapper_49pse_183", $o = "_interactive-pin-icon_49pse_189", Ko = "_interactive-pin_49pse_173", Do = "_bg_49pse_203", zo = "_symbol_49pse_207", Uo = "_interactive-pin-button_49pse_212", jo = "_interactive-pin-menu_49pse_232", qo = "_interactive-pin-menu-item_49pse_246", Wo = "_arrow_49pse_267", d = {
|
|
1150
1160
|
"comment-markers": "_comment-markers_49pse_1",
|
|
1151
|
-
commentMarkers:
|
|
1161
|
+
commentMarkers: Lo,
|
|
1152
1162
|
"comment-marker": "_comment-marker_49pse_1",
|
|
1153
|
-
commentMarker:
|
|
1163
|
+
commentMarker: xo,
|
|
1154
1164
|
"timeline-wrapper": "_timeline-wrapper_49pse_21",
|
|
1155
|
-
timelineWrapper:
|
|
1156
|
-
track:
|
|
1157
|
-
thumb:
|
|
1158
|
-
root:
|
|
1165
|
+
timelineWrapper: Po,
|
|
1166
|
+
track: No,
|
|
1167
|
+
thumb: To,
|
|
1168
|
+
root: Mo,
|
|
1159
1169
|
"track-inner": "_track-inner_49pse_92",
|
|
1160
|
-
trackInner:
|
|
1161
|
-
progress:
|
|
1170
|
+
trackInner: Io,
|
|
1171
|
+
progress: So,
|
|
1162
1172
|
"track-fill": "_track-fill_49pse_104",
|
|
1163
|
-
trackFill:
|
|
1164
|
-
pins:
|
|
1173
|
+
trackFill: Ho,
|
|
1174
|
+
pins: Ro,
|
|
1165
1175
|
"pin-button": "_pin-button_49pse_134",
|
|
1166
|
-
pinButton:
|
|
1176
|
+
pinButton: Vo,
|
|
1167
1177
|
"annotation-pin": "_annotation-pin_49pse_154",
|
|
1168
|
-
annotationPin:
|
|
1178
|
+
annotationPin: Eo,
|
|
1169
1179
|
"quiz-pin": "_quiz-pin_49pse_159",
|
|
1170
|
-
quizPin:
|
|
1180
|
+
quizPin: Bo,
|
|
1171
1181
|
"annotation-pin-child": "_annotation-pin-child_49pse_164",
|
|
1172
|
-
annotationPinChild:
|
|
1182
|
+
annotationPinChild: Ao,
|
|
1173
1183
|
"quiz-pin-child": "_quiz-pin-child_49pse_168",
|
|
1174
|
-
quizPinChild:
|
|
1184
|
+
quizPinChild: Oo,
|
|
1175
1185
|
"interactive-pin-container": "_interactive-pin-container_49pse_173",
|
|
1176
|
-
interactivePinContainer:
|
|
1186
|
+
interactivePinContainer: Fo,
|
|
1177
1187
|
"interactive-pin-wrapper": "_interactive-pin-wrapper_49pse_183",
|
|
1178
|
-
interactivePinWrapper:
|
|
1188
|
+
interactivePinWrapper: Zo,
|
|
1179
1189
|
"interactive-pin-icon": "_interactive-pin-icon_49pse_189",
|
|
1180
|
-
interactivePinIcon:
|
|
1190
|
+
interactivePinIcon: $o,
|
|
1181
1191
|
"interactive-pin": "_interactive-pin_49pse_173",
|
|
1182
|
-
interactivePin:
|
|
1183
|
-
bg:
|
|
1184
|
-
symbol:
|
|
1192
|
+
interactivePin: Ko,
|
|
1193
|
+
bg: Do,
|
|
1194
|
+
symbol: zo,
|
|
1185
1195
|
"interactive-pin-button": "_interactive-pin-button_49pse_212",
|
|
1186
|
-
interactivePinButton:
|
|
1196
|
+
interactivePinButton: Uo,
|
|
1187
1197
|
"interactive-pin-menu": "_interactive-pin-menu_49pse_232",
|
|
1188
|
-
interactivePinMenu:
|
|
1198
|
+
interactivePinMenu: jo,
|
|
1189
1199
|
"interactive-pin-menu-item": "_interactive-pin-menu-item_49pse_246",
|
|
1190
|
-
interactivePinMenuItem:
|
|
1191
|
-
arrow:
|
|
1192
|
-
},
|
|
1200
|
+
interactivePinMenuItem: qo,
|
|
1201
|
+
arrow: Wo
|
|
1202
|
+
}, Go = {
|
|
1193
1203
|
annotation: d.annotationPin,
|
|
1194
1204
|
quiz: d.quizPin
|
|
1195
1205
|
};
|
|
1196
|
-
function
|
|
1206
|
+
function Be({
|
|
1197
1207
|
type: e,
|
|
1198
1208
|
position: n,
|
|
1199
1209
|
children: o,
|
|
1200
1210
|
onClick: i
|
|
1201
1211
|
}) {
|
|
1202
|
-
const
|
|
1212
|
+
const s = v();
|
|
1203
1213
|
return /* @__PURE__ */ t(
|
|
1204
1214
|
"button",
|
|
1205
1215
|
{
|
|
1206
1216
|
type: "button",
|
|
1207
|
-
tabIndex:
|
|
1217
|
+
tabIndex: s.state.interactionsDisabled ? -1 : 0,
|
|
1208
1218
|
className: d.pinButton,
|
|
1209
1219
|
style: { left: `${n}%` },
|
|
1210
1220
|
onClick: i,
|
|
1211
|
-
children: /* @__PURE__ */
|
|
1221
|
+
children: /* @__PURE__ */ a(
|
|
1212
1222
|
"svg",
|
|
1213
1223
|
{
|
|
1214
|
-
className:
|
|
1224
|
+
className: Go[e],
|
|
1215
1225
|
width: "26",
|
|
1216
1226
|
height: "32",
|
|
1217
1227
|
viewBox: "0 0 26 32",
|
|
@@ -1225,8 +1235,8 @@ function Ae({
|
|
|
1225
1235
|
}
|
|
1226
1236
|
);
|
|
1227
1237
|
}
|
|
1228
|
-
function
|
|
1229
|
-
return /* @__PURE__ */ t(
|
|
1238
|
+
function Qo(e) {
|
|
1239
|
+
return /* @__PURE__ */ t(Be, { type: "annotation", ...e, children: /* @__PURE__ */ t(
|
|
1230
1240
|
"path",
|
|
1231
1241
|
{
|
|
1232
1242
|
className: d.annotationPinChild,
|
|
@@ -1238,8 +1248,8 @@ function Xo(e) {
|
|
|
1238
1248
|
}
|
|
1239
1249
|
) });
|
|
1240
1250
|
}
|
|
1241
|
-
function
|
|
1242
|
-
return /* @__PURE__ */ t(
|
|
1251
|
+
function Yo(e) {
|
|
1252
|
+
return /* @__PURE__ */ t(Be, { type: "quiz", ...e, children: e.multiple ? /* @__PURE__ */ t("circle", { className: d.quizPinChild, cx: "13", cy: "13", r: "6" }) : /* @__PURE__ */ t(
|
|
1243
1253
|
"text",
|
|
1244
1254
|
{
|
|
1245
1255
|
className: d.quizPinChild,
|
|
@@ -1252,7 +1262,7 @@ function Jo(e) {
|
|
|
1252
1262
|
}
|
|
1253
1263
|
) });
|
|
1254
1264
|
}
|
|
1255
|
-
function
|
|
1265
|
+
function Xo(e, n) {
|
|
1256
1266
|
return e.map((o, i) => ({
|
|
1257
1267
|
id: o.id,
|
|
1258
1268
|
time: o.time,
|
|
@@ -1261,7 +1271,7 @@ function ei(e, n) {
|
|
|
1261
1271
|
onClick: () => n(o)
|
|
1262
1272
|
}));
|
|
1263
1273
|
}
|
|
1264
|
-
function
|
|
1274
|
+
function Jo(e, n) {
|
|
1265
1275
|
const o = /* @__PURE__ */ new Map();
|
|
1266
1276
|
e.forEach((c) => {
|
|
1267
1277
|
var u;
|
|
@@ -1269,34 +1279,34 @@ function ti(e, n) {
|
|
|
1269
1279
|
o.has(l) || o.set(l, []), (u = o.get(l)) == null || u.push(c);
|
|
1270
1280
|
});
|
|
1271
1281
|
const i = [];
|
|
1272
|
-
let
|
|
1282
|
+
let s = 1;
|
|
1273
1283
|
return o.forEach((c, l) => {
|
|
1274
1284
|
i.push({
|
|
1275
1285
|
id: c.map((u) => u.id).join("-"),
|
|
1276
1286
|
time: l,
|
|
1277
1287
|
type: "quiz",
|
|
1278
|
-
ordinal:
|
|
1288
|
+
ordinal: s + 1,
|
|
1279
1289
|
onClick: () => n(c),
|
|
1280
1290
|
multiple: c.length > 1
|
|
1281
|
-
}),
|
|
1291
|
+
}), s++;
|
|
1282
1292
|
}), i;
|
|
1283
1293
|
}
|
|
1284
|
-
function
|
|
1294
|
+
function ei(e, n, o, i) {
|
|
1285
1295
|
switch (e.type) {
|
|
1286
1296
|
case "annotation": {
|
|
1287
|
-
const
|
|
1297
|
+
const s = () => i ? e.onClick() : o.seek(e.time);
|
|
1288
1298
|
return /* @__PURE__ */ t(
|
|
1289
|
-
|
|
1299
|
+
Qo,
|
|
1290
1300
|
{
|
|
1291
1301
|
position: e.time / n * 100,
|
|
1292
|
-
onClick:
|
|
1302
|
+
onClick: s
|
|
1293
1303
|
},
|
|
1294
1304
|
e.id
|
|
1295
1305
|
);
|
|
1296
1306
|
}
|
|
1297
1307
|
case "quiz":
|
|
1298
1308
|
return /* @__PURE__ */ t(
|
|
1299
|
-
|
|
1309
|
+
Yo,
|
|
1300
1310
|
{
|
|
1301
1311
|
position: e.time / n * 100,
|
|
1302
1312
|
ordinal: e.ordinal,
|
|
@@ -1309,22 +1319,22 @@ function ni(e, n, o, i) {
|
|
|
1309
1319
|
return null;
|
|
1310
1320
|
}
|
|
1311
1321
|
}
|
|
1312
|
-
function
|
|
1313
|
-
const e = G(), n = _("duration"), o = S(), i =
|
|
1314
|
-
...
|
|
1322
|
+
function ti() {
|
|
1323
|
+
const e = G(), n = _("duration"), o = S(), i = $(() => [
|
|
1324
|
+
...Xo(
|
|
1315
1325
|
o.annotations,
|
|
1316
1326
|
o.onAnnotationClick
|
|
1317
1327
|
),
|
|
1318
|
-
...
|
|
1319
|
-
].sort((c, l) => c.time - l.time).map((c) =>
|
|
1328
|
+
...Jo(o.quizMarkers, o.onQuizMarkerClick)
|
|
1329
|
+
].sort((c, l) => c.time - l.time).map((c) => ei(c, n, e, o.interactive)), [o.annotations, o.quizMarkers, n, e]);
|
|
1320
1330
|
return /* @__PURE__ */ t("div", { className: d.pins, children: i });
|
|
1321
1331
|
}
|
|
1322
|
-
function
|
|
1323
|
-
const e = _("duration"), n = S(), o =
|
|
1332
|
+
function ni() {
|
|
1333
|
+
const e = _("duration"), n = S(), o = v();
|
|
1324
1334
|
return n.hasComments && o.state.commentsEnabled ? /* @__PURE__ */ t("div", { className: d.commentMarkers, children: n.comments.map((i) => {
|
|
1325
|
-
const
|
|
1335
|
+
const s = Math.min(
|
|
1326
1336
|
Math.abs(e - i.timestamp),
|
|
1327
|
-
|
|
1337
|
+
Ie
|
|
1328
1338
|
);
|
|
1329
1339
|
return /* @__PURE__ */ t(
|
|
1330
1340
|
"span",
|
|
@@ -1332,33 +1342,33 @@ function ii() {
|
|
|
1332
1342
|
className: d.commentMarker,
|
|
1333
1343
|
style: {
|
|
1334
1344
|
left: `${i.timestamp / e * 100}%`,
|
|
1335
|
-
width: `${
|
|
1345
|
+
width: `${s / e * 100}%`
|
|
1336
1346
|
}
|
|
1337
1347
|
},
|
|
1338
1348
|
i.id
|
|
1339
1349
|
);
|
|
1340
1350
|
}) }) : null;
|
|
1341
1351
|
}
|
|
1342
|
-
function
|
|
1343
|
-
const [o, i] = T(!1),
|
|
1344
|
-
|
|
1345
|
-
|
|
1352
|
+
function oi({ currentTime: e, position: n }) {
|
|
1353
|
+
const [o, i] = T(!1), s = S(), c = p(() => s.interactiveMenuElements.length > 0 ? i((b) => !b) : s.onInteractivePinClick(e), [
|
|
1354
|
+
s.interactiveMenuElements,
|
|
1355
|
+
s.onInteractivePinClick,
|
|
1346
1356
|
e
|
|
1347
|
-
]), l =
|
|
1357
|
+
]), l = Ce(null), { refs: u, floatingStyles: m, context: h } = ge({
|
|
1348
1358
|
open: o,
|
|
1349
1359
|
onOpenChange: i,
|
|
1350
|
-
whileElementsMounted:
|
|
1360
|
+
whileElementsMounted: be,
|
|
1351
1361
|
placement: "top",
|
|
1352
1362
|
middleware: [
|
|
1353
|
-
|
|
1354
|
-
|
|
1355
|
-
|
|
1356
|
-
|
|
1363
|
+
it(),
|
|
1364
|
+
st(6),
|
|
1365
|
+
we(),
|
|
1366
|
+
ke({
|
|
1357
1367
|
element: l
|
|
1358
1368
|
})
|
|
1359
1369
|
]
|
|
1360
|
-
}), g =
|
|
1361
|
-
return /* @__PURE__ */
|
|
1370
|
+
}), g = ye(h), { getReferenceProps: y, getFloatingProps: k } = Le([g]);
|
|
1371
|
+
return /* @__PURE__ */ a(ee, { children: [
|
|
1362
1372
|
/* @__PURE__ */ t(
|
|
1363
1373
|
"button",
|
|
1364
1374
|
{
|
|
@@ -1368,7 +1378,7 @@ function ai({ currentTime: e, position: n }) {
|
|
|
1368
1378
|
ref: u.setReference,
|
|
1369
1379
|
style: { left: `${n}%` },
|
|
1370
1380
|
...y(),
|
|
1371
|
-
children: /* @__PURE__ */
|
|
1381
|
+
children: /* @__PURE__ */ a(
|
|
1372
1382
|
"svg",
|
|
1373
1383
|
{
|
|
1374
1384
|
className: d.interactivePin,
|
|
@@ -1408,7 +1418,7 @@ function ai({ currentTime: e, position: n }) {
|
|
|
1408
1418
|
)
|
|
1409
1419
|
}
|
|
1410
1420
|
),
|
|
1411
|
-
o && /* @__PURE__ */
|
|
1421
|
+
o && /* @__PURE__ */ a(
|
|
1412
1422
|
"div",
|
|
1413
1423
|
{
|
|
1414
1424
|
ref: u.setFloating,
|
|
@@ -1416,7 +1426,7 @@ function ai({ currentTime: e, position: n }) {
|
|
|
1416
1426
|
className: d.interactivePinMenu,
|
|
1417
1427
|
...k(),
|
|
1418
1428
|
children: [
|
|
1419
|
-
|
|
1429
|
+
s.interactiveMenuElements.map(({ id: b, text: f, onClick: w }) => /* @__PURE__ */ a(
|
|
1420
1430
|
"button",
|
|
1421
1431
|
{
|
|
1422
1432
|
type: "button",
|
|
@@ -1450,7 +1460,7 @@ function ai({ currentTime: e, position: n }) {
|
|
|
1450
1460
|
b
|
|
1451
1461
|
)),
|
|
1452
1462
|
/* @__PURE__ */ t(
|
|
1453
|
-
|
|
1463
|
+
xe,
|
|
1454
1464
|
{
|
|
1455
1465
|
ref: l,
|
|
1456
1466
|
context: h,
|
|
@@ -1462,65 +1472,70 @@ function ai({ currentTime: e, position: n }) {
|
|
|
1462
1472
|
)
|
|
1463
1473
|
] });
|
|
1464
1474
|
}
|
|
1465
|
-
function
|
|
1475
|
+
function ii() {
|
|
1466
1476
|
const e = _("duration"), n = _("currentTime"), o = n / e * 100;
|
|
1467
|
-
return /* @__PURE__ */ t("div", { className: d.interactivePinContainer, children: /* @__PURE__ */ t("div", { className: d.interactivePinWrapper, children: /* @__PURE__ */ t(
|
|
1477
|
+
return /* @__PURE__ */ t("div", { className: d.interactivePinContainer, children: /* @__PURE__ */ t("div", { className: d.interactivePinWrapper, children: /* @__PURE__ */ t(oi, { currentTime: n, position: o }) }) });
|
|
1468
1478
|
}
|
|
1469
|
-
function
|
|
1470
|
-
const e = _("paused"), n =
|
|
1471
|
-
return e && !n.state.interactionsDisabled ? /* @__PURE__ */ t(
|
|
1479
|
+
function si() {
|
|
1480
|
+
const e = _("paused"), n = v();
|
|
1481
|
+
return e && !n.state.interactionsDisabled ? /* @__PURE__ */ t(ii, {}) : null;
|
|
1472
1482
|
}
|
|
1473
|
-
const
|
|
1483
|
+
const ai = `${d.progress} ${d.trackInner}`, ci = `${d.trackFill} ${d.trackInner}`;
|
|
1474
1484
|
function he({ className: e }) {
|
|
1475
|
-
const n =
|
|
1476
|
-
return /* @__PURE__ */
|
|
1477
|
-
|
|
1478
|
-
|
|
1479
|
-
/* @__PURE__ */
|
|
1480
|
-
|
|
1485
|
+
const n = v(), { hasAnnotations: o, hasQuizmarkers: i, interactive: s } = S(), c = e ? `${d.timelineWrapper} ${e}` : d.timelineWrapper;
|
|
1486
|
+
return /* @__PURE__ */ a("div", { className: c, children: [
|
|
1487
|
+
s ? /* @__PURE__ */ t(si, {}) : null,
|
|
1488
|
+
s || o || i ? /* @__PURE__ */ t(ti, {}) : null,
|
|
1489
|
+
/* @__PURE__ */ a(
|
|
1490
|
+
O.Root,
|
|
1481
1491
|
{
|
|
1482
1492
|
className: d.root,
|
|
1483
1493
|
tabIndex: n.state.interactionsDisabled ? -1 : 0,
|
|
1484
1494
|
children: [
|
|
1485
|
-
/* @__PURE__ */
|
|
1486
|
-
/* @__PURE__ */ t(
|
|
1487
|
-
/* @__PURE__ */ t(
|
|
1495
|
+
/* @__PURE__ */ a(O.Track, { className: d.track, children: [
|
|
1496
|
+
/* @__PURE__ */ t(O.Progress, { className: ai }),
|
|
1497
|
+
/* @__PURE__ */ t(O.TrackFill, { className: ci })
|
|
1488
1498
|
] }),
|
|
1489
|
-
/* @__PURE__ */ t(
|
|
1499
|
+
/* @__PURE__ */ t(O.Thumb, { className: d.thumb })
|
|
1490
1500
|
]
|
|
1491
1501
|
}
|
|
1492
1502
|
),
|
|
1493
|
-
/* @__PURE__ */ t(
|
|
1503
|
+
/* @__PURE__ */ t(ni, {})
|
|
1494
1504
|
] });
|
|
1495
1505
|
}
|
|
1496
|
-
const
|
|
1497
|
-
wrapper:
|
|
1498
|
-
track:
|
|
1499
|
-
thumb:
|
|
1506
|
+
const li = "_wrapper_12cb0_1", ri = "_track_12cb0_6", ui = "_thumb_12cb0_18", di = "_track-fill_12cb0_32", mi = "_root_12cb0_51", Z = {
|
|
1507
|
+
wrapper: li,
|
|
1508
|
+
track: ri,
|
|
1509
|
+
thumb: ui,
|
|
1500
1510
|
"track-fill": "_track-fill_12cb0_32",
|
|
1501
|
-
trackFill:
|
|
1502
|
-
root:
|
|
1511
|
+
trackFill: di,
|
|
1512
|
+
root: mi
|
|
1503
1513
|
};
|
|
1504
|
-
function
|
|
1505
|
-
const e = _("volume"),
|
|
1506
|
-
return /* @__PURE__ */
|
|
1514
|
+
function hi() {
|
|
1515
|
+
const e = A(), n = _("volume"), o = _("muted"), i = v(), s = o || n === 0, { t: c } = C();
|
|
1516
|
+
return /* @__PURE__ */ a("div", { className: Z.wrapper, children: [
|
|
1507
1517
|
/* @__PURE__ */ t(
|
|
1508
|
-
|
|
1518
|
+
"button",
|
|
1509
1519
|
{
|
|
1510
|
-
|
|
1520
|
+
role: "button",
|
|
1521
|
+
type: "button",
|
|
1522
|
+
tabIndex: i.state.interactionsDisabled ? -1 : 0,
|
|
1511
1523
|
className: "controls-button",
|
|
1512
|
-
"aria-label":
|
|
1513
|
-
|
|
1524
|
+
"aria-label": c(s ? "VOLUME" : "MUTE"),
|
|
1525
|
+
onClick: () => {
|
|
1526
|
+
s ? e == null || e.remoteControl.unmute() : e == null || e.remoteControl.mute();
|
|
1527
|
+
},
|
|
1528
|
+
children: s ? /* @__PURE__ */ t(He, { className: "controls-button-icon" }) : n < 0.5 ? /* @__PURE__ */ t(Re, { className: "controls-button-icon" }) : /* @__PURE__ */ t(Ve, { className: "controls-button-icon" })
|
|
1514
1529
|
}
|
|
1515
1530
|
),
|
|
1516
|
-
/* @__PURE__ */
|
|
1517
|
-
|
|
1531
|
+
/* @__PURE__ */ a(
|
|
1532
|
+
U.Root,
|
|
1518
1533
|
{
|
|
1519
|
-
className:
|
|
1520
|
-
tabIndex:
|
|
1534
|
+
className: Z.root,
|
|
1535
|
+
tabIndex: i.state.interactionsDisabled ? -1 : 0,
|
|
1521
1536
|
children: [
|
|
1522
|
-
/* @__PURE__ */ t(
|
|
1523
|
-
/* @__PURE__ */ t(
|
|
1537
|
+
/* @__PURE__ */ t(U.Track, { className: Z.track, children: /* @__PURE__ */ t(U.TrackFill, { className: Z.trackFill }) }),
|
|
1538
|
+
/* @__PURE__ */ t(U.Thumb, { className: Z.thumb })
|
|
1524
1539
|
]
|
|
1525
1540
|
}
|
|
1526
1541
|
)
|
|
@@ -1538,9 +1553,9 @@ const pe = {
|
|
|
1538
1553
|
nextCaptionLanguage: {
|
|
1539
1554
|
keys: ["v"],
|
|
1540
1555
|
onKeyUp({ event: e, player: n, remote: o }) {
|
|
1541
|
-
const i = n.textTracks.selectedIndex,
|
|
1556
|
+
const i = n.textTracks.selectedIndex, s = i + 1;
|
|
1542
1557
|
o.changeTextTrackMode(i, "hidden"), o.changeTextTrackMode(
|
|
1543
|
-
|
|
1558
|
+
s >= n.textTracks.length ? 0 : s,
|
|
1544
1559
|
"showing"
|
|
1545
1560
|
), n.$state.lastKeyboardAction.set({
|
|
1546
1561
|
action: "nextCaptionLanguage",
|
|
@@ -1551,9 +1566,9 @@ const pe = {
|
|
|
1551
1566
|
previousCaptionLanguage: {
|
|
1552
1567
|
keys: ["x"],
|
|
1553
1568
|
onKeyUp({ event: e, player: n, remote: o }) {
|
|
1554
|
-
const i = n.textTracks.selectedIndex,
|
|
1569
|
+
const i = n.textTracks.selectedIndex, s = i - 1;
|
|
1555
1570
|
o.changeTextTrackMode(i, "hidden"), o.changeTextTrackMode(
|
|
1556
|
-
|
|
1571
|
+
s < 0 ? n.textTracks.length - 1 : s,
|
|
1557
1572
|
"showing"
|
|
1558
1573
|
), n.$state.lastKeyboardAction.set({
|
|
1559
1574
|
action: "previousCaptionLanguage",
|
|
@@ -1564,8 +1579,8 @@ const pe = {
|
|
|
1564
1579
|
decreasePlaybackRate: {
|
|
1565
1580
|
keys: ["a"],
|
|
1566
1581
|
onKeyUp({ event: e, player: n, remote: o }) {
|
|
1567
|
-
const
|
|
1568
|
-
|
|
1582
|
+
const s = V.indexOf(n.playbackRate) - 1;
|
|
1583
|
+
s >= 0 && (o.changePlaybackRate(V[s]), n.$state.lastKeyboardAction.set({
|
|
1569
1584
|
action: "decreasePlaybackRate",
|
|
1570
1585
|
event: e
|
|
1571
1586
|
}));
|
|
@@ -1574,8 +1589,8 @@ const pe = {
|
|
|
1574
1589
|
increasePlaybackRate: {
|
|
1575
1590
|
keys: ["d"],
|
|
1576
1591
|
onKeyUp({ event: e, player: n, remote: o }) {
|
|
1577
|
-
const
|
|
1578
|
-
|
|
1592
|
+
const s = V.indexOf(n.playbackRate) + 1;
|
|
1593
|
+
s < V.length && (o.changePlaybackRate(V[s]), n.$state.lastKeyboardAction.set({
|
|
1579
1594
|
action: "increasePlaybackRate",
|
|
1580
1595
|
event: e
|
|
1581
1596
|
}));
|
|
@@ -1612,7 +1627,7 @@ const pe = {
|
|
|
1612
1627
|
function _e(e) {
|
|
1613
1628
|
return typeof e == "number" && !isNaN(e);
|
|
1614
1629
|
}
|
|
1615
|
-
function
|
|
1630
|
+
function pi(e, n = 1e3) {
|
|
1616
1631
|
let o = !1;
|
|
1617
1632
|
return () => {
|
|
1618
1633
|
o || (e(), o = !0, setTimeout(() => {
|
|
@@ -1631,7 +1646,7 @@ const fe = {
|
|
|
1631
1646
|
invert: !1,
|
|
1632
1647
|
comments: !1
|
|
1633
1648
|
};
|
|
1634
|
-
class
|
|
1649
|
+
class _i {
|
|
1635
1650
|
constructor() {
|
|
1636
1651
|
N(this, "playerId", "studio-player");
|
|
1637
1652
|
N(this, "mediaId", null);
|
|
@@ -1643,7 +1658,7 @@ class vi {
|
|
|
1643
1658
|
const n = (this.time ?? 0).toString();
|
|
1644
1659
|
localStorage.setItem(this.mediaId, n);
|
|
1645
1660
|
});
|
|
1646
|
-
N(this, "saveTimeThrottled",
|
|
1661
|
+
N(this, "saveTimeThrottled", pi(this.saveTime, 1e3));
|
|
1647
1662
|
// only used for useStudioPlayer hook's state initialization
|
|
1648
1663
|
N(this, "initializeState", (n) => {
|
|
1649
1664
|
const o = localStorage.getItem(this.playerId);
|
|
@@ -1712,12 +1727,12 @@ class vi {
|
|
|
1712
1727
|
this.data.rate = n, this.save();
|
|
1713
1728
|
}
|
|
1714
1729
|
onChange(n, o, i = "studio-player") {
|
|
1715
|
-
const
|
|
1730
|
+
const s = i ? localStorage.getItem(i) : null, c = o ? localStorage.getItem(o) : null;
|
|
1716
1731
|
this.playerId = i, this.mediaId = o;
|
|
1717
1732
|
let l = {};
|
|
1718
|
-
if (
|
|
1733
|
+
if (s)
|
|
1719
1734
|
try {
|
|
1720
|
-
l = JSON.parse(
|
|
1735
|
+
l = JSON.parse(s);
|
|
1721
1736
|
} catch {
|
|
1722
1737
|
}
|
|
1723
1738
|
this.data = {
|
|
@@ -1731,42 +1746,42 @@ class vi {
|
|
|
1731
1746
|
localStorage.setItem(this.playerId, n);
|
|
1732
1747
|
}
|
|
1733
1748
|
}
|
|
1734
|
-
function
|
|
1735
|
-
const
|
|
1736
|
-
|
|
1749
|
+
function fi(e, n, o, i) {
|
|
1750
|
+
const s = $(() => new _i(), []), [c, l] = T(
|
|
1751
|
+
s.initializeState(i)
|
|
1737
1752
|
), u = p(
|
|
1738
1753
|
(f) => {
|
|
1739
|
-
l((w) => (
|
|
1754
|
+
l((w) => (s.saveData("multiplier", f), {
|
|
1740
1755
|
...w,
|
|
1741
1756
|
captionsFontSizeMultiplier: f
|
|
1742
1757
|
}));
|
|
1743
1758
|
},
|
|
1744
|
-
[
|
|
1759
|
+
[s]
|
|
1745
1760
|
), m = p(() => {
|
|
1746
1761
|
l((f) => {
|
|
1747
1762
|
const w = !f.captionPositionOnTop;
|
|
1748
|
-
return
|
|
1763
|
+
return s.saveData("ontop", w), {
|
|
1749
1764
|
...f,
|
|
1750
1765
|
captionPositionOnTop: w
|
|
1751
1766
|
};
|
|
1752
1767
|
});
|
|
1753
|
-
}, [
|
|
1768
|
+
}, [s]), h = p(() => {
|
|
1754
1769
|
l((f) => {
|
|
1755
1770
|
const w = !f.captionsInvertColors;
|
|
1756
|
-
return
|
|
1771
|
+
return s.saveData("invert", w), {
|
|
1757
1772
|
...f,
|
|
1758
1773
|
captionsInvertColors: w
|
|
1759
1774
|
};
|
|
1760
1775
|
});
|
|
1761
|
-
}, [
|
|
1776
|
+
}, [s]), g = p(() => {
|
|
1762
1777
|
l((f) => {
|
|
1763
1778
|
const w = !f.commentsEnabled;
|
|
1764
|
-
return
|
|
1779
|
+
return s.saveData("comments", w), {
|
|
1765
1780
|
...f,
|
|
1766
1781
|
commentsEnabled: w
|
|
1767
1782
|
};
|
|
1768
1783
|
});
|
|
1769
|
-
}, [
|
|
1784
|
+
}, [s]), y = p(() => {
|
|
1770
1785
|
l((f) => ({
|
|
1771
1786
|
...f,
|
|
1772
1787
|
interactionsDisabled: !1
|
|
@@ -1776,7 +1791,7 @@ function Ci(e, n, o, i) {
|
|
|
1776
1791
|
...f,
|
|
1777
1792
|
interactionsDisabled: !0
|
|
1778
1793
|
}));
|
|
1779
|
-
}, []), b =
|
|
1794
|
+
}, []), b = $(() => e ? {
|
|
1780
1795
|
...pe,
|
|
1781
1796
|
toggleFullscreen: []
|
|
1782
1797
|
} : pe, [e]);
|
|
@@ -1795,17 +1810,17 @@ function Ci(e, n, o, i) {
|
|
|
1795
1810
|
disableCaptionSettings: o
|
|
1796
1811
|
},
|
|
1797
1812
|
shortcuts: b,
|
|
1798
|
-
storage:
|
|
1813
|
+
storage: s
|
|
1799
1814
|
};
|
|
1800
1815
|
}
|
|
1801
|
-
const
|
|
1816
|
+
const Ci = {}, J = () => {
|
|
1802
1817
|
};
|
|
1803
|
-
function
|
|
1818
|
+
function Pi({
|
|
1804
1819
|
title: e,
|
|
1805
1820
|
playerRef: n,
|
|
1806
1821
|
src: o,
|
|
1807
1822
|
captions: i = [],
|
|
1808
|
-
thumbnail:
|
|
1823
|
+
thumbnail: s,
|
|
1809
1824
|
hideFullScreen: c = !1,
|
|
1810
1825
|
comments: l = [],
|
|
1811
1826
|
locale: u = "en",
|
|
@@ -1818,21 +1833,21 @@ function Ti({
|
|
|
1818
1833
|
interactiveMenuElements: f = [],
|
|
1819
1834
|
darkMode: w = !1,
|
|
1820
1835
|
autoLoadCaptionSrc: M = "",
|
|
1821
|
-
forceComments:
|
|
1836
|
+
forceComments: se,
|
|
1822
1837
|
disableCaptionSettings: Y,
|
|
1823
|
-
startAt:
|
|
1824
|
-
crossOrigin:
|
|
1838
|
+
startAt: Ae,
|
|
1839
|
+
crossOrigin: Oe
|
|
1825
1840
|
}) {
|
|
1826
|
-
const { contextValue:
|
|
1841
|
+
const { contextValue: ae, shortcuts: Fe, storage: Ze } = fi(
|
|
1827
1842
|
c,
|
|
1828
|
-
|
|
1843
|
+
se ?? !1,
|
|
1829
1844
|
Y ?? !1,
|
|
1830
|
-
|
|
1831
|
-
), { i18n: ce } =
|
|
1832
|
-
return
|
|
1845
|
+
Ae
|
|
1846
|
+
), { i18n: ce } = C();
|
|
1847
|
+
return B(() => {
|
|
1833
1848
|
ce.changeLanguage(u);
|
|
1834
1849
|
}, [ce, u]), /* @__PURE__ */ t(
|
|
1835
|
-
|
|
1850
|
+
lt,
|
|
1836
1851
|
{
|
|
1837
1852
|
hideFullScreen: c,
|
|
1838
1853
|
comments: l,
|
|
@@ -1844,44 +1859,44 @@ function Ti({
|
|
|
1844
1859
|
onInteractivePinClick: b,
|
|
1845
1860
|
interactiveMenuElements: f,
|
|
1846
1861
|
darkMode: w,
|
|
1847
|
-
forceComments:
|
|
1862
|
+
forceComments: se ?? !1,
|
|
1848
1863
|
disableCaptionSettings: Y ?? !1,
|
|
1849
|
-
children: /* @__PURE__ */ t(
|
|
1850
|
-
|
|
1864
|
+
children: /* @__PURE__ */ t(ct, { contextValue: ae, children: /* @__PURE__ */ a(
|
|
1865
|
+
Xe,
|
|
1851
1866
|
{
|
|
1852
|
-
crossOrigin:
|
|
1853
|
-
storage:
|
|
1867
|
+
crossOrigin: Oe,
|
|
1868
|
+
storage: Ze,
|
|
1854
1869
|
title: e,
|
|
1855
1870
|
src: o,
|
|
1856
|
-
keyShortcuts:
|
|
1871
|
+
keyShortcuts: Fe,
|
|
1857
1872
|
playsInline: !0,
|
|
1858
|
-
keyDisabled:
|
|
1859
|
-
onTextTracksChange: (
|
|
1860
|
-
const le =
|
|
1861
|
-
(
|
|
1873
|
+
keyDisabled: ae.state.interactionsDisabled,
|
|
1874
|
+
onTextTracksChange: (z) => {
|
|
1875
|
+
const le = z == null ? void 0 : z.findIndex(
|
|
1876
|
+
($e) => $e.src === M
|
|
1862
1877
|
);
|
|
1863
|
-
le > -1 && (
|
|
1878
|
+
le > -1 && (z[le].mode = "showing");
|
|
1864
1879
|
},
|
|
1865
1880
|
children: [
|
|
1866
|
-
/* @__PURE__ */ t(
|
|
1867
|
-
/* @__PURE__ */
|
|
1868
|
-
/* @__PURE__ */ t(
|
|
1869
|
-
/* @__PURE__ */ t(
|
|
1870
|
-
/* @__PURE__ */ t(
|
|
1871
|
-
/* @__PURE__ */ t(
|
|
1872
|
-
/* @__PURE__ */ t(
|
|
1873
|
-
/* @__PURE__ */ t(
|
|
1874
|
-
/* @__PURE__ */ t(
|
|
1881
|
+
/* @__PURE__ */ t(ao, {}),
|
|
1882
|
+
/* @__PURE__ */ a(Je, { className: Ci.mediaProvider, children: [
|
|
1883
|
+
/* @__PURE__ */ t(ho, { src: s }),
|
|
1884
|
+
/* @__PURE__ */ t(Un, {}),
|
|
1885
|
+
/* @__PURE__ */ t(vt, {}),
|
|
1886
|
+
/* @__PURE__ */ t(kt, { captions: i }),
|
|
1887
|
+
/* @__PURE__ */ t(Jn, {}),
|
|
1888
|
+
/* @__PURE__ */ t(Et, { comments: l }),
|
|
1889
|
+
/* @__PURE__ */ t(bo, {})
|
|
1875
1890
|
] }),
|
|
1876
1891
|
/* @__PURE__ */ t(
|
|
1877
|
-
|
|
1892
|
+
Kt,
|
|
1878
1893
|
{
|
|
1879
1894
|
darkMode: w,
|
|
1880
1895
|
playerRef: n,
|
|
1881
1896
|
showCaptionsButton: !Y
|
|
1882
1897
|
}
|
|
1883
1898
|
),
|
|
1884
|
-
/* @__PURE__ */ t(
|
|
1899
|
+
/* @__PURE__ */ t(mt, { annotations: m })
|
|
1885
1900
|
]
|
|
1886
1901
|
}
|
|
1887
1902
|
) })
|
|
@@ -1889,8 +1904,8 @@ function Ti({
|
|
|
1889
1904
|
);
|
|
1890
1905
|
}
|
|
1891
1906
|
export {
|
|
1892
|
-
|
|
1893
|
-
|
|
1907
|
+
yt as CAPTION_FONT_SIZE_MULTIPLIERS,
|
|
1908
|
+
Ie as COMMENT_DURATION,
|
|
1894
1909
|
V as PLAYBACK_RATES,
|
|
1895
|
-
|
|
1910
|
+
Pi as StudioPlayer
|
|
1896
1911
|
};
|