strataplayer 1.2.21 → 1.2.22
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/strataplayer.cjs.js +12 -12
- package/dist/strataplayer.cjs.js.map +1 -1
- package/dist/strataplayer.es.js +550 -539
- package/dist/strataplayer.es.js.map +1 -1
- package/package.json +1 -1
package/dist/strataplayer.es.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
var Si = Object.defineProperty;
|
|
2
2
|
var Ci = (s, t, i) => t in s ? Si(s, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : s[t] = i;
|
|
3
|
-
var
|
|
3
|
+
var E = (s, t, i) => Ci(s, typeof t != "symbol" ? t + "" : t, i);
|
|
4
4
|
import Me, { useState as M, useEffect as ee, useRef as W, useLayoutEffect as Be, useMemo as Ce, useSyncExternalStore as Ni, useCallback as Ve } from "react";
|
|
5
5
|
import { createRoot as Mi } from "react-dom/client";
|
|
6
6
|
import { jsxs as c, jsx as e, Fragment as Q } from "react/jsx-runtime";
|
|
7
7
|
import { createPortal as Ti } from "react-dom";
|
|
8
8
|
class zi {
|
|
9
9
|
constructor() {
|
|
10
|
-
|
|
10
|
+
E(this, "events");
|
|
11
11
|
this.events = /* @__PURE__ */ new Map();
|
|
12
12
|
}
|
|
13
13
|
on(t, i) {
|
|
@@ -18,21 +18,21 @@ class zi {
|
|
|
18
18
|
const o = this.events.get(t);
|
|
19
19
|
o && this.events.set(
|
|
20
20
|
t,
|
|
21
|
-
o.filter((
|
|
21
|
+
o.filter((r) => r !== i)
|
|
22
22
|
);
|
|
23
23
|
}
|
|
24
24
|
emit(t, i) {
|
|
25
25
|
const o = this.events.get(t);
|
|
26
|
-
o && o.forEach((
|
|
26
|
+
o && o.forEach((r) => r(i));
|
|
27
27
|
}
|
|
28
28
|
destroy() {
|
|
29
29
|
this.events.clear();
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
|
-
class
|
|
32
|
+
class Fi {
|
|
33
33
|
constructor(t) {
|
|
34
|
-
|
|
35
|
-
|
|
34
|
+
E(this, "state");
|
|
35
|
+
E(this, "listeners");
|
|
36
36
|
this.state = t, this.listeners = /* @__PURE__ */ new Set();
|
|
37
37
|
}
|
|
38
38
|
get() {
|
|
@@ -40,7 +40,7 @@ class Ii {
|
|
|
40
40
|
}
|
|
41
41
|
setState(t) {
|
|
42
42
|
const i = this.state, o = typeof t == "function" ? t(i) : t;
|
|
43
|
-
this.state = { ...i, ...o }, this.listeners.forEach((
|
|
43
|
+
this.state = { ...i, ...o }, this.listeners.forEach((r) => r(this.state, i));
|
|
44
44
|
}
|
|
45
45
|
subscribe(t) {
|
|
46
46
|
return this.listeners.add(t), () => this.listeners.delete(t);
|
|
@@ -49,13 +49,13 @@ class Ii {
|
|
|
49
49
|
this.listeners.clear();
|
|
50
50
|
}
|
|
51
51
|
}
|
|
52
|
-
class
|
|
52
|
+
class Ii {
|
|
53
53
|
constructor(t) {
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
54
|
+
E(this, "context", null);
|
|
55
|
+
E(this, "source", null);
|
|
56
|
+
E(this, "gainNode", null);
|
|
57
|
+
E(this, "video");
|
|
58
|
+
E(this, "isInitialized", !1);
|
|
59
59
|
this.video = t;
|
|
60
60
|
}
|
|
61
61
|
/**
|
|
@@ -82,11 +82,11 @@ const it = (s) => {
|
|
|
82
82
|
if (isNaN(s)) return "00:00";
|
|
83
83
|
const t = Math.floor(s / 3600), i = Math.floor(s % 3600 / 60), o = Math.floor(s % 60);
|
|
84
84
|
return t > 0 ? `${t}:${i.toString().padStart(2, "0")}:${o.toString().padStart(2, "0")}` : `${i}:${o.toString().padStart(2, "0")}`;
|
|
85
|
-
},
|
|
85
|
+
}, Ri = async (s, t = 3, i = 2e4) => {
|
|
86
86
|
for (let o = 0; o < t; o++) {
|
|
87
|
-
const
|
|
87
|
+
const r = new AbortController(), u = setTimeout(() => r.abort(), i);
|
|
88
88
|
try {
|
|
89
|
-
const h = await fetch(s, { signal:
|
|
89
|
+
const h = await fetch(s, { signal: r.signal });
|
|
90
90
|
if (clearTimeout(u), !h.ok) throw new Error(`HTTP ${h.status}`);
|
|
91
91
|
return await h.text();
|
|
92
92
|
} catch (h) {
|
|
@@ -95,35 +95,35 @@ const it = (s) => {
|
|
|
95
95
|
}
|
|
96
96
|
}
|
|
97
97
|
throw new Error("Failed");
|
|
98
|
-
},
|
|
98
|
+
}, Pi = async (s, t, i = 2e4) => {
|
|
99
99
|
try {
|
|
100
|
-
const
|
|
100
|
+
const r = (await Ri(s, 3, i)).split(`
|
|
101
101
|
`), u = [];
|
|
102
102
|
let h = null, f = null;
|
|
103
|
-
const
|
|
104
|
-
const
|
|
103
|
+
const v = s.substring(0, s.lastIndexOf("/") + 1), b = (m) => {
|
|
104
|
+
const x = m.split(":");
|
|
105
105
|
let p = 0;
|
|
106
|
-
return
|
|
106
|
+
return x.length === 3 ? (p += parseFloat(x[0]) * 3600, p += parseFloat(x[1]) * 60, p += parseFloat(x[2])) : (p += parseFloat(x[0]) * 60, p += parseFloat(x[1])), p;
|
|
107
107
|
};
|
|
108
|
-
for (let m of
|
|
108
|
+
for (let m of r)
|
|
109
109
|
if (m = m.trim(), m.includes("-->")) {
|
|
110
|
-
const
|
|
111
|
-
h = b(
|
|
110
|
+
const x = m.split("-->");
|
|
111
|
+
h = b(x[0].trim()), f = b(x[1].trim());
|
|
112
112
|
} else if (h !== null && f !== null && m.length > 0) {
|
|
113
|
-
let [
|
|
114
|
-
!
|
|
115
|
-
let S = 0,
|
|
113
|
+
let [x, p] = m.split("#");
|
|
114
|
+
!x.match(/^https?:\/\//) && !x.startsWith("data:") && (x = v + x);
|
|
115
|
+
let S = 0, L = 0, U = 0, H = 0;
|
|
116
116
|
if (p && p.startsWith("xywh=")) {
|
|
117
|
-
const
|
|
118
|
-
|
|
117
|
+
const _ = p.replace("xywh=", "").split(",");
|
|
118
|
+
_.length === 4 && (S = parseInt(_[0]), L = parseInt(_[1]), U = parseInt(_[2]), H = parseInt(_[3]));
|
|
119
119
|
}
|
|
120
|
-
U > 0 && H > 0 && u.push({ start: h, end: f, url:
|
|
120
|
+
U > 0 && H > 0 && u.push({ start: h, end: f, url: x, x: S, y: L, w: U, h: H }), h = null, f = null;
|
|
121
121
|
}
|
|
122
122
|
return u;
|
|
123
123
|
} catch {
|
|
124
124
|
return t({ type: "warning", message: "Failed to load thumbnails", duration: 4e3 }), [];
|
|
125
125
|
}
|
|
126
|
-
},
|
|
126
|
+
}, Ei = () => {
|
|
127
127
|
if (!(typeof document > "u")) {
|
|
128
128
|
if (!document.getElementById("strata-fonts")) {
|
|
129
129
|
const s = document.createElement("link");
|
|
@@ -138,7 +138,7 @@ const it = (s) => {
|
|
|
138
138
|
s.src = "https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1", document.head.appendChild(s);
|
|
139
139
|
}
|
|
140
140
|
}
|
|
141
|
-
},
|
|
141
|
+
}, at = {
|
|
142
142
|
useNative: !1,
|
|
143
143
|
fixCapitalization: !1,
|
|
144
144
|
backgroundOpacity: 50,
|
|
@@ -171,7 +171,7 @@ const it = (s) => {
|
|
|
171
171
|
subtitleTracks: [],
|
|
172
172
|
currentSubtitle: -1,
|
|
173
173
|
subtitleOffset: 0,
|
|
174
|
-
subtitleSettings:
|
|
174
|
+
subtitleSettings: at,
|
|
175
175
|
activeCues: [],
|
|
176
176
|
viewMode: "normal",
|
|
177
177
|
notifications: [],
|
|
@@ -194,12 +194,12 @@ const it = (s) => {
|
|
|
194
194
|
let t = {};
|
|
195
195
|
if (!s.disablePersistence && typeof window < "u")
|
|
196
196
|
try {
|
|
197
|
-
const
|
|
198
|
-
|
|
197
|
+
const r = localStorage.getItem(Jt);
|
|
198
|
+
r && (t = JSON.parse(r));
|
|
199
199
|
} catch {
|
|
200
200
|
}
|
|
201
201
|
const i = {
|
|
202
|
-
...
|
|
202
|
+
...at,
|
|
203
203
|
...t.subtitleSettings || {},
|
|
204
204
|
...s.subtitleSettings || {}
|
|
205
205
|
}, o = s.videoFit ?? (s.autoSize ? "cover" : void 0) ?? t.videoFit ?? K.videoFit;
|
|
@@ -226,55 +226,55 @@ const it = (s) => {
|
|
|
226
226
|
// Never persist statuses
|
|
227
227
|
};
|
|
228
228
|
};
|
|
229
|
-
class
|
|
229
|
+
class Li {
|
|
230
230
|
constructor(t = {}, i) {
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
231
|
+
E(this, "video");
|
|
232
|
+
E(this, "container", null);
|
|
233
|
+
E(this, "events");
|
|
234
|
+
E(this, "store");
|
|
235
|
+
E(this, "plugins", /* @__PURE__ */ new Map());
|
|
236
|
+
E(this, "audioEngine");
|
|
237
|
+
E(this, "config");
|
|
238
|
+
E(this, "resizeObserver", null);
|
|
239
239
|
// Retry Logic
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
240
|
+
E(this, "retryCount", 0);
|
|
241
|
+
E(this, "maxRetries", 5);
|
|
242
|
+
E(this, "retryTimer", null);
|
|
243
|
+
E(this, "currentSource", null);
|
|
244
|
+
E(this, "currentSrc", "");
|
|
245
245
|
// Track configs from setSources are stored here to lazy load
|
|
246
|
-
|
|
246
|
+
E(this, "trackConfigs", []);
|
|
247
247
|
// Download Control
|
|
248
|
-
|
|
248
|
+
E(this, "activeDownloads", /* @__PURE__ */ new Map());
|
|
249
249
|
// Cast
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
250
|
+
E(this, "castInitialized", !1);
|
|
251
|
+
E(this, "boundCueChange");
|
|
252
|
+
E(this, "boundFullscreenChange");
|
|
253
|
+
Ei(), this.config = t, this.config.autoOrientation = this.config.autoOrientation ?? !0, this.config.fetchTimeout = this.config.fetchTimeout ?? 3e4, this.config.centerControls = this.config.centerControls ?? !0, this.config.gestureSeek = this.config.gestureSeek ?? !1, this.video = i || document.createElement("video"), this.video.crossOrigin = "anonymous", this.video.preload = "auto", t.playsInline !== !1 && (this.video.playsInline = !0), this.events = new zi();
|
|
254
254
|
const o = Kt(t);
|
|
255
|
-
this.store = new
|
|
256
|
-
const
|
|
257
|
-
if (this.store.setState({ isFullscreen:
|
|
258
|
-
const
|
|
255
|
+
this.store = new Fi(o), this.audioEngine = new Ii(this.video), this.boundCueChange = this.handleCueChange.bind(this), this.boundFullscreenChange = () => {
|
|
256
|
+
const r = document, u = !!(r.fullscreenElement || r.webkitFullscreenElement || r.mozFullScreenElement || r.msFullscreenElement);
|
|
257
|
+
if (this.store.setState({ isFullscreen: u }), this.emit("resize"), this.emit(u ? "fullscreen" : "fullscreen_exit"), u && this.config.autoOrientation && screen.orientation && "lock" in screen.orientation) {
|
|
258
|
+
const f = this.video.videoWidth > this.video.videoHeight ? "landscape" : "portrait";
|
|
259
259
|
try {
|
|
260
|
-
screen.orientation.lock(
|
|
260
|
+
screen.orientation.lock(f).catch(() => {
|
|
261
261
|
});
|
|
262
262
|
} catch {
|
|
263
263
|
}
|
|
264
|
-
} else !
|
|
265
|
-
}, this.video.volume = o.volume, this.video.muted = o.isMuted, this.video.playbackRate = o.playbackRate, this.video.loop = o.isLooping, this.video.style.filter = `brightness(${o.brightness})`, o.audioGain > 1 && this.audioEngine.setGain(o.audioGain), this.video.style.objectFit = o.videoFit, this.initVideoListeners(), this.initMediaSession(), this.initCast(), t.disablePersistence || this.store.subscribe((
|
|
264
|
+
} else !u && screen.orientation && "unlock" in screen.orientation && screen.orientation.unlock();
|
|
265
|
+
}, this.video.volume = o.volume, this.video.muted = o.isMuted, this.video.playbackRate = o.playbackRate, this.video.loop = o.isLooping, this.video.style.filter = `brightness(${o.brightness})`, o.audioGain > 1 && this.audioEngine.setGain(o.audioGain), this.video.style.objectFit = o.videoFit, this.initVideoListeners(), this.initMediaSession(), this.initCast(), t.disablePersistence || this.store.subscribe((r) => {
|
|
266
266
|
const u = {
|
|
267
|
-
volume:
|
|
268
|
-
isMuted:
|
|
269
|
-
playbackRate:
|
|
270
|
-
subtitleSettings:
|
|
271
|
-
iconSize:
|
|
272
|
-
themeColor:
|
|
273
|
-
theme:
|
|
274
|
-
isLive:
|
|
275
|
-
isLooping:
|
|
276
|
-
brightness:
|
|
277
|
-
videoFit:
|
|
267
|
+
volume: r.volume,
|
|
268
|
+
isMuted: r.isMuted,
|
|
269
|
+
playbackRate: r.playbackRate,
|
|
270
|
+
subtitleSettings: r.subtitleSettings,
|
|
271
|
+
iconSize: r.iconSize,
|
|
272
|
+
themeColor: r.themeColor,
|
|
273
|
+
theme: r.theme,
|
|
274
|
+
isLive: r.isLive,
|
|
275
|
+
isLooping: r.isLooping,
|
|
276
|
+
brightness: r.brightness,
|
|
277
|
+
videoFit: r.videoFit
|
|
278
278
|
};
|
|
279
279
|
localStorage.setItem(Jt, JSON.stringify(u));
|
|
280
280
|
});
|
|
@@ -337,7 +337,7 @@ class $i {
|
|
|
337
337
|
return this.events.emit(t, i);
|
|
338
338
|
}
|
|
339
339
|
initVideoListeners() {
|
|
340
|
-
const t = (
|
|
340
|
+
const t = (r) => this.store.setState(r);
|
|
341
341
|
[
|
|
342
342
|
"abort",
|
|
343
343
|
"canplay",
|
|
@@ -361,9 +361,9 @@ class $i {
|
|
|
361
361
|
"timeupdate",
|
|
362
362
|
"volumechange",
|
|
363
363
|
"waiting"
|
|
364
|
-
].forEach((
|
|
365
|
-
this.video.addEventListener(
|
|
366
|
-
switch (this.emit(`video:${
|
|
364
|
+
].forEach((r) => {
|
|
365
|
+
this.video.addEventListener(r, (u) => {
|
|
366
|
+
switch (this.emit(`video:${r}`, u), r === "play" && this.emit("play"), r === "pause" && this.emit("pause"), r === "ended" && this.emit("ended"), r === "error" && this.emit("error", this.video.error), r === "seeked" && this.emit("seek"), r) {
|
|
367
367
|
case "play":
|
|
368
368
|
t({ isPlaying: !0 }), "mediaSession" in navigator && (navigator.mediaSession.playbackState = "playing"), this.updateMediaSessionPosition();
|
|
369
369
|
break;
|
|
@@ -421,7 +421,7 @@ class $i {
|
|
|
421
421
|
t({ isPip: !0 }), this.emit("pip", !0);
|
|
422
422
|
}), this.video.addEventListener("leavepictureinpicture", () => {
|
|
423
423
|
t({ isPip: !1 }), this.emit("pip", !1);
|
|
424
|
-
}), document.addEventListener(
|
|
424
|
+
}), ["fullscreenchange", "webkitfullscreenchange", "mozfullscreenchange", "MSFullscreenChange"].forEach((r) => document.addEventListener(r, this.boundFullscreenChange));
|
|
425
425
|
}
|
|
426
426
|
updateSourceStatus(t) {
|
|
427
427
|
const i = this.store.get().currentSourceIndex;
|
|
@@ -446,9 +446,9 @@ class $i {
|
|
|
446
446
|
});
|
|
447
447
|
}
|
|
448
448
|
updateMediaSessionMetadata() {
|
|
449
|
-
var o,
|
|
449
|
+
var o, r;
|
|
450
450
|
if (!("mediaSession" in navigator)) return;
|
|
451
|
-
const t = ((o = this.currentSource) == null ? void 0 : o.name) || ((
|
|
451
|
+
const t = ((o = this.currentSource) == null ? void 0 : o.name) || ((r = this.currentSource) == null ? void 0 : r.url.split("/").pop()) || "Video", i = [];
|
|
452
452
|
this.config.poster && i.push({ src: this.config.poster, sizes: "512x512", type: "image/jpeg" }), i.push({ src: "logo.png", sizes: "512x512", type: "image/png" }), navigator.mediaSession.metadata = new MediaMetadata({
|
|
453
453
|
title: t,
|
|
454
454
|
artist: "StrataPlayer",
|
|
@@ -466,8 +466,8 @@ class $i {
|
|
|
466
466
|
position: Math.max(0, Math.min(i, t))
|
|
467
467
|
// Ensure within [0, duration]
|
|
468
468
|
});
|
|
469
|
-
} catch (
|
|
470
|
-
console.warn("MediaSession Position Error:",
|
|
469
|
+
} catch (r) {
|
|
470
|
+
console.warn("MediaSession Position Error:", r);
|
|
471
471
|
}
|
|
472
472
|
}
|
|
473
473
|
triggerError(t, i = !1) {
|
|
@@ -477,14 +477,14 @@ class $i {
|
|
|
477
477
|
const i = this.video.error, o = t || (i == null ? void 0 : i.message) || (i ? `Code ${i.code}` : "Unknown Error");
|
|
478
478
|
if (this.removeNotification("retry"), this.emit("video:error", i), this.retryCount < this.maxRetries) {
|
|
479
479
|
this.retryCount++;
|
|
480
|
-
const
|
|
480
|
+
const r = Math.pow(2, this.retryCount - 1) * 1500;
|
|
481
481
|
this.notify({
|
|
482
482
|
id: "retry",
|
|
483
483
|
type: "loading",
|
|
484
484
|
// Cleaned up formatting with newline
|
|
485
485
|
message: `Error: ${o}.
|
|
486
486
|
Retrying (${this.retryCount}/${this.maxRetries})`
|
|
487
|
-
}), console.warn(`[StrataPlayer] Error: ${o}. Retrying in ${
|
|
487
|
+
}), console.warn(`[StrataPlayer] Error: ${o}. Retrying in ${r}ms...`), this.retryTimer && clearTimeout(this.retryTimer), this.retryTimer = setTimeout(() => {
|
|
488
488
|
if (this.currentSource) {
|
|
489
489
|
this.load(this.currentSource, this.trackConfigs, !0);
|
|
490
490
|
const u = this.store.get().currentTime;
|
|
@@ -495,11 +495,11 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
495
495
|
this.video.addEventListener("canplay", h);
|
|
496
496
|
}
|
|
497
497
|
}
|
|
498
|
-
},
|
|
498
|
+
}, r);
|
|
499
499
|
} else {
|
|
500
500
|
this.removeNotification("retry");
|
|
501
|
-
const
|
|
502
|
-
this.store.setState({ error:
|
|
501
|
+
const r = `Failed to play after ${this.maxRetries} attempts: ${o}`;
|
|
502
|
+
this.store.setState({ error: r }), this.emit("error", r), this.updateSourceStatus("error");
|
|
503
503
|
}
|
|
504
504
|
}
|
|
505
505
|
updateBuffer() {
|
|
@@ -513,27 +513,27 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
513
513
|
}
|
|
514
514
|
updateSubtitleTrackState(t, i) {
|
|
515
515
|
this.store.setState((o) => {
|
|
516
|
-
const
|
|
517
|
-
return
|
|
516
|
+
const r = [...o.subtitleTracks];
|
|
517
|
+
return r[t] && (r[t] = { ...r[t], ...i }), { subtitleTracks: r };
|
|
518
518
|
});
|
|
519
519
|
}
|
|
520
520
|
// --- Utility ---
|
|
521
|
-
async fetchWithRetry(t, i = 3, o,
|
|
521
|
+
async fetchWithRetry(t, i = 3, o, r) {
|
|
522
522
|
const u = o ?? this.config.fetchTimeout ?? 3e4;
|
|
523
523
|
for (let h = 0; h < i; h++) {
|
|
524
|
-
const f =
|
|
524
|
+
const f = r ? null : new AbortController(), v = r || (f == null ? void 0 : f.signal), b = setTimeout(() => f == null ? void 0 : f.abort(), u);
|
|
525
525
|
try {
|
|
526
|
-
const m = await fetch(t, { signal:
|
|
526
|
+
const m = await fetch(t, { signal: v });
|
|
527
527
|
if (clearTimeout(b), !m.ok) throw new Error(`HTTP ${m.status}`);
|
|
528
528
|
return m;
|
|
529
529
|
} catch (m) {
|
|
530
|
-
if (clearTimeout(b),
|
|
530
|
+
if (clearTimeout(b), r != null && r.aborted) throw new Error("Aborted");
|
|
531
531
|
if (h === i - 1) throw m;
|
|
532
532
|
if (m.name === "AbortError") {
|
|
533
|
-
if (
|
|
533
|
+
if (r != null && r.aborted) throw m;
|
|
534
534
|
console.warn(`Fetch timeout (${u}ms) for ${t}`);
|
|
535
535
|
}
|
|
536
|
-
await new Promise((
|
|
536
|
+
await new Promise((x) => setTimeout(x, 1e3 * Math.pow(2, h)));
|
|
537
537
|
}
|
|
538
538
|
}
|
|
539
539
|
throw new Error("Fetch failed");
|
|
@@ -552,8 +552,8 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
552
552
|
// Enhanced Format Duration: Days, Hours, Minutes, Seconds
|
|
553
553
|
formatDuration(t) {
|
|
554
554
|
if (!isFinite(t) || t <= 0) return "";
|
|
555
|
-
const i = Math.floor(t / 1e3), o = Math.floor(i / (3600 * 24)),
|
|
556
|
-
return o > 0 && f.push(`${o}d`),
|
|
555
|
+
const i = Math.floor(t / 1e3), o = Math.floor(i / (3600 * 24)), r = Math.floor(i % (3600 * 24) / 3600), u = Math.floor(i % 3600 / 60), h = i % 60, f = [];
|
|
556
|
+
return o > 0 && f.push(`${o}d`), r > 0 && f.push(`${r}h`), u > 0 && f.push(`${u}m`), f.push(`${h}s`), f.join(" ");
|
|
557
557
|
}
|
|
558
558
|
// --- Core Methods ---
|
|
559
559
|
attach(t) {
|
|
@@ -571,23 +571,23 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
571
571
|
switchSource(t) {
|
|
572
572
|
const i = this.store.get().sources;
|
|
573
573
|
if (t >= 0 && t < i.length) {
|
|
574
|
-
const o = this.video.currentTime,
|
|
574
|
+
const o = this.video.currentTime, r = !this.video.paused;
|
|
575
575
|
this.load(i[t], this.trackConfigs);
|
|
576
576
|
const u = () => {
|
|
577
|
-
this.video.currentTime = o,
|
|
577
|
+
this.video.currentTime = o, r && this.video.play(), this.video.removeEventListener("canplay", u);
|
|
578
578
|
};
|
|
579
579
|
this.video.addEventListener("canplay", u);
|
|
580
580
|
}
|
|
581
581
|
}
|
|
582
582
|
load(t, i = [], o = !1) {
|
|
583
583
|
this.retryTimer && clearTimeout(this.retryTimer);
|
|
584
|
-
const
|
|
585
|
-
o || (this.retryCount = 0, this.store.setState({ error: null }), this.removeNotification("retry")), this.currentSrc =
|
|
586
|
-
const h = this.store.get().sources.findIndex((
|
|
587
|
-
...
|
|
584
|
+
const r = typeof t == "string" ? { url: t, type: "auto" } : t;
|
|
585
|
+
o || (this.retryCount = 0, this.store.setState({ error: null }), this.removeNotification("retry")), this.currentSrc = r.url, this.currentSource = r, this.trackConfigs = i;
|
|
586
|
+
const h = this.store.get().sources.findIndex((x) => x.url === r.url), f = i.map((x, p) => ({
|
|
587
|
+
...x,
|
|
588
588
|
index: p,
|
|
589
589
|
status: "idle",
|
|
590
|
-
isDefault: !!
|
|
590
|
+
isDefault: !!x.default
|
|
591
591
|
}));
|
|
592
592
|
this.store.setState({
|
|
593
593
|
isBuffering: !0,
|
|
@@ -601,17 +601,17 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
601
601
|
currentSubtitle: -1,
|
|
602
602
|
currentSourceIndex: h
|
|
603
603
|
}), this.updateMediaSessionMetadata();
|
|
604
|
-
let
|
|
605
|
-
|
|
604
|
+
let v = r.type || "auto";
|
|
605
|
+
v === "auto" && (r.url.includes(".m3u8") ? v = "hls" : r.url.includes(".mpd") ? v = "dash" : r.url.includes(".flv") || r.url.includes(".ts") ? v = "mpegts" : r.url.startsWith("magnet:") || r.url.includes(".torrent") ? v = "webtorrent" : v = "mp4"), this.events.emit("load", { url: r.url, type: v });
|
|
606
606
|
const b = this.video.getElementsByTagName("track");
|
|
607
607
|
for (; b.length > 0; )
|
|
608
608
|
b[0].remove();
|
|
609
|
-
const m = f.findIndex((
|
|
610
|
-
m !== -1 && this.setSubtitle(m), (
|
|
609
|
+
const m = f.findIndex((x) => x.default);
|
|
610
|
+
m !== -1 && this.setSubtitle(m), (v === "mp4" || v === "webm" || v === "ogg") && (this.video.src = r.url);
|
|
611
611
|
}
|
|
612
612
|
// Wrapper for external subtitle API
|
|
613
613
|
loadSubtitle(t, i = "Subtitle") {
|
|
614
|
-
const o = this.store.get().subtitleTracks.length,
|
|
614
|
+
const o = this.store.get().subtitleTracks.length, r = {
|
|
615
615
|
src: t,
|
|
616
616
|
label: i,
|
|
617
617
|
srcLang: "user",
|
|
@@ -622,15 +622,15 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
622
622
|
isDefault: !0
|
|
623
623
|
};
|
|
624
624
|
this.store.setState((u) => ({
|
|
625
|
-
subtitleTracks: [...u.subtitleTracks,
|
|
625
|
+
subtitleTracks: [...u.subtitleTracks, r]
|
|
626
626
|
})), this.setSubtitle(o);
|
|
627
627
|
}
|
|
628
628
|
addTextTrack(t, i) {
|
|
629
629
|
const o = new FileReader();
|
|
630
|
-
o.onload = (
|
|
631
|
-
var
|
|
632
|
-
if (!((
|
|
633
|
-
let u =
|
|
630
|
+
o.onload = (r) => {
|
|
631
|
+
var v;
|
|
632
|
+
if (!((v = r.target) != null && v.result)) return;
|
|
633
|
+
let u = r.target.result;
|
|
634
634
|
u = this.convertToVTT(u);
|
|
635
635
|
const h = new Blob([u], { type: "text/vtt" }), f = URL.createObjectURL(h);
|
|
636
636
|
this.loadSubtitle(f, i), this.notify({ type: "success", message: "Subtitle uploaded", duration: 3e3 });
|
|
@@ -638,9 +638,9 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
638
638
|
this.notify({ type: "error", message: "Failed to read file", duration: 3e3 });
|
|
639
639
|
}, o.readAsText(t);
|
|
640
640
|
}
|
|
641
|
-
addTextTrackInternal(t, i, o = "",
|
|
641
|
+
addTextTrackInternal(t, i, o = "", r = !1) {
|
|
642
642
|
const u = document.createElement("track");
|
|
643
|
-
u.kind = "subtitles", u.label = i, u.src = t, u.srclang = o,
|
|
643
|
+
u.kind = "subtitles", u.label = i, u.src = t, u.srclang = o, r && (u.default = !0), this.video.appendChild(u);
|
|
644
644
|
}
|
|
645
645
|
play() {
|
|
646
646
|
return this.video.play();
|
|
@@ -679,29 +679,40 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
679
679
|
this.store.get().controlsVisible !== t && (this.store.setState({ controlsVisible: t }), this.emit("control", t));
|
|
680
680
|
}
|
|
681
681
|
async toggleFullscreen() {
|
|
682
|
-
if (this.container)
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
682
|
+
if (!this.container) return;
|
|
683
|
+
const t = document, i = this.container;
|
|
684
|
+
if (t.fullscreenElement || t.webkitFullscreenElement || t.mozFullScreenElement || t.msFullscreenElement) {
|
|
685
|
+
t.exitFullscreen ? await t.exitFullscreen().catch(() => {
|
|
686
|
+
}) : t.webkitExitFullscreen ? t.webkitExitFullscreen() : t.mozCancelFullScreen ? t.mozCancelFullScreen() : t.msExitFullscreen && t.msExitFullscreen();
|
|
687
|
+
return;
|
|
688
|
+
}
|
|
689
|
+
if (this.store.get().isWebFullscreen) {
|
|
690
|
+
this.toggleWebFullscreen();
|
|
691
|
+
return;
|
|
692
|
+
}
|
|
693
|
+
try {
|
|
694
|
+
if (i.requestFullscreen)
|
|
695
|
+
await i.requestFullscreen();
|
|
696
|
+
else if (i.webkitRequestFullscreen)
|
|
697
|
+
i.webkitRequestFullscreen();
|
|
698
|
+
else if (i.mozRequestFullScreen)
|
|
699
|
+
i.mozRequestFullScreen();
|
|
700
|
+
else if (i.msRequestFullscreen)
|
|
701
|
+
i.msRequestFullscreen();
|
|
702
|
+
else if (this.video && this.video.webkitEnterFullscreen)
|
|
703
|
+
this.video.webkitEnterFullscreen();
|
|
704
|
+
else
|
|
705
|
+
throw new Error("Native fullscreen API not supported");
|
|
706
|
+
} catch (r) {
|
|
707
|
+
console.warn("Native fullscreen failed, falling back to Web Fullscreen", r), this.toggleWebFullscreen();
|
|
697
708
|
}
|
|
698
709
|
}
|
|
699
710
|
toggleWebFullscreen() {
|
|
700
|
-
const t = this.store.get().isWebFullscreen;
|
|
701
|
-
|
|
702
|
-
});
|
|
703
|
-
const
|
|
704
|
-
this.store.setState({ isWebFullscreen:
|
|
711
|
+
const t = this.store.get().isWebFullscreen, i = document;
|
|
712
|
+
(i.fullscreenElement || i.webkitFullscreenElement || i.mozFullScreenElement || i.msFullscreenElement) && (i.exitFullscreen ? i.exitFullscreen().catch(() => {
|
|
713
|
+
}) : i.webkitExitFullscreen ? i.webkitExitFullscreen() : i.mozCancelFullScreen ? i.mozCancelFullScreen() : i.msExitFullscreen && i.msExitFullscreen());
|
|
714
|
+
const o = !t;
|
|
715
|
+
this.store.setState({ isWebFullscreen: o }), typeof document < "u" && (document.body.style.overflow = o ? "hidden" : ""), this.emit("webfullscreen", o);
|
|
705
716
|
}
|
|
706
717
|
togglePip() {
|
|
707
718
|
document.pictureInPictureElement ? document.exitPictureInPicture() : this.video !== document.pictureInPictureElement && this.video.requestPictureInPicture && this.video.requestPictureInPicture();
|
|
@@ -713,8 +724,8 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
713
724
|
if (i) {
|
|
714
725
|
i.drawImage(this.video, 0, 0, t.width, t.height);
|
|
715
726
|
try {
|
|
716
|
-
const o = t.toDataURL("image/png"),
|
|
717
|
-
|
|
727
|
+
const o = t.toDataURL("image/png"), r = document.createElement("a");
|
|
728
|
+
r.download = `screenshot-${(/* @__PURE__ */ new Date()).toISOString()}.png`, r.href = o, r.click(), this.notify({ type: "success", message: "Screenshot saved", duration: 2e3 });
|
|
718
729
|
} catch {
|
|
719
730
|
this.notify({ type: "error", message: "Failed to take screenshot", duration: 3e3 });
|
|
720
731
|
}
|
|
@@ -732,8 +743,8 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
732
743
|
[t]: !i[t]
|
|
733
744
|
};
|
|
734
745
|
this.store.setState({ flipState: o });
|
|
735
|
-
const
|
|
736
|
-
this.video.style.transform = `scale(${
|
|
746
|
+
const r = o.horizontal ? -1 : 1, u = o.vertical ? -1 : 1;
|
|
747
|
+
this.video.style.transform = `scale(${r}, ${u})`;
|
|
737
748
|
}
|
|
738
749
|
setAspectRatio(t) {
|
|
739
750
|
this.store.setState({ aspectRatio: t }), this.updateAspectRatio(), t !== "default" && this.notify({ type: "info", message: `Aspect Ratio: ${t}`, duration: 2e3 });
|
|
@@ -752,13 +763,13 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
752
763
|
this.video.style.width = "100%", this.video.style.height = "100%", this.video.style.objectFit = i;
|
|
753
764
|
return;
|
|
754
765
|
}
|
|
755
|
-
const [o,
|
|
756
|
-
if (!o || !
|
|
757
|
-
const u = o /
|
|
766
|
+
const [o, r] = t.split(":").map(Number);
|
|
767
|
+
if (!o || !r) return;
|
|
768
|
+
const u = o / r, h = this.container.getBoundingClientRect();
|
|
758
769
|
if (h.width === 0 || h.height === 0) return;
|
|
759
770
|
const f = h.width / h.height;
|
|
760
|
-
let
|
|
761
|
-
f > u ? (b = h.height,
|
|
771
|
+
let v, b;
|
|
772
|
+
f > u ? (b = h.height, v = b * u) : (v = h.width, b = v / u), this.video.style.width = `${v}px`, this.video.style.height = `${b}px`, this.video.style.objectFit = "fill";
|
|
762
773
|
}
|
|
763
774
|
initCast() {
|
|
764
775
|
const t = window, i = () => {
|
|
@@ -796,8 +807,8 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
796
807
|
try {
|
|
797
808
|
const i = t.cast.framework.CastContext.getInstance().getCurrentSession();
|
|
798
809
|
if (!i) return;
|
|
799
|
-
const o = new t.chrome.cast.media.MediaInfo(this.currentSrc, this.currentSrc.includes(".m3u8") ? "application/x-mpegurl" : "video/mp4"),
|
|
800
|
-
i.loadMedia(
|
|
810
|
+
const o = new t.chrome.cast.media.MediaInfo(this.currentSrc, this.currentSrc.includes(".m3u8") ? "application/x-mpegurl" : "video/mp4"), r = new t.chrome.cast.media.LoadRequest(o);
|
|
811
|
+
i.loadMedia(r).then(() => {
|
|
801
812
|
this.notify({ type: "success", message: "Casting...", duration: 3e3 });
|
|
802
813
|
}).catch((u) => console.error("Cast load error", u));
|
|
803
814
|
} catch (i) {
|
|
@@ -809,10 +820,10 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
809
820
|
this.store.setState({ activeCues: [] });
|
|
810
821
|
return;
|
|
811
822
|
}
|
|
812
|
-
const o = Array.from(this.video.textTracks).filter((
|
|
823
|
+
const o = Array.from(this.video.textTracks).filter((r) => r.kind === "subtitles" || r.kind === "captions").find((r) => r.mode === "showing" || r.mode === "hidden");
|
|
813
824
|
if (o && o.activeCues) {
|
|
814
|
-
const
|
|
815
|
-
this.store.setState({ activeCues:
|
|
825
|
+
const r = Array.from(o.activeCues).map((u) => u.text);
|
|
826
|
+
this.store.setState({ activeCues: r });
|
|
816
827
|
} else
|
|
817
828
|
this.store.setState({ activeCues: [] });
|
|
818
829
|
}
|
|
@@ -826,16 +837,16 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
826
837
|
try {
|
|
827
838
|
let f = await (await this.fetchWithRetry(o.src)).text();
|
|
828
839
|
f = this.convertToVTT(f);
|
|
829
|
-
const
|
|
840
|
+
const v = new Blob([f], { type: "text/vtt" }), b = URL.createObjectURL(v);
|
|
830
841
|
this.addTextTrackInternal(b, o.label, o.srcLang, !1), this.updateSubtitleTrackState(t, { status: "success" });
|
|
831
842
|
} catch (h) {
|
|
832
843
|
this.updateSubtitleTrackState(t, { status: "error" }), console.error("Failed to load subtitle", h);
|
|
833
844
|
return;
|
|
834
845
|
}
|
|
835
846
|
}
|
|
836
|
-
const
|
|
837
|
-
let u =
|
|
838
|
-
if (u || (u =
|
|
847
|
+
const r = Array.from(this.video.textTracks);
|
|
848
|
+
let u = r.find((h) => h.label === o.label && h.language === o.srcLang);
|
|
849
|
+
if (u || (u = r.find((h) => h.label === o.label)), u) {
|
|
839
850
|
const h = this.store.get().subtitleSettings;
|
|
840
851
|
u.mode = h.useNative ? "showing" : "hidden", u.addEventListener("cuechange", this.boundCueChange), this.handleCueChange();
|
|
841
852
|
}
|
|
@@ -843,20 +854,20 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
843
854
|
updateSubtitleSettings(t) {
|
|
844
855
|
const o = { ...this.store.get().subtitleSettings, ...t };
|
|
845
856
|
if (this.store.setState({ subtitleSettings: o }), t.useNative !== void 0) {
|
|
846
|
-
const
|
|
847
|
-
if (
|
|
848
|
-
const h = this.store.get().subtitleTracks[
|
|
857
|
+
const r = this.store.get().currentSubtitle;
|
|
858
|
+
if (r !== -1) {
|
|
859
|
+
const h = this.store.get().subtitleTracks[r], f = Array.from(this.video.textTracks).find((v) => v.label === h.label && v.language === h.srcLang);
|
|
849
860
|
f && (f.mode = t.useNative ? "showing" : "hidden");
|
|
850
861
|
}
|
|
851
862
|
}
|
|
852
863
|
}
|
|
853
864
|
resetSubtitleSettings() {
|
|
854
|
-
this.store.setState({ subtitleSettings:
|
|
865
|
+
this.store.setState({ subtitleSettings: at }), this.updateSubtitleSettings({ useNative: !1 });
|
|
855
866
|
}
|
|
856
867
|
setSubtitleOffset(t) {
|
|
857
868
|
const i = this.store.get().subtitleOffset, o = t - i;
|
|
858
|
-
Math.abs(o) < 1e-3 || (Array.from(this.video.textTracks).forEach((
|
|
859
|
-
(
|
|
869
|
+
Math.abs(o) < 1e-3 || (Array.from(this.video.textTracks).forEach((r) => {
|
|
870
|
+
(r.mode === "showing" || r.mode === "hidden") && r.cues && Array.from(r.cues).forEach((u) => {
|
|
860
871
|
u.startTime += o, u.endTime += o;
|
|
861
872
|
});
|
|
862
873
|
}), this.store.setState({ subtitleOffset: t }), this.notify({ type: "info", message: `Subtitle Offset: ${t > 0 ? "+" : ""}${t.toFixed(1)}s`, duration: 1500 }));
|
|
@@ -866,7 +877,7 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
866
877
|
t && this.activeDownloads.has(t) ? ((i = this.activeDownloads.get(t)) == null || i.abort(), this.activeDownloads.delete(t), this.notify({ type: "info", message: "Download cancelled", duration: 2e3 }), this.removeNotification(t)) : t || this.activeDownloads.size > 0 && (this.activeDownloads.forEach((o) => o.abort()), this.activeDownloads.clear(), this.notify({ type: "info", message: "All downloads cancelled", duration: 2e3 }));
|
|
867
878
|
}
|
|
868
879
|
async download(t = {}) {
|
|
869
|
-
var h, f,
|
|
880
|
+
var h, f, v;
|
|
870
881
|
const i = ((h = this.currentSource) == null ? void 0 : h.url) || this.video.src;
|
|
871
882
|
if (!i) return;
|
|
872
883
|
if (i.includes(".m3u8") || ((f = this.currentSource) == null ? void 0 : f.type) === "hls") {
|
|
@@ -877,9 +888,9 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
877
888
|
this.notify({ type: "warning", message: "Stream download not supported in browser.", duration: 4e3 });
|
|
878
889
|
return;
|
|
879
890
|
}
|
|
880
|
-
const o = Math.random().toString(36).substr(2, 9),
|
|
881
|
-
this.activeDownloads.set(o,
|
|
882
|
-
const u =
|
|
891
|
+
const o = Math.random().toString(36).substr(2, 9), r = new AbortController();
|
|
892
|
+
this.activeDownloads.set(o, r);
|
|
893
|
+
const u = r.signal;
|
|
883
894
|
this.notify({
|
|
884
895
|
id: o,
|
|
885
896
|
type: "loading",
|
|
@@ -893,32 +904,32 @@ Retrying (${this.retryCount}/${this.maxRetries})`
|
|
|
893
904
|
try {
|
|
894
905
|
const b = await this.fetchWithRetry(i, 3, void 0, u);
|
|
895
906
|
if (!b.body) throw new Error("No body");
|
|
896
|
-
const m = b.body.getReader(),
|
|
907
|
+
const m = b.body.getReader(), x = b.headers.get("Content-Length"), p = x ? parseInt(x, 10) : 0;
|
|
897
908
|
let S = 0;
|
|
898
|
-
const
|
|
899
|
-
let
|
|
909
|
+
const L = [], U = Date.now(), H = [];
|
|
910
|
+
let _ = 0;
|
|
900
911
|
for (; ; ) {
|
|
901
912
|
const { done: fe, value: k } = await m.read();
|
|
902
913
|
if (fe) break;
|
|
903
|
-
if (
|
|
914
|
+
if (L.push(k), S += k.length, p) {
|
|
904
915
|
const j = Date.now();
|
|
905
|
-
if (j -
|
|
906
|
-
|
|
916
|
+
if (j - _ > 800 || S === p) {
|
|
917
|
+
_ = j;
|
|
907
918
|
const D = Math.round(S / p * 100);
|
|
908
919
|
for (H.push({ time: j, loaded: S }); H.length > 0 && j - H[0].time > 5e3; )
|
|
909
920
|
H.shift();
|
|
910
921
|
let T = "", n = 0;
|
|
911
922
|
if (H.length > 1) {
|
|
912
|
-
const X = H[0],
|
|
913
|
-
ne > 0 && (n =
|
|
923
|
+
const X = H[0], G = H[H.length - 1], ne = G.time - X.time, ae = G.loaded - X.loaded;
|
|
924
|
+
ne > 0 && (n = ae / ne);
|
|
914
925
|
} else {
|
|
915
926
|
const X = j - U;
|
|
916
927
|
X > 0 && (n = S / X);
|
|
917
928
|
}
|
|
918
929
|
if (n > 0) {
|
|
919
|
-
const
|
|
930
|
+
const G = (p - S) / n;
|
|
920
931
|
T = `
|
|
921
|
-
${this.formatDuration(
|
|
932
|
+
${this.formatDuration(G)} remaining`;
|
|
922
933
|
}
|
|
923
934
|
this.notify({
|
|
924
935
|
id: o,
|
|
@@ -934,8 +945,8 @@ ${this.formatDuration(_)} remaining`;
|
|
|
934
945
|
}
|
|
935
946
|
}
|
|
936
947
|
}
|
|
937
|
-
const g = new Blob(
|
|
938
|
-
|
|
948
|
+
const g = new Blob(L), Y = window.URL.createObjectURL(g), q = document.createElement("a");
|
|
949
|
+
q.style.display = "none", q.href = Y, q.download = ((v = i.split("/").pop()) == null ? void 0 : v.split("?")[0]) || "video.mp4", document.body.appendChild(q), q.click(), window.URL.revokeObjectURL(Y), document.body.removeChild(q), this.notify({ id: o, type: "success", message: "Saved!", duration: 3e3 });
|
|
939
950
|
} catch {
|
|
940
951
|
u.aborted ? this.removeNotification(o) : (this.notify({ id: o, type: "error", message: "Download failed.", duration: 4e3 }), window.open(i, "_blank"));
|
|
941
952
|
} finally {
|
|
@@ -944,9 +955,9 @@ ${this.formatDuration(_)} remaining`;
|
|
|
944
955
|
}
|
|
945
956
|
async downloadHls(t, i) {
|
|
946
957
|
var h;
|
|
947
|
-
const o = Math.random().toString(36).substr(2, 9),
|
|
948
|
-
this.activeDownloads.set(o,
|
|
949
|
-
const u =
|
|
958
|
+
const o = Math.random().toString(36).substr(2, 9), r = new AbortController();
|
|
959
|
+
this.activeDownloads.set(o, r);
|
|
960
|
+
const u = r.signal;
|
|
950
961
|
this.notify({
|
|
951
962
|
id: o,
|
|
952
963
|
type: "loading",
|
|
@@ -955,10 +966,10 @@ ${this.formatDuration(_)} remaining`;
|
|
|
955
966
|
action: { label: "Cancel", onClick: () => this.cancelDownload(o) }
|
|
956
967
|
});
|
|
957
968
|
try {
|
|
958
|
-
let f = await this.fetchWithRetry(t, 3, void 0, u),
|
|
959
|
-
if (
|
|
969
|
+
let f = await this.fetchWithRetry(t, 3, void 0, u), v = await f.text(), b = t.substring(0, t.lastIndexOf("/") + 1);
|
|
970
|
+
if (v.includes("#EXT-X-STREAM-INF")) {
|
|
960
971
|
this.notify({ id: o, type: "loading", message: "Selecting best quality", progress: 0 });
|
|
961
|
-
const k =
|
|
972
|
+
const k = v.split(`
|
|
962
973
|
`);
|
|
963
974
|
let j = 0, D = "";
|
|
964
975
|
for (let T = 0; T < k.length; T++)
|
|
@@ -966,29 +977,29 @@ ${this.formatDuration(_)} remaining`;
|
|
|
966
977
|
const n = k[T].match(/BANDWIDTH=(\d+)/);
|
|
967
978
|
if (n) {
|
|
968
979
|
const X = parseInt(n[1]);
|
|
969
|
-
let
|
|
970
|
-
|
|
980
|
+
let G = (h = k[T + 1]) == null ? void 0 : h.trim();
|
|
981
|
+
G && !G.startsWith("#") && X > j && (j = X, D = G);
|
|
971
982
|
}
|
|
972
983
|
}
|
|
973
|
-
D && (D.startsWith("http") || (D = b + D), f = await this.fetchWithRetry(D, 3, void 0, u),
|
|
984
|
+
D && (D.startsWith("http") || (D = b + D), f = await this.fetchWithRetry(D, 3, void 0, u), v = await f.text(), b = D.substring(0, D.lastIndexOf("/") + 1));
|
|
974
985
|
}
|
|
975
|
-
if (
|
|
986
|
+
if (v.includes("#EXT-X-KEY"))
|
|
976
987
|
throw new Error("Encrypted HLS streams are not supported for download.");
|
|
977
|
-
const m =
|
|
978
|
-
`),
|
|
988
|
+
const m = v.split(`
|
|
989
|
+
`), x = [];
|
|
979
990
|
for (let k of m)
|
|
980
|
-
k = k.trim(), k && !k.startsWith("#") && (k.startsWith("http") ?
|
|
981
|
-
if (
|
|
982
|
-
let p = i === "mp4" ? "mp4" : "ts", S = i === "mp4" ? "video/mp4" : "video/mp2t",
|
|
991
|
+
k = k.trim(), k && !k.startsWith("#") && (k.startsWith("http") ? x.push(k) : x.push(b + k));
|
|
992
|
+
if (x.length === 0) throw new Error("No segments found.");
|
|
993
|
+
let p = i === "mp4" ? "mp4" : "ts", S = i === "mp4" ? "video/mp4" : "video/mp2t", L = null, U = null, H = [];
|
|
983
994
|
if ("showSaveFilePicker" in window)
|
|
984
995
|
try {
|
|
985
|
-
|
|
996
|
+
L = await window.showSaveFilePicker({
|
|
986
997
|
suggestedName: `video.${p}`,
|
|
987
998
|
types: [{
|
|
988
999
|
description: i === "mp4" ? "MPEG-4 Video" : "MPEG Transport Stream",
|
|
989
1000
|
accept: { [S]: [`.${p}`] }
|
|
990
1001
|
}]
|
|
991
|
-
}), U = await
|
|
1002
|
+
}), U = await L.createWritable();
|
|
992
1003
|
} catch (k) {
|
|
993
1004
|
if (k.name === "AbortError") {
|
|
994
1005
|
this.removeNotification(o), this.notify({ type: "info", message: "Download cancelled", duration: 2e3 }), this.activeDownloads.delete(o);
|
|
@@ -997,38 +1008,38 @@ ${this.formatDuration(_)} remaining`;
|
|
|
997
1008
|
console.warn("File System API cancelled or failed, falling back to memory", k);
|
|
998
1009
|
}
|
|
999
1010
|
let g = !1;
|
|
1000
|
-
const Y = Date.now(),
|
|
1011
|
+
const Y = Date.now(), q = [];
|
|
1001
1012
|
let fe = 0;
|
|
1002
|
-
for (let k = 0; k <
|
|
1013
|
+
for (let k = 0; k < x.length && !u.aborted; k++) {
|
|
1003
1014
|
const j = Date.now();
|
|
1004
|
-
if (j - fe > 800 || k === 0 || k ===
|
|
1015
|
+
if (j - fe > 800 || k === 0 || k === x.length - 1) {
|
|
1005
1016
|
fe = j;
|
|
1006
|
-
const X = Math.round((k + 1) /
|
|
1007
|
-
for (
|
|
1008
|
-
|
|
1009
|
-
let
|
|
1010
|
-
if (
|
|
1011
|
-
const ne =
|
|
1017
|
+
const X = Math.round((k + 1) / x.length * 100);
|
|
1018
|
+
for (q.push({ time: j, count: k + 1 }); q.length > 0 && j - q[0].time > 5e3; )
|
|
1019
|
+
q.shift();
|
|
1020
|
+
let G = "";
|
|
1021
|
+
if (q.length > 1) {
|
|
1022
|
+
const ne = q[0], ae = q[q.length - 1], be = ae.time - ne.time, ge = ae.count - ne.count;
|
|
1012
1023
|
if (be > 0 && ge > 0) {
|
|
1013
|
-
const Te = be / ge, je = (
|
|
1014
|
-
|
|
1024
|
+
const Te = be / ge, je = (x.length - (k + 1)) * Te;
|
|
1025
|
+
G = `
|
|
1015
1026
|
${this.formatDuration(je)} remaining`;
|
|
1016
1027
|
}
|
|
1017
1028
|
} else if (k > 0) {
|
|
1018
|
-
const
|
|
1019
|
-
|
|
1029
|
+
const ae = (j - Y) / k, ge = (x.length - k) * ae;
|
|
1030
|
+
G = `
|
|
1020
1031
|
${this.formatDuration(ge)} remaining`;
|
|
1021
1032
|
}
|
|
1022
1033
|
this.notify({
|
|
1023
1034
|
id: o,
|
|
1024
1035
|
type: "loading",
|
|
1025
1036
|
// Cleaned string
|
|
1026
|
-
message: `Downloading segment ${k + 1}/${
|
|
1037
|
+
message: `Downloading segment ${k + 1}/${x.length}${G}`,
|
|
1027
1038
|
progress: X,
|
|
1028
1039
|
action: { label: "Cancel", onClick: () => this.cancelDownload(o) }
|
|
1029
1040
|
});
|
|
1030
1041
|
}
|
|
1031
|
-
const T = await (await this.fetchWithRetry(
|
|
1042
|
+
const T = await (await this.fetchWithRetry(x[k], 3, void 0, u)).arrayBuffer();
|
|
1032
1043
|
k === 0 && new Uint8Array(T.slice(0, 4))[0] === 71 && (g = !0, i === "mp4" && (this.notify({
|
|
1033
1044
|
type: "info",
|
|
1034
1045
|
message: "Stream is MPEG-TS. Downloading as .ts to prevent corruption.",
|
|
@@ -1056,7 +1067,7 @@ ${this.formatDuration(ge)} remaining`;
|
|
|
1056
1067
|
}
|
|
1057
1068
|
notify(t) {
|
|
1058
1069
|
const i = t.id || Math.random().toString(36).substr(2, 9), o = { ...t, id: i };
|
|
1059
|
-
return this.store.setState((
|
|
1070
|
+
return this.store.setState((r) => r.notifications.find((h) => h.id === i) ? { notifications: r.notifications.map((h) => h.id === i ? o : h) } : { notifications: [...r.notifications, o] }), t.duration && setTimeout(() => this.removeNotification(i), t.duration), i;
|
|
1060
1071
|
}
|
|
1061
1072
|
removeNotification(t) {
|
|
1062
1073
|
const i = this.store.get().notifications;
|
|
@@ -1069,14 +1080,14 @@ ${this.formatDuration(ge)} remaining`;
|
|
|
1069
1080
|
}));
|
|
1070
1081
|
}
|
|
1071
1082
|
destroy() {
|
|
1072
|
-
this.retryTimer && clearTimeout(this.retryTimer), this.resizeObserver && (this.resizeObserver.disconnect(), this.resizeObserver = null), this.activeDownloads.forEach((
|
|
1073
|
-
const
|
|
1074
|
-
for (;
|
|
1075
|
-
this.emit("destroy"), this.events.destroy(), this.store.destroy(), this.plugins.forEach((
|
|
1083
|
+
this.retryTimer && clearTimeout(this.retryTimer), this.resizeObserver && (this.resizeObserver.disconnect(), this.resizeObserver = null), this.activeDownloads.forEach((o) => o.abort()), this.activeDownloads.clear(), this.store.get().isWebFullscreen && typeof document < "u" && (document.body.style.overflow = ""), ["fullscreenchange", "webkitfullscreenchange", "mozfullscreenchange", "MSFullscreenChange"].forEach((o) => document.removeEventListener(o, this.boundFullscreenChange)), this.video.pause(), this.video.src = "";
|
|
1084
|
+
const i = this.video.getElementsByTagName("track");
|
|
1085
|
+
for (; i.length > 0; ) i[0].remove();
|
|
1086
|
+
this.emit("destroy"), this.events.destroy(), this.store.destroy(), this.plugins.forEach((o) => o.destroy && o.destroy()), this.plugins.clear(), this.video.remove(), this.audioEngine.destroy();
|
|
1076
1087
|
}
|
|
1077
1088
|
}
|
|
1078
1089
|
const st = (s, t = 200) => {
|
|
1079
|
-
const [i, o] = M(s), [
|
|
1090
|
+
const [i, o] = M(s), [r, u] = M(!1);
|
|
1080
1091
|
return ee(() => {
|
|
1081
1092
|
if (s)
|
|
1082
1093
|
o(!0), requestAnimationFrame(() => {
|
|
@@ -1091,18 +1102,18 @@ const st = (s, t = 200) => {
|
|
|
1091
1102
|
}, t);
|
|
1092
1103
|
return () => clearTimeout(h);
|
|
1093
1104
|
}
|
|
1094
|
-
}, [s, t]), { isMounted: i, isVisible:
|
|
1105
|
+
}, [s, t]), { isMounted: i, isVisible: r };
|
|
1095
1106
|
}, y = ({
|
|
1096
1107
|
className: s,
|
|
1097
1108
|
children: t,
|
|
1098
1109
|
fill: i = "none",
|
|
1099
1110
|
strokeWidth: o = 2,
|
|
1100
|
-
viewBox:
|
|
1111
|
+
viewBox: r = "0 0 24 24"
|
|
1101
1112
|
}) => /* @__PURE__ */ e(
|
|
1102
1113
|
"svg",
|
|
1103
1114
|
{
|
|
1104
1115
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1105
|
-
viewBox:
|
|
1116
|
+
viewBox: r,
|
|
1106
1117
|
fill: i,
|
|
1107
1118
|
stroke: "currentColor",
|
|
1108
1119
|
strokeWidth: o,
|
|
@@ -1118,7 +1129,7 @@ const st = (s, t = 200) => {
|
|
|
1118
1129
|
/* @__PURE__ */ e("polygon", { points: "11 5 6 9 2 9 2 15 6 15 11 19 11 5" }),
|
|
1119
1130
|
/* @__PURE__ */ e("path", { d: "M19.07 4.93a10 10 0 0 1 0 14.14" }),
|
|
1120
1131
|
/* @__PURE__ */ e("path", { d: "M15.54 8.46a5 5 0 0 1 0 7.07" })
|
|
1121
|
-
] }),
|
|
1132
|
+
] }), $i = ({ className: s }) => /* @__PURE__ */ c(y, { className: s, children: [
|
|
1122
1133
|
/* @__PURE__ */ e("polygon", { points: "11 5 6 9 2 9 2 15 6 15 11 19 11 5" }),
|
|
1123
1134
|
/* @__PURE__ */ e("path", { d: "M15.54 8.46a5 5 0 0 1 0 7.07" })
|
|
1124
1135
|
] }), Ut = ({ className: s }) => /* @__PURE__ */ c(y, { className: s, children: [
|
|
@@ -1168,10 +1179,10 @@ const st = (s, t = 200) => {
|
|
|
1168
1179
|
/* @__PURE__ */ e("circle", { cx: "9", cy: "7", r: "4" }),
|
|
1169
1180
|
/* @__PURE__ */ e("path", { d: "M22 21v-2a4 4 0 0 0-3-3.87" }),
|
|
1170
1181
|
/* @__PURE__ */ e("path", { d: "M16 3.13a4 4 0 0 1 0 7.75" })
|
|
1171
|
-
] }),
|
|
1182
|
+
] }), qi = ({ className: s }) => /* @__PURE__ */ c(y, { className: s, children: [
|
|
1172
1183
|
/* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "10" }),
|
|
1173
1184
|
/* @__PURE__ */ e("polyline", { points: "12 6 12 12 16 14" })
|
|
1174
|
-
] }),
|
|
1185
|
+
] }), Gi = ({ className: s }) => /* @__PURE__ */ e(y, { className: s, children: /* @__PURE__ */ e("path", { d: "M5 12h14" }) }), _i = ({ className: s }) => /* @__PURE__ */ c(y, { className: s, children: [
|
|
1175
1186
|
/* @__PURE__ */ e("path", { d: "M5 12h14" }),
|
|
1176
1187
|
/* @__PURE__ */ e("path", { d: "M12 5v14" })
|
|
1177
1188
|
] }), Zt = ({ className: s }) => /* @__PURE__ */ c(y, { className: s, children: [
|
|
@@ -1230,11 +1241,11 @@ const st = (s, t = 200) => {
|
|
|
1230
1241
|
] }), ti = ({ className: s }) => /* @__PURE__ */ c(y, { className: s, children: [
|
|
1231
1242
|
/* @__PURE__ */ e("path", { d: "M18 6 6 18" }),
|
|
1232
1243
|
/* @__PURE__ */ e("path", { d: "m6 6 12 12" })
|
|
1233
|
-
] }),
|
|
1244
|
+
] }), rs = ({ className: s }) => /* @__PURE__ */ c(y, { className: s, children: [
|
|
1234
1245
|
/* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "10" }),
|
|
1235
1246
|
/* @__PURE__ */ e("path", { d: "M12 16v-4" }),
|
|
1236
1247
|
/* @__PURE__ */ e("path", { d: "M12 8h.01" })
|
|
1237
|
-
] }),
|
|
1248
|
+
] }), as = ({ className: s }) => /* @__PURE__ */ c(y, { className: s, children: [
|
|
1238
1249
|
/* @__PURE__ */ e("rect", { width: "20", height: "8", x: "2", y: "2", rx: "2", ry: "2" }),
|
|
1239
1250
|
/* @__PURE__ */ e("rect", { width: "20", height: "8", x: "2", y: "14", rx: "2", ry: "2" }),
|
|
1240
1251
|
/* @__PURE__ */ e("line", { x1: "6", x2: "6.01", y1: "6", y2: "6" }),
|
|
@@ -1258,7 +1269,7 @@ const st = (s, t = 200) => {
|
|
|
1258
1269
|
/* @__PURE__ */ e("path", { d: "M1.42 9a16 16 0 0 1 21.16 0" }),
|
|
1259
1270
|
/* @__PURE__ */ e("path", { d: "M8.53 16.11a6 6 0 0 1 6.95 0" }),
|
|
1260
1271
|
/* @__PURE__ */ e("line", { x1: "12", x2: "12.01", y1: "20", y2: "20" })
|
|
1261
|
-
] }),
|
|
1272
|
+
] }), rt = ({ className: s }) => /* @__PURE__ */ c(y, { className: s, children: [
|
|
1262
1273
|
/* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "10" }),
|
|
1263
1274
|
/* @__PURE__ */ e("line", { x1: "12", x2: "12", y1: "8", y2: "12" }),
|
|
1264
1275
|
/* @__PURE__ */ e("line", { x1: "12", x2: "12.01", y1: "16", y2: "16" })
|
|
@@ -1285,7 +1296,7 @@ const st = (s, t = 200) => {
|
|
|
1285
1296
|
/* @__PURE__ */ e("polyline", { points: "14 2 14 8 20 8" }),
|
|
1286
1297
|
/* @__PURE__ */ e("path", { d: "M12 18h.01" }),
|
|
1287
1298
|
/* @__PURE__ */ e("path", { d: "M12 12v4" })
|
|
1288
|
-
] }),
|
|
1299
|
+
] }), qt = ({ className: s }) => /* @__PURE__ */ c(y, { className: s, children: [
|
|
1289
1300
|
/* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "5" }),
|
|
1290
1301
|
/* @__PURE__ */ e("path", { d: "M12 1v2" }),
|
|
1291
1302
|
/* @__PURE__ */ e("path", { d: "M12 21v2" }),
|
|
@@ -1299,13 +1310,13 @@ const st = (s, t = 200) => {
|
|
|
1299
1310
|
/* @__PURE__ */ e("rect", { width: "18", height: "7", x: "3", y: "3", rx: "1" }),
|
|
1300
1311
|
/* @__PURE__ */ e("rect", { width: "9", height: "7", x: "3", y: "14", rx: "1" }),
|
|
1301
1312
|
/* @__PURE__ */ e("rect", { width: "5", height: "7", x: "16", y: "14", rx: "1" })
|
|
1302
|
-
] }),
|
|
1313
|
+
] }), Gt = ({ className: s }) => /* @__PURE__ */ c("div", { className: `relative flex items-center justify-center ${s}`, children: [
|
|
1303
1314
|
/* @__PURE__ */ c(y, { className: "w-full h-full", children: [
|
|
1304
1315
|
/* @__PURE__ */ e("path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }),
|
|
1305
1316
|
/* @__PURE__ */ e("path", { d: "M3 3v5h5" })
|
|
1306
1317
|
] }),
|
|
1307
1318
|
/* @__PURE__ */ e("span", { className: "absolute inset-0 flex items-center justify-center text-[32%] font-bold select-none mt-[1px]", children: "10" })
|
|
1308
|
-
] }),
|
|
1319
|
+
] }), _t = ({ className: s }) => /* @__PURE__ */ c("div", { className: `relative flex items-center justify-center ${s}`, children: [
|
|
1309
1320
|
/* @__PURE__ */ c(y, { className: "w-full h-full", children: [
|
|
1310
1321
|
/* @__PURE__ */ e("path", { d: "M21 12a9 9 0 1 1-9-9 9.75 9.75 0 0 1 6.74 2.74L21 8" }),
|
|
1311
1322
|
/* @__PURE__ */ e("path", { d: "M21 3v5h-5" })
|
|
@@ -1347,8 +1358,8 @@ const st = (s, t = 200) => {
|
|
|
1347
1358
|
"button",
|
|
1348
1359
|
{
|
|
1349
1360
|
onClick: (o) => {
|
|
1350
|
-
var
|
|
1351
|
-
o.stopPropagation(), (
|
|
1361
|
+
var r;
|
|
1362
|
+
o.stopPropagation(), (r = t.action) == null || r.onClick();
|
|
1352
1363
|
},
|
|
1353
1364
|
className: "text-zinc-500 hover:text-zinc-200 transition-colors p-1 -mt-1.5 -mr-1.5",
|
|
1354
1365
|
title: t.action.label,
|
|
@@ -1358,8 +1369,8 @@ const st = (s, t = 200) => {
|
|
|
1358
1369
|
] }) }) : /* @__PURE__ */ c("div", { className: "flex items-start gap-2.5", children: [
|
|
1359
1370
|
t.type === "loading" && /* @__PURE__ */ e(De, { className: "w-3.5 h-3.5 animate-spin text-[var(--accent)] shrink-0 mt-0.5" }),
|
|
1360
1371
|
t.type === "success" && /* @__PURE__ */ e(He, { className: "w-3.5 h-3.5 text-emerald-500 shrink-0 mt-0.5" }),
|
|
1361
|
-
t.type === "error" && /* @__PURE__ */ e(
|
|
1362
|
-
t.type === "warning" && /* @__PURE__ */ e(
|
|
1372
|
+
t.type === "error" && /* @__PURE__ */ e(rt, { className: "w-3.5 h-3.5 text-red-500 shrink-0 mt-0.5" }),
|
|
1373
|
+
t.type === "warning" && /* @__PURE__ */ e(rt, { className: "w-3.5 h-3.5 text-amber-500 shrink-0 mt-0.5" }),
|
|
1363
1374
|
t.type === "info" && /* @__PURE__ */ e("div", { className: "w-1.5 h-1.5 rounded-full bg-[var(--accent)] mt-1.5 shrink-0" }),
|
|
1364
1375
|
/* @__PURE__ */ c("div", { className: "flex flex-col gap-0.5 min-w-0", children: [
|
|
1365
1376
|
/* @__PURE__ */ e("span", { className: "text-xs font-medium leading-snug break-words text-zinc-200 whitespace-pre-wrap", children: t.message }),
|
|
@@ -1367,8 +1378,8 @@ const st = (s, t = 200) => {
|
|
|
1367
1378
|
"button",
|
|
1368
1379
|
{
|
|
1369
1380
|
onClick: (o) => {
|
|
1370
|
-
var
|
|
1371
|
-
o.stopPropagation(), (
|
|
1381
|
+
var r;
|
|
1382
|
+
o.stopPropagation(), (r = t.action) == null || r.onClick();
|
|
1372
1383
|
},
|
|
1373
1384
|
className: "mt-1 self-start text-[10px] font-bold text-[var(--accent)] hover:text-white transition-colors uppercase tracking-wider",
|
|
1374
1385
|
children: t.action.label
|
|
@@ -1405,7 +1416,7 @@ const st = (s, t = 200) => {
|
|
|
1405
1416
|
style: {
|
|
1406
1417
|
bottom: `${t.verticalOffset}px`
|
|
1407
1418
|
},
|
|
1408
|
-
children: s.map((o,
|
|
1419
|
+
children: s.map((o, r) => /* @__PURE__ */ e(
|
|
1409
1420
|
"div",
|
|
1410
1421
|
{
|
|
1411
1422
|
className: "mb-1 inline-block max-w-[80%]",
|
|
@@ -1430,11 +1441,11 @@ const st = (s, t = 200) => {
|
|
|
1430
1441
|
}
|
|
1431
1442
|
)
|
|
1432
1443
|
},
|
|
1433
|
-
|
|
1444
|
+
r
|
|
1434
1445
|
))
|
|
1435
1446
|
}
|
|
1436
1447
|
);
|
|
1437
|
-
}, Oe = ({ content: s }) => typeof s == "string" ? s.trim().startsWith("<") ? /* @__PURE__ */ e("span", { dangerouslySetInnerHTML: { __html: s } }) : /* @__PURE__ */ e("span", { children: s }) : /* @__PURE__ */ e(Q, { children: s }), le = ({ label: s, checked: t, onChange: i, icon: o, tooltip:
|
|
1448
|
+
}, Oe = ({ content: s }) => typeof s == "string" ? s.trim().startsWith("<") ? /* @__PURE__ */ e("span", { dangerouslySetInnerHTML: { __html: s } }) : /* @__PURE__ */ e("span", { children: s }) : /* @__PURE__ */ e(Q, { children: s }), le = ({ label: s, checked: t, onChange: i, icon: o, tooltip: r }) => /* @__PURE__ */ c(
|
|
1438
1449
|
"div",
|
|
1439
1450
|
{
|
|
1440
1451
|
className: "flex items-center justify-between py-2.5 px-3 hover:bg-white/5 group transition-colors",
|
|
@@ -1444,7 +1455,7 @@ const st = (s, t = 200) => {
|
|
|
1444
1455
|
o && /* @__PURE__ */ e("span", { className: "text-zinc-500 group-hover:text-zinc-400 transition-colors flex items-center justify-center w-4 h-4", children: /* @__PURE__ */ e(Oe, { content: o }) }),
|
|
1445
1456
|
/* @__PURE__ */ c("div", { className: "flex flex-col", children: [
|
|
1446
1457
|
/* @__PURE__ */ e("span", { className: "text-sm text-zinc-300 font-medium group-hover:text-white transition-colors flex items-center", children: /* @__PURE__ */ e(Oe, { content: s }) }),
|
|
1447
|
-
|
|
1458
|
+
r && /* @__PURE__ */ e("span", { className: "text-[10px] text-zinc-500", children: r })
|
|
1448
1459
|
] })
|
|
1449
1460
|
] }),
|
|
1450
1461
|
/* @__PURE__ */ e(
|
|
@@ -1472,7 +1483,7 @@ const st = (s, t = 200) => {
|
|
|
1472
1483
|
)
|
|
1473
1484
|
]
|
|
1474
1485
|
}
|
|
1475
|
-
), xe = ({ label: s, value: t, min: i, max: o, step:
|
|
1486
|
+
), xe = ({ label: s, value: t, min: i, max: o, step: r, onChange: u, formatValue: h, icon: f }) => /* @__PURE__ */ c(
|
|
1476
1487
|
"div",
|
|
1477
1488
|
{
|
|
1478
1489
|
className: "py-2.5 px-3 hover:bg-white/5 group transition-colors",
|
|
@@ -1499,9 +1510,9 @@ const st = (s, t = 200) => {
|
|
|
1499
1510
|
type: "range",
|
|
1500
1511
|
min: i,
|
|
1501
1512
|
max: o,
|
|
1502
|
-
step:
|
|
1513
|
+
step: r,
|
|
1503
1514
|
value: t,
|
|
1504
|
-
onChange: (
|
|
1515
|
+
onChange: (v) => u(parseFloat(v.target.value)),
|
|
1505
1516
|
className: "w-full h-1.5 appearance-none cursor-pointer focus:outline-none focus:ring-2 strata-range-input",
|
|
1506
1517
|
style: {
|
|
1507
1518
|
borderRadius: "var(--radius-full)",
|
|
@@ -1530,14 +1541,14 @@ const st = (s, t = 200) => {
|
|
|
1530
1541
|
] })
|
|
1531
1542
|
]
|
|
1532
1543
|
}
|
|
1533
|
-
), ws = ({ label: s, value: t, options: i, onChange: o, icon:
|
|
1544
|
+
), ws = ({ label: s, value: t, options: i, onChange: o, icon: r }) => /* @__PURE__ */ c(
|
|
1534
1545
|
"div",
|
|
1535
1546
|
{
|
|
1536
1547
|
className: "py-2.5 px-3 hover:bg-white/5 group transition-colors",
|
|
1537
1548
|
style: { borderRadius: "var(--radius)" },
|
|
1538
1549
|
children: [
|
|
1539
1550
|
/* @__PURE__ */ c("div", { className: "flex items-center gap-3 mb-2", children: [
|
|
1540
|
-
|
|
1551
|
+
r && /* @__PURE__ */ e("span", { className: "text-zinc-500 group-hover:text-zinc-400 transition-colors flex items-center justify-center w-4 h-4", children: /* @__PURE__ */ e(Oe, { content: r }) }),
|
|
1541
1552
|
/* @__PURE__ */ e("span", { className: "text-xs font-bold text-zinc-400 uppercase tracking-wider group-hover:text-zinc-300 transition-colors", children: s })
|
|
1542
1553
|
] }),
|
|
1543
1554
|
/* @__PURE__ */ c("div", { className: "relative", children: [
|
|
@@ -1563,15 +1574,15 @@ const st = (s, t = 200) => {
|
|
|
1563
1574
|
onClose: t,
|
|
1564
1575
|
align: i = "right",
|
|
1565
1576
|
maxHeight: o,
|
|
1566
|
-
className:
|
|
1577
|
+
className: r
|
|
1567
1578
|
}) => {
|
|
1568
|
-
const u = W(null), h = W(null), [f,
|
|
1579
|
+
const u = W(null), h = W(null), [f, v] = M("auto"), b = i === "center" ? "left-1/2 -translate-x-1/2 origin-bottom" : "right-0 origin-bottom-right";
|
|
1569
1580
|
Be(() => {
|
|
1570
1581
|
if (!h.current) return;
|
|
1571
|
-
const
|
|
1572
|
-
h.current &&
|
|
1573
|
-
}, p = new ResizeObserver(
|
|
1574
|
-
return p.observe(h.current),
|
|
1582
|
+
const x = () => {
|
|
1583
|
+
h.current && v(h.current.offsetHeight);
|
|
1584
|
+
}, p = new ResizeObserver(x);
|
|
1585
|
+
return p.observe(h.current), x(), () => p.disconnect();
|
|
1575
1586
|
}, []);
|
|
1576
1587
|
const m = {
|
|
1577
1588
|
height: f === "auto" ? "auto" : `${f + 14}px`,
|
|
@@ -1582,11 +1593,11 @@ const st = (s, t = 200) => {
|
|
|
1582
1593
|
"div",
|
|
1583
1594
|
{
|
|
1584
1595
|
ref: u,
|
|
1585
|
-
className: `absolute bottom-full mb-4 ${b} bg-[var(--bg-panel)] backdrop-blur-xl border-[length:var(--border-width)] border-white/10 shadow-2xl overflow-hidden w-[300px] max-w-[calc(100vw-32px)] text-sm z-50 ring-1 ring-white/5 font-[family-name:var(--font-main)] flex flex-col p-1.5 transition-[height,opacity,transform] duration-300 ease-out ${
|
|
1596
|
+
className: `absolute bottom-full mb-4 ${b} bg-[var(--bg-panel)] backdrop-blur-xl border-[length:var(--border-width)] border-white/10 shadow-2xl overflow-hidden w-[300px] max-w-[calc(100vw-32px)] text-sm z-50 ring-1 ring-white/5 font-[family-name:var(--font-main)] flex flex-col p-1.5 transition-[height,opacity,transform] duration-300 ease-out ${r}`,
|
|
1586
1597
|
style: { ...m, borderRadius: "var(--radius-lg)" },
|
|
1587
|
-
onClick: (
|
|
1588
|
-
onMouseDown: (
|
|
1589
|
-
onTouchStart: (
|
|
1598
|
+
onClick: (x) => x.stopPropagation(),
|
|
1599
|
+
onMouseDown: (x) => x.stopPropagation(),
|
|
1600
|
+
onTouchStart: (x) => x.stopPropagation(),
|
|
1590
1601
|
children: /* @__PURE__ */ e(
|
|
1591
1602
|
"div",
|
|
1592
1603
|
{
|
|
@@ -1606,12 +1617,12 @@ const st = (s, t = 200) => {
|
|
|
1606
1617
|
className: t,
|
|
1607
1618
|
dangerouslySetInnerHTML: { __html: s }
|
|
1608
1619
|
}
|
|
1609
|
-
) : /* @__PURE__ */ e("span", { className: t, children: s }) : /* @__PURE__ */ e("span", { className: t, children: s }),
|
|
1620
|
+
) : /* @__PURE__ */ e("span", { className: t, children: s }) : /* @__PURE__ */ e("span", { className: t, children: s }), P = ({
|
|
1610
1621
|
label: s,
|
|
1611
1622
|
value: t,
|
|
1612
1623
|
active: i,
|
|
1613
1624
|
onClick: o,
|
|
1614
|
-
hasSubmenu:
|
|
1625
|
+
hasSubmenu: r,
|
|
1615
1626
|
icon: u,
|
|
1616
1627
|
rightIcon: h
|
|
1617
1628
|
}) => /* @__PURE__ */ c(
|
|
@@ -1643,7 +1654,7 @@ const st = (s, t = 200) => {
|
|
|
1643
1654
|
),
|
|
1644
1655
|
h,
|
|
1645
1656
|
i && /* @__PURE__ */ e(He, { className: "w-4 h-4 text-[var(--accent)] shrink-0" }),
|
|
1646
|
-
|
|
1657
|
+
r && /* @__PURE__ */ e("span", { className: "text-xs group-hover:translate-x-0.5 transition-transform text-zinc-500 shrink-0", children: "›" })
|
|
1647
1658
|
] })
|
|
1648
1659
|
]
|
|
1649
1660
|
}
|
|
@@ -1676,14 +1687,14 @@ const st = (s, t = 200) => {
|
|
|
1676
1687
|
onClose: t,
|
|
1677
1688
|
title: i,
|
|
1678
1689
|
maxHeight: o,
|
|
1679
|
-
className:
|
|
1690
|
+
className: r
|
|
1680
1691
|
}) => {
|
|
1681
|
-
const [u, h] = M([]), f = u.length > 0 ? u[u.length - 1] : null,
|
|
1692
|
+
const [u, h] = M([]), f = u.length > 0 ? u[u.length - 1] : null, v = f ? f.children || [] : s, b = f ? f.html : i || "Menu", m = () => {
|
|
1682
1693
|
h((p) => p.slice(0, -1));
|
|
1683
|
-
},
|
|
1694
|
+
}, x = (p) => {
|
|
1684
1695
|
p.children && h((S) => [...S, p]);
|
|
1685
1696
|
};
|
|
1686
|
-
return /* @__PURE__ */ e(lt, { onClose: t, maxHeight: o, className:
|
|
1697
|
+
return /* @__PURE__ */ e(lt, { onClose: t, maxHeight: o, className: r, children: /* @__PURE__ */ c("div", { className: "animate-in fade-in slide-in-from-right-4 duration-200", children: [
|
|
1687
1698
|
u.length > 0 ? /* @__PURE__ */ e(Z, { label: b || "Menu", onBack: m }) : i && /* @__PURE__ */ e(
|
|
1688
1699
|
"div",
|
|
1689
1700
|
{
|
|
@@ -1692,7 +1703,7 @@ const st = (s, t = 200) => {
|
|
|
1692
1703
|
children: /* @__PURE__ */ e("span", { children: i })
|
|
1693
1704
|
}
|
|
1694
1705
|
),
|
|
1695
|
-
/* @__PURE__ */ e("div", { className: "pb-1", children:
|
|
1706
|
+
/* @__PURE__ */ e("div", { className: "pb-1", children: v.map((p, S) => p.separator ? /* @__PURE__ */ e(me, {}, S) : p.isLabel ? /* @__PURE__ */ e(
|
|
1696
1707
|
"div",
|
|
1697
1708
|
{
|
|
1698
1709
|
className: "px-3 py-1.5 text-[10px] font-bold text-zinc-500 uppercase tracking-wider select-none",
|
|
@@ -1708,7 +1719,7 @@ const st = (s, t = 200) => {
|
|
|
1708
1719
|
min: p.min ?? 0,
|
|
1709
1720
|
max: p.max ?? 100,
|
|
1710
1721
|
step: p.step ?? 1,
|
|
1711
|
-
onChange: (
|
|
1722
|
+
onChange: (L) => p.onRange && p.onRange(L),
|
|
1712
1723
|
formatValue: p.formatValue
|
|
1713
1724
|
}
|
|
1714
1725
|
) }, S) : p.switch !== void 0 ? /* @__PURE__ */ e("div", { className: "px-1", children: /* @__PURE__ */ e(
|
|
@@ -1718,10 +1729,10 @@ const st = (s, t = 200) => {
|
|
|
1718
1729
|
icon: p.icon,
|
|
1719
1730
|
checked: p.switch,
|
|
1720
1731
|
tooltip: p.tooltip,
|
|
1721
|
-
onChange: (
|
|
1732
|
+
onChange: (L) => p.onSwitch && p.onSwitch(p, L)
|
|
1722
1733
|
}
|
|
1723
1734
|
) }, S) : /* @__PURE__ */ e(Me.Fragment, { children: /* @__PURE__ */ e(
|
|
1724
|
-
|
|
1735
|
+
P,
|
|
1725
1736
|
{
|
|
1726
1737
|
label: p.html,
|
|
1727
1738
|
icon: p.icon,
|
|
@@ -1729,7 +1740,7 @@ const st = (s, t = 200) => {
|
|
|
1729
1740
|
active: p.active,
|
|
1730
1741
|
hasSubmenu: !!p.children,
|
|
1731
1742
|
onClick: () => {
|
|
1732
|
-
p.children ?
|
|
1743
|
+
p.children ? x(p) : p.onClick ? (p.onClick(p), !p.switch && !p.range && t()) : p.click && (p.click(p), t());
|
|
1733
1744
|
}
|
|
1734
1745
|
}
|
|
1735
1746
|
) }, S)) })
|
|
@@ -1739,25 +1750,25 @@ const st = (s, t = 200) => {
|
|
|
1739
1750
|
current: t,
|
|
1740
1751
|
onSelect: i,
|
|
1741
1752
|
onUpload: o,
|
|
1742
|
-
onClose:
|
|
1753
|
+
onClose: r,
|
|
1743
1754
|
settings: u,
|
|
1744
1755
|
onSettingsChange: h,
|
|
1745
1756
|
onReset: f,
|
|
1746
|
-
offset:
|
|
1757
|
+
offset: v,
|
|
1747
1758
|
onOffsetChange: b,
|
|
1748
1759
|
maxHeight: m,
|
|
1749
|
-
animationClass:
|
|
1760
|
+
animationClass: x
|
|
1750
1761
|
}) => {
|
|
1751
|
-
const [p, S] = M("main"), [
|
|
1752
|
-
(g) => g.label.toLowerCase().includes(
|
|
1753
|
-
) : s, [s,
|
|
1762
|
+
const [p, S] = M("main"), [L, U] = M(""), H = W(null), _ = Ce(() => L ? s.filter(
|
|
1763
|
+
(g) => g.label.toLowerCase().includes(L.toLowerCase()) || g.srcLang && g.srcLang.toLowerCase().includes(L.toLowerCase())
|
|
1764
|
+
) : s, [s, L]);
|
|
1754
1765
|
return /* @__PURE__ */ c(
|
|
1755
1766
|
lt,
|
|
1756
1767
|
{
|
|
1757
|
-
onClose:
|
|
1768
|
+
onClose: r,
|
|
1758
1769
|
align: "right",
|
|
1759
1770
|
maxHeight: m,
|
|
1760
|
-
className:
|
|
1771
|
+
className: x,
|
|
1761
1772
|
children: [
|
|
1762
1773
|
p === "main" && /* @__PURE__ */ c("div", { className: "animate-in slide-in-from-left-4 fade-in duration-200 flex flex-col h-full", children: [
|
|
1763
1774
|
/* @__PURE__ */ e(
|
|
@@ -1770,7 +1781,7 @@ const st = (s, t = 200) => {
|
|
|
1770
1781
|
),
|
|
1771
1782
|
/* @__PURE__ */ c("div", { className: "px-1.5 pb-2 shrink-0", children: [
|
|
1772
1783
|
/* @__PURE__ */ e(
|
|
1773
|
-
|
|
1784
|
+
P,
|
|
1774
1785
|
{
|
|
1775
1786
|
label: "Upload Subtitle",
|
|
1776
1787
|
icon: /* @__PURE__ */ e(Hi, { className: "w-4 h-4" }),
|
|
@@ -1794,7 +1805,7 @@ const st = (s, t = 200) => {
|
|
|
1794
1805
|
}
|
|
1795
1806
|
),
|
|
1796
1807
|
/* @__PURE__ */ e(
|
|
1797
|
-
|
|
1808
|
+
P,
|
|
1798
1809
|
{
|
|
1799
1810
|
label: "Customize",
|
|
1800
1811
|
icon: /* @__PURE__ */ e(Zt, { className: "w-4 h-4" }),
|
|
@@ -1804,12 +1815,12 @@ const st = (s, t = 200) => {
|
|
|
1804
1815
|
),
|
|
1805
1816
|
/* @__PURE__ */ e("div", { className: "h-px bg-white/5 mx-2 my-1" }),
|
|
1806
1817
|
/* @__PURE__ */ e(
|
|
1807
|
-
|
|
1818
|
+
P,
|
|
1808
1819
|
{
|
|
1809
1820
|
label: "Off",
|
|
1810
1821
|
active: t === -1,
|
|
1811
1822
|
onClick: () => {
|
|
1812
|
-
i(-1),
|
|
1823
|
+
i(-1), r();
|
|
1813
1824
|
}
|
|
1814
1825
|
}
|
|
1815
1826
|
),
|
|
@@ -1819,7 +1830,7 @@ const st = (s, t = 200) => {
|
|
|
1819
1830
|
{
|
|
1820
1831
|
type: "text",
|
|
1821
1832
|
placeholder: "Search subtitles...",
|
|
1822
|
-
value:
|
|
1833
|
+
value: L,
|
|
1823
1834
|
onChange: (g) => U(g.target.value),
|
|
1824
1835
|
className: "w-full bg-zinc-800/50 border border-white/10 rounded-md py-1.5 pl-8 pr-3 text-xs text-zinc-200 focus:outline-none focus:border-white/20 transition-colors"
|
|
1825
1836
|
}
|
|
@@ -1828,23 +1839,23 @@ const st = (s, t = 200) => {
|
|
|
1828
1839
|
] })
|
|
1829
1840
|
] }),
|
|
1830
1841
|
/* @__PURE__ */ c("div", { className: "overflow-y-auto hide-scrollbar flex-1", children: [
|
|
1831
|
-
|
|
1842
|
+
_.map((g) => {
|
|
1832
1843
|
let Y = null;
|
|
1833
1844
|
return g.status === "loading" ? Y = /* @__PURE__ */ e(De, { className: "w-3.5 h-3.5 animate-spin text-[var(--accent)]" }) : g.status === "error" ? Y = /* @__PURE__ */ e(bs, { className: "w-3.5 h-3.5 text-red-500" }) : g.status === "success" && (Y = /* @__PURE__ */ e(ii, { className: "w-3.5 h-3.5 text-emerald-500" })), /* @__PURE__ */ e(
|
|
1834
|
-
|
|
1845
|
+
P,
|
|
1835
1846
|
{
|
|
1836
1847
|
label: g.label,
|
|
1837
1848
|
value: g.srcLang,
|
|
1838
1849
|
active: t === g.index,
|
|
1839
1850
|
rightIcon: Y,
|
|
1840
1851
|
onClick: () => {
|
|
1841
|
-
i(g.index),
|
|
1852
|
+
i(g.index), r();
|
|
1842
1853
|
}
|
|
1843
1854
|
},
|
|
1844
1855
|
g.index
|
|
1845
1856
|
);
|
|
1846
1857
|
}),
|
|
1847
|
-
|
|
1858
|
+
_.length === 0 && L && /* @__PURE__ */ e("div", { className: "px-4 py-3 text-center text-xs text-zinc-500", children: "No results found" })
|
|
1848
1859
|
] })
|
|
1849
1860
|
] }),
|
|
1850
1861
|
p === "customize" && /* @__PURE__ */ c("div", { className: "animate-in slide-in-from-right-4 fade-in duration-200", children: [
|
|
@@ -1877,29 +1888,29 @@ const st = (s, t = 200) => {
|
|
|
1877
1888
|
/* @__PURE__ */ c(pe, { title: "Sync & Position", children: [
|
|
1878
1889
|
/* @__PURE__ */ c("div", { className: "py-2.5 px-3 rounded-lg hover:bg-white/5 group transition-colors", children: [
|
|
1879
1890
|
/* @__PURE__ */ e("div", { className: "flex justify-between items-center mb-2", children: /* @__PURE__ */ c("div", { className: "flex items-center gap-3", children: [
|
|
1880
|
-
/* @__PURE__ */ e(
|
|
1891
|
+
/* @__PURE__ */ e(qi, { className: "w-4 h-4 text-zinc-500 group-hover:text-zinc-400 transition-colors" }),
|
|
1881
1892
|
/* @__PURE__ */ e("span", { className: "text-xs font-bold text-zinc-400 uppercase tracking-wider group-hover:text-zinc-300 transition-colors", children: "Sync Offset" })
|
|
1882
1893
|
] }) }),
|
|
1883
1894
|
/* @__PURE__ */ c("div", { className: "flex items-center gap-2", children: [
|
|
1884
1895
|
/* @__PURE__ */ e(
|
|
1885
1896
|
"button",
|
|
1886
1897
|
{
|
|
1887
|
-
onClick: () => b(Math.round((
|
|
1898
|
+
onClick: () => b(Math.round((v - 0.1) * 10) / 10),
|
|
1888
1899
|
className: "w-8 h-8 flex items-center justify-center bg-zinc-800 rounded-lg hover:bg-zinc-700 text-zinc-300 transition-colors active:scale-95",
|
|
1889
|
-
children: /* @__PURE__ */ e(
|
|
1900
|
+
children: /* @__PURE__ */ e(Gi, { className: "w-4 h-4" })
|
|
1890
1901
|
}
|
|
1891
1902
|
),
|
|
1892
1903
|
/* @__PURE__ */ c("div", { className: "flex-1 bg-zinc-900 border border-white/5 rounded-lg h-8 flex items-center justify-center text-xs font-mono font-medium text-[var(--accent)]", children: [
|
|
1893
|
-
|
|
1894
|
-
(
|
|
1904
|
+
v > 0 ? "+" : "",
|
|
1905
|
+
(v == null ? void 0 : v.toFixed(1)) || "0.0",
|
|
1895
1906
|
"s"
|
|
1896
1907
|
] }),
|
|
1897
1908
|
/* @__PURE__ */ e(
|
|
1898
1909
|
"button",
|
|
1899
1910
|
{
|
|
1900
|
-
onClick: () => b(Math.round((
|
|
1911
|
+
onClick: () => b(Math.round((v + 0.1) * 10) / 10),
|
|
1901
1912
|
className: "w-8 h-8 flex items-center justify-center bg-zinc-800 rounded-lg hover:bg-zinc-700 text-zinc-300 transition-colors active:scale-95",
|
|
1902
|
-
children: /* @__PURE__ */ e(
|
|
1913
|
+
children: /* @__PURE__ */ e(_i, { className: "w-4 h-4" })
|
|
1903
1914
|
}
|
|
1904
1915
|
)
|
|
1905
1916
|
] })
|
|
@@ -2049,25 +2060,25 @@ const st = (s, t = 200) => {
|
|
|
2049
2060
|
]
|
|
2050
2061
|
}
|
|
2051
2062
|
);
|
|
2052
|
-
}, nt = ({ content: s }) => typeof s == "string" ? s.trim().startsWith("<") ? /* @__PURE__ */ e("span", { dangerouslySetInnerHTML: { __html: s } }) : /* @__PURE__ */ e("span", { children: s }) : /* @__PURE__ */ e(Q, { children: s }), ks = ({ x: s, y: t, items: i, onClose: o, containerWidth:
|
|
2053
|
-
const h = W(null), [f,
|
|
2063
|
+
}, nt = ({ content: s }) => typeof s == "string" ? s.trim().startsWith("<") ? /* @__PURE__ */ e("span", { dangerouslySetInnerHTML: { __html: s } }) : /* @__PURE__ */ e("span", { children: s }) : /* @__PURE__ */ e(Q, { children: s }), ks = ({ x: s, y: t, items: i, onClose: o, containerWidth: r, containerHeight: u }) => {
|
|
2064
|
+
const h = W(null), [f, v] = M({
|
|
2054
2065
|
top: t,
|
|
2055
2066
|
left: s,
|
|
2056
2067
|
opacity: 0
|
|
2057
2068
|
});
|
|
2058
2069
|
return Be(() => {
|
|
2059
2070
|
if (!h.current) return;
|
|
2060
|
-
const b = h.current.getBoundingClientRect(), m = b.width,
|
|
2071
|
+
const b = h.current.getBoundingClientRect(), m = b.width, x = b.height;
|
|
2061
2072
|
let p = s, S = t;
|
|
2062
|
-
s + m >
|
|
2063
|
-
let
|
|
2064
|
-
S < 10 && (S = 10), S +
|
|
2073
|
+
s + m > r - 10 && (p = s - m), p < 10 && (p = 10), p + m > r && (p = Math.max(10, r - m - 10)), t + x > u - 10 && (S = t - x);
|
|
2074
|
+
let L = u - 20;
|
|
2075
|
+
S < 10 && (S = 10), S + x > u - 10 && (S = Math.max(10, u - x - 10)), v({
|
|
2065
2076
|
top: S,
|
|
2066
2077
|
left: p,
|
|
2067
|
-
maxHeight:
|
|
2078
|
+
maxHeight: L,
|
|
2068
2079
|
opacity: 1
|
|
2069
2080
|
});
|
|
2070
|
-
}, [s, t, i,
|
|
2081
|
+
}, [s, t, i, r, u]), ee(() => {
|
|
2071
2082
|
const b = (m) => {
|
|
2072
2083
|
h.current && !h.current.contains(m.target) && o();
|
|
2073
2084
|
};
|
|
@@ -2113,8 +2124,8 @@ const st = (s, t = 200) => {
|
|
|
2113
2124
|
}, Ss = ({ player: s, onClose: t }) => {
|
|
2114
2125
|
const [i, o] = M({});
|
|
2115
2126
|
return ee(() => {
|
|
2116
|
-
const
|
|
2117
|
-
var
|
|
2127
|
+
const r = () => {
|
|
2128
|
+
var v;
|
|
2118
2129
|
if (!s.video) return;
|
|
2119
2130
|
const h = s.video, f = h.getVideoPlaybackQuality ? h.getVideoPlaybackQuality() : null;
|
|
2120
2131
|
o({
|
|
@@ -2125,12 +2136,12 @@ const st = (s, t = 200) => {
|
|
|
2125
2136
|
Volume: `${Math.round(h.volume * 100)}%`,
|
|
2126
2137
|
"Dropped Frames": f ? f.droppedVideoFrames : "N/A",
|
|
2127
2138
|
Buffer: h.buffered.length > 0 ? `${(h.buffered.end(h.buffered.length - 1) - h.currentTime).toFixed(2)}s` : "0s",
|
|
2128
|
-
Engine: ((
|
|
2139
|
+
Engine: ((v = s.store.get().sources[s.store.get().currentSourceIndex]) == null ? void 0 : v.type) || "native",
|
|
2129
2140
|
URL: h.currentSrc
|
|
2130
2141
|
});
|
|
2131
2142
|
};
|
|
2132
|
-
|
|
2133
|
-
const u = setInterval(
|
|
2143
|
+
r();
|
|
2144
|
+
const u = setInterval(r, 1e3);
|
|
2134
2145
|
return () => clearInterval(u);
|
|
2135
2146
|
}, [s]), /* @__PURE__ */ e("div", { className: "absolute inset-0 z-[60] flex items-center justify-center bg-black/60 backdrop-blur-sm p-4 animate-in fade-in duration-200", children: /* @__PURE__ */ c(
|
|
2136
2147
|
"div",
|
|
@@ -2142,8 +2153,8 @@ const st = (s, t = 200) => {
|
|
|
2142
2153
|
/* @__PURE__ */ e(
|
|
2143
2154
|
"button",
|
|
2144
2155
|
{
|
|
2145
|
-
onClick: (
|
|
2146
|
-
|
|
2156
|
+
onClick: (r) => {
|
|
2157
|
+
r.stopPropagation(), t();
|
|
2147
2158
|
},
|
|
2148
2159
|
className: "absolute top-3 right-3 p-1.5 text-zinc-400 hover:text-white hover:bg-white/10 rounded-full transition-colors",
|
|
2149
2160
|
children: /* @__PURE__ */ e(ti, { className: "w-4 h-4" })
|
|
@@ -2151,10 +2162,10 @@ const st = (s, t = 200) => {
|
|
|
2151
2162
|
),
|
|
2152
2163
|
/* @__PURE__ */ e("h3", { className: "text-sm font-bold text-white mb-4 uppercase tracking-wider border-b border-white/10 pb-2", children: "Video Statistics" })
|
|
2153
2164
|
] }),
|
|
2154
|
-
/* @__PURE__ */ e("div", { className: "overflow-y-auto hide-scrollbar p-5 pt-0 space-y-2.5 flex-1 min-h-0", children: Object.entries(i).map(([
|
|
2155
|
-
/* @__PURE__ */ e("span", { className: "text-zinc-500 font-bold shrink-0", children:
|
|
2165
|
+
/* @__PURE__ */ e("div", { className: "overflow-y-auto hide-scrollbar p-5 pt-0 space-y-2.5 flex-1 min-h-0", children: Object.entries(i).map(([r, u]) => /* @__PURE__ */ c("div", { className: "flex flex-col sm:flex-row sm:justify-between sm:items-center gap-1", children: [
|
|
2166
|
+
/* @__PURE__ */ e("span", { className: "text-zinc-500 font-bold shrink-0", children: r }),
|
|
2156
2167
|
/* @__PURE__ */ e("span", { className: "text-zinc-200 truncate select-all font-medium bg-white/5 px-1.5 py-0.5 rounded break-all text-right", title: String(u), children: String(u) })
|
|
2157
|
-
] },
|
|
2168
|
+
] }, r)) })
|
|
2158
2169
|
]
|
|
2159
2170
|
}
|
|
2160
2171
|
) });
|
|
@@ -2179,30 +2190,30 @@ const Ns = [
|
|
|
2179
2190
|
{ label: "Hacker", value: "hacker", color: "#22c55e" }
|
|
2180
2191
|
], Qt = ({ content: s, className: t, style: i }) => typeof s == "string" ? s.trim().startsWith("<") ? /* @__PURE__ */ e("div", { className: t, style: i, dangerouslySetInnerHTML: { __html: s } }) : /* @__PURE__ */ e("div", { className: t, style: i, children: s }) : /* @__PURE__ */ e("div", { className: t, style: i, children: s }), Yt = (s) => {
|
|
2181
2192
|
var Dt, Ot;
|
|
2182
|
-
const { src: t, type: i, sources: o, poster:
|
|
2193
|
+
const { src: t, type: i, sources: o, poster: r, autoPlay: u, thumbnails: h, textTracks: f, plugins: v, onGetInstance: b, ...m } = s, x = m.screenshot ?? !1, p = m.pip ?? !0, S = m.setting ?? !0, L = m.fullscreen ?? !0, U = m.fullscreenWeb ?? !1, H = m.lock ?? !1, _ = m.fastForward ?? !0, g = m.flip ?? !0, Y = m.aspectRatio ?? !0, q = m.hotKey ?? !0, fe = m.backdrop ?? !0, k = m.gestureSeek ?? !1, j = m.centerControls ?? !0, D = m.fetchTimeout ?? 3e4;
|
|
2183
2194
|
m.autoOrientation;
|
|
2184
|
-
const T = W(null), [n, X] = M(null), [
|
|
2195
|
+
const T = W(null), [n, X] = M(null), [G, ne] = M(!1), [ae, be] = M(0), [ge, Te] = M(0), [We, je] = M(!1), ct = Ce(() => Kt(m), []), a = Ni(
|
|
2185
2196
|
Ve((d) => n ? n.store.subscribe(d) : () => {
|
|
2186
2197
|
}, [n]),
|
|
2187
2198
|
() => n ? n.store.get() : ct,
|
|
2188
2199
|
() => ct
|
|
2189
|
-
), si = Ce(() => Cs(
|
|
2190
|
-
|
|
2191
|
-
const [oe, ht] = M({ x: 0, y: 0, visible: !1 }), [ni, mt] = M(!1), pt = st(V, 300), ft = st(B, 300), ze = st(
|
|
2192
|
-
(V || B ||
|
|
2193
|
-
}, [V, B,
|
|
2200
|
+
), si = Ce(() => Cs(a.themeColor), [a.themeColor]), [V, dt] = M(!1), [B, ut] = M(!1), [J, A] = M("main"), [$, Ue] = M(null), qe = W(null);
|
|
2201
|
+
$ && (qe.current = $);
|
|
2202
|
+
const [oe, ht] = M({ x: 0, y: 0, visible: !1 }), [ni, mt] = M(!1), pt = st(V, 300), ft = st(B, 300), ze = st(!!$, 300), z = Ve(() => {
|
|
2203
|
+
(V || B || $ || oe.visible) && (dt(!1), ut(!1), Ue(null), ht((d) => ({ ...d, visible: !1 })));
|
|
2204
|
+
}, [V, B, $, oe.visible]);
|
|
2194
2205
|
ee(() => {
|
|
2195
2206
|
const d = (w) => {
|
|
2196
|
-
(V || B ||
|
|
2207
|
+
(V || B || $ || oe.visible) && z();
|
|
2197
2208
|
};
|
|
2198
|
-
return (V || B ||
|
|
2209
|
+
return (V || B || $ || oe.visible) && (document.addEventListener("click", d), document.addEventListener("touchstart", d)), () => {
|
|
2199
2210
|
document.removeEventListener("click", d), document.removeEventListener("touchstart", d);
|
|
2200
2211
|
};
|
|
2201
|
-
}, [V, B,
|
|
2202
|
-
const [
|
|
2212
|
+
}, [V, B, $, oe.visible, z]);
|
|
2213
|
+
const [Ge, Fe] = M(!1), [Ie, _e] = M(0), [oi, bt] = M(!1), [ri, gt] = M(!1), [Re, ve] = M(!1), [vt, Xe] = M(!1), [xt, wt] = M([]), [yt, kt] = M(null), [ai, li] = M(0), [ce, St] = M(null), [ue, Pe] = M(null), [Ts, Ct] = M(null), [Qe, Nt] = M(!1), Ye = W(null), Mt = W(1), we = W(null), Ee = W(null), Tt = W(0), zt = W(0), Ft = W(0), te = W(null), ye = W(!1), ke = W(null), de = W(null), Je = W(null), Ke = W(null), Se = W(null);
|
|
2203
2214
|
Be(() => {
|
|
2204
2215
|
n && T.current && n.attach(T.current);
|
|
2205
|
-
}, [n,
|
|
2216
|
+
}, [n, a.isWebFullscreen]), Be(() => {
|
|
2206
2217
|
if (!T.current) return;
|
|
2207
2218
|
(() => {
|
|
2208
2219
|
T.current && (be(T.current.clientHeight), Te(T.current.clientWidth));
|
|
@@ -2214,16 +2225,16 @@ const Ns = [
|
|
|
2214
2225
|
return w.observe(T.current), () => {
|
|
2215
2226
|
w.disconnect();
|
|
2216
2227
|
};
|
|
2217
|
-
}, [
|
|
2228
|
+
}, [a.isWebFullscreen]), ee(() => {
|
|
2218
2229
|
if (je("ontouchstart" in window || navigator.maxTouchPoints > 0), !T.current) return;
|
|
2219
|
-
const d = new
|
|
2220
|
-
return
|
|
2230
|
+
const d = new Li({ ...m, poster: r });
|
|
2231
|
+
return v && v.length > 0 && v.forEach((w) => d.use(w)), d.attach(T.current), X(d), b && b(d), () => {
|
|
2221
2232
|
d.destroy(), X(null);
|
|
2222
2233
|
};
|
|
2223
2234
|
}, []), ee(() => {
|
|
2224
2235
|
if (!n) return;
|
|
2225
2236
|
const d = {};
|
|
2226
|
-
m.theme !== void 0 && m.theme !==
|
|
2237
|
+
m.theme !== void 0 && m.theme !== a.theme && (d.theme = m.theme), m.themeColor !== void 0 && m.themeColor !== a.themeColor && (d.themeColor = m.themeColor), m.iconSize !== void 0 && m.iconSize !== a.iconSize && (d.iconSize = m.iconSize), m.brightness !== void 0 && Math.abs(m.brightness - a.brightness) > 0.05 && n.setBrightness(m.brightness), m.videoFit !== void 0 && m.videoFit !== a.videoFit && n.setVideoFit(m.videoFit), Object.keys(d).length > 0 && n.setAppearance(d), m.volume !== void 0 && Math.abs(m.volume - a.volume) > 0.01 && n.setVolume(m.volume), m.muted !== void 0 && m.muted !== a.isMuted && (m.muted ? n.video.muted = !0 : n.video.muted = !1);
|
|
2227
2238
|
}, [n, m.theme, m.themeColor, m.iconSize, m.volume, m.muted, m.brightness, m.videoFit]), ee(() => {
|
|
2228
2239
|
if (!n) return;
|
|
2229
2240
|
const d = f || [];
|
|
@@ -2233,17 +2244,17 @@ const Ns = [
|
|
|
2233
2244
|
n.pause(), n.store.setState({ isPlaying: !1, isBuffering: !1 }), n.notify({ type: "warning", message: "Autoplay blocked by browser. Click play to start.", duration: 5e3 });
|
|
2234
2245
|
});
|
|
2235
2246
|
}, [n, u]), ee(() => {
|
|
2236
|
-
|
|
2237
|
-
}, [
|
|
2238
|
-
h && n ?
|
|
2247
|
+
a.isPlaying && !G && ne(!0);
|
|
2248
|
+
}, [a.isPlaying, G]), ee(() => {
|
|
2249
|
+
h && n ? Pi(h, n.notify.bind(n), D).then((d) => wt(d)) : wt([]);
|
|
2239
2250
|
}, [h, n, D]), ee(() => (ue && (Se.current && clearTimeout(Se.current), Se.current = setTimeout(() => {
|
|
2240
|
-
|
|
2251
|
+
Pe(null);
|
|
2241
2252
|
}, 600)), () => {
|
|
2242
2253
|
Se.current && clearTimeout(Se.current);
|
|
2243
2254
|
}), [ue]), ee(() => {
|
|
2244
2255
|
const d = (w) => {
|
|
2245
2256
|
var N;
|
|
2246
|
-
if (!n || !
|
|
2257
|
+
if (!n || !q || ((N = document.activeElement) == null ? void 0 : N.tagName) === "INPUT") return;
|
|
2247
2258
|
switch (w.key.toLowerCase()) {
|
|
2248
2259
|
case " ":
|
|
2249
2260
|
case "k":
|
|
@@ -2273,18 +2284,18 @@ const Ns = [
|
|
|
2273
2284
|
}
|
|
2274
2285
|
};
|
|
2275
2286
|
return window.addEventListener("keydown", d), () => window.removeEventListener("keydown", d);
|
|
2276
|
-
}, [n,
|
|
2277
|
-
const
|
|
2278
|
-
n && (n.setControlsVisible(!0), de.current && clearTimeout(de.current), !(V || B ||
|
|
2279
|
-
!
|
|
2287
|
+
}, [n, q]);
|
|
2288
|
+
const It = () => {
|
|
2289
|
+
n && (n.setControlsVisible(!0), de.current && clearTimeout(de.current), !(V || B || $) && (de.current = setTimeout(() => {
|
|
2290
|
+
!a.isPlaying || V || B || $ || n.setControlsVisible(!1);
|
|
2280
2291
|
}, 2500)));
|
|
2281
2292
|
};
|
|
2282
2293
|
ee(() => {
|
|
2283
|
-
n && (!V && !B &&
|
|
2284
|
-
}, [V, B,
|
|
2285
|
-
const
|
|
2286
|
-
if (!(!
|
|
2287
|
-
if (V || B ||
|
|
2294
|
+
n && (!V && !B && !$ && a.isPlaying ? It() : (V || B || $) && (n.setControlsVisible(!0), de.current && clearTimeout(de.current)));
|
|
2295
|
+
}, [V, B, $, a.isPlaying, n]);
|
|
2296
|
+
const Rt = Ve(() => {
|
|
2297
|
+
if (!(!_ || !n || !a.isPlaying || a.isLocked)) {
|
|
2298
|
+
if (V || B || $) {
|
|
2288
2299
|
z();
|
|
2289
2300
|
return;
|
|
2290
2301
|
}
|
|
@@ -2292,85 +2303,85 @@ const Ns = [
|
|
|
2292
2303
|
n.video.playbackRate = 2, Nt(!0);
|
|
2293
2304
|
}, 500);
|
|
2294
2305
|
}
|
|
2295
|
-
}, [
|
|
2306
|
+
}, [_, n, a.isPlaying, a.isLocked, V, B, $]), Ze = Ve(() => {
|
|
2296
2307
|
Ye.current && clearTimeout(Ye.current), Qe && n && (n.video.playbackRate = Mt.current, Nt(!1));
|
|
2297
2308
|
}, [Qe, n]), ci = (d) => {
|
|
2298
|
-
if (
|
|
2309
|
+
if (Rt(), V || B || $) {
|
|
2299
2310
|
z();
|
|
2300
2311
|
return;
|
|
2301
2312
|
}
|
|
2302
|
-
|
|
2313
|
+
a.isLocked || (we.current = d.touches[0].clientX, Ee.current = d.touches[0].clientY, Tt.current = a.currentTime, zt.current = a.volume, Ft.current = a.brightness, ye.current = !1, te.current = null);
|
|
2303
2314
|
}, di = (d) => {
|
|
2304
|
-
var
|
|
2305
|
-
if (
|
|
2306
|
-
const w = d.touches[0].clientX, C = d.touches[0].clientY, N = w - we.current,
|
|
2307
|
-
if (!te.current && (Math.abs(N) > 10 || Math.abs(
|
|
2308
|
-
if (ye.current = !0, Ze(), Math.abs(N) > Math.abs(
|
|
2309
|
-
k && (te.current = "seek",
|
|
2315
|
+
var re, l;
|
|
2316
|
+
if (a.isLocked || !n || we.current === null || Ee.current === null) return;
|
|
2317
|
+
const w = d.touches[0].clientX, C = d.touches[0].clientY, N = w - we.current, R = C - Ee.current;
|
|
2318
|
+
if (!te.current && (Math.abs(N) > 10 || Math.abs(R) > 10))
|
|
2319
|
+
if (ye.current = !0, Ze(), Math.abs(N) > Math.abs(R))
|
|
2320
|
+
k && (te.current = "seek", Fe(!0));
|
|
2310
2321
|
else {
|
|
2311
|
-
const
|
|
2312
|
-
we.current <
|
|
2322
|
+
const I = T.current ? T.current.clientWidth / 2 : window.innerWidth / 2;
|
|
2323
|
+
we.current < I ? (te.current = "brightness", Xe(!0)) : (te.current = "volume", ve(!0));
|
|
2313
2324
|
}
|
|
2314
|
-
if (te.current === "seek" && T.current &&
|
|
2315
|
-
const
|
|
2316
|
-
|
|
2325
|
+
if (te.current === "seek" && T.current && a.duration) {
|
|
2326
|
+
const I = T.current.getBoundingClientRect(), O = N / I.width, F = Math.max(0, Math.min(a.duration, Tt.current + O * a.duration));
|
|
2327
|
+
_e(F);
|
|
2317
2328
|
} else if (te.current === "volume") {
|
|
2318
|
-
const O = -(
|
|
2329
|
+
const O = -(R / (((re = T.current) == null ? void 0 : re.clientHeight) || 300)) * 1.5;
|
|
2319
2330
|
n.setVolume(Math.max(0, Math.min(1, zt.current + O)));
|
|
2320
2331
|
} else if (te.current === "brightness") {
|
|
2321
|
-
const O = -(
|
|
2322
|
-
n.setBrightness(Math.max(0, Math.min(2,
|
|
2332
|
+
const O = -(R / (((l = T.current) == null ? void 0 : l.clientHeight) || 300)) * 1.5;
|
|
2333
|
+
n.setBrightness(Math.max(0, Math.min(2, Ft.current + O)));
|
|
2323
2334
|
}
|
|
2324
2335
|
}, ui = (d) => {
|
|
2325
|
-
Ze(), te.current === "seek" ? (n == null || n.seek(
|
|
2336
|
+
Ze(), te.current === "seek" ? (n == null || n.seek(Ie), Fe(!1)) : te.current === "volume" ? ve(!1) : te.current === "brightness" && Xe(!1), ye.current = !1, te.current = null, we.current = null, Ee.current = null;
|
|
2326
2337
|
}, et = (d) => {
|
|
2327
|
-
if (!Je.current || !
|
|
2338
|
+
if (!Je.current || !a.duration) return 0;
|
|
2328
2339
|
const w = Je.current.getBoundingClientRect(), C = "touches" in d ? d.touches[0].clientX : d.clientX;
|
|
2329
|
-
return Math.max(0, Math.min(1, (C - w.left) / w.width)) *
|
|
2330
|
-
},
|
|
2331
|
-
if (d.stopPropagation(),
|
|
2332
|
-
(V || B ||
|
|
2333
|
-
const w = (N) =>
|
|
2334
|
-
n == null || n.seek(et(N)),
|
|
2340
|
+
return Math.max(0, Math.min(1, (C - w.left) / w.width)) * a.duration;
|
|
2341
|
+
}, Pt = (d) => {
|
|
2342
|
+
if (d.stopPropagation(), a.isLocked) return;
|
|
2343
|
+
(V || B || $) && z(), Fe(!0), _e(et(d));
|
|
2344
|
+
const w = (N) => _e(et(N)), C = (N) => {
|
|
2345
|
+
n == null || n.seek(et(N)), Fe(!1), document.removeEventListener("mousemove", w), document.removeEventListener("touchmove", w), document.removeEventListener("mouseup", C), document.removeEventListener("touchend", C);
|
|
2335
2346
|
};
|
|
2336
2347
|
document.addEventListener("mousemove", w), document.addEventListener("touchmove", w), document.addEventListener("mouseup", C), document.addEventListener("touchend", C);
|
|
2337
|
-
},
|
|
2348
|
+
}, Et = (d) => {
|
|
2338
2349
|
if (!Ke.current) return 0;
|
|
2339
2350
|
const w = Ke.current.getBoundingClientRect(), C = "touches" in d ? d.touches[0].clientX : d.clientX;
|
|
2340
2351
|
return Math.max(0, Math.min(1, (C - w.left) / w.width));
|
|
2341
|
-
},
|
|
2342
|
-
if (d.stopPropagation(), !n ||
|
|
2343
|
-
bt(!0), n.setVolume(
|
|
2344
|
-
const w = (N) => n.setVolume(
|
|
2352
|
+
}, Lt = (d) => {
|
|
2353
|
+
if (d.stopPropagation(), !n || a.isLocked) return;
|
|
2354
|
+
bt(!0), n.setVolume(Et(d));
|
|
2355
|
+
const w = (N) => n.setVolume(Et(N)), C = () => {
|
|
2345
2356
|
bt(!1), document.removeEventListener("mousemove", w), document.removeEventListener("touchmove", w), document.removeEventListener("mouseup", C), document.removeEventListener("touchend", C);
|
|
2346
2357
|
};
|
|
2347
2358
|
document.addEventListener("mousemove", w), document.addEventListener("touchmove", w), document.addEventListener("mouseup", C), document.addEventListener("touchend", C);
|
|
2348
2359
|
}, hi = (d) => {
|
|
2349
|
-
if (!
|
|
2350
|
-
const w = d.currentTarget.getBoundingClientRect(), C = (d.clientX - w.left) / w.width, N = C *
|
|
2351
|
-
li(C * 100), kt(N), xt.length > 0 && St(xt.find((
|
|
2352
|
-
},
|
|
2353
|
-
!n ||
|
|
2360
|
+
if (!a.duration || a.isLive) return;
|
|
2361
|
+
const w = d.currentTarget.getBoundingClientRect(), C = (d.clientX - w.left) / w.width, N = C * a.duration;
|
|
2362
|
+
li(C * 100), kt(N), xt.length > 0 && St(xt.find((R) => N >= R.start && N < R.end) || null);
|
|
2363
|
+
}, Le = (d) => {
|
|
2364
|
+
!n || a.isLocked || (n.skip(d === "forward" ? 10 : -10), Ct(d), setTimeout(() => Ct(null), 300));
|
|
2354
2365
|
}, mi = (d) => {
|
|
2355
2366
|
if (!n) return;
|
|
2356
2367
|
if (ye.current) {
|
|
2357
2368
|
ye.current = !1;
|
|
2358
2369
|
return;
|
|
2359
2370
|
}
|
|
2360
|
-
if (V || B ||
|
|
2371
|
+
if (V || B || $ || oe.visible) {
|
|
2361
2372
|
z();
|
|
2362
2373
|
return;
|
|
2363
2374
|
}
|
|
2364
|
-
if (
|
|
2365
|
-
!
|
|
2366
|
-
}, 2500),
|
|
2367
|
-
const w = d.currentTarget.getBoundingClientRect(), C = d.clientX - w.left, N = w.width,
|
|
2368
|
-
ke.current ? (clearTimeout(ke.current), ke.current = null, C < N * 0.35 ? (
|
|
2375
|
+
if (Re && ve(!1), vt && Xe(!1), n.setControlsVisible(!0), de.current && clearTimeout(de.current), de.current = setTimeout(() => {
|
|
2376
|
+
!a.isPlaying || V || B || $ || n.setControlsVisible(!1);
|
|
2377
|
+
}, 2500), a.isLocked) return;
|
|
2378
|
+
const w = d.currentTarget.getBoundingClientRect(), C = d.clientX - w.left, N = w.width, R = Date.now();
|
|
2379
|
+
ke.current ? (clearTimeout(ke.current), ke.current = null, C < N * 0.35 ? (Le("rewind"), Pe({ type: "rewind", id: R })) : C > N * 0.65 ? (Le("forward"), Pe({ type: "forward", id: R })) : n.toggleFullscreen()) : ke.current = setTimeout(() => {
|
|
2369
2380
|
n.togglePlay(), ke.current = null;
|
|
2370
2381
|
}, 250);
|
|
2371
2382
|
}, pi = (d) => {
|
|
2372
2383
|
var C;
|
|
2373
|
-
if (d.preventDefault(), d.stopPropagation(),
|
|
2384
|
+
if (d.preventDefault(), d.stopPropagation(), a.isLocked) return;
|
|
2374
2385
|
z();
|
|
2375
2386
|
const w = (C = T.current) == null ? void 0 : C.getBoundingClientRect();
|
|
2376
2387
|
w && requestAnimationFrame(() => {
|
|
@@ -2381,13 +2392,13 @@ const Ns = [
|
|
|
2381
2392
|
});
|
|
2382
2393
|
});
|
|
2383
2394
|
}, fi = (d) => {
|
|
2384
|
-
if (d.stopPropagation(), z(),
|
|
2395
|
+
if (d.stopPropagation(), z(), Re) {
|
|
2385
2396
|
ve(!1);
|
|
2386
2397
|
return;
|
|
2387
2398
|
}
|
|
2388
2399
|
We ? ve(!0) : n == null || n.toggleMute();
|
|
2389
|
-
}, bi =
|
|
2390
|
-
switch (
|
|
2400
|
+
}, bi = a.isMuted || a.volume === 0 ? Ut : a.volume < 0.5 ? $i : jt, $e = Math.max(100, ae - 120), gi = () => {
|
|
2401
|
+
switch (a.iconSize) {
|
|
2391
2402
|
case "small":
|
|
2392
2403
|
return "w-4 h-4";
|
|
2393
2404
|
case "large":
|
|
@@ -2396,7 +2407,7 @@ const Ns = [
|
|
|
2396
2407
|
return "w-5 h-5";
|
|
2397
2408
|
}
|
|
2398
2409
|
}, vi = () => {
|
|
2399
|
-
switch (
|
|
2410
|
+
switch (a.iconSize) {
|
|
2400
2411
|
case "small":
|
|
2401
2412
|
return "p-2 min-w-[32px] min-h-[32px]";
|
|
2402
2413
|
case "large":
|
|
@@ -2405,7 +2416,7 @@ const Ns = [
|
|
|
2405
2416
|
return "p-2.5 min-w-[36px] min-h-[36px]";
|
|
2406
2417
|
}
|
|
2407
2418
|
}, ie = gi(), se = vi(), he = (() => {
|
|
2408
|
-
switch (
|
|
2419
|
+
switch (a.iconSize) {
|
|
2409
2420
|
case "small":
|
|
2410
2421
|
return {
|
|
2411
2422
|
playBtn: "w-14 h-14",
|
|
@@ -2428,7 +2439,7 @@ const Ns = [
|
|
|
2428
2439
|
skipIcon: "w-6 h-6"
|
|
2429
2440
|
};
|
|
2430
2441
|
}
|
|
2431
|
-
})(), xi = !
|
|
2442
|
+
})(), xi = !a.isLocked && (a.controlsVisible || !a.isPlaying || V || B || $ || oe.visible), $t = ri || oi || Re, Ae = fe ? "backdrop-blur-xl bg-black/80" : "bg-black/95", At = Ce(() => {
|
|
2432
2443
|
const d = [
|
|
2433
2444
|
{ id: "play", position: "left", index: 10, isBuiltIn: !0 },
|
|
2434
2445
|
{ id: "volume", position: "left", index: 20, isBuiltIn: !0 },
|
|
@@ -2441,11 +2452,11 @@ const Ns = [
|
|
|
2441
2452
|
{ id: "fullscreenWeb", position: "right", index: 110, isBuiltIn: !0 },
|
|
2442
2453
|
{ id: "fullscreen", position: "right", index: 120, isBuiltIn: !0 }
|
|
2443
2454
|
];
|
|
2444
|
-
m.controls && m.controls.forEach((
|
|
2445
|
-
const
|
|
2446
|
-
|
|
2455
|
+
m.controls && m.controls.forEach((R) => {
|
|
2456
|
+
const re = d.find((l) => l.id === R.id);
|
|
2457
|
+
re ? Object.assign(re, R) : d.push(R);
|
|
2447
2458
|
});
|
|
2448
|
-
const w =
|
|
2459
|
+
const w = a.sources[a.currentSourceIndex] || { url: t || "", type: i || "auto" }, C = w.type === "hls" || w.url.includes(".m3u8"), N = d.find((R) => R.id === "download");
|
|
2449
2460
|
return N && (C ? (N.children = [
|
|
2450
2461
|
{ html: "Download Format", isLabel: !0 },
|
|
2451
2462
|
{
|
|
@@ -2460,25 +2471,25 @@ const Ns = [
|
|
|
2460
2471
|
icon: /* @__PURE__ */ e(Zt, { className: "w-3.5 h-3.5" }),
|
|
2461
2472
|
onClick: () => n == null ? void 0 : n.download({ format: "mp4" })
|
|
2462
2473
|
}
|
|
2463
|
-
], N.onClick = void 0) : (N.children = void 0, N.onClick = (
|
|
2464
|
-
}, [m.controls,
|
|
2465
|
-
var w, C, N,
|
|
2474
|
+
], N.onClick = void 0) : (N.children = void 0, N.onClick = (R) => R.download())), d.filter((R) => !(R.id === "screenshot" && !x || R.id === "pip" && !p || R.id === "settings" && !S || R.id === "fullscreen" && !L || R.id === "fullscreenWeb" && !U)).sort((R, re) => R.index - re.index);
|
|
2475
|
+
}, [m.controls, x, p, S, L, U, a.currentSourceIndex, a.sources, t, i]), Vt = (d) => {
|
|
2476
|
+
var w, C, N, R, re;
|
|
2466
2477
|
if (!d.isBuiltIn) {
|
|
2467
|
-
const l = d.id || `ctrl-${d.index}`,
|
|
2478
|
+
const l = d.id || `ctrl-${d.index}`, I = $ === l, O = I || ze.isMounted && qe.current === l;
|
|
2468
2479
|
return /* @__PURE__ */ c("div", { className: "relative", children: [
|
|
2469
2480
|
/* @__PURE__ */ e(
|
|
2470
2481
|
"button",
|
|
2471
2482
|
{
|
|
2472
|
-
onMouseDown: (
|
|
2473
|
-
onTouchStart: (
|
|
2474
|
-
onClick: (
|
|
2475
|
-
if (
|
|
2476
|
-
const tt =
|
|
2483
|
+
onMouseDown: (F) => F.stopPropagation(),
|
|
2484
|
+
onTouchStart: (F) => F.stopPropagation(),
|
|
2485
|
+
onClick: (F) => {
|
|
2486
|
+
if (F.stopPropagation(), d.children) {
|
|
2487
|
+
const tt = I;
|
|
2477
2488
|
z(), tt || Ue(l);
|
|
2478
2489
|
} else
|
|
2479
2490
|
z(), d.click ? d.click(n) : d.onClick && d.onClick(n);
|
|
2480
2491
|
},
|
|
2481
|
-
className: `strata-control-btn transition-colors focus:outline-none flex items-center justify-center ${se} ${
|
|
2492
|
+
className: `strata-control-btn transition-colors focus:outline-none flex items-center justify-center ${se} ${I ? "text-[var(--accent)] bg-white/10" : "text-zinc-300 hover:text-white hover:bg-white/10"} ${d.className || ""}`,
|
|
2482
2493
|
style: { borderRadius: "var(--radius)", ...d.style },
|
|
2483
2494
|
title: d.tooltip,
|
|
2484
2495
|
children: /* @__PURE__ */ e(Qt, { content: d.html || "" })
|
|
@@ -2489,7 +2500,7 @@ const Ns = [
|
|
|
2489
2500
|
{
|
|
2490
2501
|
items: d.children,
|
|
2491
2502
|
onClose: z,
|
|
2492
|
-
maxHeight:
|
|
2503
|
+
maxHeight: $e,
|
|
2493
2504
|
className: `strata-backdrop ${Ae} ${ze.isVisible ? "opacity-100 translate-y-0 scale-100 animate-in fade-in zoom-in-95 duration-300" : "opacity-0 translate-y-2 scale-95 duration-300"}`
|
|
2494
2505
|
}
|
|
2495
2506
|
)
|
|
@@ -2499,7 +2510,7 @@ const Ns = [
|
|
|
2499
2510
|
case "play":
|
|
2500
2511
|
return /* @__PURE__ */ e("button", { onMouseDown: (l) => l.stopPropagation(), onTouchStart: (l) => l.stopPropagation(), onClick: (l) => {
|
|
2501
2512
|
l.stopPropagation(), z(), n == null || n.togglePlay();
|
|
2502
|
-
}, className: `strata-control-btn text-zinc-300 hover:text-white transition-colors hover:bg-white/10 focus:outline-none ${se}`, style: { borderRadius: "var(--radius)" }, children:
|
|
2513
|
+
}, className: `strata-control-btn text-zinc-300 hover:text-white transition-colors hover:bg-white/10 focus:outline-none ${se}`, style: { borderRadius: "var(--radius)" }, children: a.isPlaying ? /* @__PURE__ */ e(Wt, { className: `${ie} fill-current` }) : /* @__PURE__ */ e(Ht, { className: `${ie} fill-current` }) }, "play");
|
|
2503
2514
|
case "volume":
|
|
2504
2515
|
return /* @__PURE__ */ c(
|
|
2505
2516
|
"div",
|
|
@@ -2513,47 +2524,47 @@ const Ns = [
|
|
|
2513
2524
|
},
|
|
2514
2525
|
children: [
|
|
2515
2526
|
/* @__PURE__ */ e("button", { onMouseDown: (l) => l.stopPropagation(), onTouchStart: (l) => l.stopPropagation(), onClick: fi, className: `strata-control-btn text-zinc-300 hover:text-white hover:bg-white/10 focus:outline-none ${se}`, style: { borderRadius: "var(--radius)" }, children: /* @__PURE__ */ e(bi, { className: ie }) }),
|
|
2516
|
-
/* @__PURE__ */ e("div", { className: `relative h-8 flex items-center transition-all duration-300 ease-out overflow-hidden ${
|
|
2517
|
-
/* @__PURE__ */ e("div", { className: "w-full h-1 bg-white/20 overflow-hidden", style: { borderRadius: "var(--radius-full)" }, children: /* @__PURE__ */ e("div", { className: "h-full bg-white", style: { width: `${(
|
|
2518
|
-
/* @__PURE__ */ e("div", { className: "absolute h-3 w-3 bg-white shadow-md top-1/2 -translate-y-1/2 pointer-events-none", style: { left: `calc(${(
|
|
2527
|
+
/* @__PURE__ */ e("div", { className: `relative h-8 flex items-center transition-all duration-300 ease-out overflow-hidden ${$t ? "w-28 opacity-100 ml-1" : "w-0 opacity-0"}`, children: /* @__PURE__ */ c("div", { ref: Ke, className: "relative w-full h-full flex items-center cursor-pointer px-2", onMouseDown: Lt, onTouchStart: Lt, children: [
|
|
2528
|
+
/* @__PURE__ */ e("div", { className: "w-full h-1 bg-white/20 overflow-hidden", style: { borderRadius: "var(--radius-full)" }, children: /* @__PURE__ */ e("div", { className: "h-full bg-white", style: { width: `${(a.isMuted ? 0 : a.volume) * 100}%`, borderRadius: "var(--radius-full)" } }) }),
|
|
2529
|
+
/* @__PURE__ */ e("div", { className: "absolute h-3 w-3 bg-white shadow-md top-1/2 -translate-y-1/2 pointer-events-none", style: { left: `calc(${(a.isMuted ? 0 : a.volume) * 100}% * 0.85 + 4px)`, borderRadius: "var(--radius-full)" } })
|
|
2519
2530
|
] }) }),
|
|
2520
|
-
|
|
2531
|
+
$t && /* @__PURE__ */ e("div", { className: "strata-tooltip absolute bottom-full mb-2 px-1.5 py-0.5 rounded text-[10px] font-bold font-mono shadow-lg pointer-events-none whitespace-nowrap z-50 transform -translate-x-1/2", style: { left: `calc(52px + ${(a.isMuted ? 0 : a.volume) * 80}px)` }, children: a.isMuted ? "0%" : `${Math.round(a.volume * 100)}%` })
|
|
2521
2532
|
]
|
|
2522
2533
|
},
|
|
2523
2534
|
"volume"
|
|
2524
2535
|
);
|
|
2525
2536
|
case "time":
|
|
2526
|
-
return m.isLive ? /* @__PURE__ */ c("div", { className: "flex items-center gap-2 px-2 py-0.5 rounded-md border border-white/10", style: { backgroundColor: `${
|
|
2527
|
-
/* @__PURE__ */ e("div", { className: "w-2 h-2 rounded-full animate-pulse", style: { backgroundColor:
|
|
2528
|
-
/* @__PURE__ */ e("span", { className: "text-[10px] font-bold tracking-wider", style: { color:
|
|
2537
|
+
return m.isLive ? /* @__PURE__ */ c("div", { className: "flex items-center gap-2 px-2 py-0.5 rounded-md border border-white/10", style: { backgroundColor: `${a.themeColor}1a`, borderColor: `${a.themeColor}33` }, children: [
|
|
2538
|
+
/* @__PURE__ */ e("div", { className: "w-2 h-2 rounded-full animate-pulse", style: { backgroundColor: a.themeColor } }),
|
|
2539
|
+
/* @__PURE__ */ e("span", { className: "text-[10px] font-bold tracking-wider", style: { color: a.themeColor }, children: "LIVE" })
|
|
2529
2540
|
] }, "live") : /* @__PURE__ */ c("div", { className: "text-xs font-medium text-zinc-400 font-mono select-none hidden sm:block tabular-nums", children: [
|
|
2530
|
-
it(
|
|
2541
|
+
it(Ge ? Ie : a.currentTime),
|
|
2531
2542
|
" ",
|
|
2532
2543
|
/* @__PURE__ */ e("span", { className: "text-zinc-600", children: "/" }),
|
|
2533
2544
|
" ",
|
|
2534
|
-
it(
|
|
2545
|
+
it(a.duration)
|
|
2535
2546
|
] }, "time");
|
|
2536
2547
|
case "subtitle":
|
|
2537
2548
|
return /* @__PURE__ */ c("div", { className: "relative", children: [
|
|
2538
2549
|
/* @__PURE__ */ e("button", { onMouseDown: (l) => l.stopPropagation(), onTouchStart: (l) => l.stopPropagation(), onClick: (l) => {
|
|
2539
2550
|
l.stopPropagation();
|
|
2540
|
-
const
|
|
2541
|
-
z(),
|
|
2551
|
+
const I = B;
|
|
2552
|
+
z(), I || ut(!0);
|
|
2542
2553
|
}, className: `strata-control-btn transition-colors focus:outline-none ${se} ${B ? "text-[var(--accent)] bg-white/10" : "text-zinc-300 hover:text-white hover:bg-white/10"}`, style: { borderRadius: "var(--radius)" }, children: /* @__PURE__ */ e(Oi, { className: ie }) }),
|
|
2543
2554
|
ft.isMounted && /* @__PURE__ */ e(
|
|
2544
2555
|
ys,
|
|
2545
2556
|
{
|
|
2546
|
-
tracks:
|
|
2547
|
-
current:
|
|
2557
|
+
tracks: a.subtitleTracks,
|
|
2558
|
+
current: a.currentSubtitle,
|
|
2548
2559
|
onSelect: (l) => n == null ? void 0 : n.setSubtitle(l),
|
|
2549
2560
|
onUpload: (l) => n == null ? void 0 : n.addTextTrack(l, l.name),
|
|
2550
2561
|
onClose: z,
|
|
2551
|
-
settings:
|
|
2562
|
+
settings: a.subtitleSettings,
|
|
2552
2563
|
onSettingsChange: (l) => n == null ? void 0 : n.updateSubtitleSettings(l),
|
|
2553
2564
|
onReset: () => n == null ? void 0 : n.resetSubtitleSettings(),
|
|
2554
|
-
offset:
|
|
2565
|
+
offset: a.subtitleOffset,
|
|
2555
2566
|
onOffsetChange: (l) => n == null ? void 0 : n.setSubtitleOffset(l),
|
|
2556
|
-
maxHeight:
|
|
2567
|
+
maxHeight: $e,
|
|
2557
2568
|
animationClass: `strata-backdrop ${Ae} ${ft.isVisible ? "opacity-100 translate-y-0 scale-100 animate-in fade-in zoom-in-95 duration-300" : "opacity-0 translate-y-2 scale-95 duration-300"}`
|
|
2558
2569
|
}
|
|
2559
2570
|
)
|
|
@@ -2568,19 +2579,19 @@ const Ns = [
|
|
|
2568
2579
|
}, className: `strata-control-btn text-zinc-300 hover:text-white hover:bg-white/10 transition-colors hidden sm:block focus:outline-none ${se}`, style: { borderRadius: "var(--radius)" }, children: /* @__PURE__ */ e(Di, { className: ie }) }, "pip");
|
|
2569
2580
|
case "download":
|
|
2570
2581
|
if (d.children) {
|
|
2571
|
-
const l =
|
|
2582
|
+
const l = $ === "download-menu", I = l || ze.isMounted && qe.current === "download-menu";
|
|
2572
2583
|
return /* @__PURE__ */ c("div", { className: "relative", children: [
|
|
2573
2584
|
/* @__PURE__ */ e("button", { onMouseDown: (O) => O.stopPropagation(), onTouchStart: (O) => O.stopPropagation(), onClick: (O) => {
|
|
2574
2585
|
O.stopPropagation();
|
|
2575
|
-
const
|
|
2576
|
-
z(),
|
|
2586
|
+
const F = l;
|
|
2587
|
+
z(), F || Ue("download-menu");
|
|
2577
2588
|
}, className: `strata-control-btn transition-colors hidden sm:block focus:outline-none ${se} ${l ? "text-[var(--accent)] bg-white/10" : "text-zinc-300 hover:text-white hover:bg-white/10"}`, style: { borderRadius: "var(--radius)" }, children: /* @__PURE__ */ e(ot, { className: ie }) }),
|
|
2578
|
-
|
|
2589
|
+
I && /* @__PURE__ */ e(
|
|
2579
2590
|
Xt,
|
|
2580
2591
|
{
|
|
2581
2592
|
items: d.children,
|
|
2582
2593
|
onClose: z,
|
|
2583
|
-
maxHeight:
|
|
2594
|
+
maxHeight: $e,
|
|
2584
2595
|
className: `strata-backdrop ${Ae} ${ze.isVisible ? "opacity-100 translate-y-0 scale-100 animate-in fade-in zoom-in-95 duration-300" : "opacity-0 translate-y-2 scale-95 duration-300"}`
|
|
2585
2596
|
}
|
|
2586
2597
|
)
|
|
@@ -2592,40 +2603,40 @@ const Ns = [
|
|
|
2592
2603
|
case "fullscreen":
|
|
2593
2604
|
return /* @__PURE__ */ e("button", { onMouseDown: (l) => l.stopPropagation(), onTouchStart: (l) => l.stopPropagation(), onClick: (l) => {
|
|
2594
2605
|
l.stopPropagation(), z(), n == null || n.toggleFullscreen();
|
|
2595
|
-
}, className: `strata-control-btn text-zinc-300 hover:text-white hover:bg-white/10 rounded-lg transition-transform focus:outline-none ${se}`, style: { borderRadius: "var(--radius)" }, children:
|
|
2606
|
+
}, className: `strata-control-btn text-zinc-300 hover:text-white hover:bg-white/10 rounded-lg transition-transform focus:outline-none ${se}`, style: { borderRadius: "var(--radius)" }, children: a.isFullscreen || a.isWebFullscreen ? /* @__PURE__ */ e(Vi, { className: ie }) : /* @__PURE__ */ e(Ai, { className: ie }) }, "fs");
|
|
2596
2607
|
case "fullscreenWeb":
|
|
2597
2608
|
return /* @__PURE__ */ e("button", { onMouseDown: (l) => l.stopPropagation(), onTouchStart: (l) => l.stopPropagation(), onClick: (l) => {
|
|
2598
2609
|
l.stopPropagation(), z(), n == null || n.toggleWebFullscreen();
|
|
2599
|
-
}, className: `strata-control-btn text-zinc-300 hover:text-white hover:bg-white/10 hidden sm:block focus:outline-none ${se} ${
|
|
2610
|
+
}, className: `strata-control-btn text-zinc-300 hover:text-white hover:bg-white/10 hidden sm:block focus:outline-none ${se} ${a.isWebFullscreen ? "text-[var(--accent)]" : ""}`, style: { borderRadius: "var(--radius)" }, title: "Web Fullscreen", children: /* @__PURE__ */ e(ns, { className: ie }) }, "fsw");
|
|
2600
2611
|
case "settings":
|
|
2601
2612
|
return /* @__PURE__ */ c("div", { className: "relative", children: [
|
|
2602
2613
|
/* @__PURE__ */ e("button", { onMouseDown: (l) => l.stopPropagation(), onTouchStart: (l) => l.stopPropagation(), onClick: (l) => {
|
|
2603
2614
|
l.stopPropagation();
|
|
2604
|
-
const
|
|
2605
|
-
z(),
|
|
2615
|
+
const I = V;
|
|
2616
|
+
z(), I || (dt(!0), A("main"));
|
|
2606
2617
|
}, className: `strata-control-btn transition-all duration-300 focus:outline-none ${se} ${V ? "rotate-90 text-[var(--accent)] bg-white/10" : "text-zinc-300 hover:text-white hover:bg-white/10"}`, style: { borderRadius: "var(--radius)" }, children: /* @__PURE__ */ e(Bi, { className: ie }) }),
|
|
2607
|
-
pt.isMounted && /* @__PURE__ */ e(lt, { onClose: z, align: "right", maxHeight:
|
|
2618
|
+
pt.isMounted && /* @__PURE__ */ e(lt, { onClose: z, align: "right", maxHeight: $e, className: `strata-backdrop ${Ae} ${pt.isVisible ? "opacity-100 translate-y-0 scale-100 animate-in fade-in zoom-in-95 duration-300" : "opacity-0 translate-y-2 scale-95 duration-300"}`, children: /* @__PURE__ */ c("div", { className: "w-full", children: [
|
|
2608
2619
|
J === "main" && /* @__PURE__ */ c("div", { className: "animate-in slide-in-from-left-4 fade-in duration-200", children: [
|
|
2609
2620
|
/* @__PURE__ */ e("div", { className: "px-3 py-2 mb-1 border-b border-white/5 font-bold text-zinc-400 uppercase text-[11px] tracking-wider flex justify-between items-center bg-white/5 sticky top-0 z-10 backdrop-blur-md", style: { borderRadius: "var(--radius)" }, children: /* @__PURE__ */ e("span", { children: "Settings" }) }),
|
|
2610
|
-
|
|
2611
|
-
/* @__PURE__ */ e(
|
|
2621
|
+
a.sources.length > 1 && /* @__PURE__ */ c(Q, { children: [
|
|
2622
|
+
/* @__PURE__ */ e(P, { label: "Source", icon: /* @__PURE__ */ e(as, { className: "w-4 h-4" }), value: ((w = a.sources[a.currentSourceIndex]) == null ? void 0 : w.name) || `Source ${a.currentSourceIndex + 1}`, onClick: () => A("sources"), hasSubmenu: !0 }),
|
|
2612
2623
|
/* @__PURE__ */ e(me, {})
|
|
2613
2624
|
] }),
|
|
2614
|
-
/* @__PURE__ */ e(
|
|
2615
|
-
/* @__PURE__ */ e(
|
|
2616
|
-
/* @__PURE__ */ e(
|
|
2625
|
+
/* @__PURE__ */ e(P, { label: "Quality", icon: /* @__PURE__ */ e(ms, { className: "w-4 h-4" }), value: a.currentQuality === -1 ? "Auto" : `${(C = a.qualityLevels[a.currentQuality]) == null ? void 0 : C.height}p`, onClick: () => A("quality"), hasSubmenu: !0 }),
|
|
2626
|
+
/* @__PURE__ */ e(P, { label: "Speed", icon: /* @__PURE__ */ e(ds, { className: "w-4 h-4" }), value: `${a.playbackRate}x`, onClick: () => A("speed"), hasSubmenu: !0 }),
|
|
2627
|
+
/* @__PURE__ */ e(P, { label: "Audio", icon: /* @__PURE__ */ e(us, { className: "w-4 h-4" }), value: ((N = a.audioTracks[a.currentAudioTrack]) == null ? void 0 : N.label) || "Default", onClick: () => A("audio"), hasSubmenu: !0 }),
|
|
2617
2628
|
/* @__PURE__ */ e(me, {}),
|
|
2618
|
-
/* @__PURE__ */ e(
|
|
2619
|
-
Y && /* @__PURE__ */ e(
|
|
2620
|
-
g && /* @__PURE__ */ e(
|
|
2621
|
-
/* @__PURE__ */ e(
|
|
2629
|
+
/* @__PURE__ */ e(P, { label: "Video Fit", icon: /* @__PURE__ */ e(gs, { className: "w-4 h-4" }), value: a.videoFit === "none" ? "Default" : a.videoFit.charAt(0).toUpperCase() + a.videoFit.slice(1), onClick: () => A("videofit"), hasSubmenu: !0 }),
|
|
2630
|
+
Y && /* @__PURE__ */ e(P, { label: "Aspect Ratio", icon: /* @__PURE__ */ e(ls, { className: "w-4 h-4" }), value: a.aspectRatio, onClick: () => A("ratio"), hasSubmenu: !0 }),
|
|
2631
|
+
g && /* @__PURE__ */ e(P, { label: "Flip", icon: /* @__PURE__ */ e(ps, { className: "w-4 h-4" }), value: a.flipState.horizontal ? "H" : a.flipState.vertical ? "V" : "Normal", onClick: () => A("flip"), hasSubmenu: !0 }),
|
|
2632
|
+
/* @__PURE__ */ e(P, { label: "Audio Boost", icon: /* @__PURE__ */ e(cs, { className: "w-4 h-4" }), value: a.audioGain > 1 ? `${a.audioGain}x` : "Off", onClick: () => A("boost"), hasSubmenu: !0 }),
|
|
2622
2633
|
/* @__PURE__ */ e(me, {}),
|
|
2623
|
-
/* @__PURE__ */ e(
|
|
2624
|
-
/* @__PURE__ */ e(
|
|
2634
|
+
/* @__PURE__ */ e(P, { label: "Watch Party", icon: /* @__PURE__ */ e(Ui, { className: "w-4 h-4" }), onClick: () => A("party"), hasSubmenu: !0 }),
|
|
2635
|
+
/* @__PURE__ */ e(P, { label: "Cast to Device", icon: /* @__PURE__ */ e(ji, { className: "w-4 h-4" }), onClick: () => {
|
|
2625
2636
|
n == null || n.requestCast(), z();
|
|
2626
2637
|
} }),
|
|
2627
2638
|
m.settings && m.settings.length > 0 && /* @__PURE__ */ e(me, {}),
|
|
2628
|
-
(
|
|
2639
|
+
(R = m.settings) == null ? void 0 : R.map((l, I) => l.switch !== void 0 ? /* @__PURE__ */ e("div", { className: "px-1", children: /* @__PURE__ */ e(
|
|
2629
2640
|
le,
|
|
2630
2641
|
{
|
|
2631
2642
|
label: l.html,
|
|
@@ -2636,39 +2647,39 @@ const Ns = [
|
|
|
2636
2647
|
l.onSwitch && l.onSwitch(l, O);
|
|
2637
2648
|
}
|
|
2638
2649
|
}
|
|
2639
|
-
) }, `cust-${
|
|
2640
|
-
|
|
2650
|
+
) }, `cust-${I}`) : /* @__PURE__ */ e(
|
|
2651
|
+
P,
|
|
2641
2652
|
{
|
|
2642
2653
|
label: l.html,
|
|
2643
2654
|
icon: l.icon,
|
|
2644
2655
|
value: l.currentLabel || l.value,
|
|
2645
2656
|
hasSubmenu: !!l.children,
|
|
2646
2657
|
onClick: () => {
|
|
2647
|
-
l.children ? A(`custom-${
|
|
2658
|
+
l.children ? A(`custom-${I}`) : (l.click ? l.click(l) : l.onClick && l.onClick(l), z());
|
|
2648
2659
|
}
|
|
2649
2660
|
},
|
|
2650
|
-
`cust-${
|
|
2661
|
+
`cust-${I}`
|
|
2651
2662
|
)),
|
|
2652
2663
|
/* @__PURE__ */ e(me, {}),
|
|
2653
|
-
/* @__PURE__ */ e(
|
|
2664
|
+
/* @__PURE__ */ e(P, { label: "Appearance", icon: /* @__PURE__ */ e(ei, { className: "w-4 h-4" }), onClick: () => A("appearance"), hasSubmenu: !0 })
|
|
2654
2665
|
] }),
|
|
2655
2666
|
J.startsWith("custom-") && (() => {
|
|
2656
2667
|
var O;
|
|
2657
|
-
const l = parseInt(J.split("-")[1]),
|
|
2658
|
-
return !
|
|
2659
|
-
/* @__PURE__ */ e(Z, { label:
|
|
2660
|
-
|
|
2661
|
-
|
|
2662
|
-
|
|
2663
|
-
!
|
|
2664
|
-
|
|
2668
|
+
const l = parseInt(J.split("-")[1]), I = (O = m.settings) == null ? void 0 : O[l];
|
|
2669
|
+
return !I || !I.children ? null : /* @__PURE__ */ c("div", { className: "animate-in slide-in-from-right-4 fade-in duration-200", children: [
|
|
2670
|
+
/* @__PURE__ */ e(Z, { label: I.html || "Menu", onBack: () => A("main") }),
|
|
2671
|
+
I.children.map((F, tt) => /* @__PURE__ */ c(Me.Fragment, { children: [
|
|
2672
|
+
F.separator && /* @__PURE__ */ e(me, {}),
|
|
2673
|
+
F.switch !== void 0 && /* @__PURE__ */ e("div", { className: "px-1", children: /* @__PURE__ */ e(le, { label: F.html, checked: F.switch, onChange: (ki) => F.onSwitch && F.onSwitch(F, ki) }) }),
|
|
2674
|
+
!F.separator && F.switch === void 0 && /* @__PURE__ */ e(
|
|
2675
|
+
P,
|
|
2665
2676
|
{
|
|
2666
|
-
label:
|
|
2667
|
-
icon:
|
|
2668
|
-
value:
|
|
2669
|
-
active:
|
|
2677
|
+
label: F.html,
|
|
2678
|
+
icon: F.icon,
|
|
2679
|
+
value: F.value,
|
|
2680
|
+
active: F.active,
|
|
2670
2681
|
onClick: () => {
|
|
2671
|
-
|
|
2682
|
+
F.onClick ? F.onClick(F) : F.click && F.click(F), z();
|
|
2672
2683
|
}
|
|
2673
2684
|
}
|
|
2674
2685
|
)
|
|
@@ -2678,62 +2689,62 @@ const Ns = [
|
|
|
2678
2689
|
["speed", "quality", "audio", "boost", "party", "appearance", "sources", "flip", "ratio", "videofit"].includes(J) && /* @__PURE__ */ c("div", { className: "animate-in slide-in-from-right-4 fade-in duration-200", children: [
|
|
2679
2690
|
J === "sources" && /* @__PURE__ */ c(Q, { children: [
|
|
2680
2691
|
/* @__PURE__ */ e(Z, { label: "Select Source", onBack: () => A("main") }),
|
|
2681
|
-
|
|
2682
|
-
const O =
|
|
2692
|
+
a.sources.map((l, I) => {
|
|
2693
|
+
const O = a.sourceStatuses[I], F = O === "success" ? /* @__PURE__ */ e(hs, { className: "w-3.5 h-3.5 text-emerald-500" }) : O === "error" ? /* @__PURE__ */ e(rt, { className: "w-3.5 h-3.5 text-red-500" }) : null;
|
|
2683
2694
|
return /* @__PURE__ */ e(
|
|
2684
|
-
|
|
2695
|
+
P,
|
|
2685
2696
|
{
|
|
2686
|
-
label: l.name || `Source ${
|
|
2697
|
+
label: l.name || `Source ${I + 1}`,
|
|
2687
2698
|
value: l.type,
|
|
2688
|
-
active:
|
|
2689
|
-
rightIcon:
|
|
2690
|
-
onClick: () => n == null ? void 0 : n.switchSource(
|
|
2699
|
+
active: a.currentSourceIndex === I,
|
|
2700
|
+
rightIcon: F,
|
|
2701
|
+
onClick: () => n == null ? void 0 : n.switchSource(I)
|
|
2691
2702
|
},
|
|
2692
|
-
|
|
2703
|
+
I
|
|
2693
2704
|
);
|
|
2694
2705
|
})
|
|
2695
2706
|
] }),
|
|
2696
2707
|
J === "speed" && /* @__PURE__ */ c(Q, { children: [
|
|
2697
2708
|
/* @__PURE__ */ e(Z, { label: "Speed", onBack: () => A("main") }),
|
|
2698
|
-
[0.5, 1, 1.5, 2].map((l) => /* @__PURE__ */ e(
|
|
2709
|
+
[0.5, 1, 1.5, 2].map((l) => /* @__PURE__ */ e(P, { label: `${l}x`, active: a.playbackRate === l, onClick: () => n.video.playbackRate = l }, l))
|
|
2699
2710
|
] }),
|
|
2700
2711
|
J === "quality" && /* @__PURE__ */ c(Q, { children: [
|
|
2701
2712
|
/* @__PURE__ */ e(Z, { label: "Quality", onBack: () => A("main") }),
|
|
2702
|
-
/* @__PURE__ */ e(
|
|
2703
|
-
|
|
2713
|
+
/* @__PURE__ */ e(P, { label: "Auto", active: a.currentQuality === -1, onClick: () => n == null ? void 0 : n.setQuality(-1) }),
|
|
2714
|
+
a.qualityLevels.map((l) => /* @__PURE__ */ e(P, { label: `${l.height}p`, value: `${Math.round(l.bitrate / 1e3)}k`, active: a.currentQuality === l.index, onClick: () => n == null ? void 0 : n.setQuality(l.index) }, l.index))
|
|
2704
2715
|
] }),
|
|
2705
2716
|
J === "audio" && /* @__PURE__ */ c(Q, { children: [
|
|
2706
2717
|
/* @__PURE__ */ e(Z, { label: "Audio Track", onBack: () => A("main") }),
|
|
2707
|
-
|
|
2708
|
-
|
|
2718
|
+
a.audioTracks.length === 0 && /* @__PURE__ */ e("div", { className: "px-4 py-3 text-zinc-500 text-xs text-center", children: "No tracks available" }),
|
|
2719
|
+
a.audioTracks.map((l) => /* @__PURE__ */ e(P, { label: l.label, value: l.language, active: a.currentAudioTrack === l.index, onClick: () => n == null ? void 0 : n.setAudioTrack(l.index) }, l.index))
|
|
2709
2720
|
] }),
|
|
2710
2721
|
J === "boost" && /* @__PURE__ */ c(Q, { children: [
|
|
2711
2722
|
/* @__PURE__ */ e(Z, { label: "Audio Boost", onBack: () => A("main") }),
|
|
2712
|
-
[1, 1.5, 2, 3].map((l) => /* @__PURE__ */ e(
|
|
2723
|
+
[1, 1.5, 2, 3].map((l) => /* @__PURE__ */ e(P, { label: l === 1 ? "Off" : `${l}x`, active: a.audioGain === l, onClick: () => n == null ? void 0 : n.setAudioGain(l) }, l))
|
|
2713
2724
|
] }),
|
|
2714
2725
|
J === "flip" && /* @__PURE__ */ c(Q, { children: [
|
|
2715
2726
|
/* @__PURE__ */ e(Z, { label: "Video Flip", onBack: () => A("main") }),
|
|
2716
2727
|
/* @__PURE__ */ c("div", { className: "p-2 space-y-1", children: [
|
|
2717
|
-
/* @__PURE__ */ e(le, { label: "Horizontal Flip", checked:
|
|
2718
|
-
/* @__PURE__ */ e(le, { label: "Vertical Flip", checked:
|
|
2728
|
+
/* @__PURE__ */ e(le, { label: "Horizontal Flip", checked: a.flipState.horizontal, onChange: () => n == null ? void 0 : n.setFlip("horizontal") }),
|
|
2729
|
+
/* @__PURE__ */ e(le, { label: "Vertical Flip", checked: a.flipState.vertical, onChange: () => n == null ? void 0 : n.setFlip("vertical") })
|
|
2719
2730
|
] })
|
|
2720
2731
|
] }),
|
|
2721
2732
|
J === "ratio" && /* @__PURE__ */ c(Q, { children: [
|
|
2722
2733
|
/* @__PURE__ */ e(Z, { label: "Aspect Ratio", onBack: () => A("main") }),
|
|
2723
|
-
/* @__PURE__ */ e("div", { className: "max-h-[250px] overflow-y-auto hide-scrollbar", children: ["default", "16:9", "4:3", "21:9", "18:9", "1:1", "9:16"].map((l) => /* @__PURE__ */ e(
|
|
2734
|
+
/* @__PURE__ */ e("div", { className: "max-h-[250px] overflow-y-auto hide-scrollbar", children: ["default", "16:9", "4:3", "21:9", "18:9", "1:1", "9:16"].map((l) => /* @__PURE__ */ e(P, { label: l === "default" ? "Default" : l.replace(":", " : "), active: a.aspectRatio === l, onClick: () => n == null ? void 0 : n.setAspectRatio(l) }, l)) })
|
|
2724
2735
|
] }),
|
|
2725
2736
|
J === "videofit" && /* @__PURE__ */ c(Q, { children: [
|
|
2726
2737
|
/* @__PURE__ */ e(Z, { label: "Video Fit", onBack: () => A("main") }),
|
|
2727
|
-
/* @__PURE__ */ e(
|
|
2728
|
-
/* @__PURE__ */ e(
|
|
2729
|
-
/* @__PURE__ */ e(
|
|
2730
|
-
/* @__PURE__ */ e(
|
|
2738
|
+
/* @__PURE__ */ e(P, { label: "Contain (Default)", value: "Fit", active: a.videoFit === "contain", onClick: () => n == null ? void 0 : n.setVideoFit("contain") }),
|
|
2739
|
+
/* @__PURE__ */ e(P, { label: "Cover", value: "Zoom", active: a.videoFit === "cover", onClick: () => n == null ? void 0 : n.setVideoFit("cover") }),
|
|
2740
|
+
/* @__PURE__ */ e(P, { label: "Fill", value: "Stretch", active: a.videoFit === "fill", onClick: () => n == null ? void 0 : n.setVideoFit("fill") }),
|
|
2741
|
+
/* @__PURE__ */ e(P, { label: "None", value: "Original", active: a.videoFit === "none", onClick: () => n == null ? void 0 : n.setVideoFit("none") })
|
|
2731
2742
|
] }),
|
|
2732
2743
|
J === "party" && /* @__PURE__ */ c(Q, { children: [
|
|
2733
2744
|
/* @__PURE__ */ e(Z, { label: "Watch Party", onBack: () => A("main") }),
|
|
2734
2745
|
/* @__PURE__ */ c("div", { className: "p-4 space-y-3", children: [
|
|
2735
2746
|
/* @__PURE__ */ e("p", { className: "text-xs text-zinc-400 leading-relaxed", children: "Create a synchronized room on WatchParty.me to watch together." }),
|
|
2736
|
-
/* @__PURE__ */ e("a", { href: `https://www.watchparty.me/create?video=${encodeURIComponent(((
|
|
2747
|
+
/* @__PURE__ */ e("a", { href: `https://www.watchparty.me/create?video=${encodeURIComponent(((re = a.sources[a.currentSourceIndex]) == null ? void 0 : re.url) || t || "")}`, target: "_blank", rel: "noopener noreferrer", className: "flex items-center justify-center w-full py-2.5 bg-[var(--accent)] hover:opacity-90 text-white font-medium transition-opacity text-xs", style: { borderRadius: "var(--radius)" }, children: "Create Room" })
|
|
2737
2748
|
] })
|
|
2738
2749
|
] }),
|
|
2739
2750
|
J === "appearance" && /* @__PURE__ */ c(Q, { children: [
|
|
@@ -2743,8 +2754,8 @@ const Ns = [
|
|
|
2743
2754
|
xe,
|
|
2744
2755
|
{
|
|
2745
2756
|
label: "Brightness",
|
|
2746
|
-
icon: /* @__PURE__ */ e(
|
|
2747
|
-
value:
|
|
2757
|
+
icon: /* @__PURE__ */ e(qt, { className: "w-4 h-4" }),
|
|
2758
|
+
value: a.brightness,
|
|
2748
2759
|
min: 0,
|
|
2749
2760
|
max: 2,
|
|
2750
2761
|
step: 0.1,
|
|
@@ -2752,14 +2763,14 @@ const Ns = [
|
|
|
2752
2763
|
formatValue: (l) => `${Math.round(l * 100)}%`
|
|
2753
2764
|
}
|
|
2754
2765
|
) }),
|
|
2755
|
-
/* @__PURE__ */ e(pe, { title: "Theme", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-2 gap-2 px-3", children: Ms.map((l) => /* @__PURE__ */ e("button", { onClick: () => n == null ? void 0 : n.setAppearance({ theme: l.value, themeColor: l.color }), className: `py-2 text-xs font-bold uppercase tracking-wide transition-colors border-[length:var(--border-width)] border-white/10 ${
|
|
2756
|
-
/* @__PURE__ */ e(pe, { title: "Icon Size", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-3 gap-1 px-3", children: ["small", "medium", "large"].map((l) => /* @__PURE__ */ e("button", { onClick: () => n == null ? void 0 : n.setAppearance({ iconSize: l }), className: `py-1.5 text-xs font-medium transition-colors ${
|
|
2766
|
+
/* @__PURE__ */ e(pe, { title: "Theme", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-2 gap-2 px-3", children: Ms.map((l) => /* @__PURE__ */ e("button", { onClick: () => n == null ? void 0 : n.setAppearance({ theme: l.value, themeColor: l.color }), className: `py-2 text-xs font-bold uppercase tracking-wide transition-colors border-[length:var(--border-width)] border-white/10 ${a.theme === l.value ? "bg-[var(--accent)] text-white" : "bg-white/5 text-zinc-400 hover:text-white"}`, style: { borderRadius: "var(--radius)" }, children: l.label }, l.value)) }) }),
|
|
2767
|
+
/* @__PURE__ */ e(pe, { title: "Icon Size", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-3 gap-1 px-3", children: ["small", "medium", "large"].map((l) => /* @__PURE__ */ e("button", { onClick: () => n == null ? void 0 : n.setAppearance({ iconSize: l }), className: `py-1.5 text-xs font-medium transition-colors ${a.iconSize === l ? "bg-white text-black" : "bg-white/5 text-zinc-400 hover:text-zinc-200"}`, style: { borderRadius: "var(--radius)" }, children: l.charAt(0).toUpperCase() + l.slice(1) }, l)) }) }),
|
|
2757
2768
|
/* @__PURE__ */ c(pe, { title: "Theme Color", children: [
|
|
2758
|
-
/* @__PURE__ */ e("div", { className: "grid grid-cols-6 gap-2 px-3", children: Ns.map((l) => /* @__PURE__ */ e("button", { title: l.label, onClick: () => n == null ? void 0 : n.setAppearance({ themeColor: l.value }), className: `w-6 h-6 transition-transform hover:scale-110 ${
|
|
2769
|
+
/* @__PURE__ */ e("div", { className: "grid grid-cols-6 gap-2 px-3", children: Ns.map((l) => /* @__PURE__ */ e("button", { title: l.label, onClick: () => n == null ? void 0 : n.setAppearance({ themeColor: l.value }), className: `w-6 h-6 transition-transform hover:scale-110 ${a.themeColor === l.value ? "ring-2 ring-white scale-110" : "ring-1 ring-white/10"}`, style: { backgroundColor: l.value, borderRadius: "var(--radius-full)" }, children: a.themeColor === l.value && /* @__PURE__ */ e(He, { className: "w-3 h-3 text-white mx-auto stroke-[3]" }) }, l.value)) }),
|
|
2759
2770
|
/* @__PURE__ */ e("div", { className: "px-3 pt-4", children: /* @__PURE__ */ c("div", { className: "flex items-center gap-3 bg-white/5 p-2 hover:bg-white/10 transition-colors group", style: { borderRadius: "var(--radius)" }, children: [
|
|
2760
|
-
/* @__PURE__ */ e("div", { className: "relative w-6 h-6 overflow-hidden ring-1 ring-white/20", style: { borderRadius: "var(--radius-full)" }, children: /* @__PURE__ */ e("input", { type: "color", value:
|
|
2771
|
+
/* @__PURE__ */ e("div", { className: "relative w-6 h-6 overflow-hidden ring-1 ring-white/20", style: { borderRadius: "var(--radius-full)" }, children: /* @__PURE__ */ e("input", { type: "color", value: a.themeColor, onChange: (l) => n == null ? void 0 : n.setAppearance({ themeColor: l.target.value }), className: "absolute inset-[-4px] w-[150%] h-[150%] cursor-pointer p-0 border-0" }) }),
|
|
2761
2772
|
/* @__PURE__ */ e("span", { className: "text-xs text-zinc-400 font-medium group-hover:text-zinc-200", children: "Custom Color" }),
|
|
2762
|
-
/* @__PURE__ */ e("span", { className: "text-[10px] font-mono text-zinc-500 ml-auto uppercase", children:
|
|
2773
|
+
/* @__PURE__ */ e("span", { className: "text-[10px] font-mono text-zinc-500 ml-auto uppercase", children: a.themeColor })
|
|
2763
2774
|
] }) })
|
|
2764
2775
|
] })
|
|
2765
2776
|
] })
|
|
@@ -2776,7 +2787,7 @@ const Ns = [
|
|
|
2776
2787
|
{ html: "Playback", isLabel: !0 },
|
|
2777
2788
|
{
|
|
2778
2789
|
html: "Loop",
|
|
2779
|
-
checked:
|
|
2790
|
+
checked: a.isLooping,
|
|
2780
2791
|
onClick: () => n == null ? void 0 : n.toggleLoop()
|
|
2781
2792
|
},
|
|
2782
2793
|
{ separator: !0 },
|
|
@@ -2787,19 +2798,19 @@ const Ns = [
|
|
|
2787
2798
|
{ separator: !0 },
|
|
2788
2799
|
// Aspect Ratio Group
|
|
2789
2800
|
{ html: "Aspect Ratio", isLabel: !0 },
|
|
2790
|
-
{ html: "Default", checked:
|
|
2791
|
-
{ html: "16:9", checked:
|
|
2792
|
-
{ html: "21:9", checked:
|
|
2801
|
+
{ html: "Default", checked: a.aspectRatio === "default", onClick: () => n == null ? void 0 : n.setAspectRatio("default") },
|
|
2802
|
+
{ html: "16:9", checked: a.aspectRatio === "16:9", onClick: () => n == null ? void 0 : n.setAspectRatio("16:9") },
|
|
2803
|
+
{ html: "21:9", checked: a.aspectRatio === "21:9", onClick: () => n == null ? void 0 : n.setAspectRatio("21:9") },
|
|
2793
2804
|
{ separator: !0 },
|
|
2794
2805
|
// Video Fit Group
|
|
2795
2806
|
{ html: "Video Fit", isLabel: !0 },
|
|
2796
|
-
{ html: "Contain", checked:
|
|
2797
|
-
{ html: "Cover", checked:
|
|
2807
|
+
{ html: "Contain", checked: a.videoFit === "contain", onClick: () => n == null ? void 0 : n.setVideoFit("contain") },
|
|
2808
|
+
{ html: "Cover", checked: a.videoFit === "cover", onClick: () => n == null ? void 0 : n.setVideoFit("cover") },
|
|
2798
2809
|
{ separator: !0 },
|
|
2799
2810
|
// Stats
|
|
2800
2811
|
{
|
|
2801
2812
|
html: "Video Info",
|
|
2802
|
-
icon: /* @__PURE__ */ e(
|
|
2813
|
+
icon: /* @__PURE__ */ e(rs, { className: "w-3.5 h-3.5" }),
|
|
2803
2814
|
onClick: () => mt(!0)
|
|
2804
2815
|
},
|
|
2805
2816
|
{ separator: !0 }
|
|
@@ -2816,18 +2827,18 @@ const Ns = [
|
|
|
2816
2827
|
/* @__PURE__ */ e("path", { d: "m6 6 12 12" })
|
|
2817
2828
|
] }) })
|
|
2818
2829
|
}), d;
|
|
2819
|
-
}, [m.contextmenu,
|
|
2830
|
+
}, [m.contextmenu, a.aspectRatio, a.isLooping, a.videoFit, n]), yi = a.isWebFullscreen, Bt = /* @__PURE__ */ c(
|
|
2820
2831
|
"div",
|
|
2821
2832
|
{
|
|
2822
2833
|
id: m.id,
|
|
2823
2834
|
ref: T,
|
|
2824
2835
|
className: `group bg-black overflow-hidden select-none font-[family-name:var(--font-main)] outline-none text-zinc-100 strata-player-reset flex items-center justify-center ${yi ? "fixed inset-0 z-[2147483647] w-screen h-screen rounded-none" : "relative w-full h-full rounded-[var(--radius-player)]"} ${m.container || ""}`,
|
|
2825
|
-
style: { touchAction: "manipulation", "--accent":
|
|
2826
|
-
onMouseMove:
|
|
2836
|
+
style: { touchAction: "manipulation", "--accent": a.themeColor, "--accent-contrast": si },
|
|
2837
|
+
onMouseMove: It,
|
|
2827
2838
|
onMouseLeave: () => {
|
|
2828
|
-
|
|
2839
|
+
a.isPlaying && !V && !B && !$ && n && n.setControlsVisible(!1);
|
|
2829
2840
|
},
|
|
2830
|
-
onMouseDown:
|
|
2841
|
+
onMouseDown: Rt,
|
|
2831
2842
|
onMouseUp: Ze,
|
|
2832
2843
|
onTouchStart: ci,
|
|
2833
2844
|
onTouchMove: di,
|
|
@@ -2836,7 +2847,7 @@ const Ns = [
|
|
|
2836
2847
|
tabIndex: 0,
|
|
2837
2848
|
role: "region",
|
|
2838
2849
|
"aria-label": "Video Player",
|
|
2839
|
-
"data-theme":
|
|
2850
|
+
"data-theme": a.theme,
|
|
2840
2851
|
children: [
|
|
2841
2852
|
/* @__PURE__ */ e("style", { children: `
|
|
2842
2853
|
[data-theme="default"] {
|
|
@@ -2936,7 +2947,7 @@ const Ns = [
|
|
|
2936
2947
|
[data-theme="pixel"] .strata-backdrop { backdrop-filter: none; background: #000; }
|
|
2937
2948
|
[data-theme="hacker"] .strata-backdrop { backdrop-filter: none; background: #000; }
|
|
2938
2949
|
` }),
|
|
2939
|
-
|
|
2950
|
+
a.theme === "hacker" && /* @__PURE__ */ e("div", { className: "strata-scanlines" }),
|
|
2940
2951
|
!n && /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center bg-zinc-950 z-50", children: /* @__PURE__ */ e(De, { className: "w-10 h-10 text-[var(--accent)] animate-spin" }) }),
|
|
2941
2952
|
n && /* @__PURE__ */ c(Q, { children: [
|
|
2942
2953
|
(Dt = m.layers) == null ? void 0 : Dt.map((d, w) => /* @__PURE__ */ e(
|
|
@@ -2948,8 +2959,8 @@ const Ns = [
|
|
|
2948
2959
|
},
|
|
2949
2960
|
w
|
|
2950
2961
|
)),
|
|
2951
|
-
/* @__PURE__ */ e(vs, { notifications:
|
|
2952
|
-
/* @__PURE__ */ e(xs, { cues:
|
|
2962
|
+
/* @__PURE__ */ e(vs, { notifications: a.notifications }),
|
|
2963
|
+
/* @__PURE__ */ e(xs, { cues: a.activeCues, settings: a.subtitleSettings }),
|
|
2953
2964
|
/* @__PURE__ */ e(
|
|
2954
2965
|
"div",
|
|
2955
2966
|
{
|
|
@@ -2960,11 +2971,11 @@ const Ns = [
|
|
|
2960
2971
|
tabIndex: -1
|
|
2961
2972
|
}
|
|
2962
2973
|
),
|
|
2963
|
-
|
|
2974
|
+
r && !G && /* @__PURE__ */ e(
|
|
2964
2975
|
"div",
|
|
2965
2976
|
{
|
|
2966
2977
|
className: "absolute inset-0 bg-cover bg-center z-[5] pointer-events-none strata-poster",
|
|
2967
|
-
style: { backgroundImage: `url(${
|
|
2978
|
+
style: { backgroundImage: `url(${r})` }
|
|
2968
2979
|
}
|
|
2969
2980
|
),
|
|
2970
2981
|
oe.visible && /* @__PURE__ */ e(
|
|
@@ -2975,7 +2986,7 @@ const Ns = [
|
|
|
2975
2986
|
items: wi,
|
|
2976
2987
|
onClose: z,
|
|
2977
2988
|
containerWidth: ge,
|
|
2978
|
-
containerHeight:
|
|
2989
|
+
containerHeight: ae
|
|
2979
2990
|
}
|
|
2980
2991
|
),
|
|
2981
2992
|
ni && n && /* @__PURE__ */ e(Ss, { player: n, onClose: () => mt(!1) }),
|
|
@@ -2983,23 +2994,23 @@ const Ns = [
|
|
|
2983
2994
|
/* @__PURE__ */ e(os, { className: "w-4 h-4 text-[var(--accent)] fill-current" }),
|
|
2984
2995
|
/* @__PURE__ */ e("span", { className: "text-xs font-bold tracking-wider", children: "2x Speed" })
|
|
2985
2996
|
] }),
|
|
2986
|
-
|
|
2987
|
-
|
|
2988
|
-
/* @__PURE__ */ e("div", { className: "w-32 h-1.5 bg-white/20 rounded-full overflow-hidden", children: /* @__PURE__ */ e("div", { className: "h-full bg-[var(--accent)]", style: { width: `${
|
|
2997
|
+
Re && /* @__PURE__ */ c("div", { className: "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 bg-black/60 backdrop-blur-md p-6 rounded-2xl flex flex-col items-center gap-4 z-40 animate-in fade-in zoom-in duration-200 pointer-events-none", children: [
|
|
2998
|
+
a.isMuted || a.volume === 0 ? /* @__PURE__ */ e(Ut, { className: "w-10 h-10 text-white/80" }) : /* @__PURE__ */ e(jt, { className: "w-10 h-10 text-white/80" }),
|
|
2999
|
+
/* @__PURE__ */ e("div", { className: "w-32 h-1.5 bg-white/20 rounded-full overflow-hidden", children: /* @__PURE__ */ e("div", { className: "h-full bg-[var(--accent)]", style: { width: `${a.isMuted ? 0 : a.volume * 100}%` } }) }),
|
|
2989
3000
|
/* @__PURE__ */ c("span", { className: "text-xl font-bold font-mono", children: [
|
|
2990
|
-
Math.round(
|
|
3001
|
+
Math.round(a.volume * 100),
|
|
2991
3002
|
"%"
|
|
2992
3003
|
] })
|
|
2993
3004
|
] }),
|
|
2994
3005
|
vt && /* @__PURE__ */ c("div", { className: "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 bg-black/60 backdrop-blur-md p-6 rounded-2xl flex flex-col items-center gap-4 z-40 animate-in fade-in zoom-in duration-200 pointer-events-none", children: [
|
|
2995
|
-
/* @__PURE__ */ e(
|
|
2996
|
-
/* @__PURE__ */ e("div", { className: "w-32 h-1.5 bg-white/20 rounded-full overflow-hidden", children: /* @__PURE__ */ e("div", { className: "h-full bg-[var(--accent)]", style: { width: `${Math.min(100,
|
|
3006
|
+
/* @__PURE__ */ e(qt, { className: "w-10 h-10 text-white/80" }),
|
|
3007
|
+
/* @__PURE__ */ e("div", { className: "w-32 h-1.5 bg-white/20 rounded-full overflow-hidden", children: /* @__PURE__ */ e("div", { className: "h-full bg-[var(--accent)]", style: { width: `${Math.min(100, a.brightness * 100)}%` } }) }),
|
|
2997
3008
|
/* @__PURE__ */ c("span", { className: "text-xl font-bold font-mono", children: [
|
|
2998
|
-
Math.round(
|
|
3009
|
+
Math.round(a.brightness * 100),
|
|
2999
3010
|
"%"
|
|
3000
3011
|
] })
|
|
3001
3012
|
] }),
|
|
3002
|
-
H && We &&
|
|
3013
|
+
H && We && a.controlsVisible && /* @__PURE__ */ e(
|
|
3003
3014
|
"button",
|
|
3004
3015
|
{
|
|
3005
3016
|
onMouseDown: (d) => d.stopPropagation(),
|
|
@@ -3007,43 +3018,43 @@ const Ns = [
|
|
|
3007
3018
|
onClick: (d) => {
|
|
3008
3019
|
d.stopPropagation(), n.toggleLock();
|
|
3009
3020
|
},
|
|
3010
|
-
className: `absolute left-4 md:left-6 bottom-24 md:bottom-28 z-50 p-3 rounded-full bg-black/50 backdrop-blur-md border border-white/10 text-white transition-all active:scale-95 ${
|
|
3011
|
-
children:
|
|
3021
|
+
className: `absolute left-4 md:left-6 bottom-24 md:bottom-28 z-50 p-3 rounded-full bg-black/50 backdrop-blur-md border border-white/10 text-white transition-all active:scale-95 ${a.isLocked ? "text-[var(--accent)] bg-white/10" : "hover:bg-white/10"}`,
|
|
3022
|
+
children: a.isLocked ? /* @__PURE__ */ e(is, { className: "w-5 h-5" }) : /* @__PURE__ */ e(ss, { className: "w-5 h-5" })
|
|
3012
3023
|
}
|
|
3013
3024
|
),
|
|
3014
3025
|
ue && /* @__PURE__ */ e(
|
|
3015
3026
|
"div",
|
|
3016
3027
|
{
|
|
3017
3028
|
className: `absolute top-0 bottom-0 flex items-center justify-center w-[35%] z-20 bg-white/5 backdrop-blur-[1px] animate-out fade-out duration-500 fill-mode-forwards pointer-events-none ${ue.type === "rewind" ? "left-0 rounded-r-[4rem]" : "right-0 rounded-l-[4rem]"}`,
|
|
3018
|
-
onAnimationEnd: () =>
|
|
3029
|
+
onAnimationEnd: () => Pe(null),
|
|
3019
3030
|
children: /* @__PURE__ */ c("div", { className: "flex flex-col items-center text-white drop-shadow-lg", children: [
|
|
3020
|
-
ue.type === "rewind" ? /* @__PURE__ */ e(
|
|
3031
|
+
ue.type === "rewind" ? /* @__PURE__ */ e(Gt, { className: "w-12 h-12 animate-pulse" }) : /* @__PURE__ */ e(_t, { className: "w-12 h-12 animate-pulse" }),
|
|
3021
3032
|
/* @__PURE__ */ e("span", { className: "font-bold text-sm mt-2 font-mono", children: ue.type === "rewind" ? "-10s" : "+10s" })
|
|
3022
3033
|
] })
|
|
3023
3034
|
},
|
|
3024
3035
|
ue.id
|
|
3025
3036
|
),
|
|
3026
|
-
|
|
3027
|
-
|
|
3037
|
+
a.isBuffering && /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center z-20 pointer-events-none", children: /* @__PURE__ */ e(De, { className: "w-12 h-12 text-[var(--accent)] animate-spin drop-shadow-lg" }) }),
|
|
3038
|
+
a.error && /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center z-30 bg-black/90 backdrop-blur-md animate-in fade-in", children: /* @__PURE__ */ c("div", { className: "flex flex-col items-center gap-4 text-red-500 p-8 max-w-md text-center", children: [
|
|
3028
3039
|
/* @__PURE__ */ e("span", { className: "text-5xl mb-2", children: "⚠️" }),
|
|
3029
3040
|
/* @__PURE__ */ e("h3", { className: "text-xl font-bold text-white", children: "Playback Error" }),
|
|
3030
|
-
/* @__PURE__ */ e("p", { className: "text-zinc-400 text-sm", children:
|
|
3041
|
+
/* @__PURE__ */ e("p", { className: "text-zinc-400 text-sm", children: a.error }),
|
|
3031
3042
|
/* @__PURE__ */ e("button", { onClick: () => n.load(n.store.get().sources[n.store.get().currentSourceIndex] || { url: t || "", type: i || "auto" }, f), className: "px-6 py-2 bg-[var(--accent)] text-white font-medium rounded-full hover:opacity-90 transition-opacity mt-4 shadow-lg", children: "Try Again" })
|
|
3032
3043
|
] }) }),
|
|
3033
|
-
j && !
|
|
3044
|
+
j && !a.isLocked && (!a.isPlaying && !a.isBuffering && !a.error || a.controlsVisible) && !a.isBuffering ? /* @__PURE__ */ e(
|
|
3034
3045
|
"div",
|
|
3035
3046
|
{
|
|
3036
|
-
className: `absolute inset-0 flex items-center justify-center z-10 transition-opacity duration-300 pointer-events-none ${
|
|
3047
|
+
className: `absolute inset-0 flex items-center justify-center z-10 transition-opacity duration-300 pointer-events-none ${a.controlsVisible || !a.isPlaying ? "opacity-100" : "opacity-0"}`,
|
|
3037
3048
|
children: /* @__PURE__ */ c("div", { className: "flex items-center gap-8 md:gap-16 pointer-events-auto", children: [
|
|
3038
3049
|
/* @__PURE__ */ e("button", { onMouseDown: (d) => d.stopPropagation(), onTouchStart: (d) => d.stopPropagation(), onClick: (d) => {
|
|
3039
|
-
d.stopPropagation(), z(),
|
|
3040
|
-
}, className: `group flex items-center justify-center rounded-full bg-black/40 hover:bg-black/60 border border-white/10 transition-all duration-300 active:scale-125 active:opacity-80 text-white/90 focus:outline-none backdrop-blur-sm ${he.skipBtn}`, children: /* @__PURE__ */ e(
|
|
3050
|
+
d.stopPropagation(), z(), Le("rewind");
|
|
3051
|
+
}, className: `group flex items-center justify-center rounded-full bg-black/40 hover:bg-black/60 border border-white/10 transition-all duration-300 active:scale-125 active:opacity-80 text-white/90 focus:outline-none backdrop-blur-sm ${he.skipBtn}`, children: /* @__PURE__ */ e(Gt, { className: he.skipIcon }) }),
|
|
3041
3052
|
/* @__PURE__ */ e("button", { onMouseDown: (d) => d.stopPropagation(), onTouchStart: (d) => d.stopPropagation(), onClick: (d) => {
|
|
3042
3053
|
d.stopPropagation(), z(), n.togglePlay();
|
|
3043
|
-
}, className: `group relative flex items-center justify-center rounded-full bg-white/10 hover:bg-[var(--accent)] border border-white/10 shadow-2xl transition-all duration-300 active:scale-90 active:opacity-80 focus:outline-none backdrop-blur-md ${he.playBtn}`, children:
|
|
3054
|
+
}, className: `group relative flex items-center justify-center rounded-full bg-white/10 hover:bg-[var(--accent)] border border-white/10 shadow-2xl transition-all duration-300 active:scale-90 active:opacity-80 focus:outline-none backdrop-blur-md ${he.playBtn}`, children: a.isPlaying ? /* @__PURE__ */ e(Wt, { className: `${he.playIcon} text-white fill-current` }) : /* @__PURE__ */ e(Ht, { className: `${he.playIcon} text-white ml-1 fill-current` }) }),
|
|
3044
3055
|
/* @__PURE__ */ e("button", { onMouseDown: (d) => d.stopPropagation(), onTouchStart: (d) => d.stopPropagation(), onClick: (d) => {
|
|
3045
|
-
d.stopPropagation(), z(),
|
|
3046
|
-
}, className: `group flex items-center justify-center rounded-full bg-black/40 hover:bg-black/60 border border-white/10 transition-all duration-300 active:scale-125 active:opacity-80 text-white/90 focus:outline-none backdrop-blur-sm ${he.skipBtn}`, children: /* @__PURE__ */ e(
|
|
3056
|
+
d.stopPropagation(), z(), Le("forward");
|
|
3057
|
+
}, className: `group flex items-center justify-center rounded-full bg-black/40 hover:bg-black/60 border border-white/10 transition-all duration-300 active:scale-125 active:opacity-80 text-white/90 focus:outline-none backdrop-blur-sm ${he.skipBtn}`, children: /* @__PURE__ */ e(_t, { className: he.skipIcon }) })
|
|
3047
3058
|
] })
|
|
3048
3059
|
}
|
|
3049
3060
|
) : null,
|
|
@@ -3052,7 +3063,7 @@ const Ns = [
|
|
|
3052
3063
|
{
|
|
3053
3064
|
className: `absolute inset-x-0 bottom-0 z-30 transition-all duration-300 px-4 md:px-6 py-4 bg-gradient-to-t from-black/90 via-black/50 to-transparent ${xi ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4 pointer-events-none"}`,
|
|
3054
3065
|
onClick: (d) => {
|
|
3055
|
-
(V || B ||
|
|
3066
|
+
(V || B || $) && z(), d.target === d.currentTarget && ve(!1), d.stopPropagation();
|
|
3056
3067
|
},
|
|
3057
3068
|
children: [
|
|
3058
3069
|
!m.isLive && /* @__PURE__ */ c(
|
|
@@ -3064,24 +3075,24 @@ const Ns = [
|
|
|
3064
3075
|
onMouseLeave: () => {
|
|
3065
3076
|
kt(null), St(null);
|
|
3066
3077
|
},
|
|
3067
|
-
onMouseDown:
|
|
3068
|
-
onTouchStart:
|
|
3078
|
+
onMouseDown: Pt,
|
|
3079
|
+
onTouchStart: Pt,
|
|
3069
3080
|
children: [
|
|
3070
|
-
(Ot = m.highlight) == null ? void 0 : Ot.map((d, w) => /* @__PURE__ */ e("div", { className: "absolute top-1/2 -translate-y-1/2 w-1.5 h-1.5 bg-yellow-400 rounded-full z-10 pointer-events-none", style: { left: `${d.time /
|
|
3071
|
-
yt !== null && /* @__PURE__ */ c("div", { className: "absolute bottom-full mb-1.5 flex flex-col items-center transform -translate-x-1/2 z-40 pointer-events-none transition-opacity duration-150", style: { left: `clamp(70px, ${
|
|
3081
|
+
(Ot = m.highlight) == null ? void 0 : Ot.map((d, w) => /* @__PURE__ */ e("div", { className: "absolute top-1/2 -translate-y-1/2 w-1.5 h-1.5 bg-yellow-400 rounded-full z-10 pointer-events-none", style: { left: `${d.time / a.duration * 100}%` }, title: d.text }, w)),
|
|
3082
|
+
yt !== null && /* @__PURE__ */ c("div", { className: "absolute bottom-full mb-1.5 flex flex-col items-center transform -translate-x-1/2 z-40 pointer-events-none transition-opacity duration-150", style: { left: `clamp(70px, ${ai}%, calc(100% - 70px))` }, children: [
|
|
3072
3083
|
ce && /* @__PURE__ */ e("div", { className: "bg-black/90 border border-white/10 shadow-2xl overflow-hidden backdrop-blur-sm", style: { width: `${ce.w * 0.5}px`, height: `${ce.h * 0.5}px`, borderRadius: "var(--radius)" }, children: /* @__PURE__ */ e("div", { style: { backgroundImage: `url("${ce.url}")`, width: `${ce.w}px`, height: `${ce.h}px`, backgroundPosition: `-${ce.x}px -${ce.y}px`, backgroundRepeat: "no-repeat", transform: "scale(0.5)", transformOrigin: "top left" } }) }),
|
|
3073
3084
|
/* @__PURE__ */ e("div", { className: "strata-tooltip px-2 py-0.5 text-[11px] font-bold font-mono shadow-lg tabular-nums mt-1", children: it(yt) })
|
|
3074
3085
|
] }),
|
|
3075
3086
|
/* @__PURE__ */ c("div", { className: "w-full h-1 bg-white/20 overflow-hidden relative backdrop-blur-sm border-[length:var(--border-width)] border-white/10", style: { borderRadius: "var(--radius-full)" }, children: [
|
|
3076
|
-
|
|
3077
|
-
/* @__PURE__ */ e("div", { className: "absolute left-0 top-0 bottom-0 bg-[var(--accent)]", style: { width: `${(
|
|
3087
|
+
a.duration > 0 && a.buffered.map((d, w) => /* @__PURE__ */ e("div", { className: "absolute top-0 bottom-0 bg-white/20", style: { left: `${d.start / a.duration * 100}%`, width: `${(d.end - d.start) / a.duration * 100}%` } }, w)),
|
|
3088
|
+
/* @__PURE__ */ e("div", { className: "absolute left-0 top-0 bottom-0 bg-[var(--accent)]", style: { width: `${(Ge ? Ie : a.currentTime) / a.duration * 100}%` } })
|
|
3078
3089
|
] }),
|
|
3079
3090
|
/* @__PURE__ */ e(
|
|
3080
3091
|
"div",
|
|
3081
3092
|
{
|
|
3082
3093
|
className: "absolute top-1/2 -translate-y-1/2 -translate-x-1/2 w-3.5 h-3.5 bg-white shadow-md scale-0 group-hover/slider:scale-100 transition-transform duration-100 z-10",
|
|
3083
3094
|
style: {
|
|
3084
|
-
left: `${(
|
|
3095
|
+
left: `${(Ge ? Ie : a.currentTime) / a.duration * 100}%`,
|
|
3085
3096
|
borderRadius: "var(--radius-full)"
|
|
3086
3097
|
}
|
|
3087
3098
|
}
|
|
@@ -3100,8 +3111,8 @@ const Ns = [
|
|
|
3100
3111
|
]
|
|
3101
3112
|
}
|
|
3102
3113
|
);
|
|
3103
|
-
return
|
|
3104
|
-
},
|
|
3114
|
+
return a.isWebFullscreen && typeof document < "u" ? Ti(Bt, document.body) : Bt;
|
|
3115
|
+
}, Ls = (s, t) => {
|
|
3105
3116
|
const i = Mi(s);
|
|
3106
3117
|
return i.render(Me.createElement(Yt, t)), {
|
|
3107
3118
|
unmount: () => {
|
|
@@ -3113,8 +3124,8 @@ const Ns = [
|
|
|
3113
3124
|
};
|
|
3114
3125
|
};
|
|
3115
3126
|
export {
|
|
3116
|
-
|
|
3127
|
+
Li as StrataCore,
|
|
3117
3128
|
Yt as StrataPlayer,
|
|
3118
|
-
|
|
3129
|
+
Ls as mountStrataPlayer
|
|
3119
3130
|
};
|
|
3120
3131
|
//# sourceMappingURL=strataplayer.es.js.map
|