@applemusic-like-lyrics/core 0.1.0 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/amll-core.js DELETED
@@ -1,2245 +0,0 @@
1
- var he = Object.defineProperty;
2
- var ce = (o, i, e) => i in o ? he(o, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[i] = e;
3
- var a = (o, i, e) => (ce(o, typeof i != "symbol" ? i + "" : i, e), e);
4
- import { Container as Ie } from "@pixi/display";
5
- import { Application as de } from "@pixi/app";
6
- import { BlurFilter as R } from "@pixi/filter-blur";
7
- import { ColorMatrixFilter as X } from "@pixi/filter-color-matrix";
8
- import { Texture as me } from "@pixi/core";
9
- import { Sprite as N } from "@pixi/sprite";
10
- import { BulgePinchFilter as G } from "@pixi/filter-bulge-pinch";
11
- import { create as fe } from "jss";
12
- import ue from "jss-preset-default";
13
- class pe {
14
- }
15
- class te extends pe {
16
- constructor(e) {
17
- super();
18
- a(this, "observer");
19
- a(this, "flowSpeed", 2);
20
- a(this, "currerntRenderScale", 0.75);
21
- this.canvas = e, this.observer = new ResizeObserver(() => {
22
- const t = Math.max(
23
- 1,
24
- e.clientWidth * window.devicePixelRatio * this.currerntRenderScale
25
- ), s = Math.max(
26
- 1,
27
- e.clientHeight * window.devicePixelRatio * this.currerntRenderScale
28
- );
29
- this.onResize(t, s);
30
- }), this.observer.observe(e);
31
- }
32
- setRenderScale(e) {
33
- this.currerntRenderScale = e, this.onResize(
34
- this.canvas.clientWidth * window.devicePixelRatio * this.currerntRenderScale,
35
- this.canvas.clientHeight * window.devicePixelRatio * this.currerntRenderScale
36
- );
37
- }
38
- /**
39
- * 当画板元素大小发生变化时此函数会被调用
40
- * 可以在此处重设和渲染器相关的尺寸设置
41
- * 考虑到初始化的时候元素不一定在文档中或出于某些特殊样式状态,尺寸长宽有可能会为 0,请注意进行特判处理
42
- * @param width 画板元素实际的物理像素宽度,有可能为 0
43
- * @param height 画板元素实际的物理像素高度,有可能为 0
44
- */
45
- onResize(e, t) {
46
- this.canvas.width = e, this.canvas.height = t;
47
- }
48
- /**
49
- * 修改背景的流动速度,数字越大越快,默认为 2
50
- * @param speed 背景的流动速度,默认为 2
51
- */
52
- setFlowSpeed(e) {
53
- this.flowSpeed = e;
54
- }
55
- dispose() {
56
- this.observer.disconnect(), this.canvas.remove();
57
- }
58
- }
59
- class ge extends Ie {
60
- constructor() {
61
- super(...arguments);
62
- a(this, "time", 0);
63
- }
64
- }
65
- class dt extends te {
66
- constructor(e) {
67
- super(e);
68
- a(this, "app");
69
- a(this, "curContainer");
70
- a(this, "staticMode", !1);
71
- a(this, "lastContainer", /* @__PURE__ */ new Set());
72
- a(this, "onTick", (e) => {
73
- for (const t of this.lastContainer)
74
- t.alpha = Math.max(0, t.alpha - e / 60), t.alpha <= 0 && (this.app.stage.removeChild(t), this.lastContainer.delete(t), t.destroy(!0));
75
- if (this.curContainer) {
76
- this.curContainer.alpha = Math.min(
77
- 1,
78
- this.curContainer.alpha + e / 60
79
- );
80
- const [t, s, l, r] = this.curContainer.children, n = Math.max(this.app.screen.width, this.app.screen.height);
81
- t.position.set(this.app.screen.width / 2, this.app.screen.height / 2), s.position.set(
82
- this.app.screen.width / 2.5,
83
- this.app.screen.height / 2.5
84
- ), l.position.set(this.app.screen.width / 2, this.app.screen.height / 2), r.position.set(this.app.screen.width / 2, this.app.screen.height / 2), t.width = n * Math.sqrt(2), t.height = t.width, s.width = n * 0.8, s.height = s.width, l.width = n * 0.5, l.height = l.width, r.width = n * 0.25, r.height = r.width, this.curContainer.time += e * this.flowSpeed, t.rotation += e / 1e3 * this.flowSpeed, s.rotation -= e / 500 * this.flowSpeed, l.rotation += e / 1e3 * this.flowSpeed, r.rotation -= e / 750 * this.flowSpeed, l.x = this.app.screen.width / 2 + this.app.screen.width / 4 * Math.cos(this.curContainer.time / 1e3 * 0.75), l.y = this.app.screen.height / 2 + this.app.screen.width / 4 * Math.cos(this.curContainer.time / 1e3 * 0.75), r.x = this.app.screen.width / 2 + this.app.screen.width / 4 * 0.1 + Math.cos(this.curContainer.time * 6e-3 * 0.75), r.y = this.app.screen.height / 2 + this.app.screen.width / 4 * 0.1 + Math.cos(this.curContainer.time * 6e-3 * 0.75), this.curContainer.alpha >= 1 && this.lastContainer.size === 0 && this.staticMode && this.app.ticker.stop();
85
- }
86
- });
87
- this.canvas = e, this.app = new de({
88
- view: e,
89
- resizeTo: this.canvas,
90
- powerPreference: "low-power",
91
- backgroundAlpha: 1
92
- }), this.rebuildFilters(), this.app.ticker.maxFPS = 30, this.app.ticker.add(this.onTick), this.app.ticker.start();
93
- }
94
- onResize(e, t) {
95
- super.onResize(e, t), this.app.resize(), this.rebuildFilters();
96
- }
97
- setRenderScale(e) {
98
- super.setRenderScale(e), this.rebuildFilters();
99
- }
100
- rebuildFilters() {
101
- var n;
102
- const e = Math.min(this.canvas.width, this.canvas.height), t = Math.max(this.canvas.width, this.canvas.height), s = new X();
103
- s.saturate(1.2, !1);
104
- const l = new X();
105
- l.brightness(0.6, !1);
106
- const r = new X();
107
- r.contrast(0.3, !0), (n = this.app.stage.filters) == null || n.forEach((h) => {
108
- h.destroy();
109
- }), this.app.stage.filters = [], this.app.stage.filters.push(new R(5, 1)), this.app.stage.filters.push(new R(10, 1)), this.app.stage.filters.push(new R(20, 2)), this.app.stage.filters.push(new R(40, 2)), this.app.stage.filters.push(new R(80, 2)), e > 768 && this.app.stage.filters.push(new R(160, 4)), e > 768 * 2 && this.app.stage.filters.push(new R(320, 4)), this.app.stage.filters.push(s, l, r), this.app.stage.filters.push(new R(5, 1)), Math.random() > 0.5 ? (this.app.stage.filters.push(
110
- new G({
111
- radius: (t + e) / 2,
112
- strength: 1,
113
- center: [0.25, 1]
114
- })
115
- ), this.app.stage.filters.push(
116
- new G({
117
- radius: (t + e) / 2,
118
- strength: 1,
119
- center: [0.75, 0]
120
- })
121
- )) : (this.app.stage.filters.push(
122
- new G({
123
- radius: (t + e) / 2,
124
- strength: 1,
125
- center: [0.75, 1]
126
- })
127
- ), this.app.stage.filters.push(
128
- new G({
129
- radius: (t + e) / 2,
130
- strength: 1,
131
- center: [0.25, 0]
132
- })
133
- ));
134
- }
135
- setStaticMode(e = !1) {
136
- this.staticMode = e, this.app.ticker.start();
137
- }
138
- setFPS(e) {
139
- this.app.ticker.maxFPS = e;
140
- }
141
- pause() {
142
- this.app.ticker.stop(), this.app.render();
143
- }
144
- resume() {
145
- this.app.ticker.start();
146
- }
147
- setLowFreqVolume(e) {
148
- }
149
- setHasLyric(e) {
150
- }
151
- async setAlbumImage(e) {
152
- var d, m;
153
- if (e.trim().length === 0)
154
- return;
155
- const t = new Image();
156
- t.src = e, t.crossOrigin = "anonymous";
157
- let s = 5, l;
158
- for (; !((m = (d = l == null ? void 0 : l.baseTexture) == null ? void 0 : d.resource) != null && m.valid) && s > 0; )
159
- try {
160
- await t.decode(), l = me.from(t, {
161
- resourceOptions: {
162
- autoLoad: !1
163
- }
164
- }), await l.baseTexture.resource.load();
165
- } catch (u) {
166
- console.warn(
167
- `failed on loading album image, retrying (${s})`,
168
- e,
169
- u
170
- ), l = void 0, s--;
171
- }
172
- if (!l)
173
- return;
174
- const r = new ge(), n = new N(l), h = new N(l), c = new N(l), I = new N(l);
175
- n.anchor.set(0.5, 0.5), h.anchor.set(0.5, 0.5), c.anchor.set(0.5, 0.5), I.anchor.set(0.5, 0.5), n.rotation = Math.random() * Math.PI * 2, h.rotation = Math.random() * Math.PI * 2, c.rotation = Math.random() * Math.PI * 2, I.rotation = Math.random() * Math.PI * 2, r.addChild(n, h, c, I), this.curContainer && this.lastContainer.add(this.curContainer), this.curContainer = r, this.app.stage.addChild(r), this.curContainer.alpha = 0, this.app.ticker.start();
176
- }
177
- dispose() {
178
- super.dispose(), this.app.ticker.remove(this.onTick), this.app.destroy(!0);
179
- }
180
- getElement() {
181
- return this.canvas;
182
- }
183
- }
184
- const Y = `#version 300 es
185
- precision highp float;
186
-
187
- in vec2 v_coord;
188
- out vec2 f_v_coord;
189
-
190
- void main() {
191
- gl_Position = vec4(v_coord, 0.0f, 1.0f);
192
- f_v_coord = (vec2(v_coord.x, v_coord.y) + vec2(1.0f, 1.0f)) / 2.0f;
193
- }
194
- `, ye = `#version 300 es
195
- precision highp float;
196
-
197
- uniform sampler2D src;
198
- in vec2 f_v_coord;
199
- out vec4 fragColor;
200
-
201
- void main() {
202
- vec2 coord = f_v_coord;
203
- fragColor = texture(src, coord);
204
- }
205
- `, Te = `#version 300 es
206
- precision highp float;
207
-
208
- uniform sampler2D src;
209
- uniform float lerp;
210
- uniform float scale;
211
- in vec2 f_v_coord;
212
- out vec4 fragColor;
213
-
214
- void main() {
215
- vec2 tex_coord = f_v_coord;
216
- if(scale < 1.0f) {
217
- tex_coord /= scale;
218
- }
219
- vec4 srcColor = texture(src, tex_coord);
220
- fragColor = mix(vec4(srcColor.xyz, 0.0f), srcColor, lerp);
221
- }
222
- `, Ee = `#version 300 es
223
- precision highp float;uniform float IIIlllllllIIIllIl,lIIIlllllIllIl,IIIlllIlIIllll;uniform sampler2D IlllIIlIlllIll;uniform vec2 IIlIlIIlIlIllI,IllIlllIlIIlllI;out vec4 lIIlIIIIIlIlIlllIIIIlIIl;float lIlIIllllIllIll(float IIIlIIlIIIlllIII){IIIlIIlIIIlllIII-=0.;return sin(IIIlIIlIIIlllIII);}float lIlIlllllIllIll(float IIIlIIlIIIlllIII){IIIlIIlIIIlllIII+=acos(0.);return sin(IIIlIIlIIIlllIII);}mat2 lIIllIIlIIIllIl(float IIIlIIlIIIlllIII){return mat2(lIlIlllllIllIll(IIIlIIlIIIlllIII),-lIlIIllllIllIll(IIIlIIlIIIlllIII),lIlIIllllIllIll(IIIlIIlIIIlllIII),lIlIlllllIllIll(IIIlIIlIIIlllIII));}mat2 lIIllIIlIIIlllI(float IIIlIIlIIIlllIII){return mat2(lIlIIllllIllIll(IIIlIIlIIIlllIII),-lIlIlllllIllIll(IIIlIIlIIIlllIII),lIlIlllllIllIll(IIIlIIlIIIlllIII),lIlIIllllIllIll(IIIlIIlIIIlllIII));}float IllllIIlIllII(float llIIllIllIIIllI){return fract(lIlIIllllIllIll(llIIllIllIIIllI)*43758.5453);}float llIlIIllllIII(vec2 IIIlIIlIIIlllIII){vec2 IIllIlIIlllI=floor(IIIlIIlIIIlllIII),lIlIllIIIIIlIl=fract(IIIlIIlIIIlllIII);lIlIllIIIIIlIl=lIlIllIIIIIlIl*lIlIllIIIIIlIl*(3.-2.*lIlIllIIIIIlIl);float lIlIlIlIlIlIIl=IIllIlIIlllI.x+IIllIlIIlllI.y*57.;return mix(mix(IllllIIlIllII(lIlIlIlIlIlIIl),IllllIIlIllII(lIlIlIlIlIlIIl+1.),lIlIllIIIIIlIl.x),mix(IllllIIlIllII(lIlIlIlIlIlIIl+57.),IllllIIlIllII(lIlIlIlIlIlIIl+58.),lIlIllIIIIIlIl.x),lIlIllIIIIIlIl.y);}vec2 lllIIIIIIllIlIIIlI(vec2 IlllIIlIIIIlIIII,float lIIIIlllIIIIllIlIlI,vec2 IlIlIIIIlIlllIlIII){float lIIlIllIIIlIl=llIlIIllllIII(IlllIIlIIIIlIIII*vec2(1)*3.5+.1)*4.2831*mix(.2,1.,IIIlllllllIIIllIl);IlllIIlIIIIlIIII+=vec2(-1,.5);lIIlIllIIIlIl-=lIIIIlllIIIIllIlIlI;return vec2(lIlIlllllIllIll(lIIlIllIIIlIl),lIlIIllllIllIll(lIIlIllIIIlIl));}const mat3 lIIllIIIlllIl=mat3(1.,.02,.002,.02,1.,.008,.002,.02,1.),lIIIlllIIIIll=mat3(1.022,-.02,-.002,-.02,1.028,-.008,-.002,-.02,1.022);void main(){vec2 lIIIlIIllIlIIlI=lIlIIllllIllIll(lIIIlllllIllIl*.2)*.01+.5+gl_FragCoord.xy/IIlIlIIlIlIllI.xy,lIIllIIlIIIllI=lIIIlIIllIlIIlI*.77f+IllIlllIlIIlllI;lIIllIIlIIIllI.x*=IIlIlIIlIlIllI.x/IIlIlIIlIlIllI.y;float lIIlIIlIIlIIIlII=gl_FragCoord.x/max(IIlIlIIlIlIllI.x,IIlIlIIlIlIllI.y),lIIIlIllIllIlIIl=0.f;vec3 lIIIlIlIIIlIlIIl=vec3(0);vec2 lIlIIlIlIIIllIll=lIIllIIlIIIllI;for(int IllIlIIlIIlllllIIIl=0;IllIlIIlIIlllllIIIl<8;IllIlIIlIIlllllIIIl++){bool lIlIlIIllIllIIll=IllIlIIlIIlllllIIIl%2==0;vec2 lIlllIlllIlllII=lllIIIIIIllIlIIIlI(lIIllIIlIIIllI,lIIlIIlIIlIIIlII,lIIIlIIllIlIIlI),lIllIIlIIlIIIll=lIlllIlllIlllII;float lIIlIlIIlIIlIllI=float(IllIlIIlIIlllllIIIl)/8.f;vec3 llIIlIIIIlIIlIII=texture(IlllIIlIlllIll,-lIIIlllllIllIl*.01+.8*lIIllIIlIIIllI*lIIllIIlIIIllIl(-lIIIlllllIllIl*.2)+vec2(IIIlllIlIIllll*.3*(float(lIlIlIIllIllIIll)*2.-1.)*lIIllIIlIIIlllI(lIIIlllllIllIl*.2+1.5))).xyz;lIIIlIlIIIlIlIIl+=llIIlIIIIlIIlIII;lIIIlIllIllIlIIl+=4.f*lIIlIlIIlIIlIllI*(1.f-lIIlIlIIlIIlIllI);lIIllIIlIIIllI+=.01f*lIllIIlIIlIIIll*(lIlIIllllIllIll(lIIIlllllIllIl)*4.8+.8);lIlIIlIlIIIllIll+=.05f*lIllIIlIIlIIIll;}lIIIlIlIIIlIlIIl/=lIIIlIllIllIlIIl;lIIIlIlIIIlIlIIl*=1.6f;lIIIlIlIIIlIlIIl=1.f-exp(-lIIIlIlIIIlIlIIl);lIIIlIlIIIlIlIIl=pow(lIIIlIlIIIlIlIIl,vec3(2.2));lIIIlIlIIIlIlIIl*=.8f;lIIlIIIIIlIlIlllIIIIlIIl=vec4(lIIIlIlIIIlIlIIl,1);}`, we = `#version 300 es
224
- precision highp float;
225
-
226
- uniform sampler2D src;
227
- in vec2 f_v_coord;
228
- out vec4 fragColor;
229
-
230
- /* Gradient noise from Jorge Jimenez's presentation: */
231
- /* http://www.iryoku.com/next-generation-post-processing-in-call-of-duty-advanced-warfare */
232
- float gradientNoise(in vec2 uv) {
233
- return fract(52.9829189f * fract(dot(uv, vec2(0.06711056f, 0.00583715f))));
234
- }
235
-
236
- void main() {
237
- vec2 tex_coord = f_v_coord;
238
- float dither = (1.0f / 255.0f) * gradientNoise(gl_FragCoord.xy) - (0.5f / 255.0f);
239
- vec4 color = texture(src, tex_coord);
240
- color += dither;
241
- fragColor = color;
242
- }
243
- `, be = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAYUklEQVR4nH3bV89VVRcF4IX7qNgVe8WKvaIiNsCuYCKCSEg0JCYm/gTjzf4R3njhlRdeWKKi2AvYEBV7b1ixY2+ofPuZcbwxXzie5OQ9Z5+11pxzjDHnKnu/k0477bSN+++/fzvyyCPbdttt17766qu2YcOG9ttvv7U33nijffHFF23atGntgAMOaN98803bc88926RJk9pnn31W10855ZT2888/1/vrr79ur732Wjv00EPbgQce2NavX99eeOGF+nvmmWfWuD4fc8wx1ffDDz9sTz31VPv000/bRx99VL/vsssu7eCDDy57hxxySPv222/L1saNG9vatWsbX19++eXyhb9//PFH23HHHdsHH3zQLrrooorjxRdfrPbG+/jjj9u6devaX3/91aZMmdImT57cdt1114lYu5133rnfeuut28yZM9t+++3XVq9e3T7//PMa9Ljjjqu/m222WTn73HPPtR122KF99913bcsttyyQnnzyybbbbrvVm4MMAe37778vUATIkaOPPrqCe+KJJ9qPP/7Ydt9993bvvfe2lStXtvfee69ttdVW7bzzzmvbbLNN++STT9rUqVPL7jvvvNP+/PPP8o1NNn7//fcakx3XL7300moPyC222KL8ev/99ws8Y2s3xFmAIpD9H374of36669txBEIvf3224UmR1w74YQTyhlgHHTQQeU845Bfs2ZN23fffcsQRn/55Zf6jQJOP/30GvjLL78sMPbee+8y6rM2gvPea6+9yg7Htt1223bSSSe1nXbaqWwC+K677iq2qMU1yqKK0WhUAWGREruuq3GBw8dVq1ZV4Pvss08744wzSgns/fTTT+UzoigIAL53gyM95P7+++9Cj1OQz+ACwb7PHAGA3133phKyY/TVV1+t3zHEAUa8t99++1IDJwAsKFIWkFQQOFaeffbZ9u6775aTgBXskKIVhDEBSxFJCaznOoCpNdJHGlvGNRa5s8N3PiLg5JNPbt1goNfIYKeeemo74ogjKmC5yxlIY/D5559v999/f8nxrLPOqsCBwknIkxcmpISXYFesWFGqIlNKck3bGTNmFNDyltPaUBXnsMWGfKZCeQto/QQqmOnTpxegvvNVH4G7Jg4AG4P8qVM6jCN5JDc5QYZyHHrynFGd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", Z = (() => {
244
- const o = document.createElement("img");
245
- return o.src = be, o;
246
- })();
247
- function Se(o, i, e) {
248
- const t = o.data, s = o.width, l = o.height;
249
- let r, n, h, c, I, d, m, u, p, y, f, g, E;
250
- const L = s - 1, w = l - 1, T = i + 1, b = i + T, S = i + 1, M = i + S, x = 1 / (b * M), P = [], A = [], v = [], z = [], O = [], _ = [];
251
- for (; e-- > 0; ) {
252
- for (E = g = 0, d = 0; d < l; d++) {
253
- for (r = t[E] * T, n = t[E + 1] * T, h = t[E + 2] * T, c = t[E + 3] * T, m = 1; m <= i; m++)
254
- u = E + ((m > L ? L : m) << 2), r += t[u++], n += t[u++], h += t[u++], c += t[u];
255
- for (I = 0; I < s; I++)
256
- P[g] = r, A[g] = n, v[g] = h, z[g] = c, d === 0 && (O[I] = Math.min(I + T, L) << 2, _[I] = Math.max(I - i, 0) << 2), p = E + O[I], y = E + _[I], r += t[p++] - t[y++], n += t[p++] - t[y++], h += t[p++] - t[y++], c += t[p] - t[y], g++;
257
- E += s << 2;
258
- }
259
- for (I = 0; I < s; I++) {
260
- for (f = I, r = P[f] * S, n = A[f] * S, h = v[f] * S, c = z[f] * S, m = 1; m <= i; m++)
261
- f += m > w ? 0 : s, r += P[f], n += A[f], h += v[f], c += z[f];
262
- for (g = I << 2, d = 0; d < l; d++)
263
- t[g] = r * x + 0.5 | 0, t[g + 1] = n * x + 0.5 | 0, t[g + 2] = h * x + 0.5 | 0, t[g + 3] = c * x + 0.5 | 0, I === 0 && (O[d] = Math.min(d + S, w) * s, _[d] = Math.max(d - i, 0) * s), p = I + O[d], y = I + _[d], r += P[p] - P[y], n += A[p] - A[y], h += v[p] - v[y], c += z[p] - z[y], g += s << 2;
264
- }
265
- }
266
- }
267
- function Le(o, i) {
268
- const e = o.data;
269
- for (let t = 0; t < e.length; t += 4) {
270
- const s = e[t], l = e[t + 1], r = e[t + 2], n = e[t + 3], h = s * 0.3 + l * 0.59 + r * 0.11;
271
- e[t] = h * (1 - i) + s * i, e[t + 1] = h * (1 - i) + l * i, e[t + 2] = h * (1 - i) + r * i, e[t + 3] = n;
272
- }
273
- }
274
- function xe(o, i) {
275
- const e = o.data;
276
- for (let t = 0; t < e.length; t += 4) {
277
- const s = e[t], l = e[t + 1], r = e[t + 2], n = e[t + 3];
278
- e[t] = (s - 128) * i + 128, e[t + 1] = (l - 128) * i + 128, e[t + 2] = (r - 128) * i + 128, e[t + 3] = n;
279
- }
280
- }
281
- class q {
282
- constructor(i, e, t, s = "unknown") {
283
- a(this, "gl");
284
- a(this, "program");
285
- a(this, "vertexShader");
286
- a(this, "fragmentShader");
287
- a(this, "coordPos");
288
- a(this, "notFoundUniforms", /* @__PURE__ */ new Set());
289
- this.label = s, this.gl = i, this.vertexShader = this.createShader(i.VERTEX_SHADER, e), this.fragmentShader = this.createShader(
290
- i.FRAGMENT_SHADER,
291
- t
292
- ), this.program = this.createProgram();
293
- const l = i.getAttribLocation(this.program, "v_coord");
294
- if (l === -1)
295
- throw new Error(
296
- `Failed to get attribute location v_coord for "${this.label}"`
297
- );
298
- this.coordPos = l;
299
- }
300
- createShader(i, e) {
301
- const t = this.gl, s = t.createShader(i);
302
- if (!s)
303
- throw new Error("Failed to create shader");
304
- if (t.shaderSource(s, e), t.compileShader(s), !t.getShaderParameter(s, t.COMPILE_STATUS))
305
- throw new Error(
306
- `Failed to compile shader for type ${i} "${this.label}": ${t.getShaderInfoLog(s)}`
307
- );
308
- return s;
309
- }
310
- createProgram() {
311
- const i = this.gl, e = i.createProgram();
312
- if (!e)
313
- throw new Error("Failed to create program");
314
- if (i.attachShader(e, this.vertexShader), i.attachShader(e, this.fragmentShader), i.linkProgram(e), i.validateProgram(e), !i.getProgramParameter(e, i.LINK_STATUS)) {
315
- const t = i.getProgramInfoLog(e);
316
- throw i.deleteProgram(e), new Error(`Failed to link program "${this.label}": ${t}`);
317
- }
318
- return e;
319
- }
320
- use() {
321
- const i = this.gl;
322
- i.useProgram(this.program), i.vertexAttribPointer(this.coordPos, 2, i.FLOAT, !1, 0, 0), i.enableVertexAttribArray(this.coordPos);
323
- }
324
- warnUniformNotFound(i) {
325
- this.notFoundUniforms.has(i) || (this.notFoundUniforms.add(i), console.warn(
326
- `Failed to get uniform location for program "${this.label}": ${i}`
327
- ));
328
- }
329
- setUniform1f(i, e) {
330
- const t = this.gl, s = t.getUniformLocation(this.program, i);
331
- s ? t.uniform1f(s, e) : this.warnUniformNotFound(i);
332
- }
333
- setUniform2f(i, e, t) {
334
- const s = this.gl, l = s.getUniformLocation(this.program, i);
335
- l ? s.uniform2f(l, e, t) : this.warnUniformNotFound(i);
336
- }
337
- setUniform1i(i, e) {
338
- const t = this.gl, s = t.getUniformLocation(this.program, i);
339
- s ? t.uniform1i(s, e) : this.warnUniformNotFound(i);
340
- }
341
- dispose() {
342
- const i = this.gl;
343
- i.deleteShader(this.vertexShader), i.deleteShader(this.fragmentShader), i.deleteProgram(this.program);
344
- }
345
- }
346
- class Q {
347
- constructor(i, e, t) {
348
- a(this, "fb");
349
- a(this, "tex");
350
- a(this, "_size");
351
- this.gl = i, this._size = [e, t];
352
- const s = i.createFramebuffer();
353
- if (!s)
354
- throw new Error("Can't create framebuffer");
355
- const l = i.createTexture();
356
- if (!l)
357
- throw new Error("Failed to create texture");
358
- this.fb = s, this.tex = l, i.bindFramebuffer(i.FRAMEBUFFER, s), i.bindTexture(i.TEXTURE_2D, l), i.framebufferTexture2D(
359
- i.FRAMEBUFFER,
360
- i.COLOR_ATTACHMENT0,
361
- i.TEXTURE_2D,
362
- l,
363
- 0
364
- ), this.resize(e, t), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MIN_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_S, i.MIRRORED_REPEAT), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_T, i.MIRRORED_REPEAT);
365
- }
366
- get size() {
367
- return this._size;
368
- }
369
- resize(i, e) {
370
- const t = this.gl;
371
- this.bind(), t.bindTexture(t.TEXTURE_2D, this.tex), t.getExtension("EXT_color_buffer_float") ? t.texImage2D(
372
- t.TEXTURE_2D,
373
- 0,
374
- t.RGBA32F,
375
- i,
376
- e,
377
- 0,
378
- t.RGBA,
379
- t.FLOAT,
380
- null
381
- ) : t.texImage2D(
382
- t.TEXTURE_2D,
383
- 0,
384
- t.RGBA,
385
- i,
386
- e,
387
- 0,
388
- t.RGBA,
389
- t.UNSIGNED_BYTE,
390
- null
391
- ), t.texParameteri(t.TEXTURE_2D, t.TEXTURE_MIN_FILTER, t.LINEAR), t.texParameteri(t.TEXTURE_2D, t.TEXTURE_MAG_FILTER, t.LINEAR), t.texParameteri(t.TEXTURE_2D, t.TEXTURE_WRAP_S, t.MIRRORED_REPEAT), t.texParameteri(t.TEXTURE_2D, t.TEXTURE_WRAP_T, t.MIRRORED_REPEAT);
392
- }
393
- bind() {
394
- const i = this.gl;
395
- i.bindFramebuffer(i.FRAMEBUFFER, this.fb);
396
- }
397
- active(i = this.gl.TEXTURE0) {
398
- this.gl.activeTexture(i), this.gl.bindTexture(this.gl.TEXTURE_2D, this.tex);
399
- }
400
- dispose() {
401
- this.gl.deleteFramebuffer(this.fb), this.gl.deleteTexture(this.tex);
402
- }
403
- }
404
- class j {
405
- constructor(i, e, t, s) {
406
- a(this, "gl");
407
- a(this, "buffer");
408
- a(this, "type");
409
- a(this, "data");
410
- a(this, "usage");
411
- a(this, "length");
412
- this.gl = i, this.type = e, this.data = t, this.usage = s;
413
- const l = i.createBuffer();
414
- if (!l)
415
- throw new Error("Failed to create buffer");
416
- this.buffer = l, this.length = t.byteLength, i.bindBuffer(e, this.buffer), i.bufferData(e, t, s);
417
- }
418
- bind() {
419
- this.gl.bindBuffer(this.type, this.buffer);
420
- }
421
- // update(data: ArrayBufferView) {
422
- // const gl = this.gl;
423
- // gl.bindBuffer(this.type, this.buffer);
424
- // gl.bufferSubData(this.type, 0, data);
425
- // this.data = data;
426
- // }
427
- dispose() {
428
- this.gl.deleteBuffer(this.buffer);
429
- }
430
- }
431
- class Pe {
432
- constructor(i, e, t, s, l) {
433
- a(this, "albumTexture");
434
- a(this, "alpha", 0);
435
- this.gl = i, this.mainProgram = e, this.vertexBuffer = t, this.indexBuffer = s;
436
- const r = i.createTexture();
437
- if (!r)
438
- throw new Error("Failed to create texture");
439
- this.albumTexture = r, i.bindTexture(i.TEXTURE_2D, r), i.texImage2D(
440
- i.TEXTURE_2D,
441
- 0,
442
- i.RGBA,
443
- i.RGBA,
444
- i.UNSIGNED_BYTE,
445
- l
446
- ), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MIN_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MAG_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_S, i.MIRRORED_REPEAT), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_T, i.MIRRORED_REPEAT);
447
- }
448
- draw(i) {
449
- const e = this.gl;
450
- this.mainProgram.use(), e.activeTexture(e.TEXTURE0), e.bindTexture(e.TEXTURE_2D, this.albumTexture), this.mainProgram.setUniform1i(i, 0), e.drawArrays(e.TRIANGLE_STRIP, 0, 4);
451
- }
452
- dispose() {
453
- this.gl.deleteTexture(this.albumTexture);
454
- }
455
- }
456
- class Ae {
457
- constructor(i) {
458
- a(this, "tex");
459
- a(this, "alpha", 0);
460
- this.gl = i;
461
- const e = i.createTexture();
462
- if (!e)
463
- throw new Error("Failed to create texture");
464
- this.tex = e, Z.decode().then(() => {
465
- i.bindTexture(i.TEXTURE_2D, e), i.texImage2D(
466
- i.TEXTURE_2D,
467
- 0,
468
- i.RGBA,
469
- i.RGBA,
470
- i.UNSIGNED_BYTE,
471
- Z
472
- ), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MIN_FILTER, i.NEAREST), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MAG_FILTER, i.NEAREST), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_S, i.REPEAT), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_T, i.REPEAT);
473
- });
474
- }
475
- active(i = this.gl.TEXTURE1) {
476
- this.gl.activeTexture(i), this.gl.bindTexture(this.gl.TEXTURE_2D, this.tex);
477
- }
478
- dispose() {
479
- this.gl.deleteTexture(this.tex);
480
- }
481
- }
482
- const F = class F extends te {
483
- constructor(e) {
484
- super(e);
485
- a(this, "hasLyric", !0);
486
- a(this, "hasLyricValue", 1);
487
- a(this, "maxFPS", 30);
488
- a(this, "lastTickTime", 0);
489
- a(this, "lastFrameTime", 0);
490
- a(this, "_lowFreqVolume", 1);
491
- a(this, "paused", !1);
492
- a(this, "staticMode", !1);
493
- a(this, "gl", this.setupGL());
494
- a(this, "reduceImageSizeCanvas", new OffscreenCanvas(128, 128));
495
- a(this, "tickHandle", 0);
496
- a(this, "sprites", []);
497
- a(this, "ampTransition", 0);
498
- a(this, "playTime", 0);
499
- a(this, "frameTime", 0);
500
- a(this, "IllIlllIlIIlllI", [-0.1, 0]);
501
- a(this, "mainProgram", new q(
502
- this.gl,
503
- Y,
504
- Ee,
505
- "main"
506
- ));
507
- a(this, "blendProgram", new q(
508
- this.gl,
509
- Y,
510
- Te,
511
- "blend"
512
- ));
513
- a(this, "copyProgram", new q(
514
- this.gl,
515
- Y,
516
- ye,
517
- "copy"
518
- ));
519
- a(this, "noiseProgram", new q(
520
- this.gl,
521
- Y,
522
- we,
523
- "noise"
524
- ));
525
- a(this, "vertexBuffer", new j(
526
- this.gl,
527
- this.gl.ARRAY_BUFFER,
528
- F.rawVertexBuffer,
529
- this.gl.STATIC_DRAW
530
- ));
531
- a(this, "indexBuffer", new j(
532
- this.gl,
533
- this.gl.ELEMENT_ARRAY_BUFFER,
534
- F.rawIndexBuffer,
535
- this.gl.STATIC_DRAW
536
- ));
537
- a(this, "noiseTexture", new Ae(this.gl));
538
- a(this, "fb");
539
- a(this, "historyFrameBuffer", []);
540
- a(this, "_currentSize", [0, 0]);
541
- a(this, "_targetSize", [0, 0]);
542
- a(this, "renderSize", [0, 0]);
543
- a(this, "pixelSize", [0, 0]);
544
- this.canvas = e;
545
- const t = this.gl;
546
- t.enable(this.gl.BLEND), t.blendFunc(this.gl.SRC_ALPHA, this.gl.ONE_MINUS_SRC_ALPHA), this.requestTick();
547
- const s = e.getBoundingClientRect(), l = s.width * window.devicePixelRatio * this.currerntRenderScale, r = s.height * window.devicePixelRatio * this.currerntRenderScale;
548
- this.fb = [
549
- new Q(this.gl, l, r),
550
- new Q(this.gl, l, r)
551
- ];
552
- for (const n of this.fb)
553
- n.bind(), t.blendFunc(this.gl.SRC_ALPHA, this.gl.ONE_MINUS_SRC_ALPHA);
554
- this.historyFrameBuffer = new Array(2).fill(0).map(() => new Q(this.gl, l, r)), this.onResize(l, r);
555
- }
556
- onTick(e) {
557
- if (this.tickHandle = 0, this.paused)
558
- return;
559
- const t = e - this.lastTickTime, s = e - this.lastFrameTime;
560
- if (this.lastFrameTime = e, t < 1e3 / this.maxFPS) {
561
- this.requestTick();
562
- return;
563
- }
564
- this.hasLyric && (this.playTime += s * this.flowSpeed * 0.2), this.frameTime += s, this.onRedraw(this.playTime, s) && this.staticMode || this.requestTick(), this.lastTickTime = e, this.ampTransition;
565
- }
566
- onResize(e, t) {
567
- this._targetSize = [
568
- Math.max(1, Math.round(e)),
569
- Math.max(1, Math.round(t))
570
- ], this.staticMode && this.requestTick();
571
- }
572
- checkResize() {
573
- if (this._currentSize[0] === this._targetSize[0] && this._currentSize[1] === this._targetSize[1])
574
- return;
575
- this._currentSize = [...this._targetSize];
576
- const [e, t] = this._targetSize, s = Math.round(
577
- Math.max(e / this.currerntRenderScale, e)
578
- ), l = Math.round(
579
- Math.max(t / this.currerntRenderScale, t)
580
- );
581
- this.renderSize = [e, t], this.canvas.width = s, this.canvas.height = l, this.pixelSize = [s, l], this.gl.viewport(0, 0, s, l);
582
- for (const r of this.fb)
583
- r.resize(e, t);
584
- for (const r of this.historyFrameBuffer)
585
- r.resize(s, l);
586
- }
587
- requestTick() {
588
- this.tickHandle || (this.tickHandle = requestAnimationFrame((e) => this.onTick(e)));
589
- }
590
- drawScreen() {
591
- this.gl.drawArrays(this.gl.TRIANGLE_STRIP, 0, 4);
592
- }
593
- bindDefaultFrameBuffer() {
594
- this.gl.bindFramebuffer(this.gl.FRAMEBUFFER, null);
595
- }
596
- onRedraw(e, t) {
597
- this.checkResize(), this.hasLyricValue = (this.hasLyricValue * 19 + (this.hasLyric ? 1 : 0)) / 20;
598
- const s = this.gl;
599
- this.vertexBuffer.bind(), this.indexBuffer.bind(), this.mainProgram.use(), this.noiseTexture.active(), this.mainProgram.setUniform1i("noisetex", 1), this.mainProgram.setUniform2f(
600
- "IIlIlIIlIlIllI",
601
- this.renderSize[0],
602
- this.renderSize[1]
603
- ), this.mainProgram.setUniform1f(
604
- "lIIIlllllIllIl",
605
- this.hasLyric ? e / 1e3 : 0
606
- ), this.mainProgram.setUniform1f("IIIlllllllIIIllIl", this.hasLyricValue), this.mainProgram.setUniform1f(
607
- "IIIlllIlIIllll",
608
- this.hasLyric ? this._lowFreqVolume : 0
609
- ), this.mainProgram.setUniform2f(
610
- "IllIlllIlIIlllI",
611
- this.IllIlllIlIIlllI[0],
612
- this.IllIlllIlIIlllI[1]
613
- );
614
- const [l, r] = this.fb;
615
- r.bind(), s.clearColor(0, 0, 0, 0), s.clear(this.gl.COLOR_BUFFER_BIT);
616
- for (const c of this.sprites)
617
- l.bind(), s.clearColor(0, 0, 0, 0), s.clear(this.gl.COLOR_BUFFER_BIT), this.mainProgram.use(), c.draw("IlllIIlIlllIll"), r.bind(), this.blendProgram.use(), l.active(), this.blendProgram.setUniform1i("src", 0), this.blendProgram.setUniform1f("lerp", c.alpha), this.blendProgram.setUniform1f("scale", this.currerntRenderScale), this.drawScreen(), c.alpha = Math.min(1, c.alpha + t / 200);
618
- if (this.noiseProgram.use(), this.noiseProgram.setUniform1i("src", 0), l.bind(), r.active(), this.bindDefaultFrameBuffer(), this.drawScreen(), this.sprites.length > 1 && this.sprites[this.sprites.length - 1].alpha >= 1)
619
- for (const I of this.sprites.splice(0, this.sprites.length - 1))
620
- I.dispose();
621
- const n = this.sprites.length === 1 && this.sprites[0].alpha >= 1, h = this.hasLyric ? this.hasLyricValue > 1e-5 : this.hasLyricValue < 0.99999;
622
- return n || !h;
623
- }
624
- copyFrameBuffer(e, t = null) {
625
- e !== t && (e.active(this.gl.TEXTURE0), this.copyProgram.use(), t ? t.bind() : this.bindDefaultFrameBuffer(), this.copyProgram.setUniform1i("src", 0), this.drawScreen());
626
- }
627
- setupGL() {
628
- const e = this.canvas.getContext("webgl2", {
629
- alpha: !0,
630
- depth: !1,
631
- powerPreference: "low-power"
632
- });
633
- if (!e)
634
- throw new Error("WebGL2 not supported");
635
- return this.gl = e, e.enable(e.BLEND), e.disable(e.DEPTH_TEST), e.blendFunc(e.SRC_ALPHA, e.ONE_MINUS_SRC_ALPHA), e.getExtension("EXT_color_buffer_float") || console.warn("EXT_color_buffer_float not supported"), e.getExtension("EXT_float_blend") || console.warn("EXT_float_blend not supported"), e.getExtension("OES_texture_float_linear") || console.warn("OES_texture_float_linear not supported"), e;
636
- }
637
- setLowFreqVolume(e) {
638
- this._lowFreqVolume = e;
639
- }
640
- setStaticMode(e) {
641
- this.staticMode = e, this.lastFrameTime = performance.now(), this.requestTick();
642
- }
643
- setFPS(e) {
644
- this.maxFPS = e;
645
- }
646
- pause() {
647
- this.tickHandle && (cancelAnimationFrame(this.tickHandle), this.tickHandle = 0), this.paused = !0;
648
- }
649
- resume() {
650
- this.paused = !1, this.requestTick();
651
- }
652
- loadImage(e) {
653
- return new Promise((t, s) => {
654
- const l = document.createElement("img");
655
- l.onload = () => t(l), l.onerror = s, l.src = e, l.crossOrigin = "anonymous";
656
- });
657
- }
658
- async setAlbumImage(e) {
659
- if (e.trim().length === 0)
660
- return;
661
- let t = 5, s = null;
662
- for (; !s && t > 0; )
663
- try {
664
- s = await this.loadImage(e);
665
- } catch (u) {
666
- console.warn(
667
- `failed on loading album image, retrying (${t})`,
668
- e,
669
- u
670
- ), t--;
671
- }
672
- if (!s)
673
- return;
674
- const l = this.reduceImageSizeCanvas, r = l.getContext("2d");
675
- if (!r)
676
- throw new Error("Failed to create canvas context");
677
- r.clearRect(0, 0, l.width, l.height);
678
- const n = 10, h = s.naturalWidth, c = s.naturalHeight;
679
- r.drawImage(s, 0, 0, h, c, 0, 0, l.width, l.height);
680
- const I = r.getImageData(0, 0, l.width, l.height);
681
- xe(I, 0.8), Le(I, 1.5), Se(I, n, 4);
682
- const d = new Pe(
683
- this.gl,
684
- this.mainProgram,
685
- this.vertexBuffer,
686
- this.indexBuffer,
687
- I
688
- );
689
- this.sprites.push(d), this.playTime = Math.random() * 1e5, this.lastFrameTime = performance.now(), console.info(Math.random() * 1e4);
690
- const m = Number.parseInt((Math.random() * 1e4).toFixed(0)) % 3;
691
- m === 0 ? this.IllIlllIlIIlllI = [-1.3, -0.9] : m === 1 ? this.IllIlllIlIIlllI = [-1.1, -0.9] : this.IllIlllIlIIlllI = [-1.3, -0.9], this.requestTick();
692
- }
693
- setHasLyric(e) {
694
- this.hasLyric = e, this.requestTick();
695
- }
696
- getElement() {
697
- return this.canvas;
698
- }
699
- dispose() {
700
- super.dispose(), this.vertexBuffer.dispose(), this.indexBuffer.dispose(), this.noiseTexture.dispose();
701
- for (const e of this.sprites)
702
- e.dispose();
703
- this.copyProgram.dispose(), this.blendProgram.dispose(), this.mainProgram.dispose();
704
- for (const e of this.fb)
705
- e.dispose();
706
- for (const e of this.historyFrameBuffer)
707
- e.dispose();
708
- this.tickHandle && (cancelAnimationFrame(this.tickHandle), this.tickHandle = 0);
709
- }
710
- };
711
- a(F, "rawVertexBuffer", new Float32Array([
712
- -1,
713
- -1,
714
- 1,
715
- -1,
716
- -1,
717
- 1,
718
- 1,
719
- 1
720
- ])), a(F, "rawIndexBuffer", new Uint16Array([0, 1, 2, 1, 2, 3]));
721
- let J = F;
722
- class ie {
723
- constructor(i, e) {
724
- a(this, "element");
725
- a(this, "renderer");
726
- this.renderer = i, this.element = e, e.style.pointerEvents = "none", e.style.zIndex = "-1", e.style.contain = "strict";
727
- }
728
- static new(i) {
729
- const e = document.createElement("canvas");
730
- return new ie(new i(e), e);
731
- }
732
- setRenderScale(i) {
733
- this.renderer.setRenderScale(i);
734
- }
735
- setFlowSpeed(i) {
736
- this.renderer.setFlowSpeed(i);
737
- }
738
- setStaticMode(i) {
739
- this.renderer.setStaticMode(i);
740
- }
741
- setFPS(i) {
742
- this.renderer.setFPS(i);
743
- }
744
- pause() {
745
- this.renderer.pause();
746
- }
747
- resume() {
748
- this.renderer.resume();
749
- }
750
- setLowFreqVolume(i) {
751
- this.renderer.setLowFreqVolume(i);
752
- }
753
- setHasLyric(i) {
754
- this.renderer.setHasLyric(i);
755
- }
756
- setAlbumImage(i) {
757
- return this.renderer.setAlbumImage(i);
758
- }
759
- getElement() {
760
- return this.element;
761
- }
762
- dispose() {
763
- this.renderer.dispose(), this.element.remove();
764
- }
765
- }
766
- const ve = (o, i) => o.size === i.size && [...o].every((e) => i.has(e));
767
- function Me(o) {
768
- return (e) => (o(e + 1e-3) - o(e - 1e-3)) / (2 * 1e-3);
769
- }
770
- function K(o) {
771
- return Me(o);
772
- }
773
- class U {
774
- constructor(i = 0) {
775
- a(this, "currentPosition", 0);
776
- a(this, "targetPosition", 0);
777
- a(this, "currentTime", 0);
778
- a(this, "params", {});
779
- a(this, "currentSolver");
780
- a(this, "getV");
781
- a(this, "getV2");
782
- a(this, "queueParams");
783
- a(this, "queuePosition");
784
- this.targetPosition = i, this.currentPosition = this.targetPosition, this.currentSolver = () => this.targetPosition, this.getV = () => 0, this.getV2 = () => 0;
785
- }
786
- resetSolver() {
787
- const i = this.getV(this.currentTime);
788
- this.currentTime = 0, this.currentSolver = Re(
789
- this.currentPosition,
790
- i,
791
- this.targetPosition,
792
- 0,
793
- this.params
794
- ), this.getV = K(this.currentSolver), this.getV2 = K(this.getV);
795
- }
796
- arrived() {
797
- return Math.abs(this.targetPosition - this.currentPosition) < 0.01 && this.getV(this.currentTime) < 0.01 && this.getV2(this.currentTime) < 0.01 && this.queueParams === void 0 && this.queuePosition === void 0;
798
- }
799
- setPosition(i) {
800
- this.targetPosition = i, this.currentPosition = i, this.currentSolver = () => this.targetPosition, this.getV = () => 0, this.getV2 = () => 0;
801
- }
802
- update(i = 0) {
803
- this.currentTime += i, this.currentPosition = this.currentSolver(this.currentTime), this.queueParams && (this.queueParams.time -= i, this.queueParams.time <= 0 && this.updateParams({
804
- ...this.queueParams
805
- })), this.queuePosition && (this.queuePosition.time -= i, this.queuePosition.time <= 0 && this.setTargetPosition(this.queuePosition.position)), this.arrived() && this.setPosition(this.targetPosition);
806
- }
807
- updateParams(i, e = 0) {
808
- e > 0 ? this.queueParams = {
809
- ...this.queuePosition ?? {},
810
- ...i,
811
- time: e
812
- } : (this.queuePosition = void 0, this.params = {
813
- ...this.params,
814
- ...i
815
- }, this.resetSolver());
816
- }
817
- setTargetPosition(i, e = 0) {
818
- e > 0 ? this.queuePosition = {
819
- ...this.queuePosition ?? {},
820
- position: i,
821
- time: e
822
- } : (this.queuePosition = void 0, this.targetPosition = i, this.resetSolver());
823
- }
824
- getCurrentPosition() {
825
- return this.currentPosition;
826
- }
827
- }
828
- function Re(o, i, e, t = 0, s) {
829
- const l = (s == null ? void 0 : s.soft) ?? !1, r = (s == null ? void 0 : s.stiffness) ?? 100, n = (s == null ? void 0 : s.damping) ?? 10, h = (s == null ? void 0 : s.mass) ?? 1, c = e - o;
830
- if (l || 1 <= n / (2 * Math.sqrt(r * h))) {
831
- const p = -Math.sqrt(r / h), y = -p * c - i;
832
- return (f) => (f -= t, f < 0 ? o : e - (c + f * y) * Math.E ** (f * p));
833
- }
834
- const I = Math.sqrt(4 * h * r - n ** 2), d = (n * c - 2 * h * i) / I, m = 0.5 * I / h, u = -(0.5 * n) / h;
835
- return (p) => (p -= t, p < 0 ? o : e - (Math.cos(p * m) * c + Math.sin(p * m) * d) * Math.E ** (p * u));
836
- }
837
- class De {
838
- constructor(i) {
839
- a(this, "element", document.createElement("div"));
840
- a(this, "left", 0);
841
- a(this, "top", 0);
842
- a(this, "delay", 0);
843
- // 由 LyricPlayer 来设置
844
- a(this, "lineSize", [0, 0]);
845
- a(this, "lineTransforms", {
846
- posX: new U(0),
847
- posY: new U(0)
848
- });
849
- a(this, "lastStyle", "");
850
- this.lyricPlayer = i, this.element.setAttribute(
851
- "class",
852
- this.lyricPlayer.style.classes.lyricLine
853
- ), this.rebuildStyle();
854
- }
855
- measureSize() {
856
- return [
857
- this.element.clientWidth,
858
- this.element.clientHeight
859
- ];
860
- }
861
- show() {
862
- this.rebuildStyle();
863
- }
864
- hide() {
865
- this.rebuildStyle();
866
- }
867
- rebuildStyle() {
868
- let i = `transform:translate(${this.lineTransforms.posX.getCurrentPosition().toFixed(2)}px,${this.lineTransforms.posY.getCurrentPosition().toFixed(2)}px);`;
869
- !this.lyricPlayer.getEnableSpring() && this.isInSight && (i += `transition-delay:${this.delay}ms;`), i !== this.lastStyle && (this.lastStyle = i, this.element.setAttribute("style", i));
870
- }
871
- getElement() {
872
- return this.element;
873
- }
874
- setTransform(i = this.left, e = this.top, t = !1, s = 0) {
875
- this.left = i, this.top = e, this.delay = s * 1e3 | 0, t || !this.lyricPlayer.getEnableSpring() ? (t && this.element.classList.add(
876
- this.lyricPlayer.style.classes.tmpDisableTransition
877
- ), this.lineTransforms.posX.setPosition(i), this.lineTransforms.posY.setPosition(e), this.lyricPlayer.getEnableSpring() ? this.rebuildStyle() : this.show(), t && requestAnimationFrame(() => {
878
- this.element.classList.remove(
879
- this.lyricPlayer.style.classes.tmpDisableTransition
880
- );
881
- })) : (this.lineTransforms.posX.setTargetPosition(i, s), this.lineTransforms.posY.setTargetPosition(e, s));
882
- }
883
- update(i = 0) {
884
- this.lyricPlayer.getEnableSpring() && (this.lineTransforms.posX.update(i), this.lineTransforms.posY.update(i), this.isInSight ? this.show() : this.hide());
885
- }
886
- get isInSight() {
887
- const i = this.lineTransforms.posX.getCurrentPosition(), e = this.lineTransforms.posY.getCurrentPosition(), t = i + this.lineSize[0], s = e + this.lineSize[1], l = this.lyricPlayer.size[0], r = this.lyricPlayer.size[1];
888
- return !(i > l || e > r || t < 0 || s < 0);
889
- }
890
- dispose() {
891
- this.element.remove();
892
- }
893
- }
894
- function Fe(o) {
895
- const e = 2.5949095;
896
- return o < 0.5 ? Math.pow(2 * o, 2) * ((e + 1) * 2 * o - e) / 2 : (Math.pow(2 * o - 2, 2) * ((e + 1) * (o * 2 - 2) + e) + 2) / 2;
897
- }
898
- const D = (o, i, e) => Math.max(o, Math.min(i, e));
899
- class Ce {
900
- constructor(i) {
901
- a(this, "element", document.createElement("div"));
902
- a(this, "dot0", document.createElement("span"));
903
- a(this, "dot1", document.createElement("span"));
904
- a(this, "dot2", document.createElement("span"));
905
- a(this, "left", 0);
906
- a(this, "top", 0);
907
- a(this, "scale", 1);
908
- a(this, "playing", !0);
909
- a(this, "lastStyle", "");
910
- a(this, "currentInterlude");
911
- a(this, "currentTime", 0);
912
- a(this, "interludeTime", 0);
913
- a(this, "targetBreatheDuration", 1500);
914
- this.lyricPlayer = i, this.element.className = this.lyricPlayer.style.classes.interludeDots, this.element.appendChild(this.dot0), this.element.appendChild(this.dot1), this.element.appendChild(this.dot2);
915
- }
916
- getElement() {
917
- return this.element;
918
- }
919
- setTransform(i = this.left, e = this.top) {
920
- this.left = i, this.top = e, this.update();
921
- }
922
- setInterlude(i) {
923
- this.currentInterlude = i, this.currentTime = (i == null ? void 0 : i[0]) ?? 0;
924
- }
925
- pause() {
926
- this.playing = !1;
927
- }
928
- resume() {
929
- this.playing = !0;
930
- }
931
- update(i = 0) {
932
- if (!this.playing)
933
- return;
934
- this.currentTime += i;
935
- let e = "";
936
- if (e += `transform:translate(${this.left.toFixed(
937
- 2
938
- )}px, ${this.top.toFixed(2)}px)`, this.currentInterlude) {
939
- const t = this.currentInterlude[1] - this.currentInterlude[0], s = this.currentTime - this.currentInterlude[0];
940
- if (s <= t) {
941
- const l = t / Math.ceil(t / this.targetBreatheDuration);
942
- let r = 1, n = 1;
943
- r *= Math.sin(1.5 * Math.PI - s / l * 2) / 20 + 1, s < 1e3 && (r *= 1 - ((1e3 - s) / 1e3) ** 2), s < 500 ? n = 0 : s < 1e3 && (n *= (s - 500) / 500), t - s < 750 && (r *= 1 - Fe(
944
- (750 - (t - s)) / 750 / 2
945
- )), t - s < 375 && (n *= D(
946
- 0,
947
- (t - s) / 375,
948
- 1
949
- ));
950
- const h = Math.max(0, t - 750);
951
- r = Math.max(0, r) * 0.7, e += ` scale(${r})`;
952
- const c = D(
953
- 0.25,
954
- s * 3 / h * 0.75,
955
- 1
956
- ), I = D(
957
- 0.25,
958
- (s - h / 3) * 3 / h * 0.75,
959
- 1
960
- ), d = D(
961
- 0.25,
962
- (s - h / 3 * 2) * 3 / h * 0.75,
963
- 1
964
- );
965
- this.dot0.style.opacity = `${D(
966
- 0,
967
- Math.max(0, n * c),
968
- 1
969
- )}`, this.dot1.style.opacity = `${D(
970
- 0,
971
- Math.max(0, n * I),
972
- 1
973
- )}`, this.dot2.style.opacity = `${D(
974
- 0,
975
- Math.max(0, n * d),
976
- 1
977
- )}`;
978
- } else
979
- e += " scale(0)", this.dot0.style.opacity = "0", this.dot1.style.opacity = "0", this.dot2.style.opacity = "0";
980
- } else
981
- e += " scale(0)", this.dot0.style.opacity = "0", this.dot1.style.opacity = "0", this.dot2.style.opacity = "0";
982
- e += ";", this.lastStyle !== e && (this.element.setAttribute("style", e), this.lastStyle = e);
983
- }
984
- dispose() {
985
- this.element.remove();
986
- }
987
- }
988
- function ze() {
989
- return [
990
- 1,
991
- 0,
992
- 0,
993
- 0,
994
- 0,
995
- 1,
996
- 0,
997
- 0,
998
- 0,
999
- 0,
1000
- 1,
1001
- 0,
1002
- 0,
1003
- 0,
1004
- 0,
1005
- 1
1006
- ];
1007
- }
1008
- function Be(o, i = 1, e = { x: 0, y: 0 }) {
1009
- const [t, s] = [e.x, e.y];
1010
- return [
1011
- o[0] * i,
1012
- o[1] * i,
1013
- o[2] * i,
1014
- o[3],
1015
- o[4] * i,
1016
- o[5] * i,
1017
- o[6] * i,
1018
- o[7],
1019
- o[8] * i,
1020
- o[9] * i,
1021
- o[10] * i,
1022
- o[11],
1023
- o[12] - t * i + t,
1024
- o[13] - s * i + s,
1025
- o[14],
1026
- o[15]
1027
- ];
1028
- }
1029
- function ke(o, i = 4) {
1030
- const e = (t, s) => t.toFixed(i);
1031
- return `matrix3d(${o.map(e).join(", ")})`;
1032
- }
1033
- function Ue(o) {
1034
- return o && o.__esModule && Object.prototype.hasOwnProperty.call(o, "default") ? o.default : o;
1035
- }
1036
- var Oe = 4, _e = 1e-3, Ne = 1e-7, Ge = 10, B = 11, V = 1 / (B - 1), Ye = typeof Float32Array == "function";
1037
- function se(o, i) {
1038
- return 1 - 3 * i + 3 * o;
1039
- }
1040
- function le(o, i) {
1041
- return 3 * i - 6 * o;
1042
- }
1043
- function re(o) {
1044
- return 3 * o;
1045
- }
1046
- function H(o, i, e) {
1047
- return ((se(i, e) * o + le(i, e)) * o + re(i)) * o;
1048
- }
1049
- function ne(o, i, e) {
1050
- return 3 * se(i, e) * o * o + 2 * le(i, e) * o + re(i);
1051
- }
1052
- function qe(o, i, e, t, s) {
1053
- var l, r, n = 0;
1054
- do
1055
- r = i + (e - i) / 2, l = H(r, t, s) - o, l > 0 ? e = r : i = r;
1056
- while (Math.abs(l) > Ne && ++n < Ge);
1057
- return r;
1058
- }
1059
- function Ve(o, i, e, t) {
1060
- for (var s = 0; s < Oe; ++s) {
1061
- var l = ne(i, e, t);
1062
- if (l === 0)
1063
- return i;
1064
- var r = H(i, e, t) - o;
1065
- i -= r / l;
1066
- }
1067
- return i;
1068
- }
1069
- function We(o) {
1070
- return o;
1071
- }
1072
- var He = function(i, e, t, s) {
1073
- if (!(0 <= i && i <= 1 && 0 <= t && t <= 1))
1074
- throw new Error("bezier x values must be in [0, 1] range");
1075
- if (i === e && t === s)
1076
- return We;
1077
- for (var l = Ye ? new Float32Array(B) : new Array(B), r = 0; r < B; ++r)
1078
- l[r] = H(r * V, i, t);
1079
- function n(h) {
1080
- for (var c = 0, I = 1, d = B - 1; I !== d && l[I] <= h; ++I)
1081
- c += V;
1082
- --I;
1083
- var m = (h - l[I]) / (l[I + 1] - l[I]), u = c + m * V, p = ne(u, i, t);
1084
- return p >= _e ? Ve(h, u, i, t) : p === 0 ? u : qe(h, c, c + V, i, t);
1085
- }
1086
- return function(c) {
1087
- return c === 0 ? 0 : c === 1 ? 1 : H(n(c), e, s);
1088
- };
1089
- };
1090
- const $ = /* @__PURE__ */ Ue(He), Xe = /^[\p{Unified_Ideograph}\u0800-\u9FFC]+$/u, W = 32, ae = (o, i) => (e) => Math.min(1, Math.max(0, (e - o) / (i - o))), C = 0.4, Qe = ae(0, C), Ze = ae(C, 1), oe = (o) => {
1091
- const i = $(0.3, 0, 0.25, 1), e = $(0.5, 0, 0.3, 1);
1092
- return (t) => t < o ? i(Qe(t)) : 1 - e(Ze(t));
1093
- }, je = oe(C);
1094
- function ee(o, i = 0, e = "rgba(0,0,0,0.85)", t = "rgba(0,0,0,0.25)") {
1095
- const s = 2 + o + i, l = o / s, r = (1 - l) / 2;
1096
- return [
1097
- `linear-gradient(to right,${e} ${r * 100}%,${t} ${(r + l) * 100}%)`,
1098
- s
1099
- ];
1100
- }
1101
- function Je(o) {
1102
- const i = [];
1103
- for (const l of o) {
1104
- const r = l.word.replace(/\s/g, "").length, n = l.word.split(" ").filter((h) => h.trim().length > 0);
1105
- if (n.length > 1) {
1106
- l.word.startsWith(" ") && i.push({
1107
- word: " ",
1108
- startTime: 0,
1109
- endTime: 0
1110
- });
1111
- let h = 0;
1112
- for (const c of n) {
1113
- const I = {
1114
- word: c,
1115
- startTime: l.startTime + h / r * (l.endTime - l.startTime),
1116
- endTime: l.startTime + (h + c.length) / r * (l.endTime - l.startTime)
1117
- };
1118
- i.push(I), i.push({
1119
- word: " ",
1120
- startTime: 0,
1121
- endTime: 0
1122
- }), h += c.length;
1123
- }
1124
- l.word.endsWith(" ") || i.pop();
1125
- } else
1126
- i.push(l);
1127
- }
1128
- let e = [], t = [];
1129
- const s = [];
1130
- for (const l of i) {
1131
- const r = l.word;
1132
- e.push(r), t.push(l), r.length > 0 && r.trim().length === 0 ? (e.pop(), t.pop(), t.length === 1 ? s.push(t[0]) : t.length > 1 && s.push(t), s.push(l), e = [], t = []) : (!/^\s*[^\s]*\s*$/.test(e.join("")) || Xe.test(r)) && (e.pop(), t.pop(), t.length === 1 ? s.push(t[0]) : t.length > 1 && s.push(t), e = [r], t = [l]);
1133
- }
1134
- return t.length === 1 ? s.push(t[0]) : s.push(t), s;
1135
- }
1136
- function k(o) {
1137
- return o.endTime - o.startTime >= 1e3 && o.word.trim().length <= 7 && o.word.trim().length >= 1;
1138
- }
1139
- class Ke extends MouseEvent {
1140
- constructor(i, e) {
1141
- super(e.type, e), this.line = i;
1142
- }
1143
- }
1144
- class $e extends EventTarget {
1145
- // readonly lineWebAnimationTransforms = {
1146
- // posX: new WebAnimationSpring(this.element, "transform", (v) => `translateX(${v.toFixed(1)}px)`),
1147
- // posY: new WebAnimationSpring(this.element, "transform", (v) => `translateY(${v.toFixed(1)}px)`),
1148
- // scale: new WebAnimationSpring(this.element, "transform", (v) => `scale(${v.toFixed(4)})`, 1),
1149
- // };
1150
- constructor(e, t = {
1151
- words: [],
1152
- translatedLyric: "",
1153
- romanLyric: "",
1154
- startTime: 0,
1155
- endTime: 0,
1156
- isBG: !1,
1157
- isDuet: !1
1158
- }) {
1159
- super();
1160
- a(this, "element", document.createElement("div"));
1161
- a(this, "left", 0);
1162
- a(this, "top", 0);
1163
- a(this, "scale", 1);
1164
- a(this, "blur", 0);
1165
- a(this, "delay", 0);
1166
- a(this, "splittedWords", []);
1167
- // 由 LyricPlayer 来设置
1168
- a(this, "lineSize", [0, 0]);
1169
- a(this, "lineTransforms", {
1170
- posX: new U(0),
1171
- posY: new U(0),
1172
- scale: new U(1)
1173
- });
1174
- a(this, "listenersMap", /* @__PURE__ */ new Map());
1175
- a(this, "onMouseEvent", (e) => {
1176
- const t = new Ke(this, e);
1177
- for (const s of this.listenersMap.get(e.type) ?? [])
1178
- s.call(this, t);
1179
- if (!this.dispatchEvent(t) || t.defaultPrevented)
1180
- return e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation(), !1;
1181
- });
1182
- a(this, "isEnabled", !1);
1183
- a(this, "_hide", !0);
1184
- a(this, "_prevParentEl", null);
1185
- a(this, "lastStyle", "");
1186
- this.lyricPlayer = e, this.lyricLine = t, this._prevParentEl = e.getElement(), this.element.setAttribute(
1187
- "class",
1188
- this.lyricPlayer.style.classes.lyricLine
1189
- ), this.lyricLine.isBG && this.element.classList.add(this.lyricPlayer.style.classes.lyricBgLine), this.lyricLine.isDuet && this.element.classList.add(this.lyricPlayer.style.classes.lyricDuetLine), this.element.appendChild(document.createElement("div")), this.element.appendChild(document.createElement("div")), this.element.appendChild(document.createElement("div"));
1190
- const s = this.element.children[0], l = this.element.children[1], r = this.element.children[2];
1191
- s.setAttribute("class", this.lyricPlayer.style.classes.lyricMainLine), l.setAttribute("class", this.lyricPlayer.style.classes.lyricSubLine), r.setAttribute("class", this.lyricPlayer.style.classes.lyricSubLine), this.rebuildElement(), this.rebuildStyle();
1192
- }
1193
- addMouseEventListener(e, t, s) {
1194
- if (t) {
1195
- const l = this.listenersMap.get(e) ?? /* @__PURE__ */ new Set();
1196
- l.size === 0 && this.element.addEventListener(e, this.onMouseEvent, s), l.add(t), this.listenersMap.set(e, l);
1197
- }
1198
- }
1199
- removeMouseEventListener(e, t, s) {
1200
- if (t) {
1201
- const l = this.listenersMap.get(e);
1202
- l && (l.delete(t), l.size === 0 && this.element.removeEventListener(e, this.onMouseEvent, s));
1203
- }
1204
- }
1205
- enable(e = this.lyricLine.startTime) {
1206
- this.isEnabled = !0, this.element.classList.add("active");
1207
- const t = this.element.children[0];
1208
- for (const s of this.splittedWords) {
1209
- for (const l of s.elementAnimations)
1210
- l.currentTime = 0, l.playbackRate = 1, l.play();
1211
- for (const l of s.maskAnimations)
1212
- l.currentTime = Math.min(
1213
- this.totalDuration,
1214
- Math.max(0, e - this.lyricLine.startTime)
1215
- ), l.playbackRate = 1, l.play();
1216
- }
1217
- t.classList.add("active");
1218
- }
1219
- disable(e = 0) {
1220
- this.isEnabled = !1, this.element.classList.remove("active");
1221
- const t = this.element.children[0];
1222
- for (const s of this.splittedWords) {
1223
- for (const l of s.elementAnimations)
1224
- l.id === "float-word" && (l.playbackRate = -1, l.play());
1225
- for (const l of s.maskAnimations)
1226
- l.currentTime = Math.min(
1227
- this.totalDuration,
1228
- Math.max(0, e - this.lyricLine.startTime)
1229
- ), l.pause();
1230
- }
1231
- t.classList.remove("active");
1232
- }
1233
- resume() {
1234
- if (this.isEnabled)
1235
- for (const e of this.splittedWords)
1236
- for (const t of e.maskAnimations)
1237
- t.play();
1238
- }
1239
- pause() {
1240
- if (this.isEnabled)
1241
- for (const e of this.splittedWords)
1242
- for (const t of e.maskAnimations)
1243
- t.pause();
1244
- }
1245
- setMaskAnimationState(e = 0) {
1246
- const t = e - this.lyricLine.startTime;
1247
- for (const s of this.splittedWords)
1248
- for (const l of s.maskAnimations)
1249
- l.currentTime = Math.min(this.totalDuration, Math.max(0, t)), l.playbackRate = 1, t >= 0 && t < this.totalDuration ? l.play() : l.pause();
1250
- }
1251
- measureSize() {
1252
- this._hide && (this._prevParentEl && this._prevParentEl.appendChild(this.element), this.element.style.display = "", this.element.style.visibility = "hidden");
1253
- const e = [
1254
- this.element.clientWidth,
1255
- this.element.clientHeight
1256
- ];
1257
- return this._hide && (this._prevParentEl && this.element.remove(), this.element.style.display = "none", this.element.style.visibility = ""), e;
1258
- }
1259
- setLine(e) {
1260
- this.lyricLine = e, this.lyricLine.isBG ? this.element.classList.add(this.lyricPlayer.style.classes.lyricBgLine) : this.element.classList.remove(this.lyricPlayer.style.classes.lyricBgLine), this.lyricLine.isDuet ? this.element.classList.add(this.lyricPlayer.style.classes.lyricDuetLine) : this.element.classList.remove(
1261
- this.lyricPlayer.style.classes.lyricDuetLine
1262
- ), this.rebuildElement(), this.rebuildStyle();
1263
- }
1264
- getLine() {
1265
- return this.lyricLine;
1266
- }
1267
- show() {
1268
- this._hide = !1, this._prevParentEl && (this._prevParentEl.appendChild(this.element), this._prevParentEl = null), this.rebuildStyle();
1269
- }
1270
- hide() {
1271
- this._hide = !0, this.element.parentElement && (this._prevParentEl = this.element.parentElement, this.element.remove()), this.rebuildStyle();
1272
- }
1273
- rebuildStyle() {
1274
- if (this._hide) {
1275
- this.lastStyle !== "display:none;transform:translate(0,-10000px);" && (this.lastStyle = "display:none;transform:translate(0,-10000px);", this.element.setAttribute(
1276
- "style",
1277
- "display:none;transform:translate(0,-10000px);"
1278
- ));
1279
- return;
1280
- }
1281
- let e = "";
1282
- e += `transform:translate(${this.lineTransforms.posX.getCurrentPosition().toFixed(1)}px,${this.lineTransforms.posY.getCurrentPosition().toFixed(1)}px) scale(${this.lineTransforms.scale.getCurrentPosition().toFixed(4)});`, !this.lyricPlayer.getEnableSpring() && this.isInSight && (e += `transition-delay:${this.delay}ms;`), e += `filter:blur(${Math.min(32, this.blur)}px);`, e !== this.lastStyle && (this.lastStyle = e, this.element.setAttribute("style", e));
1283
- }
1284
- rebuildElement() {
1285
- const e = this.element.children[0], t = this.element.children[1], s = this.element.children[2];
1286
- if (this.lyricPlayer._getIsNonDynamic()) {
1287
- e.innerText = this.lyricLine.words.map((r) => r.word).join(""), t.innerText = this.lyricLine.translatedLyric, s.innerText = this.lyricLine.romanLyric;
1288
- return;
1289
- }
1290
- const l = Je(this.lyricLine.words);
1291
- e.innerHTML = "", this.splittedWords = [];
1292
- for (const r of l)
1293
- if (Array.isArray(r)) {
1294
- if (r.length === 0)
1295
- continue;
1296
- const n = r.reduce(
1297
- (d, m) => (d.endTime = Math.max(d.endTime, m.endTime), d.startTime = Math.min(d.startTime, m.startTime), d.word += m.word, d),
1298
- { word: "", startTime: 1 / 0, endTime: -1 / 0 }
1299
- ), h = r.map((d) => k(d)).reduce((d, m) => d || m, k(n)), c = document.createElement("span");
1300
- c.classList.add("emphasize-wrapper");
1301
- const I = [];
1302
- for (const d of r) {
1303
- const m = document.createElement("span");
1304
- if (h) {
1305
- m.classList.add("emphasize");
1306
- const u = [];
1307
- for (const y of d.word.trim().split("")) {
1308
- const f = document.createElement("span");
1309
- f.innerText = y, u.push(f), I.push(f), m.appendChild(f);
1310
- }
1311
- const p = {
1312
- ...d,
1313
- mainElement: m,
1314
- subElements: u,
1315
- elementAnimations: [this.initFloatAnimation(n, m)],
1316
- maskAnimations: [],
1317
- width: 0,
1318
- height: 0,
1319
- padding: 0,
1320
- shouldEmphasize: h
1321
- };
1322
- this.splittedWords.push(p);
1323
- } else
1324
- m.innerText = d.word, this.splittedWords.push({
1325
- ...d,
1326
- mainElement: m,
1327
- subElements: [],
1328
- elementAnimations: [this.initFloatAnimation(d, m)],
1329
- maskAnimations: [],
1330
- width: 0,
1331
- height: 0,
1332
- padding: 0,
1333
- shouldEmphasize: h
1334
- });
1335
- c.appendChild(m);
1336
- }
1337
- h && this.splittedWords[this.splittedWords.length - 1].elementAnimations.push(
1338
- ...this.initEmphasizeAnimation(
1339
- I,
1340
- n.endTime - n.startTime,
1341
- n.startTime - this.lyricLine.startTime
1342
- )
1343
- ), n.word.trimStart() !== n.word && e.appendChild(document.createTextNode(" ")), e.appendChild(c), n.word.trimEnd() !== n.word && e.appendChild(document.createTextNode(" "));
1344
- } else if (r.word.trim().length === 0)
1345
- e.appendChild(document.createTextNode(" "));
1346
- else {
1347
- const n = k(r), h = document.createElement("span"), c = {
1348
- ...r,
1349
- mainElement: h,
1350
- subElements: [],
1351
- elementAnimations: [this.initFloatAnimation(r, h)],
1352
- maskAnimations: [],
1353
- width: 0,
1354
- height: 0,
1355
- padding: 0,
1356
- shouldEmphasize: n
1357
- };
1358
- if (n) {
1359
- h.classList.add("emphasize");
1360
- const I = [];
1361
- for (const m of r.word.trim().split("")) {
1362
- const u = document.createElement("span");
1363
- u.innerText = m, I.push(u), h.appendChild(u);
1364
- }
1365
- c.subElements = I;
1366
- const d = Math.abs(c.endTime - c.startTime);
1367
- c.elementAnimations.push(
1368
- ...this.initEmphasizeAnimation(
1369
- I,
1370
- d,
1371
- c.startTime - this.lyricLine.startTime
1372
- )
1373
- );
1374
- } else
1375
- h.innerText = r.word.trim();
1376
- r.word.trimStart() !== r.word && e.appendChild(document.createTextNode(" ")), e.appendChild(h), r.word.trimEnd() !== r.word && e.appendChild(document.createTextNode(" ")), this.splittedWords.push(c);
1377
- }
1378
- t.innerText = this.lyricLine.translatedLyric, s.innerText = this.lyricLine.romanLyric;
1379
- }
1380
- initFloatAnimation(e, t) {
1381
- const s = e.startTime - this.lyricLine.startTime, l = Math.max(1e3, e.endTime - e.startTime);
1382
- let r = 0.05;
1383
- this.lyricLine.isBG && (r *= 2), k(e) && l < 1200 && (r = 0);
1384
- const n = t.animate(
1385
- [
1386
- {
1387
- transform: "translateY(0px)"
1388
- },
1389
- {
1390
- transform: `translateY(${-r}em)`
1391
- }
1392
- ],
1393
- {
1394
- duration: isFinite(l) ? l : 0,
1395
- delay: isFinite(s) ? s : 0,
1396
- id: "float-word",
1397
- composite: "add",
1398
- fill: "both",
1399
- easing: "ease-out"
1400
- }
1401
- );
1402
- return n.pause(), n;
1403
- }
1404
- // 按照原 Apple Music 参考,强调效果只应用缩放、轻微左右位移和辉光效果,原主要的悬浮位移效果不变
1405
- // 为了避免产生锯齿抖动感,使用 matrix3d 来实现缩放和位移
1406
- initEmphasizeAnimation(e, t, s) {
1407
- const l = Math.max(0, s), r = Math.max(1e3, t);
1408
- let n = "float-and-glow";
1409
- r < 1200 && (n = "float-only");
1410
- let h = [];
1411
- switch (n) {
1412
- case "float-and-glow": {
1413
- let c = 0, I = 0;
1414
- r >= 1200 && r < 2e3 ? (c = 0.7, I = 0.5) : r >= 2e3 && r < 3e3 ? (c = 0.8, I = 0.6) : (r >= 3e3 && r < 4e3 || r >= 4e3) && (c = 1, I = 0.8);
1415
- const d = Number.isFinite(r) ? Math.max(r * 1.2, 2e3) : 0, m = oe(C);
1416
- h = e.flatMap((u, p, y) => {
1417
- const f = l + r / 3 / y.length * p, g = [], E = new Array(W).fill(0).map((w, T) => {
1418
- const b = (T + 1) / W, S = m(b), M = Math.sin(b * Math.PI * 2), x = Math.max(0, b < C ? S / 2 : S - 0.5) * I, P = Be(ze(), 1 + S * 0.1 * c);
1419
- return {
1420
- offset: b,
1421
- transform: `${ke(P, 4)} translate(${M * 5e-3 * c}em,${-S * 0.05}em)`,
1422
- textShadow: `rgba(255, 255, 255, ${x}) 0 0 10px`
1423
- };
1424
- }), L = u.animate(E, {
1425
- duration: d,
1426
- delay: Number.isFinite(f) ? f : 0,
1427
- id: `emphasize-word-float-and-glow-${u.innerText}-${p}`,
1428
- iterations: 1,
1429
- composite: "replace",
1430
- easing: "linear",
1431
- fill: "both"
1432
- });
1433
- return L.onfinish = () => {
1434
- L.pause();
1435
- }, L.pause(), g.push(L), g;
1436
- });
1437
- break;
1438
- }
1439
- case "float-only": {
1440
- h = e.flatMap((c, I, d) => {
1441
- const m = l + r / 1.5 / d.length * I, u = [], p = new Array(W).fill(0).map((f, g) => {
1442
- const E = (g + 1) / W, L = E < C ? je(E) : 1;
1443
- return {
1444
- offset: E,
1445
- transform: `translateY(${-L * 0.05}em)`
1446
- };
1447
- }), y = c.animate(p, {
1448
- duration: Number.isFinite(r) ? r * 2 : 0,
1449
- delay: Number.isFinite(m) ? m : 0,
1450
- id: `emphasize-word-float-only-${c.innerText}-${I}`,
1451
- iterations: 1,
1452
- composite: "replace",
1453
- easing: "linear",
1454
- fill: "both"
1455
- });
1456
- return y.onfinish = () => {
1457
- y.pause();
1458
- }, y.pause(), u.push(y), u;
1459
- });
1460
- break;
1461
- }
1462
- }
1463
- return h;
1464
- }
1465
- get totalDuration() {
1466
- return this.lyricLine.endTime - this.lyricLine.startTime;
1467
- }
1468
- updateMaskImage() {
1469
- this._hide && (this._prevParentEl && this._prevParentEl.appendChild(this.element), this.element.style.display = "", this.element.style.visibility = "hidden");
1470
- for (const e of this.splittedWords) {
1471
- const t = e.mainElement;
1472
- t ? (e.padding = parseFloat(getComputedStyle(t).paddingLeft), e.width = t.clientWidth - e.padding * 2, e.height = t.clientHeight - e.padding * 2) : (e.width = 0, e.height = 0, e.padding = 0);
1473
- }
1474
- this.lyricPlayer.supportMaskImage ? this.generateWebAnimationBasedMaskImage() : this.generateCalcBasedMaskImage(), this._hide && (this._prevParentEl && this.element.remove(), this.element.style.display = "none", this.element.style.visibility = "");
1475
- }
1476
- generateCalcBasedMaskImage() {
1477
- for (const e of this.splittedWords) {
1478
- const t = e.mainElement;
1479
- if (t) {
1480
- e.width = t.clientWidth, e.height = t.clientHeight;
1481
- const s = e.height / 2, [l, r] = ee(
1482
- s / e.width
1483
- ), n = `${r * 100}% 100%`;
1484
- this.lyricPlayer.supportMaskImage ? (t.style.maskImage = l, t.style.maskRepeat = "no-repeat", t.style.maskOrigin = "left", t.style.maskSize = n) : (t.style.webkitMaskImage = l, t.style.webkitMaskRepeat = "no-repeat", t.style.webkitMaskOrigin = "left", t.style.webkitMaskSize = n);
1485
- const h = e.width + s, c = `clamp(${-h}px,calc(${-h}px + (var(--amll-player-time) - ${e.startTime})*${h / Math.abs(e.endTime - e.startTime)}px),0px) 0px, left top`;
1486
- t.style.maskPosition = c, t.style.webkitMaskPosition = c;
1487
- }
1488
- }
1489
- }
1490
- generateWebAnimationBasedMaskImage() {
1491
- const e = this.totalDuration;
1492
- this.splittedWords.forEach((t, s) => {
1493
- const l = t.mainElement;
1494
- if (l) {
1495
- const r = t.height / 2, [n, h] = ee(
1496
- r / (t.width + t.padding * 2)
1497
- ), c = `${h * 100}% 100%`;
1498
- this.lyricPlayer.supportMaskImage ? (l.style.maskImage = n, l.style.maskRepeat = "no-repeat", l.style.maskOrigin = "left", l.style.maskSize = c) : (l.style.webkitMaskImage = n, l.style.webkitMaskRepeat = "no-repeat", l.style.webkitMaskOrigin = "left", l.style.webkitMaskSize = c);
1499
- const I = this.splittedWords.slice(0, s).reduce((w, T) => w + T.width, 0) + (this.splittedWords[0] ? r : 0), d = -(t.width + t.padding * 2 + r), m = (w) => Math.max(d, Math.min(0, w));
1500
- let u = -I - t.width - t.padding - r, p = 0;
1501
- const y = [];
1502
- let f = u, g = 0;
1503
- const E = () => {
1504
- const w = u - f, T = Math.max(0, Math.min(1, p)), b = T - g, S = Math.abs(b / w);
1505
- if (u > d && f < d) {
1506
- const P = Math.abs(f - d) * S, A = `${m(f)}px 0`, v = {
1507
- offset: g + P,
1508
- maskPosition: A
1509
- };
1510
- y.push(v);
1511
- }
1512
- if (u > 0 && f < 0) {
1513
- const P = Math.abs(f) * S, A = `${m(u)}px 0`, v = {
1514
- offset: g + P,
1515
- maskPosition: A
1516
- };
1517
- y.push(v);
1518
- }
1519
- const M = `${m(u)}px 0`, x = {
1520
- offset: T,
1521
- maskPosition: M
1522
- };
1523
- y.push(x), f = u, g = T;
1524
- };
1525
- E();
1526
- let L = 0;
1527
- this.splittedWords.forEach((w, T) => {
1528
- {
1529
- const b = w.startTime - this.lyricLine.startTime, S = b - L;
1530
- p += S / e, S > 0 && E(), L = b;
1531
- }
1532
- {
1533
- const b = w.endTime - w.startTime;
1534
- p += b / e, u += w.width, T === 0 && (u += r * 1.5), T === this.splittedWords.length - 1 && (u += r * 0.5), b > 0 && E(), L += b;
1535
- }
1536
- });
1537
- for (const w of t.maskAnimations)
1538
- w.cancel();
1539
- try {
1540
- const w = l.animate(y, {
1541
- duration: e || 1,
1542
- id: `fade-word-${t.word}-${s}`,
1543
- easing: "linear",
1544
- fill: "both"
1545
- });
1546
- w.pause(), t.maskAnimations = [w];
1547
- } catch (w) {
1548
- console.warn("应用渐变动画发生错误", y, e, w);
1549
- }
1550
- }
1551
- });
1552
- }
1553
- getElement() {
1554
- return this.element;
1555
- }
1556
- setTransform(e = this.left, t = this.top, s = this.scale, l = 1, r = 0, n = !1, h = 0) {
1557
- const c = Math.round(r), I = this.isInSight, d = this.lyricPlayer.getEnableSpring();
1558
- this.left = e, this.top = t, this.scale = s, this.delay = h * 1e3 | 0;
1559
- const m = this.element.children[0], u = this.element.children[1], p = this.element.children[2];
1560
- if (m.style.opacity = `${l}`, u.style.opacity = `${l / 2}`, p.style.opacity = `${l / 2}`, n || !d) {
1561
- if (this.blur = Math.min(32, c), n && this.element.classList.add(
1562
- this.lyricPlayer.style.classes.tmpDisableTransition
1563
- ), this.lineTransforms.posX.setPosition(e), this.lineTransforms.posY.setPosition(t), this.lineTransforms.scale.setPosition(s), d)
1564
- this.rebuildStyle();
1565
- else {
1566
- const y = this.isInSight;
1567
- I || y ? this.show() : this.hide();
1568
- }
1569
- n && requestAnimationFrame(() => {
1570
- this.element.classList.remove(
1571
- this.lyricPlayer.style.classes.tmpDisableTransition
1572
- );
1573
- });
1574
- } else
1575
- this.lineTransforms.posX.setTargetPosition(e, h), this.lineTransforms.posY.setTargetPosition(t, h), this.lineTransforms.scale.setTargetPosition(s), this.blur !== Math.min(32, c) && (this.blur = Math.min(32, c), this.element.style.filter = `blur(${Math.min(32, c)}px)`);
1576
- }
1577
- update(e = 0) {
1578
- this.lyricPlayer.getEnableSpring() && (this.lineTransforms.posX.update(e), this.lineTransforms.posY.update(e), this.lineTransforms.scale.update(e), this.isInSight ? this.show() : this.hide());
1579
- }
1580
- _getDebugTargetPos() {
1581
- return `[位移: ${this.left}, ${this.top}; 缩放: ${this.scale}; 延时: ${this.delay}]`;
1582
- }
1583
- get isInSight() {
1584
- const e = this.lineTransforms.posX.getCurrentPosition(), t = this.lineTransforms.posY.getCurrentPosition(), s = e + this.lineSize[0], l = t + this.lineSize[1], r = this.lyricPlayer.size[0], n = this.lyricPlayer.size[1];
1585
- return !(e > r || s < 0 || t > n || l < 0);
1586
- }
1587
- dispose() {
1588
- this.element.remove();
1589
- }
1590
- }
1591
- const et = fe(ue());
1592
- class tt extends MouseEvent {
1593
- constructor(i, e, t) {
1594
- super(`line-${t.type}`, t), this.lineIndex = i, this.line = e;
1595
- }
1596
- }
1597
- class mt extends EventTarget {
1598
- constructor() {
1599
- super();
1600
- a(this, "element", document.createElement("div"));
1601
- a(this, "currentTime", 0);
1602
- a(this, "lyricLines", []);
1603
- a(this, "processedLines", []);
1604
- a(this, "lyricLinesEl", []);
1605
- a(this, "lyricLinesSize", /* @__PURE__ */ new WeakMap());
1606
- a(this, "lyricLinesIndexes", /* @__PURE__ */ new WeakMap());
1607
- a(this, "hotLines", /* @__PURE__ */ new Set());
1608
- a(this, "bufferedLines", /* @__PURE__ */ new Set());
1609
- a(this, "scrollToIndex", 0);
1610
- a(this, "allowScroll", !0);
1611
- a(this, "scrolledHandler", 0);
1612
- a(this, "isScrolled", !1);
1613
- a(this, "invokedByScrollEvent", !1);
1614
- a(this, "scrollOffset", 0);
1615
- a(this, "hidePassedLines", !1);
1616
- a(this, "resizeObserver", new ResizeObserver((e) => {
1617
- const t = e[0].contentRect;
1618
- this.size[0] = t.width, this.size[1] = t.height;
1619
- const s = getComputedStyle(e[0].target), l = this.element.clientWidth - parseFloat(s.paddingLeft) - parseFloat(s.paddingRight), r = this.element.clientHeight - parseFloat(s.paddingTop) - parseFloat(s.paddingBottom);
1620
- this.innerSize[0] = l, this.innerSize[1] = r, this.rebuildStyle(), this.calcLayout(!0, !0), this.lyricLinesEl.forEach((n) => n.updateMaskImage());
1621
- }));
1622
- a(this, "posXSpringParams", {
1623
- mass: 1,
1624
- damping: 10,
1625
- stiffness: 100
1626
- });
1627
- a(this, "posYSpringParams", {
1628
- mass: 1,
1629
- damping: 16.5,
1630
- stiffness: 100
1631
- });
1632
- a(this, "scaleSpringParams", {
1633
- mass: 1,
1634
- damping: 20,
1635
- stiffness: 100
1636
- });
1637
- a(this, "emUnit", Math.max(Math.min(innerHeight * 0.05, innerWidth * 0.1), 12));
1638
- a(this, "padding", this.emUnit);
1639
- a(this, "enableBlur", !0);
1640
- a(this, "enableScale", !0);
1641
- a(this, "interludeDots");
1642
- a(this, "interludeDotsSize", [0, 0]);
1643
- a(this, "bottomLine");
1644
- a(this, "supportPlusLighter", CSS.supports("mix-blend-mode", "plus-lighter"));
1645
- a(this, "supportMaskImage", CSS.supports("mask-image", "none"));
1646
- a(this, "disableSpring", !1);
1647
- a(this, "alignAnchor", "center");
1648
- a(this, "alignPosition", 0.5);
1649
- a(this, "isNonDynamic", !1);
1650
- a(this, "scrollBoundary", [0, 0]);
1651
- a(this, "size", [0, 0]);
1652
- a(this, "innerSize", [0, 0]);
1653
- a(this, "onLineClickedHandler", (e) => {
1654
- const t = new tt(
1655
- this.lyricLinesIndexes.get(e.line) ?? -1,
1656
- e.line,
1657
- e
1658
- );
1659
- this.dispatchEvent(t) || (e.preventDefault(), e.stopPropagation(), e.stopImmediatePropagation());
1660
- });
1661
- a(this, "style", et.createStyleSheet({
1662
- lyricPlayer: {
1663
- userSelect: "none",
1664
- fontSize: "var(--amll-lyric-player-font-size,max(min(6vh, 8vw), 12px))",
1665
- padding: "1em",
1666
- margin: "-1em",
1667
- width: "100%",
1668
- height: "100%",
1669
- overflow: "hidden",
1670
- boxSizing: "content-box",
1671
- maxWidth: "100%",
1672
- maxHeight: "100%",
1673
- zIndex: 1,
1674
- color: "var(--amll-lyric-view-color,white)",
1675
- mixBlendMode: "plus-lighter",
1676
- contain: "strict",
1677
- "&:hover": {
1678
- "& $lyricLine": {
1679
- filter: "unset !important"
1680
- }
1681
- }
1682
- },
1683
- lyricLine: {
1684
- position: "absolute",
1685
- backfaceVisibility: "hidden",
1686
- transformOrigin: "left",
1687
- width: "var(--amll-lyric-player-width,100%)",
1688
- height: "fit-content",
1689
- padding: "2vh 1.05em",
1690
- margin: "0 -1em",
1691
- contain: "content",
1692
- willChange: "filter,transform,opacity",
1693
- transition: "filter 0.25s, background-color 0.25s, box-shadow 0.25s",
1694
- boxSizing: "content-box",
1695
- borderRadius: "8px",
1696
- "&:has(>*):hover": {
1697
- backgroundColor: "var(--amll-lyric-view-hover-bg-color,#fff1)",
1698
- boxShadow: "0 0 0 8px var(--amll-lyric-view-hover-bg-color,#fff1)"
1699
- },
1700
- "&:has(>*):active": {
1701
- boxShadow: "0 0 0 4px var(--amll-lyric-view-hover-bg-color,#fff1)"
1702
- }
1703
- },
1704
- "@media (max-width: 1024px)": {
1705
- lyricLine: {
1706
- padding: "1vh 1em"
1707
- }
1708
- },
1709
- lyricDuetLine: {
1710
- textAlign: "right",
1711
- transformOrigin: "right"
1712
- },
1713
- lyricBgLine: {
1714
- opacity: 0,
1715
- fontSize: "max(50%, 10px)",
1716
- transition: "opacity 0.25s",
1717
- "&.active": {
1718
- transition: "opacity 0.25s 0.25s",
1719
- opacity: 0.4
1720
- }
1721
- },
1722
- lyricMainLine: {
1723
- transition: "opacity 0.3s 0.25s",
1724
- willChange: "opacity",
1725
- margin: "-1em",
1726
- padding: "1em",
1727
- "& span": {
1728
- display: "inline-block"
1729
- },
1730
- "& > span, span.emphasize-wrapper": {
1731
- whiteSpace: "pre-wrap",
1732
- willChange: "transform,display,mask-image",
1733
- display: "inline-block",
1734
- "&.emphasize, span.emphasize": {
1735
- padding: "1em",
1736
- margin: "-1em",
1737
- "& > span": {
1738
- padding: "1em",
1739
- margin: "-1em"
1740
- }
1741
- }
1742
- }
1743
- },
1744
- lyricSubLine: {
1745
- fontSize: "max(0.5em, 10px)",
1746
- transition: "opacity 0.3s 0.25s",
1747
- opacity: 0.3
1748
- },
1749
- disableSpring: {
1750
- "& > *": {
1751
- transition: "filter 0.25s, transform 0.5s, background-color 0.25s, box-shadow 0.25s"
1752
- }
1753
- },
1754
- interludeDots: {
1755
- height: "clamp(0.5em,1vh,3em)",
1756
- transformOrigin: "center",
1757
- width: "fit-content",
1758
- padding: "2.5% 0",
1759
- position: "absolute",
1760
- display: "flex",
1761
- gap: "0.25em",
1762
- left: "1em",
1763
- "& > *": {
1764
- height: "clamp(0.5em,1vh,3em)",
1765
- display: "inline-block",
1766
- borderRadius: "50%",
1767
- aspectRatio: "1 / 1",
1768
- backgroundColor: "var(--amll-lyric-view-color,white)",
1769
- marginRight: "4px"
1770
- },
1771
- "&.duet": {
1772
- right: "1em",
1773
- transformOrigin: "center"
1774
- }
1775
- },
1776
- "@supports (mix-blend-mode: plus-lighter)": {
1777
- lyricSubLine: {
1778
- opacity: 0.3
1779
- }
1780
- },
1781
- tmpDisableTransition: {
1782
- transition: "none !important"
1783
- }
1784
- }));
1785
- a(this, "_baseFontSize", parseFloat(getComputedStyle(this.element).fontSize));
1786
- a(this, "isPageVisible", !0);
1787
- a(this, "onPageShow", () => {
1788
- this.isPageVisible = !0, this.setCurrentTime(this.currentTime, !0);
1789
- });
1790
- a(this, "onPageHide", () => {
1791
- this.isPageVisible = !1;
1792
- });
1793
- this.interludeDots = new Ce(this), this.bottomLine = new De(this), this.element.setAttribute("class", this.style.classes.lyricPlayer), this.disableSpring && this.element.classList.add(this.style.classes.disableSpring), this.rebuildStyle(), this.resizeObserver.observe(this.element), this.element.appendChild(this.interludeDots.getElement()), this.element.appendChild(this.bottomLine.getElement()), this.style.attach(), this.interludeDots.setTransform(0, 200), window.addEventListener("pageshow", this.onPageShow), window.addEventListener("pagehide", this.onPageHide);
1794
- let e = 0, t = "none", s = 0, l = 0, r = 0, n = Symbol("amll-scroll"), h = 0, c = 0;
1795
- this.element.addEventListener("touchstart", (I) => {
1796
- this.beginScrollHandler() && (I.preventDefault(), e = this.scrollOffset, s = I.touches[0].screenY, h = s, l = Date.now(), r = 0);
1797
- }), this.element.addEventListener("touchmove", (I) => {
1798
- if (this.beginScrollHandler()) {
1799
- I.preventDefault();
1800
- const d = I.touches[0].screenY, m = d - s, u = d - h, p = u > 0 ? "down" : u < 0 ? "up" : "none";
1801
- t !== p ? (t = p, e = this.scrollOffset, s = d, l = Date.now()) : this.scrollOffset = e - m, h = d, c = Date.now(), this.limitScrollOffset(), this.calcLayout(!0);
1802
- }
1803
- }), this.element.addEventListener("touchend", (I) => {
1804
- if (this.beginScrollHandler()) {
1805
- I.preventDefault(), s = 0;
1806
- const d = Date.now();
1807
- if (d - c > 100)
1808
- return this.endScrollHandler();
1809
- const m = d - l;
1810
- r = (this.scrollOffset - e) / m * 1e3;
1811
- let u = 0;
1812
- const p = Symbol("amll-scroll");
1813
- n = p;
1814
- const y = (f) => {
1815
- u || (u = f), n === p && this.beginScrollHandler() && (this.scrollOffset += r * (f - u) / 1e3, r *= 0.99, this.limitScrollOffset(), this.calcLayout(!0), Math.abs(r) > 1 && !this.scrollBoundary.includes(this.scrollOffset) && requestAnimationFrame(y), this.endScrollHandler(), u = f);
1816
- };
1817
- requestAnimationFrame(y), this.endScrollHandler();
1818
- }
1819
- }), this.element.addEventListener("wheel", (I) => {
1820
- this.beginScrollHandler() && (I.deltaMode === I.DOM_DELTA_PIXEL ? (this.scrollOffset += I.deltaY, this.limitScrollOffset(), this.calcLayout(!0)) : (this.scrollOffset += I.deltaY * 50, this.limitScrollOffset(), this.calcLayout(!1)), this.endScrollHandler());
1821
- });
1822
- }
1823
- _getIsNonDynamic() {
1824
- return this.isNonDynamic;
1825
- }
1826
- /**
1827
- * 设置是否使用物理弹簧算法实现歌词动画效果,默认启用
1828
- *
1829
- * 如果启用,则会通过弹簧算法实时处理歌词位置,但是需要性能足够强劲的电脑方可流畅运行
1830
- *
1831
- * 如果不启用,则会回退到基于 `transition` 的过渡效果,对低性能的机器比较友好,但是效果会比较单一
1832
- */
1833
- setEnableSpring(e = !0) {
1834
- this.disableSpring = !e, e ? this.element.classList.remove(this.style.classes.disableSpring) : this.element.classList.add(this.style.classes.disableSpring), this.calcLayout(!0);
1835
- }
1836
- /**
1837
- * 获取当前是否启用了物理弹簧
1838
- * @returns 是否启用物理弹簧
1839
- */
1840
- getEnableSpring() {
1841
- return !this.disableSpring;
1842
- }
1843
- /**
1844
- * 是否启用歌词行缩放效果,默认启用
1845
- *
1846
- * 如果启用,非选中的歌词行会轻微缩小以凸显当前播放歌词行效果
1847
- *
1848
- * 此效果对性能影响微乎其微,推荐启用
1849
- * @param enable 是否启用歌词行缩放效果
1850
- */
1851
- setEnableScale(e = !0) {
1852
- this.enableScale = e, this.calcLayout();
1853
- }
1854
- /**
1855
- * 获取当前是否启用了歌词行缩放效果
1856
- * @returns 是否启用歌词行缩放效果
1857
- */
1858
- getEnableScale() {
1859
- return this.enableScale;
1860
- }
1861
- get baseFontSize() {
1862
- return this._baseFontSize;
1863
- }
1864
- beginScrollHandler() {
1865
- const e = this.allowScroll;
1866
- return e && (this.isScrolled = !0, this.invokedByScrollEvent = !0, clearTimeout(this.scrolledHandler), this.scrolledHandler = setTimeout(() => {
1867
- this.isScrolled = !1, this.scrollOffset = 0;
1868
- }, 5e3)), e;
1869
- }
1870
- endScrollHandler() {
1871
- this.invokedByScrollEvent = !1;
1872
- }
1873
- limitScrollOffset() {
1874
- this.scrollOffset = Math.max(
1875
- Math.min(this.scrollBoundary[1], this.scrollOffset),
1876
- this.scrollBoundary[0]
1877
- );
1878
- }
1879
- /**
1880
- * 获取当前播放时间里是否处于间奏区间
1881
- * 如果是则会返回单位为毫秒的始末时间
1882
- * 否则返回 undefined
1883
- *
1884
- * 这个只允许内部调用
1885
- * @returns [开始时间,结束时间,大概处于的歌词行ID,下一句是否为对唱歌词] 或 undefined 如果不处于间奏区间
1886
- */
1887
- getCurrentInterlude() {
1888
- var s, l, r;
1889
- if (this.bufferedLines.size > 0)
1890
- return;
1891
- const e = this.currentTime + 20, t = this.scrollToIndex;
1892
- if (t === 0) {
1893
- if ((s = this.processedLines[0]) != null && s.startTime && this.processedLines[0].startTime > e)
1894
- return [
1895
- e,
1896
- Math.max(e, this.processedLines[0].startTime - 250),
1897
- -2,
1898
- this.processedLines[0].isDuet
1899
- ];
1900
- } else if ((l = this.processedLines[t]) != null && l.endTime && ((r = this.processedLines[t + 1]) != null && r.startTime) && this.processedLines[t + 1].startTime > e && this.processedLines[t].endTime < e)
1901
- return [
1902
- Math.max(this.processedLines[t].endTime, e),
1903
- this.processedLines[t + 1].startTime,
1904
- t,
1905
- this.processedLines[t + 1].isDuet
1906
- ];
1907
- }
1908
- /**
1909
- * 重建样式
1910
- *
1911
- * 这个只允许内部调用
1912
- */
1913
- rebuildStyle() {
1914
- this._baseFontSize = parseFloat(getComputedStyle(this.element).fontSize);
1915
- let e = "";
1916
- e += "--amll-lyric-player-width:", e += this.innerSize[0] - this.padding * 2, e += "px;", e += "--amll-lyric-player-height:", e += this.innerSize[1] - this.padding * 2, e += "px;", this.element.setAttribute("style", e);
1917
- }
1918
- /**
1919
- * 设置是否隐藏已经播放过的歌词行,默认不隐藏
1920
- * @param hide 是否隐藏已经播放过的歌词行,默认不隐藏
1921
- */
1922
- setHidePassedLines(e) {
1923
- this.hidePassedLines = e, this.calcLayout();
1924
- }
1925
- /**
1926
- * 设置是否启用歌词行的模糊效果
1927
- * @param enable 是否启用
1928
- */
1929
- setEnableBlur(e) {
1930
- this.enableBlur !== e && (this.enableBlur = e, this.calcLayout());
1931
- }
1932
- /**
1933
- * 设置当前播放歌词,要注意传入后这个数组内的信息不得修改,否则会发生错误
1934
- * @param lines 歌词数组
1935
- */
1936
- setLyricLines(e) {
1937
- for (const s of e)
1938
- for (const l of s.words)
1939
- l.word = l.word.replace(/\s+/g, " ");
1940
- this.lyricLines = e;
1941
- const t = 750;
1942
- this.processedLines = e.filter(
1943
- (s) => s.words.reduce((l, r) => l + r.word.trim().length, 0) > 0
1944
- ).map((s, l, r) => {
1945
- if (s.isBG)
1946
- return {
1947
- ...s
1948
- };
1949
- if (l === 0)
1950
- return {
1951
- ...s,
1952
- startTime: Math.max(s.startTime - t, 0)
1953
- };
1954
- const n = r[l - 1], h = r[l - 2];
1955
- if (n != null && n.isBG && h) {
1956
- if (h.endTime < s.startTime)
1957
- return {
1958
- ...s,
1959
- startTime: Math.max(h.endTime, s.startTime - t) || s.startTime
1960
- };
1961
- } else if (n != null && n.endTime && n.endTime < s.startTime)
1962
- return {
1963
- ...s,
1964
- startTime: Math.max(n == null ? void 0 : n.endTime, s.startTime - t) || s.startTime
1965
- };
1966
- return {
1967
- ...s
1968
- };
1969
- }), this.isNonDynamic = !0;
1970
- for (const s of this.processedLines)
1971
- if (s.words.length > 1) {
1972
- this.isNonDynamic = !1;
1973
- break;
1974
- }
1975
- this.processedLines.forEach((s, l, r) => {
1976
- const n = r[l + 1], h = s.words[s.words.length - 1];
1977
- h && k(h) && (n ? n.startTime > s.endTime && (s.endTime = Math.min(s.endTime + 1500, n.startTime)) : s.endTime = s.endTime + 1500);
1978
- }), this.processedLines.forEach((s, l, r) => {
1979
- if (s.isBG)
1980
- return;
1981
- const n = r[l + 1];
1982
- n != null && n.isBG && (n.startTime = Math.min(n.startTime, s.startTime));
1983
- }), this.lyricLinesEl.forEach((s) => {
1984
- s.removeMouseEventListener("click", this.onLineClickedHandler), s.removeMouseEventListener("contextmenu", this.onLineClickedHandler), s.dispose();
1985
- }), this.lyricLinesEl = this.processedLines.map((s) => {
1986
- const l = new $e(this, s);
1987
- return l.addMouseEventListener("click", this.onLineClickedHandler), l.addMouseEventListener("contextmenu", this.onLineClickedHandler), l;
1988
- }), this.lyricLinesEl.forEach((s, l) => {
1989
- this.element.appendChild(s.getElement()), this.lyricLinesIndexes.set(s, l), s.updateMaskImage();
1990
- }), this.interludeDots.setInterlude(void 0), this.hotLines.clear(), this.bufferedLines.clear(), this.setLinePosXSpringParams({}), this.setLinePosYSpringParams({}), this.setLineScaleSpringParams({}), this.setCurrentTime(0, !0), this.calcLayout(!0, !0);
1991
- }
1992
- /**
1993
- * 重置用户滚动状态
1994
- *
1995
- * 请在用户完成滚动点击跳转歌词时调用本事件再调用 `calcLayout` 以正确滚动到目标位置
1996
- */
1997
- resetScroll() {
1998
- this.isScrolled = !1, this.scrollOffset = 0, this.invokedByScrollEvent = !1, clearTimeout(this.scrolledHandler), this.scrolledHandler = 0;
1999
- }
2000
- /**
2001
- * 重新布局定位歌词行的位置,调用完成后再逐帧调用 `update`
2002
- * 函数即可让歌词通过动画移动到目标位置。
2003
- *
2004
- * 函数有一个 `force` 参数,用于指定是否强制修改布局,也就是不经过动画直接调整元素位置和大小。
2005
- *
2006
- * 此函数还有一个 `reflow` 参数,用于指定是否需要重新计算布局
2007
- *
2008
- * 因为计算布局必定会导致浏览器重排布局,所以会大幅度影响流畅度和性能,故请只在以下情况下将其​设置为 true:
2009
- *
2010
- * 1. 歌词页面大小发生改变时(这个组件会自行处理)
2011
- * 2. 加载了新的歌词时(不论前后歌词是否完全一样)
2012
- * 3. 用户自行跳转了歌曲播放位置(不论距离远近)
2013
- *
2014
- * @param force 是否不经过动画直接修改布局定位
2015
- * @param reflow 是否进行重新布局(重新计算每行歌词大小)
2016
- */
2017
- calcLayout(e = !1, t = !1) {
2018
- var y;
2019
- t && (this.emUnit = parseFloat(getComputedStyle(this.element).fontSize), this.lyricLinesEl.forEach((f) => {
2020
- const g = f.measureSize();
2021
- this.lyricLinesSize.set(f, g), f.lineSize = g;
2022
- }), this.interludeDotsSize[0] = this.interludeDots.getElement().clientWidth, this.interludeDotsSize[1] = this.interludeDots.getElement().clientHeight, this.bottomLine.lineSize = this.bottomLine.measureSize());
2023
- const s = this.getCurrentInterlude();
2024
- let l = -this.scrollOffset, r = this.scrollToIndex, n = 0;
2025
- s ? (n = s[1] - s[0], n >= 5e3 && this.lyricLinesEl[s[2] + 1] && (r = s[2] + 1)) : this.interludeDots.setInterlude(void 0);
2026
- const h = this.enableScale ? 0.95 : 1, c = this.lyricLinesEl.slice(0, r).reduce(
2027
- (f, g) => {
2028
- var E;
2029
- return f + (g.getLine().isBG ? 0 : ((E = this.lyricLinesSize.get(g)) == null ? void 0 : E[1]) ?? 0);
2030
- },
2031
- 0
2032
- );
2033
- this.scrollBoundary[0] = -c, l -= c, l += this.size[1] * this.alignPosition;
2034
- const I = this.lyricLinesEl[r];
2035
- if (I) {
2036
- const f = ((y = this.lyricLinesSize.get(I)) == null ? void 0 : y[1]) ?? 0;
2037
- switch (this.alignAnchor) {
2038
- case "bottom":
2039
- l -= f;
2040
- break;
2041
- case "center":
2042
- l -= f / 2;
2043
- break;
2044
- }
2045
- }
2046
- const d = Math.max(...this.bufferedLines);
2047
- let m = 0, u = 0.05, p = !1;
2048
- this.lyricLinesEl.forEach((f, g) => {
2049
- var S, M, x;
2050
- const E = this.bufferedLines.has(g), L = E || g >= this.scrollToIndex && g < d, w = f.getLine();
2051
- w.isDuet && this.size[0] - (((S = this.lyricLinesSize.get(f)) == null ? void 0 : S[0]) ?? 0), !p && n >= 5e3 && (g === this.scrollToIndex && (s == null ? void 0 : s[2]) === -2 || g === this.scrollToIndex + 1) && (p = !0, this.interludeDots.setTransform(this.padding - 20, l + 10), s && this.interludeDots.setInterlude([s[0], s[1]]), l += this.interludeDotsSize[1] + 40);
2052
- let T = 1;
2053
- !L && g <= (s ? s[2] : this.scrollToIndex) ? this.hidePassedLines ? T = 0 : this.isNonDynamic ? T = 0.25 : T = 0.15 : E ? this.isNonDynamic ? T = 0.85 : T = 1 : this.isNonDynamic ? T = 0.25 : T = 0.5, this.invokedByScrollEvent && (this.isNonDynamic ? T = 0.85 : T = 1);
2054
- let b = 0;
2055
- this.enableBlur && (L ? b = 0 : (b = 1, g < this.scrollToIndex ? b += Math.abs(this.scrollToIndex - g) / 2 : b += Math.abs(
2056
- g - Math.max(this.scrollToIndex, d)
2057
- ))), this.invokedByScrollEvent && (b = 0), f.setTransform(
2058
- this.padding,
2059
- l,
2060
- L ? 1 : h,
2061
- T,
2062
- b * 1.5,
2063
- e,
2064
- m
2065
- ), w.isBG && L ? l += ((M = this.lyricLinesSize.get(f)) == null ? void 0 : M[1]) ?? 0 : w.isBG || (l += ((x = this.lyricLinesSize.get(f)) == null ? void 0 : x[1]) ?? 0), l >= 0 && (m += u, u /= 1.2);
2066
- }), this.scrollBoundary[1] = l + this.scrollOffset - this.size[1] / 2, this.bottomLine.setTransform(this.padding, l, e, m);
2067
- }
2068
- /**
2069
- * 获取当前歌词的播放位置
2070
- *
2071
- * 一般和最后调用 `setCurrentTime` 给予的参数一样
2072
- * @returns 当前播放位置
2073
- */
2074
- getCurrentTime() {
2075
- return this.currentTime;
2076
- }
2077
- /**
2078
- * 获取当前歌词数组
2079
- *
2080
- * 一般和最后调用 `setLyricLines` 给予的参数一样
2081
- * @returns 当前歌词数组
2082
- */
2083
- getLyricLines() {
2084
- return this.lyricLines;
2085
- }
2086
- getElement() {
2087
- return this.element;
2088
- }
2089
- /**
2090
- * 获取一个特殊的底栏元素,默认是空白的,可以往内部添加任意元素
2091
- *
2092
- * 这个元素始终在歌词的底部,可以用于显示歌曲创作者等信息
2093
- *
2094
- * 但是请勿删除该元素,只能在内部存放元素
2095
- *
2096
- * @returns 一个元素,可以往内部添加任意元素
2097
- */
2098
- getBottomLineElement() {
2099
- return this.bottomLine.getElement();
2100
- }
2101
- /**
2102
- * 设置目标歌词行的对齐方式,默认为 `center`
2103
- *
2104
- * - 设置成 `top` 的话将会向目标歌词行的顶部对齐
2105
- * - 设置成 `bottom` 的话将会向目标歌词行的底部对齐
2106
- * - 设置成 `center` 的话将会向目标歌词行的垂直中心对齐
2107
- * @param alignAnchor 歌词行对齐方式,详情见函数说明
2108
- */
2109
- setAlignAnchor(e) {
2110
- this.alignAnchor = e;
2111
- }
2112
- /**
2113
- * 设置默认的歌词行对齐位置,相对于整个歌词播放组件的大小位置,默认为 `0.5`
2114
- * @param alignPosition 一个 `[0.0-1.0]` 之间的任意数字,代表组件高度由上到下的比例位置
2115
- */
2116
- setAlignPosition(e) {
2117
- this.alignPosition = e;
2118
- }
2119
- /**
2120
- * 设置当前播放进度,单位为毫秒且**必须是整数**,此时将会更新内部的歌词进度信息
2121
- * 内部会根据调用间隔和播放进度自动决定如何滚动和显示歌词,所以这个的调用频率越快越准确越好
2122
- *
2123
- * 调用完成后,可以每帧调用 `update` 函数来执行歌词动画效果
2124
- * @param time 当前播放进度,单位为毫秒
2125
- */
2126
- setCurrentTime(e, t = !1) {
2127
- if (this.currentTime = e, !this.isPageVisible || (!this._getIsNonDynamic() && !this.supportMaskImage && this.element.style.setProperty("--amll-player-time", `${e}`), this.isScrolled))
2128
- return;
2129
- const s = /* @__PURE__ */ new Set(), l = /* @__PURE__ */ new Set(), r = /* @__PURE__ */ new Set();
2130
- if (t)
2131
- for (const n of this.lyricLinesEl)
2132
- n.setMaskAnimationState(e);
2133
- this.hotLines.forEach((n) => {
2134
- const h = this.processedLines[n];
2135
- if (h) {
2136
- if (h.isBG)
2137
- return;
2138
- const c = this.processedLines[n + 1];
2139
- if (c != null && c.isBG) {
2140
- const I = this.processedLines[n + 2], d = Math.min(h.startTime, c == null ? void 0 : c.startTime), m = Math.min(
2141
- Math.max(h.endTime, (I == null ? void 0 : I.startTime) ?? Number.MAX_VALUE),
2142
- Math.max(h.endTime, c == null ? void 0 : c.endTime)
2143
- );
2144
- (d > e || m <= e) && (this.hotLines.delete(n), s.add(n), this.hotLines.delete(n + 1), s.add(n + 1), t && (this.lyricLinesEl[n].disable(e), this.lyricLinesEl[n + 1].disable(e)));
2145
- } else
2146
- (h.startTime > e || h.endTime <= e) && (this.hotLines.delete(n), s.add(n), t && this.lyricLinesEl[n].disable(e));
2147
- } else
2148
- this.hotLines.delete(n), s.add(n), t && this.lyricLinesEl[n].disable(e);
2149
- }), this.processedLines.forEach((n, h, c) => {
2150
- var I;
2151
- !n.isBG && n.startTime <= e && n.endTime > e && (this.hotLines.has(h) || (this.hotLines.add(h), r.add(h), t && this.lyricLinesEl[h].enable(e), (I = c[h + 1]) != null && I.isBG && (this.hotLines.add(h + 1), r.add(h + 1), t && this.lyricLinesEl[h + 1].enable(e))));
2152
- }), this.bufferedLines.forEach((n) => {
2153
- this.hotLines.has(n) || (l.add(n), t && this.lyricLinesEl[n].disable(e));
2154
- }), t ? (this.bufferedLines.size > 0 ? this.scrollToIndex = Math.min(...this.bufferedLines) : this.scrollToIndex = this.processedLines.findIndex(
2155
- (n) => n.startTime >= e
2156
- ), this.bufferedLines.clear(), this.hotLines.forEach((n) => this.bufferedLines.add(n)), this.calcLayout(!0)) : (l.size > 0 || r.size > 0) && (l.size === 0 && r.size > 0 ? (r.forEach((n) => {
2157
- this.bufferedLines.add(n), this.lyricLinesEl[n].enable(e);
2158
- }), this.scrollToIndex = Math.min(...this.bufferedLines), this.calcLayout()) : r.size === 0 && l.size > 0 ? ve(l, this.bufferedLines) && (this.bufferedLines.forEach((n) => {
2159
- this.hotLines.has(n) || (this.bufferedLines.delete(n), this.lyricLinesEl[n].disable(e));
2160
- }), this.calcLayout()) : (r.forEach((n) => {
2161
- this.bufferedLines.add(n), this.lyricLinesEl[n].enable(e);
2162
- }), l.forEach((n) => {
2163
- this.bufferedLines.delete(n), this.lyricLinesEl[n].disable(e);
2164
- }), this.bufferedLines.size > 0 && (this.scrollToIndex = Math.min(...this.bufferedLines)), this.calcLayout()));
2165
- }
2166
- /**
2167
- * 暂停部分效果演出,目前会暂停播放间奏点的动画
2168
- */
2169
- pause() {
2170
- this.interludeDots.pause();
2171
- for (const e of this.lyricLinesEl)
2172
- e.pause();
2173
- }
2174
- /**
2175
- * 恢复部分效果演出,目前会恢复播放间奏点的动画
2176
- */
2177
- resume() {
2178
- this.interludeDots.resume();
2179
- for (const e of this.lyricLinesEl)
2180
- e.resume();
2181
- }
2182
- /**
2183
- * 更新动画,这个函数应该被逐帧调用或者在以下情况下调用一次:
2184
- *
2185
- * 1. 刚刚调用完设置歌词函数的时候
2186
- * @param delta 距离上一次被调用到现在的时长,单位为毫秒(可为浮点数)
2187
- */
2188
- update(e = 0) {
2189
- if (!this.isPageVisible)
2190
- return;
2191
- const t = e / 1e3;
2192
- this.interludeDots.update(e), this.bottomLine.update(t), this.lyricLinesEl.forEach((s) => s.update(t));
2193
- }
2194
- /**
2195
- * 设置所有歌词行在横坐标上的弹簧属性,包括重量、弹力和阻力。
2196
- *
2197
- * @param params 需要设置的弹簧属性,提供的属性将会覆盖原来的属性,未提供的属性将会保持原样
2198
- */
2199
- setLinePosXSpringParams(e) {
2200
- this.posXSpringParams = {
2201
- ...this.posXSpringParams,
2202
- ...e
2203
- }, this.bottomLine.lineTransforms.posX.updateParams(this.posXSpringParams), this.lyricLinesEl.forEach(
2204
- (t) => t.lineTransforms.posX.updateParams(this.posXSpringParams)
2205
- );
2206
- }
2207
- /**
2208
- * 设置所有歌词行在​纵坐标上的弹簧属性,包括重量、弹力和阻力。
2209
- *
2210
- * @param params 需要设置的弹簧属性,提供的属性将会覆盖原来的属性,未提供的属性将会保持原样
2211
- */
2212
- setLinePosYSpringParams(e) {
2213
- this.posYSpringParams = {
2214
- ...this.posYSpringParams,
2215
- ...e
2216
- }, this.bottomLine.lineTransforms.posY.updateParams(this.posYSpringParams), this.lyricLinesEl.forEach(
2217
- (t) => t.lineTransforms.posY.updateParams(this.posYSpringParams)
2218
- );
2219
- }
2220
- /**
2221
- * 设置所有歌词行在​缩放大小上的弹簧属性,包括重量、弹力和阻力。
2222
- *
2223
- * @param params 需要设置的弹簧属性,提供的属性将会覆盖原来的属性,未提供的属性将会保持原样
2224
- */
2225
- setLineScaleSpringParams(e) {
2226
- this.scaleSpringParams = {
2227
- ...this.scaleSpringParams,
2228
- ...e
2229
- }, this.lyricLinesEl.forEach(
2230
- (t) => t.lineTransforms.scale.updateParams(this.scaleSpringParams)
2231
- );
2232
- }
2233
- dispose() {
2234
- this.element.remove(), this.resizeObserver.disconnect(), this.style.detach(), this.lyricLinesEl.forEach((e) => e.dispose()), window.removeEventListener("pageshow", this.onPageShow), this.bottomLine.dispose(), this.interludeDots.dispose();
2235
- }
2236
- }
2237
- export {
2238
- pe as AbstractBaseRenderer,
2239
- ie as BackgroundRender,
2240
- te as BaseRenderer,
2241
- J as EplorRenderer,
2242
- mt as LyricPlayer,
2243
- dt as PixiRenderer
2244
- };
2245
- //# sourceMappingURL=amll-core.js.map