@44-audio/components 0.1.0-dev.19 → 0.1.0-dev.20
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/{time-BmemrSJ4.mjs → index-DCaqXYMO.js} +368 -382
- package/dist/player.es.js +1367 -2349
- package/dist/recorder.es.js +297 -291
- package/package.json +4 -1
package/dist/player.es.js
CHANGED
|
@@ -1,1191 +1,195 @@
|
|
|
1
|
-
import { b as
|
|
2
|
-
function
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
import { b as Ke, E as or, a as Xe, d as wr, n as xr, h as Se, c as Ze, e as ar, i as zr, f as kr, s as _r, g as nr, j as Fe, k as ir, U as Pr, p as lr, l as ue, m as ge, o as d, u as de, q as e, r as q, t as Lr, v as se, w as re, x as z, y as ye, z as m, A as er, B as S, C as v, D as J, F as K, G as Pe, H as M, I as W, J as he, K as we, L as G, M as D, N as rr, O as Ee, P as qe, Q as me, R as We, S as pe, T as He, V as ie, W as Er, X as Le, Y as Ir, Z as sr, _ as Be, $ as ur, a0 as Ne, a1 as Ce, a2 as Re, a3 as Z } from "./index-DCaqXYMO.js";
|
|
2
|
+
function Ae(g, r, ...c) {
|
|
3
|
+
var n = g, a = xr, o;
|
|
4
|
+
Ke(() => {
|
|
5
|
+
a !== (a = r()) && (o && (wr(o), o = null), o = Xe(() => (
|
|
6
6
|
/** @type {SnippetFn} */
|
|
7
|
-
|
|
7
|
+
a(n, ...c)
|
|
8
8
|
)));
|
|
9
|
-
},
|
|
9
|
+
}, or), Se && (n = Ze);
|
|
10
10
|
}
|
|
11
|
-
function
|
|
12
|
-
|
|
13
|
-
var
|
|
14
|
-
function
|
|
15
|
-
|
|
11
|
+
function Cr(g, r, c) {
|
|
12
|
+
Se && ar();
|
|
13
|
+
var n = g, a = Pr, o, i, l = null, y = zr() ? kr : _r;
|
|
14
|
+
function h() {
|
|
15
|
+
o && lr(o), l !== null && (l.lastChild.remove(), n.before(l), l = null), o = i;
|
|
16
16
|
}
|
|
17
|
-
|
|
18
|
-
if (
|
|
19
|
-
var f =
|
|
20
|
-
|
|
17
|
+
Ke(() => {
|
|
18
|
+
if (y(a, a = r())) {
|
|
19
|
+
var f = n, x = ir();
|
|
20
|
+
x && (l = document.createDocumentFragment(), l.append(f = nr())), i = Xe(() => c(f)), x ? Fe.add_callback(h) : h();
|
|
21
21
|
}
|
|
22
|
-
}),
|
|
22
|
+
}), Se && (n = Ze);
|
|
23
23
|
}
|
|
24
|
-
function
|
|
25
|
-
|
|
26
|
-
var
|
|
27
|
-
function
|
|
28
|
-
|
|
24
|
+
function Rr(g, r, c) {
|
|
25
|
+
Se && ar();
|
|
26
|
+
var n = g, a, o, i = null, l = null;
|
|
27
|
+
function y() {
|
|
28
|
+
o && (lr(o), o = null), i && (i.lastChild.remove(), n.before(i), i = null), o = l, l = null;
|
|
29
29
|
}
|
|
30
|
-
|
|
31
|
-
if (
|
|
32
|
-
var
|
|
33
|
-
if (
|
|
34
|
-
var f =
|
|
35
|
-
|
|
30
|
+
Ke(() => {
|
|
31
|
+
if (a !== (a = r())) {
|
|
32
|
+
var h = ir();
|
|
33
|
+
if (a) {
|
|
34
|
+
var f = n;
|
|
35
|
+
h && (i = document.createDocumentFragment(), i.append(f = nr()), o && Fe.skipped_effects.add(o)), l = Xe(() => c(f, a));
|
|
36
36
|
}
|
|
37
|
-
|
|
37
|
+
h ? Fe.add_callback(y) : y();
|
|
38
38
|
}
|
|
39
|
-
},
|
|
39
|
+
}, or), Se && (n = Ze);
|
|
40
40
|
}
|
|
41
|
-
|
|
42
|
-
const Xt = { hash: "svelte-1uea9wj", code: ":host {display:block;}" };
|
|
43
|
-
function Yt(y, t) {
|
|
44
|
-
pe(t, !0), be(y, Xt);
|
|
45
|
-
let g = u(t, "recordingId", 7), i = u(t, "theme", 7, ""), o = u(t, "apiHost", 7, "api.44.audio");
|
|
46
|
-
const r = W(() => {
|
|
47
|
-
if (!i())
|
|
48
|
-
return "";
|
|
49
|
-
const s = i().split(",").map((f) => f.trim()), _ = [];
|
|
50
|
-
return s[0] && _.push(`--fortyfour-player-background: ${s[0]}`), s[1] && _.push(`--fortyfour-player-text: ${s[1]}`), s[2] && _.push(`--fortyfour-player-accent: ${s[2]}`), s[4] && _.push(`--fortyfour-player-muted: ${s[4]}`), s[5] && _.push(`--fortyfour-player-border: ${s[5]}`), s[0] && _.push(`--fortyfour-player-surface: ${s[0]}`), _.join("; ");
|
|
51
|
-
});
|
|
52
|
-
var a = {
|
|
53
|
-
get recordingId() {
|
|
54
|
-
return g();
|
|
55
|
-
},
|
|
56
|
-
set recordingId(s) {
|
|
57
|
-
g(s), c();
|
|
58
|
-
},
|
|
59
|
-
get theme() {
|
|
60
|
-
return i();
|
|
61
|
-
},
|
|
62
|
-
set theme(s = "") {
|
|
63
|
-
i(s), c();
|
|
64
|
-
},
|
|
65
|
-
get apiHost() {
|
|
66
|
-
return o();
|
|
67
|
-
},
|
|
68
|
-
set apiHost(s = "api.44.audio") {
|
|
69
|
-
o(s), c();
|
|
70
|
-
}
|
|
71
|
-
}, n = Vt();
|
|
72
|
-
return H(() => te(n, "api-host", o())), H(() => te(n, "recording-id", g())), te(n, "preload", "metadata"), H(() => Le(n, e(r))), x(y, n), ge(a);
|
|
73
|
-
}
|
|
74
|
-
customElements.define("fortyfour-audio-player", ue(
|
|
75
|
-
Yt,
|
|
76
|
-
{
|
|
77
|
-
apiHost: { attribute: "api-host" },
|
|
78
|
-
recordingId: { attribute: "recording-id" },
|
|
79
|
-
theme: { attribute: "theme" }
|
|
80
|
-
},
|
|
81
|
-
[],
|
|
82
|
-
[],
|
|
83
|
-
!1
|
|
84
|
-
));
|
|
85
|
-
var Zt = F("<fortyfour-mini-player></fortyfour-mini-player>", 2);
|
|
86
|
-
const Jt = {
|
|
87
|
-
hash: "svelte-1pz3muj",
|
|
88
|
-
code: ":host {--fortyfour-player-mini-background-color: #3b82f6;--fortyfour-player-mini-icon-color: #ffffff;--fortyfour-player-mini-ring-track-color: transparent;display:inline-block;}fortyfour-mini-player.svelte-1pz3muj {--fortyfour-mini-player-background: var(--fortyfour-player-mini-background-color);--fortyfour-mini-player-accent: var(--fortyfour-player-mini-icon-color);--fortyfour-mini-player-ring: var(--fortyfour-player-mini-ring-track-color);}"
|
|
89
|
-
};
|
|
90
|
-
function Qt(y, t) {
|
|
91
|
-
pe(t, !0), be(y, Jt);
|
|
92
|
-
let g = u(t, "apiHost", 7, "api.44.audio"), i = u(t, "recordingId", 7), o = u(t, "visualization", 7, "none"), r = u(t, "rippleIntensity", 7, 1), a = u(t, "hover", 7, "none"), n = u(t, "preload", 7, "none"), s = u(t, "shape", 7, "circle"), _ = u(t, "blobAnimate", 7, !1), f = u(t, "blobSpeed", 7, 20);
|
|
93
|
-
var I = {
|
|
94
|
-
get apiHost() {
|
|
95
|
-
return g();
|
|
96
|
-
},
|
|
97
|
-
set apiHost(l = "api.44.audio") {
|
|
98
|
-
g(l), c();
|
|
99
|
-
},
|
|
100
|
-
get recordingId() {
|
|
101
|
-
return i();
|
|
102
|
-
},
|
|
103
|
-
set recordingId(l) {
|
|
104
|
-
i(l), c();
|
|
105
|
-
},
|
|
106
|
-
get visualization() {
|
|
107
|
-
return o();
|
|
108
|
-
},
|
|
109
|
-
set visualization(l = "none") {
|
|
110
|
-
o(l), c();
|
|
111
|
-
},
|
|
112
|
-
get rippleIntensity() {
|
|
113
|
-
return r();
|
|
114
|
-
},
|
|
115
|
-
set rippleIntensity(l = 1) {
|
|
116
|
-
r(l), c();
|
|
117
|
-
},
|
|
118
|
-
get hover() {
|
|
119
|
-
return a();
|
|
120
|
-
},
|
|
121
|
-
set hover(l = "none") {
|
|
122
|
-
a(l), c();
|
|
123
|
-
},
|
|
124
|
-
get preload() {
|
|
125
|
-
return n();
|
|
126
|
-
},
|
|
127
|
-
set preload(l = "none") {
|
|
128
|
-
n(l), c();
|
|
129
|
-
},
|
|
130
|
-
get shape() {
|
|
131
|
-
return s();
|
|
132
|
-
},
|
|
133
|
-
set shape(l = "circle") {
|
|
134
|
-
s(l), c();
|
|
135
|
-
},
|
|
136
|
-
get blobAnimate() {
|
|
137
|
-
return _();
|
|
138
|
-
},
|
|
139
|
-
set blobAnimate(l = !1) {
|
|
140
|
-
_(l), c();
|
|
141
|
-
},
|
|
142
|
-
get blobSpeed() {
|
|
143
|
-
return f();
|
|
144
|
-
},
|
|
145
|
-
set blobSpeed(l = 20) {
|
|
146
|
-
f(l), c();
|
|
147
|
-
}
|
|
148
|
-
}, d = Zt();
|
|
149
|
-
return H(() => te(d, "api-host", g())), H(() => te(d, "recording-id", i())), H(() => te(d, "preload", n())), fe(d, 1, "svelte-1pz3muj"), x(y, d), ge(I);
|
|
150
|
-
}
|
|
151
|
-
customElements.define("fortyfour-player-mini", ue(
|
|
152
|
-
Qt,
|
|
153
|
-
{
|
|
154
|
-
apiHost: { attribute: "api-host" },
|
|
155
|
-
recordingId: { attribute: "recording-id" },
|
|
156
|
-
visualization: { attribute: "visualization" },
|
|
157
|
-
rippleIntensity: { attribute: "ripple-intensity" },
|
|
158
|
-
hover: { attribute: "hover" },
|
|
159
|
-
preload: { attribute: "preload" },
|
|
160
|
-
shape: { attribute: "shape" },
|
|
161
|
-
blobAnimate: { attribute: "blob-animate", type: "Boolean" },
|
|
162
|
-
blobSpeed: { attribute: "blob-speed" }
|
|
163
|
-
},
|
|
164
|
-
[],
|
|
165
|
-
[],
|
|
166
|
-
!0
|
|
167
|
-
));
|
|
168
|
-
function it(y, t = 200) {
|
|
169
|
-
let g = q(!1);
|
|
170
|
-
return me(() => {
|
|
171
|
-
if (y()) {
|
|
172
|
-
const i = setTimeout(() => m(g, !0), t);
|
|
173
|
-
return () => clearTimeout(i);
|
|
174
|
-
} else
|
|
175
|
-
m(g, !1);
|
|
176
|
-
}), () => e(g);
|
|
177
|
-
}
|
|
178
|
-
function lt(y, t, g) {
|
|
179
|
-
me(() => {
|
|
180
|
-
g() ? y.setAttribute(t, "") : y.removeAttribute(t);
|
|
181
|
-
});
|
|
182
|
-
}
|
|
183
|
-
var $t = F('<div part="separator" class="separator svelte-38lkst">/</div>'), er = F('<div part="elapsed" class="elapsed svelte-38lkst"> </div> <!> <div part="total" class="total svelte-38lkst"> </div>', 1), tr = F('<div part="elapsed" class="elapsed svelte-38lkst">-:--</div> <div part="separator" class="separator svelte-38lkst">/</div> <div part="total" class="total svelte-38lkst">-:--</div>', 1), rr = F('<div part="duration" class="duration svelte-38lkst"><!></div>'), ar = F("<span> </span>"), or = F("<span>--</span>"), nr = F('<div part="duration" class="duration svelte-38lkst"><!></div>');
|
|
184
|
-
const ir = {
|
|
185
|
-
hash: "svelte-38lkst",
|
|
186
|
-
code: ":host {--fortyfour-player-duration-font-size: inherit;--fortyfour-player-duration-color: inherit;--fortyfour-player-duration-elapsed-color: inherit;--fortyfour-player-duration-total-color: inherit;--fortyfour-player-duration-separator-color: inherit;display:inline-flex;font-variant-numeric:tabular-nums;}.duration.svelte-38lkst {display:flex;align-items:center;gap:0.25em;font-size:var(--fortyfour-player-duration-font-size);color:var(--fortyfour-player-duration-color);}.elapsed.svelte-38lkst {color:var(--fortyfour-player-duration-elapsed-color);}.total.svelte-38lkst {color:var(--fortyfour-player-duration-total-color);}.separator.svelte-38lkst {color:var(--fortyfour-player-duration-separator-color);}"
|
|
187
|
-
};
|
|
188
|
-
function lr(y, t) {
|
|
189
|
-
pe(t, !0), be(y, ir);
|
|
190
|
-
const g = t.$$host;
|
|
191
|
-
let i = u(t, "format", 7, "-remaining"), o = u(t, "for", 7, ""), r = q(0), a = q(0), n = q("none");
|
|
192
|
-
const s = it(() => e(a) === 0, 200), _ = W(() => e(a) !== 0 ? !1 : e(n) === "none" ? !0 : s()), f = W(() => Ve(e(r))), I = W(() => Ve(e(a))), d = W(() => {
|
|
193
|
-
if (e(a) === 0)
|
|
194
|
-
return "";
|
|
195
|
-
switch (i()) {
|
|
196
|
-
case "-remaining":
|
|
197
|
-
return "-" + Ve(Math.max(0, e(a) - e(r)));
|
|
198
|
-
case "remaining":
|
|
199
|
-
return Ve(Math.max(0, e(a) - e(r)));
|
|
200
|
-
case "elapsed":
|
|
201
|
-
return e(f);
|
|
202
|
-
case "elapsed-text":
|
|
203
|
-
return pt(e(r));
|
|
204
|
-
case "total":
|
|
205
|
-
return e(I);
|
|
206
|
-
case "remaining-text":
|
|
207
|
-
return pt(Math.max(0, e(a) - e(r)));
|
|
208
|
-
case "%":
|
|
209
|
-
return Math.min(100, Math.ceil(e(r) / e(a) * 100)) + "%";
|
|
210
|
-
default:
|
|
211
|
-
return null;
|
|
212
|
-
}
|
|
213
|
-
});
|
|
214
|
-
me(() => {
|
|
215
|
-
if (!o()) {
|
|
216
|
-
console.warn("fortyfour-player-duration: 'for' attribute is required to link to a player");
|
|
217
|
-
return;
|
|
218
|
-
}
|
|
219
|
-
const B = document.getElementById(o());
|
|
220
|
-
if (!B) {
|
|
221
|
-
console.warn("fortyfour-player-duration: No parent player found");
|
|
222
|
-
return;
|
|
223
|
-
}
|
|
224
|
-
m(n, B.getAttribute("preload") || "none", !0), B.duration && m(a, B.duration, !0), B.currentTime && m(r, B.currentTime, !0);
|
|
225
|
-
function A(R) {
|
|
226
|
-
m(a, R.detail.duration, !0);
|
|
227
|
-
}
|
|
228
|
-
function X(R) {
|
|
229
|
-
m(r, R.detail.currentTime, !0), m(a, R.detail.duration, !0);
|
|
230
|
-
}
|
|
231
|
-
return B.addEventListener("loadedmetadata", A), B.addEventListener("timeupdate", X), () => {
|
|
232
|
-
B.removeEventListener("loadedmetadata", A), B.removeEventListener("timeupdate", X);
|
|
233
|
-
};
|
|
234
|
-
}), lt(g, "data-placeholder", () => e(_));
|
|
235
|
-
var l = {
|
|
236
|
-
get format() {
|
|
237
|
-
return i();
|
|
238
|
-
},
|
|
239
|
-
set format(B = "-remaining") {
|
|
240
|
-
i(B), c();
|
|
241
|
-
},
|
|
242
|
-
get for() {
|
|
243
|
-
return o();
|
|
244
|
-
},
|
|
245
|
-
set for(B = "") {
|
|
246
|
-
o(B), c();
|
|
247
|
-
}
|
|
248
|
-
}, P = ee(), b = J(P);
|
|
249
|
-
{
|
|
250
|
-
var j = (B) => {
|
|
251
|
-
var A = rr(), X = G(A);
|
|
252
|
-
{
|
|
253
|
-
var R = (k) => {
|
|
254
|
-
var D = er(), T = J(D), L = G(T, !0);
|
|
255
|
-
N(T);
|
|
256
|
-
var M = ye(T, 2);
|
|
257
|
-
Ce(M, t, "separator", {}, (E) => {
|
|
258
|
-
var Q = $t();
|
|
259
|
-
ze(1, Q, () => Pe, () => ({ duration: 400 })), x(E, Q);
|
|
260
|
-
});
|
|
261
|
-
var z = ye(M, 2), v = G(z, !0);
|
|
262
|
-
N(z), H(() => {
|
|
263
|
-
je(L, e(f)), je(v, e(I));
|
|
264
|
-
}), ze(1, T, () => Pe, () => ({ duration: 400 })), ze(1, z, () => Pe, () => ({ duration: 400 })), x(k, D);
|
|
265
|
-
}, V = (k) => {
|
|
266
|
-
var D = ee(), T = J(D);
|
|
267
|
-
{
|
|
268
|
-
var L = (M) => {
|
|
269
|
-
var z = ee(), v = J(z);
|
|
270
|
-
Ce(v, t, "placeholder", {}, (E) => {
|
|
271
|
-
var Q = tr();
|
|
272
|
-
Dt(4), x(E, Q);
|
|
273
|
-
}), x(M, z);
|
|
274
|
-
};
|
|
275
|
-
K(
|
|
276
|
-
T,
|
|
277
|
-
(M) => {
|
|
278
|
-
e(_) && M(L);
|
|
279
|
-
},
|
|
280
|
-
!0
|
|
281
|
-
);
|
|
282
|
-
}
|
|
283
|
-
x(k, D);
|
|
284
|
-
};
|
|
285
|
-
K(X, (k) => {
|
|
286
|
-
e(a) !== 0 ? k(R) : k(V, !1);
|
|
287
|
-
});
|
|
288
|
-
}
|
|
289
|
-
N(A), x(B, A);
|
|
290
|
-
}, C = (B) => {
|
|
291
|
-
var A = nr(), X = G(A);
|
|
292
|
-
{
|
|
293
|
-
var R = (k) => {
|
|
294
|
-
var D = ar(), T = G(D, !0);
|
|
295
|
-
N(D), H(() => je(T, e(d))), ze(1, D, () => Pe, () => ({ duration: 400 })), x(k, D);
|
|
296
|
-
}, V = (k) => {
|
|
297
|
-
var D = ee(), T = J(D);
|
|
298
|
-
{
|
|
299
|
-
var L = (M) => {
|
|
300
|
-
var z = ee(), v = J(z);
|
|
301
|
-
Ce(v, t, "placeholder", {}, (E) => {
|
|
302
|
-
var Q = or();
|
|
303
|
-
x(E, Q);
|
|
304
|
-
}), x(M, z);
|
|
305
|
-
};
|
|
306
|
-
K(
|
|
307
|
-
T,
|
|
308
|
-
(M) => {
|
|
309
|
-
e(_) && M(L);
|
|
310
|
-
},
|
|
311
|
-
!0
|
|
312
|
-
);
|
|
313
|
-
}
|
|
314
|
-
x(k, D);
|
|
315
|
-
};
|
|
316
|
-
K(X, (k) => {
|
|
317
|
-
e(a) !== 0 ? k(R) : k(V, !1);
|
|
318
|
-
});
|
|
319
|
-
}
|
|
320
|
-
N(A), x(B, A);
|
|
321
|
-
};
|
|
322
|
-
K(b, (B) => {
|
|
323
|
-
i() === "elapsed/total" ? B(j) : B(C, !1);
|
|
324
|
-
});
|
|
325
|
-
}
|
|
326
|
-
return x(y, P), ge(l);
|
|
327
|
-
}
|
|
328
|
-
customElements.define("fortyfour-player-duration", ue(lr, { format: { attribute: "format" }, for: { attribute: "for" } }, ["separator", "placeholder"], [], !0));
|
|
329
|
-
var sr = Me('<rect style="rx: var(--fortyfour-player-waveform-bar-radius, 1px)"></rect>'), ur = F('<div class="container svelte-7i2lww"><svg width="100%" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" class="svelte-7i2lww"><!></svg></div>');
|
|
330
|
-
const cr = {
|
|
331
|
-
hash: "svelte-7i2lww",
|
|
332
|
-
code: "svg.svelte-7i2lww {box-sizing:border-box;margin:0;padding:0;}.container.svelte-7i2lww {flex:1;height:100%;box-sizing:border-box;margin:0;padding:0;display:flex;align-items:center;}.bar.svelte-7i2lww {transition:fill 0.2s;}.progress.svelte-7i2lww {fill:var(--fortyfour-player-waveform-progress-color);}.track.svelte-7i2lww {fill:var(--fortyfour-player-waveform-track-color);}"
|
|
333
|
-
};
|
|
334
|
-
function kt(y, t) {
|
|
335
|
-
pe(t, !0), be(y, cr);
|
|
336
|
-
function g(k, D) {
|
|
337
|
-
const T = k.length / D, L = [];
|
|
338
|
-
for (let M = 0; M < D; M++) {
|
|
339
|
-
const z = Math.floor(M * T), v = Math.floor((M + 1) * T), E = k.slice(z, Math.max(z + 1, v)), Q = E.reduce((w, h) => w + h * h, 0), oe = Math.sqrt(Q / E.length);
|
|
340
|
-
L.push(oe);
|
|
341
|
-
}
|
|
342
|
-
return L;
|
|
343
|
-
}
|
|
344
|
-
let i = u(t, "data", 7), o = u(t, "timeMs", 7, null), r = u(t, "barWidth", 7, 3), a = u(t, "spacing", 7, 1), n = u(t, "minHeight", 7, 3), s = q(0), _ = q(56), f = q(!1), I = null;
|
|
345
|
-
Fe(() => {
|
|
346
|
-
const k = new ResizeObserver((D) => {
|
|
347
|
-
for (let T of D)
|
|
348
|
-
T.contentBoxSize ? (m(s, T.contentBoxSize[0]?.inlineSize || T.contentBoxSize.inlineSize, !0), m(_, T.contentBoxSize[0]?.blockSize || T.contentBoxSize.blockSize || 56, !0)) : (m(s, T.contentRect.width, !0), m(_, T.contentRect.height || 56, !0)), m(f, !0);
|
|
349
|
-
});
|
|
350
|
-
return I && k.observe(I), () => {
|
|
351
|
-
k.disconnect();
|
|
352
|
-
};
|
|
353
|
-
});
|
|
354
|
-
const d = 100, l = W(() => Math.floor(e(s) / (r() + a()))), P = W(() => g(i(), e(l))), b = W(() => e(P).length ? i().length / e(P).length : 1), j = W(() => d * e(b)), C = W(() => e(P).map((k) => {
|
|
355
|
-
const D = Math.max(n(), Math.round(k / 100 * (e(_) - n()) + n()));
|
|
356
|
-
return D % 2 === 0 ? D + 1 : D;
|
|
357
|
-
}));
|
|
358
|
-
var B = {
|
|
359
|
-
get data() {
|
|
360
|
-
return i();
|
|
361
|
-
},
|
|
362
|
-
set data(k) {
|
|
363
|
-
i(k), c();
|
|
364
|
-
},
|
|
365
|
-
get timeMs() {
|
|
366
|
-
return o();
|
|
367
|
-
},
|
|
368
|
-
set timeMs(k = null) {
|
|
369
|
-
o(k), c();
|
|
370
|
-
},
|
|
371
|
-
get barWidth() {
|
|
372
|
-
return r();
|
|
373
|
-
},
|
|
374
|
-
set barWidth(k = 3) {
|
|
375
|
-
r(k), c();
|
|
376
|
-
},
|
|
377
|
-
get spacing() {
|
|
378
|
-
return a();
|
|
379
|
-
},
|
|
380
|
-
set spacing(k = 1) {
|
|
381
|
-
a(k), c();
|
|
382
|
-
},
|
|
383
|
-
get minHeight() {
|
|
384
|
-
return n();
|
|
385
|
-
},
|
|
386
|
-
set minHeight(k = 3) {
|
|
387
|
-
n(k), c();
|
|
388
|
-
}
|
|
389
|
-
}, A = ur(), X = G(A), R = G(X);
|
|
390
|
-
{
|
|
391
|
-
var V = (k) => {
|
|
392
|
-
var D = ee(), T = J(D);
|
|
393
|
-
Be(T, 17, () => e(C), Ae, (L, M, z) => {
|
|
394
|
-
const v = W(() => z * e(j) < o());
|
|
395
|
-
var E = sr();
|
|
396
|
-
H(() => {
|
|
397
|
-
fe(E, 0, nt(["bar", e(v) ? "progress" : "track"]), "svelte-7i2lww"), Z(E, "x", z * (r() + a())), Z(E, "y", e(_) / 4 - e(M) / 2), Z(E, "width", r() - 1), Z(E, "height", e(M));
|
|
398
|
-
}), x(L, E);
|
|
399
|
-
}), x(k, D);
|
|
400
|
-
};
|
|
401
|
-
K(R, (k) => {
|
|
402
|
-
e(f) && k(V);
|
|
403
|
-
});
|
|
404
|
-
}
|
|
405
|
-
return N(X), N(A), Ee(A, (k) => I = k, () => I), H(() => {
|
|
406
|
-
Z(X, "height", e(_)), Z(X, "viewBox", `0 0 ${e(s)} ${e(_) / 2}`);
|
|
407
|
-
}), x(y, A), ge(B);
|
|
408
|
-
}
|
|
409
|
-
ue(
|
|
410
|
-
kt,
|
|
411
|
-
{
|
|
412
|
-
data: {},
|
|
413
|
-
timeMs: {},
|
|
414
|
-
barWidth: {},
|
|
415
|
-
spacing: {},
|
|
416
|
-
minHeight: {}
|
|
417
|
-
},
|
|
418
|
-
[],
|
|
419
|
-
[],
|
|
420
|
-
!0
|
|
421
|
-
);
|
|
422
|
-
var dr = F('<div class="track svelte-11a7nsg"><div class="progress svelte-11a7nsg"></div></div>'), fr = F('<div class="container svelte-11a7nsg"><!></div>');
|
|
423
|
-
const vr = {
|
|
424
|
-
hash: "svelte-11a7nsg",
|
|
425
|
-
code: ".container.svelte-11a7nsg {flex:1;display:flex;align-items:center;height:100%;}.track.svelte-11a7nsg {width:100%;background:var(--fortyfour-player-waveform-track-color);overflow:hidden;}.progress.svelte-11a7nsg {height:100%;background:var(--fortyfour-player-waveform-progress-color);transition:width 0.1s linear;}"
|
|
426
|
-
};
|
|
427
|
-
function zt(y, t) {
|
|
428
|
-
pe(t, !0), be(y, vr);
|
|
429
|
-
let g = u(t, "data", 7), i = u(t, "timeMs", 7, null), o = u(t, "lineWidth", 7, 4), r = q(0), a = q(!1), n = null;
|
|
430
|
-
Fe(() => {
|
|
431
|
-
const P = new ResizeObserver((b) => {
|
|
432
|
-
for (let j of b)
|
|
433
|
-
j.contentBoxSize ? m(r, j.contentBoxSize[0]?.inlineSize || j.contentBoxSize.inlineSize, !0) : m(r, j.contentRect.width, !0), m(a, !0);
|
|
434
|
-
});
|
|
435
|
-
return n && P.observe(n), () => {
|
|
436
|
-
P.disconnect();
|
|
437
|
-
};
|
|
438
|
-
});
|
|
439
|
-
const s = 100, _ = W(() => {
|
|
440
|
-
if (i() === null || i() === 0 || !g().length) return 0;
|
|
441
|
-
const P = g().length * s;
|
|
442
|
-
return Math.min(100, i() / P * 100);
|
|
443
|
-
});
|
|
444
|
-
var f = {
|
|
445
|
-
get data() {
|
|
446
|
-
return g();
|
|
447
|
-
},
|
|
448
|
-
set data(P) {
|
|
449
|
-
g(P), c();
|
|
450
|
-
},
|
|
451
|
-
get timeMs() {
|
|
452
|
-
return i();
|
|
453
|
-
},
|
|
454
|
-
set timeMs(P = null) {
|
|
455
|
-
i(P), c();
|
|
456
|
-
},
|
|
457
|
-
get lineWidth() {
|
|
458
|
-
return o();
|
|
459
|
-
},
|
|
460
|
-
set lineWidth(P = 4) {
|
|
461
|
-
o(P), c();
|
|
462
|
-
}
|
|
463
|
-
}, I = fr(), d = G(I);
|
|
464
|
-
{
|
|
465
|
-
var l = (P) => {
|
|
466
|
-
var b = dr(), j = G(b);
|
|
467
|
-
N(b), H(() => {
|
|
468
|
-
Le(b, `height: ${o() ?? ""}px; border-radius: ${o() / 2}px`), Le(j, `width: ${e(_) ?? ""}%; border-radius: ${o() / 2}px`);
|
|
469
|
-
}), x(P, b);
|
|
470
|
-
};
|
|
471
|
-
K(d, (P) => {
|
|
472
|
-
e(a) && P(l);
|
|
473
|
-
});
|
|
474
|
-
}
|
|
475
|
-
return N(I), Ee(I, (P) => n = P, () => n), x(y, I), ge(f);
|
|
476
|
-
}
|
|
477
|
-
ue(zt, { data: {}, timeMs: {}, lineWidth: {} }, [], [], !0);
|
|
478
|
-
var pr = Me('<path class="waveform-line progress svelte-189wzd8"></path>'), gr = Me('<path class="waveform-line track svelte-189wzd8"></path><!>', 1), yr = F('<div class="container svelte-189wzd8"><svg width="100%" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" preserveAspectRatio="none" class="svelte-189wzd8"><!></svg></div>');
|
|
479
|
-
const hr = {
|
|
480
|
-
hash: "svelte-189wzd8",
|
|
481
|
-
code: "svg.svelte-189wzd8 {box-sizing:border-box;margin:0;padding:0;}.container.svelte-189wzd8 {flex:1;height:100%;box-sizing:border-box;margin:0;padding:0;display:flex;align-items:center;}.waveform-line.svelte-189wzd8 {fill:none;stroke-linecap:round;stroke-linejoin:round;transition:stroke 0.2s;}.track.svelte-189wzd8 {stroke:var(--fortyfour-player-waveform-track-color);}.progress.svelte-189wzd8 {stroke:var(--fortyfour-player-waveform-progress-color);}"
|
|
482
|
-
};
|
|
483
|
-
function Pt(y, t) {
|
|
484
|
-
pe(t, !0), be(y, hr);
|
|
485
|
-
function g(L, M) {
|
|
486
|
-
const z = L.length / M, v = [];
|
|
487
|
-
for (let E = 0; E < M; E++) {
|
|
488
|
-
const Q = Math.floor(E * z), oe = Math.floor((E + 1) * z), w = L.slice(Q, Math.max(Q + 1, oe)), h = w.reduce((S, O) => S + O * O, 0), p = Math.sqrt(h / w.length);
|
|
489
|
-
v.push(p);
|
|
490
|
-
}
|
|
491
|
-
return v;
|
|
492
|
-
}
|
|
493
|
-
let i = u(t, "data", 7), o = u(t, "timeMs", 7, null), r = u(t, "lineWidth", 7, 2), a = q(0), n = q(56), s = q(!1), _ = null;
|
|
494
|
-
Fe(() => {
|
|
495
|
-
const L = new ResizeObserver((M) => {
|
|
496
|
-
for (let z of M)
|
|
497
|
-
z.contentBoxSize ? (m(a, z.contentBoxSize[0]?.inlineSize || z.contentBoxSize.inlineSize, !0), m(n, z.contentBoxSize[0]?.blockSize || z.contentBoxSize.blockSize || 56, !0)) : (m(a, z.contentRect.width, !0), m(n, z.contentRect.height || 56, !0)), m(s, !0);
|
|
498
|
-
});
|
|
499
|
-
return _ && L.observe(_), () => {
|
|
500
|
-
L.disconnect();
|
|
501
|
-
};
|
|
502
|
-
});
|
|
503
|
-
const f = W(() => e(n) / 2), I = W(() => e(n) / 2 * 0.8), d = 100, l = 0.15, P = W(() => Math.max(2, Math.floor(e(a) * l))), b = W(() => g(i(), e(P))), j = W(() => {
|
|
504
|
-
if (o() === null || o() === 0) return 0;
|
|
505
|
-
const L = i().length * d, M = Math.min(1, o() / L), z = r() / 2, v = e(a) - z * 2;
|
|
506
|
-
return z + M * v;
|
|
507
|
-
}), C = W(() => {
|
|
508
|
-
if (!e(b).length || e(a) === 0) return [];
|
|
509
|
-
const L = r() / 2, M = e(a) - L * 2;
|
|
510
|
-
return e(b).map((z, v) => {
|
|
511
|
-
const E = L + v / (e(b).length - 1) * M, Q = Math.max(0.05, z / 100), oe = v % 2 === 0 ? -1 : 1, w = e(f) + oe * Q * e(I);
|
|
512
|
-
return { x: E, y: w };
|
|
513
|
-
});
|
|
514
|
-
});
|
|
515
|
-
function B(L) {
|
|
516
|
-
if (L.length === 0) return "";
|
|
517
|
-
let M = `M ${L[0].x} ${L[0].y}`;
|
|
518
|
-
for (let z = 1; z < L.length; z++) {
|
|
519
|
-
const v = L[z - 1], E = L[z], Q = v.x + (E.x - v.x) / 3, oe = v.y, w = v.x + (E.x - v.x) * 2 / 3, h = E.y;
|
|
520
|
-
M += ` C ${Q} ${oe}, ${w} ${h}, ${E.x} ${E.y}`;
|
|
521
|
-
}
|
|
522
|
-
return M;
|
|
523
|
-
}
|
|
524
|
-
const A = W(() => B(e(C))), X = W(() => {
|
|
525
|
-
if (e(C).length === 0 || e(j) <= 0) return "";
|
|
526
|
-
const L = [];
|
|
527
|
-
let M = null;
|
|
528
|
-
for (let v = 0; v < e(C).length; v++)
|
|
529
|
-
if (e(C)[v].x <= e(j))
|
|
530
|
-
L.push(e(C)[v]);
|
|
531
|
-
else {
|
|
532
|
-
M = e(C)[v];
|
|
533
|
-
break;
|
|
534
|
-
}
|
|
535
|
-
if (L.length === 0) return "";
|
|
536
|
-
const z = L[L.length - 1];
|
|
537
|
-
if (M && z.x < e(j)) {
|
|
538
|
-
const v = (e(j) - z.x) / (M.x - z.x), E = z.y + v * (M.y - z.y);
|
|
539
|
-
L.push({ x: e(j), y: E });
|
|
540
|
-
}
|
|
541
|
-
return B(L);
|
|
542
|
-
});
|
|
543
|
-
var R = {
|
|
544
|
-
get data() {
|
|
545
|
-
return i();
|
|
546
|
-
},
|
|
547
|
-
set data(L) {
|
|
548
|
-
i(L), c();
|
|
549
|
-
},
|
|
550
|
-
get timeMs() {
|
|
551
|
-
return o();
|
|
552
|
-
},
|
|
553
|
-
set timeMs(L = null) {
|
|
554
|
-
o(L), c();
|
|
555
|
-
},
|
|
556
|
-
get lineWidth() {
|
|
557
|
-
return r();
|
|
558
|
-
},
|
|
559
|
-
set lineWidth(L = 2) {
|
|
560
|
-
r(L), c();
|
|
561
|
-
}
|
|
562
|
-
}, V = yr(), k = G(V), D = G(k);
|
|
563
|
-
{
|
|
564
|
-
var T = (L) => {
|
|
565
|
-
var M = gr(), z = J(M), v = ye(z);
|
|
566
|
-
{
|
|
567
|
-
var E = (Q) => {
|
|
568
|
-
var oe = pr();
|
|
569
|
-
H(() => {
|
|
570
|
-
Z(oe, "d", e(X)), Z(oe, "stroke-width", r());
|
|
571
|
-
}), x(Q, oe);
|
|
572
|
-
};
|
|
573
|
-
K(v, (Q) => {
|
|
574
|
-
e(X) && Q(E);
|
|
575
|
-
});
|
|
576
|
-
}
|
|
577
|
-
H(() => {
|
|
578
|
-
Z(z, "d", e(A)), Z(z, "stroke-width", r());
|
|
579
|
-
}), x(L, M);
|
|
580
|
-
};
|
|
581
|
-
K(D, (L) => {
|
|
582
|
-
e(s) && e(A) && L(T);
|
|
583
|
-
});
|
|
584
|
-
}
|
|
585
|
-
return N(k), N(V), Ee(V, (L) => _ = L, () => _), H(() => {
|
|
586
|
-
Z(k, "height", e(n)), Z(k, "viewBox", `0 0 ${e(a)} ${e(n)}`);
|
|
587
|
-
}), x(y, V), ge(R);
|
|
588
|
-
}
|
|
589
|
-
ue(Pt, { data: {}, timeMs: {}, lineWidth: {} }, [], [], !0);
|
|
590
|
-
var mr = F('<div class="waveform-wrapper svelte-h4vbiy"><!></div>'), br = F('<div part="placeholder" class="waveform-wrapper svelte-h4vbiy"><!></div>'), wr = F('<div part="container" class="container svelte-h4vbiy"><!></div>');
|
|
591
|
-
const xr = {
|
|
592
|
-
hash: "svelte-h4vbiy",
|
|
593
|
-
code: ":host {--fortyfour-player-waveform-height: 56px;--fortyfour-player-waveform-progress-color: #3b82f6;--fortyfour-player-waveform-track-color: #d1d5db;--fortyfour-player-waveform-bar-radius: 1px;display:block;width:100%;}.container.svelte-h4vbiy {width:100%;height:var(--fortyfour-player-waveform-height);display:flex;align-items:center;}.waveform-wrapper.svelte-h4vbiy {flex:1;height:100%;display:flex;align-items:center;}"
|
|
594
|
-
};
|
|
595
|
-
function _r(y, t) {
|
|
596
|
-
pe(t, !0), be(y, xr);
|
|
597
|
-
const g = (R, V = Qe, k = Qe) => {
|
|
598
|
-
var D = ee(), T = J(D);
|
|
599
|
-
{
|
|
600
|
-
var L = (z) => {
|
|
601
|
-
zt(z, {
|
|
602
|
-
get data() {
|
|
603
|
-
return V();
|
|
604
|
-
},
|
|
605
|
-
get timeMs() {
|
|
606
|
-
return k();
|
|
607
|
-
},
|
|
608
|
-
get lineWidth() {
|
|
609
|
-
return s();
|
|
610
|
-
}
|
|
611
|
-
});
|
|
612
|
-
}, M = (z) => {
|
|
613
|
-
var v = ee(), E = J(v);
|
|
614
|
-
{
|
|
615
|
-
var Q = (w) => {
|
|
616
|
-
Pt(w, {
|
|
617
|
-
get data() {
|
|
618
|
-
return V();
|
|
619
|
-
},
|
|
620
|
-
get timeMs() {
|
|
621
|
-
return k();
|
|
622
|
-
},
|
|
623
|
-
get lineWidth() {
|
|
624
|
-
return s();
|
|
625
|
-
}
|
|
626
|
-
});
|
|
627
|
-
}, oe = (w) => {
|
|
628
|
-
kt(w, {
|
|
629
|
-
get data() {
|
|
630
|
-
return V();
|
|
631
|
-
},
|
|
632
|
-
get timeMs() {
|
|
633
|
-
return k();
|
|
634
|
-
},
|
|
635
|
-
get barWidth() {
|
|
636
|
-
return a();
|
|
637
|
-
},
|
|
638
|
-
get spacing() {
|
|
639
|
-
return n();
|
|
640
|
-
},
|
|
641
|
-
get minHeight() {
|
|
642
|
-
return _();
|
|
643
|
-
}
|
|
644
|
-
});
|
|
645
|
-
};
|
|
646
|
-
K(
|
|
647
|
-
E,
|
|
648
|
-
(w) => {
|
|
649
|
-
r() === "smooth" ? w(Q) : w(oe, !1);
|
|
650
|
-
},
|
|
651
|
-
!0
|
|
652
|
-
);
|
|
653
|
-
}
|
|
654
|
-
x(z, v);
|
|
655
|
-
};
|
|
656
|
-
K(T, (z) => {
|
|
657
|
-
r() === "progress" ? z(L) : z(M, !1);
|
|
658
|
-
});
|
|
659
|
-
}
|
|
660
|
-
x(R, D);
|
|
661
|
-
}, i = t.$$host;
|
|
662
|
-
let o = u(t, "for", 7, ""), r = u(t, "type", 7, "bars"), a = u(t, "barWidth", 7, 3), n = u(t, "barSpacing", 7, 1), s = u(t, "lineWidth", 7, 4), _ = u(t, "barMinHeight", 7, 3), f = q(null), I = q(0), d = q("none");
|
|
663
|
-
const l = it(() => e(f) === null, 200), P = W(() => e(f) !== null && e(f).length > 0 ? !1 : e(d) === "none" ? !0 : l());
|
|
664
|
-
me(() => {
|
|
665
|
-
if (!o()) {
|
|
666
|
-
console.warn("fortyfour-player-waveform: 'for' attribute is required to link to a player");
|
|
667
|
-
return;
|
|
668
|
-
}
|
|
669
|
-
const R = document.getElementById(o());
|
|
670
|
-
if (!R) {
|
|
671
|
-
console.warn(`fortyfour-player-waveform: No player found with id '${o()}'`);
|
|
672
|
-
return;
|
|
673
|
-
}
|
|
674
|
-
m(d, R.getAttribute("preload") || "none", !0), R.waveform && R.waveform.length > 0 && m(f, R.waveform, !0), R.currentTime && m(I, R.currentTime, !0);
|
|
675
|
-
function V(D) {
|
|
676
|
-
m(f, D.detail?.waveform, !0);
|
|
677
|
-
}
|
|
678
|
-
function k(D) {
|
|
679
|
-
m(I, D.detail.currentTime, !0);
|
|
680
|
-
}
|
|
681
|
-
return R.addEventListener("loadedmetadata", V), R.addEventListener("timeupdate", k), () => {
|
|
682
|
-
R.removeEventListener("loadedmetadata", V), R.removeEventListener("timeupdate", k);
|
|
683
|
-
};
|
|
684
|
-
}), lt(i, "data-placeholder", () => e(P));
|
|
685
|
-
const b = Array(100).fill(0);
|
|
686
|
-
var j = {
|
|
687
|
-
get for() {
|
|
688
|
-
return o();
|
|
689
|
-
},
|
|
690
|
-
set for(R = "") {
|
|
691
|
-
o(R), c();
|
|
692
|
-
},
|
|
693
|
-
get type() {
|
|
694
|
-
return r();
|
|
695
|
-
},
|
|
696
|
-
set type(R = "bars") {
|
|
697
|
-
r(R), c();
|
|
698
|
-
},
|
|
699
|
-
get barWidth() {
|
|
700
|
-
return a();
|
|
701
|
-
},
|
|
702
|
-
set barWidth(R = 3) {
|
|
703
|
-
a(R), c();
|
|
704
|
-
},
|
|
705
|
-
get barSpacing() {
|
|
706
|
-
return n();
|
|
707
|
-
},
|
|
708
|
-
set barSpacing(R = 1) {
|
|
709
|
-
n(R), c();
|
|
710
|
-
},
|
|
711
|
-
get lineWidth() {
|
|
712
|
-
return s();
|
|
713
|
-
},
|
|
714
|
-
set lineWidth(R = 4) {
|
|
715
|
-
s(R), c();
|
|
716
|
-
},
|
|
717
|
-
get barMinHeight() {
|
|
718
|
-
return _();
|
|
719
|
-
},
|
|
720
|
-
set barMinHeight(R = 3) {
|
|
721
|
-
_(R), c();
|
|
722
|
-
}
|
|
723
|
-
}, C = wr(), B = G(C);
|
|
724
|
-
{
|
|
725
|
-
var A = (R) => {
|
|
726
|
-
var V = mr(), k = G(V);
|
|
727
|
-
g(k, () => e(f), () => e(I)), N(V), ze(1, V, () => Pe, () => ({ duration: 400 })), x(R, V);
|
|
728
|
-
}, X = (R) => {
|
|
729
|
-
var V = ee(), k = J(V);
|
|
730
|
-
{
|
|
731
|
-
var D = (T) => {
|
|
732
|
-
var L = ee(), M = J(L);
|
|
733
|
-
Ce(M, t, "placeholder", {}, (z) => {
|
|
734
|
-
var v = br(), E = G(v);
|
|
735
|
-
g(E, () => b, () => 0), N(v), x(z, v);
|
|
736
|
-
}), x(T, L);
|
|
737
|
-
};
|
|
738
|
-
K(
|
|
739
|
-
k,
|
|
740
|
-
(T) => {
|
|
741
|
-
e(P) && T(D);
|
|
742
|
-
},
|
|
743
|
-
!0
|
|
744
|
-
);
|
|
745
|
-
}
|
|
746
|
-
x(R, V);
|
|
747
|
-
};
|
|
748
|
-
K(B, (R) => {
|
|
749
|
-
e(f) && e(f).length > 0 ? R(A) : R(X, !1);
|
|
750
|
-
});
|
|
751
|
-
}
|
|
752
|
-
return N(C), x(y, C), ge(j);
|
|
753
|
-
}
|
|
754
|
-
customElements.define("fortyfour-player-waveform", ue(
|
|
755
|
-
_r,
|
|
756
|
-
{
|
|
757
|
-
for: { attribute: "for" },
|
|
758
|
-
type: { attribute: "type" },
|
|
759
|
-
barWidth: { attribute: "bar-width", type: "Number" },
|
|
760
|
-
barSpacing: { attribute: "bar-spacing", type: "Number" },
|
|
761
|
-
lineWidth: { attribute: "line-width", type: "Number" },
|
|
762
|
-
barMinHeight: { attribute: "bar-min-height", type: "Number" }
|
|
763
|
-
},
|
|
764
|
-
["placeholder"],
|
|
765
|
-
[],
|
|
766
|
-
!0
|
|
767
|
-
));
|
|
768
|
-
var kr = (y, t) => m(t, y.target.value !== "original"), zr = F('<div class="language-select svelte-1cjx9l7"><select class="svelte-1cjx9l7"><option>Original</option><option>English</option></select></div>'), Pr = F('<div class="content svelte-1cjx9l7"><div class="text svelte-1cjx9l7"> </div></div>'), Lr = F("<span> </span>"), jr = F('<div class="content svelte-1cjx9l7"><div class="text caption-text svelte-1cjx9l7"></div></div>'), Ir = F("<span> </span>"), Er = F('<div class="text caption-text subtitle svelte-1cjx9l7"></div>'), Mr = F('<div class="content subtitle-content svelte-1cjx9l7"><!></div>'), Sr = F("<span> </span>"), Tr = F('<div class="content svelte-1cjx9l7"><div class="text caption-text svelte-1cjx9l7"></div></div>'), Rr = (y, t) => m(t, !0), Cr = F('... <button class="toggle-btn svelte-1cjx9l7">Show more</button>', 1), Hr = (y, t) => m(t, !1), Wr = F('<button class="toggle-btn svelte-1cjx9l7">Show less</button>'), Br = F('<div class="content svelte-1cjx9l7"><div class="text svelte-1cjx9l7"> <!></div></div>'), Ar = F('<div class="placeholder-lines svelte-1cjx9l7"><span class="placeholder-line svelte-1cjx9l7"></span> <span class="placeholder-line short svelte-1cjx9l7"></span></div>'), qr = F('<div class="container svelte-1cjx9l7"><!> <!></div>');
|
|
769
|
-
const Nr = {
|
|
770
|
-
hash: "svelte-1cjx9l7",
|
|
771
|
-
code: `:host {--fortyfour-player-transcription-placeholder-color: #e5e7eb;--fortyfour-player-transcription-color: #64748b;--fortyfour-player-transcription-active-color: #1e293b;--fortyfour-player-transcription-active-bg: #fef08a;--fortyfour-player-transcription-past-color: #1e293b;display:block;}.container.svelte-1cjx9l7 {width:100%;}.content.svelte-1cjx9l7 {width:100%;}.text.svelte-1cjx9l7 {white-space:pre-wrap;word-wrap:break-word;}.caption-text.svelte-1cjx9l7 {white-space:normal;color:var(--fortyfour-player-transcription-color);}.word.svelte-1cjx9l7 {transition:color 0.15s ease,
|
|
772
|
-
background-color 0.15s ease;border-radius:2px;padding:0 1px;margin:0 -1px;}.word.active[data-type="word"].svelte-1cjx9l7 {color:var(--fortyfour-player-transcription-active-color);background-color:var(--fortyfour-player-transcription-active-bg);}.word.past[data-type="word"].svelte-1cjx9l7 {color:var(--fortyfour-player-transcription-past-color);}.subtitle-content.svelte-1cjx9l7 {min-height:2em;display:flex;align-items:center;justify-content:center;}.subtitle.svelte-1cjx9l7 {text-align:center;}.toggle-btn.svelte-1cjx9l7 {font-size:0.75em;padding:0.25em 0.5em;margin-left:0.5em;border:1px solid currentColor;border-radius:4px;background:transparent;color:inherit;cursor:pointer;opacity:0.7;}.toggle-btn.svelte-1cjx9l7:hover {opacity:1;}.language-select.svelte-1cjx9l7 {margin-bottom:0.5em;}.language-select.svelte-1cjx9l7 select:where(.svelte-1cjx9l7) {font-size:0.75em;padding:0.25em 0.5em;border:1px solid currentColor;border-radius:4px;background:transparent;color:inherit;cursor:pointer;opacity:0.7;}.language-select.svelte-1cjx9l7 select:where(.svelte-1cjx9l7):hover {opacity:1;}.placeholder-lines.svelte-1cjx9l7 {display:flex;flex-direction:column;gap:0.5em;}.placeholder-line.svelte-1cjx9l7 {display:block;height:1em;background-color:var(--fortyfour-player-transcription-placeholder-color);border-radius:4px;}.placeholder-line.short.svelte-1cjx9l7 {width:60%;}`
|
|
773
|
-
};
|
|
774
|
-
function Dr(y, t) {
|
|
775
|
-
pe(t, !0), be(y, Nr);
|
|
776
|
-
const g = t.$$host;
|
|
777
|
-
let i = u(t, "for", 7, ""), o = u(t, "truncate", 7, 200), r = u(t, "mode", 7, "static"), a = q(null), n = q(null), s = q(null), _ = q(!1), f = q(!1), I = q("none"), d = q(0);
|
|
778
|
-
const l = it(() => e(a) === null, 200), P = W(() => e(a) !== null ? !1 : e(I) === "none" ? !0 : l()), b = W(() => e(_) && e(n) ? e(n) : e(a)), j = W(() => r() === "static" && o() > 0 && e(b) && e(b).length > o()), C = W(() => e(b) ? e(j) && !e(f) ? e(b).slice(0, o()) : e(b) : ""), B = W(() => e(n) !== null && e(n) !== ""), A = W(() => e(s) !== null && e(s).length > 0), X = W(() => !e(A) || r() === "static" ? -1 : e(s).findIndex((w) => e(d) >= w.start && e(d) <= w.end));
|
|
779
|
-
function R(w) {
|
|
780
|
-
const h = [];
|
|
781
|
-
let p = { words: [], start: 0, end: 0 };
|
|
782
|
-
for (const S of w) {
|
|
783
|
-
p.words.length === 0 && (p.start = S.start), p.words.push(S), p.end = S.end;
|
|
784
|
-
const O = S.text.trim();
|
|
785
|
-
(O.endsWith(".") || O.endsWith("?") || O.endsWith("!")) && (h.push(p), p = { words: [], start: 0, end: 0 });
|
|
786
|
-
}
|
|
787
|
-
return p.words.length > 0 && h.push(p), h;
|
|
788
|
-
}
|
|
789
|
-
const V = W(() => e(A) ? R(e(s)) : []), k = W(() => r() !== "subtitle" || e(V).length === 0 ? null : e(V).find((w) => e(d) >= w.start && e(d) <= w.end) ?? null);
|
|
790
|
-
function D(w) {
|
|
791
|
-
return e(d) >= w.start && e(d) <= w.end;
|
|
792
|
-
}
|
|
793
|
-
function T(w) {
|
|
794
|
-
return e(d) > w.end;
|
|
795
|
-
}
|
|
796
|
-
me(() => {
|
|
797
|
-
if (!i()) {
|
|
798
|
-
console.warn("fortyfour-player-transcription: 'for' attribute is required");
|
|
799
|
-
return;
|
|
800
|
-
}
|
|
801
|
-
const w = document.getElementById(i());
|
|
802
|
-
if (!w) {
|
|
803
|
-
console.warn(`fortyfour-player-transcription: No player found with id '${i()}'`);
|
|
804
|
-
return;
|
|
805
|
-
}
|
|
806
|
-
m(I, w.getAttribute("preload") || "none", !0), w.transcription && m(a, w.transcription, !0), w.translation && m(n, w.translation, !0), w.words && m(s, w.words, !0), w.currentTime && m(d, w.currentTime, !0);
|
|
807
|
-
function h(S) {
|
|
808
|
-
m(a, S.detail?.transcription ?? null, !0), m(n, S.detail?.translation ?? null, !0), m(s, S.detail?.words ?? null, !0);
|
|
809
|
-
}
|
|
810
|
-
function p(S) {
|
|
811
|
-
m(d, S.detail.currentTime, !0);
|
|
812
|
-
}
|
|
813
|
-
return w.addEventListener("loadedmetadata", h), w.addEventListener("timeupdate", p), () => {
|
|
814
|
-
w.removeEventListener("loadedmetadata", h), w.removeEventListener("timeupdate", p);
|
|
815
|
-
};
|
|
816
|
-
}), lt(g, "data-placeholder", () => e(P));
|
|
817
|
-
var L = {
|
|
818
|
-
get for() {
|
|
819
|
-
return i();
|
|
820
|
-
},
|
|
821
|
-
set for(w = "") {
|
|
822
|
-
i(w), c();
|
|
823
|
-
},
|
|
824
|
-
get truncate() {
|
|
825
|
-
return o();
|
|
826
|
-
},
|
|
827
|
-
set truncate(w = 200) {
|
|
828
|
-
o(w), c();
|
|
829
|
-
},
|
|
830
|
-
get mode() {
|
|
831
|
-
return r();
|
|
832
|
-
},
|
|
833
|
-
set mode(w = "static") {
|
|
834
|
-
r(w), c();
|
|
835
|
-
}
|
|
836
|
-
}, M = qr(), z = G(M);
|
|
837
|
-
{
|
|
838
|
-
var v = (w) => {
|
|
839
|
-
var h = zr(), p = G(h);
|
|
840
|
-
p.__change = [kr, _];
|
|
841
|
-
var S = G(p);
|
|
842
|
-
S.value = S.__value = "original";
|
|
843
|
-
var O = ye(S);
|
|
844
|
-
O.value = O.__value = "en", N(p), N(h), x(w, h);
|
|
845
|
-
};
|
|
846
|
-
K(z, (w) => {
|
|
847
|
-
e(B) && w(v);
|
|
848
|
-
});
|
|
849
|
-
}
|
|
850
|
-
var E = ye(z, 2);
|
|
851
|
-
{
|
|
852
|
-
var Q = (w) => {
|
|
853
|
-
var h = Pr(), p = G(h), S = G(p, !0);
|
|
854
|
-
N(p), N(h), H(() => je(S, e(n))), ze(1, h, () => Pe, () => ({ duration: 400 })), x(w, h);
|
|
855
|
-
}, oe = (w) => {
|
|
856
|
-
var h = ee(), p = J(h);
|
|
857
|
-
{
|
|
858
|
-
var S = ($) => {
|
|
859
|
-
var Y = jr(), ce = G(Y);
|
|
860
|
-
Be(ce, 21, () => e(s), Ae, (U, re, ne) => {
|
|
861
|
-
var ie = Lr();
|
|
862
|
-
let ve;
|
|
863
|
-
var de = G(ie, !0);
|
|
864
|
-
N(ie), H(
|
|
865
|
-
(ae) => {
|
|
866
|
-
ve = fe(ie, 1, "word svelte-1cjx9l7", null, ve, ae), Z(ie, "data-type", e(re).type), je(de, e(re).text);
|
|
867
|
-
},
|
|
868
|
-
[
|
|
869
|
-
() => ({
|
|
870
|
-
active: ne === e(X),
|
|
871
|
-
past: ne < e(X)
|
|
872
|
-
})
|
|
873
|
-
]
|
|
874
|
-
), x(U, ie);
|
|
875
|
-
}), N(ce), N(Y), ze(1, Y, () => Pe, () => ({ duration: 400 })), x($, Y);
|
|
876
|
-
}, O = ($) => {
|
|
877
|
-
var Y = ee(), ce = J(Y);
|
|
878
|
-
{
|
|
879
|
-
var U = (ne) => {
|
|
880
|
-
var ie = Mr(), ve = G(ie);
|
|
881
|
-
{
|
|
882
|
-
var de = (ae) => {
|
|
883
|
-
var he = Er();
|
|
884
|
-
Be(he, 21, () => e(k).words, Ae, (le, se) => {
|
|
885
|
-
var xe = Ir();
|
|
886
|
-
let _e;
|
|
887
|
-
var we = G(xe, !0);
|
|
888
|
-
N(xe), H(
|
|
889
|
-
(ke) => {
|
|
890
|
-
_e = fe(xe, 1, "word svelte-1cjx9l7", null, _e, ke), Z(xe, "data-type", e(se).type), je(we, e(se).text);
|
|
891
|
-
},
|
|
892
|
-
[
|
|
893
|
-
() => ({
|
|
894
|
-
active: D(e(se)),
|
|
895
|
-
past: T(e(se))
|
|
896
|
-
})
|
|
897
|
-
]
|
|
898
|
-
), x(le, xe);
|
|
899
|
-
}), N(he), ze(1, he, () => Pe, () => ({ duration: 200 })), x(ae, he);
|
|
900
|
-
};
|
|
901
|
-
K(ve, (ae) => {
|
|
902
|
-
e(k) && ae(de);
|
|
903
|
-
});
|
|
904
|
-
}
|
|
905
|
-
N(ie), x(ne, ie);
|
|
906
|
-
}, re = (ne) => {
|
|
907
|
-
var ie = ee(), ve = J(ie);
|
|
908
|
-
{
|
|
909
|
-
var de = (he) => {
|
|
910
|
-
var le = Tr(), se = G(le);
|
|
911
|
-
Be(se, 21, () => e(s), Ae, (xe, _e, we) => {
|
|
912
|
-
var ke = ee(), Se = J(ke);
|
|
913
|
-
{
|
|
914
|
-
var He = (Re) => {
|
|
915
|
-
var Te = Sr();
|
|
916
|
-
let Ke;
|
|
917
|
-
var We = G(Te, !0);
|
|
918
|
-
N(Te), H(
|
|
919
|
-
(qe) => {
|
|
920
|
-
Ke = fe(Te, 1, "word svelte-1cjx9l7", null, Ke, qe), Z(Te, "data-type", e(_e).type), je(We, e(_e).text);
|
|
921
|
-
},
|
|
922
|
-
[() => ({ active: we === e(X) })]
|
|
923
|
-
), ze(1, Te, () => Pe, () => ({ duration: 150 })), x(Re, Te);
|
|
924
|
-
};
|
|
925
|
-
K(Se, (Re) => {
|
|
926
|
-
e(d) >= e(_e).start && Re(He);
|
|
927
|
-
});
|
|
928
|
-
}
|
|
929
|
-
x(xe, ke);
|
|
930
|
-
}), N(se), N(le), ze(1, le, () => Pe, () => ({ duration: 400 })), x(he, le);
|
|
931
|
-
}, ae = (he) => {
|
|
932
|
-
var le = ee(), se = J(le);
|
|
933
|
-
{
|
|
934
|
-
var xe = (we) => {
|
|
935
|
-
var ke = Br(), Se = G(ke), He = G(Se, !0), Re = ye(He);
|
|
936
|
-
{
|
|
937
|
-
var Te = (We) => {
|
|
938
|
-
var qe = Cr(), Ze = ye(J(qe));
|
|
939
|
-
Ze.__click = [Rr, f], x(We, qe);
|
|
940
|
-
}, Ke = (We) => {
|
|
941
|
-
var qe = ee(), Ze = J(qe);
|
|
942
|
-
{
|
|
943
|
-
var Ht = (Je) => {
|
|
944
|
-
var vt = Wr();
|
|
945
|
-
vt.__click = [Hr, f], x(Je, vt);
|
|
946
|
-
};
|
|
947
|
-
K(
|
|
948
|
-
Ze,
|
|
949
|
-
(Je) => {
|
|
950
|
-
e(j) && e(f) && Je(Ht);
|
|
951
|
-
},
|
|
952
|
-
!0
|
|
953
|
-
);
|
|
954
|
-
}
|
|
955
|
-
x(We, qe);
|
|
956
|
-
};
|
|
957
|
-
K(Re, (We) => {
|
|
958
|
-
e(j) && !e(f) ? We(Te) : We(Ke, !1);
|
|
959
|
-
});
|
|
960
|
-
}
|
|
961
|
-
N(Se), N(ke), H(() => je(He, e(C))), ze(1, ke, () => Pe, () => ({ duration: 400 })), x(we, ke);
|
|
962
|
-
}, _e = (we) => {
|
|
963
|
-
var ke = ee(), Se = J(ke);
|
|
964
|
-
{
|
|
965
|
-
var He = (Re) => {
|
|
966
|
-
var Te = Ar();
|
|
967
|
-
x(Re, Te);
|
|
968
|
-
};
|
|
969
|
-
K(
|
|
970
|
-
Se,
|
|
971
|
-
(Re) => {
|
|
972
|
-
e(P) && Re(He);
|
|
973
|
-
},
|
|
974
|
-
!0
|
|
975
|
-
);
|
|
976
|
-
}
|
|
977
|
-
x(we, ke);
|
|
978
|
-
};
|
|
979
|
-
K(
|
|
980
|
-
se,
|
|
981
|
-
(we) => {
|
|
982
|
-
e(a) ? we(xe) : we(_e, !1);
|
|
983
|
-
},
|
|
984
|
-
!0
|
|
985
|
-
);
|
|
986
|
-
}
|
|
987
|
-
x(he, le);
|
|
988
|
-
};
|
|
989
|
-
K(
|
|
990
|
-
ve,
|
|
991
|
-
(he) => {
|
|
992
|
-
r() === "progressive" && e(A) ? he(de) : he(ae, !1);
|
|
993
|
-
},
|
|
994
|
-
!0
|
|
995
|
-
);
|
|
996
|
-
}
|
|
997
|
-
x(ne, ie);
|
|
998
|
-
};
|
|
999
|
-
K(
|
|
1000
|
-
ce,
|
|
1001
|
-
(ne) => {
|
|
1002
|
-
r() === "subtitle" && e(A) ? ne(U) : ne(re, !1);
|
|
1003
|
-
},
|
|
1004
|
-
!0
|
|
1005
|
-
);
|
|
1006
|
-
}
|
|
1007
|
-
x($, Y);
|
|
1008
|
-
};
|
|
1009
|
-
K(
|
|
1010
|
-
p,
|
|
1011
|
-
($) => {
|
|
1012
|
-
r() === "karaoke" && e(A) ? $(S) : $(O, !1);
|
|
1013
|
-
},
|
|
1014
|
-
!0
|
|
1015
|
-
);
|
|
1016
|
-
}
|
|
1017
|
-
x(w, h);
|
|
1018
|
-
};
|
|
1019
|
-
K(E, (w) => {
|
|
1020
|
-
e(_) && e(B) ? w(Q) : w(oe, !1);
|
|
1021
|
-
});
|
|
1022
|
-
}
|
|
1023
|
-
return N(M), x(y, M), ge(L);
|
|
1024
|
-
}
|
|
1025
|
-
Ne(["change", "click"]);
|
|
1026
|
-
customElements.define("fortyfour-player-transcription", ue(
|
|
1027
|
-
Dr,
|
|
1028
|
-
{
|
|
1029
|
-
for: { attribute: "for" },
|
|
1030
|
-
truncate: { attribute: "truncate", type: "Number" },
|
|
1031
|
-
mode: { attribute: "mode" }
|
|
1032
|
-
},
|
|
1033
|
-
[],
|
|
1034
|
-
[],
|
|
1035
|
-
!0
|
|
1036
|
-
));
|
|
1037
|
-
const et = {
|
|
41
|
+
const Oe = {
|
|
1038
42
|
delay: 0
|
|
1039
43
|
};
|
|
1040
|
-
typeof window < "u" && (window.__44_dev =
|
|
1041
|
-
function
|
|
1042
|
-
return new Promise((
|
|
44
|
+
typeof window < "u" && (window.__44_dev = Oe);
|
|
45
|
+
function Tr(g) {
|
|
46
|
+
return new Promise((r) => setTimeout(r, g));
|
|
1043
47
|
}
|
|
1044
|
-
async function
|
|
1045
|
-
const
|
|
1046
|
-
|
|
1047
|
-
const
|
|
1048
|
-
if (!
|
|
1049
|
-
throw
|
|
1050
|
-
const
|
|
1051
|
-
if (
|
|
1052
|
-
throw new Error(`Recording not ready: ${
|
|
1053
|
-
return
|
|
48
|
+
async function Mr(g, r, c) {
|
|
49
|
+
const n = `https://${r}/v1/recordings/${c}/player`;
|
|
50
|
+
Oe.delay > 0 && await Tr(Oe.delay);
|
|
51
|
+
const a = await fetch(n, { signal: g });
|
|
52
|
+
if (!a.ok)
|
|
53
|
+
throw a.status === 404 ? new Error(`Recording not found: ${c}`) : new Error(`Failed to fetch recording (${a.status})`);
|
|
54
|
+
const o = await a.json();
|
|
55
|
+
if (o.status !== "ready")
|
|
56
|
+
throw new Error(`Recording not ready: ${c}`);
|
|
57
|
+
return o;
|
|
1054
58
|
}
|
|
1055
|
-
var
|
|
1056
|
-
function
|
|
1057
|
-
|
|
1058
|
-
const
|
|
1059
|
-
let
|
|
1060
|
-
const
|
|
1061
|
-
waveform: e(
|
|
1062
|
-
transcription: e(
|
|
1063
|
-
translation: e(
|
|
1064
|
-
words: e(
|
|
59
|
+
var Hr = K("<audio hidden></audio>");
|
|
60
|
+
function jr(g, r) {
|
|
61
|
+
ge(r, !0);
|
|
62
|
+
const c = r.$$host;
|
|
63
|
+
let n = d(r, "recordingId", 7), a = d(r, "apiHost", 7, "api.44.audio"), o = d(r, "preload", 7, "none"), i = q(null), l = q(null), y = q(0), h = q(0), f = q("idle"), x = null, u = null;
|
|
64
|
+
const s = S(() => ({
|
|
65
|
+
waveform: e(i)?.waveform ?? [],
|
|
66
|
+
transcription: e(i)?.transcription ?? null,
|
|
67
|
+
translation: e(i)?.translation ?? null,
|
|
68
|
+
words: e(i)?.words ?? null
|
|
1065
69
|
}));
|
|
1066
|
-
function
|
|
1067
|
-
|
|
70
|
+
function k() {
|
|
71
|
+
c.duration = e(h), c.currentTime = e(y), c.state = e(f), c.metadata = e(s), c.setAttribute("data-state", e(f));
|
|
1068
72
|
}
|
|
1069
|
-
function b
|
|
1070
|
-
|
|
73
|
+
function p(b) {
|
|
74
|
+
k(), c.dispatchEvent(new CustomEvent(b, { bubbles: !0, composed: !0 }));
|
|
1071
75
|
}
|
|
1072
|
-
function
|
|
1073
|
-
if (!e(
|
|
1074
|
-
|
|
76
|
+
function w() {
|
|
77
|
+
if (!e(l)) {
|
|
78
|
+
u = null;
|
|
1075
79
|
return;
|
|
1076
80
|
}
|
|
1077
|
-
m(
|
|
81
|
+
m(y, Math.floor(e(l).currentTime * 1e3), !0), p("timeupdate"), u = requestAnimationFrame(w);
|
|
1078
82
|
}
|
|
1079
83
|
async function C() {
|
|
1080
84
|
if (e(f) === "idle") {
|
|
1081
|
-
if (!
|
|
85
|
+
if (!n()) {
|
|
1082
86
|
console.warn("fortyfour-recording: recording-id attribute is required");
|
|
1083
87
|
return;
|
|
1084
88
|
}
|
|
1085
|
-
|
|
89
|
+
x = new AbortController(), m(f, "loading"), p("loading");
|
|
1086
90
|
try {
|
|
1087
|
-
const
|
|
1088
|
-
m(
|
|
1089
|
-
} catch (
|
|
1090
|
-
if (
|
|
91
|
+
const b = await Mr(x.signal, a(), n());
|
|
92
|
+
m(i, b, !0), m(h, b.duration, !0), m(f, "ready"), p("loadedmetadata");
|
|
93
|
+
} catch (b) {
|
|
94
|
+
if (b.name === "AbortError")
|
|
1091
95
|
return;
|
|
1092
|
-
console.warn(`fortyfour-recording: ${
|
|
96
|
+
console.warn(`fortyfour-recording: ${b.message}`), m(f, "error"), p("error");
|
|
1093
97
|
}
|
|
1094
98
|
}
|
|
1095
99
|
}
|
|
1096
|
-
async function
|
|
1097
|
-
if (!e(
|
|
100
|
+
async function U() {
|
|
101
|
+
if (!e(l)) {
|
|
1098
102
|
console.warn("fortyfour-recording: play() called but audio element not ready");
|
|
1099
103
|
return;
|
|
1100
104
|
}
|
|
1101
105
|
try {
|
|
1102
|
-
await e(
|
|
1103
|
-
} catch (
|
|
1104
|
-
console.warn(`fortyfour-recording: ${
|
|
106
|
+
await e(l).play(), m(f, "playing"), p("play"), u || w();
|
|
107
|
+
} catch (b) {
|
|
108
|
+
console.warn(`fortyfour-recording: ${b.message}`), m(f, "error"), p("error");
|
|
1105
109
|
}
|
|
1106
110
|
}
|
|
1107
|
-
function
|
|
1108
|
-
if (!e(
|
|
111
|
+
function X() {
|
|
112
|
+
if (!e(l)) {
|
|
1109
113
|
console.warn("fortyfour-recording: pause() called but audio element not ready");
|
|
1110
114
|
return;
|
|
1111
115
|
}
|
|
1112
|
-
e(
|
|
116
|
+
e(l).pause(), m(f, "paused"), cancelAnimationFrame(u), u = null, p("pause");
|
|
1113
117
|
}
|
|
1114
|
-
async function
|
|
118
|
+
async function F() {
|
|
1115
119
|
if (e(f) === "error") {
|
|
1116
120
|
console.warn("fortyfour-recording: togglePlay() called while in error state");
|
|
1117
121
|
return;
|
|
1118
122
|
}
|
|
1119
|
-
e(f) !== "loading" && (e(f) === "playing" ?
|
|
123
|
+
e(f) !== "loading" && (e(f) === "playing" ? X() : e(f) === "idle" ? (await C(), await er(), e(f) === "ready" && await U()) : await U());
|
|
1120
124
|
}
|
|
1121
|
-
function
|
|
1122
|
-
if (!e(
|
|
125
|
+
function te(b) {
|
|
126
|
+
if (!e(l)) {
|
|
1123
127
|
console.warn("fortyfour-recording: seek() called but audio element not ready");
|
|
1124
128
|
return;
|
|
1125
129
|
}
|
|
1126
|
-
if (typeof
|
|
1127
|
-
console.warn("fortyfour-recording: seek() called with invalid time:",
|
|
130
|
+
if (typeof b != "number" || Number.isNaN(b)) {
|
|
131
|
+
console.warn("fortyfour-recording: seek() called with invalid time:", b);
|
|
1128
132
|
return;
|
|
1129
133
|
}
|
|
1130
|
-
if (
|
|
1131
|
-
console.warn("fortyfour-recording: seek() time out of range:",
|
|
134
|
+
if (b < 0 || b > e(h)) {
|
|
135
|
+
console.warn("fortyfour-recording: seek() time out of range:", b, "duration:", e(h));
|
|
1132
136
|
return;
|
|
1133
137
|
}
|
|
1134
|
-
e(
|
|
138
|
+
e(l).currentTime = b / 1e3, m(y, Math.floor(b), !0), p("timeupdate");
|
|
1135
139
|
}
|
|
1136
140
|
async function V() {
|
|
1137
|
-
cancelAnimationFrame(
|
|
141
|
+
cancelAnimationFrame(u), u = null, m(y, e(h), !0), p("timeupdate"), await er(), m(y, 0), e(l).currentTime = 0, p("timeupdate"), m(f, "ready"), p("ended");
|
|
1138
142
|
}
|
|
1139
|
-
function
|
|
1140
|
-
console.warn("fortyfour-recording: audio error",
|
|
143
|
+
function H(b) {
|
|
144
|
+
console.warn("fortyfour-recording: audio error", b.target.error), m(f, "error"), p("error");
|
|
1141
145
|
}
|
|
1142
|
-
function
|
|
1143
|
-
|
|
146
|
+
function be() {
|
|
147
|
+
x?.abort(), cancelAnimationFrame(u), u = null, e(l)?.pause(), m(i, null), m(y, 0), m(h, 0), m(f, "idle"), I = n(), p("timeupdate");
|
|
1144
148
|
}
|
|
1145
|
-
let
|
|
1146
|
-
|
|
1147
|
-
|
|
1148
|
-
}),
|
|
1149
|
-
|
|
149
|
+
let I = n();
|
|
150
|
+
de(() => {
|
|
151
|
+
n() !== I && be(), e(f) === "idle" && (o() === "auto" || o() === "metadata") && C();
|
|
152
|
+
}), c.togglePlay = F, c.seek = te, k(), Lr(() => {
|
|
153
|
+
x?.abort(), e(l)?.pause(), cancelAnimationFrame(u);
|
|
1150
154
|
});
|
|
1151
|
-
var
|
|
155
|
+
var j = {
|
|
1152
156
|
get recordingId() {
|
|
1153
|
-
return
|
|
157
|
+
return n();
|
|
1154
158
|
},
|
|
1155
|
-
set recordingId(
|
|
1156
|
-
|
|
159
|
+
set recordingId(b) {
|
|
160
|
+
n(b), v();
|
|
1157
161
|
},
|
|
1158
162
|
get apiHost() {
|
|
1159
|
-
return
|
|
163
|
+
return a();
|
|
1160
164
|
},
|
|
1161
|
-
set apiHost(
|
|
1162
|
-
|
|
165
|
+
set apiHost(b = "api.44.audio") {
|
|
166
|
+
a(b), v();
|
|
1163
167
|
},
|
|
1164
168
|
get preload() {
|
|
1165
|
-
return
|
|
169
|
+
return o();
|
|
1166
170
|
},
|
|
1167
|
-
set preload(
|
|
1168
|
-
|
|
171
|
+
set preload(b = "none") {
|
|
172
|
+
o(b), v();
|
|
1169
173
|
}
|
|
1170
|
-
},
|
|
1171
|
-
return
|
|
1172
|
-
var
|
|
174
|
+
}, B = se(), ee = re(B);
|
|
175
|
+
return Cr(ee, n, (b) => {
|
|
176
|
+
var L = se(), Q = re(L);
|
|
1173
177
|
{
|
|
1174
|
-
var
|
|
1175
|
-
var
|
|
1176
|
-
|
|
1177
|
-
|
|
1178
|
-
}),
|
|
178
|
+
var ve = (E) => {
|
|
179
|
+
var R = Hr();
|
|
180
|
+
Pe(R, (t) => m(l, t), () => e(l)), M(() => {
|
|
181
|
+
W(R, "src", e(i).audioUrl), W(R, "preload", o() === "auto" ? "auto" : "none");
|
|
182
|
+
}), he("ended", R, V), he("error", R, H), z(E, R);
|
|
1179
183
|
};
|
|
1180
|
-
|
|
1181
|
-
e(
|
|
184
|
+
J(Q, (E) => {
|
|
185
|
+
e(i)?.audioUrl && E(ve);
|
|
1182
186
|
});
|
|
1183
187
|
}
|
|
1184
|
-
|
|
1185
|
-
}),
|
|
188
|
+
z(b, L);
|
|
189
|
+
}), z(g, B), ye(j);
|
|
1186
190
|
}
|
|
1187
191
|
customElements.define("fortyfour-recording", ue(
|
|
1188
|
-
|
|
192
|
+
jr,
|
|
1189
193
|
{
|
|
1190
194
|
apiHost: { attribute: "api-host", reflect: !0 },
|
|
1191
195
|
recordingId: { attribute: "recording-id", reflect: !0 },
|
|
@@ -1195,69 +199,76 @@ customElements.define("fortyfour-recording", ue(
|
|
|
1195
199
|
[],
|
|
1196
200
|
!1
|
|
1197
201
|
));
|
|
1198
|
-
function
|
|
1199
|
-
if (isNaN(
|
|
202
|
+
function Ie(g) {
|
|
203
|
+
if (isNaN(g) || g < 0)
|
|
1200
204
|
return "-:--";
|
|
1201
|
-
const
|
|
1202
|
-
return
|
|
205
|
+
const r = Math.floor(g / 3600), c = Math.floor(g % 3600 / 60), n = g % 60;
|
|
206
|
+
return r > 0 ? `${r}:${c.toString().padStart(2, "0")}:${n.toString().padStart(2, "0")}` : `${c}:${n.toString().padStart(2, "0")}`;
|
|
1203
207
|
}
|
|
1204
|
-
function
|
|
1205
|
-
if (isNaN(
|
|
208
|
+
function tr(g) {
|
|
209
|
+
if (isNaN(g) || g < 0)
|
|
1206
210
|
return "--";
|
|
1207
|
-
const
|
|
1208
|
-
return
|
|
211
|
+
const r = Math.floor(g / 1e3), c = Math.floor(r / 60), n = r % 60;
|
|
212
|
+
return c > 0 ? `${c}m ${n}s` : `${n}s`;
|
|
1209
213
|
}
|
|
1210
|
-
function
|
|
1211
|
-
|
|
1212
|
-
|
|
1213
|
-
|
|
1214
|
-
|
|
1215
|
-
|
|
214
|
+
function Me(g) {
|
|
215
|
+
if (isNaN(g) || g < 0)
|
|
216
|
+
return "0 seconds";
|
|
217
|
+
const r = Math.floor(g / 60), c = Math.floor(g % 60);
|
|
218
|
+
return r > 0 && c > 0 ? `${r} ${r === 1 ? "minute" : "minutes"} ${c} ${c === 1 ? "second" : "seconds"}` : r > 0 ? `${r} ${r === 1 ? "minute" : "minutes"}` : `${c} ${c === 1 ? "second" : "seconds"}`;
|
|
219
|
+
}
|
|
220
|
+
function Ye(g, r = 200) {
|
|
221
|
+
let c = q(!1);
|
|
222
|
+
return de(() => {
|
|
223
|
+
if (g()) {
|
|
224
|
+
const n = setTimeout(() => m(c, !0), r);
|
|
225
|
+
return () => clearTimeout(n);
|
|
1216
226
|
} else
|
|
1217
|
-
m(
|
|
1218
|
-
}), () => e(
|
|
227
|
+
m(c, !1);
|
|
228
|
+
}), () => e(c);
|
|
1219
229
|
}
|
|
1220
|
-
function
|
|
1221
|
-
|
|
1222
|
-
|
|
230
|
+
function Te(g, r, c) {
|
|
231
|
+
de(() => {
|
|
232
|
+
c() ? g.setAttribute(r, "") : g.removeAttribute(r);
|
|
1223
233
|
});
|
|
1224
234
|
}
|
|
1225
|
-
|
|
235
|
+
var qr = K("<span><!></span>");
|
|
236
|
+
const Sr = {
|
|
1226
237
|
hash: "svelte-hrw77x",
|
|
1227
238
|
code: `:host {--fortyfour-duration-font-family: system-ui, sans-serif;--fortyfour-duration-font-size: 14px;--fortyfour-duration-color: #1f2937;display:flex;align-items:center;justify-content:center;font-family:var(--fortyfour-duration-font-family);font-size:var(--fortyfour-duration-font-size);font-variant-numeric:tabular-nums;color:var(--fortyfour-duration-color);min-height:1lh;white-space:nowrap;}
|
|
1228
239
|
|
|
1229
240
|
@media (prefers-color-scheme: dark) {:host {--fortyfour-duration-color: #f3f4f6;}
|
|
1230
241
|
}`
|
|
1231
242
|
};
|
|
1232
|
-
function
|
|
1233
|
-
|
|
1234
|
-
const
|
|
1235
|
-
let
|
|
1236
|
-
function
|
|
1237
|
-
const C = Math.floor(
|
|
1238
|
-
switch (
|
|
243
|
+
function Ar(g, r) {
|
|
244
|
+
ge(r, !0), we(g, Sr);
|
|
245
|
+
const c = r.$$host;
|
|
246
|
+
let n = d(r, "for", 7, ""), a = d(r, "format", 7, "elapsed/total"), o = q(0), i = q(0);
|
|
247
|
+
function l(k, p, w) {
|
|
248
|
+
const C = Math.floor(k / 1e3), U = Math.floor(p / 1e3), X = Math.max(0, U - C);
|
|
249
|
+
switch (w) {
|
|
1239
250
|
case "-remaining":
|
|
1240
|
-
return "-" +
|
|
251
|
+
return "-" + Ie(X);
|
|
1241
252
|
case "remaining":
|
|
1242
|
-
return
|
|
253
|
+
return Ie(X);
|
|
1243
254
|
case "elapsed":
|
|
1244
|
-
return
|
|
255
|
+
return Ie(C);
|
|
1245
256
|
case "elapsed-text":
|
|
1246
|
-
return
|
|
257
|
+
return tr(k);
|
|
1247
258
|
case "total":
|
|
1248
|
-
return
|
|
259
|
+
return Ie(U);
|
|
1249
260
|
case "elapsed/total":
|
|
1250
|
-
return
|
|
261
|
+
return Ie(C) + " / " + Ie(U);
|
|
1251
262
|
case "remaining-text":
|
|
1252
|
-
return
|
|
263
|
+
return tr(Math.max(0, p - k));
|
|
1253
264
|
case "%":
|
|
1254
|
-
return Math.min(100, Math.ceil(
|
|
265
|
+
return Math.min(100, Math.ceil(k / p * 100)) + "%";
|
|
1255
266
|
default:
|
|
1256
|
-
return console.warn(`fortyfour-duration: invalid format "${
|
|
267
|
+
return console.warn(`fortyfour-duration: invalid format "${w}"`), null;
|
|
1257
268
|
}
|
|
1258
269
|
}
|
|
1259
|
-
function
|
|
1260
|
-
switch (
|
|
270
|
+
function y(k) {
|
|
271
|
+
switch (k) {
|
|
1261
272
|
case "-remaining":
|
|
1262
273
|
return "-0:00";
|
|
1263
274
|
case "remaining":
|
|
@@ -1272,59 +283,59 @@ function Vr(y, t) {
|
|
|
1272
283
|
return "0";
|
|
1273
284
|
}
|
|
1274
285
|
}
|
|
1275
|
-
|
|
1276
|
-
if (!
|
|
286
|
+
Te(c, "data-placeholder", () => e(i) === 0), de(() => {
|
|
287
|
+
if (!n()) {
|
|
1277
288
|
console.warn("fortyfour-duration: for attribute is required");
|
|
1278
289
|
return;
|
|
1279
290
|
}
|
|
1280
|
-
const
|
|
1281
|
-
if (!
|
|
1282
|
-
console.warn(`fortyfour-duration: element with id "${
|
|
291
|
+
const p = c.getRootNode().getElementById(n());
|
|
292
|
+
if (!p) {
|
|
293
|
+
console.warn(`fortyfour-duration: element with id "${n()}" not found`);
|
|
1283
294
|
return;
|
|
1284
295
|
}
|
|
1285
|
-
m(
|
|
1286
|
-
function
|
|
1287
|
-
m(
|
|
296
|
+
m(i, p.duration || 0, !0), m(o, p.currentTime || 0, !0);
|
|
297
|
+
function w() {
|
|
298
|
+
m(o, p.currentTime, !0), m(i, p.duration, !0);
|
|
1288
299
|
}
|
|
1289
|
-
return
|
|
1290
|
-
|
|
300
|
+
return p.addEventListener("loadedmetadata", w), p.addEventListener("timeupdate", w), () => {
|
|
301
|
+
p.removeEventListener("loadedmetadata", w), p.removeEventListener("timeupdate", w);
|
|
1291
302
|
};
|
|
1292
303
|
});
|
|
1293
|
-
var
|
|
304
|
+
var h = {
|
|
1294
305
|
get for() {
|
|
1295
|
-
return
|
|
306
|
+
return n();
|
|
1296
307
|
},
|
|
1297
|
-
set for(
|
|
1298
|
-
|
|
308
|
+
set for(k = "") {
|
|
309
|
+
n(k), v();
|
|
1299
310
|
},
|
|
1300
311
|
get format() {
|
|
1301
|
-
return
|
|
312
|
+
return a();
|
|
1302
313
|
},
|
|
1303
|
-
set format(
|
|
1304
|
-
|
|
314
|
+
set format(k = "elapsed/total") {
|
|
315
|
+
a(k), v();
|
|
1305
316
|
}
|
|
1306
|
-
}, f =
|
|
317
|
+
}, f = qr(), x = G(f);
|
|
1307
318
|
{
|
|
1308
|
-
var
|
|
1309
|
-
var
|
|
1310
|
-
|
|
1311
|
-
() =>
|
|
1312
|
-
]),
|
|
1313
|
-
},
|
|
1314
|
-
var
|
|
1315
|
-
|
|
1316
|
-
var
|
|
1317
|
-
|
|
1318
|
-
}),
|
|
319
|
+
var u = (k) => {
|
|
320
|
+
var p = rr();
|
|
321
|
+
M((w) => Ee(p, w), [
|
|
322
|
+
() => l(e(o), e(i), a())
|
|
323
|
+
]), z(k, p);
|
|
324
|
+
}, s = (k) => {
|
|
325
|
+
var p = se(), w = re(p);
|
|
326
|
+
qe(w, r, "placeholder", {}, (C) => {
|
|
327
|
+
var U = rr();
|
|
328
|
+
M((X) => Ee(U, X), [() => y(a())]), z(C, U);
|
|
329
|
+
}), z(k, p);
|
|
1319
330
|
};
|
|
1320
|
-
|
|
1321
|
-
e(
|
|
331
|
+
J(x, (k) => {
|
|
332
|
+
e(i) !== 0 ? k(u) : k(s, !1);
|
|
1322
333
|
});
|
|
1323
334
|
}
|
|
1324
|
-
return
|
|
335
|
+
return D(f), z(g, f), ye(h);
|
|
1325
336
|
}
|
|
1326
337
|
customElements.define("fortyfour-duration", ue(
|
|
1327
|
-
|
|
338
|
+
Ar,
|
|
1328
339
|
{
|
|
1329
340
|
for: { attribute: "for", reflect: !0 },
|
|
1330
341
|
format: { attribute: "format", reflect: !0 }
|
|
@@ -1333,8 +344,8 @@ customElements.define("fortyfour-duration", ue(
|
|
|
1333
344
|
[],
|
|
1334
345
|
!0
|
|
1335
346
|
));
|
|
1336
|
-
var
|
|
1337
|
-
const
|
|
347
|
+
var Br = K('<div part="ring" class="ring-progress svelte-qaqt0h"><div class="ring-inner svelte-qaqt0h"></div></div>');
|
|
348
|
+
const Nr = {
|
|
1338
349
|
hash: "svelte-qaqt0h",
|
|
1339
350
|
code: `.ring-progress.svelte-qaqt0h {position:absolute;inset:0;z-index:0;border-radius:inherit;pointer-events:none;background:conic-gradient(
|
|
1340
351
|
from 0deg,
|
|
@@ -1342,23 +353,23 @@ const Yr = {
|
|
|
1342
353
|
var(--fortyfour-play-button-ring-track-color) var(--progress-deg)
|
|
1343
354
|
);}.ring-inner.svelte-qaqt0h {position:absolute;inset:var(--fortyfour-play-button-ring-width);border-radius:inherit;background:var(--fortyfour-play-button-background-color);}`
|
|
1344
355
|
};
|
|
1345
|
-
function
|
|
1346
|
-
|
|
1347
|
-
let
|
|
1348
|
-
const
|
|
1349
|
-
var
|
|
356
|
+
function Ve(g, r) {
|
|
357
|
+
ge(r, !0), we(g, Nr);
|
|
358
|
+
let c = d(r, "progress", 7, 0);
|
|
359
|
+
const n = S(() => c() * 360);
|
|
360
|
+
var a = {
|
|
1350
361
|
get progress() {
|
|
1351
|
-
return
|
|
362
|
+
return c();
|
|
1352
363
|
},
|
|
1353
|
-
set progress(
|
|
1354
|
-
|
|
364
|
+
set progress(i = 0) {
|
|
365
|
+
c(i), v();
|
|
1355
366
|
}
|
|
1356
|
-
},
|
|
1357
|
-
return
|
|
367
|
+
}, o = Br();
|
|
368
|
+
return M(() => me(o, `--progress-deg: ${e(n) ?? ""}deg`)), z(g, o), ye(a);
|
|
1358
369
|
}
|
|
1359
|
-
ue(
|
|
1360
|
-
var
|
|
1361
|
-
const
|
|
370
|
+
ue(Ve, { progress: {} }, [], [], !0);
|
|
371
|
+
var Wr = K('<div part="ripple" class="ripple ripple-small svelte-lgp3pt"></div>'), Dr = K('<div part="ripple" class="ripple ripple-medium svelte-lgp3pt"></div>'), Ur = K('<div part="ripple" class="ripple ripple-large svelte-lgp3pt"></div>'), Fr = K("<!> <!> <!>", 1);
|
|
372
|
+
const Or = {
|
|
1362
373
|
hash: "svelte-lgp3pt",
|
|
1363
374
|
code: `.ripple.svelte-lgp3pt {position:absolute;inset:0;border-radius:inherit;border:2px solid var(--fortyfour-play-button-background-color);pointer-events:none;
|
|
1364
375
|
animation: ripple 1.5s ease-out infinite;}.ripple-small.svelte-lgp3pt {
|
|
@@ -1403,198 +414,199 @@ const ea = {
|
|
|
1403
414
|
animation: none;}
|
|
1404
415
|
}`
|
|
1405
416
|
};
|
|
1406
|
-
function
|
|
1407
|
-
|
|
1408
|
-
let
|
|
1409
|
-
function
|
|
1410
|
-
return
|
|
417
|
+
function Je(g, r) {
|
|
418
|
+
ge(r, !0), we(g, Or);
|
|
419
|
+
let c = d(r, "isPlaying", 7, !1), n = d(r, "amplitude", 7, 0), a = d(r, "intensity", 7, 1), o = q(We({ small: !1, medium: !1, large: !1 }));
|
|
420
|
+
function i(w) {
|
|
421
|
+
return w < 33 ? "small" : w < 66 ? "medium" : "large";
|
|
1411
422
|
}
|
|
1412
|
-
|
|
1413
|
-
if (!
|
|
1414
|
-
m(
|
|
423
|
+
de(() => {
|
|
424
|
+
if (!c()) {
|
|
425
|
+
m(o, { small: !1, medium: !1, large: !1 }, !0);
|
|
1415
426
|
return;
|
|
1416
427
|
}
|
|
1417
|
-
const
|
|
1418
|
-
e(
|
|
428
|
+
const w = i(n());
|
|
429
|
+
e(o)[w] || (e(o)[w] = !0);
|
|
1419
430
|
});
|
|
1420
|
-
function
|
|
1421
|
-
e(
|
|
431
|
+
function l(w) {
|
|
432
|
+
e(o)[w] = !1;
|
|
1422
433
|
}
|
|
1423
|
-
var
|
|
434
|
+
var y = {
|
|
1424
435
|
get isPlaying() {
|
|
1425
|
-
return
|
|
436
|
+
return c();
|
|
1426
437
|
},
|
|
1427
|
-
set isPlaying(
|
|
1428
|
-
|
|
438
|
+
set isPlaying(w = !1) {
|
|
439
|
+
c(w), v();
|
|
1429
440
|
},
|
|
1430
441
|
get amplitude() {
|
|
1431
|
-
return
|
|
442
|
+
return n();
|
|
1432
443
|
},
|
|
1433
|
-
set amplitude(
|
|
1434
|
-
|
|
444
|
+
set amplitude(w = 0) {
|
|
445
|
+
n(w), v();
|
|
1435
446
|
},
|
|
1436
447
|
get intensity() {
|
|
1437
|
-
return
|
|
448
|
+
return a();
|
|
1438
449
|
},
|
|
1439
|
-
set intensity(
|
|
1440
|
-
|
|
450
|
+
set intensity(w = 1) {
|
|
451
|
+
a(w), v();
|
|
1441
452
|
}
|
|
1442
|
-
},
|
|
453
|
+
}, h = Fr(), f = re(h);
|
|
1443
454
|
{
|
|
1444
|
-
var
|
|
1445
|
-
var C =
|
|
1446
|
-
|
|
455
|
+
var x = (w) => {
|
|
456
|
+
var C = Wr();
|
|
457
|
+
M(() => me(C, `--intensity: ${a() ?? ""};`)), he("animationend", C, () => l("small")), z(w, C);
|
|
1447
458
|
};
|
|
1448
|
-
|
|
1449
|
-
e(
|
|
459
|
+
J(f, (w) => {
|
|
460
|
+
e(o).small && w(x);
|
|
1450
461
|
});
|
|
1451
462
|
}
|
|
1452
|
-
var
|
|
463
|
+
var u = pe(f, 2);
|
|
1453
464
|
{
|
|
1454
|
-
var
|
|
1455
|
-
var C =
|
|
1456
|
-
|
|
465
|
+
var s = (w) => {
|
|
466
|
+
var C = Dr();
|
|
467
|
+
M(() => me(C, `--intensity: ${a() ?? ""};`)), he("animationend", C, () => l("medium")), z(w, C);
|
|
1457
468
|
};
|
|
1458
|
-
|
|
1459
|
-
e(
|
|
469
|
+
J(u, (w) => {
|
|
470
|
+
e(o).medium && w(s);
|
|
1460
471
|
});
|
|
1461
472
|
}
|
|
1462
|
-
var
|
|
473
|
+
var k = pe(u, 2);
|
|
1463
474
|
{
|
|
1464
|
-
var
|
|
1465
|
-
var C =
|
|
1466
|
-
|
|
475
|
+
var p = (w) => {
|
|
476
|
+
var C = Ur();
|
|
477
|
+
M(() => me(C, `--intensity: ${a() ?? ""};`)), he("animationend", C, () => l("large")), z(w, C);
|
|
1467
478
|
};
|
|
1468
|
-
|
|
1469
|
-
e(
|
|
479
|
+
J(k, (w) => {
|
|
480
|
+
e(o).large && w(p);
|
|
1470
481
|
});
|
|
1471
482
|
}
|
|
1472
|
-
return
|
|
483
|
+
return z(g, h), ye(y);
|
|
1473
484
|
}
|
|
1474
|
-
ue(
|
|
1475
|
-
var
|
|
1476
|
-
|
|
1477
|
-
},
|
|
1478
|
-
const
|
|
1479
|
-
hash: "svelte-
|
|
1480
|
-
code:
|
|
485
|
+
ue(Je, { isPlaying: {}, amplitude: {}, intensity: {} }, [], [], !0);
|
|
486
|
+
var Gr = (g, r) => {
|
|
487
|
+
g.currentTarget.focus({ preventScroll: !0 }), r()?.(g);
|
|
488
|
+
}, Kr = K('<div class="shape-wrapper svelte-103okfy"><!> <button part="button"><!> <span part="icon" class="icon svelte-103okfy"><!></span></button></div>');
|
|
489
|
+
const Xr = {
|
|
490
|
+
hash: "svelte-103okfy",
|
|
491
|
+
code: `.shape-wrapper.svelte-103okfy {position:relative;width:var(--fortyfour-play-button-size, 48px);height:var(--fortyfour-play-button-size, 48px);font-size:var(--fortyfour-play-button-size, 48px);}.play-button.svelte-103okfy {position:relative;width:100%;height:100%;border:var(--fortyfour-play-button-border-width) solid
|
|
492
|
+
var(--fortyfour-play-button-border-color);cursor:pointer;display:flex;align-items:center;justify-content:center;background:var(--fortyfour-play-button-background-color);color:var(--fortyfour-play-button-icon-color);}.play-button.svelte-103okfy:focus-visible {outline:var(--fortyfour-play-button-focus-width) solid var(--fortyfour-play-button-focus-color);outline-offset:var(--fortyfour-play-button-focus-offset);}.play-button.svelte-103okfy:disabled {opacity:0.5;cursor:not-allowed;}.play-button.has-ring-progress.svelte-103okfy {border:none;}.icon.svelte-103okfy {position:relative;z-index:1;width:1em;height:1em;display:flex;align-items:center;justify-content:center;}.icon.svelte-103okfy svg {width:100%;height:100%;fill:currentColor;}`
|
|
1481
493
|
};
|
|
1482
|
-
function
|
|
1483
|
-
|
|
1484
|
-
let
|
|
1485
|
-
var
|
|
494
|
+
function De(g, r) {
|
|
495
|
+
ge(r, !0), we(g, Xr);
|
|
496
|
+
let c = d(r, "onclick", 7), n = d(r, "disabled", 7, !1), a = d(r, "loading", 7, !1), o = d(r, "visualization", 7, "none"), i = d(r, "progressPercent", 7, 0), l = d(r, "isPlaying", 7, !1), y = d(r, "amplitude", 7, 0), h = d(r, "rippleIntensity", 7, 1), f = d(r, "ariaLabel", 7, "Play"), x = d(r, "borderRadius", 7, "50%"), u = d(r, "children", 7);
|
|
497
|
+
var s = {
|
|
1486
498
|
get onclick() {
|
|
1487
|
-
return
|
|
499
|
+
return c();
|
|
1488
500
|
},
|
|
1489
|
-
set onclick(
|
|
1490
|
-
|
|
501
|
+
set onclick(H) {
|
|
502
|
+
c(H), v();
|
|
1491
503
|
},
|
|
1492
504
|
get disabled() {
|
|
1493
|
-
return
|
|
505
|
+
return n();
|
|
1494
506
|
},
|
|
1495
|
-
set disabled(
|
|
1496
|
-
|
|
507
|
+
set disabled(H = !1) {
|
|
508
|
+
n(H), v();
|
|
1497
509
|
},
|
|
1498
510
|
get loading() {
|
|
1499
|
-
return
|
|
511
|
+
return a();
|
|
1500
512
|
},
|
|
1501
|
-
set loading(
|
|
1502
|
-
|
|
513
|
+
set loading(H = !1) {
|
|
514
|
+
a(H), v();
|
|
1503
515
|
},
|
|
1504
516
|
get visualization() {
|
|
1505
|
-
return
|
|
517
|
+
return o();
|
|
1506
518
|
},
|
|
1507
|
-
set visualization(
|
|
1508
|
-
|
|
519
|
+
set visualization(H = "none") {
|
|
520
|
+
o(H), v();
|
|
1509
521
|
},
|
|
1510
522
|
get progressPercent() {
|
|
1511
|
-
return
|
|
523
|
+
return i();
|
|
1512
524
|
},
|
|
1513
|
-
set progressPercent(
|
|
1514
|
-
|
|
525
|
+
set progressPercent(H = 0) {
|
|
526
|
+
i(H), v();
|
|
1515
527
|
},
|
|
1516
528
|
get isPlaying() {
|
|
1517
|
-
return
|
|
529
|
+
return l();
|
|
1518
530
|
},
|
|
1519
|
-
set isPlaying(
|
|
1520
|
-
|
|
531
|
+
set isPlaying(H = !1) {
|
|
532
|
+
l(H), v();
|
|
1521
533
|
},
|
|
1522
534
|
get amplitude() {
|
|
1523
|
-
return
|
|
535
|
+
return y();
|
|
1524
536
|
},
|
|
1525
|
-
set amplitude(
|
|
1526
|
-
|
|
537
|
+
set amplitude(H = 0) {
|
|
538
|
+
y(H), v();
|
|
1527
539
|
},
|
|
1528
540
|
get rippleIntensity() {
|
|
1529
|
-
return
|
|
541
|
+
return h();
|
|
1530
542
|
},
|
|
1531
|
-
set rippleIntensity(
|
|
1532
|
-
|
|
543
|
+
set rippleIntensity(H = 1) {
|
|
544
|
+
h(H), v();
|
|
1533
545
|
},
|
|
1534
546
|
get ariaLabel() {
|
|
1535
547
|
return f();
|
|
1536
548
|
},
|
|
1537
|
-
set ariaLabel(
|
|
1538
|
-
f(
|
|
549
|
+
set ariaLabel(H = "Play") {
|
|
550
|
+
f(H), v();
|
|
1539
551
|
},
|
|
1540
552
|
get borderRadius() {
|
|
1541
|
-
return
|
|
553
|
+
return x();
|
|
1542
554
|
},
|
|
1543
|
-
set borderRadius(
|
|
1544
|
-
|
|
555
|
+
set borderRadius(H = "50%") {
|
|
556
|
+
x(H), v();
|
|
1545
557
|
},
|
|
1546
558
|
get children() {
|
|
1547
|
-
return
|
|
559
|
+
return u();
|
|
1548
560
|
},
|
|
1549
|
-
set children(
|
|
1550
|
-
|
|
561
|
+
set children(H) {
|
|
562
|
+
u(H), v();
|
|
1551
563
|
}
|
|
1552
|
-
},
|
|
564
|
+
}, k = Kr(), p = G(k);
|
|
1553
565
|
{
|
|
1554
|
-
var
|
|
1555
|
-
|
|
566
|
+
var w = (H) => {
|
|
567
|
+
Je(H, {
|
|
1556
568
|
get isPlaying() {
|
|
1557
|
-
return
|
|
569
|
+
return l();
|
|
1558
570
|
},
|
|
1559
571
|
get amplitude() {
|
|
1560
|
-
return
|
|
572
|
+
return y();
|
|
1561
573
|
},
|
|
1562
574
|
get intensity() {
|
|
1563
|
-
return
|
|
575
|
+
return h();
|
|
1564
576
|
}
|
|
1565
577
|
});
|
|
1566
578
|
};
|
|
1567
|
-
|
|
1568
|
-
|
|
579
|
+
J(p, (H) => {
|
|
580
|
+
o() === "ripple" && H(w);
|
|
1569
581
|
});
|
|
1570
582
|
}
|
|
1571
|
-
var C =
|
|
1572
|
-
let
|
|
1573
|
-
C.__click = [
|
|
1574
|
-
var
|
|
583
|
+
var C = pe(p, 2);
|
|
584
|
+
let U;
|
|
585
|
+
C.__click = [Gr, c];
|
|
586
|
+
var X = G(C);
|
|
1575
587
|
{
|
|
1576
|
-
var
|
|
1577
|
-
|
|
588
|
+
var F = (H) => {
|
|
589
|
+
Ve(H, {
|
|
1578
590
|
get progress() {
|
|
1579
|
-
return
|
|
591
|
+
return i();
|
|
1580
592
|
}
|
|
1581
593
|
});
|
|
1582
594
|
};
|
|
1583
|
-
|
|
1584
|
-
|
|
595
|
+
J(X, (H) => {
|
|
596
|
+
o() === "ring" && H(F);
|
|
1585
597
|
});
|
|
1586
598
|
}
|
|
1587
|
-
var
|
|
1588
|
-
return
|
|
1589
|
-
(
|
|
1590
|
-
|
|
599
|
+
var te = pe(X, 2), V = G(te);
|
|
600
|
+
return Ae(V, u), D(te), D(C), D(k), M(
|
|
601
|
+
(H) => {
|
|
602
|
+
me(k, `border-radius: ${x() ?? ""}`), U = ie(C, 1, "play-button svelte-103okfy", null, U, H), C.disabled = n(), W(C, "aria-label", f()), W(C, "aria-busy", a()), me(C, `border-radius: ${x() ?? ""}`);
|
|
1591
603
|
},
|
|
1592
|
-
[() => ({ "has-ring-progress":
|
|
1593
|
-
),
|
|
604
|
+
[() => ({ "has-ring-progress": o() === "ring" })]
|
|
605
|
+
), z(g, k), ye(s);
|
|
1594
606
|
}
|
|
1595
|
-
|
|
607
|
+
He(["click"]);
|
|
1596
608
|
ue(
|
|
1597
|
-
|
|
609
|
+
De,
|
|
1598
610
|
{
|
|
1599
611
|
onclick: {},
|
|
1600
612
|
disabled: {},
|
|
@@ -1612,109 +624,109 @@ ue(
|
|
|
1612
624
|
[],
|
|
1613
625
|
!0
|
|
1614
626
|
);
|
|
1615
|
-
function
|
|
1616
|
-
|
|
1617
|
-
let
|
|
1618
|
-
var
|
|
627
|
+
function Ge(g, r) {
|
|
628
|
+
ge(r, !0);
|
|
629
|
+
let c = d(r, "onclick", 7), n = d(r, "disabled", 7, !1), a = d(r, "loading", 7, !1), o = d(r, "visualization", 7, "none"), i = d(r, "progressPercent", 7, 0), l = d(r, "isPlaying", 7, !1), y = d(r, "amplitude", 7, 0), h = d(r, "rippleIntensity", 7, 1), f = d(r, "ariaLabel", 7, "Play"), x = d(r, "children", 7);
|
|
630
|
+
var u = {
|
|
1619
631
|
get onclick() {
|
|
1620
|
-
return
|
|
632
|
+
return c();
|
|
1621
633
|
},
|
|
1622
|
-
set onclick(
|
|
1623
|
-
|
|
634
|
+
set onclick(s) {
|
|
635
|
+
c(s), v();
|
|
1624
636
|
},
|
|
1625
637
|
get disabled() {
|
|
1626
|
-
return
|
|
638
|
+
return n();
|
|
1627
639
|
},
|
|
1628
|
-
set disabled(
|
|
1629
|
-
|
|
640
|
+
set disabled(s = !1) {
|
|
641
|
+
n(s), v();
|
|
1630
642
|
},
|
|
1631
643
|
get loading() {
|
|
1632
|
-
return
|
|
644
|
+
return a();
|
|
1633
645
|
},
|
|
1634
|
-
set loading(
|
|
1635
|
-
|
|
646
|
+
set loading(s = !1) {
|
|
647
|
+
a(s), v();
|
|
1636
648
|
},
|
|
1637
649
|
get visualization() {
|
|
1638
|
-
return
|
|
650
|
+
return o();
|
|
1639
651
|
},
|
|
1640
|
-
set visualization(
|
|
1641
|
-
|
|
652
|
+
set visualization(s = "none") {
|
|
653
|
+
o(s), v();
|
|
1642
654
|
},
|
|
1643
655
|
get progressPercent() {
|
|
1644
|
-
return
|
|
656
|
+
return i();
|
|
1645
657
|
},
|
|
1646
|
-
set progressPercent(
|
|
1647
|
-
|
|
658
|
+
set progressPercent(s = 0) {
|
|
659
|
+
i(s), v();
|
|
1648
660
|
},
|
|
1649
661
|
get isPlaying() {
|
|
1650
|
-
return
|
|
662
|
+
return l();
|
|
1651
663
|
},
|
|
1652
|
-
set isPlaying(
|
|
1653
|
-
|
|
664
|
+
set isPlaying(s = !1) {
|
|
665
|
+
l(s), v();
|
|
1654
666
|
},
|
|
1655
667
|
get amplitude() {
|
|
1656
|
-
return
|
|
668
|
+
return y();
|
|
1657
669
|
},
|
|
1658
|
-
set amplitude(
|
|
1659
|
-
s
|
|
670
|
+
set amplitude(s = 0) {
|
|
671
|
+
y(s), v();
|
|
1660
672
|
},
|
|
1661
673
|
get rippleIntensity() {
|
|
1662
|
-
return
|
|
674
|
+
return h();
|
|
1663
675
|
},
|
|
1664
|
-
set rippleIntensity(
|
|
1665
|
-
|
|
676
|
+
set rippleIntensity(s = 1) {
|
|
677
|
+
h(s), v();
|
|
1666
678
|
},
|
|
1667
679
|
get ariaLabel() {
|
|
1668
680
|
return f();
|
|
1669
681
|
},
|
|
1670
|
-
set ariaLabel(
|
|
1671
|
-
f(
|
|
682
|
+
set ariaLabel(s = "Play") {
|
|
683
|
+
f(s), v();
|
|
1672
684
|
},
|
|
1673
685
|
get children() {
|
|
1674
|
-
return
|
|
686
|
+
return x();
|
|
1675
687
|
},
|
|
1676
|
-
set children(
|
|
1677
|
-
|
|
688
|
+
set children(s) {
|
|
689
|
+
x(s), v();
|
|
1678
690
|
}
|
|
1679
691
|
};
|
|
1680
|
-
return
|
|
692
|
+
return De(g, {
|
|
1681
693
|
get onclick() {
|
|
1682
|
-
return
|
|
694
|
+
return c();
|
|
1683
695
|
},
|
|
1684
696
|
get disabled() {
|
|
1685
|
-
return
|
|
697
|
+
return n();
|
|
1686
698
|
},
|
|
1687
699
|
get loading() {
|
|
1688
|
-
return
|
|
700
|
+
return a();
|
|
1689
701
|
},
|
|
1690
702
|
get visualization() {
|
|
1691
|
-
return
|
|
703
|
+
return o();
|
|
1692
704
|
},
|
|
1693
705
|
get progressPercent() {
|
|
1694
|
-
return
|
|
706
|
+
return i();
|
|
1695
707
|
},
|
|
1696
708
|
get isPlaying() {
|
|
1697
|
-
return
|
|
709
|
+
return l();
|
|
1698
710
|
},
|
|
1699
711
|
get amplitude() {
|
|
1700
|
-
return
|
|
712
|
+
return y();
|
|
1701
713
|
},
|
|
1702
714
|
get rippleIntensity() {
|
|
1703
|
-
return
|
|
715
|
+
return h();
|
|
1704
716
|
},
|
|
1705
717
|
get ariaLabel() {
|
|
1706
718
|
return f();
|
|
1707
719
|
},
|
|
1708
720
|
borderRadius: "50%",
|
|
1709
|
-
children: (
|
|
1710
|
-
var
|
|
1711
|
-
|
|
721
|
+
children: (s, k) => {
|
|
722
|
+
var p = se(), w = re(p);
|
|
723
|
+
Ae(w, x), z(s, p);
|
|
1712
724
|
},
|
|
1713
725
|
$$slots: { default: !0 }
|
|
1714
|
-
}),
|
|
726
|
+
}), ye(u);
|
|
1715
727
|
}
|
|
1716
728
|
ue(
|
|
1717
|
-
|
|
729
|
+
Ge,
|
|
1718
730
|
{
|
|
1719
731
|
onclick: {},
|
|
1720
732
|
disabled: {},
|
|
@@ -1731,109 +743,109 @@ ue(
|
|
|
1731
743
|
[],
|
|
1732
744
|
!0
|
|
1733
745
|
);
|
|
1734
|
-
function
|
|
1735
|
-
|
|
1736
|
-
let
|
|
1737
|
-
var
|
|
746
|
+
function fr(g, r) {
|
|
747
|
+
ge(r, !0);
|
|
748
|
+
let c = d(r, "onclick", 7), n = d(r, "disabled", 7, !1), a = d(r, "loading", 7, !1), o = d(r, "visualization", 7, "none"), i = d(r, "progressPercent", 7, 0), l = d(r, "isPlaying", 7, !1), y = d(r, "amplitude", 7, 0), h = d(r, "rippleIntensity", 7, 1), f = d(r, "ariaLabel", 7, "Play"), x = d(r, "children", 7);
|
|
749
|
+
var u = {
|
|
1738
750
|
get onclick() {
|
|
1739
|
-
return
|
|
751
|
+
return c();
|
|
1740
752
|
},
|
|
1741
|
-
set onclick(
|
|
1742
|
-
|
|
753
|
+
set onclick(s) {
|
|
754
|
+
c(s), v();
|
|
1743
755
|
},
|
|
1744
756
|
get disabled() {
|
|
1745
|
-
return
|
|
757
|
+
return n();
|
|
1746
758
|
},
|
|
1747
|
-
set disabled(
|
|
1748
|
-
|
|
759
|
+
set disabled(s = !1) {
|
|
760
|
+
n(s), v();
|
|
1749
761
|
},
|
|
1750
762
|
get loading() {
|
|
1751
|
-
return
|
|
763
|
+
return a();
|
|
1752
764
|
},
|
|
1753
|
-
set loading(
|
|
1754
|
-
|
|
765
|
+
set loading(s = !1) {
|
|
766
|
+
a(s), v();
|
|
1755
767
|
},
|
|
1756
768
|
get visualization() {
|
|
1757
|
-
return
|
|
769
|
+
return o();
|
|
1758
770
|
},
|
|
1759
|
-
set visualization(
|
|
1760
|
-
|
|
771
|
+
set visualization(s = "none") {
|
|
772
|
+
o(s), v();
|
|
1761
773
|
},
|
|
1762
774
|
get progressPercent() {
|
|
1763
|
-
return
|
|
775
|
+
return i();
|
|
1764
776
|
},
|
|
1765
|
-
set progressPercent(
|
|
1766
|
-
|
|
777
|
+
set progressPercent(s = 0) {
|
|
778
|
+
i(s), v();
|
|
1767
779
|
},
|
|
1768
780
|
get isPlaying() {
|
|
1769
|
-
return
|
|
781
|
+
return l();
|
|
1770
782
|
},
|
|
1771
|
-
set isPlaying(
|
|
1772
|
-
|
|
783
|
+
set isPlaying(s = !1) {
|
|
784
|
+
l(s), v();
|
|
1773
785
|
},
|
|
1774
786
|
get amplitude() {
|
|
1775
|
-
return
|
|
787
|
+
return y();
|
|
1776
788
|
},
|
|
1777
|
-
set amplitude(
|
|
1778
|
-
s
|
|
789
|
+
set amplitude(s = 0) {
|
|
790
|
+
y(s), v();
|
|
1779
791
|
},
|
|
1780
792
|
get rippleIntensity() {
|
|
1781
|
-
return
|
|
793
|
+
return h();
|
|
1782
794
|
},
|
|
1783
|
-
set rippleIntensity(
|
|
1784
|
-
|
|
795
|
+
set rippleIntensity(s = 1) {
|
|
796
|
+
h(s), v();
|
|
1785
797
|
},
|
|
1786
798
|
get ariaLabel() {
|
|
1787
799
|
return f();
|
|
1788
800
|
},
|
|
1789
|
-
set ariaLabel(
|
|
1790
|
-
f(
|
|
801
|
+
set ariaLabel(s = "Play") {
|
|
802
|
+
f(s), v();
|
|
1791
803
|
},
|
|
1792
804
|
get children() {
|
|
1793
|
-
return
|
|
805
|
+
return x();
|
|
1794
806
|
},
|
|
1795
|
-
set children(
|
|
1796
|
-
|
|
807
|
+
set children(s) {
|
|
808
|
+
x(s), v();
|
|
1797
809
|
}
|
|
1798
810
|
};
|
|
1799
|
-
return
|
|
811
|
+
return De(g, {
|
|
1800
812
|
get onclick() {
|
|
1801
|
-
return
|
|
813
|
+
return c();
|
|
1802
814
|
},
|
|
1803
815
|
get disabled() {
|
|
1804
|
-
return
|
|
816
|
+
return n();
|
|
1805
817
|
},
|
|
1806
818
|
get loading() {
|
|
1807
|
-
return
|
|
819
|
+
return a();
|
|
1808
820
|
},
|
|
1809
821
|
get visualization() {
|
|
1810
|
-
return
|
|
822
|
+
return o();
|
|
1811
823
|
},
|
|
1812
824
|
get progressPercent() {
|
|
1813
|
-
return
|
|
825
|
+
return i();
|
|
1814
826
|
},
|
|
1815
827
|
get isPlaying() {
|
|
1816
|
-
return
|
|
828
|
+
return l();
|
|
1817
829
|
},
|
|
1818
830
|
get amplitude() {
|
|
1819
|
-
return
|
|
831
|
+
return y();
|
|
1820
832
|
},
|
|
1821
833
|
get rippleIntensity() {
|
|
1822
|
-
return
|
|
834
|
+
return h();
|
|
1823
835
|
},
|
|
1824
836
|
get ariaLabel() {
|
|
1825
837
|
return f();
|
|
1826
838
|
},
|
|
1827
839
|
borderRadius: "0",
|
|
1828
|
-
children: (
|
|
1829
|
-
var
|
|
1830
|
-
|
|
840
|
+
children: (s, k) => {
|
|
841
|
+
var p = se(), w = re(p);
|
|
842
|
+
Ae(w, x), z(s, p);
|
|
1831
843
|
},
|
|
1832
844
|
$$slots: { default: !0 }
|
|
1833
|
-
}),
|
|
845
|
+
}), ye(u);
|
|
1834
846
|
}
|
|
1835
847
|
ue(
|
|
1836
|
-
|
|
848
|
+
fr,
|
|
1837
849
|
{
|
|
1838
850
|
onclick: {},
|
|
1839
851
|
disabled: {},
|
|
@@ -1850,109 +862,109 @@ ue(
|
|
|
1850
862
|
[],
|
|
1851
863
|
!0
|
|
1852
864
|
);
|
|
1853
|
-
function
|
|
1854
|
-
|
|
1855
|
-
let
|
|
1856
|
-
var
|
|
865
|
+
function cr(g, r) {
|
|
866
|
+
ge(r, !0);
|
|
867
|
+
let c = d(r, "onclick", 7), n = d(r, "disabled", 7, !1), a = d(r, "loading", 7, !1), o = d(r, "visualization", 7, "none"), i = d(r, "progressPercent", 7, 0), l = d(r, "isPlaying", 7, !1), y = d(r, "amplitude", 7, 0), h = d(r, "rippleIntensity", 7, 1), f = d(r, "ariaLabel", 7, "Play"), x = d(r, "children", 7);
|
|
868
|
+
var u = {
|
|
1857
869
|
get onclick() {
|
|
1858
|
-
return
|
|
870
|
+
return c();
|
|
1859
871
|
},
|
|
1860
|
-
set onclick(
|
|
1861
|
-
|
|
872
|
+
set onclick(s) {
|
|
873
|
+
c(s), v();
|
|
1862
874
|
},
|
|
1863
875
|
get disabled() {
|
|
1864
|
-
return
|
|
876
|
+
return n();
|
|
1865
877
|
},
|
|
1866
|
-
set disabled(
|
|
1867
|
-
|
|
878
|
+
set disabled(s = !1) {
|
|
879
|
+
n(s), v();
|
|
1868
880
|
},
|
|
1869
881
|
get loading() {
|
|
1870
|
-
return
|
|
882
|
+
return a();
|
|
1871
883
|
},
|
|
1872
|
-
set loading(
|
|
1873
|
-
|
|
884
|
+
set loading(s = !1) {
|
|
885
|
+
a(s), v();
|
|
1874
886
|
},
|
|
1875
887
|
get visualization() {
|
|
1876
|
-
return
|
|
888
|
+
return o();
|
|
1877
889
|
},
|
|
1878
|
-
set visualization(
|
|
1879
|
-
|
|
890
|
+
set visualization(s = "none") {
|
|
891
|
+
o(s), v();
|
|
1880
892
|
},
|
|
1881
893
|
get progressPercent() {
|
|
1882
|
-
return
|
|
894
|
+
return i();
|
|
1883
895
|
},
|
|
1884
|
-
set progressPercent(
|
|
1885
|
-
|
|
896
|
+
set progressPercent(s = 0) {
|
|
897
|
+
i(s), v();
|
|
1886
898
|
},
|
|
1887
899
|
get isPlaying() {
|
|
1888
|
-
return
|
|
900
|
+
return l();
|
|
1889
901
|
},
|
|
1890
|
-
set isPlaying(
|
|
1891
|
-
|
|
902
|
+
set isPlaying(s = !1) {
|
|
903
|
+
l(s), v();
|
|
1892
904
|
},
|
|
1893
905
|
get amplitude() {
|
|
1894
|
-
return
|
|
906
|
+
return y();
|
|
1895
907
|
},
|
|
1896
|
-
set amplitude(
|
|
1897
|
-
s
|
|
908
|
+
set amplitude(s = 0) {
|
|
909
|
+
y(s), v();
|
|
1898
910
|
},
|
|
1899
911
|
get rippleIntensity() {
|
|
1900
|
-
return
|
|
912
|
+
return h();
|
|
1901
913
|
},
|
|
1902
|
-
set rippleIntensity(
|
|
1903
|
-
|
|
914
|
+
set rippleIntensity(s = 1) {
|
|
915
|
+
h(s), v();
|
|
1904
916
|
},
|
|
1905
917
|
get ariaLabel() {
|
|
1906
918
|
return f();
|
|
1907
919
|
},
|
|
1908
|
-
set ariaLabel(
|
|
1909
|
-
f(
|
|
920
|
+
set ariaLabel(s = "Play") {
|
|
921
|
+
f(s), v();
|
|
1910
922
|
},
|
|
1911
923
|
get children() {
|
|
1912
|
-
return
|
|
924
|
+
return x();
|
|
1913
925
|
},
|
|
1914
|
-
set children(
|
|
1915
|
-
|
|
926
|
+
set children(s) {
|
|
927
|
+
x(s), v();
|
|
1916
928
|
}
|
|
1917
929
|
};
|
|
1918
|
-
return
|
|
930
|
+
return De(g, {
|
|
1919
931
|
get onclick() {
|
|
1920
|
-
return
|
|
932
|
+
return c();
|
|
1921
933
|
},
|
|
1922
934
|
get disabled() {
|
|
1923
|
-
return
|
|
935
|
+
return n();
|
|
1924
936
|
},
|
|
1925
937
|
get loading() {
|
|
1926
|
-
return
|
|
938
|
+
return a();
|
|
1927
939
|
},
|
|
1928
940
|
get visualization() {
|
|
1929
|
-
return
|
|
941
|
+
return o();
|
|
1930
942
|
},
|
|
1931
943
|
get progressPercent() {
|
|
1932
|
-
return
|
|
944
|
+
return i();
|
|
1933
945
|
},
|
|
1934
946
|
get isPlaying() {
|
|
1935
|
-
return
|
|
947
|
+
return l();
|
|
1936
948
|
},
|
|
1937
949
|
get amplitude() {
|
|
1938
|
-
return
|
|
950
|
+
return y();
|
|
1939
951
|
},
|
|
1940
952
|
get rippleIntensity() {
|
|
1941
|
-
return
|
|
953
|
+
return h();
|
|
1942
954
|
},
|
|
1943
955
|
get ariaLabel() {
|
|
1944
956
|
return f();
|
|
1945
957
|
},
|
|
1946
958
|
borderRadius: "var(--fortyfour-play-button-border-radius)",
|
|
1947
|
-
children: (
|
|
1948
|
-
var
|
|
1949
|
-
|
|
959
|
+
children: (s, k) => {
|
|
960
|
+
var p = se(), w = re(p);
|
|
961
|
+
Ae(w, x), z(s, p);
|
|
1950
962
|
},
|
|
1951
963
|
$$slots: { default: !0 }
|
|
1952
|
-
}),
|
|
964
|
+
}), ye(u);
|
|
1953
965
|
}
|
|
1954
966
|
ue(
|
|
1955
|
-
|
|
967
|
+
cr,
|
|
1956
968
|
{
|
|
1957
969
|
onclick: {},
|
|
1958
970
|
disabled: {},
|
|
@@ -1969,174 +981,175 @@ ue(
|
|
|
1969
981
|
[],
|
|
1970
982
|
!0
|
|
1971
983
|
);
|
|
1972
|
-
var
|
|
1973
|
-
const
|
|
1974
|
-
hash: "svelte-
|
|
1975
|
-
code:
|
|
984
|
+
var Zr = K('<div class="shape-wrapper svelte-19ptej3"><!> <button part="button" class="play-button svelte-19ptej3"><div aria-hidden="true"><!></div> <span part="icon" class="icon svelte-19ptej3"><!></span></button></div>');
|
|
985
|
+
const Yr = {
|
|
986
|
+
hash: "svelte-19ptej3",
|
|
987
|
+
code: `.shape-wrapper.svelte-19ptej3 {position:relative;width:var(--fortyfour-play-button-size, 48px);height:var(--fortyfour-play-button-size, 48px);font-size:var(--fortyfour-play-button-size, 48px);}.play-button.svelte-19ptej3 {position:relative;width:100%;height:100%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;background:transparent;color:var(--fortyfour-play-button-icon-color);padding:0;}.play-button.svelte-19ptej3:focus-visible {outline:var(--fortyfour-play-button-focus-width) solid var(--fortyfour-play-button-focus-color);outline-offset:var(--fortyfour-play-button-focus-offset);}.play-button.svelte-19ptej3:disabled {opacity:0.5;cursor:not-allowed;}.blob-background.svelte-19ptej3 {position:absolute;inset:0;background:var(--fortyfour-play-button-background-color);border:var(--fortyfour-play-button-border-width) solid
|
|
988
|
+
var(--fortyfour-play-button-border-color);overflow:hidden;}.blob-background.has-ring.svelte-19ptej3 {border:none;}.icon.svelte-19ptej3 {position:relative;z-index:1;width:1em;height:1em;display:flex;align-items:center;justify-content:center;}.icon.svelte-19ptej3 svg {width:100%;height:100%;fill:currentColor;}`
|
|
1976
989
|
};
|
|
1977
|
-
function
|
|
1978
|
-
|
|
1979
|
-
let
|
|
1980
|
-
function
|
|
1981
|
-
return Math.floor(
|
|
990
|
+
function dr(g, r) {
|
|
991
|
+
ge(r, !0), we(g, Yr);
|
|
992
|
+
let c = d(r, "onclick", 7), n = d(r, "disabled", 7, !1), a = d(r, "loading", 7, !1), o = d(r, "visualization", 7, "none"), i = d(r, "progressPercent", 7, 0), l = d(r, "isPlaying", 7, !1), y = d(r, "amplitude", 7, 0), h = d(r, "rippleIntensity", 7, 1), f = d(r, "ariaLabel", 7, "Play"), x = d(r, "animate", 7, !1), u = d(r, "speed", 7, 20), s = d(r, "children", 7);
|
|
993
|
+
function k(t, T) {
|
|
994
|
+
return Math.floor(t + Math.random() * (T - t));
|
|
1982
995
|
}
|
|
1983
|
-
function
|
|
1984
|
-
const
|
|
1985
|
-
let
|
|
1986
|
-
for (let
|
|
1987
|
-
let
|
|
1988
|
-
|
|
1989
|
-
}
|
|
1990
|
-
return `${
|
|
996
|
+
function p() {
|
|
997
|
+
const T = (A) => 100 - A;
|
|
998
|
+
let _ = [];
|
|
999
|
+
for (let A = 0; A < 4; A++) {
|
|
1000
|
+
let N = k(25, T(25));
|
|
1001
|
+
_.push(N), _.push(T(N));
|
|
1002
|
+
}
|
|
1003
|
+
return `${_[0]}% ${_[1]}% ${_[2]}% ${_[3]}% / ${_[4]}% ${_[6]}% ${_[7]}% ${_[5]}%`;
|
|
1991
1004
|
}
|
|
1992
|
-
const
|
|
1993
|
-
{ borderRadius:
|
|
1994
|
-
{ borderRadius:
|
|
1995
|
-
{ borderRadius:
|
|
1996
|
-
{ borderRadius:
|
|
1997
|
-
{ borderRadius:
|
|
1998
|
-
{ borderRadius:
|
|
1999
|
-
{ borderRadius:
|
|
2000
|
-
{ borderRadius:
|
|
2001
|
-
],
|
|
2002
|
-
let
|
|
2003
|
-
const
|
|
2004
|
-
|
|
2005
|
-
duration:
|
|
1005
|
+
const w = p(), C = [
|
|
1006
|
+
{ borderRadius: w, offset: 0 },
|
|
1007
|
+
{ borderRadius: p(), offset: 0.15 },
|
|
1008
|
+
{ borderRadius: p(), offset: 0.3 },
|
|
1009
|
+
{ borderRadius: p(), offset: 0.45 },
|
|
1010
|
+
{ borderRadius: p(), offset: 0.6 },
|
|
1011
|
+
{ borderRadius: p(), offset: 0.75 },
|
|
1012
|
+
{ borderRadius: p(), offset: 0.9 },
|
|
1013
|
+
{ borderRadius: w, offset: 1 }
|
|
1014
|
+
], U = w;
|
|
1015
|
+
let X = q(null), F = null;
|
|
1016
|
+
const te = typeof window < "u" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
|
1017
|
+
de(() => (e(X) && x() && !te && (F = e(X).animate(C, {
|
|
1018
|
+
duration: u() * 1e3,
|
|
2006
1019
|
iterations: 1 / 0,
|
|
2007
1020
|
easing: "ease"
|
|
2008
1021
|
})), () => {
|
|
2009
|
-
|
|
1022
|
+
F && (F.cancel(), F = null);
|
|
2010
1023
|
}));
|
|
2011
1024
|
var V = {
|
|
2012
1025
|
get onclick() {
|
|
2013
|
-
return
|
|
1026
|
+
return c();
|
|
2014
1027
|
},
|
|
2015
|
-
set onclick(
|
|
2016
|
-
|
|
1028
|
+
set onclick(t) {
|
|
1029
|
+
c(t), v();
|
|
2017
1030
|
},
|
|
2018
1031
|
get disabled() {
|
|
2019
|
-
return
|
|
1032
|
+
return n();
|
|
2020
1033
|
},
|
|
2021
|
-
set disabled(
|
|
2022
|
-
|
|
1034
|
+
set disabled(t = !1) {
|
|
1035
|
+
n(t), v();
|
|
2023
1036
|
},
|
|
2024
1037
|
get loading() {
|
|
2025
|
-
return
|
|
1038
|
+
return a();
|
|
2026
1039
|
},
|
|
2027
|
-
set loading(
|
|
2028
|
-
|
|
1040
|
+
set loading(t = !1) {
|
|
1041
|
+
a(t), v();
|
|
2029
1042
|
},
|
|
2030
1043
|
get visualization() {
|
|
2031
|
-
return
|
|
1044
|
+
return o();
|
|
2032
1045
|
},
|
|
2033
|
-
set visualization(
|
|
2034
|
-
|
|
1046
|
+
set visualization(t = "none") {
|
|
1047
|
+
o(t), v();
|
|
2035
1048
|
},
|
|
2036
1049
|
get progressPercent() {
|
|
2037
|
-
return
|
|
1050
|
+
return i();
|
|
2038
1051
|
},
|
|
2039
|
-
set progressPercent(
|
|
2040
|
-
|
|
1052
|
+
set progressPercent(t = 0) {
|
|
1053
|
+
i(t), v();
|
|
2041
1054
|
},
|
|
2042
1055
|
get isPlaying() {
|
|
2043
|
-
return
|
|
1056
|
+
return l();
|
|
2044
1057
|
},
|
|
2045
|
-
set isPlaying(
|
|
2046
|
-
|
|
1058
|
+
set isPlaying(t = !1) {
|
|
1059
|
+
l(t), v();
|
|
2047
1060
|
},
|
|
2048
1061
|
get amplitude() {
|
|
2049
|
-
return
|
|
1062
|
+
return y();
|
|
2050
1063
|
},
|
|
2051
|
-
set amplitude(
|
|
2052
|
-
|
|
1064
|
+
set amplitude(t = 0) {
|
|
1065
|
+
y(t), v();
|
|
2053
1066
|
},
|
|
2054
1067
|
get rippleIntensity() {
|
|
2055
|
-
return
|
|
1068
|
+
return h();
|
|
2056
1069
|
},
|
|
2057
|
-
set rippleIntensity(
|
|
2058
|
-
|
|
1070
|
+
set rippleIntensity(t = 1) {
|
|
1071
|
+
h(t), v();
|
|
2059
1072
|
},
|
|
2060
1073
|
get ariaLabel() {
|
|
2061
1074
|
return f();
|
|
2062
1075
|
},
|
|
2063
|
-
set ariaLabel(
|
|
2064
|
-
f(
|
|
1076
|
+
set ariaLabel(t = "Play") {
|
|
1077
|
+
f(t), v();
|
|
2065
1078
|
},
|
|
2066
1079
|
get animate() {
|
|
2067
|
-
return
|
|
1080
|
+
return x();
|
|
2068
1081
|
},
|
|
2069
|
-
set animate(
|
|
2070
|
-
|
|
1082
|
+
set animate(t = !1) {
|
|
1083
|
+
x(t), v();
|
|
2071
1084
|
},
|
|
2072
1085
|
get speed() {
|
|
2073
|
-
return
|
|
1086
|
+
return u();
|
|
2074
1087
|
},
|
|
2075
|
-
set speed(
|
|
2076
|
-
|
|
1088
|
+
set speed(t = 20) {
|
|
1089
|
+
u(t), v();
|
|
2077
1090
|
},
|
|
2078
1091
|
get children() {
|
|
2079
|
-
return
|
|
1092
|
+
return s();
|
|
2080
1093
|
},
|
|
2081
|
-
set children(
|
|
2082
|
-
|
|
1094
|
+
set children(t) {
|
|
1095
|
+
s(t), v();
|
|
2083
1096
|
}
|
|
2084
|
-
},
|
|
2085
|
-
let
|
|
2086
|
-
var
|
|
1097
|
+
}, H = Zr();
|
|
1098
|
+
let be;
|
|
1099
|
+
var I = G(H);
|
|
2087
1100
|
{
|
|
2088
|
-
var
|
|
2089
|
-
|
|
1101
|
+
var j = (t) => {
|
|
1102
|
+
Je(t, {
|
|
2090
1103
|
get isPlaying() {
|
|
2091
|
-
return
|
|
1104
|
+
return l();
|
|
2092
1105
|
},
|
|
2093
1106
|
get amplitude() {
|
|
2094
|
-
return
|
|
1107
|
+
return y();
|
|
2095
1108
|
},
|
|
2096
1109
|
get intensity() {
|
|
2097
|
-
return
|
|
1110
|
+
return h();
|
|
2098
1111
|
}
|
|
2099
1112
|
});
|
|
2100
1113
|
};
|
|
2101
|
-
|
|
2102
|
-
|
|
1114
|
+
J(I, (t) => {
|
|
1115
|
+
o() === "ripple" && t(j);
|
|
2103
1116
|
});
|
|
2104
1117
|
}
|
|
2105
|
-
var
|
|
2106
|
-
|
|
2107
|
-
|
|
1118
|
+
var B = pe(I, 2);
|
|
1119
|
+
B.__click = function(...t) {
|
|
1120
|
+
c()?.apply(this, t);
|
|
2108
1121
|
};
|
|
2109
|
-
var
|
|
2110
|
-
let
|
|
2111
|
-
var Q = G(
|
|
1122
|
+
var ee = G(B);
|
|
1123
|
+
let b, L;
|
|
1124
|
+
var Q = G(ee);
|
|
2112
1125
|
{
|
|
2113
|
-
var
|
|
2114
|
-
|
|
1126
|
+
var ve = (t) => {
|
|
1127
|
+
Ve(t, {
|
|
2115
1128
|
get progress() {
|
|
2116
|
-
return
|
|
1129
|
+
return i();
|
|
2117
1130
|
}
|
|
2118
1131
|
});
|
|
2119
1132
|
};
|
|
2120
|
-
|
|
2121
|
-
|
|
1133
|
+
J(Q, (t) => {
|
|
1134
|
+
o() === "ring" && t(ve);
|
|
2122
1135
|
});
|
|
2123
1136
|
}
|
|
2124
|
-
|
|
2125
|
-
var
|
|
2126
|
-
return
|
|
2127
|
-
(
|
|
2128
|
-
|
|
1137
|
+
D(ee), Pe(ee, (t) => m(X, t), () => e(X));
|
|
1138
|
+
var E = pe(ee, 2), R = G(E);
|
|
1139
|
+
return Ae(R, s), D(E), D(B), D(H), M(
|
|
1140
|
+
(t, T, _) => {
|
|
1141
|
+
be = me(H, "", be, t), B.disabled = n(), W(B, "aria-label", f()), W(B, "aria-busy", a()), b = ie(ee, 1, "blob-background svelte-19ptej3", null, b, T), L = me(ee, "", L, _);
|
|
2129
1142
|
},
|
|
2130
1143
|
[
|
|
2131
|
-
() => ({ "border-radius":
|
|
2132
|
-
() => ({ "has-ring":
|
|
2133
|
-
() => ({ "border-radius":
|
|
1144
|
+
() => ({ "border-radius": U }),
|
|
1145
|
+
() => ({ "has-ring": o() === "ring" }),
|
|
1146
|
+
() => ({ "border-radius": U })
|
|
2134
1147
|
]
|
|
2135
|
-
),
|
|
1148
|
+
), z(g, H), ye(V);
|
|
2136
1149
|
}
|
|
2137
|
-
|
|
1150
|
+
He(["click"]);
|
|
2138
1151
|
ue(
|
|
2139
|
-
|
|
1152
|
+
dr,
|
|
2140
1153
|
{
|
|
2141
1154
|
onclick: {},
|
|
2142
1155
|
disabled: {},
|
|
@@ -2155,20 +1168,20 @@ ue(
|
|
|
2155
1168
|
[],
|
|
2156
1169
|
!0
|
|
2157
1170
|
);
|
|
2158
|
-
|
|
2159
|
-
var
|
|
2160
|
-
function
|
|
2161
|
-
var
|
|
2162
|
-
|
|
1171
|
+
Er();
|
|
1172
|
+
var Vr = Le('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" aria-hidden="true"><path d="M187.2 100.9C174.8 94.1 159.8 94.4 147.6 101.6C135.4 108.8 128 121.9 128 136L128 504C128 518.1 135.5 531.2 147.6 538.4C159.7 545.6 174.8 545.9 187.2 539.1L523.2 355.1C536 348.1 544 334.6 544 320C544 305.4 536 291.9 523.2 284.9L187.2 100.9z" fill="currentColor"></path></svg>');
|
|
1173
|
+
function vr(g) {
|
|
1174
|
+
var r = Vr();
|
|
1175
|
+
z(g, r);
|
|
2163
1176
|
}
|
|
2164
|
-
ue(
|
|
2165
|
-
var
|
|
2166
|
-
function
|
|
2167
|
-
var
|
|
2168
|
-
|
|
1177
|
+
ue(vr, {}, [], [], !0);
|
|
1178
|
+
var Jr = Le('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" aria-hidden="true"><path d="M176 96C149.5 96 128 117.5 128 144L128 496C128 522.5 149.5 544 176 544L240 544C266.5 544 288 522.5 288 496L288 144C288 117.5 266.5 96 240 96L176 96zM400 96C373.5 96 352 117.5 352 144L352 496C352 522.5 373.5 544 400 544L464 544C490.5 544 512 522.5 512 496L512 144C512 117.5 490.5 96 464 96L400 96z" fill="currentColor"></path></svg>');
|
|
1179
|
+
function pr(g) {
|
|
1180
|
+
var r = Jr();
|
|
1181
|
+
z(g, r);
|
|
2169
1182
|
}
|
|
2170
|
-
ue(
|
|
2171
|
-
var
|
|
1183
|
+
ue(pr, {}, [], [], !0);
|
|
1184
|
+
var Qr = Le(`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" aria-hidden="true"><style>circle {
|
|
2172
1185
|
animation: fade 1s ease-in-out infinite;
|
|
2173
1186
|
}
|
|
2174
1187
|
circle:nth-child(2) {
|
|
@@ -2192,20 +1205,21 @@ var sa = Me(`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" aria-
|
|
|
2192
1205
|
opacity: 0.6;
|
|
2193
1206
|
}
|
|
2194
1207
|
}</style><circle cx="160" cy="320" r="56"></circle><circle cx="320" cy="320" r="56"></circle><circle cx="480" cy="320" r="56"></circle></svg>`);
|
|
2195
|
-
function
|
|
2196
|
-
var
|
|
2197
|
-
|
|
1208
|
+
function gr(g) {
|
|
1209
|
+
var r = Qr();
|
|
1210
|
+
z(g, r);
|
|
2198
1211
|
}
|
|
2199
|
-
ue(
|
|
2200
|
-
var
|
|
2201
|
-
function
|
|
2202
|
-
var
|
|
2203
|
-
|
|
1212
|
+
ue(gr, {}, [], [], !0);
|
|
1213
|
+
var $r = Le('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" aria-hidden="true"><path d="M320 64C178.6 64 64 178.6 64 320C64 461.4 178.6 576 320 576C461.4 576 576 461.4 576 320C576 178.6 461.4 64 320 64zM288 192C288 174.3 302.3 160 320 160C337.7 160 352 174.3 352 192L352 352C352 369.7 337.7 384 320 384C302.3 384 288 369.7 288 352L288 192zM320 480C302.3 480 288 465.7 288 448C288 430.3 302.3 416 320 416C337.7 416 352 430.3 352 448C352 465.7 337.7 480 320 480z"></path></svg>');
|
|
1214
|
+
function yr(g) {
|
|
1215
|
+
var r = $r();
|
|
1216
|
+
z(g, r);
|
|
2204
1217
|
}
|
|
2205
|
-
ue(
|
|
2206
|
-
|
|
2207
|
-
|
|
2208
|
-
|
|
1218
|
+
ue(yr, {}, [], [], !0);
|
|
1219
|
+
var et = K('<div class="wrapper svelte-1a44wbi"><!></div>');
|
|
1220
|
+
const rt = {
|
|
1221
|
+
hash: "svelte-1a44wbi",
|
|
1222
|
+
code: `.wrapper.svelte-1a44wbi {display:contents;}:host {--fortyfour-play-button-size: 48px;--fortyfour-play-button-background-color: #3b82f6;--fortyfour-play-button-icon-color: #ffffff;--fortyfour-play-button-border-width: 2px;--fortyfour-play-button-border-color: #ffffff;--fortyfour-play-button-border-radius: 12px;--fortyfour-play-button-ring-width: var(--fortyfour-play-button-border-width);--fortyfour-play-button-ring-fill-color: #ffffff;--fortyfour-play-button-ring-track-color: transparent;--fortyfour-play-button-hover-scale: 1.04;--fortyfour-play-button-hover-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);--fortyfour-play-button-focus-color: var(--fortyfour-play-button-background-color);--fortyfour-play-button-focus-width: 2px;--fortyfour-play-button-focus-offset: 2px;display:inline-block;font-size:var(--fortyfour-play-button-size);}:host([hover="scale"]) {transition:transform 0.15s ease-out;}:host([hover="scale"]:hover:not([disabled])) {transform:scale(var(--fortyfour-play-button-hover-scale));}:host([hover="glow"]) {transition:filter 0.15s ease-out;}:host([hover="glow"]:hover:not([disabled])) {filter:drop-shadow(var(--fortyfour-play-button-hover-shadow));}:host([hover="lift"]) {transition:transform 0.15s ease-out,
|
|
2209
1223
|
filter 0.15s ease-out;}:host([hover="lift"]:hover:not([disabled])) {transform:scale(var(--fortyfour-play-button-hover-scale));filter:drop-shadow(var(--fortyfour-play-button-hover-shadow));}
|
|
2210
1224
|
|
|
2211
1225
|
@media (prefers-reduced-motion: reduce) {:host([hover="scale"]),
|
|
@@ -2213,165 +1227,165 @@ const ca = {
|
|
|
2213
1227
|
:host([hover="lift"]) {transition:none;}
|
|
2214
1228
|
}`
|
|
2215
1229
|
};
|
|
2216
|
-
function
|
|
2217
|
-
|
|
2218
|
-
const
|
|
2219
|
-
var
|
|
1230
|
+
function tt(g, r) {
|
|
1231
|
+
ge(r, !0), we(g, rt);
|
|
1232
|
+
const c = (b) => {
|
|
1233
|
+
var L = se(), Q = re(L);
|
|
2220
1234
|
{
|
|
2221
|
-
var
|
|
2222
|
-
var
|
|
2223
|
-
|
|
2224
|
-
|
|
2225
|
-
}),
|
|
2226
|
-
},
|
|
2227
|
-
var
|
|
1235
|
+
var ve = (R) => {
|
|
1236
|
+
var t = se(), T = re(t);
|
|
1237
|
+
qe(T, r, "icon-error", {}, (_) => {
|
|
1238
|
+
yr(_);
|
|
1239
|
+
}), z(R, t);
|
|
1240
|
+
}, E = (R) => {
|
|
1241
|
+
var t = se(), T = re(t);
|
|
2228
1242
|
{
|
|
2229
|
-
var
|
|
2230
|
-
var
|
|
2231
|
-
|
|
2232
|
-
|
|
2233
|
-
}),
|
|
2234
|
-
},
|
|
2235
|
-
var
|
|
1243
|
+
var _ = (N) => {
|
|
1244
|
+
var Y = se(), P = re(Y);
|
|
1245
|
+
qe(P, r, "icon-loading", {}, (O) => {
|
|
1246
|
+
gr(O);
|
|
1247
|
+
}), z(N, Y);
|
|
1248
|
+
}, A = (N) => {
|
|
1249
|
+
var Y = se(), P = re(Y);
|
|
2236
1250
|
{
|
|
2237
|
-
var
|
|
2238
|
-
var
|
|
2239
|
-
|
|
2240
|
-
|
|
2241
|
-
}),
|
|
2242
|
-
},
|
|
2243
|
-
var
|
|
2244
|
-
|
|
2245
|
-
|
|
2246
|
-
}),
|
|
1251
|
+
var O = (ae) => {
|
|
1252
|
+
var ce = se(), le = re(ce);
|
|
1253
|
+
qe(le, r, "icon-playing", {}, ($) => {
|
|
1254
|
+
pr($);
|
|
1255
|
+
}), z(ae, ce);
|
|
1256
|
+
}, oe = (ae) => {
|
|
1257
|
+
var ce = se(), le = re(ce);
|
|
1258
|
+
qe(le, r, "icon-paused", {}, ($) => {
|
|
1259
|
+
vr($);
|
|
1260
|
+
}), z(ae, ce);
|
|
2247
1261
|
};
|
|
2248
|
-
|
|
2249
|
-
|
|
2250
|
-
(
|
|
2251
|
-
e(
|
|
1262
|
+
J(
|
|
1263
|
+
P,
|
|
1264
|
+
(ae) => {
|
|
1265
|
+
e(U) ? ae(O) : ae(oe, !1);
|
|
2252
1266
|
},
|
|
2253
1267
|
!0
|
|
2254
1268
|
);
|
|
2255
1269
|
}
|
|
2256
|
-
|
|
1270
|
+
z(N, Y);
|
|
2257
1271
|
};
|
|
2258
|
-
|
|
2259
|
-
|
|
2260
|
-
(
|
|
2261
|
-
V() ?
|
|
1272
|
+
J(
|
|
1273
|
+
T,
|
|
1274
|
+
(N) => {
|
|
1275
|
+
V() ? N(_) : N(A, !1);
|
|
2262
1276
|
},
|
|
2263
1277
|
!0
|
|
2264
1278
|
);
|
|
2265
1279
|
}
|
|
2266
|
-
|
|
1280
|
+
z(R, t);
|
|
2267
1281
|
};
|
|
2268
|
-
|
|
2269
|
-
e(
|
|
1282
|
+
J(Q, (R) => {
|
|
1283
|
+
e(F) ? R(ve) : R(E, !1);
|
|
2270
1284
|
});
|
|
2271
1285
|
}
|
|
2272
|
-
|
|
2273
|
-
},
|
|
2274
|
-
let
|
|
2275
|
-
const
|
|
2276
|
-
circle:
|
|
2277
|
-
square:
|
|
2278
|
-
"rounded-square":
|
|
2279
|
-
blob:
|
|
1286
|
+
z(b, L);
|
|
1287
|
+
}, n = r.$$host;
|
|
1288
|
+
let a = d(r, "for", 7, ""), o = d(r, "shape", 7, "circle"), i = d(r, "visualization", 7, "none"), l = d(r, "hover", 7, "none"), y = d(r, "rippleIntensity", 7, 1), h = d(r, "blobAnimate", 7, !1), f = d(r, "blobSpeed", 7, 20);
|
|
1289
|
+
const x = {
|
|
1290
|
+
circle: Ge,
|
|
1291
|
+
square: fr,
|
|
1292
|
+
"rounded-square": cr,
|
|
1293
|
+
blob: dr
|
|
2280
1294
|
};
|
|
2281
|
-
let
|
|
2282
|
-
const C =
|
|
2283
|
-
if (!e(
|
|
1295
|
+
let u = q(null), s = q("idle"), k = q(0), p = q(0), w = q(We([]));
|
|
1296
|
+
const C = S(() => x[o()] ?? Ge), U = S(() => e(s) === "playing"), X = S(() => e(s) === "loading"), F = S(() => e(s) === "error"), te = S(() => e(p) > 0 ? e(k) / e(p) : 0), V = Ye(() => e(X), 200), H = S(() => {
|
|
1297
|
+
if (!e(w).length || e(p) === 0)
|
|
2284
1298
|
return 0;
|
|
2285
|
-
const
|
|
2286
|
-
return Math.sqrt(
|
|
2287
|
-
}),
|
|
2288
|
-
onclick:
|
|
2289
|
-
disabled: !
|
|
2290
|
-
loading: e(
|
|
2291
|
-
visualization:
|
|
2292
|
-
progressPercent: e(
|
|
2293
|
-
isPlaying: e(
|
|
2294
|
-
amplitude: e(
|
|
2295
|
-
rippleIntensity:
|
|
2296
|
-
ariaLabel: e(
|
|
2297
|
-
...
|
|
1299
|
+
const b = Math.floor(e(k) / e(p) * e(w).length), L = 3, Q = Math.max(0, b - Math.floor(L / 2)), ve = Math.min(e(w).length, Q + L), E = e(w).slice(Q, ve), R = E.reduce((t, T) => t + T * T, 0);
|
|
1300
|
+
return Math.sqrt(R / E.length);
|
|
1301
|
+
}), be = S(() => ({
|
|
1302
|
+
onclick: I,
|
|
1303
|
+
disabled: !a() || e(F),
|
|
1304
|
+
loading: e(X),
|
|
1305
|
+
visualization: i(),
|
|
1306
|
+
progressPercent: e(te),
|
|
1307
|
+
isPlaying: e(U),
|
|
1308
|
+
amplitude: e(H),
|
|
1309
|
+
rippleIntensity: y(),
|
|
1310
|
+
ariaLabel: e(U) ? "Pause" : "Play",
|
|
1311
|
+
...o() === "blob" ? { animate: h(), speed: f() } : {}
|
|
2298
1312
|
}));
|
|
2299
|
-
|
|
2300
|
-
if (!
|
|
1313
|
+
de(() => {
|
|
1314
|
+
if (!a()) {
|
|
2301
1315
|
console.warn("fortyfour-play-button: 'for' attribute is required");
|
|
2302
1316
|
return;
|
|
2303
1317
|
}
|
|
2304
|
-
const
|
|
2305
|
-
if (m(
|
|
2306
|
-
console.warn(`fortyfour-play-button: element with id "${
|
|
1318
|
+
const b = n.getRootNode();
|
|
1319
|
+
if (m(u, b.getElementById(a()), !0), !e(u)) {
|
|
1320
|
+
console.warn(`fortyfour-play-button: element with id "${a()}" not found`);
|
|
2307
1321
|
return;
|
|
2308
1322
|
}
|
|
2309
|
-
function
|
|
2310
|
-
m(
|
|
1323
|
+
function L() {
|
|
1324
|
+
m(s, e(u).state, !0), m(k, e(u).currentTime, !0), m(p, e(u).duration, !0), m(w, e(u).metadata?.waveform ?? [], !0);
|
|
2311
1325
|
}
|
|
2312
|
-
return
|
|
2313
|
-
e(
|
|
1326
|
+
return L(), e(u).addEventListener("loading", L), e(u).addEventListener("loadedmetadata", L), e(u).addEventListener("play", L), e(u).addEventListener("pause", L), e(u).addEventListener("ended", L), e(u).addEventListener("error", L), e(u).addEventListener("timeupdate", L), () => {
|
|
1327
|
+
e(u).removeEventListener("loading", L), e(u).removeEventListener("loadedmetadata", L), e(u).removeEventListener("play", L), e(u).removeEventListener("pause", L), e(u).removeEventListener("ended", L), e(u).removeEventListener("error", L), e(u).removeEventListener("timeupdate", L);
|
|
2314
1328
|
};
|
|
2315
1329
|
});
|
|
2316
|
-
function
|
|
2317
|
-
e(
|
|
1330
|
+
function I() {
|
|
1331
|
+
e(u)?.togglePlay();
|
|
2318
1332
|
}
|
|
2319
|
-
|
|
2320
|
-
var
|
|
1333
|
+
Te(n, "data-playing", () => e(U)), Te(n, "data-loading", V), Te(n, "data-error", () => e(F));
|
|
1334
|
+
var j = {
|
|
2321
1335
|
get for() {
|
|
2322
|
-
return
|
|
1336
|
+
return a();
|
|
2323
1337
|
},
|
|
2324
|
-
set for(
|
|
2325
|
-
|
|
1338
|
+
set for(b = "") {
|
|
1339
|
+
a(b), v();
|
|
2326
1340
|
},
|
|
2327
1341
|
get shape() {
|
|
2328
|
-
return
|
|
1342
|
+
return o();
|
|
2329
1343
|
},
|
|
2330
|
-
set shape(
|
|
2331
|
-
|
|
1344
|
+
set shape(b = "circle") {
|
|
1345
|
+
o(b), v();
|
|
2332
1346
|
},
|
|
2333
1347
|
get visualization() {
|
|
2334
|
-
return
|
|
1348
|
+
return i();
|
|
2335
1349
|
},
|
|
2336
|
-
set visualization(
|
|
2337
|
-
|
|
1350
|
+
set visualization(b = "none") {
|
|
1351
|
+
i(b), v();
|
|
2338
1352
|
},
|
|
2339
1353
|
get hover() {
|
|
2340
|
-
return
|
|
1354
|
+
return l();
|
|
2341
1355
|
},
|
|
2342
|
-
set hover(
|
|
2343
|
-
|
|
1356
|
+
set hover(b = "none") {
|
|
1357
|
+
l(b), v();
|
|
2344
1358
|
},
|
|
2345
1359
|
get rippleIntensity() {
|
|
2346
|
-
return
|
|
1360
|
+
return y();
|
|
2347
1361
|
},
|
|
2348
|
-
set rippleIntensity(
|
|
2349
|
-
|
|
1362
|
+
set rippleIntensity(b = 1) {
|
|
1363
|
+
y(b), v();
|
|
2350
1364
|
},
|
|
2351
1365
|
get blobAnimate() {
|
|
2352
|
-
return
|
|
1366
|
+
return h();
|
|
2353
1367
|
},
|
|
2354
|
-
set blobAnimate(
|
|
2355
|
-
|
|
1368
|
+
set blobAnimate(b = !1) {
|
|
1369
|
+
h(b), v();
|
|
2356
1370
|
},
|
|
2357
1371
|
get blobSpeed() {
|
|
2358
1372
|
return f();
|
|
2359
1373
|
},
|
|
2360
|
-
set blobSpeed(
|
|
2361
|
-
f(
|
|
1374
|
+
set blobSpeed(b = 20) {
|
|
1375
|
+
f(b), v();
|
|
2362
1376
|
}
|
|
2363
|
-
},
|
|
2364
|
-
return
|
|
2365
|
-
|
|
2366
|
-
children: (Q,
|
|
2367
|
-
|
|
1377
|
+
}, B = et(), ee = G(B);
|
|
1378
|
+
return Rr(ee, () => e(C), (b, L) => {
|
|
1379
|
+
L(b, Ir(() => e(be), {
|
|
1380
|
+
children: (Q, ve) => {
|
|
1381
|
+
c(Q);
|
|
2368
1382
|
},
|
|
2369
1383
|
$$slots: { default: !0 }
|
|
2370
1384
|
}));
|
|
2371
|
-
}),
|
|
1385
|
+
}), D(B), z(g, B), ye(j);
|
|
2372
1386
|
}
|
|
2373
1387
|
customElements.define("fortyfour-play-button", ue(
|
|
2374
|
-
|
|
1388
|
+
tt,
|
|
2375
1389
|
{
|
|
2376
1390
|
for: { attribute: "for", reflect: !0 },
|
|
2377
1391
|
shape: { attribute: "shape", reflect: !0 },
|
|
@@ -2385,145 +1399,145 @@ customElements.define("fortyfour-play-button", ue(
|
|
|
2385
1399
|
[],
|
|
2386
1400
|
!0
|
|
2387
1401
|
));
|
|
2388
|
-
function
|
|
2389
|
-
if (!
|
|
1402
|
+
function br(g, r) {
|
|
1403
|
+
if (!g.length || r <= 0)
|
|
2390
1404
|
return [];
|
|
2391
|
-
const
|
|
2392
|
-
for (let
|
|
2393
|
-
const
|
|
2394
|
-
|
|
1405
|
+
const c = g.length / r, n = [];
|
|
1406
|
+
for (let a = 0; a < r; a++) {
|
|
1407
|
+
const o = Math.floor(a * c), i = Math.floor((a + 1) * c), l = g.slice(o, Math.max(o + 1, i)), y = l.reduce((f, x) => f + x * x, 0), h = Math.sqrt(y / l.length);
|
|
1408
|
+
n.push(h);
|
|
2395
1409
|
}
|
|
2396
|
-
return
|
|
1410
|
+
return n;
|
|
2397
1411
|
}
|
|
2398
|
-
function
|
|
2399
|
-
return function(
|
|
2400
|
-
const
|
|
2401
|
-
if (!
|
|
1412
|
+
function Qe(g, r, c) {
|
|
1413
|
+
return function(a) {
|
|
1414
|
+
const o = g(), i = r(), l = c();
|
|
1415
|
+
if (!o || !l || i <= 0)
|
|
2402
1416
|
return;
|
|
2403
|
-
const
|
|
2404
|
-
|
|
1417
|
+
const y = a.clientX - l.left, f = Math.max(0, Math.min(1, y / l.width)) * i;
|
|
1418
|
+
o.seek(f);
|
|
2405
1419
|
};
|
|
2406
1420
|
}
|
|
2407
|
-
function
|
|
2408
|
-
return function(
|
|
2409
|
-
const
|
|
2410
|
-
if (!
|
|
1421
|
+
function $e(g, r, c) {
|
|
1422
|
+
return function(a) {
|
|
1423
|
+
const o = g(), i = r(), l = c();
|
|
1424
|
+
if (!o || i <= 0)
|
|
2411
1425
|
return;
|
|
2412
|
-
const
|
|
2413
|
-
|
|
1426
|
+
const y = i * 0.05;
|
|
1427
|
+
a.key === "ArrowRight" ? o.seek(Math.min(i, l + y)) : a.key === "ArrowLeft" && o.seek(Math.max(0, l - y));
|
|
2414
1428
|
};
|
|
2415
1429
|
}
|
|
2416
|
-
var
|
|
2417
|
-
const
|
|
1430
|
+
var ot = Le("<rect></rect>"), at = K('<div class="waveform svelte-kt0w9q" role="slider" tabindex="0" aria-valuemin="0" aria-label="Audio playback position"><svg width="100%" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" class="svelte-kt0w9q"><!></svg></div>');
|
|
1431
|
+
const nt = {
|
|
2418
1432
|
hash: "svelte-kt0w9q",
|
|
2419
1433
|
code: ":host {display:flex;flex:1;--waveform-progress-color: #3b82f6;--waveform-track-color: #e5e7eb;--waveform-focus-color: #3b82f6;--waveform-focus-width: 2px;--waveform-focus-offset: 2px;--waveform-focus-radius: 4px;}.waveform.svelte-kt0w9q {flex:1;height:100%;display:flex;align-items:center;cursor:pointer;border-radius:var(--waveform-focus-radius);}.waveform.svelte-kt0w9q:focus-visible {outline:var(--waveform-focus-width) solid var(--waveform-focus-color);outline-offset:var(--waveform-focus-offset);}svg.svelte-kt0w9q {display:block;}.bar.svelte-kt0w9q {transition:fill 0.15s;}.progress.svelte-kt0w9q {fill:var(--waveform-progress-color);}.track.svelte-kt0w9q {fill:var(--waveform-track-color);}"
|
|
2420
1434
|
};
|
|
2421
|
-
function
|
|
2422
|
-
|
|
2423
|
-
const
|
|
2424
|
-
let
|
|
2425
|
-
|
|
2426
|
-
const
|
|
2427
|
-
for (let
|
|
2428
|
-
m(
|
|
1435
|
+
function it(g, r) {
|
|
1436
|
+
ge(r, !0), we(g, nt);
|
|
1437
|
+
const c = r.$$host;
|
|
1438
|
+
let n = d(r, "for", 7, ""), a = d(r, "barWidth", 7, 3), o = d(r, "barGap", 7, 1), i = d(r, "barRadius", 7, 1), l = d(r, "minBarHeight", 7, 3), y = d(r, "height", 7, 56), h = q(We([])), f = q(0), x = q(0), u = q(null), s = q(0), k = q(!1), p = q(null);
|
|
1439
|
+
c.style.height = `${y()}px`, sr(() => {
|
|
1440
|
+
const b = new ResizeObserver((L) => {
|
|
1441
|
+
for (let Q of L)
|
|
1442
|
+
m(s, Q.contentRect.width || 0, !0), m(k, !0);
|
|
2429
1443
|
});
|
|
2430
|
-
return e(
|
|
2431
|
-
|
|
1444
|
+
return e(p) && b.observe(e(p)), () => {
|
|
1445
|
+
b.disconnect();
|
|
2432
1446
|
};
|
|
2433
|
-
}),
|
|
2434
|
-
if (!
|
|
1447
|
+
}), de(() => {
|
|
1448
|
+
if (!n()) {
|
|
2435
1449
|
console.warn("fortyfour-bar-waveform: 'for' attribute is required");
|
|
2436
1450
|
return;
|
|
2437
1451
|
}
|
|
2438
|
-
const
|
|
2439
|
-
if (m(
|
|
2440
|
-
console.warn(`fortyfour-bar-waveform: element with id "${
|
|
1452
|
+
const b = c.getRootNode();
|
|
1453
|
+
if (m(u, b.getElementById(n()), !0), !e(u)) {
|
|
1454
|
+
console.warn(`fortyfour-bar-waveform: element with id "${n()}" not found`);
|
|
2441
1455
|
return;
|
|
2442
1456
|
}
|
|
2443
|
-
e(
|
|
2444
|
-
function
|
|
2445
|
-
m(
|
|
1457
|
+
e(u).metadata?.waveform && m(h, e(u).metadata.waveform, !0), e(u).duration && m(x, e(u).duration, !0), e(u).currentTime && m(f, e(u).currentTime, !0);
|
|
1458
|
+
function L() {
|
|
1459
|
+
m(h, e(u).metadata?.waveform || [], !0), m(x, e(u).duration, !0);
|
|
2446
1460
|
}
|
|
2447
|
-
function
|
|
2448
|
-
m(f, e(
|
|
1461
|
+
function Q() {
|
|
1462
|
+
m(f, e(u).currentTime, !0);
|
|
2449
1463
|
}
|
|
2450
|
-
return e(
|
|
2451
|
-
e(
|
|
1464
|
+
return e(u).addEventListener("loadedmetadata", L), e(u).addEventListener("timeupdate", Q), () => {
|
|
1465
|
+
e(u).removeEventListener("loadedmetadata", L), e(u).removeEventListener("timeupdate", Q);
|
|
2452
1466
|
};
|
|
2453
1467
|
});
|
|
2454
|
-
const
|
|
2455
|
-
const
|
|
2456
|
-
return
|
|
1468
|
+
const w = S(() => Math.max(1, Math.floor(e(s) / (a() + o())))), C = S(() => e(h).length > 0), U = S(() => e(C) ? br(e(h), e(w)) : Array(e(w)).fill(0)), X = S(() => e(x) > 0 ? e(f) / e(x) : 0), F = S(() => `${Me(e(f))} of ${Me(e(x))}`), te = S(() => e(U).map((b) => {
|
|
1469
|
+
const L = Math.max(l(), Math.round(b / 100 * (y() - l()) + l()));
|
|
1470
|
+
return L % 2 === 0 ? L + 1 : L;
|
|
2457
1471
|
}));
|
|
2458
|
-
|
|
2459
|
-
e(C) ?
|
|
1472
|
+
de(() => {
|
|
1473
|
+
e(C) ? c.removeAttribute("data-placeholder") : c.setAttribute("data-placeholder", "");
|
|
2460
1474
|
});
|
|
2461
|
-
const
|
|
2462
|
-
var
|
|
1475
|
+
const V = Qe(() => e(u), () => e(x), () => c.getBoundingClientRect()), H = $e(() => e(u), () => e(x), () => e(f));
|
|
1476
|
+
var be = {
|
|
2463
1477
|
get for() {
|
|
2464
|
-
return
|
|
1478
|
+
return n();
|
|
2465
1479
|
},
|
|
2466
|
-
set for(
|
|
2467
|
-
|
|
1480
|
+
set for(b = "") {
|
|
1481
|
+
n(b), v();
|
|
2468
1482
|
},
|
|
2469
1483
|
get barWidth() {
|
|
2470
|
-
return
|
|
1484
|
+
return a();
|
|
2471
1485
|
},
|
|
2472
|
-
set barWidth(
|
|
2473
|
-
|
|
1486
|
+
set barWidth(b = 3) {
|
|
1487
|
+
a(b), v();
|
|
2474
1488
|
},
|
|
2475
1489
|
get barGap() {
|
|
2476
|
-
return
|
|
1490
|
+
return o();
|
|
2477
1491
|
},
|
|
2478
|
-
set barGap(
|
|
2479
|
-
|
|
1492
|
+
set barGap(b = 1) {
|
|
1493
|
+
o(b), v();
|
|
2480
1494
|
},
|
|
2481
1495
|
get barRadius() {
|
|
2482
|
-
return
|
|
1496
|
+
return i();
|
|
2483
1497
|
},
|
|
2484
|
-
set barRadius(
|
|
2485
|
-
|
|
1498
|
+
set barRadius(b = 1) {
|
|
1499
|
+
i(b), v();
|
|
2486
1500
|
},
|
|
2487
1501
|
get minBarHeight() {
|
|
2488
|
-
return
|
|
1502
|
+
return l();
|
|
2489
1503
|
},
|
|
2490
|
-
set minBarHeight(
|
|
2491
|
-
|
|
1504
|
+
set minBarHeight(b = 3) {
|
|
1505
|
+
l(b), v();
|
|
2492
1506
|
},
|
|
2493
1507
|
get height() {
|
|
2494
|
-
return
|
|
1508
|
+
return y();
|
|
2495
1509
|
},
|
|
2496
|
-
set height(
|
|
2497
|
-
|
|
1510
|
+
set height(b = 56) {
|
|
1511
|
+
y(b), v();
|
|
2498
1512
|
}
|
|
2499
|
-
},
|
|
2500
|
-
|
|
2501
|
-
var
|
|
1513
|
+
}, I = at();
|
|
1514
|
+
I.__click = V, I.__keydown = H;
|
|
1515
|
+
var j = G(I), B = G(j);
|
|
2502
1516
|
{
|
|
2503
|
-
var
|
|
2504
|
-
var
|
|
2505
|
-
Be(
|
|
2506
|
-
const
|
|
2507
|
-
var
|
|
2508
|
-
|
|
2509
|
-
(
|
|
2510
|
-
|
|
1517
|
+
var ee = (b) => {
|
|
1518
|
+
var L = se(), Q = re(L);
|
|
1519
|
+
Be(Q, 17, () => e(te), Ne, (ve, E, R) => {
|
|
1520
|
+
const t = S(() => (R + 1) / e(te).length), T = S(() => e(t) <= e(X));
|
|
1521
|
+
var _ = ot();
|
|
1522
|
+
M(
|
|
1523
|
+
(A) => {
|
|
1524
|
+
ie(_, 0, ur(["bar", e(T) ? "progress" : "track"]), "svelte-kt0w9q"), W(_, "x", R * (a() + o())), W(_, "y", y() / 4 - e(E) / 2), W(_, "width", A), W(_, "height", e(E)), W(_, "rx", i());
|
|
2511
1525
|
},
|
|
2512
|
-
[() => Math.max(1,
|
|
2513
|
-
),
|
|
2514
|
-
}),
|
|
1526
|
+
[() => Math.max(1, a() - 1)]
|
|
1527
|
+
), z(ve, _);
|
|
1528
|
+
}), z(b, L);
|
|
2515
1529
|
};
|
|
2516
|
-
|
|
2517
|
-
e(
|
|
1530
|
+
J(B, (b) => {
|
|
1531
|
+
e(k) && b(ee);
|
|
2518
1532
|
});
|
|
2519
1533
|
}
|
|
2520
|
-
return
|
|
2521
|
-
|
|
2522
|
-
}),
|
|
1534
|
+
return D(j), D(I), Pe(I, (b) => m(p, b), () => e(p)), M(() => {
|
|
1535
|
+
W(I, "aria-valuemax", e(x)), W(I, "aria-valuenow", e(f)), W(I, "aria-valuetext", e(F)), W(j, "height", y()), W(j, "viewBox", `0 0 ${e(s)} ${y() / 2}`);
|
|
1536
|
+
}), z(g, I), ye(be);
|
|
2523
1537
|
}
|
|
2524
|
-
|
|
1538
|
+
He(["click", "keydown"]);
|
|
2525
1539
|
customElements.define("fortyfour-bar-waveform", ue(
|
|
2526
|
-
|
|
1540
|
+
it,
|
|
2527
1541
|
{
|
|
2528
1542
|
for: { attribute: "for", reflect: !0 },
|
|
2529
1543
|
barWidth: { attribute: "bar-width", reflect: !0, type: "Number" },
|
|
@@ -2536,184 +1550,185 @@ customElements.define("fortyfour-bar-waveform", ue(
|
|
|
2536
1550
|
[],
|
|
2537
1551
|
!0
|
|
2538
1552
|
));
|
|
2539
|
-
var
|
|
2540
|
-
const
|
|
2541
|
-
hash: "svelte-
|
|
1553
|
+
var lt = Le("<path></path>"), st = Le("<path></path><!>", 1), ut = Le('<line class="line track svelte-r3200f" stroke-linecap="round"></line>'), ft = K('<div class="waveform svelte-r3200f" role="slider" tabindex="0" aria-valuemin="0" aria-label="Audio playback position"><svg width="100%" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" preserveAspectRatio="none" class="svelte-r3200f"><!></svg></div>');
|
|
1554
|
+
const ct = {
|
|
1555
|
+
hash: "svelte-r3200f",
|
|
2542
1556
|
code: `:host {--fortyfour-line-waveform-track-color: #d1d5db;--fortyfour-line-waveform-progress-color: #3b82f6;--fortyfour-line-waveform-focus-color: #3b82f6;--fortyfour-line-waveform-focus-width: 2px;--fortyfour-line-waveform-focus-offset: 2px;--fortyfour-line-waveform-focus-radius: 4px;display:flex;flex:1;}
|
|
2543
1557
|
|
|
2544
1558
|
@media (prefers-color-scheme: dark) {:host {--fortyfour-line-waveform-track-color: #374151;--fortyfour-line-waveform-progress-color: #60a5fa;--fortyfour-line-waveform-focus-color: #60a5fa;}
|
|
2545
|
-
}.waveform.svelte-
|
|
1559
|
+
}.waveform.svelte-r3200f {flex:1;height:100%;display:flex;align-items:center;cursor:pointer;border-radius:var(--fortyfour-line-waveform-focus-radius);}.waveform.svelte-r3200f:focus-visible {outline:var(--fortyfour-line-waveform-focus-width) solid
|
|
1560
|
+
var(--fortyfour-line-waveform-focus-color);outline-offset:var(--fortyfour-line-waveform-focus-offset);}svg.svelte-r3200f {display:block;}.line.svelte-r3200f {fill:none;stroke-linecap:round;stroke-linejoin:round;}.line.sharp.svelte-r3200f {stroke-linecap:square;stroke-linejoin:miter;}.track.svelte-r3200f {stroke:var(--fortyfour-line-waveform-track-color);}.progress.svelte-r3200f {stroke:var(--fortyfour-line-waveform-progress-color);}`
|
|
2546
1561
|
};
|
|
2547
|
-
function
|
|
2548
|
-
|
|
2549
|
-
const
|
|
2550
|
-
let
|
|
2551
|
-
|
|
2552
|
-
const
|
|
2553
|
-
for (let
|
|
2554
|
-
m(
|
|
1562
|
+
function dt(g, r) {
|
|
1563
|
+
ge(r, !0), we(g, ct);
|
|
1564
|
+
const c = r.$$host;
|
|
1565
|
+
let n = d(r, "for", 7, ""), a = d(r, "lineWidth", 7, 2), o = d(r, "height", 7, 56), i = d(r, "sharp", 7, !1), l = q(We([])), y = q(0), h = q(0), f = q(null), x = q(0), u = q(!1), s = q(null);
|
|
1566
|
+
c.style.height = `${o()}px`, sr(() => {
|
|
1567
|
+
const t = new ResizeObserver((T) => {
|
|
1568
|
+
for (let _ of T)
|
|
1569
|
+
m(x, _.contentRect.width || 0, !0), m(u, !0);
|
|
2555
1570
|
});
|
|
2556
|
-
return e(
|
|
2557
|
-
|
|
1571
|
+
return e(s) && t.observe(e(s)), () => {
|
|
1572
|
+
t.disconnect();
|
|
2558
1573
|
};
|
|
2559
|
-
}),
|
|
2560
|
-
if (!
|
|
1574
|
+
}), de(() => {
|
|
1575
|
+
if (!n()) {
|
|
2561
1576
|
console.warn("fortyfour-line-waveform: 'for' attribute is required");
|
|
2562
1577
|
return;
|
|
2563
1578
|
}
|
|
2564
|
-
const
|
|
2565
|
-
if (m(f,
|
|
2566
|
-
console.warn(`fortyfour-line-waveform: element with id "${
|
|
1579
|
+
const t = c.getRootNode();
|
|
1580
|
+
if (m(f, t.getElementById(n()), !0), !e(f)) {
|
|
1581
|
+
console.warn(`fortyfour-line-waveform: element with id "${n()}" not found`);
|
|
2567
1582
|
return;
|
|
2568
1583
|
}
|
|
2569
|
-
e(f).metadata?.waveform && m(
|
|
2570
|
-
function
|
|
2571
|
-
m(
|
|
1584
|
+
e(f).metadata?.waveform && m(l, e(f).metadata.waveform, !0), e(f).duration && m(h, e(f).duration, !0), e(f).currentTime && m(y, e(f).currentTime, !0);
|
|
1585
|
+
function T() {
|
|
1586
|
+
m(l, e(f).metadata?.waveform || [], !0), m(h, e(f).duration, !0);
|
|
2572
1587
|
}
|
|
2573
|
-
function
|
|
2574
|
-
m(
|
|
1588
|
+
function _() {
|
|
1589
|
+
m(y, e(f).currentTime, !0);
|
|
2575
1590
|
}
|
|
2576
|
-
return e(f).addEventListener("loadedmetadata",
|
|
2577
|
-
e(f).removeEventListener("loadedmetadata",
|
|
1591
|
+
return e(f).addEventListener("loadedmetadata", T), e(f).addEventListener("timeupdate", _), () => {
|
|
1592
|
+
e(f).removeEventListener("loadedmetadata", T), e(f).removeEventListener("timeupdate", _);
|
|
2578
1593
|
};
|
|
2579
1594
|
});
|
|
2580
|
-
const
|
|
2581
|
-
if (!e(C).length || e(
|
|
1595
|
+
const k = 0.15, p = S(() => Math.max(2, Math.floor(e(x) * k))), w = S(() => e(l).length > 0), C = S(() => e(w) ? br(e(l), e(p)) : []), U = S(() => e(h) > 0 ? e(y) / e(h) : 0), X = S(() => `${Me(e(y))} of ${Me(e(h))}`), F = S(() => o() / 2), te = S(() => o() / 2 * 0.8), V = S(() => {
|
|
1596
|
+
if (!e(C).length || e(x) === 0)
|
|
2582
1597
|
return [];
|
|
2583
|
-
const
|
|
2584
|
-
return e(C).map((
|
|
2585
|
-
const
|
|
2586
|
-
return { x:
|
|
1598
|
+
const t = a() / 2, T = e(x) - t * 2;
|
|
1599
|
+
return e(C).map((_, A) => {
|
|
1600
|
+
const N = t + A / (e(C).length - 1) * T, Y = Math.max(0.05, _ / 100), P = A % 2 === 0 ? -1 : 1, O = e(F) + P * Y * e(te);
|
|
1601
|
+
return { x: N, y: O };
|
|
2587
1602
|
});
|
|
2588
1603
|
});
|
|
2589
|
-
function
|
|
2590
|
-
if (
|
|
1604
|
+
function H(t, T) {
|
|
1605
|
+
if (t.length === 0)
|
|
2591
1606
|
return "";
|
|
2592
|
-
let
|
|
2593
|
-
for (let
|
|
2594
|
-
const
|
|
2595
|
-
if (
|
|
2596
|
-
const
|
|
2597
|
-
|
|
1607
|
+
let _ = `M ${t[0].x} ${t[0].y}`;
|
|
1608
|
+
for (let A = 1; A < t.length; A++) {
|
|
1609
|
+
const N = t[A - 1], Y = t[A];
|
|
1610
|
+
if (T) {
|
|
1611
|
+
const P = N.x + (Y.x - N.x) / 3, O = N.y, oe = N.x + (Y.x - N.x) * 2 / 3, ae = Y.y;
|
|
1612
|
+
_ += ` C ${P} ${O}, ${oe} ${ae}, ${Y.x} ${Y.y}`;
|
|
2598
1613
|
} else
|
|
2599
|
-
|
|
1614
|
+
_ += ` L ${Y.x} ${Y.y}`;
|
|
2600
1615
|
}
|
|
2601
|
-
return
|
|
1616
|
+
return _;
|
|
2602
1617
|
}
|
|
2603
|
-
const
|
|
2604
|
-
if (e(
|
|
1618
|
+
const be = S(() => H(e(V), !i())), I = S(() => {
|
|
1619
|
+
if (e(U) <= 0 || e(x) === 0)
|
|
2605
1620
|
return 0;
|
|
2606
|
-
const
|
|
2607
|
-
return
|
|
2608
|
-
}),
|
|
2609
|
-
if (e(
|
|
1621
|
+
const t = a() / 2, T = e(x) - t * 2;
|
|
1622
|
+
return t + e(U) * T;
|
|
1623
|
+
}), j = S(() => {
|
|
1624
|
+
if (e(V).length === 0 || e(I) <= 0)
|
|
2610
1625
|
return "";
|
|
2611
|
-
const
|
|
2612
|
-
let
|
|
2613
|
-
for (let
|
|
2614
|
-
if (e(
|
|
2615
|
-
|
|
1626
|
+
const t = [];
|
|
1627
|
+
let T = null;
|
|
1628
|
+
for (let A = 0; A < e(V).length; A++)
|
|
1629
|
+
if (e(V)[A].x <= e(I))
|
|
1630
|
+
t.push(e(V)[A]);
|
|
2616
1631
|
else {
|
|
2617
|
-
|
|
1632
|
+
T = e(V)[A];
|
|
2618
1633
|
break;
|
|
2619
1634
|
}
|
|
2620
|
-
if (
|
|
1635
|
+
if (t.length === 0)
|
|
2621
1636
|
return "";
|
|
2622
|
-
const
|
|
2623
|
-
if (
|
|
2624
|
-
const
|
|
2625
|
-
|
|
1637
|
+
const _ = t[t.length - 1];
|
|
1638
|
+
if (T && _.x < e(I)) {
|
|
1639
|
+
const A = (e(I) - _.x) / (T.x - _.x), N = _.y + A * (T.y - _.y);
|
|
1640
|
+
t.push({ x: e(I), y: N });
|
|
2626
1641
|
}
|
|
2627
|
-
return
|
|
1642
|
+
return H(t, !i());
|
|
2628
1643
|
});
|
|
2629
|
-
|
|
2630
|
-
e(
|
|
1644
|
+
de(() => {
|
|
1645
|
+
e(w) ? c.removeAttribute("data-placeholder") : c.setAttribute("data-placeholder", "");
|
|
2631
1646
|
});
|
|
2632
|
-
const
|
|
2633
|
-
var
|
|
1647
|
+
const B = Qe(() => e(f), () => e(h), () => e(s).getBoundingClientRect()), ee = $e(() => e(f), () => e(h), () => e(y));
|
|
1648
|
+
var b = {
|
|
2634
1649
|
get for() {
|
|
2635
|
-
return
|
|
1650
|
+
return n();
|
|
2636
1651
|
},
|
|
2637
|
-
set for(
|
|
2638
|
-
|
|
1652
|
+
set for(t = "") {
|
|
1653
|
+
n(t), v();
|
|
2639
1654
|
},
|
|
2640
1655
|
get lineWidth() {
|
|
2641
|
-
return
|
|
1656
|
+
return a();
|
|
2642
1657
|
},
|
|
2643
|
-
set lineWidth(
|
|
2644
|
-
|
|
1658
|
+
set lineWidth(t = 2) {
|
|
1659
|
+
a(t), v();
|
|
2645
1660
|
},
|
|
2646
1661
|
get height() {
|
|
2647
|
-
return
|
|
1662
|
+
return o();
|
|
2648
1663
|
},
|
|
2649
|
-
set height(
|
|
2650
|
-
|
|
1664
|
+
set height(t = 56) {
|
|
1665
|
+
o(t), v();
|
|
2651
1666
|
},
|
|
2652
1667
|
get sharp() {
|
|
2653
|
-
return
|
|
1668
|
+
return i();
|
|
2654
1669
|
},
|
|
2655
|
-
set sharp(
|
|
2656
|
-
|
|
1670
|
+
set sharp(t = !1) {
|
|
1671
|
+
i(t), v();
|
|
2657
1672
|
}
|
|
2658
|
-
},
|
|
2659
|
-
|
|
2660
|
-
var
|
|
1673
|
+
}, L = ft();
|
|
1674
|
+
L.__click = B, L.__keydown = ee;
|
|
1675
|
+
var Q = G(L), ve = G(Q);
|
|
2661
1676
|
{
|
|
2662
|
-
var
|
|
2663
|
-
var
|
|
2664
|
-
let
|
|
2665
|
-
var
|
|
1677
|
+
var E = (t) => {
|
|
1678
|
+
var T = st(), _ = re(T);
|
|
1679
|
+
let A;
|
|
1680
|
+
var N = pe(_);
|
|
2666
1681
|
{
|
|
2667
|
-
var Y = (
|
|
2668
|
-
var
|
|
2669
|
-
let
|
|
2670
|
-
|
|
2671
|
-
(
|
|
2672
|
-
|
|
1682
|
+
var Y = (P) => {
|
|
1683
|
+
var O = lt();
|
|
1684
|
+
let oe;
|
|
1685
|
+
M(
|
|
1686
|
+
(ae) => {
|
|
1687
|
+
oe = ie(O, 0, "line progress svelte-r3200f", null, oe, ae), W(O, "d", e(j)), W(O, "stroke-width", a());
|
|
2673
1688
|
},
|
|
2674
|
-
[() => ({ sharp:
|
|
2675
|
-
),
|
|
1689
|
+
[() => ({ sharp: i() })]
|
|
1690
|
+
), z(P, O);
|
|
2676
1691
|
};
|
|
2677
|
-
|
|
2678
|
-
e(
|
|
1692
|
+
J(N, (P) => {
|
|
1693
|
+
e(j) && P(Y);
|
|
2679
1694
|
});
|
|
2680
1695
|
}
|
|
2681
|
-
|
|
2682
|
-
(
|
|
2683
|
-
|
|
1696
|
+
M(
|
|
1697
|
+
(P) => {
|
|
1698
|
+
A = ie(_, 0, "line track svelte-r3200f", null, A, P), W(_, "d", e(be)), W(_, "stroke-width", a());
|
|
2684
1699
|
},
|
|
2685
|
-
[() => ({ sharp:
|
|
2686
|
-
),
|
|
2687
|
-
},
|
|
2688
|
-
var
|
|
1700
|
+
[() => ({ sharp: i() })]
|
|
1701
|
+
), z(t, T);
|
|
1702
|
+
}, R = (t) => {
|
|
1703
|
+
var T = se(), _ = re(T);
|
|
2689
1704
|
{
|
|
2690
|
-
var
|
|
2691
|
-
var Y =
|
|
2692
|
-
|
|
2693
|
-
|
|
2694
|
-
}),
|
|
1705
|
+
var A = (N) => {
|
|
1706
|
+
var Y = ut();
|
|
1707
|
+
M(() => {
|
|
1708
|
+
W(Y, "x1", a() / 2), W(Y, "y1", o() / 2), W(Y, "x2", e(x) - a() / 2), W(Y, "y2", o() / 2), W(Y, "stroke-width", a());
|
|
1709
|
+
}), z(N, Y);
|
|
2695
1710
|
};
|
|
2696
|
-
|
|
2697
|
-
|
|
2698
|
-
(
|
|
2699
|
-
e(
|
|
1711
|
+
J(
|
|
1712
|
+
_,
|
|
1713
|
+
(N) => {
|
|
1714
|
+
e(u) && N(A);
|
|
2700
1715
|
},
|
|
2701
1716
|
!0
|
|
2702
1717
|
);
|
|
2703
1718
|
}
|
|
2704
|
-
|
|
1719
|
+
z(t, T);
|
|
2705
1720
|
};
|
|
2706
|
-
|
|
2707
|
-
e(
|
|
1721
|
+
J(ve, (t) => {
|
|
1722
|
+
e(u) && e(be) ? t(E) : t(R, !1);
|
|
2708
1723
|
});
|
|
2709
1724
|
}
|
|
2710
|
-
return
|
|
2711
|
-
|
|
2712
|
-
}),
|
|
1725
|
+
return D(Q), D(L), Pe(L, (t) => m(s, t), () => e(s)), M(() => {
|
|
1726
|
+
W(L, "aria-valuemax", e(h)), W(L, "aria-valuenow", e(y)), W(L, "aria-valuetext", e(X)), W(Q, "height", o()), W(Q, "viewBox", `0 0 ${e(x)} ${o()}`);
|
|
1727
|
+
}), z(g, L), ye(b);
|
|
2713
1728
|
}
|
|
2714
|
-
|
|
1729
|
+
He(["click", "keydown"]);
|
|
2715
1730
|
customElements.define("fortyfour-line-waveform", ue(
|
|
2716
|
-
|
|
1731
|
+
dt,
|
|
2717
1732
|
{
|
|
2718
1733
|
for: { attribute: "for", reflect: !0 },
|
|
2719
1734
|
lineWidth: { attribute: "line-width", reflect: !0, type: "Number" },
|
|
@@ -2724,84 +1739,85 @@ customElements.define("fortyfour-line-waveform", ue(
|
|
|
2724
1739
|
[],
|
|
2725
1740
|
!0
|
|
2726
1741
|
));
|
|
2727
|
-
var
|
|
2728
|
-
const
|
|
2729
|
-
hash: "svelte-
|
|
1742
|
+
var vt = K('<div class="container svelte-16bcl3p" role="slider" tabindex="0" aria-valuemin="0" aria-label="Audio playback position"><div class="track svelte-16bcl3p"><div class="progress svelte-16bcl3p"></div></div></div>');
|
|
1743
|
+
const pt = {
|
|
1744
|
+
hash: "svelte-16bcl3p",
|
|
2730
1745
|
code: `:host {--fortyfour-progress-bar-track-color: #e5e7eb;--fortyfour-progress-bar-progress-color: #3b82f6;--fortyfour-progress-bar-focus-color: #3b82f6;--fortyfour-progress-bar-focus-width: 2px;--fortyfour-progress-bar-focus-offset: 2px;display:flex;flex:1;}
|
|
2731
1746
|
|
|
2732
1747
|
@media (prefers-color-scheme: dark) {:host {--fortyfour-progress-bar-track-color: #374151;--fortyfour-progress-bar-progress-color: #60a5fa;--fortyfour-progress-bar-focus-color: #60a5fa;}
|
|
2733
|
-
}.container.svelte-
|
|
1748
|
+
}.container.svelte-16bcl3p {flex:1;display:flex;align-items:center;cursor:pointer;border-radius:4px;}.container.svelte-16bcl3p:focus-visible {outline:var(--fortyfour-progress-bar-focus-width) solid
|
|
1749
|
+
var(--fortyfour-progress-bar-focus-color);outline-offset:var(--fortyfour-progress-bar-focus-offset);}.track.svelte-16bcl3p {width:100%;background:var(--fortyfour-progress-bar-track-color);overflow:hidden;}.progress.svelte-16bcl3p {height:100%;background:var(--fortyfour-progress-bar-progress-color);transition:width 0.1s linear;}`
|
|
2734
1750
|
};
|
|
2735
|
-
function
|
|
2736
|
-
|
|
2737
|
-
const
|
|
2738
|
-
let
|
|
2739
|
-
|
|
2740
|
-
if (!
|
|
1751
|
+
function gt(g, r) {
|
|
1752
|
+
ge(r, !0), we(g, pt);
|
|
1753
|
+
const c = r.$$host;
|
|
1754
|
+
let n = d(r, "for", 7, ""), a = d(r, "barHeight", 7, 4), o = d(r, "barRadius", 7, 2), i = q(0), l = q(0), y = q(null), h = q(null);
|
|
1755
|
+
de(() => {
|
|
1756
|
+
if (!n()) {
|
|
2741
1757
|
console.warn("fortyfour-progress-bar: 'for' attribute is required");
|
|
2742
1758
|
return;
|
|
2743
1759
|
}
|
|
2744
|
-
const
|
|
2745
|
-
if (m(
|
|
2746
|
-
console.warn(`fortyfour-progress-bar: element with id "${
|
|
1760
|
+
const F = c.getRootNode();
|
|
1761
|
+
if (m(y, F.getElementById(n()), !0), !e(y)) {
|
|
1762
|
+
console.warn(`fortyfour-progress-bar: element with id "${n()}" not found`);
|
|
2747
1763
|
return;
|
|
2748
1764
|
}
|
|
2749
|
-
e(
|
|
2750
|
-
function
|
|
2751
|
-
m(
|
|
1765
|
+
e(y).duration && m(l, e(y).duration, !0), e(y).currentTime && m(i, e(y).currentTime, !0);
|
|
1766
|
+
function te() {
|
|
1767
|
+
m(l, e(y).duration, !0);
|
|
2752
1768
|
}
|
|
2753
|
-
function
|
|
2754
|
-
m(
|
|
1769
|
+
function V() {
|
|
1770
|
+
m(i, e(y).currentTime, !0);
|
|
2755
1771
|
}
|
|
2756
|
-
return e(
|
|
2757
|
-
e(
|
|
1772
|
+
return e(y).addEventListener("loadedmetadata", te), e(y).addEventListener("timeupdate", V), () => {
|
|
1773
|
+
e(y).removeEventListener("loadedmetadata", te), e(y).removeEventListener("timeupdate", V);
|
|
2758
1774
|
};
|
|
2759
1775
|
});
|
|
2760
|
-
const f =
|
|
2761
|
-
var
|
|
1776
|
+
const f = S(() => e(l) > 0 ? e(i) / e(l) * 100 : 0), x = S(() => `${Me(e(i))} of ${Me(e(l))}`), u = Qe(() => e(y), () => e(l), () => e(h)?.getBoundingClientRect()), s = $e(() => e(y), () => e(l), () => e(i));
|
|
1777
|
+
var k = {
|
|
2762
1778
|
get for() {
|
|
2763
|
-
return
|
|
1779
|
+
return n();
|
|
2764
1780
|
},
|
|
2765
|
-
set for(
|
|
2766
|
-
|
|
1781
|
+
set for(F = "") {
|
|
1782
|
+
n(F), v();
|
|
2767
1783
|
},
|
|
2768
1784
|
get barHeight() {
|
|
2769
|
-
return
|
|
1785
|
+
return a();
|
|
2770
1786
|
},
|
|
2771
|
-
set barHeight(
|
|
2772
|
-
|
|
1787
|
+
set barHeight(F = 4) {
|
|
1788
|
+
a(F), v();
|
|
2773
1789
|
},
|
|
2774
1790
|
get barRadius() {
|
|
2775
|
-
return
|
|
1791
|
+
return o();
|
|
2776
1792
|
},
|
|
2777
|
-
set barRadius(
|
|
2778
|
-
|
|
1793
|
+
set barRadius(F = 2) {
|
|
1794
|
+
o(F), v();
|
|
2779
1795
|
}
|
|
2780
|
-
},
|
|
2781
|
-
|
|
2782
|
-
var
|
|
2783
|
-
let
|
|
2784
|
-
var
|
|
2785
|
-
let
|
|
2786
|
-
return
|
|
2787
|
-
(
|
|
2788
|
-
|
|
1796
|
+
}, p = vt();
|
|
1797
|
+
p.__click = u, p.__keydown = s;
|
|
1798
|
+
var w = G(p);
|
|
1799
|
+
let C;
|
|
1800
|
+
var U = G(w);
|
|
1801
|
+
let X;
|
|
1802
|
+
return D(w), Pe(w, (F) => m(h, F), () => e(h)), D(p), M(
|
|
1803
|
+
(F, te) => {
|
|
1804
|
+
W(p, "aria-valuemax", e(l)), W(p, "aria-valuenow", e(i)), W(p, "aria-valuetext", e(x)), C = me(w, "", C, F), X = me(U, "", X, te);
|
|
2789
1805
|
},
|
|
2790
1806
|
[
|
|
2791
1807
|
() => ({
|
|
2792
|
-
height: `${
|
|
2793
|
-
"border-radius": `${
|
|
1808
|
+
height: `${a() ?? ""}px`,
|
|
1809
|
+
"border-radius": `${o() ?? ""}px`
|
|
2794
1810
|
}),
|
|
2795
1811
|
() => ({
|
|
2796
1812
|
width: `${e(f) ?? ""}%`,
|
|
2797
|
-
"border-radius": `${
|
|
1813
|
+
"border-radius": `${o() ?? ""}px`
|
|
2798
1814
|
})
|
|
2799
1815
|
]
|
|
2800
|
-
),
|
|
1816
|
+
), z(g, p), ye(k);
|
|
2801
1817
|
}
|
|
2802
|
-
|
|
1818
|
+
He(["click", "keydown"]);
|
|
2803
1819
|
customElements.define("fortyfour-progress-bar", ue(
|
|
2804
|
-
|
|
1820
|
+
gt,
|
|
2805
1821
|
{
|
|
2806
1822
|
for: { attribute: "for", reflect: !0 },
|
|
2807
1823
|
barHeight: { attribute: "bar-height", reflect: !0, type: "Number" },
|
|
@@ -2811,8 +1827,8 @@ customElements.define("fortyfour-progress-bar", ue(
|
|
|
2811
1827
|
[],
|
|
2812
1828
|
!0
|
|
2813
1829
|
));
|
|
2814
|
-
var
|
|
2815
|
-
const
|
|
1830
|
+
var yt = K("<span> </span>"), bt = K('<div class="content svelte-1lixazt"><div class="text caption-text svelte-1lixazt"></div></div>'), ht = K("<span> </span>"), mt = K('<div class="text caption-text subtitle svelte-1lixazt"></div>'), wt = K('<div class="content subtitle-content svelte-1lixazt"><!></div>'), xt = K("<span> </span>"), zt = K('<div class="content svelte-1lixazt"><div class="text caption-text svelte-1lixazt"></div></div>'), kt = K('<div class="content svelte-1lixazt"><div class="text svelte-1lixazt"> </div></div>'), _t = K('<div class="placeholder-lines svelte-1lixazt"><span class="placeholder-line svelte-1lixazt"></span> <span class="placeholder-line short svelte-1lixazt"></span></div>'), Pt = K("<div><div><!></div></div>");
|
|
1831
|
+
const Lt = {
|
|
2816
1832
|
hash: "svelte-1lixazt",
|
|
2817
1833
|
code: `:host {--fortyfour-transcription-font-family: system-ui, sans-serif;--fortyfour-transcription-font-size: 14px;--fortyfour-transcription-color: #64748b;--fortyfour-transcription-active-color: #1e293b;--fortyfour-transcription-active-bg: #fef08a;--fortyfour-transcription-past-color: #1e293b;--fortyfour-transcription-placeholder-color: #e5e7eb;--fortyfour-transcription-fade-color: white;--fortyfour-transcription-scrollbar-thumb: #d1d5db;--fortyfour-transcription-scrollbar-thumb-hover: #9ca3af;--fortyfour-transcription-focus-color: #3b82f6;display:flex;font-family:var(--fortyfour-transcription-font-family);font-size:var(--fortyfour-transcription-font-size);}
|
|
2818
1834
|
|
|
@@ -2821,262 +1837,262 @@ const Ha = {
|
|
|
2821
1837
|
.wrapper.scrollable.svelte-1lixazt::after {content:"";position:absolute;left:0;right:0;height:24px;pointer-events:none;opacity:0;transition:opacity 0.15s ease;}.wrapper.scrollable.svelte-1lixazt::before {top:0;background:linear-gradient(to top, transparent, var(--fortyfour-transcription-fade-color));z-index:1;}.wrapper.scrollable.svelte-1lixazt::after {bottom:0;background:linear-gradient(to bottom, transparent, var(--fortyfour-transcription-fade-color));}.wrapper.can-scroll-up.svelte-1lixazt::before {opacity:1;}.wrapper.can-scroll-down.svelte-1lixazt::after {opacity:1;}.container.svelte-1lixazt {width:100%;}.container.scrollable.svelte-1lixazt {overflow-y:auto;scroll-behavior:smooth;padding-bottom:24px;scrollbar-width:thin;scrollbar-color:var(--fortyfour-transcription-scrollbar-thumb) transparent;}.container.scrollable.svelte-1lixazt::-webkit-scrollbar {width:6px;}.container.scrollable.svelte-1lixazt::-webkit-scrollbar-track {background:transparent;}.container.scrollable.svelte-1lixazt::-webkit-scrollbar-thumb {background-color:var(--fortyfour-transcription-scrollbar-thumb);border-radius:3px;}.container.scrollable.svelte-1lixazt::-webkit-scrollbar-thumb:hover {background-color:var(--fortyfour-transcription-scrollbar-thumb-hover);}.container.scrollable.svelte-1lixazt:focus-visible {outline:2px solid var(--fortyfour-transcription-focus-color);outline-offset:2px;}.content.svelte-1lixazt {width:100%;}.text.svelte-1lixazt {white-space:pre-wrap;word-wrap:break-word;}.caption-text.svelte-1lixazt {white-space:normal;color:var(--fortyfour-transcription-color);}.word.svelte-1lixazt {transition:color 0.15s ease,
|
|
2822
1838
|
background-color 0.15s ease;border-radius:2px;padding:0 1px;margin:0 -1px;}.word.active[data-type="word"].svelte-1lixazt {color:var(--fortyfour-transcription-active-color);background-color:var(--fortyfour-transcription-active-bg);}.word.past[data-type="word"].svelte-1lixazt {color:var(--fortyfour-transcription-past-color);}.subtitle-content.svelte-1lixazt {min-height:2em;display:flex;align-items:center;justify-content:center;}.subtitle.svelte-1lixazt {text-align:center;}.placeholder-lines.svelte-1lixazt {display:flex;flex-direction:column;gap:0.5em;}.placeholder-line.svelte-1lixazt {display:block;height:1em;background-color:var(--fortyfour-transcription-placeholder-color);border-radius:4px;}.placeholder-line.short.svelte-1lixazt {width:60%;}`
|
|
2823
1839
|
};
|
|
2824
|
-
function
|
|
2825
|
-
|
|
2826
|
-
const
|
|
2827
|
-
let
|
|
2828
|
-
const
|
|
2829
|
-
let
|
|
1840
|
+
function Et(g, r) {
|
|
1841
|
+
ge(r, !0), we(g, Lt);
|
|
1842
|
+
const c = r.$$host;
|
|
1843
|
+
let n = d(r, "for", 7, ""), a = d(r, "mode", 7, "static"), o = d(r, "maxHeight", 7, 0), i = q(null);
|
|
1844
|
+
const l = S(() => o() > 0);
|
|
1845
|
+
let y = q(!1), h = q(!1);
|
|
2830
1846
|
function f() {
|
|
2831
|
-
if (!e(
|
|
2832
|
-
m(
|
|
1847
|
+
if (!e(i) || !e(l)) {
|
|
1848
|
+
m(y, !1), m(h, !1);
|
|
2833
1849
|
return;
|
|
2834
1850
|
}
|
|
2835
|
-
const { scrollTop:
|
|
2836
|
-
m(
|
|
1851
|
+
const { scrollTop: E, scrollHeight: R, clientHeight: t } = e(i);
|
|
1852
|
+
m(y, E > 1), m(h, E + t < R - 1);
|
|
2837
1853
|
}
|
|
2838
|
-
let
|
|
2839
|
-
const
|
|
2840
|
-
function
|
|
2841
|
-
const
|
|
2842
|
-
let
|
|
2843
|
-
for (const
|
|
2844
|
-
|
|
2845
|
-
const
|
|
2846
|
-
(
|
|
2847
|
-
}
|
|
2848
|
-
return
|
|
1854
|
+
let x = q(null), u = q(null), s = q("none"), k = q(0);
|
|
1855
|
+
const p = Ye(() => e(x) === null, 200), w = S(() => e(x) !== null ? !1 : e(s) === "none" ? !0 : p()), C = S(() => e(u) !== null && e(u).length > 0), U = S(() => !e(C) || a() === "static" ? -1 : e(u).findIndex((E) => e(k) >= E.start && e(k) <= E.end));
|
|
1856
|
+
function X(E) {
|
|
1857
|
+
const R = [];
|
|
1858
|
+
let t = { words: [], start: 0, end: 0 };
|
|
1859
|
+
for (const T of E) {
|
|
1860
|
+
t.words.length === 0 && (t.start = T.start), t.words.push(T), t.end = T.end;
|
|
1861
|
+
const _ = T.text.trim();
|
|
1862
|
+
(_.endsWith(".") || _.endsWith("?") || _.endsWith("!")) && (R.push(t), t = { words: [], start: 0, end: 0 });
|
|
1863
|
+
}
|
|
1864
|
+
return t.words.length > 0 && R.push(t), R;
|
|
2849
1865
|
}
|
|
2850
|
-
const
|
|
2851
|
-
function V(
|
|
2852
|
-
return e(
|
|
1866
|
+
const F = S(() => e(C) ? X(e(u)) : []), te = S(() => a() !== "subtitle" || e(F).length === 0 ? null : e(F).find((E) => e(k) >= E.start && e(k) <= E.end) ?? null);
|
|
1867
|
+
function V(E) {
|
|
1868
|
+
return e(k) >= E.start && e(k) <= E.end;
|
|
2853
1869
|
}
|
|
2854
|
-
function
|
|
2855
|
-
return e(
|
|
1870
|
+
function H(E) {
|
|
1871
|
+
return e(k) > E.end;
|
|
2856
1872
|
}
|
|
2857
|
-
|
|
2858
|
-
if (!
|
|
1873
|
+
de(() => {
|
|
1874
|
+
if (!n()) {
|
|
2859
1875
|
console.warn("fortyfour-transcription: 'for' attribute is required");
|
|
2860
1876
|
return;
|
|
2861
1877
|
}
|
|
2862
|
-
const
|
|
2863
|
-
if (!
|
|
2864
|
-
console.warn(`fortyfour-transcription: element with id "${
|
|
1878
|
+
const R = c.getRootNode().getElementById(n());
|
|
1879
|
+
if (!R) {
|
|
1880
|
+
console.warn(`fortyfour-transcription: element with id "${n()}" not found`);
|
|
2865
1881
|
return;
|
|
2866
1882
|
}
|
|
2867
|
-
m(
|
|
2868
|
-
const
|
|
2869
|
-
|
|
2870
|
-
function
|
|
2871
|
-
const
|
|
2872
|
-
m(
|
|
1883
|
+
m(s, R.getAttribute("preload") || "none", !0);
|
|
1884
|
+
const t = R.metadata;
|
|
1885
|
+
t && (m(x, t.transcription ?? null, !0), m(u, t.words ?? null, !0)), R.currentTime && m(k, R.currentTime, !0);
|
|
1886
|
+
function T() {
|
|
1887
|
+
const A = R.metadata;
|
|
1888
|
+
m(x, A?.transcription ?? null, !0), m(u, A?.words ?? null, !0);
|
|
2873
1889
|
}
|
|
2874
|
-
function
|
|
2875
|
-
m(
|
|
1890
|
+
function _() {
|
|
1891
|
+
m(k, R.currentTime, !0);
|
|
2876
1892
|
}
|
|
2877
|
-
return
|
|
2878
|
-
|
|
1893
|
+
return R.addEventListener("loadedmetadata", T), R.addEventListener("timeupdate", _), () => {
|
|
1894
|
+
R.removeEventListener("loadedmetadata", T), R.removeEventListener("timeupdate", _);
|
|
2879
1895
|
};
|
|
2880
|
-
}),
|
|
2881
|
-
if (!e(
|
|
1896
|
+
}), Te(c, "data-placeholder", () => e(w)), de(() => {
|
|
1897
|
+
if (!e(i) || !e(l))
|
|
2882
1898
|
return;
|
|
2883
|
-
f(), e(
|
|
2884
|
-
const
|
|
2885
|
-
return
|
|
2886
|
-
e(
|
|
1899
|
+
f(), e(i).addEventListener("scroll", f);
|
|
1900
|
+
const E = new ResizeObserver(f);
|
|
1901
|
+
return E.observe(e(i)), () => {
|
|
1902
|
+
e(i).removeEventListener("scroll", f), E.disconnect();
|
|
2887
1903
|
};
|
|
2888
|
-
}),
|
|
2889
|
-
if (!e(
|
|
1904
|
+
}), de(() => {
|
|
1905
|
+
if (!e(l) || a() !== "karaoke")
|
|
2890
1906
|
return;
|
|
2891
|
-
if (e(
|
|
2892
|
-
e(
|
|
1907
|
+
if (e(k) < 0.1) {
|
|
1908
|
+
e(i)?.scrollTo({ top: 0, behavior: "smooth" });
|
|
2893
1909
|
return;
|
|
2894
1910
|
}
|
|
2895
|
-
if (e(
|
|
1911
|
+
if (e(U) < 0)
|
|
2896
1912
|
return;
|
|
2897
|
-
const
|
|
2898
|
-
if (
|
|
2899
|
-
const
|
|
2900
|
-
e(
|
|
1913
|
+
const E = e(i)?.querySelector(".word.active");
|
|
1914
|
+
if (E) {
|
|
1915
|
+
const R = e(i).getBoundingClientRect(), t = E.getBoundingClientRect(), T = e(i).scrollTop + (t.top - R.top) - R.height / 2 + t.height / 2;
|
|
1916
|
+
e(i).scrollTo({ top: T, behavior: "smooth" });
|
|
2901
1917
|
}
|
|
2902
1918
|
});
|
|
2903
|
-
var
|
|
1919
|
+
var be = {
|
|
2904
1920
|
get for() {
|
|
2905
|
-
return
|
|
1921
|
+
return n();
|
|
2906
1922
|
},
|
|
2907
|
-
set for(
|
|
2908
|
-
|
|
1923
|
+
set for(E = "") {
|
|
1924
|
+
n(E), v();
|
|
2909
1925
|
},
|
|
2910
1926
|
get mode() {
|
|
2911
|
-
return
|
|
1927
|
+
return a();
|
|
2912
1928
|
},
|
|
2913
|
-
set mode(
|
|
2914
|
-
|
|
1929
|
+
set mode(E = "static") {
|
|
1930
|
+
a(E), v();
|
|
2915
1931
|
},
|
|
2916
1932
|
get maxHeight() {
|
|
2917
|
-
return
|
|
1933
|
+
return o();
|
|
2918
1934
|
},
|
|
2919
|
-
set maxHeight(
|
|
2920
|
-
|
|
1935
|
+
set maxHeight(E = 0) {
|
|
1936
|
+
o(E), v();
|
|
2921
1937
|
}
|
|
2922
|
-
},
|
|
2923
|
-
let
|
|
2924
|
-
var
|
|
2925
|
-
let
|
|
2926
|
-
var
|
|
1938
|
+
}, I = Pt();
|
|
1939
|
+
let j;
|
|
1940
|
+
var B = G(I);
|
|
1941
|
+
let ee, b;
|
|
1942
|
+
var L = G(B);
|
|
2927
1943
|
{
|
|
2928
|
-
var Q = (
|
|
2929
|
-
var
|
|
2930
|
-
Be(
|
|
2931
|
-
var
|
|
2932
|
-
let
|
|
2933
|
-
var
|
|
2934
|
-
N
|
|
2935
|
-
(
|
|
2936
|
-
|
|
1944
|
+
var Q = (E) => {
|
|
1945
|
+
var R = bt(), t = G(R);
|
|
1946
|
+
Be(t, 21, () => e(u), Ne, (T, _, A) => {
|
|
1947
|
+
var N = yt();
|
|
1948
|
+
let Y;
|
|
1949
|
+
var P = G(N, !0);
|
|
1950
|
+
D(N), M(
|
|
1951
|
+
(O) => {
|
|
1952
|
+
Y = ie(N, 1, "word svelte-1lixazt", null, Y, O), W(N, "data-type", e(_).type), Ee(P, e(_).text);
|
|
2937
1953
|
},
|
|
2938
1954
|
[
|
|
2939
1955
|
() => ({
|
|
2940
|
-
active:
|
|
2941
|
-
past:
|
|
1956
|
+
active: A === e(U),
|
|
1957
|
+
past: A < e(U)
|
|
2942
1958
|
})
|
|
2943
1959
|
]
|
|
2944
|
-
),
|
|
2945
|
-
}),
|
|
2946
|
-
},
|
|
2947
|
-
var
|
|
1960
|
+
), z(T, N);
|
|
1961
|
+
}), D(t), D(R), Ce(1, R, () => Re, () => ({ duration: 400 })), z(E, R);
|
|
1962
|
+
}, ve = (E) => {
|
|
1963
|
+
var R = se(), t = re(R);
|
|
2948
1964
|
{
|
|
2949
|
-
var
|
|
2950
|
-
var
|
|
1965
|
+
var T = (A) => {
|
|
1966
|
+
var N = wt(), Y = G(N);
|
|
2951
1967
|
{
|
|
2952
|
-
var
|
|
2953
|
-
var
|
|
2954
|
-
Be(
|
|
2955
|
-
var
|
|
2956
|
-
let
|
|
2957
|
-
var
|
|
2958
|
-
|
|
2959
|
-
(
|
|
2960
|
-
|
|
1968
|
+
var P = (O) => {
|
|
1969
|
+
var oe = mt();
|
|
1970
|
+
Be(oe, 21, () => e(te).words, Ne, (ae, ce) => {
|
|
1971
|
+
var le = ht();
|
|
1972
|
+
let $;
|
|
1973
|
+
var xe = G(le, !0);
|
|
1974
|
+
D(le), M(
|
|
1975
|
+
(ne) => {
|
|
1976
|
+
$ = ie(le, 1, "word svelte-1lixazt", null, $, ne), W(le, "data-type", e(ce).type), Ee(xe, e(ce).text);
|
|
2961
1977
|
},
|
|
2962
1978
|
[
|
|
2963
1979
|
() => ({
|
|
2964
|
-
active: V(e(
|
|
2965
|
-
past:
|
|
1980
|
+
active: V(e(ce)),
|
|
1981
|
+
past: H(e(ce))
|
|
2966
1982
|
})
|
|
2967
1983
|
]
|
|
2968
|
-
),
|
|
2969
|
-
}),
|
|
1984
|
+
), z(ae, le);
|
|
1985
|
+
}), D(oe), Ce(1, oe, () => Re, () => ({ duration: 200 })), z(O, oe);
|
|
2970
1986
|
};
|
|
2971
|
-
|
|
2972
|
-
e(
|
|
1987
|
+
J(Y, (O) => {
|
|
1988
|
+
e(te) && O(P);
|
|
2973
1989
|
});
|
|
2974
1990
|
}
|
|
2975
|
-
N
|
|
2976
|
-
},
|
|
2977
|
-
var
|
|
1991
|
+
D(N), z(A, N);
|
|
1992
|
+
}, _ = (A) => {
|
|
1993
|
+
var N = se(), Y = re(N);
|
|
2978
1994
|
{
|
|
2979
|
-
var
|
|
2980
|
-
var
|
|
2981
|
-
Be(
|
|
2982
|
-
var
|
|
1995
|
+
var P = (oe) => {
|
|
1996
|
+
var ae = zt(), ce = G(ae);
|
|
1997
|
+
Be(ce, 21, () => e(u), Ne, (le, $, xe) => {
|
|
1998
|
+
var ne = se(), fe = re(ne);
|
|
2983
1999
|
{
|
|
2984
|
-
var
|
|
2985
|
-
var
|
|
2986
|
-
let
|
|
2987
|
-
var
|
|
2988
|
-
|
|
2989
|
-
(
|
|
2990
|
-
|
|
2000
|
+
var ze = (ke) => {
|
|
2001
|
+
var _e = xt();
|
|
2002
|
+
let je;
|
|
2003
|
+
var Ue = G(_e, !0);
|
|
2004
|
+
D(_e), M(
|
|
2005
|
+
(mr) => {
|
|
2006
|
+
je = ie(_e, 1, "word svelte-1lixazt", null, je, mr), W(_e, "data-type", e($).type), Ee(Ue, e($).text);
|
|
2991
2007
|
},
|
|
2992
|
-
[() => ({ active:
|
|
2993
|
-
),
|
|
2008
|
+
[() => ({ active: xe === e(U) })]
|
|
2009
|
+
), Ce(1, _e, () => Re, () => ({ duration: 150 })), z(ke, _e);
|
|
2994
2010
|
};
|
|
2995
|
-
|
|
2996
|
-
e(
|
|
2011
|
+
J(fe, (ke) => {
|
|
2012
|
+
e(k) >= e($).start && ke(ze);
|
|
2997
2013
|
});
|
|
2998
2014
|
}
|
|
2999
|
-
|
|
3000
|
-
}),
|
|
3001
|
-
},
|
|
3002
|
-
var
|
|
2015
|
+
z(le, ne);
|
|
2016
|
+
}), D(ce), D(ae), Ce(1, ae, () => Re, () => ({ duration: 400 })), z(oe, ae);
|
|
2017
|
+
}, O = (oe) => {
|
|
2018
|
+
var ae = se(), ce = re(ae);
|
|
3003
2019
|
{
|
|
3004
|
-
var
|
|
3005
|
-
var
|
|
3006
|
-
|
|
3007
|
-
},
|
|
3008
|
-
var
|
|
2020
|
+
var le = (xe) => {
|
|
2021
|
+
var ne = kt(), fe = G(ne), ze = G(fe, !0);
|
|
2022
|
+
D(fe), D(ne), M(() => Ee(ze, e(x))), Ce(1, ne, () => Re, () => ({ duration: 400 })), z(xe, ne);
|
|
2023
|
+
}, $ = (xe) => {
|
|
2024
|
+
var ne = se(), fe = re(ne);
|
|
3009
2025
|
{
|
|
3010
|
-
var
|
|
3011
|
-
var
|
|
3012
|
-
let
|
|
3013
|
-
|
|
3014
|
-
() => ({ height: e(
|
|
3015
|
-
]),
|
|
2026
|
+
var ze = (ke) => {
|
|
2027
|
+
var _e = _t();
|
|
2028
|
+
let je;
|
|
2029
|
+
M((Ue) => je = me(_e, "", je, Ue), [
|
|
2030
|
+
() => ({ height: e(l) ? `${o()}px` : void 0 })
|
|
2031
|
+
]), z(ke, _e);
|
|
3016
2032
|
};
|
|
3017
|
-
|
|
3018
|
-
|
|
3019
|
-
(
|
|
3020
|
-
e(
|
|
2033
|
+
J(
|
|
2034
|
+
fe,
|
|
2035
|
+
(ke) => {
|
|
2036
|
+
e(w) && ke(ze);
|
|
3021
2037
|
},
|
|
3022
2038
|
!0
|
|
3023
2039
|
);
|
|
3024
2040
|
}
|
|
3025
|
-
|
|
2041
|
+
z(xe, ne);
|
|
3026
2042
|
};
|
|
3027
|
-
|
|
3028
|
-
|
|
3029
|
-
(
|
|
3030
|
-
e(
|
|
2043
|
+
J(
|
|
2044
|
+
ce,
|
|
2045
|
+
(xe) => {
|
|
2046
|
+
e(x) ? xe(le) : xe($, !1);
|
|
3031
2047
|
},
|
|
3032
2048
|
!0
|
|
3033
2049
|
);
|
|
3034
2050
|
}
|
|
3035
|
-
|
|
2051
|
+
z(oe, ae);
|
|
3036
2052
|
};
|
|
3037
|
-
|
|
3038
|
-
|
|
3039
|
-
(
|
|
3040
|
-
|
|
2053
|
+
J(
|
|
2054
|
+
Y,
|
|
2055
|
+
(oe) => {
|
|
2056
|
+
a() === "progressive" && e(C) ? oe(P) : oe(O, !1);
|
|
3041
2057
|
},
|
|
3042
2058
|
!0
|
|
3043
2059
|
);
|
|
3044
2060
|
}
|
|
3045
|
-
|
|
2061
|
+
z(A, N);
|
|
3046
2062
|
};
|
|
3047
|
-
|
|
3048
|
-
|
|
3049
|
-
(
|
|
3050
|
-
|
|
2063
|
+
J(
|
|
2064
|
+
t,
|
|
2065
|
+
(A) => {
|
|
2066
|
+
a() === "subtitle" && e(C) ? A(T) : A(_, !1);
|
|
3051
2067
|
},
|
|
3052
2068
|
!0
|
|
3053
2069
|
);
|
|
3054
2070
|
}
|
|
3055
|
-
|
|
2071
|
+
z(E, R);
|
|
3056
2072
|
};
|
|
3057
|
-
|
|
3058
|
-
|
|
2073
|
+
J(L, (E) => {
|
|
2074
|
+
a() === "karaoke" && e(C) ? E(Q) : E(ve, !1);
|
|
3059
2075
|
});
|
|
3060
2076
|
}
|
|
3061
|
-
return
|
|
3062
|
-
(
|
|
3063
|
-
|
|
2077
|
+
return D(B), Pe(B, (E) => m(i, E), () => e(i)), D(I), M(
|
|
2078
|
+
(E, R, t) => {
|
|
2079
|
+
j = ie(I, 1, "wrapper svelte-1lixazt", null, j, E), ee = ie(B, 1, "container svelte-1lixazt", null, ee, R), b = me(B, "", b, t);
|
|
3064
2080
|
},
|
|
3065
2081
|
[
|
|
3066
2082
|
() => ({
|
|
3067
|
-
scrollable: e(
|
|
3068
|
-
"can-scroll-up": e(
|
|
3069
|
-
"can-scroll-down": e(
|
|
2083
|
+
scrollable: e(l),
|
|
2084
|
+
"can-scroll-up": e(y),
|
|
2085
|
+
"can-scroll-down": e(h)
|
|
3070
2086
|
}),
|
|
3071
|
-
() => ({ scrollable: e(
|
|
2087
|
+
() => ({ scrollable: e(l) }),
|
|
3072
2088
|
() => ({
|
|
3073
|
-
"max-height": e(
|
|
2089
|
+
"max-height": e(l) ? `${o()}px` : void 0
|
|
3074
2090
|
})
|
|
3075
2091
|
]
|
|
3076
|
-
),
|
|
2092
|
+
), z(g, I), ye(be);
|
|
3077
2093
|
}
|
|
3078
2094
|
customElements.define("fortyfour-transcription", ue(
|
|
3079
|
-
|
|
2095
|
+
Et,
|
|
3080
2096
|
{
|
|
3081
2097
|
for: { attribute: "for", reflect: !0 },
|
|
3082
2098
|
mode: { attribute: "mode", reflect: !0 },
|
|
@@ -3086,8 +2102,8 @@ customElements.define("fortyfour-transcription", ue(
|
|
|
3086
2102
|
[],
|
|
3087
2103
|
!0
|
|
3088
2104
|
));
|
|
3089
|
-
var
|
|
3090
|
-
const
|
|
2105
|
+
var It = K('<div class="content svelte-z1j7sg"><div class="text svelte-z1j7sg"> </div></div>'), Ct = K('<div class="placeholder-lines svelte-z1j7sg"><span class="placeholder-line svelte-z1j7sg"></span> <span class="placeholder-line short svelte-z1j7sg"></span></div>'), Rt = K("<div><div><!></div></div>");
|
|
2106
|
+
const Tt = {
|
|
3091
2107
|
hash: "svelte-z1j7sg",
|
|
3092
2108
|
code: `:host {--fortyfour-translation-font-family: system-ui, sans-serif;--fortyfour-translation-font-size: 14px;--fortyfour-translation-placeholder-color: #e5e7eb;--fortyfour-translation-fade-color: white;--fortyfour-translation-scrollbar-thumb: #d1d5db;--fortyfour-translation-scrollbar-thumb-hover: #9ca3af;--fortyfour-translation-focus-color: #3b82f6;display:flex;font-family:var(--fortyfour-translation-font-family);font-size:var(--fortyfour-translation-font-size);}
|
|
3093
2109
|
|
|
@@ -3095,122 +2111,122 @@ const Na = {
|
|
|
3095
2111
|
}.wrapper.svelte-z1j7sg {position:relative;width:100%;}.wrapper.scrollable.svelte-z1j7sg::before,
|
|
3096
2112
|
.wrapper.scrollable.svelte-z1j7sg::after {content:"";position:absolute;left:0;right:0;height:24px;pointer-events:none;opacity:0;transition:opacity 0.15s ease;}.wrapper.scrollable.svelte-z1j7sg::before {top:0;background:linear-gradient(to top, transparent, var(--fortyfour-translation-fade-color));z-index:1;}.wrapper.scrollable.svelte-z1j7sg::after {bottom:0;background:linear-gradient(to bottom, transparent, var(--fortyfour-translation-fade-color));}.wrapper.can-scroll-up.svelte-z1j7sg::before {opacity:1;}.wrapper.can-scroll-down.svelte-z1j7sg::after {opacity:1;}.container.svelte-z1j7sg {width:100%;}.container.scrollable.svelte-z1j7sg {overflow-y:auto;scroll-behavior:smooth;padding-bottom:24px;scrollbar-width:thin;scrollbar-color:var(--fortyfour-translation-scrollbar-thumb) transparent;}.container.scrollable.svelte-z1j7sg::-webkit-scrollbar {width:6px;}.container.scrollable.svelte-z1j7sg::-webkit-scrollbar-track {background:transparent;}.container.scrollable.svelte-z1j7sg::-webkit-scrollbar-thumb {background-color:var(--fortyfour-translation-scrollbar-thumb);border-radius:3px;}.container.scrollable.svelte-z1j7sg::-webkit-scrollbar-thumb:hover {background-color:var(--fortyfour-translation-scrollbar-thumb-hover);}.container.scrollable.svelte-z1j7sg:focus-visible {outline:2px solid var(--fortyfour-translation-focus-color);outline-offset:2px;}.content.svelte-z1j7sg {width:100%;}.text.svelte-z1j7sg {white-space:pre-wrap;word-wrap:break-word;}.placeholder-lines.svelte-z1j7sg {display:flex;flex-direction:column;gap:0.5em;}.placeholder-line.svelte-z1j7sg {display:block;height:1em;background-color:var(--fortyfour-translation-placeholder-color);border-radius:4px;}.placeholder-line.short.svelte-z1j7sg {width:60%;}`
|
|
3097
2113
|
};
|
|
3098
|
-
function
|
|
3099
|
-
|
|
3100
|
-
const
|
|
3101
|
-
let
|
|
3102
|
-
const
|
|
3103
|
-
let
|
|
3104
|
-
function
|
|
3105
|
-
if (!e(
|
|
3106
|
-
m(
|
|
2114
|
+
function Mt(g, r) {
|
|
2115
|
+
ge(r, !0), we(g, Tt);
|
|
2116
|
+
const c = r.$$host;
|
|
2117
|
+
let n = d(r, "for", 7, ""), a = d(r, "maxHeight", 7, 0), o = q(null);
|
|
2118
|
+
const i = S(() => a() > 0);
|
|
2119
|
+
let l = q(!1), y = q(!1);
|
|
2120
|
+
function h() {
|
|
2121
|
+
if (!e(o) || !e(i)) {
|
|
2122
|
+
m(l, !1), m(y, !1);
|
|
3107
2123
|
return;
|
|
3108
2124
|
}
|
|
3109
|
-
const { scrollTop:
|
|
3110
|
-
m(
|
|
2125
|
+
const { scrollTop: I, scrollHeight: j, clientHeight: B } = e(o);
|
|
2126
|
+
m(l, I > 1), m(y, I + B < j - 1);
|
|
3111
2127
|
}
|
|
3112
|
-
let f = q(null),
|
|
3113
|
-
function
|
|
3114
|
-
if (!
|
|
3115
|
-
return
|
|
3116
|
-
const
|
|
3117
|
-
return
|
|
2128
|
+
let f = q(null), x = q("none");
|
|
2129
|
+
function u(I) {
|
|
2130
|
+
if (!I)
|
|
2131
|
+
return I;
|
|
2132
|
+
const j = document.createElement("textarea");
|
|
2133
|
+
return j.innerHTML = I, j.value;
|
|
3118
2134
|
}
|
|
3119
|
-
const
|
|
3120
|
-
|
|
3121
|
-
if (!
|
|
2135
|
+
const s = S(() => u(e(f))), k = Ye(() => e(f) === null, 200), p = S(() => e(f) !== null ? !1 : e(x) === "none" ? !0 : k());
|
|
2136
|
+
de(() => {
|
|
2137
|
+
if (!n()) {
|
|
3122
2138
|
console.warn("fortyfour-translation: 'for' attribute is required");
|
|
3123
2139
|
return;
|
|
3124
2140
|
}
|
|
3125
|
-
const
|
|
3126
|
-
if (!
|
|
3127
|
-
console.warn(`fortyfour-translation: element with id "${
|
|
2141
|
+
const j = c.getRootNode().getElementById(n());
|
|
2142
|
+
if (!j) {
|
|
2143
|
+
console.warn(`fortyfour-translation: element with id "${n()}" not found`);
|
|
3128
2144
|
return;
|
|
3129
2145
|
}
|
|
3130
|
-
m(
|
|
3131
|
-
const
|
|
3132
|
-
|
|
3133
|
-
function
|
|
3134
|
-
const
|
|
3135
|
-
m(f,
|
|
2146
|
+
m(x, j.getAttribute("preload") || "none", !0);
|
|
2147
|
+
const B = j.metadata;
|
|
2148
|
+
B && m(f, B.translation ?? null, !0);
|
|
2149
|
+
function ee() {
|
|
2150
|
+
const b = j.metadata;
|
|
2151
|
+
m(f, b?.translation ?? null, !0);
|
|
3136
2152
|
}
|
|
3137
|
-
return
|
|
3138
|
-
|
|
2153
|
+
return j.addEventListener("loadedmetadata", ee), () => {
|
|
2154
|
+
j.removeEventListener("loadedmetadata", ee);
|
|
3139
2155
|
};
|
|
3140
|
-
}),
|
|
3141
|
-
if (!e(
|
|
2156
|
+
}), Te(c, "data-placeholder", () => e(p)), de(() => {
|
|
2157
|
+
if (!e(o) || !e(i))
|
|
3142
2158
|
return;
|
|
3143
|
-
|
|
3144
|
-
const
|
|
3145
|
-
return
|
|
3146
|
-
e(
|
|
2159
|
+
h(), e(o).addEventListener("scroll", h);
|
|
2160
|
+
const I = new ResizeObserver(h);
|
|
2161
|
+
return I.observe(e(o)), () => {
|
|
2162
|
+
e(o).removeEventListener("scroll", h), I.disconnect();
|
|
3147
2163
|
};
|
|
3148
2164
|
});
|
|
3149
|
-
var
|
|
2165
|
+
var w = {
|
|
3150
2166
|
get for() {
|
|
3151
|
-
return
|
|
2167
|
+
return n();
|
|
3152
2168
|
},
|
|
3153
|
-
set for(
|
|
3154
|
-
|
|
2169
|
+
set for(I = "") {
|
|
2170
|
+
n(I), v();
|
|
3155
2171
|
},
|
|
3156
2172
|
get maxHeight() {
|
|
3157
|
-
return
|
|
2173
|
+
return a();
|
|
3158
2174
|
},
|
|
3159
|
-
set maxHeight(
|
|
3160
|
-
|
|
2175
|
+
set maxHeight(I = 0) {
|
|
2176
|
+
a(I), v();
|
|
3161
2177
|
}
|
|
3162
|
-
}, C =
|
|
3163
|
-
let
|
|
3164
|
-
var
|
|
3165
|
-
let
|
|
3166
|
-
var V = G(
|
|
2178
|
+
}, C = Rt();
|
|
2179
|
+
let U;
|
|
2180
|
+
var X = G(C);
|
|
2181
|
+
let F, te;
|
|
2182
|
+
var V = G(X);
|
|
3167
2183
|
{
|
|
3168
|
-
var
|
|
3169
|
-
var
|
|
3170
|
-
|
|
3171
|
-
},
|
|
3172
|
-
var
|
|
2184
|
+
var H = (I) => {
|
|
2185
|
+
var j = It(), B = G(j), ee = G(B, !0);
|
|
2186
|
+
D(B), D(j), M(() => Ee(ee, e(s))), Ce(1, j, () => Re, () => ({ duration: 400 })), z(I, j);
|
|
2187
|
+
}, be = (I) => {
|
|
2188
|
+
var j = se(), B = re(j);
|
|
3173
2189
|
{
|
|
3174
|
-
var
|
|
3175
|
-
var
|
|
2190
|
+
var ee = (b) => {
|
|
2191
|
+
var L = Ct();
|
|
3176
2192
|
let Q;
|
|
3177
|
-
|
|
3178
|
-
() => ({ height: e(
|
|
3179
|
-
]),
|
|
2193
|
+
M((ve) => Q = me(L, "", Q, ve), [
|
|
2194
|
+
() => ({ height: e(i) ? `${a()}px` : void 0 })
|
|
2195
|
+
]), z(b, L);
|
|
3180
2196
|
};
|
|
3181
|
-
|
|
3182
|
-
|
|
3183
|
-
(
|
|
3184
|
-
e(
|
|
2197
|
+
J(
|
|
2198
|
+
B,
|
|
2199
|
+
(b) => {
|
|
2200
|
+
e(p) && b(ee);
|
|
3185
2201
|
},
|
|
3186
2202
|
!0
|
|
3187
2203
|
);
|
|
3188
2204
|
}
|
|
3189
|
-
|
|
2205
|
+
z(I, j);
|
|
3190
2206
|
};
|
|
3191
|
-
|
|
3192
|
-
e(
|
|
2207
|
+
J(V, (I) => {
|
|
2208
|
+
e(s) ? I(H) : I(be, !1);
|
|
3193
2209
|
});
|
|
3194
2210
|
}
|
|
3195
|
-
return
|
|
3196
|
-
(
|
|
3197
|
-
|
|
2211
|
+
return D(X), Pe(X, (I) => m(o, I), () => e(o)), D(C), M(
|
|
2212
|
+
(I, j, B) => {
|
|
2213
|
+
U = ie(C, 1, "wrapper svelte-z1j7sg", null, U, I), F = ie(X, 1, "container svelte-z1j7sg", null, F, j), te = me(X, "", te, B);
|
|
3198
2214
|
},
|
|
3199
2215
|
[
|
|
3200
2216
|
() => ({
|
|
3201
|
-
scrollable: e(
|
|
3202
|
-
"can-scroll-up": e(
|
|
3203
|
-
"can-scroll-down": e(
|
|
2217
|
+
scrollable: e(i),
|
|
2218
|
+
"can-scroll-up": e(l),
|
|
2219
|
+
"can-scroll-down": e(y)
|
|
3204
2220
|
}),
|
|
3205
|
-
() => ({ scrollable: e(
|
|
2221
|
+
() => ({ scrollable: e(i) }),
|
|
3206
2222
|
() => ({
|
|
3207
|
-
"max-height": e(
|
|
2223
|
+
"max-height": e(i) ? `${a()}px` : void 0
|
|
3208
2224
|
})
|
|
3209
2225
|
]
|
|
3210
|
-
),
|
|
2226
|
+
), z(g, C), ye(w);
|
|
3211
2227
|
}
|
|
3212
2228
|
customElements.define("fortyfour-translation", ue(
|
|
3213
|
-
|
|
2229
|
+
Mt,
|
|
3214
2230
|
{
|
|
3215
2231
|
for: { attribute: "for", reflect: !0 },
|
|
3216
2232
|
maxHeight: { attribute: "max-height", reflect: !0, type: "Number" }
|
|
@@ -3219,217 +2235,219 @@ customElements.define("fortyfour-translation", ue(
|
|
|
3219
2235
|
[],
|
|
3220
2236
|
!0
|
|
3221
2237
|
));
|
|
3222
|
-
var
|
|
3223
|
-
function
|
|
3224
|
-
|
|
3225
|
-
let
|
|
3226
|
-
var
|
|
2238
|
+
var Ht = Le('<svg viewBox="0 0 359 254" aria-label="44" fill="currentColor"><path d="M92,300 C92.2666667,290.933333 92.8,280.533333 93.6,268.8 C93.8666667,262.666667 94,258.4 94,256 L6,256 L6,161.2 C7.33333333,159.333333 9.2,156.533333 11.6,152.8 C27.0666667,129.866667 39.3333333,110.733333 48.4,95.4 C57.4666667,80.0666667 65.2,63.8666667 71.6,46.8 L186,46.8 C128.4,122.533333 85.8666667,187.066667 58.4,240.4 L94,240.4 C94,240.133333 94,239.6 94,238.8 C93.4666667,228.666667 92.8,219.6 92,211.6 L185.2,72.4 C181.733333,91.0666667 180,127.333333 180,181.2 C180,235.066667 181.733333,274.666667 185.2,300 L92,300 Z" transform="translate(-6, -46)"></path><path d="M271,300 C271.266667,290.933333 271.8,280.533333 272.6,268.8 C272.866667,262.666667 273,258.4 273,256 L185,256 L185,161.2 C186.333333,159.333333 188.2,156.533333 190.6,152.8 C206.066667,129.866667 218.333333,110.733333 227.4,95.4 C236.466667,80.0666667 244.2,63.8666667 250.6,46.8 L365,46.8 C307.4,122.533333 264.866667,187.066667 237.4,240.4 L273,240.4 C273,240.133333 273,239.6 273,238.8 C272.466667,228.666667 271.8,219.6 271,211.6 L364.2,72.4 C360.733333,91.0666667 359,127.333333 359,181.2 C359,235.066667 360.733333,274.666667 364.2,300 L271,300 Z" transform="translate(-6, -46)"></path></svg>');
|
|
2239
|
+
function hr(g, r) {
|
|
2240
|
+
ge(r, !0);
|
|
2241
|
+
let c = d(r, "class", 7, ""), n = d(r, "height", 7, "1em"), a = d(r, "width", 7, "auto");
|
|
2242
|
+
var o = {
|
|
3227
2243
|
get class() {
|
|
3228
|
-
return
|
|
2244
|
+
return c();
|
|
3229
2245
|
},
|
|
3230
|
-
set class(
|
|
3231
|
-
|
|
2246
|
+
set class(l = "") {
|
|
2247
|
+
c(l), v();
|
|
3232
2248
|
},
|
|
3233
2249
|
get height() {
|
|
3234
|
-
return
|
|
2250
|
+
return n();
|
|
3235
2251
|
},
|
|
3236
|
-
set height(
|
|
3237
|
-
|
|
2252
|
+
set height(l = "1em") {
|
|
2253
|
+
n(l), v();
|
|
3238
2254
|
},
|
|
3239
2255
|
get width() {
|
|
3240
|
-
return
|
|
2256
|
+
return a();
|
|
3241
2257
|
},
|
|
3242
|
-
set width(
|
|
3243
|
-
|
|
2258
|
+
set width(l = "auto") {
|
|
2259
|
+
a(l), v();
|
|
3244
2260
|
}
|
|
3245
|
-
},
|
|
3246
|
-
return
|
|
3247
|
-
|
|
3248
|
-
}),
|
|
2261
|
+
}, i = Ht();
|
|
2262
|
+
return M(() => {
|
|
2263
|
+
ie(i, 0, ur(c())), W(i, "height", n()), W(i, "width", a());
|
|
2264
|
+
}), z(g, i), ye(o);
|
|
3249
2265
|
}
|
|
3250
|
-
ue(
|
|
3251
|
-
var
|
|
3252
|
-
const
|
|
3253
|
-
hash: "svelte-
|
|
2266
|
+
ue(hr, { class: {}, height: {}, width: {} }, [], [], !0);
|
|
2267
|
+
var jt = K("<fortyfour-progress-bar></fortyfour-progress-bar>", 2), qt = K("<fortyfour-line-waveform></fortyfour-line-waveform>", 2), St = K("<fortyfour-bar-waveform></fortyfour-bar-waveform>", 2), At = (g, r) => m(r, !e(r)), Bt = K('<span class="label-separator svelte-cwarz9">•</span> <button class="translation-toggle svelte-cwarz9"> </button>', 1), Nt = K("<fortyfour-translation></fortyfour-translation>", 2), Wt = K("<fortyfour-transcription></fortyfour-transcription>", 2), Dt = K('<div class="transcription-box svelte-cwarz9"><div class="transcription-header svelte-cwarz9"><span class="transcription-label svelte-cwarz9">TRANSCRIPT</span> <!></div> <!></div>'), Ut = K('<a class="branding svelte-cwarz9" href="https://44.audio" target="_blank" rel="noopener noreferrer"><span class="branding-text svelte-cwarz9">powered by</span> <!></a>'), Ft = K('<fortyfour-recording></fortyfour-recording> <div><div class="player svelte-cwarz9"><fortyfour-play-button></fortyfour-play-button> <!> <div class="duration svelte-cwarz9"><fortyfour-duration><span slot="placeholder">0:00</span></fortyfour-duration> <span class="separator svelte-cwarz9">/</span> <fortyfour-duration><span slot="placeholder">0:00</span></fortyfour-duration></div></div> <!></div> <!>', 3);
|
|
2268
|
+
const Ot = {
|
|
2269
|
+
hash: "svelte-cwarz9",
|
|
3254
2270
|
code: `:host {--fortyfour-player-font-family: system-ui, sans-serif;--fortyfour-player-font-size: 14px;--fortyfour-player-accent: #c4956a;--fortyfour-player-background: #faf8f5;--fortyfour-player-surface: #f0ede8;--fortyfour-player-text: #2c2620;--fortyfour-player-muted: #8c8279;--fortyfour-player-border: #d9d4cc;display:block;font-family:var(--fortyfour-player-font-family);font-size:var(--fortyfour-player-font-size);}
|
|
3255
2271
|
|
|
3256
2272
|
@media (prefers-color-scheme: dark) {:host {--fortyfour-player-accent: #d4a574;--fortyfour-player-background: #1c1917;--fortyfour-player-surface: #262220;--fortyfour-player-text: #e7e0d5;--fortyfour-player-muted: #9c938a;--fortyfour-player-border: #3d3632;}
|
|
3257
|
-
}.container.svelte-
|
|
3258
|
-
fortyfour-line-waveform.svelte-
|
|
3259
|
-
fortyfour-progress-bar.svelte-
|
|
3260
|
-
fortyfour-translation.svelte-
|
|
2273
|
+
}.container.svelte-cwarz9 {border:1px solid var(--fortyfour-player-border);border-radius:12px;background:var(--fortyfour-player-background);overflow:hidden;}.container.square.svelte-cwarz9 {border-radius:0;}.container.compact.svelte-cwarz9 .player:where(.svelte-cwarz9) {height:44px;padding:0.5rem 0.75rem;gap:0.75rem;}.container.compact.svelte-cwarz9 .transcription-box:where(.svelte-cwarz9) {padding:0.5rem 0.75rem;}.container.compact.svelte-cwarz9 fortyfour-play-button:where(.svelte-cwarz9) {--fortyfour-play-button-size: 40px;}.container.comfortable.svelte-cwarz9 .player:where(.svelte-cwarz9) {height:68px;padding:1rem 1.25rem;gap:1.25rem;}.container.comfortable.svelte-cwarz9 .transcription-box:where(.svelte-cwarz9) {padding:1rem 1.25rem;}.container.comfortable.svelte-cwarz9 fortyfour-play-button:where(.svelte-cwarz9) {--fortyfour-play-button-size: 56px;}.player.svelte-cwarz9 {display:flex;align-items:center;gap:1rem;height:56px;padding:0.75rem 1rem;}fortyfour-play-button.svelte-cwarz9 {--fortyfour-play-button-size: 48px;--fortyfour-play-button-background-color: var(--fortyfour-player-accent);--fortyfour-play-button-icon-color: var(--fortyfour-player-background);--fortyfour-play-button-border-width: 0;--fortyfour-play-button-focus-color: var(--fortyfour-player-accent);flex-shrink:0;}fortyfour-bar-waveform.svelte-cwarz9,
|
|
2274
|
+
fortyfour-line-waveform.svelte-cwarz9,
|
|
2275
|
+
fortyfour-progress-bar.svelte-cwarz9 {height:100%;flex:1;}fortyfour-bar-waveform.svelte-cwarz9 {--waveform-progress-color: var(--fortyfour-player-accent);--waveform-track-color: var(--fortyfour-player-border);--waveform-focus-color: var(--fortyfour-player-accent);}fortyfour-line-waveform.svelte-cwarz9 {--fortyfour-line-waveform-progress-color: var(--fortyfour-player-accent);--fortyfour-line-waveform-track-color: var(--fortyfour-player-border);--fortyfour-line-waveform-focus-color: var(--fortyfour-player-accent);}fortyfour-progress-bar.svelte-cwarz9 {--fortyfour-progress-bar-progress-color: var(--fortyfour-player-accent);--fortyfour-progress-bar-track-color: var(--fortyfour-player-border);--fortyfour-progress-bar-focus-color: var(--fortyfour-player-accent);}.duration.svelte-cwarz9 {display:flex;align-items:center;gap:0.25rem;flex-shrink:0;}.elapsed.svelte-cwarz9 {--fortyfour-duration-font-family: var(--fortyfour-player-font-family);--fortyfour-duration-font-size: 1em;--fortyfour-duration-color: var(--fortyfour-player-text);font-weight:500;}.separator.svelte-cwarz9 {font-size:1em;color:var(--fortyfour-player-muted);}.total.svelte-cwarz9 {--fortyfour-duration-font-family: var(--fortyfour-player-font-family);--fortyfour-duration-font-size: 1em;--fortyfour-duration-color: var(--fortyfour-player-muted);}.transcription-box.svelte-cwarz9 {background:var(--fortyfour-player-surface);padding:0.75rem 1rem;border-top:1px solid var(--fortyfour-player-border);}.transcription-header.svelte-cwarz9 {display:flex;align-items:center;gap:0.5em;margin-bottom:0.5rem;}.transcription-label.svelte-cwarz9 {font-size:0.7em;font-weight:600;letter-spacing:0.05em;color:var(--fortyfour-player-muted);}.label-separator.svelte-cwarz9 {font-size:0.7em;color:var(--fortyfour-player-muted);}.translation-toggle.svelte-cwarz9 {font-size:0.7em;font-weight:600;letter-spacing:0.05em;color:var(--fortyfour-player-accent);background:none;border:none;padding:0;cursor:pointer;}.translation-toggle.svelte-cwarz9:hover {text-decoration:underline;}.translation-toggle.svelte-cwarz9:focus-visible {outline:2px solid var(--fortyfour-player-accent);outline-offset:2px;border-radius:2px;}fortyfour-transcription.svelte-cwarz9,
|
|
2276
|
+
fortyfour-translation.svelte-cwarz9 {display:block;line-height:1.5;color:var(--fortyfour-player-text);--fortyfour-transcription-font-family: var(--fortyfour-player-font-family);--fortyfour-transcription-font-size: 1em;--fortyfour-translation-font-family: var(--fortyfour-player-font-family);--fortyfour-translation-font-size: 1em;--fortyfour-transcription-color: var(--fortyfour-player-muted);--fortyfour-transcription-active-color: var(--fortyfour-player-background);--fortyfour-transcription-active-bg: var(--fortyfour-player-accent);--fortyfour-transcription-past-color: var(--fortyfour-player-text);--fortyfour-transcription-fade-color: var(--fortyfour-player-surface);--fortyfour-transcription-placeholder-color: var(--fortyfour-player-border);--fortyfour-transcription-scrollbar-thumb: var(--fortyfour-player-border);--fortyfour-transcription-scrollbar-thumb-hover: var(--fortyfour-player-muted);--fortyfour-transcription-focus-color: var(--fortyfour-player-accent);--fortyfour-translation-fade-color: var(--fortyfour-player-surface);--fortyfour-translation-placeholder-color: var(--fortyfour-player-border);--fortyfour-translation-scrollbar-thumb: var(--fortyfour-player-border);--fortyfour-translation-scrollbar-thumb-hover: var(--fortyfour-player-muted);--fortyfour-translation-focus-color: var(--fortyfour-player-accent);}.branding.svelte-cwarz9 {display:flex;align-items:center;gap:0.3em;width:fit-content;margin-left:auto;margin-top:0.5rem;margin-right:1rem;text-decoration:none;color:var(--fortyfour-player-muted);border-radius:4px;white-space:nowrap;}.branding.svelte-cwarz9:focus-visible {outline:2px solid var(--fortyfour-player-accent);outline-offset:2px;}.branding-text.svelte-cwarz9 {font-size:0.7em;font-weight:400;letter-spacing:0.01em;}`
|
|
3261
2277
|
};
|
|
3262
|
-
function
|
|
3263
|
-
|
|
3264
|
-
const
|
|
3265
|
-
let
|
|
3266
|
-
const
|
|
3267
|
-
let
|
|
3268
|
-
const
|
|
2278
|
+
function Gt(g, r) {
|
|
2279
|
+
ge(r, !0), we(g, Ot);
|
|
2280
|
+
const c = r.$$host;
|
|
2281
|
+
let n = d(r, "recordingId", 7), a = d(r, "apiHost", 7, "api.44.audio"), o = d(r, "shape", 7, "rounded"), i = d(r, "preload", 7, "none"), l = d(r, "spacing", 7, "default"), y = d(r, "progress", 7, "bar-waveform"), h = d(r, "hideTranscript", 7, !1), f = d(r, "hideTranslation", 7, !1), x = d(r, "hideBranding", 7, !1);
|
|
2282
|
+
const u = `fortyfour-player-${crypto.randomUUID().slice(0, 8)}`;
|
|
2283
|
+
let s = q(null), k = q(!1), p = q(!1);
|
|
2284
|
+
const w = S(() => o() === "square"), C = S(() => e(w) ? "square" : "circle"), U = S(() => e(w) ? "0" : "2"), X = S(() => y() || "bar-waveform"), F = S(() => l() === "compact" ? 28 : l() === "comfortable" ? 48 : 40), te = S(() => l() === "compact" ? 4 : l() === "comfortable" ? 8 : 6);
|
|
3269
2285
|
function V() {
|
|
3270
|
-
const
|
|
3271
|
-
|
|
2286
|
+
const P = e(s)?.state ?? "idle";
|
|
2287
|
+
c.setAttribute("data-state", P);
|
|
3272
2288
|
}
|
|
3273
|
-
function
|
|
3274
|
-
const
|
|
3275
|
-
m(
|
|
2289
|
+
function H() {
|
|
2290
|
+
const P = e(s)?.metadata?.translation;
|
|
2291
|
+
m(k, P != null && P !== "", !0);
|
|
3276
2292
|
}
|
|
3277
|
-
|
|
3278
|
-
e(
|
|
2293
|
+
de(() => {
|
|
2294
|
+
e(s) && (V(), H());
|
|
3279
2295
|
});
|
|
3280
|
-
var
|
|
2296
|
+
var be = {
|
|
3281
2297
|
get recordingId() {
|
|
3282
|
-
return
|
|
2298
|
+
return n();
|
|
3283
2299
|
},
|
|
3284
|
-
set recordingId(
|
|
3285
|
-
|
|
2300
|
+
set recordingId(P) {
|
|
2301
|
+
n(P), v();
|
|
3286
2302
|
},
|
|
3287
2303
|
get apiHost() {
|
|
3288
|
-
return
|
|
2304
|
+
return a();
|
|
3289
2305
|
},
|
|
3290
|
-
set apiHost(
|
|
3291
|
-
|
|
2306
|
+
set apiHost(P = "api.44.audio") {
|
|
2307
|
+
a(P), v();
|
|
3292
2308
|
},
|
|
3293
2309
|
get shape() {
|
|
3294
|
-
return
|
|
2310
|
+
return o();
|
|
3295
2311
|
},
|
|
3296
|
-
set shape(
|
|
3297
|
-
|
|
2312
|
+
set shape(P = "rounded") {
|
|
2313
|
+
o(P), v();
|
|
3298
2314
|
},
|
|
3299
2315
|
get preload() {
|
|
3300
|
-
return
|
|
2316
|
+
return i();
|
|
3301
2317
|
},
|
|
3302
|
-
set preload(
|
|
3303
|
-
|
|
2318
|
+
set preload(P = "none") {
|
|
2319
|
+
i(P), v();
|
|
3304
2320
|
},
|
|
3305
2321
|
get spacing() {
|
|
3306
|
-
return
|
|
2322
|
+
return l();
|
|
3307
2323
|
},
|
|
3308
|
-
set spacing(
|
|
3309
|
-
|
|
2324
|
+
set spacing(P = "default") {
|
|
2325
|
+
l(P), v();
|
|
3310
2326
|
},
|
|
3311
2327
|
get progress() {
|
|
3312
|
-
return
|
|
2328
|
+
return y();
|
|
3313
2329
|
},
|
|
3314
|
-
set progress(
|
|
3315
|
-
|
|
2330
|
+
set progress(P = "bar-waveform") {
|
|
2331
|
+
y(P), v();
|
|
3316
2332
|
},
|
|
3317
2333
|
get hideTranscript() {
|
|
3318
|
-
return
|
|
2334
|
+
return h();
|
|
3319
2335
|
},
|
|
3320
|
-
set hideTranscript(
|
|
3321
|
-
|
|
2336
|
+
set hideTranscript(P = !1) {
|
|
2337
|
+
h(P), v();
|
|
3322
2338
|
},
|
|
3323
2339
|
get hideTranslation() {
|
|
3324
2340
|
return f();
|
|
3325
2341
|
},
|
|
3326
|
-
set hideTranslation(
|
|
3327
|
-
f(
|
|
2342
|
+
set hideTranslation(P = !1) {
|
|
2343
|
+
f(P), v();
|
|
3328
2344
|
},
|
|
3329
2345
|
get hideBranding() {
|
|
3330
|
-
return
|
|
3331
|
-
},
|
|
3332
|
-
set hideBranding(
|
|
3333
|
-
|
|
3334
|
-
}
|
|
3335
|
-
},
|
|
3336
|
-
|
|
3337
|
-
var
|
|
3338
|
-
let
|
|
3339
|
-
var
|
|
3340
|
-
|
|
3341
|
-
var Q =
|
|
2346
|
+
return x();
|
|
2347
|
+
},
|
|
2348
|
+
set hideBranding(P = !1) {
|
|
2349
|
+
x(P), v();
|
|
2350
|
+
}
|
|
2351
|
+
}, I = Ft(), j = re(I);
|
|
2352
|
+
M(() => Z(j, "id", u)), M(() => Z(j, "api-host", a())), M(() => Z(j, "recording-id", n())), M(() => Z(j, "preload", i())), Pe(j, (P) => m(s, P), () => e(s));
|
|
2353
|
+
var B = pe(j, 2);
|
|
2354
|
+
let ee;
|
|
2355
|
+
var b = G(B), L = G(b);
|
|
2356
|
+
M(() => Z(L, "for", u)), M(() => Z(L, "shape", e(C))), ie(L, 1, "svelte-cwarz9");
|
|
2357
|
+
var Q = pe(L, 2);
|
|
3342
2358
|
{
|
|
3343
|
-
var
|
|
3344
|
-
var
|
|
3345
|
-
|
|
3346
|
-
},
|
|
3347
|
-
var
|
|
2359
|
+
var ve = (P) => {
|
|
2360
|
+
var O = jt();
|
|
2361
|
+
M(() => Z(O, "for", u)), M(() => Z(O, "bar-height", e(te))), M(() => Z(O, "bar-radius", e(U))), ie(O, 1, "svelte-cwarz9"), z(P, O);
|
|
2362
|
+
}, E = (P) => {
|
|
2363
|
+
var O = se(), oe = re(O);
|
|
3348
2364
|
{
|
|
3349
|
-
var
|
|
3350
|
-
var
|
|
3351
|
-
|
|
3352
|
-
},
|
|
3353
|
-
var
|
|
3354
|
-
|
|
2365
|
+
var ae = (le) => {
|
|
2366
|
+
var $ = qt();
|
|
2367
|
+
M(() => Z($, "for", u)), Z($, "line-width", "2"), M(() => Z($, "height", e(F))), M(() => Z($, "sharp", e(w))), ie($, 1, "svelte-cwarz9"), z(le, $);
|
|
2368
|
+
}, ce = (le) => {
|
|
2369
|
+
var $ = St();
|
|
2370
|
+
M(() => Z($, "for", u)), Z($, "bar-width", "4"), Z($, "bar-gap", "2"), M(() => Z($, "bar-radius", e(U))), M(() => Z($, "height", e(F))), ie($, 1, "svelte-cwarz9"), z(le, $);
|
|
3355
2371
|
};
|
|
3356
|
-
|
|
3357
|
-
|
|
3358
|
-
(
|
|
3359
|
-
e(
|
|
2372
|
+
J(
|
|
2373
|
+
oe,
|
|
2374
|
+
(le) => {
|
|
2375
|
+
e(X) === "line-waveform" ? le(ae) : le(ce, !1);
|
|
3360
2376
|
},
|
|
3361
2377
|
!0
|
|
3362
2378
|
);
|
|
3363
2379
|
}
|
|
3364
|
-
|
|
2380
|
+
z(P, O);
|
|
3365
2381
|
};
|
|
3366
|
-
|
|
3367
|
-
e(
|
|
2382
|
+
J(Q, (P) => {
|
|
2383
|
+
e(X) === "progress-bar" ? P(ve) : P(E, !1);
|
|
3368
2384
|
});
|
|
3369
2385
|
}
|
|
3370
|
-
var
|
|
3371
|
-
|
|
3372
|
-
var
|
|
3373
|
-
|
|
3374
|
-
var
|
|
2386
|
+
var R = pe(Q, 2), t = G(R);
|
|
2387
|
+
ie(t, 1, "elapsed svelte-cwarz9"), M(() => Z(t, "for", u)), Z(t, "format", "elapsed");
|
|
2388
|
+
var T = pe(t, 4);
|
|
2389
|
+
ie(T, 1, "total svelte-cwarz9"), M(() => Z(T, "for", u)), Z(T, "format", "total"), D(R), D(b);
|
|
2390
|
+
var _ = pe(b, 2);
|
|
3375
2391
|
{
|
|
3376
|
-
var
|
|
3377
|
-
var
|
|
2392
|
+
var A = (P) => {
|
|
2393
|
+
var O = Dt(), oe = G(O), ae = pe(G(oe), 2);
|
|
3378
2394
|
{
|
|
3379
|
-
var
|
|
3380
|
-
var
|
|
3381
|
-
|
|
3382
|
-
var
|
|
3383
|
-
|
|
2395
|
+
var ce = (ne) => {
|
|
2396
|
+
var fe = Bt(), ze = pe(re(fe), 2);
|
|
2397
|
+
ze.__click = [At, p];
|
|
2398
|
+
var ke = G(ze, !0);
|
|
2399
|
+
D(ze), M(() => {
|
|
2400
|
+
W(ze, "aria-pressed", e(p)), Ee(ke, e(p) ? "ORIGINAL" : "TRANSLATION");
|
|
2401
|
+
}), z(ne, fe);
|
|
3384
2402
|
};
|
|
3385
|
-
|
|
3386
|
-
e(
|
|
2403
|
+
J(ae, (ne) => {
|
|
2404
|
+
e(k) && !f() && ne(ce);
|
|
3387
2405
|
});
|
|
3388
2406
|
}
|
|
3389
|
-
|
|
3390
|
-
var
|
|
2407
|
+
D(oe);
|
|
2408
|
+
var le = pe(oe, 2);
|
|
3391
2409
|
{
|
|
3392
|
-
var
|
|
3393
|
-
var
|
|
3394
|
-
|
|
3395
|
-
},
|
|
3396
|
-
var
|
|
3397
|
-
|
|
2410
|
+
var $ = (ne) => {
|
|
2411
|
+
var fe = Nt();
|
|
2412
|
+
M(() => Z(fe, "for", u)), Z(fe, "max-height", "96"), ie(fe, 1, "svelte-cwarz9"), z(ne, fe);
|
|
2413
|
+
}, xe = (ne) => {
|
|
2414
|
+
var fe = Wt();
|
|
2415
|
+
M(() => Z(fe, "for", u)), Z(fe, "mode", "karaoke"), Z(fe, "max-height", "96"), ie(fe, 1, "svelte-cwarz9"), z(ne, fe);
|
|
3398
2416
|
};
|
|
3399
|
-
|
|
3400
|
-
e(
|
|
2417
|
+
J(le, (ne) => {
|
|
2418
|
+
e(p) && !f() ? ne($) : ne(xe, !1);
|
|
3401
2419
|
});
|
|
3402
2420
|
}
|
|
3403
|
-
|
|
2421
|
+
D(O), z(P, O);
|
|
3404
2422
|
};
|
|
3405
|
-
|
|
3406
|
-
|
|
2423
|
+
J(_, (P) => {
|
|
2424
|
+
h() || P(A);
|
|
3407
2425
|
});
|
|
3408
2426
|
}
|
|
3409
|
-
|
|
3410
|
-
var
|
|
2427
|
+
D(B);
|
|
2428
|
+
var N = pe(B, 2);
|
|
3411
2429
|
{
|
|
3412
|
-
var
|
|
3413
|
-
var
|
|
3414
|
-
|
|
2430
|
+
var Y = (P) => {
|
|
2431
|
+
var O = Ut(), oe = pe(G(O), 2);
|
|
2432
|
+
hr(oe, { class: "branding-logo", height: "0.65em" }), D(O), z(P, O);
|
|
3415
2433
|
};
|
|
3416
|
-
|
|
3417
|
-
|
|
2434
|
+
J(N, (P) => {
|
|
2435
|
+
x() || P(Y);
|
|
3418
2436
|
});
|
|
3419
2437
|
}
|
|
3420
|
-
return
|
|
2438
|
+
return M((P) => ee = ie(B, 1, "container svelte-cwarz9", null, ee, P), [
|
|
3421
2439
|
() => ({
|
|
3422
|
-
square: e(
|
|
3423
|
-
compact:
|
|
3424
|
-
comfortable:
|
|
2440
|
+
square: e(w),
|
|
2441
|
+
compact: l() === "compact",
|
|
2442
|
+
comfortable: l() === "comfortable"
|
|
3425
2443
|
})
|
|
3426
|
-
]),
|
|
3427
|
-
V(),
|
|
3428
|
-
}),
|
|
2444
|
+
]), he("loadedmetadata", j, () => {
|
|
2445
|
+
V(), H();
|
|
2446
|
+
}), he("play", j, V), he("pause", j, V), he("error", j, V), he("ended", j, V), z(g, I), ye(be);
|
|
3429
2447
|
}
|
|
3430
|
-
|
|
2448
|
+
He(["click"]);
|
|
3431
2449
|
customElements.define("fortyfour-player", ue(
|
|
3432
|
-
|
|
2450
|
+
Gt,
|
|
3433
2451
|
{
|
|
3434
2452
|
apiHost: { attribute: "api-host", reflect: !0 },
|
|
3435
2453
|
recordingId: { attribute: "recording-id", reflect: !0 },
|
|
@@ -3449,62 +2467,62 @@ customElements.define("fortyfour-player", ue(
|
|
|
3449
2467
|
[],
|
|
3450
2468
|
!0
|
|
3451
2469
|
));
|
|
3452
|
-
var
|
|
3453
|
-
const
|
|
2470
|
+
var Kt = K("<fortyfour-recording></fortyfour-recording> <fortyfour-play-button></fortyfour-play-button>", 3);
|
|
2471
|
+
const Xt = {
|
|
3454
2472
|
hash: "svelte-1i43bu9",
|
|
3455
2473
|
code: `:host {--fortyfour-mini-player-accent: #c4956a;--fortyfour-mini-player-background: #faf8f5;display:inline-block;}
|
|
3456
2474
|
|
|
3457
2475
|
@media (prefers-color-scheme: dark) {:host {--fortyfour-mini-player-accent: #d4a574;--fortyfour-mini-player-background: #1c1917;}
|
|
3458
2476
|
}fortyfour-play-button.svelte-1i43bu9 {--fortyfour-play-button-size: 48px;--fortyfour-play-button-background-color: var(--fortyfour-mini-player-background);--fortyfour-play-button-icon-color: var(--fortyfour-mini-player-accent);--fortyfour-play-button-border-width: 0;--fortyfour-play-button-ring-width: 3px;--fortyfour-play-button-ring-fill-color: var(--fortyfour-mini-player-accent);--fortyfour-play-button-ring-track-color: var(--fortyfour-mini-player-background);--fortyfour-play-button-focus-color: var(--fortyfour-mini-player-accent);}fortyfour-play-button.small.svelte-1i43bu9 {--fortyfour-play-button-size: 32px;--fortyfour-play-button-ring-width: 2px;}fortyfour-play-button.large.svelte-1i43bu9 {--fortyfour-play-button-size: 64px;--fortyfour-play-button-ring-width: 4px;}`
|
|
3459
2477
|
};
|
|
3460
|
-
function
|
|
3461
|
-
|
|
3462
|
-
const
|
|
3463
|
-
let
|
|
3464
|
-
const
|
|
3465
|
-
let
|
|
3466
|
-
function
|
|
3467
|
-
const
|
|
3468
|
-
|
|
2478
|
+
function Zt(g, r) {
|
|
2479
|
+
ge(r, !0), we(g, Xt);
|
|
2480
|
+
const c = r.$$host;
|
|
2481
|
+
let n = d(r, "recordingId", 7), a = d(r, "apiHost", 7, "api.44.audio"), o = d(r, "size", 7, "medium"), i = d(r, "preload", 7, "none");
|
|
2482
|
+
const l = `fortyfour-mini-player-${crypto.randomUUID().slice(0, 8)}`;
|
|
2483
|
+
let y = q(null);
|
|
2484
|
+
function h() {
|
|
2485
|
+
const p = e(y)?.state ?? "idle";
|
|
2486
|
+
c.setAttribute("data-state", p);
|
|
3469
2487
|
}
|
|
3470
|
-
|
|
3471
|
-
e(
|
|
2488
|
+
de(() => {
|
|
2489
|
+
e(y) && h();
|
|
3472
2490
|
});
|
|
3473
2491
|
var f = {
|
|
3474
2492
|
get recordingId() {
|
|
3475
|
-
return
|
|
2493
|
+
return n();
|
|
3476
2494
|
},
|
|
3477
|
-
set recordingId(
|
|
3478
|
-
|
|
2495
|
+
set recordingId(p) {
|
|
2496
|
+
n(p), v();
|
|
3479
2497
|
},
|
|
3480
2498
|
get apiHost() {
|
|
3481
|
-
return
|
|
2499
|
+
return a();
|
|
3482
2500
|
},
|
|
3483
|
-
set apiHost(
|
|
3484
|
-
|
|
2501
|
+
set apiHost(p = "api.44.audio") {
|
|
2502
|
+
a(p), v();
|
|
3485
2503
|
},
|
|
3486
2504
|
get size() {
|
|
3487
|
-
return
|
|
2505
|
+
return o();
|
|
3488
2506
|
},
|
|
3489
|
-
set size(
|
|
3490
|
-
|
|
2507
|
+
set size(p = "medium") {
|
|
2508
|
+
o(p), v();
|
|
3491
2509
|
},
|
|
3492
2510
|
get preload() {
|
|
3493
|
-
return
|
|
2511
|
+
return i();
|
|
3494
2512
|
},
|
|
3495
|
-
set preload(
|
|
3496
|
-
|
|
3497
|
-
}
|
|
3498
|
-
},
|
|
3499
|
-
|
|
3500
|
-
var
|
|
3501
|
-
let
|
|
3502
|
-
return
|
|
3503
|
-
() => ({ small:
|
|
3504
|
-
]),
|
|
2513
|
+
set preload(p = "none") {
|
|
2514
|
+
i(p), v();
|
|
2515
|
+
}
|
|
2516
|
+
}, x = Kt(), u = re(x);
|
|
2517
|
+
M(() => Z(u, "id", l)), M(() => Z(u, "api-host", a())), M(() => Z(u, "recording-id", n())), M(() => Z(u, "preload", i())), Pe(u, (p) => m(y, p), () => e(y));
|
|
2518
|
+
var s = pe(u, 2);
|
|
2519
|
+
let k;
|
|
2520
|
+
return M(() => Z(s, "for", l)), Z(s, "shape", "circle"), Z(s, "visualization", "ring"), M((p) => k = ie(s, 1, "button svelte-1i43bu9", null, k, p), [
|
|
2521
|
+
() => ({ small: o() === "small", large: o() === "large" })
|
|
2522
|
+
]), he("loadedmetadata", u, h), he("play", u, h), he("pause", u, h), he("error", u, h), he("ended", u, h), z(g, x), ye(f);
|
|
3505
2523
|
}
|
|
3506
2524
|
customElements.define("fortyfour-mini-player", ue(
|
|
3507
|
-
|
|
2525
|
+
Zt,
|
|
3508
2526
|
{
|
|
3509
2527
|
apiHost: { attribute: "api-host", reflect: !0 },
|
|
3510
2528
|
recordingId: { attribute: "recording-id", reflect: !0 },
|