| @@ -1,512 +1,563 @@ | ||
| 1 | 1 | // packages/block-library/build-module/playlist/view.mjs |
| 2 | 2 | import { store, getContext, getElement } from "@wordpress/interactivity"; |
| 3 | 3 | |
| 4 | 4 | // node_modules/colord/index.mjs |
| 5 | -var r = { grad: 0.9, turn: 360, rad: 360 / (2 * Math.PI) }; | |
| 6 | -var t = function(r2) { | |
| 5 | +for (r = { grad: 0.9, turn: 360, rad: 360 / (2 * Math.PI) }, t = function(r2) { | |
| 7 | 6 | return "string" == typeof r2 ? r2.length > 0 : "number" == typeof r2; |
| 8 | -}; | |
| 9 | -var n = function(r2, t2, n2) { | |
| 7 | +}, n = function(r2, t2, n2) { | |
| 10 | 8 | return void 0 === t2 && (t2 = 0), void 0 === n2 && (n2 = Math.pow(10, t2)), Math.round(n2 * r2) / n2 + 0; |
| 11 | -}; | |
| 12 | -var e = function(r2, t2, n2) { | |
| 9 | +}, u = function(r2, t2, n2) { | |
| 13 | 10 | return void 0 === t2 && (t2 = 0), void 0 === n2 && (n2 = 1), r2 > n2 ? n2 : r2 > t2 ? r2 : t2; |
| 14 | -}; | |
| 15 | -var u = function(r2) { | |
| 16 | - return (r2 = isFinite(r2) ? r2 % 360 : 0) > 0 ? r2 : r2 + 360; | |
| 17 | -}; | |
| 18 | -var a = function(r2) { | |
| 19 | - return { r: e(r2.r, 0, 255), g: e(r2.g, 0, 255), b: e(r2.b, 0, 255), a: e(r2.a) }; | |
| 20 | -}; | |
| 21 | -var o = function(r2) { | |
| 11 | +}, e2 = function(r2) { | |
| 12 | + return (r2 = isFinite(r2) ? r2 % 360 : 0) < 0 ? r2 + 360 : r2; | |
| 13 | +}, o = function(r2, t2) { | |
| 14 | + return void 0 === t2 && (t2 = 0), n(r2, t2) % 360; | |
| 15 | +}, a = function(r2) { | |
| 16 | + return { r: u(r2.r, 0, 255), g: u(r2.g, 0, 255), b: u(r2.b, 0, 255), a: u(r2.a) }; | |
| 17 | +}, i = function(r2) { | |
| 22 | 18 | return { r: n(r2.r), g: n(r2.g), b: n(r2.b), a: n(r2.a, 3) }; |
| 19 | +}, s = /^#([0-9a-f]{3,8})$/i, d = function(r2, t2) { | |
| 20 | + var n2 = r2.charCodeAt(t2); | |
| 21 | + return (15 & n2) + 9 * (n2 >> 6); | |
| 22 | +}, h = function(r2, t2) { | |
| 23 | + return d(r2, t2) << 4 | d(r2, t2 + 1); | |
| 24 | +}, b = [], f = 0; f < 256; f++) b.push((f < 16 ? "0" : "") + f.toString(16)); | |
| 25 | +var r; | |
| 26 | +var t; | |
| 27 | +var n; | |
| 28 | +var u; | |
| 29 | +var e2; | |
| 30 | +var o; | |
| 31 | +var a; | |
| 32 | +var i; | |
| 33 | +var s; | |
| 34 | +var d; | |
| 35 | +var h; | |
| 36 | +var b; | |
| 37 | +var f; | |
| 38 | +var g = function(r) { | |
| 39 | + return b[u(r, 0, 255)]; | |
| 23 | 40 | }; |
| 24 | -var i = /^#([0-9a-f]{3,8})$/i; | |
| 25 | -var s = function(r2) { | |
| 26 | - var t2 = r2.toString(16); | |
| 27 | - return t2.length < 2 ? "0" + t2 : t2; | |
| 41 | +var c = function(r) { | |
| 42 | + var t = r.r, n = r.g, u = r.b, e2 = r.a, o = Math.max(t, n, u), a = o - Math.min(t, n, u), i = a ? o === t ? (n - u) / a : o === n ? 2 + (u - t) / a : 4 + (t - n) / a : 0; | |
| 43 | + return { h: 60 * (i < 0 ? i + 6 : i), s: o ? a / o * 100 : 0, v: o / 255 * 100, a: e2 }; | |
| 28 | 44 | }; |
| 29 | -var h = function(r2) { | |
| 30 | - var t2 = r2.r, n2 = r2.g, e3 = r2.b, u2 = r2.a, a2 = Math.max(t2, n2, e3), o2 = a2 - Math.min(t2, n2, e3), i2 = o2 ? a2 === t2 ? (n2 - e3) / o2 : a2 === n2 ? 2 + (e3 - t2) / o2 : 4 + (t2 - n2) / o2 : 0; | |
| 31 | - return { h: 60 * (i2 < 0 ? i2 + 6 : i2), s: a2 ? o2 / a2 * 100 : 0, v: a2 / 255 * 100, a: u2 }; | |
| 45 | +var v = function(r) { | |
| 46 | + var t = r.h, n = r.s, u = r.v, e2 = r.a; | |
| 47 | + t = t / 360 * 6, n /= 100, u /= 100; | |
| 48 | + var o = Math.floor(t), a = u * (1 - n), i = u * (1 - (t - o) * n), s = u * (1 - (1 - t + o) * n), d = o % 6; | |
| 49 | + return { r: 255 * [u, i, a, a, s, u][d], g: 255 * [s, u, u, i, a, a][d], b: 255 * [a, a, s, u, u, i][d], a: e2 }; | |
| 32 | 50 | }; |
| 33 | -var b = function(r2) { | |
| 34 | - var t2 = r2.h, n2 = r2.s, e3 = r2.v, u2 = r2.a; | |
| 35 | - t2 = t2 / 360 * 6, n2 /= 100, e3 /= 100; | |
| 36 | - var a2 = Math.floor(t2), o2 = e3 * (1 - n2), i2 = e3 * (1 - (t2 - a2) * n2), s2 = e3 * (1 - (1 - t2 + a2) * n2), h2 = a2 % 6; | |
| 37 | - return { r: 255 * [e3, i2, o2, o2, s2, e3][h2], g: 255 * [s2, e3, e3, i2, o2, o2][h2], b: 255 * [o2, o2, s2, e3, e3, i2][h2], a: u2 }; | |
| 51 | +var l = function(r) { | |
| 52 | + return { h: e2(r.h), s: u(r.s, 0, 100), l: u(r.l, 0, 100), a: u(r.a) }; | |
| 38 | 53 | }; |
| 39 | -var g = function(r2) { | |
| 40 | - return { h: u(r2.h), s: e(r2.s, 0, 100), l: e(r2.l, 0, 100), a: e(r2.a) }; | |
| 54 | +var p = function(r) { | |
| 55 | + return { h: o(r.h), s: n(r.s), l: n(r.l), a: n(r.a, 3) }; | |
| 41 | 56 | }; |
| 42 | -var d = function(r2) { | |
| 43 | - return { h: n(r2.h), s: n(r2.s), l: n(r2.l), a: n(r2.a, 3) }; | |
| 57 | +var m = function(r) { | |
| 58 | + return v((n = (t = r).s, { h: t.h, s: (n *= ((u = t.l) < 50 ? u : 100 - u) / 100) > 0 ? 2 * n / (u + n) * 100 : 0, v: u + n, a: t.a })); | |
| 59 | + var t, n, u; | |
| 44 | 60 | }; |
| 45 | -var f = function(r2) { | |
| 46 | - return b((n2 = (t2 = r2).s, { h: t2.h, s: (n2 *= ((e3 = t2.l) < 50 ? e3 : 100 - e3) / 100) > 0 ? 2 * n2 / (e3 + n2) * 100 : 0, v: e3 + n2, a: t2.a })); | |
| 47 | - var t2, n2, e3; | |
| 61 | +var y = function(r) { | |
| 62 | + return { h: (t = c(r)).h, s: (e2 = (200 - (n = t.s)) * (u = t.v) / 100) > 0 && e2 < 200 ? n * u / 100 / (e2 <= 100 ? e2 : 200 - e2) * 100 : 0, l: e2 / 2, a: t.a }; | |
| 63 | + var t, n, u, e2; | |
| 48 | 64 | }; |
| 49 | -var c = function(r2) { | |
| 50 | - return { h: (t2 = h(r2)).h, s: (u2 = (200 - (n2 = t2.s)) * (e3 = t2.v) / 100) > 0 && u2 < 200 ? n2 * e3 / 100 / (u2 <= 100 ? u2 : 200 - u2) * 100 : 0, l: u2 / 2, a: t2.a }; | |
| 51 | - var t2, n2, e3, u2; | |
| 52 | -}; | |
| 53 | -var l = /^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s*,\s*([+-]?\d*\.?\d+)%\s*,\s*([+-]?\d*\.?\d+)%\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i; | |
| 54 | -var p = /^hsla?\(\s*([+-]?\d*\.?\d+)(deg|rad|grad|turn)?\s+([+-]?\d*\.?\d+)%\s+([+-]?\d*\.?\d+)%\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i; | |
| 55 | -var v = /^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*,\s*([+-]?\d*\.?\d+)(%)?\s*(?:,\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i; | |
| 56 | -var m = /^rgba?\(\s*([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s+([+-]?\d*\.?\d+)(%)?\s*(?:\/\s*([+-]?\d*\.?\d+)(%)?\s*)?\)$/i; | |
| 57 | -var y = { string: [[function(r2) { | |
| 58 | - var t2 = i.exec(r2); | |
| 59 | - return t2 ? (r2 = t2[1]).length <= 4 ? { r: parseInt(r2[0] + r2[0], 16), g: parseInt(r2[1] + r2[1], 16), b: parseInt(r2[2] + r2[2], 16), a: 4 === r2.length ? n(parseInt(r2[3] + r2[3], 16) / 255, 2) : 1 } : 6 === r2.length || 8 === r2.length ? { r: parseInt(r2.substr(0, 2), 16), g: parseInt(r2.substr(2, 2), 16), b: parseInt(r2.substr(4, 2), 16), a: 8 === r2.length ? n(parseInt(r2.substr(6, 2), 16) / 255, 2) : 1 } : null : null; | |
| 60 | -}, "hex"], [function(r2) { | |
| 61 | - var t2 = v.exec(r2) || m.exec(r2); | |
| 62 | - return t2 ? t2[2] !== t2[4] || t2[4] !== t2[6] ? null : a({ r: Number(t2[1]) / (t2[2] ? 100 / 255 : 1), g: Number(t2[3]) / (t2[4] ? 100 / 255 : 1), b: Number(t2[5]) / (t2[6] ? 100 / 255 : 1), a: void 0 === t2[7] ? 1 : Number(t2[7]) / (t2[8] ? 100 : 1) }) : null; | |
| 63 | -}, "rgb"], [function(t2) { | |
| 64 | - var n2 = l.exec(t2) || p.exec(t2); | |
| 65 | - if (!n2) return null; | |
| 66 | - var e3, u2, a2 = g({ h: (e3 = n2[1], u2 = n2[2], void 0 === u2 && (u2 = "deg"), Number(e3) * (r[u2] || 1)), s: Number(n2[3]), l: Number(n2[4]), a: void 0 === n2[5] ? 1 : Number(n2[5]) / (n2[6] ? 100 : 1) }); | |
| 67 | - return f(a2); | |
| 68 | -}, "hsl"]], object: [[function(r2) { | |
| 69 | - var n2 = r2.r, e3 = r2.g, u2 = r2.b, o2 = r2.a, i2 = void 0 === o2 ? 1 : o2; | |
| 70 | - return t(n2) && t(e3) && t(u2) ? a({ r: Number(n2), g: Number(e3), b: Number(u2), a: Number(i2) }) : null; | |
| 71 | -}, "rgb"], [function(r2) { | |
| 72 | - var n2 = r2.h, e3 = r2.s, u2 = r2.l, a2 = r2.a, o2 = void 0 === a2 ? 1 : a2; | |
| 73 | - if (!t(n2) || !t(e3) || !t(u2)) return null; | |
| 74 | - var i2 = g({ h: Number(n2), s: Number(e3), l: Number(u2), a: Number(o2) }); | |
| 75 | - return f(i2); | |
| 76 | -}, "hsl"], [function(r2) { | |
| 77 | - var n2 = r2.h, a2 = r2.s, o2 = r2.v, i2 = r2.a, s2 = void 0 === i2 ? 1 : i2; | |
| 78 | - if (!t(n2) || !t(a2) || !t(o2)) return null; | |
| 79 | - var h2 = (function(r3) { | |
| 80 | - return { h: u(r3.h), s: e(r3.s, 0, 100), v: e(r3.v, 0, 100), a: e(r3.a) }; | |
| 81 | - })({ h: Number(n2), s: Number(a2), v: Number(o2), a: Number(s2) }); | |
| 82 | - return b(h2); | |
| 65 | +var N = /^hsla?\(\s*([+-]?(?:\d*\.\d+|\d+))(deg|rad|grad|turn)?\s*,\s*([+-]?(?:\d*\.\d+|\d+))%\s*,\s*([+-]?(?:\d*\.\d+|\d+))%\s*(?:,\s*([+-]?(?:\d*\.\d+|\d+))(%)?\s*)?\)$/i; | |
| 66 | +var x = /^hsla?\(\s*([+-]?(?:\d*\.\d+|\d+))(deg|rad|grad|turn)?\s+([+-]?(?:\d*\.\d+|\d+))%\s+([+-]?(?:\d*\.\d+|\d+))%\s*(?:\/\s*([+-]?(?:\d*\.\d+|\d+))(%)?\s*)?\)$/i; | |
| 67 | +var M = /^rgba?\(\s*([+-]?(?:\d*\.\d+|\d+))(%)?\s*,\s*([+-]?(?:\d*\.\d+|\d+))(%)?\s*,\s*([+-]?(?:\d*\.\d+|\d+))(%)?\s*(?:,\s*([+-]?(?:\d*\.\d+|\d+))(%)?\s*)?\)$/i; | |
| 68 | +var H = /^rgba?\(\s*([+-]?(?:\d*\.\d+|\d+))(%)?\s+([+-]?(?:\d*\.\d+|\d+))(%)?\s+([+-]?(?:\d*\.\d+|\d+))(%)?\s*(?:\/\s*([+-]?(?:\d*\.\d+|\d+))(%)?\s*)?\)$/i; | |
| 69 | +var $ = { string: [[function(r) { | |
| 70 | + if (!s.test(r)) return null; | |
| 71 | + var t = r.length; | |
| 72 | + return t <= 5 ? { r: 17 * d(r, 1), g: 17 * d(r, 2), b: 17 * d(r, 3), a: 5 === t ? n(17 * d(r, 4) / 255, 2) : 1 } : 7 === t || 9 === t ? { r: h(r, 1), g: h(r, 3), b: h(r, 5), a: 9 === t ? n(h(r, 7) / 255, 2) : 1 } : null; | |
| 73 | +}, "hex"], [function(r) { | |
| 74 | + var t = M.exec(r) || H.exec(r); | |
| 75 | + return t ? t[2] !== t[4] || t[4] !== t[6] ? null : a({ r: Number(t[1]) / (t[2] ? 100 / 255 : 1), g: Number(t[3]) / (t[4] ? 100 / 255 : 1), b: Number(t[5]) / (t[6] ? 100 / 255 : 1), a: void 0 === t[7] ? 1 : Number(t[7]) / (t[8] ? 100 : 1) }) : null; | |
| 76 | +}, "rgb"], [function(t) { | |
| 77 | + var n = N.exec(t) || x.exec(t); | |
| 78 | + if (!n) return null; | |
| 79 | + var u, e2, o = l({ h: (u = n[1], e2 = n[2], void 0 === e2 && (e2 = "deg"), Number(u) * (r[e2] || 1)), s: Number(n[3]), l: Number(n[4]), a: void 0 === n[5] ? 1 : Number(n[5]) / (n[6] ? 100 : 1) }); | |
| 80 | + return m(o); | |
| 81 | +}, "hsl"]], object: [[function(r) { | |
| 82 | + var n = r.r, u = r.g, e2 = r.b, o = r.a, i = void 0 === o ? 1 : o; | |
| 83 | + return t(n) && t(u) && t(e2) ? a({ r: Number(n), g: Number(u), b: Number(e2), a: Number(i) }) : null; | |
| 84 | +}, "rgb"], [function(r) { | |
| 85 | + var n = r.h, u = r.s, e2 = r.l, o = r.a, a = void 0 === o ? 1 : o; | |
| 86 | + if (!t(n) || !t(u) || !t(e2)) return null; | |
| 87 | + var i = l({ h: Number(n), s: Number(u), l: Number(e2), a: Number(a) }); | |
| 88 | + return m(i); | |
| 89 | +}, "hsl"], [function(r) { | |
| 90 | + var n = r.h, o = r.s, a = r.v, i = r.a, s = void 0 === i ? 1 : i; | |
| 91 | + if (!t(n) || !t(o) || !t(a)) return null; | |
| 92 | + var d = (function(r2) { | |
| 93 | + return { h: e2(r2.h), s: u(r2.s, 0, 100), v: u(r2.v, 0, 100), a: u(r2.a) }; | |
| 94 | + })({ h: Number(n), s: Number(o), v: Number(a), a: Number(s) }); | |
| 95 | + return v(d); | |
| 83 | 96 | }, "hsv"]] }; |
| 84 | -var N = function(r2, t2) { | |
| 85 | - for (var n2 = 0; n2 < t2.length; n2++) { | |
| 86 | - var e3 = t2[n2][0](r2); | |
| 87 | - if (e3) return [e3, t2[n2][1]]; | |
| 97 | +var j = function(r, t) { | |
| 98 | + for (var n = 0; n < t.length; n++) { | |
| 99 | + var u = t[n][0](r); | |
| 100 | + if (u) return [u, t[n][1]]; | |
| 88 | 101 | } |
| 89 | 102 | return [null, void 0]; |
| 90 | 103 | }; |
| 91 | -var x = function(r2) { | |
| 92 | - return "string" == typeof r2 ? N(r2.trim(), y.string) : "object" == typeof r2 && null !== r2 ? N(r2, y.object) : [null, void 0]; | |
| 104 | +var w = function(r) { | |
| 105 | + return "string" == typeof r ? j(r.trim(), $.string) : "object" == typeof r && null !== r ? j(r, $.object) : [null, void 0]; | |
| 93 | 106 | }; |
| 94 | -var M = function(r2, t2) { | |
| 95 | - var n2 = c(r2); | |
| 96 | - return { h: n2.h, s: e(n2.s + 100 * t2, 0, 100), l: n2.l, a: n2.a }; | |
| 107 | +var k = function(r, t) { | |
| 108 | + var n = y(r); | |
| 109 | + return { h: n.h, s: u(n.s + 100 * t, 0, 100), l: n.l, a: n.a }; | |
| 97 | 110 | }; |
| 98 | -var H = function(r2) { | |
| 99 | - return (299 * r2.r + 587 * r2.g + 114 * r2.b) / 1e3 / 255; | |
| 111 | +var E = function(r) { | |
| 112 | + return (299 * r.r + 587 * r.g + 114 * r.b) / 1e3 / 255; | |
| 100 | 113 | }; |
| 101 | -var $ = function(r2, t2) { | |
| 102 | - var n2 = c(r2); | |
| 103 | - return { h: n2.h, s: n2.s, l: e(n2.l + 100 * t2, 0, 100), a: n2.a }; | |
| 114 | +var R = function(r, t) { | |
| 115 | + var n = y(r); | |
| 116 | + return { h: n.h, s: n.s, l: u(n.l + 100 * t, 0, 100), a: n.a }; | |
| 104 | 117 | }; |
| 105 | -var j = (function() { | |
| 106 | - function r2(r3) { | |
| 107 | - this.parsed = x(r3)[0], this.rgba = this.parsed || { r: 0, g: 0, b: 0, a: 1 }; | |
| 118 | +var q = (function() { | |
| 119 | + function r(r2) { | |
| 120 | + this.parsed = w(r2)[0], this.rgba = this.parsed || { r: 0, g: 0, b: 0, a: 1 }; | |
| 108 | 121 | } |
| 109 | - return r2.prototype.isValid = function() { | |
| 122 | + return r.prototype.isValid = function() { | |
| 110 | 123 | return null !== this.parsed; |
| 111 | - }, r2.prototype.brightness = function() { | |
| 112 | - return n(H(this.rgba), 2); | |
| 113 | - }, r2.prototype.isDark = function() { | |
| 114 | - return H(this.rgba) < 0.5; | |
| 115 | - }, r2.prototype.isLight = function() { | |
| 116 | - return H(this.rgba) >= 0.5; | |
| 117 | - }, r2.prototype.toHex = function() { | |
| 118 | - return r3 = o(this.rgba), t2 = r3.r, e3 = r3.g, u2 = r3.b, i2 = (a2 = r3.a) < 1 ? s(n(255 * a2)) : "", "#" + s(t2) + s(e3) + s(u2) + i2; | |
| 119 | - var r3, t2, e3, u2, a2, i2; | |
| 120 | - }, r2.prototype.toRgb = function() { | |
| 121 | - return o(this.rgba); | |
| 122 | - }, r2.prototype.toRgbString = function() { | |
| 123 | - return r3 = o(this.rgba), t2 = r3.r, n2 = r3.g, e3 = r3.b, (u2 = r3.a) < 1 ? "rgba(" + t2 + ", " + n2 + ", " + e3 + ", " + u2 + ")" : "rgb(" + t2 + ", " + n2 + ", " + e3 + ")"; | |
| 124 | - var r3, t2, n2, e3, u2; | |
| 125 | - }, r2.prototype.toHsl = function() { | |
| 126 | - return d(c(this.rgba)); | |
| 127 | - }, r2.prototype.toHslString = function() { | |
| 128 | - return r3 = d(c(this.rgba)), t2 = r3.h, n2 = r3.s, e3 = r3.l, (u2 = r3.a) < 1 ? "hsla(" + t2 + ", " + n2 + "%, " + e3 + "%, " + u2 + ")" : "hsl(" + t2 + ", " + n2 + "%, " + e3 + "%)"; | |
| 129 | - var r3, t2, n2, e3, u2; | |
| 130 | - }, r2.prototype.toHsv = function() { | |
| 131 | - return r3 = h(this.rgba), { h: n(r3.h), s: n(r3.s), v: n(r3.v), a: n(r3.a, 3) }; | |
| 132 | - var r3; | |
| 133 | - }, r2.prototype.invert = function() { | |
| 134 | - return w({ r: 255 - (r3 = this.rgba).r, g: 255 - r3.g, b: 255 - r3.b, a: r3.a }); | |
| 135 | - var r3; | |
| 136 | - }, r2.prototype.saturate = function(r3) { | |
| 137 | - return void 0 === r3 && (r3 = 0.1), w(M(this.rgba, r3)); | |
| 138 | - }, r2.prototype.desaturate = function(r3) { | |
| 139 | - return void 0 === r3 && (r3 = 0.1), w(M(this.rgba, -r3)); | |
| 140 | - }, r2.prototype.grayscale = function() { | |
| 141 | - return w(M(this.rgba, -1)); | |
| 142 | - }, r2.prototype.lighten = function(r3) { | |
| 143 | - return void 0 === r3 && (r3 = 0.1), w($(this.rgba, r3)); | |
| 144 | - }, r2.prototype.darken = function(r3) { | |
| 145 | - return void 0 === r3 && (r3 = 0.1), w($(this.rgba, -r3)); | |
| 146 | - }, r2.prototype.rotate = function(r3) { | |
| 147 | - return void 0 === r3 && (r3 = 15), this.hue(this.hue() + r3); | |
| 148 | - }, r2.prototype.alpha = function(r3) { | |
| 149 | - return "number" == typeof r3 ? w({ r: (t2 = this.rgba).r, g: t2.g, b: t2.b, a: r3 }) : n(this.rgba.a, 3); | |
| 150 | - var t2; | |
| 151 | - }, r2.prototype.hue = function(r3) { | |
| 152 | - var t2 = c(this.rgba); | |
| 153 | - return "number" == typeof r3 ? w({ h: r3, s: t2.s, l: t2.l, a: t2.a }) : n(t2.h); | |
| 154 | - }, r2.prototype.isEqual = function(r3) { | |
| 155 | - return this.toHex() === w(r3).toHex(); | |
| 156 | - }, r2; | |
| 124 | + }, r.prototype.brightness = function() { | |
| 125 | + return n(E(this.rgba), 2); | |
| 126 | + }, r.prototype.isDark = function() { | |
| 127 | + return E(this.rgba) < 0.5; | |
| 128 | + }, r.prototype.isLight = function() { | |
| 129 | + return E(this.rgba) >= 0.5; | |
| 130 | + }, r.prototype.toHex = function() { | |
| 131 | + return r2 = i(this.rgba), t = r2.r, u = r2.g, e2 = r2.b, a = (o = r2.a) < 1 ? g(n(255 * o)) : "", "#" + g(t) + g(u) + g(e2) + a; | |
| 132 | + var r2, t, u, e2, o, a; | |
| 133 | + }, r.prototype.toRgb = function() { | |
| 134 | + return i(this.rgba); | |
| 135 | + }, r.prototype.toRgbString = function() { | |
| 136 | + return r2 = i(this.rgba), t = r2.r, n = r2.g, u = r2.b, (e2 = r2.a) < 1 ? "rgba(" + t + ", " + n + ", " + u + ", " + e2 + ")" : "rgb(" + t + ", " + n + ", " + u + ")"; | |
| 137 | + var r2, t, n, u, e2; | |
| 138 | + }, r.prototype.toHsl = function() { | |
| 139 | + return p(y(this.rgba)); | |
| 140 | + }, r.prototype.toHslString = function() { | |
| 141 | + return r2 = p(y(this.rgba)), t = r2.h, n = r2.s, u = r2.l, (e2 = r2.a) < 1 ? "hsla(" + t + ", " + n + "%, " + u + "%, " + e2 + ")" : "hsl(" + t + ", " + n + "%, " + u + "%)"; | |
| 142 | + var r2, t, n, u, e2; | |
| 143 | + }, r.prototype.toHsv = function() { | |
| 144 | + return r2 = c(this.rgba), { h: o(r2.h), s: n(r2.s), v: n(r2.v), a: n(r2.a, 3) }; | |
| 145 | + var r2; | |
| 146 | + }, r.prototype.invert = function() { | |
| 147 | + return A({ r: 255 - (r2 = this.rgba).r, g: 255 - r2.g, b: 255 - r2.b, a: r2.a }); | |
| 148 | + var r2; | |
| 149 | + }, r.prototype.saturate = function(r2) { | |
| 150 | + return void 0 === r2 && (r2 = 0.1), A(k(this.rgba, r2)); | |
| 151 | + }, r.prototype.desaturate = function(r2) { | |
| 152 | + return void 0 === r2 && (r2 = 0.1), A(k(this.rgba, -r2)); | |
| 153 | + }, r.prototype.grayscale = function() { | |
| 154 | + return A(k(this.rgba, -1)); | |
| 155 | + }, r.prototype.lighten = function(r2) { | |
| 156 | + return void 0 === r2 && (r2 = 0.1), A(R(this.rgba, r2)); | |
| 157 | + }, r.prototype.darken = function(r2) { | |
| 158 | + return void 0 === r2 && (r2 = 0.1), A(R(this.rgba, -r2)); | |
| 159 | + }, r.prototype.rotate = function(r2) { | |
| 160 | + return void 0 === r2 && (r2 = 15), this.hue(y(this.rgba).h + r2); | |
| 161 | + }, r.prototype.alpha = function(r2) { | |
| 162 | + return "number" == typeof r2 ? A({ r: (t = this.rgba).r, g: t.g, b: t.b, a: r2 }) : n(this.rgba.a, 3); | |
| 163 | + var t; | |
| 164 | + }, r.prototype.hue = function(r2) { | |
| 165 | + var t = y(this.rgba); | |
| 166 | + return "number" == typeof r2 ? A({ h: r2, s: t.s, l: t.l, a: t.a }) : o(t.h); | |
| 167 | + }, r.prototype.isEqual = function(r2) { | |
| 168 | + return this.toHex() === A(r2).toHex(); | |
| 169 | + }, r; | |
| 157 | 170 | })(); |
| 158 | -var w = function(r2) { | |
| 159 | - return r2 instanceof j ? r2 : new j(r2); | |
| 171 | +var A = function(r) { | |
| 172 | + return r instanceof q ? r : new q(r); | |
| 160 | 173 | }; |
| 161 | 174 | |
| 162 | 175 | // node_modules/@arraypress/waveform-player/dist/waveform-player.esm.js |
| 163 | -function B(e3) { | |
| 164 | - let t2 = -1 / 0; | |
| 165 | - for (let i2 = 0; i2 < e3.length; i2++) e3[i2] > t2 && (t2 = e3[i2]); | |
| 166 | - return t2; | |
| 176 | +function $2(e2) { | |
| 177 | + let t = -1 / 0; | |
| 178 | + for (let i = 0; i < e2.length; i++) e2[i] > t && (t = e2[i]); | |
| 179 | + return t; | |
| 167 | 180 | } |
| 168 | -function S(e3) { | |
| 169 | - return String(e3 ?? "").replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'"); | |
| 181 | +function S(e2) { | |
| 182 | + return String(e2 ?? "").replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'"); | |
| 170 | 183 | } |
| 171 | -function W(e3) { | |
| 172 | - return S(typeof e3 == "number" ? `${e3}px` : e3); | |
| 184 | +function q2(e2) { | |
| 185 | + return S(typeof e2 == "number" ? `${e2}px` : e2); | |
| 173 | 186 | } |
| 174 | -function N2(e3) { | |
| 175 | - if (typeof e3 != "string" || e3 === "") return false; | |
| 187 | +function st(e2) { | |
| 188 | + if (typeof e2 != "string" || e2 === "") return false; | |
| 176 | 189 | try { |
| 177 | - let t2 = new URL(e3, "http://localhost/"); | |
| 178 | - return t2.protocol === "http:" || t2.protocol === "https:"; | |
| 190 | + let t = new URL(e2, "http://localhost/"); | |
| 191 | + return t.protocol === "http:" || t.protocol === "https:"; | |
| 179 | 192 | } catch { |
| 180 | 193 | return false; |
| 181 | 194 | } |
| 182 | 195 | } |
| 183 | -function m2(e3, t2 = 0, i2 = 1) { | |
| 184 | - return Math.max(t2, Math.min(e3, i2)); | |
| 196 | +function m2(e2, t = 0, i = 1) { | |
| 197 | + return Math.max(t, Math.min(e2, i)); | |
| 185 | 198 | } |
| 186 | -function ot(e3) { | |
| 187 | - return e3 === void 0 ? void 0 : e3 === "true"; | |
| 199 | +function _(e2, t = null, i = {}) { | |
| 200 | + let { min: s = -1 / 0, max: r = 1 / 0, integer: a = false } = i, o = typeof e2 == "number" ? e2 : typeof e2 == "string" && e2.trim() !== "" ? Number(e2) : NaN; | |
| 201 | + if (!Number.isFinite(o)) return t; | |
| 202 | + let n = m2(o, s, r); | |
| 203 | + return a ? Math.round(n) : n; | |
| 188 | 204 | } |
| 189 | -function q(e3) { | |
| 190 | - if (typeof e3 == "string" && e3.trim().startsWith("[")) try { | |
| 191 | - return JSON.parse(e3); | |
| 205 | +function H2(e2, t = null) { | |
| 206 | + if (Array.isArray(e2)) return e2; | |
| 207 | + if (typeof e2 == "string" && e2.trim().startsWith("[")) try { | |
| 208 | + let i = JSON.parse(e2); | |
| 209 | + if (Array.isArray(i)) return i; | |
| 192 | 210 | } catch { |
| 193 | 211 | } |
| 194 | - return e3; | |
| 212 | + return t; | |
| 195 | 213 | } |
| 196 | -function D(e3) { | |
| 197 | - let t2 = {}, i2 = (o2, l2 = o2) => { | |
| 198 | - let n2 = ot(e3.dataset[l2]); | |
| 199 | - n2 !== void 0 && (t2[o2] = n2); | |
| 200 | - }, s2 = (o2, l2 = o2, n2 = false) => { | |
| 201 | - let h2 = e3.dataset[l2]; | |
| 202 | - h2 && (t2[o2] = n2 ? parseFloat(h2) : parseInt(h2, 10)); | |
| 203 | - }, r2 = (o2, l2 = o2) => { | |
| 204 | - let n2 = e3.dataset[l2]; | |
| 205 | - n2 && (t2[o2] = /^\d+(\.\d+)?$/.test(n2.trim()) ? parseFloat(n2) : n2); | |
| 206 | - }, a2 = (o2, l2 = o2) => { | |
| 207 | - let n2 = e3.dataset[l2]; | |
| 208 | - if (n2) try { | |
| 209 | - t2[o2] = JSON.parse(n2); | |
| 210 | - } catch (h2) { | |
| 211 | - console.warn(`[WaveformPlayer] Invalid ${l2} JSON:`, h2); | |
| 212 | - } | |
| 214 | +function D(e2, t = {}) { | |
| 215 | + let { min: i = -1 / 0, max: s = 1 / 0, fallback: r = null } = t, a = H2(e2); | |
| 216 | + if (!a && typeof e2 == "string" && e2.trim() !== "" && (a = e2.split(/[,\s]+/)), !a) return r; | |
| 217 | + let o = a.map((n) => _(n)).filter((n) => n !== null && n >= i && n <= s); | |
| 218 | + return o.length ? o : r; | |
| 219 | +} | |
| 220 | +function rt(e2, t, i = null) { | |
| 221 | + return t.includes(e2) ? e2 : i; | |
| 222 | +} | |
| 223 | +function at(e2) { | |
| 224 | + if (typeof e2 == "string") { | |
| 225 | + let t = e2.trim().toLowerCase(); | |
| 226 | + return t !== "" && t !== "false" && t !== "0"; | |
| 227 | + } | |
| 228 | + return !!e2; | |
| 229 | +} | |
| 230 | +function vt(e2) { | |
| 231 | + return e2 === void 0 ? void 0 : e2 === "true"; | |
| 232 | +} | |
| 233 | +function it(e2) { | |
| 234 | + if (typeof e2 == "string" && e2.trim().startsWith("[")) try { | |
| 235 | + return JSON.parse(e2); | |
| 236 | + } catch { | |
| 237 | + } | |
| 238 | + return e2; | |
| 239 | +} | |
| 240 | +function O(e2) { | |
| 241 | + let t = {}, i = (o, n = o) => { | |
| 242 | + let l2 = vt(e2.dataset[n]); | |
| 243 | + l2 !== void 0 && (t[o] = l2); | |
| 244 | + }, s = (o, n = o, l2 = false) => { | |
| 245 | + let h = e2.dataset[n]; | |
| 246 | + h && (t[o] = l2 ? parseFloat(h) : parseInt(h, 10)); | |
| 247 | + }, r = (o, n = o) => { | |
| 248 | + let l2 = e2.dataset[n]; | |
| 249 | + l2 && (t[o] = /^\d+(\.\d+)?$/.test(l2.trim()) ? parseFloat(l2) : l2); | |
| 250 | + }, a = (o, n = o) => { | |
| 251 | + let l2 = e2.dataset[n]; | |
| 252 | + if (!l2) return; | |
| 253 | + let h = H2(l2); | |
| 254 | + h ? t[o] = h : console.warn(`[WaveformPlayer] Invalid ${n} attribute, expected a JSON array:`, l2); | |
| 213 | 255 | }; |
| 214 | - if (e3.dataset.src && (t2.url = e3.dataset.src), e3.dataset.url && (t2.url = e3.dataset.url), s2("height"), s2("samples"), e3.dataset.preload && (t2.preload = e3.dataset.preload), e3.dataset.crossOrigin && (t2.crossOrigin = e3.dataset.crossOrigin), e3.dataset.audioMode && (t2.audioMode = e3.dataset.audioMode), e3.dataset.style && (t2.waveformStyle = e3.dataset.style), e3.dataset.waveformStyle && (t2.waveformStyle = e3.dataset.waveformStyle), e3.dataset.waveformGradient && (t2.waveformGradient = e3.dataset.waveformGradient), s2("barWidth"), s2("barSpacing"), s2("barRadius"), ["auto", "top", "center", "bottom"].includes(e3.dataset.buttonAlign) && (t2.buttonAlign = e3.dataset.buttonAlign), e3.dataset.layout && (t2.layout = e3.dataset.layout), e3.dataset.buttonStyle && (t2.buttonStyle = e3.dataset.buttonStyle), r2("buttonSize"), r2("buttonRadius"), e3.dataset.colorPreset && (t2.colorPreset = e3.dataset.colorPreset), e3.dataset.waveformColor && (t2.waveformColor = q(e3.dataset.waveformColor)), e3.dataset.progressColor && (t2.progressColor = q(e3.dataset.progressColor)), e3.dataset.color && (t2.waveformColor = e3.dataset.color), e3.dataset.theme && (t2.colorPreset = e3.dataset.theme), i2("autoplay"), i2("showControls"), i2("showInfo"), i2("showTime"), i2("showHoverTime"), i2("seekHandle"), i2("showBPM", "showBpm"), s2("bpm"), i2("singlePlay"), i2("playOnSeek"), e3.dataset.title && (t2.title = e3.dataset.title), e3.dataset.artist && (t2.artist = e3.dataset.artist), e3.dataset.album && (t2.album = e3.dataset.album), e3.dataset.artwork && (t2.artwork = e3.dataset.artwork), e3.dataset.artworkPosition && (t2.artworkPosition = e3.dataset.artworkPosition), e3.dataset.waveform && (t2.waveform = e3.dataset.waveform), a2("markers"), s2("playbackRate", "playbackRate", true), i2("showPlaybackSpeed"), e3.dataset.playbackRates) try { | |
| 215 | - let o2 = JSON.parse(e3.dataset.playbackRates); | |
| 216 | - Array.isArray(o2) && o2.length > 0 && o2.every((l2) => typeof l2 == "number" && Number.isFinite(l2) && l2 > 0) && (t2.playbackRates = o2); | |
| 217 | - } catch (o2) { | |
| 218 | - console.warn("[WaveformPlayer] Invalid playbackRates JSON:", o2); | |
| 256 | + if (e2.dataset.src && (t.url = e2.dataset.src), e2.dataset.url && (t.url = e2.dataset.url), s("height"), s("samples"), e2.dataset.preload && (t.preload = e2.dataset.preload), e2.dataset.crossOrigin && (t.crossOrigin = e2.dataset.crossOrigin), e2.dataset.audioMode && (t.audioMode = e2.dataset.audioMode), e2.dataset.style && (t.waveformStyle = e2.dataset.style), e2.dataset.waveformStyle && (t.waveformStyle = e2.dataset.waveformStyle), e2.dataset.waveformGradient && (t.waveformGradient = e2.dataset.waveformGradient), s("barWidth"), s("barSpacing"), s("barRadius"), e2.dataset.buttonAlign && (t.buttonAlign = e2.dataset.buttonAlign), e2.dataset.layout && (t.layout = e2.dataset.layout), e2.dataset.buttonStyle && (t.buttonStyle = e2.dataset.buttonStyle), r("buttonSize"), r("buttonRadius"), e2.dataset.colorPreset && (t.colorPreset = e2.dataset.colorPreset), e2.dataset.waveformColor && (t.waveformColor = it(e2.dataset.waveformColor)), e2.dataset.progressColor && (t.progressColor = it(e2.dataset.progressColor)), e2.dataset.color && (t.waveformColor = e2.dataset.color), e2.dataset.theme && (t.colorPreset = e2.dataset.theme), i("autoplay"), i("showControls"), i("showInfo"), i("showTime"), i("showHoverTime"), i("seekHandle"), i("showBPM", "showBpm"), s("bpm"), i("singlePlay"), i("playOnSeek"), e2.dataset.title && (t.title = e2.dataset.title), e2.dataset.artist && (t.artist = e2.dataset.artist), e2.dataset.album && (t.album = e2.dataset.album), e2.dataset.artwork && (t.artwork = e2.dataset.artwork), e2.dataset.artworkPosition && (t.artworkPosition = e2.dataset.artworkPosition), e2.dataset.waveform && (t.waveform = e2.dataset.waveform), a("markers"), s("playbackRate", "playbackRate", true), i("showPlaybackSpeed"), e2.dataset.playbackRates) { | |
| 257 | + let o = D(e2.dataset.playbackRates); | |
| 258 | + o ? t.playbackRates = o : console.warn("[WaveformPlayer] Invalid playbackRates attribute:", e2.dataset.playbackRates); | |
| 219 | 259 | } |
| 220 | - return i2("enableMediaSession"), i2("showMarkers"), i2("accessibleSeek"), e3.dataset.seekLabel && (t2.seekLabel = e3.dataset.seekLabel), e3.dataset.seekValueText && (t2.seekValueText = e3.dataset.seekValueText), e3.dataset.errorText && (t2.errorText = e3.dataset.errorText), e3.dataset.playPauseLabel && (t2.playPauseLabel = e3.dataset.playPauseLabel), e3.dataset.speedLabel && (t2.speedLabel = e3.dataset.speedLabel), e3.dataset.artworkAlt && (t2.artworkAlt = e3.dataset.artworkAlt), e3.dataset.unknownTrackText && (t2.unknownTrackText = e3.dataset.unknownTrackText), t2; | |
| 260 | + return i("enableMediaSession"), i("showMarkers"), i("accessibleSeek"), e2.dataset.seekLabel && (t.seekLabel = e2.dataset.seekLabel), e2.dataset.seekValueText && (t.seekValueText = e2.dataset.seekValueText), e2.dataset.errorText && (t.errorText = e2.dataset.errorText), e2.dataset.playPauseLabel && (t.playPauseLabel = e2.dataset.playPauseLabel), e2.dataset.speedLabel && (t.speedLabel = e2.dataset.speedLabel), e2.dataset.artworkAlt && (t.artworkAlt = e2.dataset.artworkAlt), e2.dataset.unknownTrackText && (t.unknownTrackText = e2.dataset.unknownTrackText), t; | |
| 221 | 261 | } |
| 222 | -function U(e3, ...t2) { | |
| 223 | - let i2 = 0; | |
| 224 | - return e3.replace(/%(?:(\d+)\$)?s/g, (s2, r2) => { | |
| 225 | - let a2 = r2 ? Number(r2) - 1 : i2++; | |
| 226 | - return t2[a2] ?? s2; | |
| 262 | +function ot(e2, ...t) { | |
| 263 | + let i = 0; | |
| 264 | + return e2.replace(/%(?:(\d+)\$)?s/g, (s, r) => { | |
| 265 | + let a = r ? Number(r) - 1 : i++; | |
| 266 | + return t[a] ?? s; | |
| 227 | 267 | }); |
| 228 | 268 | } |
| 229 | -function E(e3) { | |
| 230 | - if (!e3 || isNaN(e3) || e3 < 0) return "0:00"; | |
| 231 | - let t2 = Math.floor(e3 / 3600), i2 = Math.floor(e3 % 3600 / 60), s2 = Math.floor(e3 % 60); | |
| 232 | - return t2 > 0 ? `${t2}:${i2.toString().padStart(2, "0")}:${s2.toString().padStart(2, "0")}` : `${i2}:${s2.toString().padStart(2, "0")}`; | |
| 269 | +function E2(e2) { | |
| 270 | + let t = Number(e2); | |
| 271 | + if (!t || !Number.isFinite(t) || t < 0) return "0:00"; | |
| 272 | + let i = Math.floor(t / 3600), s = Math.floor(t % 3600 / 60), r = Math.floor(t % 60); | |
| 273 | + return i > 0 ? `${i}:${s.toString().padStart(2, "0")}:${r.toString().padStart(2, "0")}` : `${s}:${r.toString().padStart(2, "0")}`; | |
| 233 | 274 | } |
| 234 | -var nt = 0; | |
| 235 | -function V(e3) { | |
| 236 | - let t2 = e3 || "audio", i2 = 5381; | |
| 237 | - for (let s2 = 0; s2 < t2.length; s2++) i2 = (i2 << 5) + i2 + t2.charCodeAt(s2) | 0; | |
| 238 | - return `wp_${(i2 >>> 0).toString(36)}_${(nt++).toString(36)}`; | |
| 275 | +var St = 0; | |
| 276 | +function nt(e2) { | |
| 277 | + let t = e2 || "audio", i = 5381; | |
| 278 | + for (let s = 0; s < t.length; s++) i = (i << 5) + i + t.charCodeAt(s) | 0; | |
| 279 | + return `wp_${(i >>> 0).toString(36)}_${(St++).toString(36)}`; | |
| 239 | 280 | } |
| 240 | -function R(e3) { | |
| 241 | - if (!e3) return "Audio"; | |
| 242 | - let t2 = e3.split("/"); | |
| 243 | - return t2[t2.length - 1].split(".")[0].replace(/[-_]/g, " ").replace(/\b\w/g, (r2) => r2.toUpperCase()); | |
| 281 | +function I(e2) { | |
| 282 | + if (!e2) return "Audio"; | |
| 283 | + let t = e2.split("/"); | |
| 284 | + return t[t.length - 1].split(".")[0].replace(/[-_]/g, " ").replace(/\b\w/g, (r) => r.toUpperCase()); | |
| 244 | 285 | } |
| 245 | -function j2(e3) { | |
| 246 | - let t2 = typeof e3 == "string" ? e3.match(/\d+/g) : null; | |
| 247 | - if (!t2 || t2.length < 3) return null; | |
| 248 | - let [i2, s2, r2] = t2.map(Number); | |
| 249 | - return (i2 * 299 + s2 * 587 + r2 * 114) / 1e3; | |
| 286 | +function U(e2) { | |
| 287 | + if (typeof e2 != "string") return null; | |
| 288 | + let t = e2.match(/rgba?\(\s*([\d.]+)\s*[,\s]\s*([\d.]+)\s*[,\s]\s*([\d.]+)\s*(?:[,/]\s*([\d.]+)(%?))?/i); | |
| 289 | + if (!t) return null; | |
| 290 | + let i = Number(t[1]), s = Number(t[2]), r = Number(t[3]); | |
| 291 | + if (!Number.isFinite(i) || !Number.isFinite(s) || !Number.isFinite(r)) return null; | |
| 292 | + let a = t[4] === void 0 ? 1 : Number(t[4]); | |
| 293 | + return Number.isFinite(a) ? (t[5] === "%" && (a /= 100), { r: i, g: s, b: r, a: m2(a, 0, 1) }) : null; | |
| 250 | 294 | } |
| 251 | -function O(...e3) { | |
| 252 | - let t2 = {}; | |
| 253 | - for (let i2 of e3) for (let s2 in i2) i2[s2] !== null && i2[s2] !== void 0 && (t2[s2] = i2[s2]); | |
| 254 | - return t2; | |
| 295 | +function lt(e2) { | |
| 296 | + let t = U(e2); | |
| 297 | + return !t || t.a <= 0 ? null : (t.r * 299 + t.g * 587 + t.b * 114) / 1e3; | |
| 255 | 298 | } |
| 256 | -function G(e3, t2) { | |
| 257 | - let i2; | |
| 258 | - return function(...r2) { | |
| 259 | - let a2 = () => { | |
| 260 | - clearTimeout(i2), e3(...r2); | |
| 299 | +function j2(...e2) { | |
| 300 | + let t = {}; | |
| 301 | + for (let i of e2) for (let s in i) i[s] !== null && i[s] !== void 0 && (t[s] = i[s]); | |
| 302 | + return t; | |
| 303 | +} | |
| 304 | +function ht(e2, t) { | |
| 305 | + let i; | |
| 306 | + return function(...r) { | |
| 307 | + let a = () => { | |
| 308 | + clearTimeout(i), e2(...r); | |
| 261 | 309 | }; |
| 262 | - clearTimeout(i2), i2 = setTimeout(a2, t2); | |
| 310 | + clearTimeout(i), i = setTimeout(a, t); | |
| 263 | 311 | }; |
| 264 | 312 | } |
| 265 | -function x2(e3, t2) { | |
| 266 | - if (e3.length === t2) return e3; | |
| 267 | - if (e3.length === 0 || t2 === 0) return []; | |
| 268 | - let i2 = []; | |
| 269 | - if (t2 > e3.length) { | |
| 270 | - let s2 = (e3.length - 1) / (t2 - 1); | |
| 271 | - for (let r2 = 0; r2 < t2; r2++) { | |
| 272 | - let a2 = r2 * s2, o2 = Math.floor(a2), l2 = Math.ceil(a2), n2 = a2 - o2; | |
| 273 | - if (l2 >= e3.length) i2.push(e3[e3.length - 1]); | |
| 274 | - else if (o2 === l2) i2.push(e3[o2]); | |
| 313 | +function B(e2, t) { | |
| 314 | + if (e2.length === t) return e2; | |
| 315 | + if (e2.length === 0 || t === 0) return []; | |
| 316 | + let i = []; | |
| 317 | + if (t > e2.length) { | |
| 318 | + let s = (e2.length - 1) / (t - 1); | |
| 319 | + for (let r = 0; r < t; r++) { | |
| 320 | + let a = r * s, o = Math.floor(a), n = Math.ceil(a), l2 = a - o; | |
| 321 | + if (n >= e2.length) i.push(e2[e2.length - 1]); | |
| 322 | + else if (o === n) i.push(e2[o]); | |
| 275 | 323 | else { |
| 276 | - let h2 = e3[o2] * (1 - n2) + e3[l2] * n2; | |
| 277 | - i2.push(h2); | |
| 324 | + let h = e2[o] * (1 - l2) + e2[n] * l2; | |
| 325 | + i.push(h); | |
| 278 | 326 | } |
| 279 | 327 | } |
| 280 | 328 | } else { |
| 281 | - let s2 = e3.length / t2; | |
| 282 | - for (let r2 = 0; r2 < t2; r2++) { | |
| 283 | - let a2 = Math.floor(r2 * s2), o2 = Math.floor((r2 + 1) * s2), l2 = 0, n2 = 0; | |
| 284 | - for (let h2 = a2; h2 <= o2 && h2 < e3.length; h2++) e3[h2] > l2 && (l2 = e3[h2]), n2++; | |
| 285 | - if (n2 === 0) { | |
| 286 | - let h2 = Math.min(Math.round(r2 * s2), e3.length - 1); | |
| 287 | - l2 = e3[h2]; | |
| 329 | + let s = e2.length / t; | |
| 330 | + for (let r = 0; r < t; r++) { | |
| 331 | + let a = Math.floor(r * s), o = Math.floor((r + 1) * s), n = 0, l2 = 0; | |
| 332 | + for (let h = a; h <= o && h < e2.length; h++) e2[h] > n && (n = e2[h]), l2++; | |
| 333 | + if (l2 === 0) { | |
| 334 | + let h = Math.min(Math.round(r * s), e2.length - 1); | |
| 335 | + n = e2[h]; | |
| 288 | 336 | } |
| 289 | - i2.push(l2); | |
| 337 | + i.push(n); | |
| 290 | 338 | } |
| 291 | 339 | } |
| 292 | - return i2; | |
| 340 | + return i; | |
| 293 | 341 | } |
| 294 | -function P(e3, t2, i2, s2) { | |
| 295 | - if (!Array.isArray(t2)) return t2; | |
| 296 | - if (t2.length < 2) return t2[0]; | |
| 297 | - let r2 = i2.width, a2 = i2.height, o2 = s2 && s2.waveformGradient, [l2, n2, h2, c2] = o2 === "horizontal" ? [0, 0, r2, 0] : o2 === "diagonal" ? [0, 0, r2, a2] : [0, 0, 0, a2]; | |
| 342 | +function P(e2, t, i, s) { | |
| 343 | + if (!Array.isArray(t)) return t; | |
| 344 | + if (t.length < 2) return t[0]; | |
| 345 | + let r = i.width, a = i.height, o = s && s.waveformGradient, [n, l2, h, c2] = o === "horizontal" ? [0, 0, r, 0] : o === "diagonal" ? [0, 0, r, a] : [0, 0, 0, a]; | |
| 298 | 346 | try { |
| 299 | - let u2 = e3.createLinearGradient(l2, n2, h2, c2); | |
| 300 | - return t2.forEach((w2, g2) => u2.addColorStop(g2 / (t2.length - 1), w2)), u2; | |
| 347 | + let d = e2.createLinearGradient(n, l2, h, c2); | |
| 348 | + return t.forEach((b, y2) => d.addColorStop(y2 / (t.length - 1), b)), d; | |
| 301 | 349 | } catch { |
| 302 | - return t2[0]; | |
| 350 | + return t[0]; | |
| 303 | 351 | } |
| 304 | 352 | } |
| 305 | -function _(e3, t2, i2, s2, r2, a2) { | |
| 306 | - if ((Array.isArray(a2) ? a2.some((l2) => l2 > 0) : a2 > 0) && typeof e3.roundRect == "function") { | |
| 307 | - let l2 = Math.min(s2 / 2, Math.abs(r2) / 2), n2 = (h2) => m2(h2, 0, l2); | |
| 308 | - e3.beginPath(), e3.roundRect(t2, i2, s2, r2, Array.isArray(a2) ? a2.map(n2) : n2(a2)), e3.fill(); | |
| 309 | - } else e3.fillRect(t2, i2, s2, r2); | |
| 353 | +function x2(e2, t, i, s, r, a) { | |
| 354 | + if ((Array.isArray(a) ? a.some((n) => n > 0) : a > 0) && typeof e2.roundRect == "function") { | |
| 355 | + let n = Math.min(s / 2, Math.abs(r) / 2), l2 = (h) => m2(h, 0, n); | |
| 356 | + e2.beginPath(), e2.roundRect(t, i, s, r, Array.isArray(a) ? a.map(l2) : l2(a)), e2.fill(); | |
| 357 | + } else e2.fillRect(t, i, s, r); | |
| 310 | 358 | } |
| 311 | -function X(e3, t2) { | |
| 312 | - return (e3.barRadius || 0) * t2; | |
| 359 | +function pt(e2, t) { | |
| 360 | + return (e2.barRadius || 0) * t; | |
| 313 | 361 | } |
| 314 | -function lt(e3, t2) { | |
| 315 | - let i2 = X(e3, t2); | |
| 316 | - return [i2, i2, 0, 0]; | |
| 362 | +function Et(e2, t) { | |
| 363 | + let i = pt(e2, t); | |
| 364 | + return [i, i, 0, 0]; | |
| 317 | 365 | } |
| 318 | -function J(e3, t2, i2, s2, r2) { | |
| 319 | - let a2 = r2 / 2; | |
| 320 | - e3.beginPath(), e3.moveTo(t2, s2 - a2), e3.lineTo(i2 - a2, s2 - a2), e3.arc(i2 - a2, s2, a2, -Math.PI / 2, Math.PI / 2), e3.lineTo(t2, s2 + a2), e3.arc(t2, s2, a2, Math.PI / 2, -Math.PI / 2), e3.closePath(); | |
| 366 | +function ct(e2, t, i, s, r) { | |
| 367 | + let a = r / 2; | |
| 368 | + e2.beginPath(), e2.moveTo(t, s - a), e2.lineTo(i - a, s - a), e2.arc(i - a, s, a, -Math.PI / 2, Math.PI / 2), e2.lineTo(t, s + a), e2.arc(t, s, a, Math.PI / 2, -Math.PI / 2), e2.closePath(); | |
| 321 | 369 | } |
| 322 | -function F(e3, t2, i2, s2, r2) { | |
| 323 | - let a2 = window.devicePixelRatio || 1, o2 = r2.barWidth * a2, l2 = r2.barSpacing * a2, n2 = Math.floor(t2.width / (o2 + l2)), h2 = x2(i2, n2), c2 = t2.height, u2 = s2 * t2.width, w2 = lt(r2, a2), g2 = P(e3, r2.color, t2, r2), k = P(e3, r2.progressColor, t2, r2); | |
| 324 | - e3.clearRect(0, 0, t2.width, t2.height), e3.fillStyle = g2; | |
| 325 | - for (let f2 = 0; f2 < h2.length; f2++) { | |
| 326 | - let p2 = f2 * (o2 + l2); | |
| 327 | - if (p2 + o2 > t2.width) break; | |
| 328 | - let y2 = h2[f2] * c2 * 0.9, d2 = c2 - y2; | |
| 329 | - _(e3, p2, d2, o2, y2, w2); | |
| 370 | +function V(e2, t, i, s, r) { | |
| 371 | + let a = window.devicePixelRatio || 1, o = r.barWidth * a, n = r.barSpacing * a, l2 = Math.floor(t.width / (o + n)), h = B(i, l2), c2 = t.height, d = s * t.width, b = Et(r, a), y2 = P(e2, r.color, t, r), w2 = P(e2, r.progressColor, t, r); | |
| 372 | + e2.clearRect(0, 0, t.width, t.height), e2.fillStyle = y2; | |
| 373 | + for (let f = 0; f < h.length; f++) { | |
| 374 | + let p2 = f * (o + n); | |
| 375 | + if (p2 + o > t.width) break; | |
| 376 | + let g2 = h[f] * c2 * 0.9, u = c2 - g2; | |
| 377 | + x2(e2, p2, u, o, g2, b); | |
| 330 | 378 | } |
| 331 | - e3.save(), e3.beginPath(), e3.rect(0, 0, u2, c2), e3.clip(), e3.fillStyle = k; | |
| 332 | - for (let f2 = 0; f2 < h2.length; f2++) { | |
| 333 | - let p2 = f2 * (o2 + l2); | |
| 334 | - if (p2 > u2) break; | |
| 335 | - let y2 = h2[f2] * c2 * 0.9, d2 = c2 - y2; | |
| 336 | - _(e3, p2, d2, o2, y2, w2); | |
| 379 | + e2.save(), e2.beginPath(), e2.rect(0, 0, d, c2), e2.clip(), e2.fillStyle = w2; | |
| 380 | + for (let f = 0; f < h.length; f++) { | |
| 381 | + let p2 = f * (o + n); | |
| 382 | + if (p2 > d) break; | |
| 383 | + let g2 = h[f] * c2 * 0.9, u = c2 - g2; | |
| 384 | + x2(e2, p2, u, o, g2, b); | |
| 337 | 385 | } |
| 338 | - e3.restore(); | |
| 386 | + e2.restore(); | |
| 339 | 387 | } |
| 340 | -function ht(e3, t2, i2, s2, r2) { | |
| 341 | - let a2 = window.devicePixelRatio || 1, o2 = r2.barWidth * a2, l2 = r2.barSpacing * a2, n2 = Math.floor(t2.width / (o2 + l2)), h2 = x2(i2, n2), c2 = t2.height, u2 = c2 / 2, w2 = s2 * t2.width, g2 = X(r2, a2), k = [g2, g2, 0, 0], f2 = [0, 0, g2, g2], p2 = P(e3, r2.color, t2, r2), y2 = P(e3, r2.progressColor, t2, r2); | |
| 342 | - e3.clearRect(0, 0, t2.width, t2.height), e3.fillStyle = p2; | |
| 343 | - for (let d2 = 0; d2 < h2.length; d2++) { | |
| 344 | - let b2 = d2 * (o2 + l2); | |
| 345 | - if (b2 + o2 > t2.width) break; | |
| 346 | - let v2 = h2[d2] * c2 * 0.45; | |
| 347 | - _(e3, b2, u2 - v2, o2, v2, k), _(e3, b2, u2, o2, v2, f2); | |
| 388 | +function Pt(e2, t, i, s, r) { | |
| 389 | + let a = window.devicePixelRatio || 1, o = r.barWidth * a, n = r.barSpacing * a, l2 = Math.floor(t.width / (o + n)), h = B(i, l2), c2 = t.height, d = c2 / 2, b = s * t.width, y2 = pt(r, a), w2 = [y2, y2, 0, 0], f = [0, 0, y2, y2], p2 = P(e2, r.color, t, r), g2 = P(e2, r.progressColor, t, r); | |
| 390 | + e2.clearRect(0, 0, t.width, t.height), e2.fillStyle = p2; | |
| 391 | + for (let u = 0; u < h.length; u++) { | |
| 392 | + let k2 = u * (o + n); | |
| 393 | + if (k2 + o > t.width) break; | |
| 394 | + let v2 = h[u] * c2 * 0.45; | |
| 395 | + x2(e2, k2, d - v2, o, v2, w2), x2(e2, k2, d, o, v2, f); | |
| 348 | 396 | } |
| 349 | - e3.save(), e3.beginPath(), e3.rect(0, 0, w2, c2), e3.clip(), e3.fillStyle = y2; | |
| 350 | - for (let d2 = 0; d2 < h2.length; d2++) { | |
| 351 | - let b2 = d2 * (o2 + l2); | |
| 352 | - if (b2 > w2) break; | |
| 353 | - let v2 = h2[d2] * c2 * 0.45; | |
| 354 | - _(e3, b2, u2 - v2, o2, v2, k), _(e3, b2, u2, o2, v2, f2); | |
| 397 | + e2.save(), e2.beginPath(), e2.rect(0, 0, b, c2), e2.clip(), e2.fillStyle = g2; | |
| 398 | + for (let u = 0; u < h.length; u++) { | |
| 399 | + let k2 = u * (o + n); | |
| 400 | + if (k2 > b) break; | |
| 401 | + let v2 = h[u] * c2 * 0.45; | |
| 402 | + x2(e2, k2, d - v2, o, v2, w2), x2(e2, k2, d, o, v2, f); | |
| 355 | 403 | } |
| 356 | - e3.restore(); | |
| 404 | + e2.restore(); | |
| 357 | 405 | } |
| 358 | -function ct(e3, t2, i2, s2, r2) { | |
| 359 | - let a2 = t2.width, o2 = t2.height, l2 = o2 / 2, n2 = o2 * 0.35; | |
| 360 | - e3.clearRect(0, 0, a2, o2); | |
| 361 | - let h2 = (c2, u2, w2 = 1, g2 = false) => { | |
| 362 | - let k = P(e3, c2, t2, r2), f2 = Array.isArray(c2) ? c2[c2.length - 1] : c2; | |
| 363 | - g2 && (e3.shadowBlur = 12, e3.shadowColor = f2), e3.strokeStyle = k, e3.lineWidth = u2, e3.lineCap = "round", e3.lineJoin = "round", e3.beginPath(), e3.moveTo(0, l2); | |
| 364 | - let p2 = [], y2 = Math.floor(i2.length * w2); | |
| 365 | - for (let d2 = 0; d2 < y2; d2++) { | |
| 366 | - let b2 = d2 / (i2.length - 1) * a2, v2 = i2[d2], T = Math.sin(d2 * 0.1) * v2, C = l2 + T * n2; | |
| 367 | - p2.push({ x: b2, y: C }); | |
| 406 | +function Tt(e2, t, i, s, r) { | |
| 407 | + let a = t.width, o = t.height, n = o / 2, l2 = o * 0.35; | |
| 408 | + e2.clearRect(0, 0, a, o); | |
| 409 | + let h = (c2, d, b = 1, y2 = false) => { | |
| 410 | + let w2 = P(e2, c2, t, r), f = Array.isArray(c2) ? c2[c2.length - 1] : c2; | |
| 411 | + y2 && (e2.shadowBlur = 12, e2.shadowColor = f), e2.strokeStyle = w2, e2.lineWidth = d, e2.lineCap = "round", e2.lineJoin = "round", e2.beginPath(), e2.moveTo(0, n); | |
| 412 | + let p2 = [], g2 = Math.floor(i.length * b); | |
| 413 | + for (let u = 0; u < g2; u++) { | |
| 414 | + let k2 = u / (i.length - 1) * a, v2 = i[u], A2 = Math.sin(u * 0.1) * v2, L = n + A2 * l2; | |
| 415 | + p2.push({ x: k2, y: L }); | |
| 368 | 416 | } |
| 369 | - for (let d2 = 0; d2 < p2.length - 1; d2++) { | |
| 370 | - let b2 = p2[d2].x + (p2[d2 + 1].x - p2[d2].x) * 0.5, v2 = p2[d2].y, T = p2[d2 + 1].x - (p2[d2 + 1].x - p2[d2].x) * 0.5, C = p2[d2 + 1].y; | |
| 371 | - e3.bezierCurveTo(b2, v2, T, C, p2[d2 + 1].x, p2[d2 + 1].y); | |
| 417 | + for (let u = 0; u < p2.length - 1; u++) { | |
| 418 | + let k2 = p2[u].x + (p2[u + 1].x - p2[u].x) * 0.5, v2 = p2[u].y, A2 = p2[u + 1].x - (p2[u + 1].x - p2[u].x) * 0.5, L = p2[u + 1].y; | |
| 419 | + e2.bezierCurveTo(k2, v2, A2, L, p2[u + 1].x, p2[u + 1].y); | |
| 372 | 420 | } |
| 373 | - e3.stroke(), g2 && (e3.shadowBlur = 0); | |
| 421 | + e2.stroke(), y2 && (e2.shadowBlur = 0); | |
| 374 | 422 | }; |
| 375 | - e3.strokeStyle = "rgba(255, 255, 255, 0.03)", e3.lineWidth = 0.5, e3.beginPath(), e3.moveTo(0, l2), e3.lineTo(a2, l2), e3.stroke(); | |
| 423 | + e2.strokeStyle = "rgba(255, 255, 255, 0.03)", e2.lineWidth = 0.5, e2.beginPath(), e2.moveTo(0, n), e2.lineTo(a, n), e2.stroke(); | |
| 376 | 424 | for (let c2 = 0; c2 <= 10; c2++) { |
| 377 | - let u2 = a2 / 10 * c2; | |
| 378 | - e3.beginPath(), e3.moveTo(u2, 0), e3.lineTo(u2, o2), e3.stroke(); | |
| 425 | + let d = a / 10 * c2; | |
| 426 | + e2.beginPath(), e2.moveTo(d, 0), e2.lineTo(d, o), e2.stroke(); | |
| 379 | 427 | } |
| 380 | - h2(r2.color, 2, 1, false), s2 > 0 && h2(r2.progressColor, 3, s2, true); | |
| 428 | + h(r.color, 2, 1, false), s > 0 && h(r.progressColor, 3, s, true); | |
| 381 | 429 | } |
| 382 | -function K(e3, t2, i2, s2, r2) { | |
| 383 | - let a2 = window.devicePixelRatio || 1, o2 = (r2.barWidth || 3) * a2, l2 = (r2.barSpacing || 1) * a2, n2 = Math.floor(t2.width / (o2 + l2)), h2 = x2(i2, n2), c2 = t2.height, u2 = 4 * a2, w2 = 2 * a2, g2 = s2 * t2.width, k = c2 / 2, f2 = P(e3, r2.color, t2, r2), p2 = P(e3, r2.progressColor, t2, r2); | |
| 384 | - e3.clearRect(0, 0, t2.width, t2.height); | |
| 385 | - for (let y2 = 0; y2 < h2.length; y2++) { | |
| 386 | - let d2 = y2 * (o2 + l2); | |
| 387 | - if (d2 + o2 > t2.width) break; | |
| 388 | - let b2 = h2[y2] * c2 * 0.9, v2 = Math.floor(b2 / (u2 + w2)); | |
| 389 | - e3.fillStyle = d2 < g2 ? p2 : f2; | |
| 390 | - for (let T = 0; T < v2; T++) { | |
| 391 | - let C = T * (u2 + w2); | |
| 392 | - e3.fillRect(d2, k - C - u2, o2, u2), T > 0 && e3.fillRect(d2, k + C, o2, u2); | |
| 430 | +function ut(e2, t, i, s, r) { | |
| 431 | + let a = window.devicePixelRatio || 1, o = (r.barWidth || 3) * a, n = (r.barSpacing || 1) * a, l2 = Math.floor(t.width / (o + n)), h = B(i, l2), c2 = t.height, d = 4 * a, b = 2 * a, y2 = s * t.width, w2 = c2 / 2, f = P(e2, r.color, t, r), p2 = P(e2, r.progressColor, t, r); | |
| 432 | + e2.clearRect(0, 0, t.width, t.height); | |
| 433 | + for (let g2 = 0; g2 < h.length; g2++) { | |
| 434 | + let u = g2 * (o + n); | |
| 435 | + if (u + o > t.width) break; | |
| 436 | + let k2 = h[g2] * c2 * 0.9, v2 = Math.floor(k2 / (d + b)); | |
| 437 | + e2.fillStyle = u < y2 ? p2 : f; | |
| 438 | + for (let A2 = 0; A2 < v2; A2++) { | |
| 439 | + let L = A2 * (d + b); | |
| 440 | + e2.fillRect(u, w2 - L - d, o, d), A2 > 0 && e2.fillRect(u, w2 + L, o, d); | |
| 393 | 441 | } |
| 394 | 442 | } |
| 395 | 443 | } |
| 396 | -function Y(e3, t2, i2, s2, r2) { | |
| 397 | - let a2 = window.devicePixelRatio || 1, o2 = (r2.barWidth || 2) * a2, l2 = (r2.barSpacing || 3) * a2, n2 = Math.floor(t2.width / (o2 + l2)), h2 = x2(i2, n2), c2 = t2.height, u2 = Math.max(1.5 * a2, o2 / 2), w2 = s2 * t2.width, g2 = c2 / 2, k = P(e3, r2.color, t2, r2), f2 = P(e3, r2.progressColor, t2, r2); | |
| 398 | - e3.clearRect(0, 0, t2.width, t2.height); | |
| 399 | - for (let p2 = 0; p2 < h2.length; p2++) { | |
| 400 | - let y2 = p2 * (o2 + l2) + o2 / 2; | |
| 401 | - if (y2 > t2.width) break; | |
| 402 | - let d2 = h2[p2] * c2 * 0.9; | |
| 403 | - e3.fillStyle = y2 < w2 ? f2 : k, e3.beginPath(), e3.arc(y2, g2 - d2 / 2, u2, 0, Math.PI * 2), e3.fill(), e3.beginPath(), e3.arc(y2, g2 + d2 / 2, u2, 0, Math.PI * 2), e3.fill(); | |
| 444 | +function dt(e2, t, i, s, r) { | |
| 445 | + let a = window.devicePixelRatio || 1, o = (r.barWidth || 2) * a, n = (r.barSpacing || 3) * a, l2 = Math.floor(t.width / (o + n)), h = B(i, l2), c2 = t.height, d = Math.max(1.5 * a, o / 2), b = s * t.width, y2 = c2 / 2, w2 = P(e2, r.color, t, r), f = P(e2, r.progressColor, t, r); | |
| 446 | + e2.clearRect(0, 0, t.width, t.height); | |
| 447 | + for (let p2 = 0; p2 < h.length; p2++) { | |
| 448 | + let g2 = p2 * (o + n) + o / 2; | |
| 449 | + if (g2 > t.width) break; | |
| 450 | + let u = h[p2] * c2 * 0.9; | |
| 451 | + e2.fillStyle = g2 < b ? f : w2, e2.beginPath(), e2.arc(g2, y2 - u / 2, d, 0, Math.PI * 2), e2.fill(), e2.beginPath(), e2.arc(g2, y2 + u / 2, d, 0, Math.PI * 2), e2.fill(); | |
| 404 | 452 | } |
| 405 | 453 | } |
| 406 | -function dt(e3, t2, i2, s2, r2) { | |
| 407 | - let a2 = t2.width, o2 = t2.height, l2 = o2 / 2, n2 = 4, h2 = n2 / 2, c2 = !!r2.seekActive; | |
| 408 | - if (e3.clearRect(0, 0, a2, o2), e3.fillStyle = P(e3, r2.color, t2, r2) || "rgba(255, 255, 255, 0.2)", J(e3, h2, a2, l2, n2), e3.fill(), s2 > 0) { | |
| 409 | - let u2 = Math.max(h2 * 2, s2 * a2); | |
| 410 | - e3.save(), e3.globalAlpha = r2.seekHandle && !c2 ? 0.7 : 1, e3.fillStyle = P(e3, r2.progressColor, t2, r2) || "rgba(255, 255, 255, 0.9)", J(e3, h2, u2, l2, n2), e3.fill(), e3.restore(); | |
| 454 | +function At(e2, t, i, s, r) { | |
| 455 | + let a = t.width, o = t.height, n = o / 2, l2 = 4, h = l2 / 2, c2 = !!r.seekActive; | |
| 456 | + if (e2.clearRect(0, 0, a, o), e2.fillStyle = P(e2, r.color, t, r) || "rgba(255, 255, 255, 0.2)", ct(e2, h, a, n, l2), e2.fill(), s > 0) { | |
| 457 | + let d = Math.max(h * 2, s * a); | |
| 458 | + e2.save(), e2.globalAlpha = r.seekHandle && !c2 ? 0.7 : 1, e2.fillStyle = P(e2, r.progressColor, t, r) || "rgba(255, 255, 255, 0.9)", ct(e2, h, d, n, l2), e2.fill(), e2.restore(); | |
| 411 | 459 | } |
| 412 | 460 | } |
| 413 | -var ut = { bars: F, bar: F, mirror: ht, line: ct, blocks: K, block: K, dots: Y, dot: Y, seekbar: dt }; | |
| 414 | -function Q(e3, t2, i2, s2, r2) { | |
| 415 | - (ut[r2.waveformStyle] || F)(e3, t2, i2, s2, r2); | |
| 461 | +var Mt = { bars: V, bar: V, mirror: Pt, line: Tt, blocks: ut, block: ut, dots: dt, dot: dt, seekbar: At }; | |
| 462 | +function ft(e2, t, i, s, r) { | |
| 463 | + (Mt[r.waveformStyle] || V)(e2, t, i, s, r); | |
| 416 | 464 | } |
| 417 | -function Z(e3) { | |
| 465 | +function mt(e2) { | |
| 418 | 466 | try { |
| 419 | - let t2 = e3.getChannelData(0), i2 = e3.sampleRate, s2 = pt(t2, i2); | |
| 420 | - if (s2.length < 2) return 120; | |
| 421 | - let r2 = []; | |
| 422 | - for (let n2 = 1; n2 < s2.length; n2++) r2.push((s2[n2] - s2[n2 - 1]) / i2); | |
| 423 | - let a2 = {}; | |
| 424 | - r2.forEach((n2) => { | |
| 425 | - let h2 = 60 / n2, c2 = Math.round(h2 / 3) * 3; | |
| 426 | - c2 > 60 && c2 < 200 && (a2[c2] = (a2[c2] || 0) + 1); | |
| 467 | + let t = e2.getChannelData(0), i = e2.sampleRate, s = Ct(t, i); | |
| 468 | + if (s.length < 2) return 120; | |
| 469 | + let r = []; | |
| 470 | + for (let l2 = 1; l2 < s.length; l2++) r.push((s[l2] - s[l2 - 1]) / i); | |
| 471 | + let a = {}; | |
| 472 | + r.forEach((l2) => { | |
| 473 | + let h = 60 / l2, c2 = Math.round(h / 3) * 3; | |
| 474 | + c2 > 60 && c2 < 200 && (a[c2] = (a[c2] || 0) + 1); | |
| 427 | 475 | }); |
| 428 | - let o2 = 0, l2 = 120; | |
| 429 | - for (let [n2, h2] of Object.entries(a2)) h2 > o2 && (o2 = h2, l2 = parseInt(n2)); | |
| 430 | - return l2 < 70 && a2[l2 * 2] ? l2 *= 2 : l2 > 160 && a2[Math.round(l2 / 2)] && (l2 = Math.round(l2 / 2)), l2 - 1; | |
| 431 | - } catch (t2) { | |
| 432 | - return console.warn("[WaveformPlayer] BPM detection failed:", t2), null; | |
| 476 | + let o = 0, n = 120; | |
| 477 | + for (let [l2, h] of Object.entries(a)) h > o && (o = h, n = parseInt(l2)); | |
| 478 | + return n < 70 && a[n * 2] ? n *= 2 : n > 160 && a[Math.round(n / 2)] && (n = Math.round(n / 2)), n - 1; | |
| 479 | + } catch (t) { | |
| 480 | + return console.warn("[WaveformPlayer] BPM detection failed:", t), null; | |
| 433 | 481 | } |
| 434 | 482 | } |
| 435 | -function pt(e3, t2) { | |
| 436 | - let r2 = [], a2 = 0; | |
| 437 | - for (let o2 = 0; o2 < e3.length - 2048; o2 += 1024) { | |
| 438 | - let l2 = 0; | |
| 439 | - for (let c2 = o2; c2 < o2 + 2048; c2++) l2 += e3[c2] * e3[c2]; | |
| 440 | - l2 = l2 / 2048; | |
| 441 | - let n2 = l2 - a2, h2 = a2 * 1.8 + 0.01; | |
| 442 | - if (n2 > h2 && l2 > 0.01) { | |
| 443 | - let c2 = r2[r2.length - 1] || 0, u2 = t2 * 0.15; | |
| 444 | - o2 - c2 > u2 && r2.push(o2); | |
| 483 | +function Ct(e2, t) { | |
| 484 | + let r = [], a = 0; | |
| 485 | + for (let o = 0; o < e2.length - 2048; o += 1024) { | |
| 486 | + let n = 0; | |
| 487 | + for (let c2 = o; c2 < o + 2048; c2++) n += e2[c2] * e2[c2]; | |
| 488 | + n = n / 2048; | |
| 489 | + let l2 = n - a, h = a * 1.8 + 0.01; | |
| 490 | + if (l2 > h && n > 0.01) { | |
| 491 | + let c2 = r[r.length - 1] || 0, d = t * 0.15; | |
| 492 | + o - c2 > d && r.push(o); | |
| 445 | 493 | } |
| 446 | - a2 = l2 * 0.8 + a2 * 0.2; | |
| 494 | + a = n * 0.8 + a * 0.2; | |
| 447 | 495 | } |
| 448 | - return r2; | |
| 496 | + return r; | |
| 449 | 497 | } |
| 450 | -function ft(e3, t2 = 1800) { | |
| 451 | - let i2 = e3.length / t2, s2 = e3.numberOfChannels, r2 = []; | |
| 452 | - for (let o2 = 0; o2 < s2; o2++) { | |
| 453 | - let l2 = e3.getChannelData(o2); | |
| 454 | - for (let n2 = 0; n2 < t2; n2++) { | |
| 455 | - let h2 = ~~(n2 * i2), c2 = ~~(h2 + i2), u2 = 0, w2 = 0; | |
| 456 | - for (let k = h2; k < c2; k++) { | |
| 457 | - let f2 = l2[k]; | |
| 458 | - f2 > w2 && (w2 = f2), f2 < u2 && (u2 = f2); | |
| 498 | +function Lt(e2, t = 1800) { | |
| 499 | + let i = e2.length / t, s = e2.numberOfChannels, r = []; | |
| 500 | + for (let o = 0; o < s; o++) { | |
| 501 | + let n = e2.getChannelData(o); | |
| 502 | + for (let l2 = 0; l2 < t; l2++) { | |
| 503 | + let h = ~~(l2 * i), c2 = ~~(h + i), d = 0, b = 0; | |
| 504 | + for (let w2 = h; w2 < c2; w2++) { | |
| 505 | + let f = n[w2]; | |
| 506 | + f > b && (b = f), f < d && (d = f); | |
| 459 | 507 | } |
| 460 | - let g2 = Math.max(Math.abs(w2), Math.abs(u2)); | |
| 461 | - (o2 === 0 || g2 > r2[n2]) && (r2[n2] = g2); | |
| 508 | + let y2 = Math.max(Math.abs(b), Math.abs(d)); | |
| 509 | + (o === 0 || y2 > r[l2]) && (r[l2] = y2); | |
| 462 | 510 | } |
| 463 | 511 | } |
| 464 | - let a2 = B(r2); | |
| 465 | - return a2 > 0 ? r2.map((o2) => o2 / a2) : r2; | |
| 512 | + let a = $2(r); | |
| 513 | + return a > 0 ? r.map((o) => o / a) : r; | |
| 466 | 514 | } |
| 467 | -async function $2(e3, t2 = 1800, i2 = false) { | |
| 468 | - let s2; | |
| 515 | +async function G(e2, t = 1800, i = false) { | |
| 516 | + let s; | |
| 469 | 517 | try { |
| 470 | - let r2 = window.AudioContext || window.webkitAudioContext; | |
| 471 | - s2 = new r2(); | |
| 472 | - let o2 = await (await fetch(e3)).arrayBuffer(), l2 = await s2.decodeAudioData(o2), n2 = ft(l2, t2); | |
| 473 | - n2 = mt(n2); | |
| 474 | - let h2 = null; | |
| 475 | - return i2 && (h2 = Z(l2)), { peaks: n2, bpm: h2 }; | |
| 518 | + let r = window.AudioContext || window.webkitAudioContext; | |
| 519 | + s = new r(); | |
| 520 | + let o = await (await fetch(e2)).arrayBuffer(), n = await s.decodeAudioData(o), l2 = Lt(n, t); | |
| 521 | + l2 = _t(l2); | |
| 522 | + let h = null; | |
| 523 | + return i && (h = mt(n)), { peaks: l2, bpm: h }; | |
| 476 | 524 | } finally { |
| 477 | - s2 && s2.close(); | |
| 525 | + s && s.close(); | |
| 478 | 526 | } |
| 479 | 527 | } |
| 480 | -function tt(e3 = 1800) { | |
| 481 | - let t2 = []; | |
| 482 | - for (let i2 = 0; i2 < e3; i2++) { | |
| 483 | - let s2 = Math.random() * 0.5 + 0.3, r2 = Math.sin(i2 / e3 * Math.PI * 4) * 0.2; | |
| 484 | - t2.push(m2(s2 + r2, 0.1, 1)); | |
| 528 | +function yt(e2 = 1800) { | |
| 529 | + let t = []; | |
| 530 | + for (let i = 0; i < e2; i++) { | |
| 531 | + let s = Math.random() * 0.5 + 0.3, r = Math.sin(i / e2 * Math.PI * 4) * 0.2; | |
| 532 | + t.push(m2(s + r, 0.1, 1)); | |
| 485 | 533 | } |
| 486 | - return t2; | |
| 534 | + return t; | |
| 487 | 535 | } |
| 488 | -function mt(e3, t2 = 0.95) { | |
| 489 | - let i2 = B(e3); | |
| 490 | - if (i2 === 0 || i2 > t2) return e3; | |
| 491 | - let s2 = t2 / i2; | |
| 492 | - return e3.map((r2) => r2 * s2); | |
| 536 | +function _t(e2, t = 0.95) { | |
| 537 | + let i = $2(e2); | |
| 538 | + if (i === 0 || i > t) return e2; | |
| 539 | + let s = t / i; | |
| 540 | + return e2.map((r) => r * s); | |
| 493 | 541 | } |
| 494 | -function et(e3) { | |
| 495 | - let t2 = document.documentElement, i2 = document.body; | |
| 496 | - return t2.classList.contains(e3) || t2.classList.contains(`${e3}-mode`) || t2.classList.contains(`theme-${e3}`) || t2.getAttribute("data-theme") === e3 || t2.getAttribute("data-color-scheme") === e3 || i2.classList.contains(e3) || i2.classList.contains(`${e3}-mode`) || i2.getAttribute("data-theme") === e3; | |
| 542 | +var K = 128; | |
| 543 | +function gt(e2) { | |
| 544 | + let t = document.documentElement, i = document.body; | |
| 545 | + return t.classList.contains(e2) || t.classList.contains(`${e2}-mode`) || t.classList.contains(`theme-${e2}`) || t.getAttribute("data-theme") === e2 || t.getAttribute("data-color-scheme") === e2 || i.classList.contains(e2) || i.classList.contains(`${e2}-mode`) || i.getAttribute("data-theme") === e2; | |
| 497 | 546 | } |
| 498 | -function H2() { | |
| 499 | - if (et("dark")) return "dark"; | |
| 500 | - if (et("light")) return "light"; | |
| 501 | - try { | |
| 502 | - let e3 = getComputedStyle(document.body).backgroundColor, t2 = j2(e3); | |
| 503 | - if (t2 !== null) { | |
| 504 | - if (t2 > 128) return "light"; | |
| 505 | - if (t2 < 128) return "dark"; | |
| 506 | - } | |
| 507 | - } catch { | |
| 547 | +function xt(e2) { | |
| 548 | + let t = 0, i = 0; | |
| 549 | + for (let s = e2; s && s.nodeType === 1 && i < 0.995; s = s.parentElement) { | |
| 550 | + let r = U(getComputedStyle(s).backgroundColor); | |
| 551 | + if (!r || r.a <= 0) continue; | |
| 552 | + let a = r.a * (1 - i); | |
| 553 | + t += (r.r * 299 + r.g * 587 + r.b * 114) / 1e3 * a, i += a; | |
| 508 | 554 | } |
| 555 | + return { sum: t, alpha: i }; | |
| 556 | +} | |
| 557 | +function Rt() { | |
| 558 | + let e2 = lt(getComputedStyle(document.body).color); | |
| 559 | + if (e2 !== null) return e2 > K ? "dark" : "light"; | |
| 509 | 560 | if (window.matchMedia) { |
| 510 | 561 | if (window.matchMedia("(prefers-color-scheme: dark)").matches) return "dark"; |
| 511 | 562 | if (window.matchMedia("(prefers-color-scheme: light)").matches) return "light"; |
| 512 | 563 | } |
| @@ -511,41 +562,103 @@ | ||
| 511 | 562 | if (window.matchMedia("(prefers-color-scheme: light)").matches) return "light"; |
| 512 | 563 | } |
| 513 | 564 | return "dark"; |
| 514 | 565 | } |
| 515 | -var L = { dark: { waveformColor: "rgba(255, 255, 255, 0.3)", progressColor: "rgba(255, 255, 255, 0.9)" }, light: { waveformColor: "rgba(0, 0, 0, 0.2)", progressColor: "rgba(0, 0, 0, 0.8)" } }; | |
| 516 | -function I(e3) { | |
| 517 | - if (e3 && L[e3]) return L[e3]; | |
| 518 | - let t2 = H2(); | |
| 519 | - return L[t2]; | |
| 566 | +function R2(e2) { | |
| 567 | + if (gt("dark")) return "dark"; | |
| 568 | + if (gt("light")) return "light"; | |
| 569 | + try { | |
| 570 | + let t = e2 && e2.nodeType === 1 ? e2 : document.body, { sum: i, alpha: s } = xt(t), r = Rt(), a = i + (r === "dark" ? 0 : 255) * (1 - s); | |
| 571 | + return a > K ? "light" : a < K ? "dark" : r; | |
| 572 | + } catch { | |
| 573 | + return "dark"; | |
| 574 | + } | |
| 520 | 575 | } |
| 521 | -var z = { url: "", height: 64, samples: 1800, preload: "metadata", crossOrigin: null, audioMode: "self", playbackRate: 1, showPlaybackSpeed: false, playbackRates: [0.5, 0.75, 1, 1.25, 1.5, 1.75, 2], buttonAlign: "auto", layout: "default", buttonStyle: "circle", buttonSize: null, buttonRadius: null, waveformStyle: "mirror", barWidth: 2, barSpacing: 0, barRadius: 1, waveformGradient: "vertical", colorPreset: null, waveformColor: null, progressColor: null, autoplay: false, showControls: true, showInfo: true, showTime: true, showHoverTime: false, seekHandle: false, showBPM: false, bpm: null, singlePlay: true, playOnSeek: true, enableMediaSession: true, markers: [], showMarkers: true, accessibleSeek: true, seekLabel: null, seekValueText: null, title: null, artist: null, artwork: null, artworkPosition: "info", album: "", errorText: "Unable to load audio", playPauseLabel: "Play/Pause", speedLabel: "Playback speed", artworkAlt: "Album artwork", unknownTrackText: "Unknown Track", playIcon: '<svg viewBox="0 0 24 24" width="16" height="16"><path d="M8 5v14l11-7z"/></svg>', pauseIcon: '<svg viewBox="0 0 24 24" width="16" height="16"><path d="M6 4h4v16H6zM14 4h4v16h-4z"/></svg>', onLoad: null, onPlay: null, onPause: null, onEnd: null, onError: null, onTimeUpdate: null, onNextTrack: null, onPreviousTrack: null }; | |
| 522 | -var it = { bars: { barWidth: 3, barSpacing: 1 }, mirror: { barWidth: 2, barSpacing: 2 }, line: { barWidth: 2, barSpacing: 0 }, blocks: { barWidth: 4, barSpacing: 2 }, dots: { barWidth: 3, barSpacing: 3 }, seekbar: { barWidth: 1, barSpacing: 0 } }; | |
| 523 | -var gt = "data:image/svg+xml," + encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect width="24" height="24" rx="4" fill="#71717a" fill-opacity="0.15"/><g fill="none" stroke="#a1a1aa" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><circle cx="8" cy="17" r="2.2"/><circle cx="17" cy="15" r="2.2"/><path d="M10.2 17V7l9-1.6v9"/></g></svg>'); | |
| 524 | -var st = 5; | |
| 525 | -var rt = 10; | |
| 526 | -var yt = 'button, a[href], input, [role="slider"]'; | |
| 527 | -var A = class e2 { | |
| 576 | +var C = { dark: { waveformColor: "rgba(255, 255, 255, 0.3)", progressColor: "rgba(255, 255, 255, 0.9)" }, light: { waveformColor: "rgba(0, 0, 0, 0.2)", progressColor: "rgba(0, 0, 0, 0.8)" } }; | |
| 577 | +function J(e2, t) { | |
| 578 | + if (e2 && C[e2]) return C[e2]; | |
| 579 | + let i = R2(t); | |
| 580 | + return C[i]; | |
| 581 | +} | |
| 582 | +var W = { url: "", height: 64, samples: 1800, preload: "metadata", crossOrigin: null, audioMode: "self", playbackRate: 1, showPlaybackSpeed: false, playbackRates: [0.5, 0.75, 1, 1.25, 1.5, 1.75, 2], buttonAlign: "auto", layout: "default", buttonStyle: "circle", buttonSize: null, buttonRadius: null, waveformStyle: "mirror", barWidth: 2, barSpacing: 0, barRadius: 1, waveformGradient: "vertical", colorPreset: null, waveformColor: null, progressColor: null, autoplay: false, showControls: true, showInfo: true, showTime: true, showHoverTime: false, seekHandle: false, showBPM: false, bpm: null, singlePlay: true, playOnSeek: true, enableMediaSession: true, markers: [], showMarkers: true, accessibleSeek: true, seekLabel: null, seekValueText: null, title: null, artist: null, artwork: null, artworkPosition: "info", album: "", errorText: "Unable to load audio", playPauseLabel: "Play/Pause", speedLabel: "Playback speed", artworkAlt: "Album artwork", unknownTrackText: "Unknown Track", playIcon: '<svg viewBox="0 0 24 24" width="16" height="16"><path d="M8 5v14l11-7z"/></svg>', pauseIcon: '<svg viewBox="0 0 24 24" width="16" height="16"><path d="M6 4h4v16H6zM14 4h4v16h-4z"/></svg>', onLoad: null, onPlay: null, onPause: null, onEnd: null, onError: null, onTimeUpdate: null, onNextTrack: null, onPreviousTrack: null }; | |
| 583 | +var X = { bars: { barWidth: 3, barSpacing: 1 }, mirror: { barWidth: 2, barSpacing: 2 }, line: { barWidth: 2, barSpacing: 0 }, blocks: { barWidth: 4, barSpacing: 2 }, dots: { barWidth: 3, barSpacing: 3 }, seekbar: { barWidth: 1, barSpacing: 0 } }; | |
| 584 | +var Q = ["auto", "top", "center", "bottom"]; | |
| 585 | +var N2 = 0.25; | |
| 586 | +var F = 4; | |
| 587 | +var Dt = { buttonAlign: Q, layout: ["default", "preview"], buttonStyle: ["circle", "minimal"], artworkPosition: ["info", "button"], waveformStyle: Object.keys(X), waveformGradient: ["vertical", "horizontal", "diagonal"], audioMode: ["self", "external"], preload: ["none", "metadata", "auto"], colorPreset: Object.keys(C), crossOrigin: ["anonymous", "use-credentials"] }; | |
| 588 | +var Bt = { height: { min: 1, integer: true }, samples: { min: 1, integer: true }, barWidth: { min: 0 }, barSpacing: { min: 0 }, barRadius: { min: 0 }, bpm: { min: 1 }, playbackRate: { min: N2, max: F } }; | |
| 589 | +var Ht = ["autoplay", "showControls", "showInfo", "showTime", "showHoverTime", "seekHandle", "showBPM", "singlePlay", "playOnSeek", "enableMediaSession", "showMarkers", "accessibleSeek", "showPlaybackSpeed"]; | |
| 590 | +var Ot = ["onLoad", "onPlay", "onPause", "onEnd", "onError", "onTimeUpdate", "onNextTrack", "onPreviousTrack"]; | |
| 591 | +function Y(e2, t) { | |
| 592 | + console.warn(`[WaveformPlayer] Invalid ${e2} option, using default:`, t); | |
| 593 | +} | |
| 594 | +function z(e2) { | |
| 595 | + let t = H2(e2); | |
| 596 | + return t ? t.reduce((i, s) => { | |
| 597 | + let r = s && typeof s == "object" ? _(s.time, null, { min: 0 }) : null; | |
| 598 | + return r === null ? (Y("marker", s), i) : (i.push({ ...s, time: r, label: s.label == null ? "" : s.label }), i); | |
| 599 | + }, []) : (e2 != null && Y("markers", e2), []); | |
| 600 | +} | |
| 601 | +function Z(e2) { | |
| 602 | + let t = (s) => e2[s] != null, i = (s) => { | |
| 603 | + Y(s, e2[s]), e2[s] = W[s]; | |
| 604 | + }; | |
| 605 | + for (let [s, r] of Object.entries(Bt)) { | |
| 606 | + if (!t(s)) continue; | |
| 607 | + let a = _(e2[s], null, r); | |
| 608 | + a === null ? i(s) : e2[s] = a; | |
| 609 | + } | |
| 610 | + for (let [s, r] of Object.entries(Dt)) t(s) && rt(e2[s], r) === null && i(s); | |
| 611 | + for (let s of Ht) e2[s] = at(e2[s]); | |
| 612 | + for (let s of Ot) t(s) && typeof e2[s] != "function" && i(s); | |
| 613 | + if (t("playbackRates")) { | |
| 614 | + let s = D(e2.playbackRates, { min: N2, max: F, fallback: null }); | |
| 615 | + s === null ? i("playbackRates") : e2.playbackRates = s; | |
| 616 | + } | |
| 617 | + e2.markers = z(e2.markers); | |
| 618 | + for (let s of ["buttonSize", "buttonRadius"]) { | |
| 619 | + if (!t(s)) continue; | |
| 620 | + let r = e2[s]; | |
| 621 | + (typeof r == "number" ? Number.isFinite(r) : typeof r == "string" && r.trim() !== "") || i(s); | |
| 622 | + } | |
| 623 | + for (let s of ["waveformColor", "progressColor"]) { | |
| 624 | + if (!t(s)) continue; | |
| 625 | + let r = e2[s]; | |
| 626 | + !(typeof r == "string" && r.trim() !== "") && !Array.isArray(r) && i(s); | |
| 627 | + } | |
| 628 | + return e2; | |
| 629 | +} | |
| 630 | +var It = "data:image/svg+xml," + encodeURIComponent('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect width="24" height="24" rx="4" fill="#71717a" fill-opacity="0.15"/><g fill="none" stroke="#a1a1aa" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><circle cx="8" cy="17" r="2.2"/><circle cx="17" cy="15" r="2.2"/><path d="M10.2 17V7l9-1.6v9"/></g></svg>'); | |
| 631 | +var bt = 5; | |
| 632 | +var wt = 10; | |
| 633 | +var Wt = 'button, a[href], input, [role="slider"]'; | |
| 634 | +var T = class e { | |
| 528 | 635 | static instances = /* @__PURE__ */ new Map(); |
| 529 | 636 | static currentlyPlaying = null; |
| 530 | - constructor(t2, i2 = {}) { | |
| 531 | - if (this.container = typeof t2 == "string" ? document.querySelector(t2) : t2, !this.container) throw new Error("[WaveformPlayer] Container element not found"); | |
| 532 | - let s2 = D(this.container), r2 = { ...i2 }; | |
| 533 | - r2.style && !r2.waveformStyle && (r2.waveformStyle = r2.style), r2.src && !r2.url && (r2.url = r2.src), this.options = O(z, s2, r2); | |
| 534 | - let a2 = I(this.options.colorPreset); | |
| 535 | - this._autoTheme = this.options.colorPreset == null || !L[this.options.colorPreset], this._presetKeys = [], this._scheme = this.options.colorPreset && L[this.options.colorPreset] ? this.options.colorPreset : H2(); | |
| 536 | - for (let [l2, n2] of Object.entries(a2)) (this.options[l2] === null || this.options[l2] === void 0) && (this.options[l2] = n2, this._presetKeys.push(l2)); | |
| 537 | - let o2 = it[this.options.waveformStyle]; | |
| 538 | - o2 && (s2.barWidth === void 0 && i2.barWidth === void 0 && (this.options.barWidth = o2.barWidth), s2.barSpacing === void 0 && i2.barSpacing === void 0 && (this.options.barSpacing = o2.barSpacing)), this.audio = null, this.canvas = null, this.ctx = null, this.waveformData = [], this.progress = 0, this._activeMarkerIndex = -1, this._markerLabelTimer = null, this.isPlaying = false, this.isLoading = false, this.hasError = false, this.updateTimer = null, this.resizeObserver = null, this._ac = new AbortController(), this.id = this.container.id || V(this.options.url), e2.instances.set(this.id, this), e2._watchTheme(), this.init(), setTimeout(() => { | |
| 637 | + constructor(t, i = {}) { | |
| 638 | + if (this.container = typeof t == "string" ? document.querySelector(t) : t, !this.container) throw new Error("[WaveformPlayer] Container element not found"); | |
| 639 | + let s = O(this.container), r = { ...i }; | |
| 640 | + r.style && !r.waveformStyle && (r.waveformStyle = r.style), r.src && !r.url && (r.url = r.src), this.options = Z(j2(W, s, r)); | |
| 641 | + let a = J(this.options.colorPreset, this.container); | |
| 642 | + this._autoTheme = this.options.colorPreset == null || !C[this.options.colorPreset], this._presetKeys = [], this._scheme = this.options.colorPreset && C[this.options.colorPreset] ? this.options.colorPreset : R2(this.container); | |
| 643 | + for (let [n, l2] of Object.entries(a)) (this.options[n] === null || this.options[n] === void 0) && (this.options[n] = l2, this._presetKeys.push(n)); | |
| 644 | + let o = X[this.options.waveformStyle]; | |
| 645 | + o && (s.barWidth === void 0 && i.barWidth === void 0 && (this.options.barWidth = o.barWidth), s.barSpacing === void 0 && i.barSpacing === void 0 && (this.options.barSpacing = o.barSpacing)), this.audio = null, this.canvas = null, this.ctx = null, this.waveformData = [], this.progress = 0, this._activeMarkerIndex = -1, this._markerLabelTimer = null, this.isPlaying = false, this.isLoading = false, this.hasError = false, this.updateTimer = null, this.resizeObserver = null, this._ac = new AbortController(), this.id = this.container.id || nt(this.options.url), e.instances.set(this.id, this), e._watchTheme(); | |
| 646 | + try { | |
| 647 | + this.init(); | |
| 648 | + } catch (n) { | |
| 649 | + throw e.instances.delete(this.id), this._ac.abort(), n; | |
| 650 | + } | |
| 651 | + setTimeout(() => { | |
| 539 | 652 | this._emit("waveformplayer:ready", { player: this, url: this.options.url }); |
| 540 | 653 | }, 100); |
| 541 | 654 | } |
| 542 | - _emit(t2, i2, s2 = false) { | |
| 543 | - let r2 = new CustomEvent(t2, { bubbles: true, cancelable: s2, detail: i2 }); | |
| 544 | - return this.container.dispatchEvent(r2), r2; | |
| 655 | + _emit(t, i, s = false) { | |
| 656 | + let r = new CustomEvent(t, { bubbles: true, cancelable: s, detail: i }); | |
| 657 | + return this.container.dispatchEvent(r), r; | |
| 545 | 658 | } |
| 546 | - _requestSeek(t2) { | |
| 547 | - this._emit("waveformplayer:request-seek", { ...this._buildTrackDetail(), percent: t2 }, true).defaultPrevented || (this.progress = t2, this.drawWaveform?.()); | |
| 659 | + _requestSeek(t) { | |
| 660 | + this._emit("waveformplayer:request-seek", { ...this._buildTrackDetail(), percent: t }, true).defaultPrevented || (this.progress = t, this.drawWaveform?.()); | |
| 548 | 661 | } |
| 549 | 662 | init() { |
| 550 | 663 | this.createDOM(), this.createAudio(), this.initPlaybackSpeed(), this.initKeyboardControls(), this.initSeekControl(), this.bindEvents(), this.setupResizeObserver(), requestAnimationFrame(() => { |
| 551 | 664 | this.resizeCanvas(), this.options.url && this.load(this.options.url).then(() => { |
| @@ -550,26 +663,26 @@ | ||
| 550 | 663 | this.createDOM(), this.createAudio(), this.initPlaybackSpeed(), this.initKeyboardControls(), this.initSeekControl(), this.bindEvents(), this.setupResizeObserver(), requestAnimationFrame(() => { |
| 551 | 664 | this.resizeCanvas(), this.options.url && this.load(this.options.url).then(() => { |
| 552 | 665 | this.options.autoplay && this.play()?.catch(() => { |
| 553 | 666 | }); |
| 554 | - }).catch((t2) => { | |
| 555 | - console.error("[WaveformPlayer] Failed to load audio:", t2); | |
| 667 | + }).catch((t) => { | |
| 668 | + console.error("[WaveformPlayer] Failed to load audio:", t); | |
| 556 | 669 | }); |
| 557 | 670 | }); |
| 558 | 671 | } |
| 559 | 672 | createDOM() { |
| 560 | 673 | this.container.innerHTML = "", this.container.className = "waveform-player"; |
| 561 | - let t2 = this.options.buttonAlign; | |
| 562 | - t2 === "auto" && (this.options.waveformStyle === "bars" ? t2 = "bottom" : t2 = "center"), this.options.layout === "preview" && this.container.classList.add("waveform-layout-preview"), this.container.classList.toggle("waveform-theme-light", this._scheme === "light"); | |
| 563 | - let s2 = []; | |
| 564 | - this.options.buttonSize != null && s2.push(`--wfp-btn-size: ${W(this.options.buttonSize)}`), this.options.buttonRadius != null && s2.push(`--wfp-btn-radius: ${W(this.options.buttonRadius)}`); | |
| 565 | - let r2 = s2.length ? ` style="${s2.join("; ")};"` : "", a2 = this.options.artworkPosition === "button" && this.options.artwork, o2 = a2 ? `<img class="waveform-btn-artwork" src="${S(this.options.artwork)}" alt="" aria-hidden="true">` : "", l2 = this.options.showControls ? ` | |
| 566 | - <button class="waveform-btn${this.options.buttonStyle === "minimal" ? " waveform-btn-minimal" : ""}${a2 ? " waveform-btn-has-artwork" : ""}" aria-label="${S(this.options.playPauseLabel)}"${r2}> | |
| 567 | - ${o2} | |
| 674 | + let t = Q.includes(this.options.buttonAlign) ? this.options.buttonAlign : "auto"; | |
| 675 | + t === "auto" && (this.options.waveformStyle === "bars" ? t = "bottom" : t = "center"), this.options.layout === "preview" && this.container.classList.add("waveform-layout-preview"), this.container.classList.toggle("waveform-theme-light", this._scheme === "light"); | |
| 676 | + let s = []; | |
| 677 | + this.options.buttonSize != null && s.push(`--wfp-btn-size: ${q2(this.options.buttonSize)}`), this.options.buttonRadius != null && s.push(`--wfp-btn-radius: ${q2(this.options.buttonRadius)}`); | |
| 678 | + let r = s.length ? ` style="${s.join("; ")};"` : "", a = this.options.artworkPosition === "button" && this.options.artwork, o = a ? `<img class="waveform-btn-artwork" src="${S(this.options.artwork)}" alt="" aria-hidden="true">` : "", n = this.options.showControls ? ` | |
| 679 | + <button class="waveform-btn${this.options.buttonStyle === "minimal" ? " waveform-btn-minimal" : ""}${a ? " waveform-btn-has-artwork" : ""}" aria-label="${S(this.options.playPauseLabel)}"${r}> | |
| 680 | + ${o} | |
| 568 | 681 | <span class="waveform-icon-play">${this.options.playIcon}</span> |
| 569 | 682 | <span class="waveform-icon-pause" style="display:none;">${this.options.pauseIcon}</span> |
| 570 | 683 | </button> |
| 571 | - ` : "", n2 = this.options.showInfo ? ` | |
| 684 | + ` : "", l2 = this.options.showInfo ? ` | |
| 572 | 685 | <div class="waveform-info"> |
| 573 | 686 | ${this.options.artworkPosition !== "button" && this.options.artwork ? ` |
| 574 | 687 | <img class="waveform-artwork" src="${S(this.options.artwork)}" alt="${S(this.options.artworkAlt)}" style=" |
| 575 | 688 | width: 40px; |
| @@ -594,9 +707,9 @@ | ||
| 594 | 707 | <button class="speed-btn" aria-label="${S(this.options.speedLabel)}" aria-haspopup="menu" aria-expanded="false"> |
| 595 | 708 | <span class="speed-value">1x</span> |
| 596 | 709 | </button> |
| 597 | 710 | <div class="speed-menu" role="menu" aria-label="${S(this.options.speedLabel)}" style="display: none;"> |
| 598 | - ${this.options.playbackRates.map((h2) => `<button class="speed-option" role="menuitemradio" tabindex="-1" aria-checked="false" data-rate="${h2}">${h2}x</button>`).join("")} | |
| 711 | + ${this.options.playbackRates.map((h) => `<button class="speed-option" role="menuitemradio" tabindex="-1" aria-checked="false" data-rate="${h}">${h}x</button>`).join("")} | |
| 599 | 712 | </div> |
| 600 | 713 | </div> |
| 601 | 714 | ` : ""} |
| 602 | 715 | ${this.options.showTime ? ` |
| @@ -609,10 +722,10 @@ | ||
| 609 | 722 | ` : ""; |
| 610 | 723 | this.container.innerHTML = ` |
| 611 | 724 | <div class="waveform-player-inner"> |
| 612 | 725 | <div class="waveform-body"> |
| 613 | - <div class="waveform-track waveform-align-${t2}"> | |
| 614 | - ${l2} | |
| 726 | + <div class="waveform-track waveform-align-${t}"> | |
| 727 | + ${n} | |
| 615 | 728 | |
| 616 | 729 | <div class="waveform-container"> |
| 617 | 730 | <canvas></canvas> |
| 618 | 731 | <div class="waveform-markers"></div> |
| @@ -622,69 +735,69 @@ | ||
| 622 | 735 | </div> |
| 623 | 736 | </div> |
| 624 | 737 | </div> |
| 625 | 738 | |
| 626 | - ${n2} | |
| 739 | + ${l2} | |
| 627 | 740 | </div> |
| 628 | 741 | </div> |
| 629 | 742 | `, this.playBtn = this.container.querySelector(".waveform-btn"), this.canvas = this.container.querySelector("canvas"), this.ctx = this.canvas.getContext("2d"), this.titleEl = this.container.querySelector(".waveform-title"), this.artistEl = this.container.querySelector(".waveform-artist"), this.artworkEl = this.container.querySelector(".waveform-artwork, .waveform-btn-artwork"), this.bindArtworkFallback(this.artworkEl), this.currentTimeEl = this.container.querySelector(".time-current"), this.totalTimeEl = this.container.querySelector(".time-total"), this.bpmEl = this.container.querySelector(".waveform-bpm"), this.bpmValueEl = this.container.querySelector(".bpm-value"), this.loadingEl = this.container.querySelector(".waveform-loading"), this.errorEl = this.container.querySelector(".waveform-error"), this.markersContainer = this.container.querySelector(".waveform-markers"), this.speedBtn = this.container.querySelector(".speed-btn"), this.speedMenu = this.container.querySelector(".speed-menu"), this.resizeCanvas(), this.updateBPMDisplay(); |
| 630 | 743 | } |
| 631 | - bindArtworkFallback(t2) { | |
| 632 | - t2 && t2.addEventListener("error", () => { | |
| 633 | - t2.src.startsWith("data:") || (t2.src = gt); | |
| 744 | + bindArtworkFallback(t) { | |
| 745 | + t && t.addEventListener("error", () => { | |
| 746 | + t.src.startsWith("data:") || (t.src = It); | |
| 634 | 747 | }, { signal: this._ac.signal }); |
| 635 | 748 | } |
| 636 | 749 | createArtworkElement() { |
| 637 | - let t2 = document.createElement("img"); | |
| 638 | - return t2.className = "waveform-artwork", t2.style.width = "40px", t2.style.height = "40px", t2.style.borderRadius = "4px", t2.style.objectFit = "cover", t2.style.flexShrink = "0", this.bindArtworkFallback(t2), t2; | |
| 750 | + let t = document.createElement("img"); | |
| 751 | + return t.className = "waveform-artwork", t.style.width = "40px", t.style.height = "40px", t.style.borderRadius = "4px", t.style.objectFit = "cover", t.style.flexShrink = "0", this.bindArtworkFallback(t), t; | |
| 639 | 752 | } |
| 640 | 753 | createButtonArtworkElement() { |
| 641 | - let t2 = document.createElement("img"); | |
| 642 | - return t2.className = "waveform-btn-artwork", t2.alt = "", t2.setAttribute("aria-hidden", "true"), this.bindArtworkFallback(t2), t2; | |
| 754 | + let t = document.createElement("img"); | |
| 755 | + return t.className = "waveform-btn-artwork", t.alt = "", t.setAttribute("aria-hidden", "true"), this.bindArtworkFallback(t), t; | |
| 643 | 756 | } |
| 644 | 757 | createArtistElement() { |
| 645 | - let t2 = document.createElement("span"); | |
| 646 | - return t2.className = "waveform-artist", t2; | |
| 758 | + let t = document.createElement("span"); | |
| 759 | + return t.className = "waveform-artist", t; | |
| 647 | 760 | } |
| 648 | - syncArtist(t2) { | |
| 649 | - if (this.options.artist = t2 || null, !!this.options.showInfo) { | |
| 650 | - if (!t2) { | |
| 761 | + syncArtist(t) { | |
| 762 | + if (this.options.artist = t || null, !!this.options.showInfo) { | |
| 763 | + if (!t) { | |
| 651 | 764 | this.artistEl?.remove(), this.artistEl = null; |
| 652 | 765 | return; |
| 653 | 766 | } |
| 654 | 767 | if (!this.artistEl) { |
| 655 | - let i2 = this.container.querySelector(".waveform-title"); | |
| 656 | - if (!i2) return; | |
| 657 | - this.artistEl = this.createArtistElement(), i2.after(this.artistEl); | |
| 768 | + let i = this.container.querySelector(".waveform-title"); | |
| 769 | + if (!i) return; | |
| 770 | + this.artistEl = this.createArtistElement(), i.after(this.artistEl); | |
| 658 | 771 | } |
| 659 | - this.artistEl.textContent = t2, this.artistEl.style.display = ""; | |
| 772 | + this.artistEl.textContent = t, this.artistEl.style.display = ""; | |
| 660 | 773 | } |
| 661 | 774 | } |
| 662 | - syncButtonArtwork(t2) { | |
| 775 | + syncButtonArtwork(t) { | |
| 663 | 776 | if (this.playBtn) { |
| 664 | - if (!t2) { | |
| 777 | + if (!t) { | |
| 665 | 778 | this.artworkEl?.remove(), this.artworkEl = null, this.playBtn.classList.remove("waveform-btn-has-artwork"); |
| 666 | 779 | return; |
| 667 | 780 | } |
| 668 | - this.artworkEl || (this.artworkEl = this.createButtonArtworkElement(), this.playBtn.prepend(this.artworkEl)), this.artworkEl.src = t2, this.playBtn.classList.add("waveform-btn-has-artwork"); | |
| 781 | + this.artworkEl || (this.artworkEl = this.createButtonArtworkElement(), this.playBtn.prepend(this.artworkEl)), this.artworkEl.src = t, this.playBtn.classList.add("waveform-btn-has-artwork"); | |
| 669 | 782 | } |
| 670 | 783 | } |
| 671 | - syncArtwork(t2, i2 = "") { | |
| 672 | - if (this.options.artwork = t2 || null, this.options.artworkAlt = i2 || "", this.options.artworkPosition === "button") { | |
| 784 | + syncArtwork(t, i = "") { | |
| 785 | + if (this.options.artwork = t || null, this.options.artworkAlt = i || "", this.options.artworkPosition === "button") { | |
| 673 | 786 | this.syncButtonArtwork(this.options.artwork); |
| 674 | 787 | return; |
| 675 | 788 | } |
| 676 | 789 | if (this.options.showInfo) { |
| 677 | - if (!t2) { | |
| 790 | + if (!t) { | |
| 678 | 791 | this.artworkEl?.remove(), this.artworkEl = null; |
| 679 | 792 | return; |
| 680 | 793 | } |
| 681 | 794 | if (!this.artworkEl) { |
| 682 | - let s2 = this.container.querySelector(".waveform-text"); | |
| 683 | - if (!s2) return; | |
| 684 | - this.artworkEl = this.createArtworkElement(), s2.before(this.artworkEl); | |
| 795 | + let s = this.container.querySelector(".waveform-text"); | |
| 796 | + if (!s) return; | |
| 797 | + this.artworkEl = this.createArtworkElement(), s.before(this.artworkEl); | |
| 685 | 798 | } |
| 686 | - this.artworkEl.src = t2, this.artworkEl.alt = i2 || ""; | |
| 799 | + this.artworkEl.src = t, this.artworkEl.alt = i || ""; | |
| 687 | 800 | } |
| 688 | 801 | } |
| 689 | 802 | createAudio() { |
| 690 | 803 | if (this.options.audioMode === "external") { |
| @@ -696,105 +809,105 @@ | ||
| 696 | 809 | initPlaybackSpeed() { |
| 697 | 810 | this.audio && this.options.playbackRate && this.options.playbackRate !== 1 && (this.audio.playbackRate = this.options.playbackRate), this.options.showPlaybackSpeed && this.initSpeedControls(); |
| 698 | 811 | } |
| 699 | 812 | initSpeedControls() { |
| 700 | - let t2 = this.container.querySelector(".speed-btn"), i2 = this.container.querySelector(".speed-menu"); | |
| 701 | - if (!t2 || !i2) return; | |
| 702 | - let s2 = () => Array.from(i2.querySelectorAll(".speed-option")), r2 = () => i2.style.display !== "none", a2 = (n2) => { | |
| 703 | - if (i2.style.display = n2 ? "block" : "none", t2.setAttribute("aria-expanded", n2 ? "true" : "false"), n2) { | |
| 704 | - let h2 = s2(); | |
| 705 | - (h2.find((c2) => c2.getAttribute("aria-checked") === "true") || h2[0])?.focus(); | |
| 813 | + let t = this.container.querySelector(".speed-btn"), i = this.container.querySelector(".speed-menu"); | |
| 814 | + if (!t || !i) return; | |
| 815 | + let s = () => Array.from(i.querySelectorAll(".speed-option")), r = () => i.style.display !== "none", a = (l2) => { | |
| 816 | + if (i.style.display = l2 ? "block" : "none", t.setAttribute("aria-expanded", l2 ? "true" : "false"), l2) { | |
| 817 | + let h = s(); | |
| 818 | + (h.find((c2) => c2.getAttribute("aria-checked") === "true") || h[0])?.focus(); | |
| 706 | 819 | } |
| 707 | - }, o2 = (n2) => { | |
| 708 | - let h2 = s2(); | |
| 709 | - h2.length && h2[(n2 + h2.length) % h2.length].focus(); | |
| 710 | - }, l2 = (n2) => { | |
| 711 | - this.setPlaybackRate(parseFloat(n2.dataset.rate)), a2(false), t2.focus(); | |
| 820 | + }, o = (l2) => { | |
| 821 | + let h = s(); | |
| 822 | + h.length && h[(l2 + h.length) % h.length].focus(); | |
| 823 | + }, n = (l2) => { | |
| 824 | + this.setPlaybackRate(parseFloat(l2.dataset.rate)), a(false), t.focus(); | |
| 712 | 825 | }; |
| 713 | - t2.addEventListener("click", (n2) => { | |
| 714 | - n2.stopPropagation(), a2(!r2()); | |
| 715 | - }, { signal: this._ac.signal }), document.addEventListener("click", () => a2(false), { signal: this._ac.signal }), i2.addEventListener("click", (n2) => { | |
| 716 | - n2.stopPropagation(); | |
| 717 | - let h2 = n2.target.closest(".speed-option"); | |
| 718 | - h2 && l2(h2); | |
| 719 | - }, { signal: this._ac.signal }), t2.closest(".waveform-speed")?.addEventListener("keydown", (n2) => { | |
| 720 | - let h2 = s2(), c2 = h2.indexOf(document.activeElement); | |
| 721 | - if (!r2()) { | |
| 722 | - (n2.key === "ArrowDown" || n2.key === "ArrowUp") && document.activeElement === t2 && (n2.preventDefault(), a2(true)); | |
| 826 | + t.addEventListener("click", (l2) => { | |
| 827 | + l2.stopPropagation(), a(!r()); | |
| 828 | + }, { signal: this._ac.signal }), document.addEventListener("click", () => a(false), { signal: this._ac.signal }), i.addEventListener("click", (l2) => { | |
| 829 | + l2.stopPropagation(); | |
| 830 | + let h = l2.target.closest(".speed-option"); | |
| 831 | + h && n(h); | |
| 832 | + }, { signal: this._ac.signal }), t.closest(".waveform-speed")?.addEventListener("keydown", (l2) => { | |
| 833 | + let h = s(), c2 = h.indexOf(document.activeElement); | |
| 834 | + if (!r()) { | |
| 835 | + (l2.key === "ArrowDown" || l2.key === "ArrowUp") && document.activeElement === t && (l2.preventDefault(), a(true)); | |
| 723 | 836 | return; |
| 724 | 837 | } |
| 725 | - switch (n2.key) { | |
| 838 | + switch (l2.key) { | |
| 726 | 839 | case "ArrowDown": |
| 727 | - n2.preventDefault(), o2(c2 < 0 ? 0 : c2 + 1); | |
| 840 | + l2.preventDefault(), o(c2 < 0 ? 0 : c2 + 1); | |
| 728 | 841 | break; |
| 729 | 842 | case "ArrowUp": |
| 730 | - n2.preventDefault(), o2(c2 < 0 ? h2.length - 1 : c2 - 1); | |
| 843 | + l2.preventDefault(), o(c2 < 0 ? h.length - 1 : c2 - 1); | |
| 731 | 844 | break; |
| 732 | 845 | case "Home": |
| 733 | - n2.preventDefault(), o2(0); | |
| 846 | + l2.preventDefault(), o(0); | |
| 734 | 847 | break; |
| 735 | 848 | case "End": |
| 736 | - n2.preventDefault(), o2(h2.length - 1); | |
| 849 | + l2.preventDefault(), o(h.length - 1); | |
| 737 | 850 | break; |
| 738 | 851 | case "Escape": |
| 739 | - n2.preventDefault(), a2(false), t2.focus(); | |
| 852 | + l2.preventDefault(), a(false), t.focus(); | |
| 740 | 853 | break; |
| 741 | 854 | case "Tab": |
| 742 | - a2(false); | |
| 855 | + a(false); | |
| 743 | 856 | break; |
| 744 | 857 | } |
| 745 | 858 | }, { signal: this._ac.signal }), this.updateSpeedUI(); |
| 746 | 859 | } |
| 747 | 860 | initKeyboardControls() { |
| 748 | - this.container.setAttribute("tabindex", "-1"), this.container.addEventListener("click", (t2) => { | |
| 749 | - t2.target.closest(yt) || (e2.getAllInstances().forEach((i2) => { | |
| 750 | - i2 !== this && i2.container.setAttribute("tabindex", "-1"); | |
| 861 | + this.container.setAttribute("tabindex", "-1"), this.container.addEventListener("click", (t) => { | |
| 862 | + t.target.closest(Wt) || (e.getAllInstances().forEach((i) => { | |
| 863 | + i !== this && i.container.setAttribute("tabindex", "-1"); | |
| 751 | 864 | }), this.container.setAttribute("tabindex", "0"), this.container.focus()); |
| 752 | - }, { signal: this._ac.signal }), this.container.addEventListener("keydown", (t2) => { | |
| 865 | + }, { signal: this._ac.signal }), this.container.addEventListener("keydown", (t) => { | |
| 753 | 866 | if (document.activeElement !== this.container) return; |
| 754 | - let i2 = t2.key, s2 = !!this.audio, r2 = s2 ? this.audio.currentTime : 0; | |
| 755 | - if (s2 && i2 >= "0" && i2 <= "9") { | |
| 756 | - t2.preventDefault(), this.seekToPercent(parseInt(i2) / 10); | |
| 867 | + let i = t.key, s = !!this.audio, r = s ? this.audio.currentTime : 0; | |
| 868 | + if (s && i >= "0" && i <= "9") { | |
| 869 | + t.preventDefault(), this.seekToPercent(parseInt(i) / 10); | |
| 757 | 870 | return; |
| 758 | 871 | } |
| 759 | - let a2 = { " ": () => this.togglePlay() }; | |
| 760 | - s2 && (a2.ArrowLeft = () => this.seekTo(m2(r2 - 5, 0, this.audio.duration)), a2.ArrowRight = () => this.seekTo(m2(r2 + 5, 0, this.audio.duration)), a2.ArrowUp = () => this.setVolume(m2(this.audio.volume + 0.1)), a2.ArrowDown = () => this.setVolume(m2(this.audio.volume - 0.1)), a2.m = a2.M = () => this.audio.muted = !this.audio.muted), a2[i2] && (t2.preventDefault(), a2[i2]()); | |
| 872 | + let a = { " ": () => this.togglePlay() }; | |
| 873 | + s && (a.ArrowLeft = () => this.seekTo(m2(r - 5, 0, this.audio.duration)), a.ArrowRight = () => this.seekTo(m2(r + 5, 0, this.audio.duration)), a.ArrowUp = () => this.setVolume(m2(this.audio.volume + 0.1)), a.ArrowDown = () => this.setVolume(m2(this.audio.volume - 0.1)), a.m = a.M = () => this.audio.muted = !this.audio.muted), a[i] && (t.preventDefault(), a[i]()); | |
| 761 | 874 | }, { signal: this._ac.signal }); |
| 762 | 875 | } |
| 763 | 876 | initSeekControl() { |
| 764 | - this.options.accessibleSeek && (this.seekEl = this.container.querySelector(".waveform-container"), this.seekEl && (this.seekEl.setAttribute("role", "slider"), this.seekEl.setAttribute("tabindex", "0"), this.seekEl.setAttribute("aria-valuemin", "0"), this.applySeekLabel(), this.updateSeekAccessibility(), this.seekEl.addEventListener("keydown", (t2) => { | |
| 765 | - if (t2.key === " " || t2.key === "Spacebar") { | |
| 766 | - t2.preventDefault(), t2.stopPropagation(), this.togglePlay(); | |
| 877 | + this.options.accessibleSeek && (this.seekEl = this.container.querySelector(".waveform-container"), this.seekEl && (this.seekEl.setAttribute("role", "slider"), this.seekEl.setAttribute("tabindex", "0"), this.seekEl.setAttribute("aria-valuemin", "0"), this.applySeekLabel(), this.updateSeekAccessibility(), this.seekEl.addEventListener("keydown", (t) => { | |
| 878 | + if (t.key === " " || t.key === "Spacebar") { | |
| 879 | + t.preventDefault(), t.stopPropagation(), this.togglePlay(); | |
| 767 | 880 | return; |
| 768 | 881 | } |
| 769 | - let i2 = this.getSeekDuration(); | |
| 770 | - if (!i2) return; | |
| 771 | - let s2 = this.getSeekCurrentTime(), r2; | |
| 772 | - switch (t2.key) { | |
| 882 | + let i = this.getSeekDuration(); | |
| 883 | + if (!i) return; | |
| 884 | + let s = this.getSeekCurrentTime(), r; | |
| 885 | + switch (t.key) { | |
| 773 | 886 | case "ArrowLeft": |
| 774 | 887 | case "ArrowDown": |
| 775 | - r2 = s2 - st; | |
| 888 | + r = s - bt; | |
| 776 | 889 | break; |
| 777 | 890 | case "ArrowRight": |
| 778 | 891 | case "ArrowUp": |
| 779 | - r2 = s2 + st; | |
| 892 | + r = s + bt; | |
| 780 | 893 | break; |
| 781 | 894 | case "PageDown": |
| 782 | - r2 = s2 - rt; | |
| 895 | + r = s - wt; | |
| 783 | 896 | break; |
| 784 | 897 | case "PageUp": |
| 785 | - r2 = s2 + rt; | |
| 898 | + r = s + wt; | |
| 786 | 899 | break; |
| 787 | 900 | case "Home": |
| 788 | - r2 = 0; | |
| 901 | + r = 0; | |
| 789 | 902 | break; |
| 790 | 903 | case "End": |
| 791 | - r2 = i2; | |
| 904 | + r = i; | |
| 792 | 905 | break; |
| 793 | 906 | default: |
| 794 | 907 | return; |
| 795 | 908 | } |
| 796 | - t2.preventDefault(), t2.stopPropagation(), this.seekToSeconds(r2); | |
| 909 | + t.preventDefault(), t.stopPropagation(), this.seekToSeconds(r); | |
| 797 | 910 | }, { signal: this._ac.signal }))); |
| 798 | 911 | } |
| 799 | 912 | getSeekDuration() { |
| 800 | 913 | return this.options.audioMode === "external" ? this._extDuration || 0 : this.audio && Number.isFinite(this.audio.duration) ? this.audio.duration : 0; |
| @@ -801,27 +914,27 @@ | ||
| 801 | 914 | } |
| 802 | 915 | getSeekCurrentTime() { |
| 803 | 916 | return this.options.audioMode === "external" ? this.progress * (this._extDuration || 0) : this.audio && Number.isFinite(this.audio.currentTime) ? this.audio.currentTime : 0; |
| 804 | 917 | } |
| 805 | - seekToSeconds(t2) { | |
| 806 | - let i2 = this.getSeekDuration(); | |
| 807 | - if (!i2) return; | |
| 808 | - let s2 = m2(t2, 0, i2); | |
| 918 | + seekToSeconds(t) { | |
| 919 | + let i = this.getSeekDuration(); | |
| 920 | + if (!i) return; | |
| 921 | + let s = m2(t, 0, i); | |
| 809 | 922 | if (this.options.audioMode === "external") { |
| 810 | - this._requestSeek(s2 / i2), this.updateSeekAccessibility(); | |
| 923 | + this._requestSeek(s / i), this.updateSeekAccessibility(); | |
| 811 | 924 | return; |
| 812 | 925 | } |
| 813 | - this.seekTo(s2); | |
| 926 | + this.seekTo(s); | |
| 814 | 927 | } |
| 815 | - applySeekLabel(t2 = this.options.title) { | |
| 928 | + applySeekLabel(t = this.options.title) { | |
| 816 | 929 | if (!this.seekEl) return; |
| 817 | - let i2 = this.options.seekLabel || t2 || "Seek"; | |
| 818 | - this.seekEl.setAttribute("aria-label", i2); | |
| 930 | + let i = this.options.seekLabel || t || "Seek"; | |
| 931 | + this.seekEl.setAttribute("aria-label", i); | |
| 819 | 932 | } |
| 820 | 933 | updateSeekAccessibility() { |
| 821 | 934 | if (!this.seekEl) return; |
| 822 | - let t2 = this.getSeekDuration(), i2 = Math.min(this.getSeekCurrentTime(), t2); | |
| 823 | - this.seekEl.setAttribute("aria-valuemax", String(Math.round(t2))), this.seekEl.setAttribute("aria-valuenow", String(Math.round(i2))), this.seekEl.setAttribute("aria-valuetext", U(this.options.seekValueText || "%1$s of %2$s", E(i2), E(t2))); | |
| 935 | + let t = this.getSeekDuration(), i = Math.min(this.getSeekCurrentTime(), t); | |
| 936 | + this.seekEl.setAttribute("aria-valuemax", String(Math.round(t))), this.seekEl.setAttribute("aria-valuenow", String(Math.round(i))), this.seekEl.setAttribute("aria-valuetext", ot(this.options.seekValueText || "%1$s of %2$s", E2(i), E2(t))); | |
| 824 | 937 | } |
| 825 | 938 | initMediaSession() { |
| 826 | 939 | if (!("mediaSession" in navigator) || !this.options.enableMediaSession || !this.audio) return; |
| 827 | 940 | this._applyMediaMetadata(), navigator.mediaSession.setActionHandler("play", () => this.play()), navigator.mediaSession.setActionHandler("pause", () => this.pause()), navigator.mediaSession.setActionHandler("seekbackward", () => { |
| @@ -827,18 +940,18 @@ | ||
| 827 | 940 | this._applyMediaMetadata(), navigator.mediaSession.setActionHandler("play", () => this.play()), navigator.mediaSession.setActionHandler("pause", () => this.pause()), navigator.mediaSession.setActionHandler("seekbackward", () => { |
| 828 | 941 | this.seekTo(m2(this.audio.currentTime - 10, 0, this.audio.duration)); |
| 829 | 942 | }), navigator.mediaSession.setActionHandler("seekforward", () => { |
| 830 | 943 | this.seekTo(m2(this.audio.currentTime + 10, 0, this.audio.duration)); |
| 831 | - }), navigator.mediaSession.setActionHandler("seekto", (s2) => { | |
| 832 | - s2.seekTime !== null && this.seekTo(s2.seekTime); | |
| 944 | + }), navigator.mediaSession.setActionHandler("seekto", (s) => { | |
| 945 | + s.seekTime !== null && this.seekTo(s.seekTime); | |
| 833 | 946 | }); |
| 834 | - let t2 = this.options.onNextTrack, i2 = this.options.onPreviousTrack; | |
| 947 | + let t = this.options.onNextTrack, i = this.options.onPreviousTrack; | |
| 835 | 948 | try { |
| 836 | - navigator.mediaSession.setActionHandler("nexttrack", typeof t2 == "function" ? () => t2(this) : null); | |
| 949 | + navigator.mediaSession.setActionHandler("nexttrack", typeof t == "function" ? () => t(this) : null); | |
| 837 | 950 | } catch { |
| 838 | 951 | } |
| 839 | 952 | try { |
| 840 | - navigator.mediaSession.setActionHandler("previoustrack", typeof i2 == "function" ? () => i2(this) : null); | |
| 953 | + navigator.mediaSession.setActionHandler("previoustrack", typeof i == "function" ? () => i(this) : null); | |
| 841 | 954 | } catch { |
| 842 | 955 | } |
| 843 | 956 | } |
| 844 | 957 | _applyMediaMetadata() { |
| @@ -843,49 +956,49 @@ | ||
| 843 | 956 | } |
| 844 | 957 | _applyMediaMetadata() { |
| 845 | 958 | !("mediaSession" in navigator) || !this.options.enableMediaSession || (navigator.mediaSession.metadata = new MediaMetadata({ title: this.options.title || this.options.unknownTrackText, artist: this.options.artist || "", album: this.options.album || "", artwork: this.options.artwork ? [{ src: this.options.artwork, sizes: "512x512", type: "image/jpeg" }] : [] })); |
| 846 | 959 | } |
| 847 | - _updateMediaSession(t2) { | |
| 960 | + _updateMediaSession(t) { | |
| 848 | 961 | if (!(!("mediaSession" in navigator) || !this.options.enableMediaSession || !this.audio)) try { |
| 849 | - t2 === "playing" && this.initMediaSession(), navigator.mediaSession.playbackState = t2; | |
| 850 | - let i2 = this.audio.duration; | |
| 851 | - navigator.mediaSession.setPositionState && i2 && isFinite(i2) && navigator.mediaSession.setPositionState({ duration: i2, playbackRate: this.audio.playbackRate || 1, position: m2(this.audio.currentTime, 0, i2) }); | |
| 962 | + t === "playing" && this.initMediaSession(), navigator.mediaSession.playbackState = t; | |
| 963 | + let i = this.audio.duration; | |
| 964 | + navigator.mediaSession.setPositionState && i && isFinite(i) && navigator.mediaSession.setPositionState({ duration: i, playbackRate: this.audio.playbackRate || 1, position: m2(this.audio.currentTime, 0, i) }); | |
| 852 | 965 | } catch { |
| 853 | 966 | } |
| 854 | 967 | } |
| 855 | 968 | bindEvents() { |
| 856 | - this.playBtn && this.playBtn.addEventListener("click", () => this.togglePlay()), this.audio && (this.audio.addEventListener("loadstart", () => this.setLoading(true)), this.audio.addEventListener("loadedmetadata", () => this.onMetadataLoaded()), this.audio.addEventListener("canplay", () => this.setLoading(false)), this.audio.addEventListener("play", () => this.onPlay()), this.audio.addEventListener("pause", () => this.onPause()), this.audio.addEventListener("ended", () => this.onEnded()), this.audio.addEventListener("error", (i2) => this.onError(i2))), this.canvas.addEventListener("click", (i2) => this.handleCanvasClick(i2)), this._dragging = false, this._seekHover = false, this._handleNear = false, this.canvas.addEventListener("pointerenter", () => { | |
| 969 | + this.playBtn && this.playBtn.addEventListener("click", () => this.togglePlay()), this.audio && (this.audio.addEventListener("loadstart", () => this.setLoading(true)), this.audio.addEventListener("loadedmetadata", () => this.onMetadataLoaded()), this.audio.addEventListener("canplay", () => this.setLoading(false)), this.audio.addEventListener("play", () => this.onPlay()), this.audio.addEventListener("pause", () => this.onPause()), this.audio.addEventListener("ended", () => this.onEnded()), this.audio.addEventListener("error", (i) => this.onError(i))), this.canvas.addEventListener("click", (i) => this.handleCanvasClick(i)), this._dragging = false, this._seekHover = false, this._handleNear = false, this.canvas.addEventListener("pointerenter", () => { | |
| 857 | 970 | this._seekHover = true, this.drawWaveform(), this._updateSeekHandle(); |
| 858 | 971 | }), this.canvas.addEventListener("pointerleave", () => { |
| 859 | 972 | this._seekHover = false, this._handleNear = false, this._dragging || this._hideHoverTip(), this.drawWaveform(), this._updateSeekHandle(); |
| 860 | - }), this.canvas.addEventListener("pointerdown", (i2) => { | |
| 861 | - if (!(i2.pointerType === "mouse" && i2.button !== 0)) { | |
| 973 | + }), this.canvas.addEventListener("pointerdown", (i) => { | |
| 974 | + if (!(i.pointerType === "mouse" && i.button !== 0)) { | |
| 862 | 975 | this._dragging = true; |
| 863 | 976 | try { |
| 864 | - this.canvas.setPointerCapture(i2.pointerId); | |
| 977 | + this.canvas.setPointerCapture(i.pointerId); | |
| 865 | 978 | } catch { |
| 866 | 979 | } |
| 867 | - this._scrubTo(i2.clientX); | |
| 980 | + this._scrubTo(i.clientX); | |
| 868 | 981 | } |
| 869 | - }), this.canvas.addEventListener("pointermove", (i2) => { | |
| 982 | + }), this.canvas.addEventListener("pointermove", (i) => { | |
| 870 | 983 | if (this._dragging) { |
| 871 | - this._scrubTo(i2.clientX); | |
| 984 | + this._scrubTo(i.clientX); | |
| 872 | 985 | return; |
| 873 | 986 | } |
| 874 | - let s2 = this.canvas.getBoundingClientRect(); | |
| 875 | - s2.width && (this._handleNear = Math.abs(i2.clientX - s2.left - this.progress * s2.width) <= 10, this._updateSeekHandle()); | |
| 987 | + let s = this.canvas.getBoundingClientRect(); | |
| 988 | + s.width && (this._handleNear = Math.abs(i.clientX - s.left - this.progress * s.width) <= 10, this._updateSeekHandle()); | |
| 876 | 989 | }); |
| 877 | - let t2 = (i2) => { | |
| 990 | + let t = (i) => { | |
| 878 | 991 | if (this._dragging) { |
| 879 | 992 | this._dragging = false, this._suppressClick = true; |
| 880 | 993 | try { |
| 881 | - this.canvas.releasePointerCapture(i2.pointerId); | |
| 994 | + this.canvas.releasePointerCapture(i.pointerId); | |
| 882 | 995 | } catch { |
| 883 | 996 | } |
| 884 | - this._seekFromPointer(i2.clientX), !this._seekHover && !this.options.showHoverTime && this._hideHoverTip(), this._updateSeekHandle(); | |
| 997 | + this._seekFromPointer(i.clientX), !this._seekHover && !this.options.showHoverTime && this._hideHoverTip(), this._updateSeekHandle(); | |
| 885 | 998 | } |
| 886 | 999 | }; |
| 887 | - this.canvas.addEventListener("pointerup", t2), this.canvas.addEventListener("pointercancel", t2), this.setupHoverTime(), this.setupSeekHandle(), this.resizeHandler = G(() => this.resizeCanvas(), 100), window.addEventListener("resize", this.resizeHandler); | |
| 1000 | + this.canvas.addEventListener("pointerup", t), this.canvas.addEventListener("pointercancel", t), this.setupHoverTime(), this.setupSeekHandle(), this.resizeHandler = ht(() => this.resizeCanvas(), 100), window.addEventListener("resize", this.resizeHandler); | |
| 888 | 1001 | } |
| 889 | 1002 | setupResizeObserver() { |
| 890 | 1003 | "ResizeObserver" in window && (this.resizeObserver = new ResizeObserver(() => { |
| 891 | 1004 | this.resizeCanvas(); |
| @@ -890,162 +1003,160 @@ | ||
| 890 | 1003 | "ResizeObserver" in window && (this.resizeObserver = new ResizeObserver(() => { |
| 891 | 1004 | this.resizeCanvas(); |
| 892 | 1005 | }), this.canvas?.parentElement && this.resizeObserver.observe(this.canvas.parentElement)); |
| 893 | 1006 | } |
| 894 | - async load(t2) { | |
| 1007 | + async load(t) { | |
| 895 | 1008 | try { |
| 896 | - this.setLoading(true), this.progress = 0, this.hasError = false, this.audio && (this.audio.src = t2, await new Promise((s2, r2) => { | |
| 897 | - let a2 = () => { | |
| 898 | - this.audio.removeEventListener("loadedmetadata", a2), this.audio.removeEventListener("error", o2), s2(); | |
| 899 | - }, o2 = (l2) => { | |
| 900 | - this.audio.removeEventListener("loadedmetadata", a2), this.audio.removeEventListener("error", o2), r2(l2); | |
| 1009 | + this.setLoading(true), this.progress = 0, this.hasError = false, this.container.classList.remove("waveform-is-placeholder"); | |
| 1010 | + let i = !!this.options.waveform; | |
| 1011 | + i && this.setWaveformData(this.options.waveform); | |
| 1012 | + let s = this.options.title || I(t); | |
| 1013 | + if (this.titleEl && (this.titleEl.textContent = s), this.applySeekLabel(s), this.audio && (this.audio.src = t, this.audio.preload !== "none" && await new Promise((r, a) => { | |
| 1014 | + let o = () => { | |
| 1015 | + this.audio.removeEventListener("loadedmetadata", o), this.audio.removeEventListener("error", n), r(); | |
| 1016 | + }, n = (l2) => { | |
| 1017 | + this.audio.removeEventListener("loadedmetadata", o), this.audio.removeEventListener("error", n), a(l2); | |
| 901 | 1018 | }; |
| 902 | - this.audio.addEventListener("loadedmetadata", a2), this.audio.addEventListener("error", o2); | |
| 903 | - })); | |
| 904 | - let i2 = this.options.title || R(t2); | |
| 905 | - if (this.titleEl && (this.titleEl.textContent = i2), this.applySeekLabel(i2), this.options.waveform) this.setWaveformData(this.options.waveform); | |
| 906 | - else try { | |
| 907 | - let s2 = await $2(t2, this.options.samples, this.options.showBPM); | |
| 908 | - this.waveformData = s2.peaks, s2.bpm && (this.detectedBPM = s2.bpm, this.updateBPMDisplay()); | |
| 909 | - } catch (s2) { | |
| 910 | - console.warn("[WaveformPlayer] Using placeholder waveform:", s2), this.waveformData = tt(this.options.samples); | |
| 1019 | + this.audio.addEventListener("loadedmetadata", o), this.audio.addEventListener("error", n); | |
| 1020 | + })), !i) try { | |
| 1021 | + let r = await G(t, this.options.samples, this.options.showBPM); | |
| 1022 | + this.waveformData = r.peaks, r.bpm && (this.detectedBPM = r.bpm, this.updateBPMDisplay()); | |
| 1023 | + } catch (r) { | |
| 1024 | + console.warn("[WaveformPlayer] Using placeholder waveform:", r), this.waveformData = yt(this.options.samples), this.container.classList.add("waveform-is-placeholder"); | |
| 911 | 1025 | } |
| 912 | 1026 | this.drawWaveform(), this.renderMarkers(), this.options.onLoad && this.options.onLoad(this); |
| 913 | - } catch (i2) { | |
| 914 | - this.onError(i2); | |
| 1027 | + } catch (i) { | |
| 1028 | + this.onError(i); | |
| 915 | 1029 | } finally { |
| 916 | 1030 | this.setLoading(false); |
| 917 | 1031 | } |
| 918 | 1032 | } |
| 919 | - async loadTrack(t2, i2 = null, s2 = null, r2 = {}) { | |
| 920 | - let a2 = Object.prototype.hasOwnProperty.call(r2, "artwork"), o2 = Object.prototype.hasOwnProperty.call(r2, "artworkAlt"); | |
| 921 | - this.isPlaying && this.pause(), this.audio && (this.audio.src = "", this.audio.load()), this.hasError = false, this.errorEl && (this.errorEl.style.display = "none"), this.canvas && (this.canvas.style.opacity = "1"), this.playBtn && (this.playBtn.disabled = false), this.progress = 0, this.waveformData = [], this.options = O(this.options, { url: t2, title: i2 === null ? this.options.title : i2, artist: s2 === null ? this.options.artist : s2, ...r2 }), a2 && (this.options.artwork = r2.artwork || null), o2 ? this.options.artworkAlt = r2.artworkAlt || "" : a2 && (this.options.artworkAlt = this.options.artwork ? z.artworkAlt : ""), r2.preload && this.audio && (this.audio.preload = r2.preload), r2.crossOrigin && this.audio && (this.audio.crossOrigin = r2.crossOrigin), s2 !== null && this.syncArtist(s2), (a2 || o2) && this.syncArtwork(a2 ? r2.artwork : this.options.artwork, o2 ? r2.artworkAlt : this.options.artworkAlt), this.options.markers = r2.markers || [], this.options.waveform = r2.waveform || null, await this.load(t2), r2.autoplay !== false && this.play()?.catch(() => { | |
| 1033 | + async loadTrack(t, i = null, s = null, r = {}) { | |
| 1034 | + let a = Object.prototype.hasOwnProperty.call(r, "artwork"), o = Object.prototype.hasOwnProperty.call(r, "artworkAlt"); | |
| 1035 | + this.isPlaying && this.pause(), this.audio && (this.audio.src = "", this.audio.load()), this.hasError = false, this.errorEl && (this.errorEl.style.display = "none"), this.canvas && (this.canvas.style.opacity = "1"), this.playBtn && (this.playBtn.disabled = false), this.progress = 0, this.waveformData = [], this.options = Z(j2(this.options, { url: t, title: i === null ? this.options.title : i, artist: s === null ? this.options.artist : s, ...r })), a && (this.options.artwork = r.artwork || null), o ? this.options.artworkAlt = r.artworkAlt || "" : a && (this.options.artworkAlt = this.options.artwork ? W.artworkAlt : ""), r.preload && this.audio && (this.audio.preload = this.options.preload), r.crossOrigin && this.audio && (this.audio.crossOrigin = this.options.crossOrigin), s !== null && this.syncArtist(s), (a || o) && this.syncArtwork(a ? r.artwork : this.options.artwork, o ? r.artworkAlt : this.options.artworkAlt), this.options.markers = r.markers ? z(r.markers) : [], this.options.waveform = r.waveform || null, await this.load(t), r.autoplay !== false && this.play()?.catch(() => { | |
| 922 | 1036 | }); |
| 923 | 1037 | } |
| 924 | - setWaveformData(t2) { | |
| 925 | - if (typeof t2 == "string" && t2.trim().endsWith(".json")) { | |
| 926 | - fetch(t2.trim()).then((i2) => i2.json()).then((i2) => { | |
| 927 | - this.waveformData = Array.isArray(i2) ? i2 : i2.peaks || [], i2.markers && !this.options.markers?.length && (this.options.markers = i2.markers, this.renderMarkers()), this.drawWaveform(); | |
| 1038 | + setWaveformData(t) { | |
| 1039 | + if (typeof t == "string" && t.trim().endsWith(".json")) { | |
| 1040 | + fetch(t.trim()).then((i) => i.json()).then((i) => { | |
| 1041 | + this.waveformData = Array.isArray(i) ? i : i.peaks || [], i.markers && !this.options.markers?.length && (this.options.markers = z(i.markers), this.renderMarkers()), this.drawWaveform(); | |
| 928 | 1042 | }).catch(() => { |
| 929 | 1043 | }); |
| 930 | 1044 | return; |
| 931 | 1045 | } |
| 932 | - if (typeof t2 == "string") try { | |
| 933 | - let i2 = JSON.parse(t2); | |
| 934 | - this.waveformData = Array.isArray(i2) ? i2 : []; | |
| 935 | - } catch { | |
| 936 | - this.waveformData = t2.split(",").map(Number); | |
| 937 | - } | |
| 938 | - else this.waveformData = Array.isArray(t2) ? t2 : []; | |
| 939 | - this.drawWaveform(); | |
| 1046 | + this.waveformData = D(t, { fallback: [] }), this.drawWaveform(); | |
| 940 | 1047 | } |
| 941 | 1048 | drawWaveform() { |
| 942 | - !this.ctx || this.waveformData.length === 0 || Q(this.ctx, this.canvas, this.waveformData, this.progress, { ...this.options, waveformStyle: this.options.waveformStyle || "bars", color: this.options.waveformColor, progressColor: this.options.progressColor, seekActive: this._seekHover || this._dragging }); | |
| 1049 | + !this.ctx || this.waveformData.length === 0 || ft(this.ctx, this.canvas, this.waveformData, this.progress, { ...this.options, waveformStyle: this.options.waveformStyle || "bars", color: this.options.waveformColor, progressColor: this.options.progressColor, seekActive: this._seekHover || this._dragging }); | |
| 943 | 1050 | } |
| 944 | 1051 | resizeCanvas() { |
| 945 | 1052 | if (!this.canvas || this.isDestroying) return; |
| 946 | - let t2 = window.devicePixelRatio || 1, i2 = this.canvas.parentElement.getBoundingClientRect(); | |
| 947 | - this.canvas.width = i2.width * t2, this.canvas.height = this.options.height * t2, this.canvas.parentElement.style.height = this.options.height + "px", this.drawWaveform(); | |
| 1053 | + let t = window.devicePixelRatio || 1, i = this.canvas.parentElement.getBoundingClientRect(); | |
| 1054 | + this.canvas.width = i.width * t, this.canvas.height = this.options.height * t, this.canvas.parentElement.style.height = this.options.height + "px", this.drawWaveform(); | |
| 948 | 1055 | } |
| 949 | 1056 | renderMarkers() { |
| 950 | 1057 | if (!this.markersContainer || (this.markersContainer.innerHTML = "", this._activeMarkerIndex = -1, clearTimeout(this._markerLabelTimer), !this.options.showMarkers || !this.options.markers?.length)) return; |
| 951 | - let t2 = this.getSeekDuration(); | |
| 952 | - t2 && this.options.markers.forEach((i2, s2) => { | |
| 953 | - if (i2.time > t2) { | |
| 954 | - console.warn(`[WaveformPlayer] Marker "${i2.label}" at ${i2.time}s exceeds audio duration of ${t2}s`); | |
| 1058 | + let t = this.getSeekDuration(); | |
| 1059 | + t && this.options.markers.forEach((i, s) => { | |
| 1060 | + if (i.time > t) { | |
| 1061 | + console.warn(`[WaveformPlayer] Marker "${i.label}" at ${i.time}s exceeds audio duration of ${t}s`); | |
| 955 | 1062 | return; |
| 956 | 1063 | } |
| 957 | - let r2 = i2.time / t2 * 100, a2 = document.createElement("button"); | |
| 958 | - a2.className = "waveform-marker", a2.style.left = `${r2}%`, a2.style.backgroundColor = i2.color || "rgba(255, 255, 255, 0.5)", a2.setAttribute("aria-label", i2.label), a2.setAttribute("data-time", i2.time); | |
| 959 | - let o2 = document.createElement("span"); | |
| 960 | - o2.className = "waveform-marker-tooltip", o2.textContent = i2.label, a2.appendChild(o2), a2.addEventListener("click", (l2) => { | |
| 961 | - l2.stopPropagation(), this.seekTo(i2.time), this.options.playOnSeek && !this.isPlaying && this.play(); | |
| 962 | - }), this.markersContainer.appendChild(a2); | |
| 1064 | + let r = i.time / t * 100, a = document.createElement("button"); | |
| 1065 | + a.className = "waveform-marker", a.style.left = `${r}%`, a.style.backgroundColor = i.color || "rgba(255, 255, 255, 0.5)", a.setAttribute("aria-label", i.label), a.setAttribute("data-time", i.time); | |
| 1066 | + let o = document.createElement("span"); | |
| 1067 | + o.className = "waveform-marker-tooltip", o.textContent = i.label, a.appendChild(o), a.addEventListener("click", (n) => { | |
| 1068 | + n.stopPropagation(), this.seekTo(i.time), this.options.playOnSeek && !this.isPlaying && this.play(); | |
| 1069 | + }), this.markersContainer.appendChild(a); | |
| 963 | 1070 | }); |
| 964 | 1071 | } |
| 965 | - setActiveMarker(t2) { | |
| 1072 | + setActiveMarker(t) { | |
| 966 | 1073 | if (!this.markersContainer) return; |
| 967 | - this.markersContainer.querySelectorAll(".waveform-marker").forEach((s2, r2) => s2.classList.toggle("active", r2 === t2)); | |
| 1074 | + this.markersContainer.querySelectorAll(".waveform-marker").forEach((s, r) => s.classList.toggle("active", r === t)); | |
| 968 | 1075 | } |
| 969 | 1076 | updateActiveMarker() { |
| 970 | 1077 | if (!this.markersContainer) return; |
| 971 | - let t2 = this.markersContainer.querySelectorAll(".waveform-marker"); | |
| 972 | - if (!t2.length) return; | |
| 973 | - let i2 = this.getSeekDuration(), s2 = i2 ? this.progress * i2 : 0, r2 = -1, a2 = -1 / 0; | |
| 974 | - t2.forEach((o2, l2) => { | |
| 975 | - let n2 = parseFloat(o2.getAttribute("data-time")); | |
| 976 | - Number.isFinite(n2) && n2 <= s2 + 0.05 && n2 > a2 && (a2 = n2, r2 = l2); | |
| 977 | - }), r2 !== this._activeMarkerIndex && (this._activeMarkerIndex = r2, this.setActiveMarker(r2), clearTimeout(this._markerLabelTimer), t2.forEach((o2, l2) => o2.classList.toggle("show-label", l2 === r2)), r2 >= 0 && (this._markerLabelTimer = setTimeout(() => { | |
| 978 | - this.markersContainer?.querySelectorAll(".waveform-marker").forEach((o2) => o2.classList.remove("show-label")); | |
| 1078 | + let t = this.markersContainer.querySelectorAll(".waveform-marker"); | |
| 1079 | + if (!t.length) return; | |
| 1080 | + let i = this.getSeekDuration(), s = i ? this.progress * i : 0, r = -1, a = -1 / 0; | |
| 1081 | + t.forEach((o, n) => { | |
| 1082 | + let l2 = parseFloat(o.getAttribute("data-time")); | |
| 1083 | + Number.isFinite(l2) && l2 <= s + 0.05 && l2 > a && (a = l2, r = n); | |
| 1084 | + }), r !== this._activeMarkerIndex && (this._activeMarkerIndex = r, this.setActiveMarker(r), clearTimeout(this._markerLabelTimer), t.forEach((o, n) => o.classList.toggle("show-label", n === r)), r >= 0 && (this._markerLabelTimer = setTimeout(() => { | |
| 1085 | + this.markersContainer?.querySelectorAll(".waveform-marker").forEach((o) => o.classList.remove("show-label")); | |
| 979 | 1086 | }, 2500))); |
| 980 | 1087 | } |
| 981 | 1088 | setupHoverTime() { |
| 982 | 1089 | if (!this.seekEl) return; |
| 983 | - let t2 = document.createElement("div"); | |
| 984 | - t2.className = "waveform-hover-time", t2.setAttribute("aria-hidden", "true"), this.seekEl.appendChild(t2), this.hoverTimeEl = t2, this.options.showHoverTime && (this.seekEl.addEventListener("pointermove", (i2) => { | |
| 985 | - this._dragging || this._updateHoverTip(i2.clientX); | |
| 1090 | + let t = document.createElement("div"); | |
| 1091 | + t.className = "waveform-hover-time", t.setAttribute("aria-hidden", "true"), this.seekEl.appendChild(t), this.hoverTimeEl = t, this.options.showHoverTime && (this.seekEl.addEventListener("pointermove", (i) => { | |
| 1092 | + this._dragging || this._updateHoverTip(i.clientX); | |
| 986 | 1093 | }), this.seekEl.addEventListener("pointerleave", () => { |
| 987 | 1094 | this._dragging || this._hideHoverTip(); |
| 988 | 1095 | })); |
| 989 | 1096 | } |
| 990 | - _updateHoverTip(t2) { | |
| 991 | - let i2 = this.hoverTimeEl; | |
| 992 | - if (!i2) return; | |
| 993 | - let s2 = this.getSeekDuration(); | |
| 994 | - if (!s2) { | |
| 995 | - i2.style.opacity = "0"; | |
| 1097 | + _updateHoverTip(t) { | |
| 1098 | + let i = this.hoverTimeEl; | |
| 1099 | + if (!i) return; | |
| 1100 | + let s = this.getSeekDuration(); | |
| 1101 | + if (!s) { | |
| 1102 | + i.style.opacity = "0"; | |
| 996 | 1103 | return; |
| 997 | 1104 | } |
| 998 | - let r2 = this.canvas.getBoundingClientRect(), a2 = m2((t2 - r2.left) / r2.width); | |
| 999 | - i2.textContent = E(a2 * s2), i2.style.left = a2 * 100 + "%", i2.style.opacity = "1"; | |
| 1105 | + let r = this.canvas.getBoundingClientRect(), a = m2((t - r.left) / r.width); | |
| 1106 | + i.textContent = E2(a * s), i.style.left = a * 100 + "%", i.style.opacity = "1"; | |
| 1000 | 1107 | } |
| 1001 | 1108 | _hideHoverTip() { |
| 1002 | 1109 | this.hoverTimeEl && (this.hoverTimeEl.style.opacity = "0"); |
| 1003 | 1110 | } |
| 1004 | - _scrubTo(t2) { | |
| 1005 | - let i2 = this.canvas.getBoundingClientRect(); | |
| 1006 | - if (!i2.width) return; | |
| 1007 | - this.progress = m2((t2 - i2.left) / i2.width), this.drawWaveform(), this._updateSeekHandle(); | |
| 1008 | - let s2 = this.getSeekDuration(); | |
| 1009 | - s2 && this.currentTimeEl ? (this.currentTimeEl.textContent = E(this.progress * s2), this._hideHoverTip()) : this._updateHoverTip(t2); | |
| 1111 | + _scrubTo(t) { | |
| 1112 | + let i = this.canvas.getBoundingClientRect(); | |
| 1113 | + if (!i.width) return; | |
| 1114 | + this.progress = m2((t - i.left) / i.width), this.drawWaveform(), this._updateSeekHandle(); | |
| 1115 | + let s = this.getSeekDuration(); | |
| 1116 | + s && this.currentTimeEl ? (this.currentTimeEl.textContent = E2(this.progress * s), this._hideHoverTip()) : this._updateHoverTip(t); | |
| 1010 | 1117 | } |
| 1011 | 1118 | setupSeekHandle() { |
| 1012 | 1119 | if (!this.options.seekHandle || this.options.waveformStyle !== "seekbar" || !this.seekEl) return; |
| 1013 | - let t2 = document.createElement("div"); | |
| 1014 | - t2.className = "waveform-seek-handle", t2.setAttribute("aria-hidden", "true"), this.seekEl.appendChild(t2), this.seekHandleEl = t2; | |
| 1120 | + let t = document.createElement("div"); | |
| 1121 | + t.className = "waveform-seek-handle", t.setAttribute("aria-hidden", "true"), this.seekEl.appendChild(t), this.seekHandleEl = t; | |
| 1015 | 1122 | } |
| 1016 | 1123 | _updateSeekHandle() { |
| 1017 | - let t2 = this.seekHandleEl; | |
| 1018 | - t2 && (t2.style.left = this.progress * 100 + "%", t2.classList.toggle("is-visible", this._seekHover || this._dragging), t2.classList.toggle("is-active", this._dragging || this._handleNear)); | |
| 1124 | + let t = this.seekHandleEl; | |
| 1125 | + t && (t.style.left = this.progress * 100 + "%", t.classList.toggle("is-visible", this._seekHover || this._dragging), t.classList.toggle("is-active", this._dragging || this._handleNear)); | |
| 1019 | 1126 | } |
| 1020 | - handleCanvasClick(t2) { | |
| 1127 | + handleCanvasClick(t) { | |
| 1021 | 1128 | if (this._suppressClick) { |
| 1022 | 1129 | this._suppressClick = false; |
| 1023 | 1130 | return; |
| 1024 | 1131 | } |
| 1025 | - this._seekFromPointer(t2.clientX); | |
| 1132 | + this._seekFromPointer(t.clientX); | |
| 1026 | 1133 | } |
| 1027 | - _seekFromPointer(t2) { | |
| 1028 | - let i2 = this.canvas.getBoundingClientRect(); | |
| 1029 | - if (!i2.width) return; | |
| 1030 | - let s2 = m2((t2 - i2.left) / i2.width); | |
| 1134 | + _seekFromPointer(t) { | |
| 1135 | + let i = this.canvas.getBoundingClientRect(); | |
| 1136 | + if (!i.width) return; | |
| 1137 | + let s = m2((t - i.left) / i.width); | |
| 1031 | 1138 | if (this.options.audioMode === "external") { |
| 1032 | - this._requestSeek(s2); | |
| 1139 | + this._requestSeek(s); | |
| 1033 | 1140 | return; |
| 1034 | 1141 | } |
| 1035 | - !this.audio || !this.audio.duration || this.seekToPercent(s2); | |
| 1142 | + !this.audio || !this.audio.duration || this.seekToPercent(s); | |
| 1036 | 1143 | } |
| 1037 | - setLoading(t2) { | |
| 1038 | - this.isLoading = t2, this.loadingEl && (this.loadingEl.style.display = t2 ? "block" : "none"), this.seekEl && this.seekEl.setAttribute("aria-busy", t2 ? "true" : "false"); | |
| 1144 | + setLoading(t) { | |
| 1145 | + if (this.isLoading = t, this.loadingEl) { | |
| 1146 | + let i = t && this.waveformData.length === 0; | |
| 1147 | + this.loadingEl.style.display = i ? "block" : "none"; | |
| 1148 | + } | |
| 1149 | + this.seekEl && this.seekEl.setAttribute("aria-busy", t ? "true" : "false"); | |
| 1039 | 1150 | } |
| 1040 | 1151 | onMetadataLoaded() { |
| 1041 | - this.isDestroying || (this.totalTimeEl && (this.totalTimeEl.textContent = E(this.audio.duration)), this.renderMarkers(), this.updateSeekAccessibility()); | |
| 1152 | + this.isDestroying || (this.totalTimeEl && (this.totalTimeEl.textContent = E2(this.audio.duration)), this.renderMarkers(), this.updateSeekAccessibility()); | |
| 1042 | 1153 | } |
| 1043 | - setPlayButtonState(t2) { | |
| 1154 | + setPlayButtonState(t) { | |
| 1044 | 1155 | if (!this.playBtn) return; |
| 1045 | - this.playBtn.classList.toggle("playing", t2); | |
| 1046 | - let i2 = this.playBtn.querySelector(".waveform-icon-play"), s2 = this.playBtn.querySelector(".waveform-icon-pause"); | |
| 1047 | - i2 && (i2.style.display = t2 ? "none" : "flex"), s2 && (s2.style.display = t2 ? "flex" : "none"); | |
| 1156 | + this.playBtn.classList.toggle("playing", t); | |
| 1157 | + let i = this.playBtn.querySelector(".waveform-icon-play"), s = this.playBtn.querySelector(".waveform-icon-pause"); | |
| 1158 | + i && (i.style.display = t ? "none" : "flex"), s && (s.style.display = t ? "flex" : "none"); | |
| 1048 | 1159 | } |
| 1049 | 1160 | onPlay() { |
| 1050 | 1161 | this.isDestroying || (this.isPlaying = true, this.setPlayButtonState(true), this.startSmoothUpdate(), this._updateMediaSession("playing"), this._emit("waveformplayer:play", { player: this, url: this.options.url }), this.options.onPlay && this.options.onPlay(this)); |
| 1051 | 1162 | } |
| @@ -1053,20 +1164,20 @@ | ||
| 1053 | 1164 | this.isDestroying || (this.isPlaying = false, this.setPlayButtonState(false), this.stopSmoothUpdate(), this._updateMediaSession("paused"), this._emit("waveformplayer:pause", { player: this, url: this.options.url }), this.options.onPause && this.options.onPause(this)); |
| 1054 | 1165 | } |
| 1055 | 1166 | onEnded() { |
| 1056 | 1167 | if (this.isDestroying) return; |
| 1057 | - let t2 = this.audio.duration; | |
| 1058 | - this.progress = 0, this.audio.currentTime = 0, this.drawWaveform(), this.currentTimeEl && (this.currentTimeEl.textContent = "0:00"), this._emit("waveformplayer:ended", { player: this, url: this.options.url, currentTime: t2, duration: t2 }), this.onPause(), this.options.onEnd && this.options.onEnd(this); | |
| 1168 | + let t = this.audio.duration; | |
| 1169 | + this.progress = 0, this.audio.currentTime = 0, this.drawWaveform(), this.currentTimeEl && (this.currentTimeEl.textContent = "0:00"), this._emit("waveformplayer:ended", { player: this, url: this.options.url, currentTime: t, duration: t }), this.onPause(), this.options.onEnd && this.options.onEnd(this); | |
| 1059 | 1170 | } |
| 1060 | - onError(t2) { | |
| 1061 | - this.isDestroying || (console.error("[WaveformPlayer] Audio error:", t2), this.hasError = true, this.setLoading(false), this.errorEl && (this.errorEl.style.display = "flex"), this.canvas && (this.canvas.style.opacity = "0.2"), this.playBtn && (this.playBtn.disabled = true), this.options.onError && this.options.onError(t2, this)); | |
| 1171 | + onError(t) { | |
| 1172 | + this.isDestroying || (console.error("[WaveformPlayer] Audio error:", t), this.hasError = true, this.setLoading(false), this.errorEl && (this.errorEl.style.display = "flex"), this.canvas && (this.canvas.style.opacity = "0.2"), this.playBtn && (this.playBtn.disabled = true), this.options.onError && this.options.onError(t, this)); | |
| 1062 | 1173 | } |
| 1063 | 1174 | startSmoothUpdate() { |
| 1064 | 1175 | this.stopSmoothUpdate(); |
| 1065 | - let t2 = () => { | |
| 1066 | - this.isPlaying && this.audio && this.audio.duration && (this.updateProgress(), this.updateTimer = requestAnimationFrame(t2)); | |
| 1176 | + let t = () => { | |
| 1177 | + this.isPlaying && this.audio && this.audio.duration && (this.updateProgress(), this.updateTimer = requestAnimationFrame(t)); | |
| 1067 | 1178 | }; |
| 1068 | - this.updateTimer = requestAnimationFrame(t2); | |
| 1179 | + this.updateTimer = requestAnimationFrame(t); | |
| 1069 | 1180 | } |
| 1070 | 1181 | stopSmoothUpdate() { |
| 1071 | 1182 | this.updateTimer && (cancelAnimationFrame(this.updateTimer), this.updateTimer = null); |
| 1072 | 1183 | } |
| @@ -1071,20 +1182,20 @@ | ||
| 1071 | 1182 | this.updateTimer && (cancelAnimationFrame(this.updateTimer), this.updateTimer = null); |
| 1072 | 1183 | } |
| 1073 | 1184 | updateProgress() { |
| 1074 | 1185 | if (!this.audio || !this.audio.duration || this._dragging) return; |
| 1075 | - let t2 = this.audio.currentTime / this.audio.duration; | |
| 1076 | - Math.abs(t2 - this.progress) > 1e-3 && (this.progress = t2, this.drawWaveform(), this._updateSeekHandle()), this.currentTimeEl && (this.currentTimeEl.textContent = E(this.audio.currentTime)), this._emit("waveformplayer:timeupdate", { player: this, currentTime: this.audio.currentTime, duration: this.audio.duration, progress: this.progress, url: this.options.url }), this.options.onTimeUpdate && this.options.onTimeUpdate(this.audio.currentTime, this.audio.duration, this), this.updateActiveMarker(), this.updateSeekAccessibility(); | |
| 1186 | + let t = this.audio.currentTime / this.audio.duration; | |
| 1187 | + Math.abs(t - this.progress) > 1e-3 && (this.progress = t, this.drawWaveform(), this._updateSeekHandle()), this.currentTimeEl && (this.currentTimeEl.textContent = E2(this.audio.currentTime)), this._emit("waveformplayer:timeupdate", { player: this, currentTime: this.audio.currentTime, duration: this.audio.duration, progress: this.progress, url: this.options.url }), this.options.onTimeUpdate && this.options.onTimeUpdate(this.audio.currentTime, this.audio.duration, this), this.updateActiveMarker(), this.updateSeekAccessibility(); | |
| 1077 | 1188 | } |
| 1078 | 1189 | updateBPMDisplay() { |
| 1079 | - let t2 = this.options.bpm || this.detectedBPM; | |
| 1080 | - this.bpmEl && this.bpmValueEl && t2 && (this.bpmValueEl.textContent = Math.round(t2), this.bpmEl.style.display = "inline-flex"); | |
| 1190 | + let t = this.options.bpm || this.detectedBPM; | |
| 1191 | + this.bpmEl && this.bpmValueEl && t && (this.bpmValueEl.textContent = Math.round(t), this.bpmEl.style.display = "inline-flex"); | |
| 1081 | 1192 | } |
| 1082 | 1193 | refreshTheme() { |
| 1083 | 1194 | if (!this._autoTheme) return; |
| 1084 | - this._scheme = H2(); | |
| 1085 | - let t2 = I(this.options.colorPreset); | |
| 1086 | - for (let i2 of this._presetKeys || []) i2 in t2 && (this.options[i2] = t2[i2]); | |
| 1195 | + this._scheme = R2(this.container); | |
| 1196 | + let t = J(this.options.colorPreset, this.container); | |
| 1197 | + for (let i of this._presetKeys || []) i in t && (this.options[i] = t[i]); | |
| 1087 | 1198 | this._applyThemeColors(); |
| 1088 | 1199 | } |
| 1089 | 1200 | _applyThemeColors() { |
| 1090 | 1201 | this.container.classList.toggle("waveform-theme-light", this._scheme === "light"), this.canvas && this.drawWaveform(); |
| @@ -1089,46 +1200,46 @@ | ||
| 1089 | 1200 | _applyThemeColors() { |
| 1090 | 1201 | this.container.classList.toggle("waveform-theme-light", this._scheme === "light"), this.canvas && this.drawWaveform(); |
| 1091 | 1202 | } |
| 1092 | 1203 | static _watchTheme() { |
| 1093 | - if (e2._themeWatch || typeof document > "u") return; | |
| 1094 | - let t2 = () => requestAnimationFrame(() => { | |
| 1095 | - e2.instances.forEach((a2) => { | |
| 1204 | + if (e._themeWatch || typeof document > "u") return; | |
| 1205 | + let t = () => requestAnimationFrame(() => { | |
| 1206 | + e.instances.forEach((a) => { | |
| 1096 | 1207 | try { |
| 1097 | - a2.refreshTheme(); | |
| 1208 | + a.refreshTheme(); | |
| 1098 | 1209 | } catch { |
| 1099 | 1210 | } |
| 1100 | 1211 | }); |
| 1101 | - }), i2 = { attributes: true, attributeFilter: ["class", "data-theme", "data-color-scheme", "style"] }, s2 = new MutationObserver(t2); | |
| 1102 | - s2.observe(document.documentElement, i2), document.body && s2.observe(document.body, i2); | |
| 1103 | - let r2 = null; | |
| 1212 | + }), i = { attributes: true, attributeFilter: ["class", "data-theme", "data-color-scheme", "style"] }, s = new MutationObserver(t); | |
| 1213 | + s.observe(document.documentElement, i), document.body && s.observe(document.body, i); | |
| 1214 | + let r = null; | |
| 1104 | 1215 | try { |
| 1105 | - r2 = window.matchMedia("(prefers-color-scheme: dark)"), r2.addEventListener("change", t2); | |
| 1216 | + r = window.matchMedia("(prefers-color-scheme: dark)"), r.addEventListener("change", t); | |
| 1106 | 1217 | } catch { |
| 1107 | 1218 | } |
| 1108 | - e2._themeWatch = { obs: s2, mq: r2, refresh: t2 }; | |
| 1219 | + e._themeWatch = { obs: s, mq: r, refresh: t }; | |
| 1109 | 1220 | } |
| 1110 | 1221 | updateSpeedUI() { |
| 1111 | 1222 | if (!this.audio) return; |
| 1112 | - let t2 = this.container.querySelector(".speed-value"); | |
| 1113 | - if (t2) { | |
| 1114 | - let i2 = this.audio.playbackRate; | |
| 1115 | - t2.textContent = i2 === 1 ? "1x" : `${i2}x`; | |
| 1223 | + let t = this.container.querySelector(".speed-value"); | |
| 1224 | + if (t) { | |
| 1225 | + let i = this.audio.playbackRate; | |
| 1226 | + t.textContent = i === 1 ? "1x" : `${i}x`; | |
| 1116 | 1227 | } |
| 1117 | - this.container.querySelectorAll(".speed-option").forEach((i2) => { | |
| 1118 | - let s2 = parseFloat(i2.dataset.rate) === this.audio.playbackRate; | |
| 1119 | - i2.classList.toggle("active", s2), i2.setAttribute("aria-checked", s2 ? "true" : "false"); | |
| 1228 | + this.container.querySelectorAll(".speed-option").forEach((i) => { | |
| 1229 | + let s = parseFloat(i.dataset.rate) === this.audio.playbackRate; | |
| 1230 | + i.classList.toggle("active", s), i.setAttribute("aria-checked", s ? "true" : "false"); | |
| 1120 | 1231 | }); |
| 1121 | 1232 | } |
| 1122 | 1233 | play() { |
| 1123 | - if (this.options.singlePlay && e2.currentlyPlaying && e2.currentlyPlaying !== this && e2.currentlyPlaying.pause(), this.options.audioMode === "external") { | |
| 1124 | - this._emit("waveformplayer:request-play", this._buildTrackDetail(), true).defaultPrevented || (e2.currentlyPlaying = this); | |
| 1234 | + if (this.options.singlePlay && e.currentlyPlaying && e.currentlyPlaying !== this && e.currentlyPlaying.pause(), this.options.audioMode === "external") { | |
| 1235 | + this._emit("waveformplayer:request-play", this._buildTrackDetail(), true).defaultPrevented || (e.currentlyPlaying = this); | |
| 1125 | 1236 | return; |
| 1126 | 1237 | } |
| 1127 | - return e2.currentlyPlaying = this, this.audio.play(); | |
| 1238 | + return e.currentlyPlaying = this, this.audio.play(); | |
| 1128 | 1239 | } |
| 1129 | 1240 | pause() { |
| 1130 | - if (e2.currentlyPlaying === this && (e2.currentlyPlaying = null), this.options.audioMode === "external") { | |
| 1241 | + if (e.currentlyPlaying === this && (e.currentlyPlaying = null), this.options.audioMode === "external") { | |
| 1131 | 1242 | this._emit("waveformplayer:request-pause", this._buildTrackDetail(), true); |
| 1132 | 1243 | return; |
| 1133 | 1244 | } |
| 1134 | 1245 | this.audio.pause(); |
| @@ -1135,80 +1246,83 @@ | ||
| 1135 | 1246 | } |
| 1136 | 1247 | _buildTrackDetail() { |
| 1137 | 1248 | return { url: this.options.url, title: this.options.title, artist: this.options.artist, artwork: this.options.artwork, markers: this.options.markers, waveform: this.options.waveform, id: this.id, player: this }; |
| 1138 | 1249 | } |
| 1139 | - setPlayingState(t2) { | |
| 1140 | - let i2 = this.isPlaying; | |
| 1141 | - this.isPlaying = !!t2, this.setPlayButtonState(this.isPlaying), this.isPlaying && !i2 ? (this.startSmoothUpdate?.(), this._emit("waveformplayer:play", { player: this, url: this.options.url }), this.options.onPlay && this.options.onPlay(this)) : !this.isPlaying && i2 && (this.stopSmoothUpdate?.(), this._emit("waveformplayer:pause", { player: this, url: this.options.url }), this.options.onPause && this.options.onPause(this)); | |
| 1250 | + setPlayingState(t) { | |
| 1251 | + let i = this.isPlaying; | |
| 1252 | + this.isPlaying = !!t, this.setPlayButtonState(this.isPlaying), this.isPlaying && !i ? (this.startSmoothUpdate?.(), this._emit("waveformplayer:play", { player: this, url: this.options.url }), this.options.onPlay && this.options.onPlay(this)) : !this.isPlaying && i && (this.stopSmoothUpdate?.(), this._emit("waveformplayer:pause", { player: this, url: this.options.url }), this.options.onPause && this.options.onPause(this)); | |
| 1142 | 1253 | } |
| 1143 | - setProgress(t2, i2) { | |
| 1144 | - !i2 || i2 <= 0 || (this.progress = m2(t2 / i2), this.currentTimeEl && (this.currentTimeEl.textContent = E(t2)), this._extDuration = i2, this.totalTimeEl && (!this.totalTimeEl.dataset._extSet || this.totalTimeEl.dataset._extDur !== String(i2)) && (this.totalTimeEl.textContent = E(i2), this.totalTimeEl.dataset._extSet = "1", this.totalTimeEl.dataset._extDur = String(i2)), this.drawWaveform?.(), this.updateActiveMarker(), this._emit("waveformplayer:timeupdate", { player: this, currentTime: t2, duration: i2, progress: this.progress, url: this.options.url }), this.options.onTimeUpdate && this.options.onTimeUpdate(t2, i2, this), this.progress >= 1 ? this._extEnded || (this._extEnded = true, this._emit("waveformplayer:ended", { player: this, url: this.options.url, currentTime: i2, duration: i2 }), this.options.onEnd && this.options.onEnd(this)) : this._extEnded = false, this.updateSeekAccessibility()); | |
| 1254 | + setProgress(t, i) { | |
| 1255 | + !i || i <= 0 || (this.progress = m2(t / i), this.currentTimeEl && (this.currentTimeEl.textContent = E2(t)), this._extDuration = i, this.totalTimeEl && (!this.totalTimeEl.dataset._extSet || this.totalTimeEl.dataset._extDur !== String(i)) && (this.totalTimeEl.textContent = E2(i), this.totalTimeEl.dataset._extSet = "1", this.totalTimeEl.dataset._extDur = String(i)), this.drawWaveform?.(), this.updateActiveMarker(), this._emit("waveformplayer:timeupdate", { player: this, currentTime: t, duration: i, progress: this.progress, url: this.options.url }), this.options.onTimeUpdate && this.options.onTimeUpdate(t, i, this), this.progress >= 1 ? this._extEnded || (this._extEnded = true, this._emit("waveformplayer:ended", { player: this, url: this.options.url, currentTime: i, duration: i }), this.options.onEnd && this.options.onEnd(this)) : this._extEnded = false, this.updateSeekAccessibility()); | |
| 1145 | 1256 | } |
| 1146 | 1257 | togglePlay() { |
| 1147 | 1258 | this.isPlaying ? this.pause() : this.play(); |
| 1148 | 1259 | } |
| 1149 | - seekTo(t2) { | |
| 1150 | - this.audio && this.audio.duration && (this.audio.currentTime = m2(t2, 0, this.audio.duration), this.updateProgress()); | |
| 1260 | + seekTo(t) { | |
| 1261 | + this.audio && this.audio.duration && (this.audio.currentTime = m2(t, 0, this.audio.duration), this.updateProgress()); | |
| 1151 | 1262 | } |
| 1152 | - seekToPercent(t2) { | |
| 1153 | - this.audio && this.audio.duration && (this.audio.currentTime = this.audio.duration * m2(t2), this.updateProgress()); | |
| 1263 | + seekToPercent(t) { | |
| 1264 | + this.audio && this.audio.duration && (this.audio.currentTime = this.audio.duration * m2(t), this.updateProgress()); | |
| 1154 | 1265 | } |
| 1155 | - setVolume(t2) { | |
| 1156 | - let i2 = Number(t2); | |
| 1157 | - this.audio && Number.isFinite(i2) && (this.audio.volume = m2(i2)); | |
| 1266 | + setVolume(t) { | |
| 1267 | + let i = Number(t); | |
| 1268 | + this.audio && Number.isFinite(i) && (this.audio.volume = m2(i)); | |
| 1158 | 1269 | } |
| 1159 | - setPlaybackRate(t2) { | |
| 1270 | + setPlaybackRate(t) { | |
| 1160 | 1271 | if (!this.audio) return; |
| 1161 | - let i2 = m2(t2, 0.5, 2); | |
| 1162 | - this.audio.playbackRate = i2, this.options.playbackRate = i2, this.updateSpeedUI(); | |
| 1272 | + let i = _(t, null, { min: N2, max: F }); | |
| 1273 | + i !== null && (this.audio.playbackRate = i, this.options.playbackRate = i, this.updateSpeedUI()); | |
| 1163 | 1274 | } |
| 1164 | 1275 | destroy() { |
| 1165 | - this.isDestroying = true, this._emit("waveformplayer:destroy", { player: this, url: this.options.url }), this.pause(), this.stopSmoothUpdate(), clearTimeout(this._markerLabelTimer), this._ac?.abort(), this.resizeObserver && (this.resizeObserver.disconnect(), this.resizeObserver = null), this.resizeHandler && (window.removeEventListener("resize", this.resizeHandler), this.resizeHandler = null), e2.instances.delete(this.id), e2.currentlyPlaying === this && (e2.currentlyPlaying = null), this.audio && (this.audio.pause(), this.audio.src = "", this.audio.load(), this.audio = null), this.container.innerHTML = "", this.canvas = null, this.ctx = null, this.playBtn = null, this.waveformData = []; | |
| 1276 | + this.isDestroying = true, this._emit("waveformplayer:destroy", { player: this, url: this.options.url }), this.pause(), this.stopSmoothUpdate(), clearTimeout(this._markerLabelTimer), this._ac?.abort(), this.resizeObserver && (this.resizeObserver.disconnect(), this.resizeObserver = null), this.resizeHandler && (window.removeEventListener("resize", this.resizeHandler), this.resizeHandler = null), e.instances.delete(this.id), e.currentlyPlaying === this && (e.currentlyPlaying = null), this.audio && (this.audio.pause(), this.audio.src = "", this.audio.load(), this.audio = null), this.container.innerHTML = "", delete this.container.dataset.waveformInitialized, this.canvas = null, this.ctx = null, this.playBtn = null, this.waveformData = []; | |
| 1166 | 1277 | } |
| 1167 | - static getInstance(t2) { | |
| 1168 | - if (typeof t2 == "string") { | |
| 1169 | - let i2 = this.instances.get(t2); | |
| 1170 | - if (i2) return i2; | |
| 1171 | - let s2 = document.getElementById(t2); | |
| 1172 | - if (s2) return Array.from(this.instances.values()).find((r2) => r2.container === s2); | |
| 1278 | + static getInstance(t) { | |
| 1279 | + if (typeof t == "string") { | |
| 1280 | + let i = this.instances.get(t); | |
| 1281 | + if (i) return i; | |
| 1282 | + let s = document.getElementById(t); | |
| 1283 | + if (s) return Array.from(this.instances.values()).find((r) => r.container === s); | |
| 1173 | 1284 | } |
| 1174 | - if (t2 instanceof HTMLElement) return Array.from(this.instances.values()).find((i2) => i2.container === t2); | |
| 1285 | + if (t instanceof HTMLElement) return Array.from(this.instances.values()).find((i) => i.container === t); | |
| 1175 | 1286 | } |
| 1176 | 1287 | static getAllInstances() { |
| 1177 | 1288 | return Array.from(this.instances.values()); |
| 1178 | 1289 | } |
| 1179 | 1290 | static destroyAll() { |
| 1180 | - this.instances.forEach((t2) => t2.destroy()), this.instances.clear(); | |
| 1291 | + this.instances.forEach((t) => t.destroy()), this.instances.clear(); | |
| 1181 | 1292 | } |
| 1182 | - static async generateWaveformData(t2, i2 = 1800) { | |
| 1293 | + static async generateWaveformData(t, i = 1800) { | |
| 1183 | 1294 | try { |
| 1184 | - return (await $2(t2, i2)).peaks; | |
| 1185 | - } catch (s2) { | |
| 1186 | - throw console.error("[WaveformPlayer] Failed to generate waveform:", s2), s2; | |
| 1295 | + return (await G(t, i)).peaks; | |
| 1296 | + } catch (s) { | |
| 1297 | + throw console.error("[WaveformPlayer] Failed to generate waveform:", s), s; | |
| 1187 | 1298 | } |
| 1188 | 1299 | } |
| 1189 | - static getPeaksUrl(t2) { | |
| 1190 | - if (!t2) return; | |
| 1191 | - let i2 = t2.replace(/\.(mp3|wav|ogg|flac|m4a|aac)(\?[^#]*)?(#.*)?$/i, ".json$2$3"); | |
| 1192 | - return i2 === t2 ? void 0 : i2; | |
| 1300 | + static getPeaksUrl(t) { | |
| 1301 | + if (!t) return; | |
| 1302 | + let i = t.replace(/\.(mp3|wav|ogg|flac|m4a|aac)(\?[^#]*)?(#.*)?$/i, ".json$2$3"); | |
| 1303 | + return i === t ? void 0 : i; | |
| 1193 | 1304 | } |
| 1194 | 1305 | }; |
| 1195 | -A.utils = { formatTime: E, extractTitleFromUrl: R, escapeHtml: S, isSafeHref: N2, parseDataAttributes: D }; | |
| 1196 | -var at = () => typeof window < "u" && typeof document < "u"; | |
| 1197 | -function wt() { | |
| 1198 | - if (!at()) return; | |
| 1199 | - document.querySelectorAll("[data-waveform-player]").forEach((t2) => { | |
| 1200 | - if (t2.dataset.waveformInitialized === "true" || A.getInstance(t2)) return; | |
| 1201 | - try { | |
| 1202 | - new A(t2), t2.dataset.waveformInitialized = "true"; | |
| 1203 | - } catch (i2) { | |
| 1204 | - console.error("[WaveformPlayer] Failed to initialize:", i2, t2); | |
| 1205 | - } | |
| 1206 | - }); | |
| 1306 | +T.utils = { formatTime: E2, extractTitleFromUrl: I, escapeHtml: S, isSafeHref: st, parseDataAttributes: O, detectColorScheme: R2 }; | |
| 1307 | +var et = () => typeof window < "u" && typeof document < "u"; | |
| 1308 | +var Nt = () => true; | |
| 1309 | +function kt(e2) { | |
| 1310 | + if (!(e2.dataset.waveformInitialized === "true" || T.getInstance(e2))) try { | |
| 1311 | + new T(e2), e2.dataset.waveformInitialized = "true"; | |
| 1312 | + } catch (t) { | |
| 1313 | + console.error("[WaveformPlayer] Failed to initialize:", t, e2); | |
| 1314 | + } | |
| 1207 | 1315 | } |
| 1208 | -A.init = wt; | |
| 1209 | -at() && (window.WaveformPlayer = A); | |
| 1210 | -var Bt = A; | |
| 1316 | +function tt(e2 = document) { | |
| 1317 | + if (!et()) return; | |
| 1318 | + let t = e2 || document; | |
| 1319 | + t.matches?.("[data-waveform-player]") && kt(t), t.querySelectorAll("[data-waveform-player]").forEach(kt); | |
| 1320 | +} | |
| 1321 | +et() && !Nt() && (document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", () => tt()) : tt()); | |
| 1322 | +T.init = tt; | |
| 1323 | +et() && (window.WaveformPlayer = T); | |
| 1324 | +var se = T; | |
| 1211 | 1325 | |
| 1212 | 1326 | // packages/block-library/build-module/utils/waveform-utils.mjs |
| 1213 | 1327 | var DEFAULT_WAVEFORM_HEIGHT = 100; |
| 1214 | 1328 | var DEFAULT_SEEK_LABEL = "Seek"; |
| @@ -1283,9 +1397,9 @@ | ||
| 1283 | 1397 | if (colorFunction) { |
| 1284 | 1398 | return colorFunction; |
| 1285 | 1399 | } |
| 1286 | 1400 | const [possibleColor] = gradientPart.split(/\s+/); |
| 1287 | - if (w(possibleColor).isValid()) { | |
| 1401 | + if (A(possibleColor).isValid()) { | |
| 1288 | 1402 | return possibleColor; |
| 1289 | 1403 | } |
| 1290 | 1404 | } |
| 1291 | 1405 | function getWaveformGradientDirection(gradientValue) { |
| @@ -1318,9 +1432,9 @@ | ||
| 1318 | 1432 | return "vertical"; |
| 1319 | 1433 | } |
| 1320 | 1434 | } |
| 1321 | 1435 | function resolveColorValue(element, colorValue) { |
| 1322 | - if (!colorValue || w(colorValue).isValid()) { | |
| 1436 | + if (!colorValue || A(colorValue).isValid()) { | |
| 1323 | 1437 | return colorValue; |
| 1324 | 1438 | } |
| 1325 | 1439 | const colorResolver = element.ownerDocument.createElement("span"); |
| 1326 | 1440 | colorResolver.style.color = colorValue; |
| @@ -1329,21 +1443,21 @@ | ||
| 1329 | 1443 | } |
| 1330 | 1444 | element.appendChild(colorResolver); |
| 1331 | 1445 | const resolvedColor = getComputedStyle2(colorResolver).color; |
| 1332 | 1446 | colorResolver.remove(); |
| 1333 | - return resolvedColor && w(resolvedColor).isValid() ? resolvedColor : colorValue; | |
| 1447 | + return resolvedColor && A(resolvedColor).isValid() ? resolvedColor : colorValue; | |
| 1334 | 1448 | } |
| 1335 | 1449 | function getResolvedGradientStops(element, gradientValue) { |
| 1336 | - const stops = getWaveformGradientStops(gradientValue)?.map((colorValue) => resolveColorValue(element, colorValue)).filter((colorValue) => w(colorValue).isValid()); | |
| 1450 | + const stops = getWaveformGradientStops(gradientValue)?.map((colorValue) => resolveColorValue(element, colorValue)).filter((colorValue) => A(colorValue).isValid()); | |
| 1337 | 1451 | return stops?.length > 1 ? stops : void 0; |
| 1338 | 1452 | } |
| 1339 | 1453 | function applyAlpha(colorValue, alpha) { |
| 1340 | 1454 | if (Array.isArray(colorValue)) { |
| 1341 | 1455 | return colorValue.map( |
| 1342 | - (color) => w(color).alpha(alpha).toRgbString() | |
| 1456 | + (color) => A(color).alpha(alpha).toRgbString() | |
| 1343 | 1457 | ); |
| 1344 | 1458 | } |
| 1345 | - return w(colorValue).alpha(alpha).toRgbString(); | |
| 1459 | + return A(colorValue).alpha(alpha).toRgbString(); | |
| 1346 | 1460 | } |
| 1347 | 1461 | function getRepresentativeColor(colorValue) { |
| 1348 | 1462 | if (Array.isArray(colorValue)) { |
| 1349 | 1463 | return colorValue[colorValue.length - 1]; |
| @@ -1471,9 +1585,9 @@ | ||
| 1471 | 1585 | } |
| 1472 | 1586 | } |
| 1473 | 1587 | } |
| 1474 | 1588 | function styleSvgIcons(container, buttonColor) { |
| 1475 | - const isButtonDark = w(buttonColor).isDark(); | |
| 1589 | + const isButtonDark = A(buttonColor).isDark(); | |
| 1476 | 1590 | const iconColor = isButtonDark ? "#ffffff" : "#000000"; |
| 1477 | 1591 | const svgPaths = container.querySelectorAll("svg path"); |
| 1478 | 1592 | svgPaths.forEach((path) => { |
| 1479 | 1593 | path.style.fill = iconColor; |
| @@ -1572,9 +1686,9 @@ | ||
| 1572 | 1686 | seekValueText: labels?.seekValueText, |
| 1573 | 1687 | waveformStyle |
| 1574 | 1688 | }); |
| 1575 | 1689 | element.appendChild(container); |
| 1576 | - const instance = new Bt(container); | |
| 1690 | + const instance = new se(container); | |
| 1577 | 1691 | if (instance.artworkEl) { |
| 1578 | 1692 | instance.artworkEl.alt = imageAlt || ""; |
| 1579 | 1693 | } |
| 1580 | 1694 | applyWaveformPlayerStyles(container, { |
