@lazycatcloud/vue-media-preview 0.1.3 → 0.1.4
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/README.md +1 -0
- package/dist/components/MediaPreview.vue.d.ts +1 -1
- package/dist/core/resources/image/gif.d.ts +4 -0
- package/dist/core/resources/image/types.d.ts +16 -0
- package/dist/core/resources/imageResource.d.ts +3 -9
- package/dist/renderers/ImageCanvasRenderer.vue.d.ts +4 -0
- package/dist/renderers/image/AnimatedImageLayer.vue.d.ts +17 -0
- package/dist/vue-media-preview.cjs +2 -2
- package/dist/vue-media-preview.js +1400 -1336
- package/docs/testing.md +4 -0
- package/docs/vue-media-preview.md +9 -1
- package/package.json +1 -1
|
@@ -1,81 +1,81 @@
|
|
|
1
1
|
var Zt = Object.defineProperty;
|
|
2
|
-
var jt = (t, n,
|
|
3
|
-
var
|
|
4
|
-
import { ref as
|
|
2
|
+
var jt = (t, n, r) => n in t ? Zt(t, n, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[n] = r;
|
|
3
|
+
var tt = (t, n, r) => jt(t, typeof n != "symbol" ? n + "" : n, r);
|
|
4
|
+
import { ref as $, onMounted as qe, watch as te, onBeforeUnmount as Te, shallowRef as ft, reactive as mt, computed as V, defineComponent as $e, openBlock as q, createElementBlock as _, createElementVNode as T, normalizeStyle as we, nextTick as Se, Fragment as Fe, createBlock as We, createCommentVNode as le, withModifiers as re, unref as f, normalizeClass as De, mergeProps as Ne, toHandlers as gt, createVNode as Ie, renderList as Ze, createTextVNode as Gt, toDisplayString as ce, withKeys as nt, Teleport as Ct, resolveDynamicComponent as Kt, useAttrs as Qt, getCurrentInstance as Jt, withDirectives as en, vShow as tn, renderSlot as ut } from "vue";
|
|
5
5
|
function He(t, n) {
|
|
6
6
|
return Math.hypot(t.x - n.x, t.y - n.y);
|
|
7
7
|
}
|
|
8
8
|
function yt(t, n) {
|
|
9
9
|
return { x: (t.x + n.x) / 2, y: (t.y + n.y) / 2 };
|
|
10
10
|
}
|
|
11
|
-
function Lt(t, n,
|
|
12
|
-
return Math.hypot(t, n) < 9 ? "pending" :
|
|
11
|
+
function Lt(t, n, r) {
|
|
12
|
+
return Math.hypot(t, n) < 9 ? "pending" : r > 1.01 ? "pan" : Math.abs(t) > Math.abs(n) * 1.1 ? "page" : n > 0 && Math.abs(n) > Math.abs(t) * 1.1 ? "dismiss" : "pending";
|
|
13
13
|
}
|
|
14
|
-
function
|
|
15
|
-
return t > Math.min(
|
|
14
|
+
function $t(t, n, r) {
|
|
15
|
+
return t > Math.min(r.width, r.height) * 0.14 || t > 16 && n > 0.35;
|
|
16
16
|
}
|
|
17
|
-
function
|
|
17
|
+
function Ft() {
|
|
18
18
|
let t = { x: 0, y: 0, time: 0 }, n = { x: 0, y: 0 };
|
|
19
19
|
return {
|
|
20
|
-
reset(
|
|
21
|
-
t = { ...
|
|
20
|
+
reset(r, e) {
|
|
21
|
+
t = { ...r, time: e }, n = { x: 0, y: 0 };
|
|
22
22
|
},
|
|
23
|
-
move(
|
|
23
|
+
move(r, e) {
|
|
24
24
|
const i = Math.max(8, e - t.time);
|
|
25
|
-
n = { x: (
|
|
25
|
+
n = { x: (r.x - t.x) / i, y: (r.y - t.y) / i }, t = { ...r, time: e };
|
|
26
26
|
},
|
|
27
|
-
read(
|
|
28
|
-
return
|
|
27
|
+
read(r) {
|
|
28
|
+
return r - t.time < 100 ? n : { x: 0, y: 0 };
|
|
29
29
|
}
|
|
30
30
|
};
|
|
31
31
|
}
|
|
32
32
|
function nn() {
|
|
33
33
|
const t = /* @__PURE__ */ new Map();
|
|
34
34
|
let n = !1;
|
|
35
|
-
function
|
|
35
|
+
function r() {
|
|
36
36
|
t.clear(), n = !1;
|
|
37
37
|
}
|
|
38
38
|
function e() {
|
|
39
39
|
const a = !n && t.size === 1 ? { kind: "pointer", ...t.values().next().value } : { kind: "empty" };
|
|
40
|
-
return
|
|
40
|
+
return r(), a;
|
|
41
41
|
}
|
|
42
42
|
function i(a) {
|
|
43
43
|
if (!t.has(a.pointerId)) return;
|
|
44
|
-
const
|
|
45
|
-
|
|
44
|
+
const o = t.get(a.pointerId);
|
|
45
|
+
o.latest = a, o.velocity.move({ x: a.clientX, y: a.clientY }, a.timeStamp);
|
|
46
46
|
}
|
|
47
47
|
return {
|
|
48
|
-
clear:
|
|
48
|
+
clear: r,
|
|
49
49
|
take: e,
|
|
50
50
|
move: i,
|
|
51
51
|
start(a) {
|
|
52
52
|
if (a.pointerType === "mouse" && a.button !== 0) return;
|
|
53
|
-
const
|
|
54
|
-
if (
|
|
55
|
-
const
|
|
56
|
-
|
|
53
|
+
const o = a.target;
|
|
54
|
+
if (o.closest("button, input, a, select")) return;
|
|
55
|
+
const l = Ft();
|
|
56
|
+
l.reset({ x: a.clientX, y: a.clientY }, a.timeStamp), t.set(a.pointerId, { down: a, latest: a, target: o, velocity: l }), n || (n = t.size > 1);
|
|
57
57
|
},
|
|
58
|
-
finish(a,
|
|
58
|
+
finish(a, o) {
|
|
59
59
|
if (!t.has(a.pointerId)) return !1;
|
|
60
60
|
if (n)
|
|
61
|
-
return t.delete(a.pointerId), t.size === 0 &&
|
|
62
|
-
const
|
|
63
|
-
if (
|
|
64
|
-
const u = a.clientX -
|
|
65
|
-
return Lt(u, p, 1) === "dismiss" &&
|
|
61
|
+
return t.delete(a.pointerId), t.size === 0 && r(), !1;
|
|
62
|
+
const l = e();
|
|
63
|
+
if (l.kind === "empty") return !1;
|
|
64
|
+
const u = a.clientX - l.down.clientX, p = a.clientY - l.down.clientY, c = l.velocity.read(a.timeStamp).y;
|
|
65
|
+
return Lt(u, p, 1) === "dismiss" && $t(p, c, o);
|
|
66
66
|
}
|
|
67
67
|
};
|
|
68
68
|
}
|
|
69
|
-
function
|
|
69
|
+
function Ve(t) {
|
|
70
70
|
return t instanceof Error ? t : new Error(String(t));
|
|
71
71
|
}
|
|
72
72
|
function an(t) {
|
|
73
|
-
let n = 0,
|
|
73
|
+
let n = 0, r = () => {
|
|
74
74
|
};
|
|
75
75
|
function e() {
|
|
76
76
|
n += 1;
|
|
77
|
-
const a =
|
|
78
|
-
|
|
77
|
+
const a = r;
|
|
78
|
+
r = () => {
|
|
79
79
|
}, a();
|
|
80
80
|
}
|
|
81
81
|
function i() {
|
|
@@ -84,12 +84,12 @@ function an(t) {
|
|
|
84
84
|
return {
|
|
85
85
|
clear: i,
|
|
86
86
|
dispose: e,
|
|
87
|
-
start(a,
|
|
87
|
+
start(a, o, l) {
|
|
88
88
|
i();
|
|
89
89
|
const u = n;
|
|
90
|
-
|
|
90
|
+
r = l(
|
|
91
91
|
a,
|
|
92
|
-
|
|
92
|
+
o,
|
|
93
93
|
(p) => {
|
|
94
94
|
u === n && t.error(p);
|
|
95
95
|
},
|
|
@@ -103,79 +103,79 @@ function an(t) {
|
|
|
103
103
|
const it = (t, n) => (t.src = n.videoSrc || n.src, () => {
|
|
104
104
|
t.removeAttribute("src"), t.load();
|
|
105
105
|
});
|
|
106
|
-
function Tt(t, n,
|
|
107
|
-
const a =
|
|
108
|
-
let
|
|
106
|
+
function Tt(t, n, r, e, i) {
|
|
107
|
+
const a = $(0), o = an(i);
|
|
108
|
+
let l = () => {
|
|
109
109
|
};
|
|
110
110
|
return qe(() => {
|
|
111
|
-
|
|
112
|
-
() => [n().id, n().src, n().videoSrc,
|
|
111
|
+
l = te(
|
|
112
|
+
() => [n().id, n().src, n().videoSrc, r(), e(), a.value],
|
|
113
113
|
() => {
|
|
114
|
-
|
|
114
|
+
r() ? o.start(t(), n(), e()) : o.clear();
|
|
115
115
|
},
|
|
116
116
|
{ immediate: !0, flush: "post" }
|
|
117
117
|
);
|
|
118
|
-
}),
|
|
119
|
-
|
|
118
|
+
}), Te(() => {
|
|
119
|
+
l(), o.dispose();
|
|
120
120
|
}), () => a.value++;
|
|
121
121
|
}
|
|
122
|
-
function
|
|
123
|
-
return Math.min(Math.max(t, n),
|
|
122
|
+
function J(t, n, r) {
|
|
123
|
+
return Math.min(Math.max(t, n), r);
|
|
124
124
|
}
|
|
125
125
|
function wt(t, n = 2) {
|
|
126
126
|
return Number(t.toFixed(n));
|
|
127
127
|
}
|
|
128
|
-
function
|
|
128
|
+
function rn(t, n) {
|
|
129
129
|
return t.width <= 0 || t.height <= 0 || n.width <= 0 || n.height <= 0 ? 1 : Math.min(n.width / t.width, n.height / t.height);
|
|
130
130
|
}
|
|
131
131
|
function bt(t) {
|
|
132
132
|
const n = (t % 360 + 360) % 360;
|
|
133
133
|
return n === 90 || n === 180 || n === 270 ? n : 0;
|
|
134
134
|
}
|
|
135
|
-
function
|
|
135
|
+
function on(t, n) {
|
|
136
136
|
return n === 90 || n === 270 ? { width: t.height, height: t.width } : t;
|
|
137
137
|
}
|
|
138
|
-
function ln(t, n,
|
|
139
|
-
return `translate3d(${wt(t)}px, ${wt(n)}px, 0) scale3d(${
|
|
138
|
+
function ln(t, n, r) {
|
|
139
|
+
return `translate3d(${wt(t)}px, ${wt(n)}px, 0) scale3d(${r}, ${r}, 1)`;
|
|
140
140
|
}
|
|
141
141
|
function sn(t) {
|
|
142
142
|
return 1 - (1 - t) ** 3;
|
|
143
143
|
}
|
|
144
144
|
const un = 16;
|
|
145
145
|
function cn(t, n) {
|
|
146
|
-
const
|
|
146
|
+
const r = t < 1 ? 1 : n;
|
|
147
147
|
if (t >= 1 && t <= n) return t;
|
|
148
|
-
const e = Math.abs(t -
|
|
149
|
-
return
|
|
148
|
+
const e = Math.abs(t - r), i = r * 0.25;
|
|
149
|
+
return r + Math.sign(t - r) * (i * e) / (i + e);
|
|
150
150
|
}
|
|
151
151
|
function dn(t, n) {
|
|
152
|
-
const
|
|
152
|
+
const r = t < 1 ? 1 : n;
|
|
153
153
|
if (t >= 1 && t <= n) return t;
|
|
154
|
-
const e = Math.abs(t -
|
|
155
|
-
return
|
|
154
|
+
const e = Math.abs(t - r), i = r * 0.25;
|
|
155
|
+
return r + Math.sign(t - r) * (i * e) / Math.max(Number.EPSILON, i - e);
|
|
156
156
|
}
|
|
157
157
|
function fn(t, n) {
|
|
158
158
|
return t.deltaMode === 1 ? 2 ** (-t.deltaY * 0.05) : t.deltaMode === 2 ? 2 ** -t.deltaY : n || Math.abs(t.deltaY) >= 40 ? 2 ** (-t.deltaY * 2e-3) : Math.exp(-t.deltaY * 8e-3);
|
|
159
159
|
}
|
|
160
|
-
function
|
|
160
|
+
function mn(t, n, r = 650) {
|
|
161
161
|
let e = { kind: "idle" };
|
|
162
162
|
function i() {
|
|
163
|
-
const
|
|
164
|
-
e = { kind: "idle" },
|
|
163
|
+
const o = e;
|
|
164
|
+
e = { kind: "idle" }, o.kind === "pending" && clearTimeout(o.timer), o.kind === "active" && n();
|
|
165
165
|
}
|
|
166
166
|
function a() {
|
|
167
167
|
i(), e = {
|
|
168
168
|
kind: "pending",
|
|
169
169
|
timer: setTimeout(() => {
|
|
170
170
|
e = { kind: "active" }, t();
|
|
171
|
-
},
|
|
171
|
+
}, r)
|
|
172
172
|
};
|
|
173
173
|
}
|
|
174
174
|
return { arm: a, cancel: i };
|
|
175
175
|
}
|
|
176
|
-
function
|
|
177
|
-
const e =
|
|
178
|
-
return { offsetX: e, pageOffset:
|
|
176
|
+
function gn(t, n, r) {
|
|
177
|
+
const e = J(t, -n, n);
|
|
178
|
+
return { offsetX: e, pageOffset: r ? t - e : 0 };
|
|
179
179
|
}
|
|
180
180
|
function pn(t = {}) {
|
|
181
181
|
const n = {
|
|
@@ -184,9 +184,9 @@ function pn(t = {}) {
|
|
|
184
184
|
},
|
|
185
185
|
onDoubleTap: () => {
|
|
186
186
|
},
|
|
187
|
-
onScale: (
|
|
187
|
+
onScale: (d) => {
|
|
188
188
|
},
|
|
189
|
-
onSwipeDownProgress: (
|
|
189
|
+
onSwipeDownProgress: (d) => {
|
|
190
190
|
},
|
|
191
191
|
onSwipeDownClose: () => {
|
|
192
192
|
},
|
|
@@ -194,10 +194,10 @@ function pn(t = {}) {
|
|
|
194
194
|
},
|
|
195
195
|
onSwipeRight: () => {
|
|
196
196
|
},
|
|
197
|
-
onPageDrag: (
|
|
197
|
+
onPageDrag: (d) => {
|
|
198
198
|
},
|
|
199
|
-
onPageRelease: (
|
|
200
|
-
Math.abs(
|
|
199
|
+
onPageRelease: (d, z) => {
|
|
200
|
+
Math.abs(d) < 60 || (d < 0 ? n.onSwipeLeft() : n.onSwipeRight());
|
|
201
201
|
},
|
|
202
202
|
interactive: () => !0,
|
|
203
203
|
zoomable: () => !0,
|
|
@@ -209,7 +209,7 @@ function pn(t = {}) {
|
|
|
209
209
|
onHoldEnd: () => {
|
|
210
210
|
},
|
|
211
211
|
...t
|
|
212
|
-
},
|
|
212
|
+
}, r = $(), e = $(), i = ft(), a = $({ width: 1, height: 1 }), o = $({ width: 1, height: 1 }), l = mt({
|
|
213
213
|
level: 1,
|
|
214
214
|
offsetX: 0,
|
|
215
215
|
offsetY: 0,
|
|
@@ -219,271 +219,303 @@ function pn(t = {}) {
|
|
|
219
219
|
downOffsetX: 0,
|
|
220
220
|
downOffsetY: 0,
|
|
221
221
|
downScale: 1
|
|
222
|
-
}), u =
|
|
223
|
-
width: u.value.width *
|
|
224
|
-
height: u.value.height *
|
|
225
|
-
})),
|
|
226
|
-
transform: ln(
|
|
227
|
-
})),
|
|
228
|
-
() =>
|
|
222
|
+
}), u = V(() => on(o.value, l.rotation)), p = V(() => rn(u.value, a.value)), c = V(() => p.value * l.level), x = V(() => ({
|
|
223
|
+
width: u.value.width * c.value,
|
|
224
|
+
height: u.value.height * c.value
|
|
225
|
+
})), L = V(() => ({
|
|
226
|
+
transform: ln(l.downOffsetX, l.downOffsetY, l.downScale)
|
|
227
|
+
})), S = /* @__PURE__ */ new Set(), E = $(!1), w = $(!1), g = $(!1), B = V(
|
|
228
|
+
() => E.value || w.value || g.value || n.motionActive()
|
|
229
229
|
);
|
|
230
|
-
let
|
|
231
|
-
}, 0),
|
|
232
|
-
const
|
|
230
|
+
let O, h = 0, k = 0, m = setTimeout(() => {
|
|
231
|
+
}, 0), y = -1e3, P = { x: 0, y: 0 }, v = !1, R = "idle", F = !0, C = !1, D = 0;
|
|
232
|
+
const A = /* @__PURE__ */ new Map();
|
|
233
233
|
let Z = { x: 0, y: 0 };
|
|
234
|
-
const
|
|
235
|
-
let
|
|
236
|
-
const
|
|
234
|
+
const K = Ft();
|
|
235
|
+
let be = 0, ne = { left: 0, top: 0 }, me = 1, oe = 1, Pe = { x: 0, y: 0 }, ee = pe();
|
|
236
|
+
const I = mn(
|
|
237
237
|
() => {
|
|
238
|
-
|
|
238
|
+
R = "hold", clearTimeout(m), y = -1e3, n.onHoldStart();
|
|
239
239
|
},
|
|
240
240
|
() => n.onHoldEnd()
|
|
241
|
-
),
|
|
242
|
-
for (const
|
|
243
|
-
}),
|
|
244
|
-
(
|
|
245
|
-
},
|
|
246
|
-
|
|
247
|
-
},
|
|
248
|
-
document.hidden &&
|
|
241
|
+
), U = new ResizeObserver((d) => {
|
|
242
|
+
for (const z of d) de(z.contentRect);
|
|
243
|
+
}), Y = /* @__PURE__ */ new Set(), Oe = (d) => {
|
|
244
|
+
(d.key === "Control" || d.key === "Meta") && Y.add(d.key);
|
|
245
|
+
}, Qe = (d) => Y.delete(d.key), ae = () => {
|
|
246
|
+
I.cancel(), Y.clear();
|
|
247
|
+
}, ge = () => {
|
|
248
|
+
document.hidden && I.cancel();
|
|
249
249
|
};
|
|
250
250
|
qe(() => {
|
|
251
|
-
|
|
252
|
-
}),
|
|
253
|
-
|
|
251
|
+
U.observe(r.value), de(r.value.getBoundingClientRect()), window.addEventListener("keydown", Oe), window.addEventListener("keyup", Qe), window.addEventListener("blur", ae), document.addEventListener("visibilitychange", ge);
|
|
252
|
+
}), Te(() => {
|
|
253
|
+
v = !0, I.cancel(), window.removeEventListener("keydown", Oe), window.removeEventListener("keyup", Qe), window.removeEventListener("blur", ae), document.removeEventListener("visibilitychange", ge), U.disconnect(), cancelAnimationFrame(h), cancelAnimationFrame(k), clearTimeout(m), clearTimeout(O);
|
|
254
254
|
});
|
|
255
|
-
function
|
|
256
|
-
a.value = { width:
|
|
255
|
+
function de(d) {
|
|
256
|
+
a.value = { width: d.width, height: d.height }, Object.assign(l, G(l.offsetX, l.offsetY, l.level)), ke();
|
|
257
257
|
}
|
|
258
|
-
function
|
|
259
|
-
|
|
260
|
-
|
|
258
|
+
function ke() {
|
|
259
|
+
v || h || (h = requestAnimationFrame(() => {
|
|
260
|
+
h = 0, S.forEach((d) => d());
|
|
261
261
|
}));
|
|
262
262
|
}
|
|
263
|
-
function
|
|
264
|
-
return { level:
|
|
263
|
+
function pe() {
|
|
264
|
+
return { level: l.level, offsetX: l.offsetX, offsetY: l.offsetY };
|
|
265
265
|
}
|
|
266
|
-
function
|
|
266
|
+
function G(d, z, X) {
|
|
267
267
|
const j = Math.max(
|
|
268
268
|
0,
|
|
269
|
-
(u.value.width * p.value *
|
|
269
|
+
(u.value.width * p.value * X - a.value.width) / 2
|
|
270
270
|
), N = Math.max(
|
|
271
271
|
0,
|
|
272
|
-
(u.value.height * p.value *
|
|
272
|
+
(u.value.height * p.value * X - a.value.height) / 2
|
|
273
273
|
);
|
|
274
|
-
return { offsetX:
|
|
275
|
-
}
|
|
276
|
-
function
|
|
277
|
-
Object.assign(
|
|
278
|
-
}
|
|
279
|
-
function
|
|
280
|
-
cancelAnimationFrame(k),
|
|
281
|
-
const
|
|
282
|
-
const
|
|
283
|
-
|
|
284
|
-
level:
|
|
285
|
-
offsetX:
|
|
286
|
-
offsetY:
|
|
287
|
-
}),
|
|
274
|
+
return { offsetX: J(d, -j, j), offsetY: J(z, -N, N) };
|
|
275
|
+
}
|
|
276
|
+
function xe(d) {
|
|
277
|
+
Object.assign(l, d), n.onScale(l.level), ke();
|
|
278
|
+
}
|
|
279
|
+
function se(d, z = 250) {
|
|
280
|
+
cancelAnimationFrame(k), E.value = !0;
|
|
281
|
+
const X = pe(), j = performance.now(), N = matchMedia("(prefers-reduced-motion: reduce)").matches ? 0 : z, Q = (ye) => {
|
|
282
|
+
const Me = N === 0 ? 1 : J((ye - j) / N, 0, 1), Le = sn(Me);
|
|
283
|
+
xe({
|
|
284
|
+
level: X.level + (d.level - X.level) * Le,
|
|
285
|
+
offsetX: X.offsetX + (d.offsetX - X.offsetX) * Le,
|
|
286
|
+
offsetY: X.offsetY + (d.offsetY - X.offsetY) * Le
|
|
287
|
+
}), Me < 1 ? k = requestAnimationFrame(Q) : E.value = !1;
|
|
288
288
|
};
|
|
289
|
-
k = requestAnimationFrame(
|
|
289
|
+
k = requestAnimationFrame(Q);
|
|
290
290
|
}
|
|
291
|
-
function
|
|
291
|
+
function fe() {
|
|
292
292
|
return { x: a.value.width / 2, y: a.value.height / 2 };
|
|
293
293
|
}
|
|
294
|
-
function
|
|
294
|
+
function he(d, z = fe(), X = !1) {
|
|
295
295
|
if (!n.zoomable()) return;
|
|
296
|
-
cancelAnimationFrame(k),
|
|
297
|
-
const j =
|
|
298
|
-
|
|
299
|
-
|
|
296
|
+
cancelAnimationFrame(k), E.value = !1;
|
|
297
|
+
const j = J(d, 1, n.zoomLimit()), N = j / l.level, Q = fe(), ye = G(
|
|
298
|
+
z.x - Q.x - (z.x - Q.x - l.offsetX) * N,
|
|
299
|
+
z.y - Q.y - (z.y - Q.y - l.offsetY) * N,
|
|
300
300
|
j
|
|
301
|
-
),
|
|
302
|
-
|
|
301
|
+
), Me = { level: j, ...ye };
|
|
302
|
+
X ? se(Me) : xe(Me);
|
|
303
303
|
}
|
|
304
|
-
function
|
|
305
|
-
|
|
304
|
+
function Re() {
|
|
305
|
+
l.draggingDown = !1, l.downOffsetX = 0, l.downOffsetY = 0, l.downScale = 1, n.onSwipeDownProgress(0);
|
|
306
306
|
}
|
|
307
|
-
function
|
|
308
|
-
|
|
307
|
+
function ve(d = !1) {
|
|
308
|
+
d && (cancelAnimationFrame(k), E.value = !1), I.cancel(), A.clear(), w.value = !1, g.value = !1, clearTimeout(O), R = "idle", D = 0, l.zooming = !1, d || (Re(), n.onPageDrag(0)), clearTimeout(m), y = -1e3;
|
|
309
309
|
}
|
|
310
|
-
function Be(
|
|
311
|
-
cancelAnimationFrame(k),
|
|
312
|
-
const
|
|
313
|
-
|
|
310
|
+
function Be(d = 0) {
|
|
311
|
+
cancelAnimationFrame(k), E.value = !1, ve();
|
|
312
|
+
const z = { level: 1, offsetX: 0, offsetY: 0 };
|
|
313
|
+
d > 0 && (l.level !== 1 || l.offsetX !== 0 || l.offsetY !== 0) ? se(z, d) : xe(z);
|
|
314
314
|
}
|
|
315
|
-
function
|
|
316
|
-
return { x:
|
|
315
|
+
function Ee(d, z = ne) {
|
|
316
|
+
return { x: d.clientX - z.left, y: d.clientY - z.top };
|
|
317
317
|
}
|
|
318
318
|
function ze() {
|
|
319
|
-
|
|
320
|
-
const [
|
|
321
|
-
|
|
319
|
+
I.cancel(), F = !1, C = !1, D = 0;
|
|
320
|
+
const [d, z] = [...A.values()];
|
|
321
|
+
me = dn(l.level, n.zoomLimit()), oe = Math.max(1, He(d, z)), Pe = yt(d, z), ee = pe(), R = "pinch", l.zooming = !0, Re(), n.onPageDrag(0), clearTimeout(m), y = -1e3;
|
|
322
322
|
}
|
|
323
|
-
function Ae(
|
|
324
|
-
if (!n.interactive() ||
|
|
323
|
+
function Ae(d, z = r.value.getBoundingClientRect(), X = d.target) {
|
|
324
|
+
if (!n.interactive() || d.pointerType === "mouse" && d.button !== 0 || X.closest("button, input, a, select") || X instanceof HTMLVideoElement && X.controls && d.clientY > X.getBoundingClientRect().bottom - 48)
|
|
325
325
|
return !1;
|
|
326
|
-
if (cancelAnimationFrame(k),
|
|
326
|
+
if (cancelAnimationFrame(k), E.value = !1, w.value = !0, A.size === 0 && (ne = z), A.set(d.pointerId, Ee(d)), r.value.setPointerCapture(d.pointerId), A.size >= 2)
|
|
327
327
|
return ze(), !0;
|
|
328
|
-
Z =
|
|
329
|
-
const j =
|
|
330
|
-
return n.holdable() && Math.abs(Z.x -
|
|
331
|
-
}
|
|
332
|
-
function
|
|
333
|
-
if (!
|
|
334
|
-
const
|
|
335
|
-
if (
|
|
328
|
+
Z = Ee(d), be = performance.now(), K.reset(Z, d.timeStamp), ee = pe(), R = "pending", F = !0, C = !1, D = 0;
|
|
329
|
+
const j = x.value.width / 2, N = x.value.height / 2, Q = fe();
|
|
330
|
+
return n.holdable() && Math.abs(Z.x - Q.x - l.offsetX) <= j && Math.abs(Z.y - Q.y - l.offsetY) <= N && (clearTimeout(m), I.arm()), !0;
|
|
331
|
+
}
|
|
332
|
+
function rt(d) {
|
|
333
|
+
if (!A.has(d.pointerId)) return;
|
|
334
|
+
const z = Ee(d);
|
|
335
|
+
if (A.set(d.pointerId, z), R === "pinch" && A.size >= 2) {
|
|
336
336
|
if (!n.zoomable()) return;
|
|
337
|
-
const [N,
|
|
338
|
-
|
|
339
|
-
const
|
|
340
|
-
|
|
341
|
-
level:
|
|
342
|
-
...
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
337
|
+
const [N, Q] = [...A.values()], ye = fe(), Me = yt(N, Q);
|
|
338
|
+
me *= Math.max(1, He(N, Q)) / oe;
|
|
339
|
+
const Le = cn(me, n.zoomLimit()), Je = Le / ee.level;
|
|
340
|
+
xe({
|
|
341
|
+
level: Le,
|
|
342
|
+
...G(
|
|
343
|
+
Me.x - ye.x - (Pe.x - ye.x - ee.offsetX) * Je,
|
|
344
|
+
Me.y - ye.y - (Pe.y - ye.y - ee.offsetY) * Je,
|
|
345
|
+
Le
|
|
346
346
|
)
|
|
347
|
-
}),
|
|
347
|
+
}), ee = pe(), oe = Math.max(1, He(N, Q)), Pe = Me, d.preventDefault();
|
|
348
348
|
return;
|
|
349
349
|
}
|
|
350
|
-
if (
|
|
351
|
-
const
|
|
352
|
-
if (
|
|
353
|
-
if (
|
|
354
|
-
|
|
355
|
-
}
|
|
356
|
-
if (Math.hypot(
|
|
357
|
-
if (clearTimeout(
|
|
358
|
-
const N = Math.max(0, (
|
|
359
|
-
|
|
360
|
-
} else
|
|
361
|
-
}
|
|
362
|
-
function
|
|
363
|
-
if (!
|
|
364
|
-
if (
|
|
365
|
-
|
|
350
|
+
if (R === "idle") return;
|
|
351
|
+
const X = z.x - Z.x, j = z.y - Z.y;
|
|
352
|
+
if (R === "hold") {
|
|
353
|
+
if (d.preventDefault(), Math.hypot(X, j) < 9) return;
|
|
354
|
+
I.cancel(), R = "pending";
|
|
355
|
+
}
|
|
356
|
+
if (Math.hypot(X, j) >= 9 && I.cancel(), K.move(z, d.timeStamp), R === "pending" && (R = Lt(X, j, l.level), C = R === "pan" && F && Math.abs(X) > Math.abs(j) * 1.1), R !== "pending")
|
|
357
|
+
if (clearTimeout(m), y = -1e3, d.preventDefault(), R === "pan") {
|
|
358
|
+
const N = Math.max(0, (x.value.width - a.value.width) / 2), Q = gn(ee.offsetX + X, N, C);
|
|
359
|
+
xe({ level: l.level, ...G(Q.offsetX, ee.offsetY + j, l.level) }), Q.pageOffset !== D && (D = Q.pageOffset, n.onPageDrag(D));
|
|
360
|
+
} else R === "page" ? n.onPageDrag(X) : R === "dismiss" && (l.draggingDown = !0, l.downOffsetX = X * 0.65, l.downOffsetY = Math.max(0, j), l.downScale = J(1 - Math.max(0, j) / a.value.height * 0.6, 0.65, 1), n.onSwipeDownProgress(J(j / (a.value.height * 0.55), 0, 0.85)));
|
|
361
|
+
}
|
|
362
|
+
function ot(d) {
|
|
363
|
+
if (!A.has(d.pointerId)) return;
|
|
364
|
+
if (I.cancel(), A.delete(d.pointerId), w.value = A.size > 0, R === "pinch") {
|
|
365
|
+
A.size > 0 ? (Z = [...A.values()][0], ee = pe(), R = "pan") : (R = "idle", l.zooming = !1, he(Math.max(1, l.level), fe(), !0));
|
|
366
366
|
return;
|
|
367
367
|
}
|
|
368
|
-
if (
|
|
369
|
-
const
|
|
370
|
-
|
|
368
|
+
if (A.size > 0) return;
|
|
369
|
+
const z = Ee(d), X = z.x - Z.x, j = z.y - Z.y, N = K.read(d.timeStamp);
|
|
370
|
+
R === "page" || R === "pan" && D !== 0 ? n.onPageRelease(R === "page" ? X : D, N.x) : R === "dismiss" ? $t(j, N.y, a.value) ? n.onSwipeDownClose() : Re() : R === "pending" && performance.now() - be < 300 && He(Z, z) < 9 ? st(z) : (l.level < 1 || l.level > n.zoomLimit()) && he(l.level, fe(), !0), l.zooming = !1, R = "idle";
|
|
371
371
|
}
|
|
372
|
-
function lt(
|
|
373
|
-
if (!
|
|
374
|
-
const
|
|
375
|
-
|
|
372
|
+
function lt(d) {
|
|
373
|
+
if (!A.has(d.pointerId)) return;
|
|
374
|
+
const z = R === "page" || R === "pan" && D !== 0;
|
|
375
|
+
ve(), z && n.onPageRelease(0, 0), (l.level < 1 || l.level > n.zoomLimit()) && he(l.level, fe(), !0);
|
|
376
376
|
}
|
|
377
|
-
function st(
|
|
378
|
-
const
|
|
379
|
-
|
|
377
|
+
function st(d) {
|
|
378
|
+
const z = performance.now();
|
|
379
|
+
z - y < 280 && He(d, P) < 36 ? (clearTimeout(m), y = -1e3, n.onDoubleTap(), he(l.level > 1.01 ? 1 : n.doubleTapZoom(), d, !0)) : (y = z, P = d, m = setTimeout(n.onTap, 280));
|
|
380
380
|
}
|
|
381
|
-
function W(
|
|
381
|
+
function W(d) {
|
|
382
382
|
if (n.interactive()) {
|
|
383
|
-
if (
|
|
384
|
-
|
|
385
|
-
}, 120),
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
383
|
+
if (I.cancel(), g.value = !0, clearTimeout(O), O = setTimeout(() => {
|
|
384
|
+
g.value = !1;
|
|
385
|
+
}, 120), d.ctrlKey || d.metaKey)
|
|
386
|
+
d.preventDefault(), he(
|
|
387
|
+
l.level * fn(d, Y.size > 0),
|
|
388
|
+
Ee(d, r.value.getBoundingClientRect())
|
|
389
389
|
);
|
|
390
|
-
else if (
|
|
391
|
-
|
|
392
|
-
const
|
|
393
|
-
|
|
394
|
-
level:
|
|
395
|
-
...
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
390
|
+
else if (l.level > 1) {
|
|
391
|
+
d.preventDefault();
|
|
392
|
+
const z = d.deltaMode === 1 ? 16 : 1;
|
|
393
|
+
xe({
|
|
394
|
+
level: l.level,
|
|
395
|
+
...G(
|
|
396
|
+
l.offsetX - d.deltaX * z,
|
|
397
|
+
l.offsetY - d.deltaY * z,
|
|
398
|
+
l.level
|
|
399
399
|
)
|
|
400
400
|
});
|
|
401
401
|
}
|
|
402
402
|
}
|
|
403
403
|
}
|
|
404
|
-
const
|
|
405
|
-
state:
|
|
406
|
-
motionActive:
|
|
407
|
-
containerRef:
|
|
404
|
+
const Ue = {
|
|
405
|
+
state: l,
|
|
406
|
+
motionActive: B,
|
|
407
|
+
containerRef: r,
|
|
408
408
|
canvasRef: e,
|
|
409
409
|
mediaRef: i,
|
|
410
410
|
viewportSize: a,
|
|
411
|
-
mediaSize:
|
|
411
|
+
mediaSize: o,
|
|
412
412
|
visualMediaSize: u,
|
|
413
|
-
displaySize:
|
|
414
|
-
displayScale:
|
|
415
|
-
downDragStyle:
|
|
416
|
-
requestRender:
|
|
417
|
-
renderNow: () =>
|
|
418
|
-
zoomTo:
|
|
413
|
+
displaySize: x,
|
|
414
|
+
displayScale: c,
|
|
415
|
+
downDragStyle: L,
|
|
416
|
+
requestRender: ke,
|
|
417
|
+
renderNow: () => S.forEach((d) => d()),
|
|
418
|
+
zoomTo: he,
|
|
419
419
|
resetTransform: Be,
|
|
420
|
-
cancelGesture:
|
|
421
|
-
setMediaElement(
|
|
422
|
-
i.value =
|
|
420
|
+
cancelGesture: ve,
|
|
421
|
+
setMediaElement(d) {
|
|
422
|
+
i.value = d, d instanceof HTMLVideoElement && ke();
|
|
423
423
|
},
|
|
424
|
-
setMediaSize(
|
|
425
|
-
|
|
424
|
+
setMediaSize(d) {
|
|
425
|
+
o.value = d, ke();
|
|
426
426
|
},
|
|
427
427
|
clearMedia() {
|
|
428
428
|
i.value = void 0;
|
|
429
429
|
},
|
|
430
|
-
registerRenderHandler(
|
|
431
|
-
return
|
|
430
|
+
registerRenderHandler(d) {
|
|
431
|
+
return S.add(d), () => S.delete(d);
|
|
432
432
|
},
|
|
433
|
-
setRotation(
|
|
434
|
-
|
|
433
|
+
setRotation(d, z = !0) {
|
|
434
|
+
l.rotation = bt(d), z && Be(), ke();
|
|
435
435
|
},
|
|
436
|
-
rotateBy(
|
|
437
|
-
|
|
436
|
+
rotateBy(d = 90) {
|
|
437
|
+
Ue.setRotation(bt(l.rotation + d));
|
|
438
438
|
}
|
|
439
439
|
};
|
|
440
|
-
return { core:
|
|
440
|
+
return { core: Ue, onPointerDown: Ae, onPointerMove: rt, onPointerUp: ot, onPointerCancel: lt, onWheel: W };
|
|
441
441
|
}
|
|
442
442
|
function hn(t) {
|
|
443
|
-
const n = t.rotation * Math.PI / 180,
|
|
443
|
+
const n = t.rotation * Math.PI / 180, r = Math.round(Math.cos(n)), e = Math.round(Math.sin(n)), i = t.size.width / 2 - r * t.offsetX - e * t.offsetY, a = t.size.height / 2 + e * t.offsetX - r * t.offsetY, o = (Math.abs(r) * t.viewport.width + Math.abs(e) * t.viewport.height) / 2, l = (Math.abs(e) * t.viewport.width + Math.abs(r) * t.viewport.height) / 2, u = J(i - o, 0, t.size.width), p = J(a - l, 0, t.size.height);
|
|
444
444
|
return {
|
|
445
445
|
x: u,
|
|
446
446
|
y: p,
|
|
447
|
-
width:
|
|
448
|
-
height:
|
|
447
|
+
width: J(i + o, 0, t.size.width) - u,
|
|
448
|
+
height: J(a + l, 0, t.size.height) - p
|
|
449
449
|
};
|
|
450
450
|
}
|
|
451
|
-
function vn(t, n,
|
|
452
|
-
const i = hn(
|
|
451
|
+
function vn(t, n, r, e) {
|
|
452
|
+
const i = hn(r);
|
|
453
453
|
if (i.width <= 0 || i.height <= 0) return;
|
|
454
454
|
t.imageSmoothingEnabled = !0, t.imageSmoothingQuality = e ? "low" : "high", t.translate(
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
), t.rotate(
|
|
458
|
-
const { width: a, height:
|
|
459
|
-
if (i.width === a && i.height ===
|
|
460
|
-
t.drawImage(n, -a / 2, -
|
|
455
|
+
r.viewport.width / 2 + r.offsetX,
|
|
456
|
+
r.viewport.height / 2 + r.offsetY
|
|
457
|
+
), t.rotate(r.rotation * Math.PI / 180);
|
|
458
|
+
const { width: a, height: o } = r.size, l = "naturalWidth" in n ? n.naturalWidth : n.width, u = "naturalHeight" in n ? n.naturalHeight : n.height;
|
|
459
|
+
if (i.width === a && i.height === o) {
|
|
460
|
+
t.drawImage(n, -a / 2, -o / 2, a, o);
|
|
461
461
|
return;
|
|
462
462
|
}
|
|
463
463
|
t.drawImage(
|
|
464
464
|
n,
|
|
465
|
-
i.x / a *
|
|
466
|
-
i.y /
|
|
467
|
-
i.width / a *
|
|
468
|
-
i.height /
|
|
465
|
+
i.x / a * l,
|
|
466
|
+
i.y / o * u,
|
|
467
|
+
i.width / a * l,
|
|
468
|
+
i.height / o * u,
|
|
469
469
|
i.x - a / 2,
|
|
470
|
-
i.y -
|
|
470
|
+
i.y - o / 2,
|
|
471
471
|
i.width,
|
|
472
472
|
i.height
|
|
473
473
|
);
|
|
474
474
|
}
|
|
475
|
-
|
|
475
|
+
const yn = { class: "mp-dom-renderer mp-gif-renderer" }, wn = ["src", "alt"], bn = /* @__PURE__ */ $e({
|
|
476
|
+
__name: "AnimatedImageLayer",
|
|
477
|
+
props: {
|
|
478
|
+
core: {},
|
|
479
|
+
src: {},
|
|
480
|
+
title: {}
|
|
481
|
+
},
|
|
482
|
+
setup(t) {
|
|
483
|
+
const n = t, r = V(() => ({
|
|
484
|
+
transform: `translate(-50%, -50%) translate3d(${n.core.state.offsetX}px, ${n.core.state.offsetY}px, 0)`
|
|
485
|
+
})), e = V(() => ({
|
|
486
|
+
width: `${n.core.mediaSize.value.width * n.core.displayScale.value}px`,
|
|
487
|
+
height: `${n.core.mediaSize.value.height * n.core.displayScale.value}px`,
|
|
488
|
+
transform: `rotate(${n.core.state.rotation}deg)`,
|
|
489
|
+
pointerEvents: "none"
|
|
490
|
+
}));
|
|
491
|
+
return (i, a) => (q(), _("div", yn, [
|
|
492
|
+
T("div", {
|
|
493
|
+
class: "mp-dom-renderer__frame",
|
|
494
|
+
style: we(r.value)
|
|
495
|
+
}, [
|
|
496
|
+
T("img", {
|
|
497
|
+
src: i.src,
|
|
498
|
+
alt: i.title,
|
|
499
|
+
draggable: !1,
|
|
500
|
+
class: "mp-dom-renderer__node",
|
|
501
|
+
style: we(e.value)
|
|
502
|
+
}, null, 12, wn)
|
|
503
|
+
], 4)
|
|
504
|
+
]));
|
|
505
|
+
}
|
|
506
|
+
});
|
|
507
|
+
function kn() {
|
|
476
508
|
const t = /* @__PURE__ */ new Set();
|
|
477
509
|
let n = [];
|
|
478
|
-
const
|
|
510
|
+
const r = /* @__PURE__ */ new Map();
|
|
479
511
|
let e = { kind: "empty" };
|
|
480
512
|
function i() {
|
|
481
513
|
for (const a of t)
|
|
482
|
-
|
|
514
|
+
r.has(a) || n.includes(a) || e.kind === "owned" && e.lease === a || (a.release(), t.delete(a));
|
|
483
515
|
}
|
|
484
516
|
return {
|
|
485
517
|
replace(a) {
|
|
486
|
-
n = a, a.forEach((
|
|
518
|
+
n = a, a.forEach((o) => t.add(o)), i();
|
|
487
519
|
},
|
|
488
520
|
display(a) {
|
|
489
521
|
e = { kind: "owned", lease: a }, i();
|
|
@@ -492,13 +524,13 @@ function yn() {
|
|
|
492
524
|
if (e.kind === "empty") return () => {
|
|
493
525
|
};
|
|
494
526
|
const a = e.lease;
|
|
495
|
-
|
|
496
|
-
let
|
|
527
|
+
r.set(a, r.has(a) ? r.get(a) + 1 : 1);
|
|
528
|
+
let o = !1;
|
|
497
529
|
return () => {
|
|
498
|
-
if (
|
|
499
|
-
|
|
500
|
-
const
|
|
501
|
-
|
|
530
|
+
if (o) return;
|
|
531
|
+
o = !0;
|
|
532
|
+
const l = r.get(a) - 1;
|
|
533
|
+
l === 0 ? r.delete(a) : r.set(a, l), i();
|
|
502
534
|
};
|
|
503
535
|
},
|
|
504
536
|
clearDisplay() {
|
|
@@ -519,34 +551,34 @@ const ue = {
|
|
|
519
551
|
cacheEntries: 24,
|
|
520
552
|
concurrency: 3
|
|
521
553
|
};
|
|
522
|
-
class
|
|
554
|
+
class je extends Error {
|
|
523
555
|
constructor(n) {
|
|
524
556
|
super(n), this.name = "ImageLimitError";
|
|
525
557
|
}
|
|
526
558
|
}
|
|
527
559
|
function Bt(t, n) {
|
|
528
560
|
if (t.naturalWidth * t.naturalHeight > n)
|
|
529
|
-
throw new
|
|
561
|
+
throw new je("图片像素超过解码保护限制,请提供较小的适屏资源");
|
|
530
562
|
}
|
|
531
563
|
const ct = "原图超过资源限制";
|
|
532
|
-
function
|
|
533
|
-
return t instanceof
|
|
564
|
+
function xn(t) {
|
|
565
|
+
return t instanceof je ? { status: "blocked", reason: ct } : {
|
|
534
566
|
status: "error",
|
|
535
567
|
reason: t instanceof Error ? t.message : "原图加载失败,可重试"
|
|
536
568
|
};
|
|
537
569
|
}
|
|
538
570
|
const zt = `(function(){"use strict";self.onmessage=async({data:a})=>{try{const t=await createImageBitmap(a.blob);let e=t;try{const s=Math.min(1,Math.sqrt(a.maxMotionPixels/(t.width*t.height)));s<1&&(e=await createImageBitmap(t,{resizeWidth:Math.max(1,Math.floor(t.width*s)),resizeHeight:Math.max(1,Math.floor(t.height*s)),resizeQuality:"high"}));const r=e===t?[t]:[t,e];self.postMessage({status:"ready",full:t,motion:e},{transfer:r})}catch(s){throw e!==t&&e.close(),t.close(),s}}catch(t){self.postMessage({status:"error",message:t instanceof Error?t.message:"图片位图准备失败"})}}})();
|
|
539
571
|
`, kt = typeof self < "u" && self.Blob && new Blob([zt], { type: "text/javascript;charset=utf-8" });
|
|
540
|
-
function
|
|
572
|
+
function Mn(t) {
|
|
541
573
|
let n;
|
|
542
574
|
try {
|
|
543
575
|
if (n = kt && (self.URL || self.webkitURL).createObjectURL(kt), !n) throw "";
|
|
544
|
-
const
|
|
576
|
+
const r = new Worker(n, {
|
|
545
577
|
name: t == null ? void 0 : t.name
|
|
546
578
|
});
|
|
547
|
-
return
|
|
579
|
+
return r.addEventListener("error", () => {
|
|
548
580
|
(self.URL || self.webkitURL).revokeObjectURL(n);
|
|
549
|
-
}),
|
|
581
|
+
}), r;
|
|
550
582
|
} catch {
|
|
551
583
|
return new Worker(
|
|
552
584
|
"data:text/javascript;charset=utf-8," + encodeURIComponent(zt),
|
|
@@ -561,34 +593,49 @@ function bn(t) {
|
|
|
561
593
|
function dt({ full: t, motion: n }) {
|
|
562
594
|
n !== t && n.close(), t.close();
|
|
563
595
|
}
|
|
564
|
-
function
|
|
565
|
-
return
|
|
566
|
-
const a = new
|
|
567
|
-
|
|
568
|
-
},
|
|
569
|
-
|
|
596
|
+
function Sn(t, n, r) {
|
|
597
|
+
return r.throwIfAborted(), new Promise((e, i) => {
|
|
598
|
+
const a = new Mn(), o = () => {
|
|
599
|
+
r.removeEventListener("abort", l), a.terminate();
|
|
600
|
+
}, l = () => {
|
|
601
|
+
o(), i(r.reason);
|
|
570
602
|
};
|
|
571
603
|
a.onmessage = ({ data: u }) => {
|
|
572
|
-
if (
|
|
604
|
+
if (o(), u.status === "error") {
|
|
573
605
|
i(new Error(u.message));
|
|
574
606
|
return;
|
|
575
607
|
}
|
|
576
|
-
if (
|
|
577
|
-
dt(u), i(
|
|
608
|
+
if (r.aborted) {
|
|
609
|
+
dt(u), i(r.reason);
|
|
578
610
|
return;
|
|
579
611
|
}
|
|
580
612
|
e(u);
|
|
581
613
|
}, a.onerror = (u) => {
|
|
582
|
-
|
|
583
|
-
},
|
|
614
|
+
o(), i(new Error(u.message || "图片位图准备失败"));
|
|
615
|
+
}, r.addEventListener("abort", l, { once: !0 });
|
|
584
616
|
try {
|
|
585
617
|
a.postMessage({ blob: t, maxMotionPixels: n });
|
|
586
618
|
} catch (u) {
|
|
587
|
-
|
|
619
|
+
o(), i(u);
|
|
588
620
|
}
|
|
589
621
|
});
|
|
590
622
|
}
|
|
591
|
-
function
|
|
623
|
+
function Pn(t) {
|
|
624
|
+
return t[0] === 71 && t[1] === 73 && t[2] === 70 && t[3] === 56 && (t[4] === 55 || t[4] === 57) && t[5] === 97;
|
|
625
|
+
}
|
|
626
|
+
async function Rn(t, n, r) {
|
|
627
|
+
await t.decode(), r.throwIfAborted();
|
|
628
|
+
const e = URL.createObjectURL(n);
|
|
629
|
+
return {
|
|
630
|
+
image: t,
|
|
631
|
+
source: t,
|
|
632
|
+
motionSource: t,
|
|
633
|
+
animation: { kind: "gif", url: e },
|
|
634
|
+
bytes: t.naturalWidth * t.naturalHeight * 4 + n.size,
|
|
635
|
+
dispose: () => URL.revokeObjectURL(e)
|
|
636
|
+
};
|
|
637
|
+
}
|
|
638
|
+
function It(t) {
|
|
592
639
|
return {
|
|
593
640
|
image: t,
|
|
594
641
|
source: t,
|
|
@@ -598,95 +645,96 @@ function Dt(t) {
|
|
|
598
645
|
}
|
|
599
646
|
};
|
|
600
647
|
}
|
|
601
|
-
async function
|
|
602
|
-
const e = new Uint8Array(await n.slice(0,
|
|
603
|
-
if (
|
|
604
|
-
|
|
605
|
-
|
|
648
|
+
async function En(t, n, r) {
|
|
649
|
+
const e = new Uint8Array(await n.slice(0, 6).arrayBuffer());
|
|
650
|
+
if (r.throwIfAborted(), Pn(e)) return Rn(t, n, r);
|
|
651
|
+
if (!(e[0] === 255 && e[1] === 216 && e[2] === 255))
|
|
652
|
+
return await t.decode(), r.throwIfAborted(), It(t);
|
|
653
|
+
const i = await Sn(n, ue.maxCanvasPixels, r);
|
|
606
654
|
try {
|
|
607
|
-
|
|
608
|
-
const { full: a, motion:
|
|
655
|
+
r.throwIfAborted();
|
|
656
|
+
const { full: a, motion: o } = i, l = o === a ? 0 : o.width * o.height * 4;
|
|
609
657
|
return {
|
|
610
658
|
image: t,
|
|
611
659
|
source: a,
|
|
612
|
-
motionSource:
|
|
660
|
+
motionSource: o,
|
|
613
661
|
// Include the DOM image and both retained pixel sizes in the cache budget.
|
|
614
|
-
bytes: (t.naturalWidth * t.naturalHeight + a.width * a.height) * 4 +
|
|
662
|
+
bytes: (t.naturalWidth * t.naturalHeight + a.width * a.height) * 4 + l,
|
|
615
663
|
dispose: () => dt(i)
|
|
616
664
|
};
|
|
617
665
|
} catch (a) {
|
|
618
666
|
throw dt(i), a;
|
|
619
667
|
}
|
|
620
668
|
}
|
|
621
|
-
const
|
|
622
|
-
const
|
|
623
|
-
if (!
|
|
624
|
-
if (Number(
|
|
625
|
-
throw await
|
|
626
|
-
const i =
|
|
627
|
-
let
|
|
669
|
+
const Cn = async (t, n) => {
|
|
670
|
+
const r = await fetch(t, { signal: n.signal, credentials: "same-origin" });
|
|
671
|
+
if (!r.ok) throw new Error(`图片加载失败:HTTP ${r.status}`);
|
|
672
|
+
if (Number(r.headers.get("content-length")) > n.maxBytes)
|
|
673
|
+
throw await r.body.cancel(), new je("资源超过下载保护限制,请使用适屏图或下载原文件");
|
|
674
|
+
const i = r.body.getReader(), a = [];
|
|
675
|
+
let o = 0;
|
|
628
676
|
try {
|
|
629
677
|
for (; ; ) {
|
|
630
|
-
const
|
|
631
|
-
if (
|
|
632
|
-
if (
|
|
633
|
-
throw new
|
|
634
|
-
a.push(new Uint8Array(
|
|
635
|
-
}
|
|
636
|
-
} catch (
|
|
637
|
-
throw await i.cancel(),
|
|
678
|
+
const c = await i.read();
|
|
679
|
+
if (c.done) break;
|
|
680
|
+
if (o += c.value.byteLength, o > n.maxBytes)
|
|
681
|
+
throw new je("资源超过下载保护限制,请使用适屏图或下载原文件");
|
|
682
|
+
a.push(new Uint8Array(c.value));
|
|
683
|
+
}
|
|
684
|
+
} catch (c) {
|
|
685
|
+
throw await i.cancel(), c;
|
|
638
686
|
} finally {
|
|
639
687
|
i.releaseLock();
|
|
640
688
|
}
|
|
641
689
|
n.signal.throwIfAborted();
|
|
642
|
-
const
|
|
690
|
+
const l = new Blob(a, { type: r.headers.get("content-type") }), u = URL.createObjectURL(l), p = new Image();
|
|
643
691
|
p.decoding = "async";
|
|
644
692
|
try {
|
|
645
|
-
return await new Promise((
|
|
646
|
-
const
|
|
647
|
-
p.removeAttribute("src"),
|
|
693
|
+
return await new Promise((c, x) => {
|
|
694
|
+
const L = () => {
|
|
695
|
+
p.removeAttribute("src"), x(new DOMException("请求已取消", "AbortError"));
|
|
648
696
|
};
|
|
649
697
|
p.onload = () => {
|
|
650
|
-
n.signal.removeEventListener("abort",
|
|
698
|
+
n.signal.removeEventListener("abort", L), c();
|
|
651
699
|
}, p.onerror = () => {
|
|
652
|
-
n.signal.removeEventListener("abort",
|
|
653
|
-
}, n.signal.addEventListener("abort",
|
|
654
|
-
}), n.signal.throwIfAborted(), Bt(p, n.maxPixels), await
|
|
700
|
+
n.signal.removeEventListener("abort", L), x(new Error("图片解码失败或格式不受支持"));
|
|
701
|
+
}, n.signal.addEventListener("abort", L, { once: !0 }), p.src = u;
|
|
702
|
+
}), n.signal.throwIfAborted(), Bt(p, n.maxPixels), await En(p, l, n.signal);
|
|
655
703
|
} finally {
|
|
656
704
|
URL.revokeObjectURL(u);
|
|
657
705
|
}
|
|
658
706
|
};
|
|
659
|
-
class
|
|
660
|
-
constructor(n = ue.cacheBytes,
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
this.budget = n, this.concurrency =
|
|
707
|
+
class Ln {
|
|
708
|
+
constructor(n = ue.cacheBytes, r = ue.concurrency, e = Cn) {
|
|
709
|
+
tt(this, "entries", /* @__PURE__ */ new Map());
|
|
710
|
+
tt(this, "active", 0);
|
|
711
|
+
tt(this, "cancelled", 0);
|
|
712
|
+
this.budget = n, this.concurrency = r, this.loader = e;
|
|
665
713
|
}
|
|
666
714
|
get stats() {
|
|
667
715
|
return {
|
|
668
716
|
active: this.active,
|
|
669
717
|
queued: [...this.entries.values()].filter((n) => n.state === "queued").length,
|
|
670
718
|
entries: this.entries.size,
|
|
671
|
-
bytes: [...this.entries.values()].reduce((n,
|
|
719
|
+
bytes: [...this.entries.values()].reduce((n, r) => n + r.bytes, 0),
|
|
672
720
|
cancelled: this.cancelled
|
|
673
721
|
};
|
|
674
722
|
}
|
|
675
|
-
acquire(n,
|
|
723
|
+
acquire(n, r = {}) {
|
|
676
724
|
const e = {
|
|
677
725
|
priority: 0,
|
|
678
726
|
maxBytes: ue.maxOriginalBytes,
|
|
679
727
|
maxPixels: ue.maxDecodedPixels,
|
|
680
|
-
...
|
|
728
|
+
...r
|
|
681
729
|
};
|
|
682
730
|
if (this.entries.has(n) && ["error", "aborted"].includes(this.entries.get(n).state) && this.entries.delete(n), !this.entries.has(n)) {
|
|
683
731
|
let u, p;
|
|
684
|
-
const
|
|
685
|
-
u =
|
|
732
|
+
const c = new Promise((x, L) => {
|
|
733
|
+
u = x, p = L;
|
|
686
734
|
});
|
|
687
|
-
|
|
735
|
+
c.catch(() => {
|
|
688
736
|
}), this.entries.set(n, {
|
|
689
|
-
promise:
|
|
737
|
+
promise: c,
|
|
690
738
|
resolve: u,
|
|
691
739
|
reject: p,
|
|
692
740
|
controller: new AbortController(),
|
|
@@ -703,12 +751,12 @@ class Sn {
|
|
|
703
751
|
const i = this.entries.get(n);
|
|
704
752
|
i.users++, i.priority = Math.min(i.priority, e.priority), i.maxBytes = Math.max(i.maxBytes, e.maxBytes), i.maxPixels = Math.max(i.maxPixels, e.maxPixels), this.entries.delete(n), this.entries.set(n, i), this.pump();
|
|
705
753
|
let a = !1;
|
|
706
|
-
const
|
|
707
|
-
return
|
|
708
|
-
}),
|
|
754
|
+
const o = i.promise.then((u) => (Bt(u.image, e.maxPixels), u)), l = o.then((u) => u.image);
|
|
755
|
+
return o.catch(() => {
|
|
756
|
+
}), l.catch(() => {
|
|
709
757
|
}), {
|
|
710
|
-
ready:
|
|
711
|
-
resource:
|
|
758
|
+
ready: l,
|
|
759
|
+
resource: o,
|
|
712
760
|
release: () => {
|
|
713
761
|
a || (a = !0, i.users--, i.users === 0 && (i.state === "queued" || i.state === "loading") && (i.state = "aborted", this.cancelled++, i.controller.abort(), i.reject(new DOMException("请求已取消", "AbortError")), this.entries.get(n) === i && this.entries.delete(n)), i.users === 0 && i.state === "error" && this.entries.get(n) === i && this.entries.delete(n), this.trim(), this.pump());
|
|
714
762
|
}
|
|
@@ -718,8 +766,8 @@ class Sn {
|
|
|
718
766
|
for (; this.active < this.concurrency; ) {
|
|
719
767
|
const n = [...this.entries].filter(([, i]) => i.state === "queued" && i.users > 0).sort((i, a) => i[1].priority - a[1].priority);
|
|
720
768
|
if (n.length === 0) return;
|
|
721
|
-
const [
|
|
722
|
-
e.state = "loading", this.active++, this.loader(
|
|
769
|
+
const [r, e] = n[0];
|
|
770
|
+
e.state = "loading", this.active++, this.loader(r, {
|
|
723
771
|
signal: e.controller.signal,
|
|
724
772
|
get maxBytes() {
|
|
725
773
|
return e.maxBytes;
|
|
@@ -734,7 +782,7 @@ class Sn {
|
|
|
734
782
|
}
|
|
735
783
|
e.bytes = i.bytes, e.dispose = i.dispose, e.state = "ready", e.resolve(i);
|
|
736
784
|
}).catch((i) => {
|
|
737
|
-
e.state !== "aborted" && (e.state = "error", e.reject(
|
|
785
|
+
e.state !== "aborted" && (e.state = "error", e.reject(Ve(i)));
|
|
738
786
|
}).finally(() => {
|
|
739
787
|
this.active--, this.trim(), this.pump();
|
|
740
788
|
});
|
|
@@ -742,16 +790,16 @@ class Sn {
|
|
|
742
790
|
}
|
|
743
791
|
trim() {
|
|
744
792
|
let n = this.stats.bytes;
|
|
745
|
-
for (const [
|
|
793
|
+
for (const [r, e] of this.entries)
|
|
746
794
|
if (!(e.users > 0 || e.state === "loading" || e.state === "queued")) {
|
|
747
795
|
if (n <= this.budget && this.entries.size <= ue.cacheEntries) break;
|
|
748
|
-
n -= e.bytes, e.dispose(), this.entries.delete(
|
|
796
|
+
n -= e.bytes, e.dispose(), this.entries.delete(r);
|
|
749
797
|
}
|
|
750
798
|
}
|
|
751
799
|
}
|
|
752
|
-
const
|
|
753
|
-
function
|
|
754
|
-
return t.kind === "element" && t.element instanceof HTMLImageElement && t.element.complete && t.element.naturalWidth > 0 ? { kind: "image", image: t.element } :
|
|
800
|
+
const $n = new Ln(), Ce = { kind: "empty" };
|
|
801
|
+
function Fn(t) {
|
|
802
|
+
return t.kind === "element" && t.element instanceof HTMLImageElement && t.element.complete && t.element.naturalWidth > 0 ? { kind: "image", image: t.element } : Ce;
|
|
755
803
|
}
|
|
756
804
|
function xt() {
|
|
757
805
|
const t = document.createElement("canvas");
|
|
@@ -759,119 +807,126 @@ function xt() {
|
|
|
759
807
|
const n = t.getContext("2d");
|
|
760
808
|
return n.fillStyle = "#f3f4f5", n.fillRect(0, 0, 1, 1), t;
|
|
761
809
|
}
|
|
762
|
-
const
|
|
810
|
+
const Dt = ["thumbnail", "screen", "full"], Ge = {
|
|
763
811
|
maxOriginalPixels: ue.maxDecodedPixels,
|
|
764
812
|
maxOriginalBytes: ue.maxOriginalBytes,
|
|
765
813
|
maxPreviewBytes: ue.maxPreviewBytes
|
|
766
814
|
}, Ke = (t, n) => n === "full" ? t.src : n === "screen" ? t.previewSrc : t.thumbnail;
|
|
767
|
-
function
|
|
815
|
+
function Tn(t, n) {
|
|
768
816
|
return t.width * t.height <= n.maxOriginalPixels;
|
|
769
817
|
}
|
|
770
|
-
function
|
|
771
|
-
const
|
|
818
|
+
function Bn(t, n) {
|
|
819
|
+
const r = Math.min(n.width / t.width, n.height / t.height);
|
|
772
820
|
return Math.min(
|
|
773
821
|
8,
|
|
774
822
|
Math.max(
|
|
775
823
|
2,
|
|
776
824
|
Math.min(
|
|
777
|
-
1 /
|
|
778
|
-
Math.max(n.width / (t.width *
|
|
825
|
+
1 / r,
|
|
826
|
+
Math.max(n.width / (t.width * r), n.height / (t.height * r))
|
|
779
827
|
)
|
|
780
828
|
)
|
|
781
829
|
);
|
|
782
830
|
}
|
|
783
|
-
function
|
|
784
|
-
const
|
|
831
|
+
function zn(t, n, r, e, i, a = !0) {
|
|
832
|
+
const o = Tn(t, r), l = {
|
|
785
833
|
sources: [],
|
|
786
|
-
originalStatus: a && n === "full" ?
|
|
834
|
+
originalStatus: a && n === "full" ? o ? "loading" : "blocked" : "idle",
|
|
787
835
|
originalReason: ""
|
|
788
836
|
};
|
|
789
|
-
|
|
790
|
-
for (const [u, p] of
|
|
791
|
-
if (p === "screen" && n === "thumbnail" || p === "full" && (!a || n !== "full" || !
|
|
837
|
+
l.originalStatus === "blocked" && (l.originalReason = ct);
|
|
838
|
+
for (const [u, p] of Dt.entries()) {
|
|
839
|
+
if (p === "screen" && n === "thumbnail" || p === "full" && (!a || n !== "full" || !o))
|
|
792
840
|
continue;
|
|
793
|
-
const
|
|
794
|
-
if (a && !
|
|
795
|
-
|
|
841
|
+
const c = e(t, p, i);
|
|
842
|
+
if (a && !o && c === t.src) {
|
|
843
|
+
l.originalStatus = "blocked", l.originalReason = ct;
|
|
796
844
|
continue;
|
|
797
845
|
}
|
|
798
|
-
|
|
846
|
+
l.sources.push({ url: c, quality: p, rank: u });
|
|
799
847
|
}
|
|
800
|
-
return
|
|
848
|
+
return l;
|
|
801
849
|
}
|
|
802
|
-
const
|
|
803
|
-
key:
|
|
850
|
+
const In = ["aria-label"], Dn = {
|
|
851
|
+
key: 1,
|
|
804
852
|
class: "mp-resource-state",
|
|
805
853
|
role: "status",
|
|
806
854
|
"aria-label": "加载中"
|
|
807
|
-
},
|
|
855
|
+
}, qn = /* @__PURE__ */ T("span", {
|
|
808
856
|
class: "mp-spinner",
|
|
809
857
|
"aria-hidden": "true"
|
|
810
|
-
}, null, -1),
|
|
811
|
-
|
|
812
|
-
],
|
|
813
|
-
key:
|
|
858
|
+
}, null, -1), On = [
|
|
859
|
+
qn
|
|
860
|
+
], An = {
|
|
861
|
+
key: 2,
|
|
814
862
|
class: "mp-resource-state",
|
|
815
863
|
role: "alert"
|
|
816
|
-
},
|
|
817
|
-
key:
|
|
864
|
+
}, _n = /* @__PURE__ */ T("span", null, "图片暂时无法加载", -1), Vn = {
|
|
865
|
+
key: 3,
|
|
818
866
|
class: "mp-quality-notice"
|
|
819
|
-
}, pt = /* @__PURE__ */
|
|
867
|
+
}, pt = /* @__PURE__ */ $e({
|
|
820
868
|
inheritAttrs: !1,
|
|
821
869
|
__name: "ImageCanvasRenderer",
|
|
822
870
|
props: {
|
|
823
871
|
media: {},
|
|
824
872
|
core: {},
|
|
873
|
+
active: { type: Boolean, default: !0 },
|
|
825
874
|
quality: { default: "screen" },
|
|
826
875
|
rendering: { type: Boolean, default: !0 },
|
|
827
876
|
requestVersion: { default: 0 },
|
|
828
877
|
loadEnabled: { type: Boolean, default: !0 },
|
|
829
878
|
originalEnabled: { type: Boolean, default: !0 },
|
|
830
879
|
priority: { default: 0 },
|
|
831
|
-
resourcePolicy: { default: () =>
|
|
880
|
+
resourcePolicy: { default: () => Ge },
|
|
832
881
|
resolveSource: { type: Function, default: Ke },
|
|
833
|
-
initialImage: { default: () =>
|
|
882
|
+
initialImage: { default: () => Ce }
|
|
834
883
|
},
|
|
835
884
|
emits: ["ready", "error", "originalState"],
|
|
836
|
-
setup(t, { expose: n, emit:
|
|
837
|
-
const e = t, i =
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
885
|
+
setup(t, { expose: n, emit: r }) {
|
|
886
|
+
const e = t, i = r, a = $(), o = ft({ status: "empty" }), l = V(() => {
|
|
887
|
+
const F = { kind: "hidden" };
|
|
888
|
+
if (!e.active || !e.rendering || !e.loadEnabled || o.value.status !== "ready")
|
|
889
|
+
return F;
|
|
890
|
+
const C = o.value.value;
|
|
891
|
+
return "animation" in C ? C.animation : F;
|
|
892
|
+
}), u = $("loading"), p = $(!1), c = $("idle"), x = $("");
|
|
893
|
+
te(
|
|
894
|
+
[c, x],
|
|
895
|
+
() => i("originalState", c.value, x.value)
|
|
841
896
|
);
|
|
842
|
-
let
|
|
843
|
-
const
|
|
844
|
-
let
|
|
845
|
-
},
|
|
846
|
-
function
|
|
847
|
-
if (e.core.motionActive.value && e.loadEnabled &&
|
|
848
|
-
|
|
897
|
+
let L = !0, S = 0, E = e.media.id;
|
|
898
|
+
const w = kn();
|
|
899
|
+
let g = () => {
|
|
900
|
+
}, B, O = !1, h = { kind: "empty" };
|
|
901
|
+
function k() {
|
|
902
|
+
if (e.core.motionActive.value && e.loadEnabled && E === e.media.id) {
|
|
903
|
+
O = !0;
|
|
849
904
|
return;
|
|
850
905
|
}
|
|
851
|
-
|
|
906
|
+
O = !1, P();
|
|
852
907
|
}
|
|
853
|
-
function
|
|
854
|
-
|
|
908
|
+
function m(F, C, D, A) {
|
|
909
|
+
o.value = { status: "ready", value: F, rank: D }, w.display(C), e.core.setMediaElement(F.image), u.value = "ready", p.value = !1, A === "full" && (c.value = "ready"), e.core.requestRender(), i("ready", A);
|
|
855
910
|
}
|
|
856
|
-
|
|
911
|
+
te(
|
|
857
912
|
() => e.core.motionActive.value,
|
|
858
|
-
(
|
|
859
|
-
if (e.core.requestRender(), !
|
|
860
|
-
if (
|
|
861
|
-
const
|
|
862
|
-
|
|
913
|
+
(F) => {
|
|
914
|
+
if (e.core.requestRender(), !F) {
|
|
915
|
+
if (h.kind === "ready") {
|
|
916
|
+
const C = h;
|
|
917
|
+
h = { kind: "empty" }, C.token === S && m(C.value, C.lease, C.rank, C.quality);
|
|
863
918
|
}
|
|
864
|
-
|
|
919
|
+
O && k();
|
|
865
920
|
}
|
|
866
921
|
}
|
|
867
922
|
), qe(() => {
|
|
868
|
-
const
|
|
869
|
-
|
|
870
|
-
|
|
923
|
+
const F = a.value;
|
|
924
|
+
B = F.getContext("2d"), e.core.canvasRef.value = F, g = e.core.registerRenderHandler(v), y(), Se(() => {
|
|
925
|
+
L && k();
|
|
871
926
|
});
|
|
872
|
-
}),
|
|
873
|
-
|
|
874
|
-
}),
|
|
927
|
+
}), Te(() => {
|
|
928
|
+
L = !1, S += 1, g(), w.dispose();
|
|
929
|
+
}), te(
|
|
875
930
|
[
|
|
876
931
|
() => e.media.id,
|
|
877
932
|
() => e.media.src,
|
|
@@ -886,89 +941,89 @@ const Fn = ["aria-label"], $n = {
|
|
|
886
941
|
() => e.requestVersion
|
|
887
942
|
],
|
|
888
943
|
() => {
|
|
889
|
-
|
|
944
|
+
k();
|
|
890
945
|
}
|
|
891
|
-
),
|
|
946
|
+
), te(() => e.initialImage, y), te(
|
|
892
947
|
() => e.rendering,
|
|
893
|
-
(
|
|
894
|
-
|
|
948
|
+
(F) => {
|
|
949
|
+
F && e.core.requestRender();
|
|
895
950
|
}
|
|
896
951
|
);
|
|
897
|
-
function
|
|
898
|
-
e.initialImage.kind !== "image" ||
|
|
952
|
+
function y() {
|
|
953
|
+
e.initialImage.kind !== "image" || o.value.status === "ready" || (o.value = {
|
|
899
954
|
status: "ready",
|
|
900
|
-
value:
|
|
955
|
+
value: It(e.initialImage.image),
|
|
901
956
|
rank: 0
|
|
902
|
-
}, e.core.setMediaElement(e.initialImage.image),
|
|
957
|
+
}, e.core.setMediaElement(e.initialImage.image), u.value = "ready", e.core.requestRender(), i("ready", "thumbnail"));
|
|
903
958
|
}
|
|
904
|
-
async function
|
|
905
|
-
const
|
|
906
|
-
if (
|
|
907
|
-
|
|
959
|
+
async function P() {
|
|
960
|
+
const F = ++S;
|
|
961
|
+
if (h = { kind: "empty" }, p.value = !1, E !== e.media.id && (E = e.media.id, o.value = { status: "empty" }, w.clearDisplay(), u.value = "loading", e.core.clearMedia(), y()), !e.loadEnabled) {
|
|
962
|
+
w.replace([]);
|
|
908
963
|
return;
|
|
909
964
|
}
|
|
910
|
-
const
|
|
965
|
+
const C = Math.ceil(
|
|
911
966
|
e.core.viewportSize.value.width * Math.min(devicePixelRatio, ue.maxDevicePixelRatio) * e.core.state.level
|
|
912
|
-
), D =
|
|
967
|
+
), D = zn(
|
|
913
968
|
e.media,
|
|
914
969
|
e.quality,
|
|
915
970
|
e.resourcePolicy,
|
|
916
971
|
e.resolveSource,
|
|
917
|
-
|
|
972
|
+
C,
|
|
918
973
|
e.originalEnabled
|
|
919
974
|
);
|
|
920
|
-
|
|
921
|
-
const { sources:
|
|
922
|
-
(
|
|
975
|
+
x.value = D.originalReason, c.value = D.originalStatus;
|
|
976
|
+
const { sources: A } = D, Z = A.map(
|
|
977
|
+
(ne) => $n.acquire(ne.url, {
|
|
923
978
|
priority: e.priority,
|
|
924
979
|
maxPixels: e.resourcePolicy.maxOriginalPixels,
|
|
925
|
-
maxBytes:
|
|
980
|
+
maxBytes: ne.quality === "full" ? e.resourcePolicy.maxOriginalBytes : e.resourcePolicy.maxPreviewBytes
|
|
926
981
|
})
|
|
927
982
|
);
|
|
928
|
-
|
|
929
|
-
let
|
|
983
|
+
w.replace(Z), A.length === 0 && o.value.status === "empty" && (u.value = "error", i("error", new je(x.value))), o.value.status === "ready" && i("ready", Dt[o.value.rank]);
|
|
984
|
+
let K = o.value.status === "ready" ? o.value.rank : -1, be = 0;
|
|
930
985
|
await Promise.all(
|
|
931
|
-
|
|
932
|
-
const oe =
|
|
986
|
+
A.map(async (ne, me) => {
|
|
987
|
+
const oe = ne.rank, Pe = Z[me];
|
|
933
988
|
try {
|
|
934
|
-
const
|
|
935
|
-
if (
|
|
936
|
-
|
|
989
|
+
const ee = await Pe.resource;
|
|
990
|
+
if (F !== S || oe < K) return;
|
|
991
|
+
K = oe, e.core.motionActive.value && o.value.status === "ready" ? h = {
|
|
937
992
|
kind: "ready",
|
|
938
|
-
token:
|
|
939
|
-
value:
|
|
940
|
-
lease:
|
|
993
|
+
token: F,
|
|
994
|
+
value: ee,
|
|
995
|
+
lease: Pe,
|
|
941
996
|
rank: oe,
|
|
942
|
-
quality:
|
|
943
|
-
} :
|
|
944
|
-
} catch (
|
|
945
|
-
if (
|
|
946
|
-
if (
|
|
947
|
-
const
|
|
948
|
-
|
|
997
|
+
quality: ne.quality
|
|
998
|
+
} : m(ee, Pe, oe, ne.quality);
|
|
999
|
+
} catch (ee) {
|
|
1000
|
+
if (F !== S || ee instanceof Error && ee.name === "AbortError") return;
|
|
1001
|
+
if (ne.quality === "full") {
|
|
1002
|
+
const I = xn(ee);
|
|
1003
|
+
c.value = I.status, x.value = I.reason;
|
|
949
1004
|
}
|
|
950
|
-
|
|
1005
|
+
be += 1, oe > K && o.value.status === "ready" && (p.value = !0), be === A.length && o.value.status === "empty" && (u.value = "error"), i("error", Ve(ee));
|
|
951
1006
|
}
|
|
952
1007
|
})
|
|
953
1008
|
);
|
|
954
1009
|
}
|
|
955
|
-
function
|
|
956
|
-
if (!e.rendering ||
|
|
957
|
-
const
|
|
958
|
-
if (
|
|
1010
|
+
function v() {
|
|
1011
|
+
if (!e.rendering || o.value.status !== "ready") return;
|
|
1012
|
+
const F = a.value, C = e.core.viewportSize.value;
|
|
1013
|
+
if (C.width <= 0 || C.height <= 0) return;
|
|
959
1014
|
const D = Math.min(
|
|
960
1015
|
devicePixelRatio,
|
|
961
1016
|
ue.maxDevicePixelRatio,
|
|
962
|
-
Math.sqrt(ue.maxCanvasPixels / (
|
|
963
|
-
),
|
|
964
|
-
(
|
|
965
|
-
const { width:
|
|
1017
|
+
Math.sqrt(ue.maxCanvasPixels / (C.width * C.height))
|
|
1018
|
+
), A = Math.max(1, Math.round(C.width * D)), Z = Math.max(1, Math.round(C.height * D));
|
|
1019
|
+
(F.width !== A || F.height !== Z) && (F.width = A, F.height = Z), B.setTransform(D, 0, 0, D, 0, 0), B.clearRect(0, 0, C.width, C.height);
|
|
1020
|
+
const { width: K, height: be } = e.core.mediaSize.value, ne = e.core.displayScale.value;
|
|
966
1021
|
vn(
|
|
967
|
-
|
|
968
|
-
e.core.motionActive.value ?
|
|
1022
|
+
B,
|
|
1023
|
+
e.core.motionActive.value ? o.value.value.motionSource : o.value.value.source,
|
|
969
1024
|
{
|
|
970
|
-
viewport:
|
|
971
|
-
size: { width:
|
|
1025
|
+
viewport: C,
|
|
1026
|
+
size: { width: K * ne, height: be * ne },
|
|
972
1027
|
offsetX: e.core.state.offsetX,
|
|
973
1028
|
offsetY: e.core.state.offsetY,
|
|
974
1029
|
rotation: e.core.state.rotation
|
|
@@ -976,47 +1031,54 @@ const Fn = ["aria-label"], $n = {
|
|
|
976
1031
|
e.core.motionActive.value
|
|
977
1032
|
);
|
|
978
1033
|
}
|
|
979
|
-
function
|
|
980
|
-
if (
|
|
981
|
-
return { image:
|
|
1034
|
+
function R() {
|
|
1035
|
+
if (o.value.status !== "ready") throw new Error("图片画面尚未就绪");
|
|
1036
|
+
return { image: o.value.value.motionSource, scale: 1 };
|
|
982
1037
|
}
|
|
983
1038
|
return n({
|
|
984
|
-
captureFrame:
|
|
1039
|
+
captureFrame: R,
|
|
985
1040
|
retainFrame: () => ({
|
|
986
|
-
...
|
|
987
|
-
release:
|
|
1041
|
+
...R(),
|
|
1042
|
+
release: w.retainDisplay()
|
|
988
1043
|
})
|
|
989
|
-
}), (
|
|
990
|
-
|
|
1044
|
+
}), (F, C) => (q(), _(Fe, null, [
|
|
1045
|
+
T("canvas", {
|
|
991
1046
|
ref_key: "canvasRef",
|
|
992
1047
|
ref: a,
|
|
993
1048
|
class: "mp-canvas-renderer",
|
|
994
|
-
"aria-label":
|
|
995
|
-
|
|
996
|
-
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1049
|
+
"aria-label": F.media.title,
|
|
1050
|
+
style: we({ visibility: l.value.kind === "gif" ? "hidden" : "inherit" })
|
|
1051
|
+
}, null, 12, In),
|
|
1052
|
+
l.value.kind === "gif" ? (q(), We(bn, {
|
|
1053
|
+
key: 0,
|
|
1054
|
+
core: F.core,
|
|
1055
|
+
src: l.value.url,
|
|
1056
|
+
title: F.media.title
|
|
1057
|
+
}, null, 8, ["core", "src", "title"])) : le("", !0),
|
|
1058
|
+
u.value === "loading" ? (q(), _("div", Dn, On)) : le("", !0),
|
|
1059
|
+
u.value === "error" ? (q(), _("div", An, [
|
|
1060
|
+
_n,
|
|
1061
|
+
T("button", {
|
|
1000
1062
|
type: "button",
|
|
1001
|
-
onClick:
|
|
1063
|
+
onClick: re(P, ["stop"])
|
|
1002
1064
|
}, "重新加载")
|
|
1003
1065
|
])) : le("", !0),
|
|
1004
|
-
|
|
1066
|
+
p.value && c.value !== "blocked" ? (q(), _("span", Vn, " 高清图加载失败,当前显示预览图 ")) : le("", !0)
|
|
1005
1067
|
], 64));
|
|
1006
1068
|
}
|
|
1007
1069
|
});
|
|
1008
|
-
function
|
|
1070
|
+
function Un(t, n, r) {
|
|
1009
1071
|
const { buffered: e } = t;
|
|
1010
1072
|
if (!Number.isFinite(n) || n <= 0) return [];
|
|
1011
1073
|
const i = [], a = Math.min(0.25, n * 0.05);
|
|
1012
|
-
for (let
|
|
1013
|
-
const
|
|
1014
|
-
let u =
|
|
1015
|
-
|
|
1074
|
+
for (let o = 0; o < e.length; o++) {
|
|
1075
|
+
const l = J(e.start(o), 0, n);
|
|
1076
|
+
let u = J(e.end(o), l, n);
|
|
1077
|
+
o === e.length - 1 && (t.ended || r.kind === "retained" && e.end(o) >= r.end || t.readyState >= 4 && n - u <= a) && (u = n), u > l && i.push({ start: l, end: u });
|
|
1016
1078
|
}
|
|
1017
1079
|
return i;
|
|
1018
1080
|
}
|
|
1019
|
-
function
|
|
1081
|
+
function _e(t) {
|
|
1020
1082
|
const n = Math.max(0, Math.floor(Number.isFinite(t) ? t : 0));
|
|
1021
1083
|
return `${String(Math.floor(n / 60)).padStart(2, "0")}:${String(n % 60).padStart(2, "0")}`;
|
|
1022
1084
|
}
|
|
@@ -1026,24 +1088,24 @@ function Mt(t) {
|
|
|
1026
1088
|
function St() {
|
|
1027
1089
|
return { duration: 0, time: 0, buffered: 0, bufferedRanges: [] };
|
|
1028
1090
|
}
|
|
1029
|
-
function
|
|
1091
|
+
function Yn() {
|
|
1030
1092
|
let t = 0, n = { kind: "pending" };
|
|
1031
1093
|
return {
|
|
1032
|
-
setDuration(
|
|
1033
|
-
t = Mt(
|
|
1094
|
+
setDuration(r) {
|
|
1095
|
+
t = Mt(r);
|
|
1034
1096
|
},
|
|
1035
|
-
complete(
|
|
1036
|
-
const { buffered: e } =
|
|
1097
|
+
complete(r) {
|
|
1098
|
+
const { buffered: e } = r;
|
|
1037
1099
|
n = e.length > 0 ? { kind: "retained", end: e.end(e.length - 1) } : { kind: "pending" };
|
|
1038
1100
|
},
|
|
1039
1101
|
reset() {
|
|
1040
1102
|
t = 0, n = { kind: "pending" };
|
|
1041
1103
|
},
|
|
1042
|
-
read(
|
|
1043
|
-
const i = t > 0 ? t : Mt(
|
|
1104
|
+
read(r, e) {
|
|
1105
|
+
const i = t > 0 ? t : Mt(r.duration), a = Un(r, i, n);
|
|
1044
1106
|
return {
|
|
1045
1107
|
duration: i,
|
|
1046
|
-
time: e ? i :
|
|
1108
|
+
time: e ? i : J(r.currentTime, 0, i),
|
|
1047
1109
|
buffered: a.length > 0 ? a[a.length - 1].end : 0,
|
|
1048
1110
|
bufferedRanges: a
|
|
1049
1111
|
};
|
|
@@ -1051,7 +1113,7 @@ function On() {
|
|
|
1051
1113
|
};
|
|
1052
1114
|
}
|
|
1053
1115
|
function qt(t, n) {
|
|
1054
|
-
const
|
|
1116
|
+
const r = Yn(), e = mt({
|
|
1055
1117
|
playing: !1,
|
|
1056
1118
|
buffering: !1,
|
|
1057
1119
|
...St(),
|
|
@@ -1061,23 +1123,23 @@ function qt(t, n) {
|
|
|
1061
1123
|
scrubTime: 0,
|
|
1062
1124
|
status: "loading"
|
|
1063
1125
|
});
|
|
1064
|
-
let i = !1, a = 0,
|
|
1065
|
-
const
|
|
1066
|
-
() =>
|
|
1067
|
-
),
|
|
1068
|
-
() => e.bufferedRanges.map(({ start:
|
|
1069
|
-
left:
|
|
1070
|
-
width: (
|
|
1126
|
+
let i = !1, a = 0, o = !1;
|
|
1127
|
+
const l = V(() => e.duration > 0 && e.status !== "error"), u = V(() => e.scrubbing ? e.scrubTime : e.time), p = V(() => l.value ? u.value / e.duration * 100 : 0), c = V(
|
|
1128
|
+
() => l.value ? e.buffered / e.duration * 100 : 0
|
|
1129
|
+
), x = V(
|
|
1130
|
+
() => e.bufferedRanges.map(({ start: C, end: D }) => ({
|
|
1131
|
+
left: C / e.duration * 100,
|
|
1132
|
+
width: (D - C) / e.duration * 100
|
|
1071
1133
|
}))
|
|
1072
1134
|
);
|
|
1073
|
-
function
|
|
1074
|
-
Object.assign(e,
|
|
1135
|
+
function L() {
|
|
1136
|
+
Object.assign(e, r.read(t(), e.ended));
|
|
1075
1137
|
}
|
|
1076
|
-
function
|
|
1077
|
-
|
|
1138
|
+
function S(C) {
|
|
1139
|
+
o || (r.setDuration(C), L(), e.scrubTime = J(e.scrubTime, 0, e.duration));
|
|
1078
1140
|
}
|
|
1079
|
-
function
|
|
1080
|
-
|
|
1141
|
+
function E() {
|
|
1142
|
+
r.reset(), i = !1, a += 1, Object.assign(e, {
|
|
1081
1143
|
playing: !1,
|
|
1082
1144
|
buffering: !1,
|
|
1083
1145
|
...St(),
|
|
@@ -1087,53 +1149,53 @@ function qt(t, n) {
|
|
|
1087
1149
|
status: "loading"
|
|
1088
1150
|
});
|
|
1089
1151
|
}
|
|
1090
|
-
async function
|
|
1091
|
-
if (
|
|
1092
|
-
const
|
|
1152
|
+
async function w() {
|
|
1153
|
+
if (o) return;
|
|
1154
|
+
const C = ++a;
|
|
1093
1155
|
e.ended && (t().currentTime = 0, e.time = 0), e.ended = !1, e.buffering = !0;
|
|
1094
1156
|
try {
|
|
1095
1157
|
await t().play();
|
|
1096
|
-
} catch (
|
|
1097
|
-
if (
|
|
1098
|
-
e.buffering = !1, e.playing = !1,
|
|
1158
|
+
} catch (D) {
|
|
1159
|
+
if (C !== a) return;
|
|
1160
|
+
e.buffering = !1, e.playing = !1, D instanceof Error && D.name !== "NotAllowedError" && D.name !== "AbortError" && n(D);
|
|
1099
1161
|
}
|
|
1100
1162
|
}
|
|
1101
|
-
function
|
|
1163
|
+
function g() {
|
|
1102
1164
|
a += 1, i = !1, e.scrubbing = !1, e.buffering = !1, t().pause();
|
|
1103
1165
|
}
|
|
1104
|
-
function
|
|
1105
|
-
e.playing ?
|
|
1166
|
+
function B() {
|
|
1167
|
+
e.playing ? g() : w();
|
|
1106
1168
|
}
|
|
1107
|
-
function
|
|
1108
|
-
!
|
|
1169
|
+
function O() {
|
|
1170
|
+
!l.value || e.scrubbing || (i = e.playing, e.scrubbing = !0, e.scrubTime = e.time, t().pause());
|
|
1109
1171
|
}
|
|
1110
|
-
function
|
|
1111
|
-
e.scrubTime =
|
|
1172
|
+
function h(C) {
|
|
1173
|
+
e.scrubTime = J(C, 0, e.duration);
|
|
1112
1174
|
}
|
|
1113
|
-
function k(
|
|
1175
|
+
function k(C = !0) {
|
|
1114
1176
|
if (!e.scrubbing) return;
|
|
1115
|
-
const
|
|
1116
|
-
i = !1, e.scrubbing = !1,
|
|
1177
|
+
const D = i;
|
|
1178
|
+
i = !1, e.scrubbing = !1, C && (t().currentTime = e.scrubTime, e.time = e.scrubTime, e.ended = !1), D && w();
|
|
1117
1179
|
}
|
|
1118
|
-
function
|
|
1180
|
+
function m() {
|
|
1119
1181
|
t().muted = !t().muted, e.muted = t().muted;
|
|
1120
1182
|
}
|
|
1121
|
-
function
|
|
1122
|
-
e.status = "error", e.playing = !1, e.buffering = !1, n(
|
|
1183
|
+
function y(C) {
|
|
1184
|
+
e.status = "error", e.playing = !1, e.buffering = !1, n(C);
|
|
1123
1185
|
}
|
|
1124
|
-
const
|
|
1186
|
+
const v = Object.fromEntries(
|
|
1125
1187
|
Object.entries({
|
|
1126
|
-
loadedmetadata:
|
|
1127
|
-
durationchange:
|
|
1128
|
-
timeupdate:
|
|
1129
|
-
progress:
|
|
1188
|
+
loadedmetadata: L,
|
|
1189
|
+
durationchange: L,
|
|
1190
|
+
timeupdate: L,
|
|
1191
|
+
progress: L,
|
|
1130
1192
|
loadeddata: () => {
|
|
1131
|
-
|
|
1193
|
+
L(), e.status = "ready", e.buffering = !1;
|
|
1132
1194
|
},
|
|
1133
1195
|
canplay: () => {
|
|
1134
|
-
|
|
1196
|
+
L(), e.buffering = !1;
|
|
1135
1197
|
},
|
|
1136
|
-
canplaythrough:
|
|
1198
|
+
canplaythrough: L,
|
|
1137
1199
|
play: () => {
|
|
1138
1200
|
e.playing = !0, e.ended = !1;
|
|
1139
1201
|
},
|
|
@@ -1144,7 +1206,7 @@ function qt(t, n) {
|
|
|
1144
1206
|
e.playing = !1, e.buffering = !1;
|
|
1145
1207
|
},
|
|
1146
1208
|
ended: () => {
|
|
1147
|
-
e.playing = !1, e.ended = !0, e.buffering = !1,
|
|
1209
|
+
e.playing = !1, e.ended = !0, e.buffering = !1, r.complete(t()), L();
|
|
1148
1210
|
},
|
|
1149
1211
|
waiting: () => {
|
|
1150
1212
|
e.buffering = e.playing;
|
|
@@ -1153,50 +1215,50 @@ function qt(t, n) {
|
|
|
1153
1215
|
e.buffering = !0;
|
|
1154
1216
|
},
|
|
1155
1217
|
seeked: () => {
|
|
1156
|
-
e.buffering = !1,
|
|
1218
|
+
e.buffering = !1, L();
|
|
1157
1219
|
},
|
|
1158
1220
|
volumechange: () => {
|
|
1159
1221
|
e.muted = t().muted;
|
|
1160
1222
|
},
|
|
1161
1223
|
error: () => {
|
|
1162
|
-
|
|
1224
|
+
y(new Error("视频暂时无法播放,请重试或检查资源格式"));
|
|
1163
1225
|
}
|
|
1164
|
-
}).map(([
|
|
1165
|
-
|
|
1226
|
+
}).map(([C, D]) => [
|
|
1227
|
+
C,
|
|
1166
1228
|
() => {
|
|
1167
|
-
|
|
1229
|
+
o || D();
|
|
1168
1230
|
}
|
|
1169
1231
|
])
|
|
1170
1232
|
);
|
|
1171
|
-
function
|
|
1172
|
-
|
|
1233
|
+
function R() {
|
|
1234
|
+
o = !0, g();
|
|
1173
1235
|
}
|
|
1174
|
-
function
|
|
1175
|
-
|
|
1236
|
+
function F() {
|
|
1237
|
+
E(), e.buffering = !0, t().load();
|
|
1176
1238
|
}
|
|
1177
1239
|
return {
|
|
1178
1240
|
state: e,
|
|
1179
|
-
seekable:
|
|
1241
|
+
seekable: l,
|
|
1180
1242
|
displayTime: u,
|
|
1181
1243
|
progress: p,
|
|
1182
|
-
bufferedProgress:
|
|
1183
|
-
bufferedRanges:
|
|
1184
|
-
events:
|
|
1185
|
-
play:
|
|
1186
|
-
pause:
|
|
1187
|
-
toggle:
|
|
1188
|
-
beginScrub:
|
|
1189
|
-
scrub:
|
|
1244
|
+
bufferedProgress: c,
|
|
1245
|
+
bufferedRanges: x,
|
|
1246
|
+
events: v,
|
|
1247
|
+
play: w,
|
|
1248
|
+
pause: g,
|
|
1249
|
+
toggle: B,
|
|
1250
|
+
beginScrub: O,
|
|
1251
|
+
scrub: h,
|
|
1190
1252
|
endScrub: k,
|
|
1191
|
-
toggleMuted:
|
|
1192
|
-
retry:
|
|
1193
|
-
setSourceDuration:
|
|
1194
|
-
resetSource:
|
|
1195
|
-
sourceObserver: { error:
|
|
1196
|
-
dispose:
|
|
1253
|
+
toggleMuted: m,
|
|
1254
|
+
retry: F,
|
|
1255
|
+
setSourceDuration: S,
|
|
1256
|
+
resetSource: E,
|
|
1257
|
+
sourceObserver: { error: y, duration: S, reset: E },
|
|
1258
|
+
dispose: R
|
|
1197
1259
|
};
|
|
1198
1260
|
}
|
|
1199
|
-
const
|
|
1261
|
+
const Xn = ["data-live-state"], Hn = { class: "mp-dom-renderer mp-live-photo__motion" }, Wn = ["preload"], Nn = /* @__PURE__ */ $e({
|
|
1200
1262
|
__name: "LivePhotoRenderer",
|
|
1201
1263
|
props: {
|
|
1202
1264
|
media: {},
|
|
@@ -1207,18 +1269,18 @@ const An = ["data-live-state"], Vn = { class: "mp-dom-renderer mp-live-photo__mo
|
|
|
1207
1269
|
requestVersion: { default: 0 },
|
|
1208
1270
|
loadEnabled: { type: Boolean, default: !0 },
|
|
1209
1271
|
priority: { default: 0 },
|
|
1210
|
-
resourcePolicy: { default: () =>
|
|
1272
|
+
resourcePolicy: { default: () => Ge },
|
|
1211
1273
|
resolveSource: { type: Function, default: Ke },
|
|
1212
1274
|
rendering: { type: Boolean, default: !0 },
|
|
1213
|
-
initialImage: { default: () =>
|
|
1275
|
+
initialImage: { default: () => Ce },
|
|
1214
1276
|
quality: { default: "screen" }
|
|
1215
1277
|
},
|
|
1216
1278
|
emits: ["ready", "error", "originalState", "liveState", "liveEnded"],
|
|
1217
|
-
setup(t, { expose: n, emit:
|
|
1218
|
-
const e = t, i =
|
|
1279
|
+
setup(t, { expose: n, emit: r }) {
|
|
1280
|
+
const e = t, i = r, a = $(), o = $(), l = $(), u = $(), p = qt(
|
|
1219
1281
|
() => a.value,
|
|
1220
|
-
(
|
|
1221
|
-
), { state:
|
|
1282
|
+
(m) => i("error", m)
|
|
1283
|
+
), { state: c } = p;
|
|
1222
1284
|
Tt(
|
|
1223
1285
|
() => a.value,
|
|
1224
1286
|
() => e.media,
|
|
@@ -1226,121 +1288,122 @@ const An = ["data-live-state"], Vn = { class: "mp-dom-renderer mp-live-photo__mo
|
|
|
1226
1288
|
() => it,
|
|
1227
1289
|
p.sourceObserver
|
|
1228
1290
|
);
|
|
1229
|
-
let
|
|
1291
|
+
let x = !1, L = () => {
|
|
1230
1292
|
};
|
|
1231
|
-
const
|
|
1232
|
-
() => e.active && e.enabled &&
|
|
1233
|
-
),
|
|
1293
|
+
const S = V(
|
|
1294
|
+
() => e.active && e.enabled && c.playing && c.status === "ready" && !c.buffering
|
|
1295
|
+
), E = V(() => ({
|
|
1234
1296
|
transform: `translate(-50%, -50%) translate3d(${e.core.state.offsetX}px, ${e.core.state.offsetY}px, 0)`
|
|
1235
|
-
})),
|
|
1297
|
+
})), w = V(() => ({
|
|
1236
1298
|
width: `${e.core.mediaSize.value.width * e.core.displayScale.value}px`,
|
|
1237
1299
|
height: `${e.core.mediaSize.value.height * e.core.displayScale.value}px`,
|
|
1238
1300
|
transform: `rotate(${e.core.state.rotation}deg)`
|
|
1239
1301
|
}));
|
|
1240
|
-
function
|
|
1302
|
+
function g() {
|
|
1241
1303
|
p.pause(), a.value.readyState >= HTMLMediaElement.HAVE_METADATA && (a.value.currentTime = 0);
|
|
1242
1304
|
}
|
|
1243
|
-
function
|
|
1244
|
-
!e.active || !e.enabled || !e.loadEnabled || !e.playing ||
|
|
1245
|
-
!
|
|
1305
|
+
function B() {
|
|
1306
|
+
!e.active || !e.enabled || !e.loadEnabled || !e.playing || c.status !== "ready" || c.buffering ? g() : p.play().then(() => {
|
|
1307
|
+
!x && !c.playing && e.playing && i("liveEnded");
|
|
1246
1308
|
});
|
|
1247
1309
|
}
|
|
1248
|
-
|
|
1249
|
-
() => [
|
|
1310
|
+
te(
|
|
1311
|
+
() => [c.status, c.playing, c.buffering],
|
|
1250
1312
|
() => {
|
|
1251
|
-
const
|
|
1252
|
-
i("liveState",
|
|
1313
|
+
const m = c.status === "error" ? "error" : c.buffering || c.status === "loading" ? "loading" : S.value ? "playing" : "idle";
|
|
1314
|
+
i("liveState", m);
|
|
1253
1315
|
},
|
|
1254
1316
|
{ immediate: !0 }
|
|
1255
1317
|
);
|
|
1256
|
-
function
|
|
1257
|
-
|
|
1318
|
+
function O() {
|
|
1319
|
+
x || (g(), i("liveEnded"));
|
|
1258
1320
|
}
|
|
1259
|
-
function
|
|
1260
|
-
document.hidden && (
|
|
1321
|
+
function h() {
|
|
1322
|
+
document.hidden && (g(), i("liveEnded"));
|
|
1261
1323
|
}
|
|
1262
1324
|
qe(() => {
|
|
1263
|
-
|
|
1325
|
+
L = te(() => [e.active, e.enabled, e.loadEnabled, e.playing], B, {
|
|
1264
1326
|
flush: "post"
|
|
1265
|
-
}),
|
|
1266
|
-
}),
|
|
1267
|
-
|
|
1327
|
+
}), B(), document.addEventListener("visibilitychange", h);
|
|
1328
|
+
}), Te(() => {
|
|
1329
|
+
L(), x = !0, p.dispose(), document.removeEventListener("visibilitychange", h);
|
|
1268
1330
|
});
|
|
1269
1331
|
function k() {
|
|
1270
|
-
const
|
|
1332
|
+
const m = document.createElement("canvas"), y = Math.min(
|
|
1271
1333
|
1,
|
|
1272
1334
|
Math.sqrt(ue.maxCanvasPixels / (e.media.width * e.media.height))
|
|
1273
1335
|
);
|
|
1274
|
-
|
|
1275
|
-
const
|
|
1276
|
-
|
|
1277
|
-
const
|
|
1278
|
-
return p.pause(), { image:
|
|
1336
|
+
m.width = Math.round(e.media.width * y), m.height = Math.round(e.media.height * y);
|
|
1337
|
+
const P = m.getContext("2d"), v = Number(getComputedStyle(l.value).opacity);
|
|
1338
|
+
P.drawImage(u.value.captureFrame().image, 0, 0, m.width, m.height), v < 1 && a.value.readyState >= HTMLMediaElement.HAVE_CURRENT_DATA && (P.globalAlpha = 1 - v, P.drawImage(a.value, 0, 0, m.width, m.height));
|
|
1339
|
+
const R = new DOMMatrixReadOnly(getComputedStyle(o.value).transform).a;
|
|
1340
|
+
return p.pause(), { image: m, scale: R };
|
|
1279
1341
|
}
|
|
1280
1342
|
return n({ captureFrame: k, retainFrame: () => ({ ...k(), release: () => {
|
|
1281
|
-
} }) }), (
|
|
1343
|
+
} }) }), (m, y) => (q(), _("div", {
|
|
1282
1344
|
class: "mp-live-photo-renderer",
|
|
1283
|
-
"data-live-state": f(
|
|
1345
|
+
"data-live-state": f(c).status === "error" ? "error" : S.value ? "playing" : "idle"
|
|
1284
1346
|
}, [
|
|
1285
|
-
|
|
1347
|
+
T("div", {
|
|
1286
1348
|
ref_key: "effectsRef",
|
|
1287
|
-
ref:
|
|
1288
|
-
class:
|
|
1349
|
+
ref: o,
|
|
1350
|
+
class: De(["mp-live-photo__effects", { "is-playing": S.value }])
|
|
1289
1351
|
}, [
|
|
1290
|
-
|
|
1291
|
-
|
|
1352
|
+
T("div", Hn, [
|
|
1353
|
+
T("div", {
|
|
1292
1354
|
class: "mp-dom-renderer__frame",
|
|
1293
|
-
style:
|
|
1355
|
+
style: we(E.value)
|
|
1294
1356
|
}, [
|
|
1295
|
-
|
|
1357
|
+
T("video", Ne({
|
|
1296
1358
|
ref_key: "videoRef",
|
|
1297
1359
|
ref: a,
|
|
1298
1360
|
class: "mp-dom-renderer__node",
|
|
1299
|
-
style:
|
|
1300
|
-
preload:
|
|
1361
|
+
style: w.value,
|
|
1362
|
+
preload: m.active && m.enabled && m.loadEnabled ? "auto" : "none",
|
|
1301
1363
|
playsinline: "",
|
|
1302
1364
|
"webkit-playsinline": "true",
|
|
1303
1365
|
crossorigin: "anonymous"
|
|
1304
|
-
},
|
|
1305
|
-
onEnded:
|
|
1306
|
-
onError:
|
|
1307
|
-
}), null, 16,
|
|
1366
|
+
}, gt(f(p).events, !0), {
|
|
1367
|
+
onEnded: O,
|
|
1368
|
+
onError: y[0] || (y[0] = (P) => i("liveEnded"))
|
|
1369
|
+
}), null, 16, Wn)
|
|
1308
1370
|
], 4)
|
|
1309
1371
|
]),
|
|
1310
|
-
|
|
1372
|
+
T("div", {
|
|
1311
1373
|
ref_key: "stillRef",
|
|
1312
|
-
ref:
|
|
1313
|
-
class:
|
|
1374
|
+
ref: l,
|
|
1375
|
+
class: De(["mp-live-photo__still", { "is-playing": S.value }])
|
|
1314
1376
|
}, [
|
|
1315
|
-
|
|
1377
|
+
Ie(pt, {
|
|
1316
1378
|
ref_key: "imageRendererRef",
|
|
1317
1379
|
ref: u,
|
|
1318
|
-
|
|
1319
|
-
"
|
|
1320
|
-
|
|
1321
|
-
|
|
1322
|
-
"
|
|
1323
|
-
|
|
1324
|
-
|
|
1325
|
-
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
|
|
1330
|
-
|
|
1331
|
-
|
|
1380
|
+
active: m.active,
|
|
1381
|
+
"request-version": m.requestVersion,
|
|
1382
|
+
"load-enabled": m.loadEnabled,
|
|
1383
|
+
priority: m.priority,
|
|
1384
|
+
"resource-policy": m.resourcePolicy,
|
|
1385
|
+
"resolve-source": m.resolveSource,
|
|
1386
|
+
onOriginalState: y[1] || (y[1] = (P, v) => i("originalState", P, v)),
|
|
1387
|
+
media: m.media,
|
|
1388
|
+
"initial-image": m.initialImage,
|
|
1389
|
+
rendering: m.rendering,
|
|
1390
|
+
core: m.core,
|
|
1391
|
+
quality: m.quality,
|
|
1392
|
+
onReady: y[2] || (y[2] = (P) => i("ready", P)),
|
|
1393
|
+
onError: y[3] || (y[3] = (P) => i("error", P))
|
|
1394
|
+
}, null, 8, ["active", "request-version", "load-enabled", "priority", "resource-policy", "resolve-source", "media", "initial-image", "rendering", "core", "quality"])
|
|
1332
1395
|
], 2)
|
|
1333
1396
|
], 2)
|
|
1334
|
-
], 8,
|
|
1397
|
+
], 8, Xn));
|
|
1335
1398
|
}
|
|
1336
1399
|
});
|
|
1337
|
-
function
|
|
1338
|
-
const
|
|
1339
|
-
|
|
1340
|
-
const i = Math.min(
|
|
1341
|
-
return
|
|
1400
|
+
function Zn(t, n) {
|
|
1401
|
+
const r = document.createElement("canvas"), e = Math.min(1, Math.sqrt(ue.maxCanvasPixels / (n.width * n.height)));
|
|
1402
|
+
r.width = Math.max(1, Math.round(n.width * e)), r.height = Math.max(1, Math.round(n.height * e));
|
|
1403
|
+
const i = Math.min(r.width / t.videoWidth, r.height / t.videoHeight), a = t.videoWidth * i, o = t.videoHeight * i;
|
|
1404
|
+
return r.getContext("2d").drawImage(t, (r.width - a) / 2, (r.height - o) / 2, a, o), t.pause(), r;
|
|
1342
1405
|
}
|
|
1343
|
-
const
|
|
1406
|
+
const jn = {
|
|
1344
1407
|
class: "mp-video-icon--generic",
|
|
1345
1408
|
width: "22",
|
|
1346
1409
|
height: "22",
|
|
@@ -1351,13 +1414,13 @@ const Xn = {
|
|
|
1351
1414
|
"stroke-linecap": "round",
|
|
1352
1415
|
"stroke-linejoin": "round",
|
|
1353
1416
|
"aria-hidden": "true"
|
|
1354
|
-
},
|
|
1417
|
+
}, Gn = ["d", "fill"], Kn = ["src"], Qn = ["src"], at = /* @__PURE__ */ $e({
|
|
1355
1418
|
__name: "VideoIcon",
|
|
1356
1419
|
props: {
|
|
1357
1420
|
name: {}
|
|
1358
1421
|
},
|
|
1359
1422
|
setup(t) {
|
|
1360
|
-
const n = t,
|
|
1423
|
+
const n = t, r = {
|
|
1361
1424
|
play: ["mobile-play", "pc-play"],
|
|
1362
1425
|
replay: ["mobile-play", "pc-play"],
|
|
1363
1426
|
pause: ["mobile-pause", "pc-pause"],
|
|
@@ -1381,38 +1444,38 @@ const Xn = {
|
|
|
1381
1444
|
volume: ["m11 4-6 5H2v6h3l6 5Z", "M15 8a6 6 0 0 1 0 8M18 5a10 10 0 0 1 0 14"],
|
|
1382
1445
|
muted: ["m11 4-6 5H2v6h3l6 5Z", "m16 9 6 6m0-6-6 6"]
|
|
1383
1446
|
};
|
|
1384
|
-
return (a,
|
|
1385
|
-
class:
|
|
1447
|
+
return (a, o) => (q(), _("span", {
|
|
1448
|
+
class: De(["mp-video-icon", { "has-album-icon": n.name in r }])
|
|
1386
1449
|
}, [
|
|
1387
|
-
(
|
|
1388
|
-
(
|
|
1450
|
+
(q(), _("svg", jn, [
|
|
1451
|
+
(q(!0), _(Fe, null, Ze(i[a.name], (l, u) => (q(), _("path", {
|
|
1389
1452
|
key: u,
|
|
1390
|
-
d:
|
|
1453
|
+
d: l,
|
|
1391
1454
|
fill: a.name === "play" ? "currentColor" : "none"
|
|
1392
|
-
}, null, 8,
|
|
1455
|
+
}, null, 8, Gn))), 128))
|
|
1393
1456
|
])),
|
|
1394
|
-
a.name in
|
|
1395
|
-
|
|
1457
|
+
a.name in r ? (q(), _(Fe, { key: 0 }, [
|
|
1458
|
+
T("img", {
|
|
1396
1459
|
class: "mp-video-icon--mobile",
|
|
1397
|
-
src: e[
|
|
1460
|
+
src: e[r[a.name][0]],
|
|
1398
1461
|
alt: "",
|
|
1399
1462
|
"aria-hidden": "true",
|
|
1400
1463
|
draggable: "false"
|
|
1401
|
-
}, null, 8,
|
|
1402
|
-
|
|
1464
|
+
}, null, 8, Kn),
|
|
1465
|
+
T("img", {
|
|
1403
1466
|
class: "mp-video-icon--desktop",
|
|
1404
|
-
src: e[
|
|
1467
|
+
src: e[r[a.name][1]],
|
|
1405
1468
|
alt: "",
|
|
1406
1469
|
"aria-hidden": "true",
|
|
1407
1470
|
draggable: "false"
|
|
1408
|
-
}, null, 8,
|
|
1471
|
+
}, null, 8, Qn)
|
|
1409
1472
|
], 64)) : le("", !0)
|
|
1410
1473
|
], 2));
|
|
1411
1474
|
}
|
|
1412
|
-
}),
|
|
1475
|
+
}), Jn = {
|
|
1413
1476
|
key: 0,
|
|
1414
1477
|
class: "mp-video-seek-preview"
|
|
1415
|
-
},
|
|
1478
|
+
}, ea = ["aria-label", "disabled"], ta = { class: "mp-video-time" }, na = ["tabindex", "aria-disabled", "aria-valuemax", "aria-valuenow", "aria-valuetext"], aa = /* @__PURE__ */ T("span", { class: "mp-video-progress__rail" }, null, -1), ia = { class: "mp-video-time" }, ra = ["aria-label", "aria-pressed"], oa = ["aria-label", "disabled"], la = /* @__PURE__ */ $e({
|
|
1416
1479
|
__name: "VideoControls",
|
|
1417
1480
|
props: {
|
|
1418
1481
|
playback: {},
|
|
@@ -1421,142 +1484,142 @@ const Xn = {
|
|
|
1421
1484
|
},
|
|
1422
1485
|
emits: ["fullscreen"],
|
|
1423
1486
|
setup(t, { emit: n }) {
|
|
1424
|
-
const
|
|
1425
|
-
function
|
|
1426
|
-
const
|
|
1427
|
-
|
|
1487
|
+
const r = t, e = n, i = $(), { state: a, seekable: o, displayTime: l, progress: u, bufferedRanges: p } = r.playback;
|
|
1488
|
+
function c(w) {
|
|
1489
|
+
const g = i.value.getBoundingClientRect();
|
|
1490
|
+
r.playback.scrub((w.clientX - g.left) / Math.max(1, g.width) * a.duration);
|
|
1428
1491
|
}
|
|
1429
|
-
function
|
|
1430
|
-
!
|
|
1492
|
+
function x(w) {
|
|
1493
|
+
!o.value || w.pointerType === "mouse" && w.button !== 0 || (i.value.setPointerCapture(w.pointerId), r.playback.beginScrub(), c(w));
|
|
1431
1494
|
}
|
|
1432
|
-
function
|
|
1433
|
-
a.scrubbing &&
|
|
1495
|
+
function L(w) {
|
|
1496
|
+
a.scrubbing && c(w);
|
|
1434
1497
|
}
|
|
1435
|
-
function
|
|
1436
|
-
a.scrubbing && (
|
|
1498
|
+
function S(w) {
|
|
1499
|
+
a.scrubbing && (c(w), r.playback.endScrub());
|
|
1437
1500
|
}
|
|
1438
|
-
function
|
|
1439
|
-
|
|
1501
|
+
function E(w) {
|
|
1502
|
+
r.playback.beginScrub(), r.playback.scrub(l.value + w), r.playback.endScrub();
|
|
1440
1503
|
}
|
|
1441
|
-
return (
|
|
1504
|
+
return (w, g) => (q(), _("div", {
|
|
1442
1505
|
class: "mp-video-controls",
|
|
1443
1506
|
"data-preview-control": "",
|
|
1444
|
-
onPointerdown:
|
|
1507
|
+
onPointerdown: g[9] || (g[9] = re(() => {
|
|
1445
1508
|
}, ["stop"])),
|
|
1446
|
-
onPointermove:
|
|
1509
|
+
onPointermove: g[10] || (g[10] = re(() => {
|
|
1447
1510
|
}, ["stop"])),
|
|
1448
|
-
onPointerup:
|
|
1511
|
+
onPointerup: g[11] || (g[11] = re(() => {
|
|
1449
1512
|
}, ["stop"])),
|
|
1450
|
-
onPointercancel:
|
|
1513
|
+
onPointercancel: g[12] || (g[12] = re(() => {
|
|
1451
1514
|
}, ["stop"])),
|
|
1452
|
-
onClick:
|
|
1515
|
+
onClick: g[13] || (g[13] = re(() => {
|
|
1453
1516
|
}, ["stop"])),
|
|
1454
|
-
onDblclick:
|
|
1517
|
+
onDblclick: g[14] || (g[14] = re(() => {
|
|
1455
1518
|
}, ["stop"])),
|
|
1456
|
-
onKeydown:
|
|
1519
|
+
onKeydown: g[15] || (g[15] = re(() => {
|
|
1457
1520
|
}, ["stop"]))
|
|
1458
1521
|
}, [
|
|
1459
|
-
f(a).scrubbing ? (
|
|
1460
|
-
|
|
1461
|
-
|
|
1522
|
+
f(a).scrubbing ? (q(), _("div", Jn, [
|
|
1523
|
+
Gt(ce(f(_e)(f(l))), 1),
|
|
1524
|
+
T("span", null, " / " + ce(f(_e)(f(a).duration)), 1)
|
|
1462
1525
|
])) : le("", !0),
|
|
1463
|
-
|
|
1526
|
+
T("button", {
|
|
1464
1527
|
type: "button",
|
|
1465
1528
|
"aria-label": f(a).ended ? "重新播放视频" : f(a).playing ? "暂停视频" : "播放视频",
|
|
1466
1529
|
disabled: f(a).status === "error",
|
|
1467
|
-
onClick:
|
|
1468
|
-
(...
|
|
1530
|
+
onClick: g[0] || (g[0] = //@ts-ignore
|
|
1531
|
+
(...B) => w.playback.toggle && w.playback.toggle(...B))
|
|
1469
1532
|
}, [
|
|
1470
|
-
|
|
1533
|
+
Ie(at, {
|
|
1471
1534
|
name: f(a).ended ? "replay" : f(a).playing ? "pause" : "play"
|
|
1472
1535
|
}, null, 8, ["name"])
|
|
1473
|
-
], 8,
|
|
1474
|
-
|
|
1475
|
-
|
|
1536
|
+
], 8, ea),
|
|
1537
|
+
T("time", ta, ce(f(_e)(f(l))), 1),
|
|
1538
|
+
T("div", {
|
|
1476
1539
|
ref_key: "track",
|
|
1477
1540
|
ref: i,
|
|
1478
|
-
class:
|
|
1541
|
+
class: De(["mp-video-progress", { "is-scrubbing": f(a).scrubbing }]),
|
|
1479
1542
|
role: "slider",
|
|
1480
1543
|
"aria-label": "视频进度",
|
|
1481
|
-
tabindex: f(
|
|
1482
|
-
"aria-disabled": !f(
|
|
1544
|
+
tabindex: f(o) ? 0 : -1,
|
|
1545
|
+
"aria-disabled": !f(o),
|
|
1483
1546
|
"aria-valuemin": "0",
|
|
1484
1547
|
"aria-valuemax": f(a).duration,
|
|
1485
|
-
"aria-valuenow": f(
|
|
1486
|
-
"aria-valuetext": `${f(
|
|
1487
|
-
onPointerdown:
|
|
1488
|
-
onPointermove:
|
|
1489
|
-
onPointerup:
|
|
1490
|
-
onPointercancel:
|
|
1491
|
-
onLostpointercapture:
|
|
1548
|
+
"aria-valuenow": f(l),
|
|
1549
|
+
"aria-valuetext": `${f(_e)(f(l))} / ${f(_e)(f(a).duration)}`,
|
|
1550
|
+
onPointerdown: re(x, ["prevent"]),
|
|
1551
|
+
onPointermove: re(L, ["prevent"]),
|
|
1552
|
+
onPointerup: re(S, ["prevent"]),
|
|
1553
|
+
onPointercancel: g[1] || (g[1] = (B) => w.playback.endScrub(!1)),
|
|
1554
|
+
onLostpointercapture: g[2] || (g[2] = (B) => w.playback.endScrub(!1)),
|
|
1492
1555
|
onKeydown: [
|
|
1493
|
-
|
|
1494
|
-
|
|
1495
|
-
|
|
1496
|
-
|
|
1556
|
+
g[3] || (g[3] = nt(re((B) => E(-5), ["prevent"]), ["left"])),
|
|
1557
|
+
g[4] || (g[4] = nt(re((B) => E(5), ["prevent"]), ["right"])),
|
|
1558
|
+
g[5] || (g[5] = nt(re((B) => E(-f(a).duration), ["prevent"]), ["home"])),
|
|
1559
|
+
g[6] || (g[6] = nt(re((B) => E(f(a).duration), ["prevent"]), ["end"]))
|
|
1497
1560
|
]
|
|
1498
1561
|
}, [
|
|
1499
|
-
|
|
1500
|
-
(
|
|
1501
|
-
key:
|
|
1562
|
+
aa,
|
|
1563
|
+
(q(!0), _(Fe, null, Ze(f(p), (B, O) => (q(), _("span", {
|
|
1564
|
+
key: O,
|
|
1502
1565
|
class: "mp-video-progress__buffered",
|
|
1503
|
-
style:
|
|
1566
|
+
style: we({ left: `${B.left}%`, width: `${B.width}%` })
|
|
1504
1567
|
}, null, 4))), 128)),
|
|
1505
|
-
|
|
1568
|
+
T("span", {
|
|
1506
1569
|
class: "mp-video-progress__played",
|
|
1507
|
-
style:
|
|
1570
|
+
style: we({ width: `${f(u)}%` })
|
|
1508
1571
|
}, null, 4),
|
|
1509
|
-
|
|
1572
|
+
T("span", {
|
|
1510
1573
|
class: "mp-video-progress__thumb",
|
|
1511
|
-
style:
|
|
1574
|
+
style: we({ left: `${f(u)}%` })
|
|
1512
1575
|
}, null, 4)
|
|
1513
|
-
], 42,
|
|
1514
|
-
|
|
1515
|
-
|
|
1576
|
+
], 42, na),
|
|
1577
|
+
T("time", ia, ce(f(_e)(f(a).duration)), 1),
|
|
1578
|
+
T("button", {
|
|
1516
1579
|
type: "button",
|
|
1517
1580
|
class: "mp-video-volume",
|
|
1518
1581
|
"aria-label": f(a).muted ? "开启声音" : "静音视频",
|
|
1519
1582
|
"aria-pressed": f(a).muted,
|
|
1520
|
-
onClick:
|
|
1521
|
-
(...
|
|
1583
|
+
onClick: g[7] || (g[7] = //@ts-ignore
|
|
1584
|
+
(...B) => w.playback.toggleMuted && w.playback.toggleMuted(...B))
|
|
1522
1585
|
}, [
|
|
1523
|
-
|
|
1586
|
+
Ie(at, {
|
|
1524
1587
|
name: f(a).muted ? "muted" : "volume"
|
|
1525
1588
|
}, null, 8, ["name"])
|
|
1526
|
-
], 8,
|
|
1527
|
-
|
|
1589
|
+
], 8, ra),
|
|
1590
|
+
T("button", {
|
|
1528
1591
|
type: "button",
|
|
1529
|
-
"aria-label":
|
|
1530
|
-
disabled: !
|
|
1531
|
-
onClick:
|
|
1592
|
+
"aria-label": w.fullscreen ? "退出视频全屏" : "视频全屏",
|
|
1593
|
+
disabled: !w.canFullscreen,
|
|
1594
|
+
onClick: g[8] || (g[8] = (B) => e("fullscreen"))
|
|
1532
1595
|
}, [
|
|
1533
|
-
|
|
1534
|
-
name:
|
|
1596
|
+
Ie(at, {
|
|
1597
|
+
name: w.fullscreen ? "exit" : "fullscreen"
|
|
1535
1598
|
}, null, 8, ["name"])
|
|
1536
|
-
], 8,
|
|
1599
|
+
], 8, oa)
|
|
1537
1600
|
], 32));
|
|
1538
1601
|
}
|
|
1539
|
-
}),
|
|
1602
|
+
}), sa = ["data-playback"], ua = ["muted", "loop", "preload"], ca = {
|
|
1540
1603
|
key: 1,
|
|
1541
1604
|
class: "mp-video-loading",
|
|
1542
1605
|
role: "status",
|
|
1543
1606
|
"aria-label": "视频缓冲中"
|
|
1544
|
-
},
|
|
1545
|
-
|
|
1546
|
-
],
|
|
1607
|
+
}, da = /* @__PURE__ */ T("span", { class: "mp-spinner" }, null, -1), fa = [
|
|
1608
|
+
da
|
|
1609
|
+
], ma = ["aria-label"], ga = {
|
|
1547
1610
|
key: 3,
|
|
1548
1611
|
class: "mp-video-error",
|
|
1549
1612
|
role: "alert"
|
|
1550
|
-
},
|
|
1613
|
+
}, pa = ["inert"], ha = /* @__PURE__ */ $e({
|
|
1551
1614
|
inheritAttrs: !1,
|
|
1552
1615
|
__name: "VideoDomRenderer",
|
|
1553
1616
|
props: {
|
|
1554
|
-
initialImage: { default: () =>
|
|
1617
|
+
initialImage: { default: () => Ce },
|
|
1555
1618
|
rendering: { type: Boolean, default: !0 },
|
|
1556
1619
|
quality: { default: "screen" },
|
|
1557
1620
|
requestVersion: { default: 0 },
|
|
1558
1621
|
priority: { default: 0 },
|
|
1559
|
-
resourcePolicy: { default: () =>
|
|
1622
|
+
resourcePolicy: { default: () => Ge },
|
|
1560
1623
|
resolveSource: { type: Function, default: Ke },
|
|
1561
1624
|
media: {},
|
|
1562
1625
|
videoLoader: { type: Function, default: it },
|
|
@@ -1573,157 +1636,158 @@ const Xn = {
|
|
|
1573
1636
|
controlsTarget: { default: "body" }
|
|
1574
1637
|
},
|
|
1575
1638
|
emits: ["originalState", "ready", "error"],
|
|
1576
|
-
setup(t, { expose: n, emit:
|
|
1577
|
-
const e = t, i =
|
|
1639
|
+
setup(t, { expose: n, emit: r }) {
|
|
1640
|
+
const e = t, i = r, a = $(!1), o = V(() => ({
|
|
1578
1641
|
...e.media,
|
|
1579
1642
|
type: "image",
|
|
1580
1643
|
src: e.media.poster || e.media.previewSrc || e.media.thumbnail
|
|
1581
|
-
})),
|
|
1582
|
-
() =>
|
|
1583
|
-
(
|
|
1644
|
+
})), l = $(), u = $(), p = $(!1), c = $(!1), x = qt(
|
|
1645
|
+
() => l.value,
|
|
1646
|
+
(v) => i("error", v)
|
|
1584
1647
|
);
|
|
1585
1648
|
Tt(
|
|
1586
|
-
() =>
|
|
1649
|
+
() => l.value,
|
|
1587
1650
|
() => e.media,
|
|
1588
1651
|
() => e.active && e.loadEnabled,
|
|
1589
1652
|
() => e.videoLoader,
|
|
1590
|
-
|
|
1653
|
+
x.sourceObserver
|
|
1591
1654
|
);
|
|
1592
|
-
let
|
|
1655
|
+
let L = () => {
|
|
1593
1656
|
};
|
|
1594
|
-
const { state:
|
|
1657
|
+
const { state: S } = x, E = V(
|
|
1595
1658
|
() => e.controls && e.active && e.enabled && e.controlsVisible
|
|
1596
1659
|
);
|
|
1597
|
-
function
|
|
1660
|
+
function w() {
|
|
1598
1661
|
return e.teleportControls ? u.value.closest(".mp-viewer") : e.core.containerRef.value;
|
|
1599
1662
|
}
|
|
1600
|
-
async function
|
|
1601
|
-
if (
|
|
1663
|
+
async function g() {
|
|
1664
|
+
if (c.value)
|
|
1602
1665
|
try {
|
|
1603
|
-
document.fullscreenElement ===
|
|
1604
|
-
} catch (
|
|
1605
|
-
i("error",
|
|
1666
|
+
document.fullscreenElement === w() ? await document.exitFullscreen() : document.fullscreenEnabled ? await w().requestFullscreen() : l.value.webkitEnterFullscreen();
|
|
1667
|
+
} catch (v) {
|
|
1668
|
+
i("error", Ve(v));
|
|
1606
1669
|
}
|
|
1607
1670
|
}
|
|
1608
|
-
function
|
|
1609
|
-
p.value = document.fullscreenElement ===
|
|
1671
|
+
function B() {
|
|
1672
|
+
p.value = document.fullscreenElement === w();
|
|
1610
1673
|
}
|
|
1611
|
-
function
|
|
1612
|
-
!e.active || !e.enabled ?
|
|
1674
|
+
function O() {
|
|
1675
|
+
!e.active || !e.enabled ? x.pause() : e.autoplay && x.play();
|
|
1613
1676
|
}
|
|
1614
|
-
function
|
|
1615
|
-
document.hidden &&
|
|
1677
|
+
function h() {
|
|
1678
|
+
document.hidden && x.pause();
|
|
1616
1679
|
}
|
|
1617
1680
|
qe(() => {
|
|
1618
|
-
|
|
1681
|
+
S.muted = l.value.muted, c.value = document.fullscreenEnabled || "webkitEnterFullscreen" in l.value, document.addEventListener("fullscreenchange", B), document.addEventListener("visibilitychange", h), L = te(() => [e.active, e.enabled, e.autoplay], O, {
|
|
1619
1682
|
flush: "post"
|
|
1620
|
-
}),
|
|
1621
|
-
}),
|
|
1622
|
-
|
|
1683
|
+
}), O();
|
|
1684
|
+
}), Te(() => {
|
|
1685
|
+
L(), x.dispose(), document.removeEventListener("fullscreenchange", B), document.removeEventListener("visibilitychange", h), document.fullscreenElement === w() && document.exitFullscreen().catch(() => {
|
|
1623
1686
|
});
|
|
1624
1687
|
});
|
|
1625
|
-
const k =
|
|
1688
|
+
const k = V(() => ({
|
|
1626
1689
|
transform: `translate(-50%, -50%) translate3d(${e.core.state.offsetX}px, ${e.core.state.offsetY}px, 0)`
|
|
1627
|
-
})),
|
|
1690
|
+
})), m = V(() => ({
|
|
1628
1691
|
width: `${e.core.mediaSize.value.width * e.core.displayScale.value}px`,
|
|
1629
1692
|
height: `${e.core.mediaSize.value.height * e.core.displayScale.value}px`,
|
|
1630
1693
|
transform: `rotate(${e.core.state.rotation}deg)`
|
|
1631
1694
|
}));
|
|
1632
|
-
function
|
|
1633
|
-
a.value = !0, e.core.setMediaElement(
|
|
1695
|
+
function y() {
|
|
1696
|
+
a.value = !0, e.core.setMediaElement(l.value), i("ready", "screen");
|
|
1634
1697
|
}
|
|
1635
|
-
function
|
|
1636
|
-
return { image: a.value ?
|
|
1698
|
+
function P() {
|
|
1699
|
+
return { image: a.value ? Zn(l.value, e.core.mediaSize.value) : e.core.mediaRef.value, scale: 1 };
|
|
1637
1700
|
}
|
|
1638
1701
|
return n({
|
|
1639
|
-
togglePlayback:
|
|
1640
|
-
toggleFullscreen:
|
|
1641
|
-
playback:
|
|
1642
|
-
captureFrame:
|
|
1643
|
-
retainFrame: () => ({ ...
|
|
1702
|
+
togglePlayback: x.toggle,
|
|
1703
|
+
toggleFullscreen: g,
|
|
1704
|
+
playback: x,
|
|
1705
|
+
captureFrame: P,
|
|
1706
|
+
retainFrame: () => ({ ...P(), release: () => {
|
|
1644
1707
|
} })
|
|
1645
|
-
}), (
|
|
1708
|
+
}), (v, R) => (q(), _("div", {
|
|
1646
1709
|
ref_key: "host",
|
|
1647
1710
|
ref: u,
|
|
1648
1711
|
class: "mp-dom-renderer mp-video-player",
|
|
1649
|
-
"data-playback": f(
|
|
1712
|
+
"data-playback": f(S).ended ? "ended" : f(S).playing ? "playing" : "paused"
|
|
1650
1713
|
}, [
|
|
1651
|
-
a.value ? le("", !0) : (
|
|
1714
|
+
a.value ? le("", !0) : (q(), We(pt, {
|
|
1652
1715
|
key: 0,
|
|
1653
|
-
|
|
1716
|
+
active: v.active,
|
|
1717
|
+
media: o.value,
|
|
1654
1718
|
"original-enabled": !1,
|
|
1655
|
-
core:
|
|
1656
|
-
"initial-image":
|
|
1657
|
-
rendering:
|
|
1658
|
-
quality:
|
|
1659
|
-
"request-version":
|
|
1660
|
-
"load-enabled":
|
|
1661
|
-
priority:
|
|
1662
|
-
"resource-policy":
|
|
1663
|
-
"resolve-source":
|
|
1664
|
-
onReady:
|
|
1665
|
-
onError:
|
|
1666
|
-
onOriginalState:
|
|
1667
|
-
}, null, 8, ["media", "core", "initial-image", "rendering", "quality", "request-version", "load-enabled", "priority", "resource-policy", "resolve-source"])),
|
|
1668
|
-
|
|
1719
|
+
core: v.core,
|
|
1720
|
+
"initial-image": v.initialImage,
|
|
1721
|
+
rendering: v.rendering,
|
|
1722
|
+
quality: v.quality,
|
|
1723
|
+
"request-version": v.requestVersion,
|
|
1724
|
+
"load-enabled": v.loadEnabled,
|
|
1725
|
+
priority: v.priority,
|
|
1726
|
+
"resource-policy": v.resourcePolicy,
|
|
1727
|
+
"resolve-source": v.resolveSource,
|
|
1728
|
+
onReady: R[0] || (R[0] = (F) => i("ready", F)),
|
|
1729
|
+
onError: R[1] || (R[1] = (F) => i("error", F)),
|
|
1730
|
+
onOriginalState: R[2] || (R[2] = (F, C) => i("originalState", F, C))
|
|
1731
|
+
}, null, 8, ["active", "media", "core", "initial-image", "rendering", "quality", "request-version", "load-enabled", "priority", "resource-policy", "resolve-source"])),
|
|
1732
|
+
T("div", {
|
|
1669
1733
|
class: "mp-dom-renderer__frame",
|
|
1670
|
-
style:
|
|
1734
|
+
style: we([k.value, { visibility: a.value ? "inherit" : "hidden" }])
|
|
1671
1735
|
}, [
|
|
1672
|
-
|
|
1736
|
+
T("video", Ne({
|
|
1673
1737
|
ref_key: "videoRef",
|
|
1674
|
-
ref:
|
|
1738
|
+
ref: l,
|
|
1675
1739
|
class: "mp-dom-renderer__node",
|
|
1676
|
-
muted:
|
|
1677
|
-
loop:
|
|
1740
|
+
muted: v.muted,
|
|
1741
|
+
loop: v.loop,
|
|
1678
1742
|
playsinline: "",
|
|
1679
1743
|
"webkit-playsinline": "true",
|
|
1680
1744
|
crossorigin: "anonymous",
|
|
1681
|
-
preload:
|
|
1682
|
-
style:
|
|
1683
|
-
},
|
|
1745
|
+
preload: v.active && v.loadEnabled ? "auto" : "none",
|
|
1746
|
+
style: m.value
|
|
1747
|
+
}, gt(f(x).events, !0), { onPlaying: y }), null, 16, ua)
|
|
1684
1748
|
], 4),
|
|
1685
|
-
|
|
1686
|
-
|
|
1749
|
+
v.active && v.enabled && f(S).buffering && f(S).status !== "error" ? (q(), _("div", ca, fa)) : le("", !0),
|
|
1750
|
+
E.value && !f(S).playing && !f(S).buffering && f(S).status !== "error" ? (q(), _("button", {
|
|
1687
1751
|
key: 2,
|
|
1688
1752
|
type: "button",
|
|
1689
1753
|
class: "mp-video-center-play",
|
|
1690
1754
|
"data-preview-control": "",
|
|
1691
|
-
"aria-label": f(
|
|
1692
|
-
onPointerdown:
|
|
1755
|
+
"aria-label": f(S).ended ? "重新播放" : "开始播放视频",
|
|
1756
|
+
onPointerdown: R[3] || (R[3] = re(() => {
|
|
1693
1757
|
}, ["stop"])),
|
|
1694
|
-
onPointerup:
|
|
1758
|
+
onPointerup: R[4] || (R[4] = re(() => {
|
|
1695
1759
|
}, ["stop"])),
|
|
1696
|
-
onClick:
|
|
1760
|
+
onClick: R[5] || (R[5] = re(
|
|
1697
1761
|
//@ts-ignore
|
|
1698
|
-
(
|
|
1762
|
+
(...F) => f(x).toggle && f(x).toggle(...F),
|
|
1699
1763
|
["stop"]
|
|
1700
1764
|
))
|
|
1701
1765
|
}, [
|
|
1702
|
-
|
|
1703
|
-
name: f(
|
|
1766
|
+
Ie(at, {
|
|
1767
|
+
name: f(S).ended ? "replay" : "play"
|
|
1704
1768
|
}, null, 8, ["name"])
|
|
1705
|
-
], 40,
|
|
1706
|
-
f(
|
|
1707
|
-
|
|
1769
|
+
], 40, ma)) : le("", !0),
|
|
1770
|
+
f(S).status === "error" ? (q(), _("div", ga, "视频暂时无法播放")) : le("", !0),
|
|
1771
|
+
v.controls && v.active && v.enabled ? (q(), We(Ct, {
|
|
1708
1772
|
key: 4,
|
|
1709
|
-
to:
|
|
1710
|
-
disabled: !
|
|
1773
|
+
to: v.controlsTarget,
|
|
1774
|
+
disabled: !v.teleportControls
|
|
1711
1775
|
}, [
|
|
1712
|
-
|
|
1713
|
-
class:
|
|
1714
|
-
inert: !
|
|
1776
|
+
T("div", {
|
|
1777
|
+
class: De(["mp-video-control-layer", { "is-hidden": !E.value }]),
|
|
1778
|
+
inert: !E.value
|
|
1715
1779
|
}, [
|
|
1716
|
-
|
|
1717
|
-
playback: f(
|
|
1780
|
+
Ie(la, {
|
|
1781
|
+
playback: f(x),
|
|
1718
1782
|
fullscreen: p.value,
|
|
1719
|
-
"can-fullscreen":
|
|
1720
|
-
onFullscreen:
|
|
1783
|
+
"can-fullscreen": c.value,
|
|
1784
|
+
onFullscreen: g
|
|
1721
1785
|
}, null, 8, ["playback", "fullscreen", "can-fullscreen"])
|
|
1722
|
-
], 10,
|
|
1786
|
+
], 10, pa)
|
|
1723
1787
|
], 8, ["to", "disabled"])) : le("", !0)
|
|
1724
|
-
], 8,
|
|
1788
|
+
], 8, sa));
|
|
1725
1789
|
}
|
|
1726
|
-
}),
|
|
1790
|
+
}), va = ["data-scale", "data-rotation", "data-live-holding"], ya = /* @__PURE__ */ $e({
|
|
1727
1791
|
__name: "PreviewStage",
|
|
1728
1792
|
props: {
|
|
1729
1793
|
media: {},
|
|
@@ -1732,7 +1796,7 @@ const Xn = {
|
|
|
1732
1796
|
active: { type: Boolean, default: !0 },
|
|
1733
1797
|
requestVersion: { default: 0 },
|
|
1734
1798
|
loadEnabled: { type: Boolean, default: !0 },
|
|
1735
|
-
resourcePolicy: { default: () =>
|
|
1799
|
+
resourcePolicy: { default: () => Ge },
|
|
1736
1800
|
resolveSource: { type: Function, default: Ke },
|
|
1737
1801
|
inactiveResetDuration: { default: 0 },
|
|
1738
1802
|
disabled: { type: Boolean, default: !1 },
|
|
@@ -1742,17 +1806,17 @@ const Xn = {
|
|
|
1742
1806
|
controlsTarget: { default: "body" },
|
|
1743
1807
|
rendering: { type: Boolean, default: !0 },
|
|
1744
1808
|
paging: { type: Boolean, default: !1 },
|
|
1745
|
-
initialImage: { default: () =>
|
|
1809
|
+
initialImage: { default: () => Ce },
|
|
1746
1810
|
quality: { default: "screen" }
|
|
1747
1811
|
},
|
|
1748
1812
|
emits: ["tap", "doubleTap", "scale", "swipeDownProgress", "close", "previous", "next", "pageDrag", "pageRelease", "ready", "error", "originalState", "liveState", "liveEnded"],
|
|
1749
|
-
setup(t, { expose: n, emit:
|
|
1750
|
-
const e = t, i =
|
|
1813
|
+
setup(t, { expose: n, emit: r }) {
|
|
1814
|
+
const e = t, i = r, a = $(!1), o = $("loading"), l = pn({
|
|
1751
1815
|
motionActive: () => e.paging,
|
|
1752
1816
|
interactive: () => e.active && !e.disabled,
|
|
1753
1817
|
zoomable: () => !0,
|
|
1754
|
-
doubleTapZoom: () =>
|
|
1755
|
-
holdable: () => e.media.type === "live-photo" &&
|
|
1818
|
+
doubleTapZoom: () => Bn(e.media, l.core.viewportSize.value),
|
|
1819
|
+
holdable: () => e.media.type === "live-photo" && x.value === "ready" && o.value === "idle",
|
|
1756
1820
|
onHoldStart: () => {
|
|
1757
1821
|
a.value = !0;
|
|
1758
1822
|
},
|
|
@@ -1761,25 +1825,25 @@ const Xn = {
|
|
|
1761
1825
|
},
|
|
1762
1826
|
onTap: () => i("tap"),
|
|
1763
1827
|
onDoubleTap: () => i("doubleTap"),
|
|
1764
|
-
onScale: (
|
|
1765
|
-
e.active && i("scale",
|
|
1828
|
+
onScale: (h) => {
|
|
1829
|
+
e.active && i("scale", h);
|
|
1766
1830
|
},
|
|
1767
|
-
onSwipeDownProgress: (
|
|
1768
|
-
e.active && i("swipeDownProgress",
|
|
1831
|
+
onSwipeDownProgress: (h) => {
|
|
1832
|
+
e.active && i("swipeDownProgress", h);
|
|
1769
1833
|
},
|
|
1770
1834
|
onSwipeDownClose: () => i("close"),
|
|
1771
1835
|
onSwipeLeft: () => i("next"),
|
|
1772
1836
|
onSwipeRight: () => i("previous"),
|
|
1773
|
-
onPageDrag: (
|
|
1774
|
-
e.active && i("pageDrag",
|
|
1837
|
+
onPageDrag: (h) => {
|
|
1838
|
+
e.active && i("pageDrag", h);
|
|
1775
1839
|
},
|
|
1776
|
-
onPageRelease: (
|
|
1777
|
-
}), u =
|
|
1778
|
-
() => e.media.type === "video" ?
|
|
1779
|
-
),
|
|
1780
|
-
() =>
|
|
1840
|
+
onPageRelease: (h, k) => i("pageRelease", h, k)
|
|
1841
|
+
}), u = l.core.containerRef, p = l.core.downDragStyle, c = l.core.state, x = $("loading"), L = $("thumbnail"), S = $(), E = V(
|
|
1842
|
+
() => e.media.type === "video" ? ha : e.media.type === "live-photo" ? Nn : pt
|
|
1843
|
+
), w = V(
|
|
1844
|
+
() => L.value === "full" || e.quality === "full" ? "full" : e.quality
|
|
1781
1845
|
);
|
|
1782
|
-
|
|
1846
|
+
te(
|
|
1783
1847
|
[
|
|
1784
1848
|
() => e.media.id,
|
|
1785
1849
|
() => e.media.src,
|
|
@@ -1787,191 +1851,191 @@ const Xn = {
|
|
|
1787
1851
|
() => e.media.thumbnail
|
|
1788
1852
|
],
|
|
1789
1853
|
() => {
|
|
1790
|
-
|
|
1854
|
+
L.value = "thumbnail";
|
|
1791
1855
|
}
|
|
1792
|
-
),
|
|
1856
|
+
), te(
|
|
1793
1857
|
() => e.media.id,
|
|
1794
1858
|
() => {
|
|
1795
|
-
|
|
1859
|
+
x.value = "loading", l.core.setRotation(0);
|
|
1796
1860
|
}
|
|
1797
|
-
),
|
|
1861
|
+
), te(
|
|
1798
1862
|
[() => e.media.width, () => e.media.height],
|
|
1799
|
-
([
|
|
1800
|
-
|
|
1863
|
+
([h, k]) => {
|
|
1864
|
+
l.core.setMediaSize({ width: h, height: k });
|
|
1801
1865
|
},
|
|
1802
1866
|
{ immediate: !0 }
|
|
1803
|
-
),
|
|
1867
|
+
), te(
|
|
1804
1868
|
() => e.active,
|
|
1805
|
-
(
|
|
1806
|
-
|
|
1869
|
+
(h) => {
|
|
1870
|
+
h || l.core.resetTransform(e.inactiveResetDuration);
|
|
1807
1871
|
}
|
|
1808
|
-
),
|
|
1872
|
+
), te(
|
|
1809
1873
|
() => e.disabled,
|
|
1810
|
-
(
|
|
1811
|
-
|
|
1874
|
+
(h) => {
|
|
1875
|
+
h && l.core.cancelGesture(!0);
|
|
1812
1876
|
}
|
|
1813
1877
|
);
|
|
1814
|
-
function
|
|
1815
|
-
|
|
1878
|
+
function g(h) {
|
|
1879
|
+
h === "full" && (L.value = h), x.value = "ready", i("ready", h);
|
|
1816
1880
|
}
|
|
1817
|
-
function
|
|
1818
|
-
|
|
1881
|
+
function B(h) {
|
|
1882
|
+
o.value = h, i("liveState", h);
|
|
1819
1883
|
}
|
|
1820
|
-
const
|
|
1884
|
+
const O = V(
|
|
1821
1885
|
() => e.externalGestures ? {} : {
|
|
1822
|
-
wheel:
|
|
1823
|
-
pointerdown:
|
|
1824
|
-
pointermove:
|
|
1825
|
-
pointerup:
|
|
1826
|
-
pointercancel:
|
|
1827
|
-
lostpointercapture:
|
|
1886
|
+
wheel: l.onWheel,
|
|
1887
|
+
pointerdown: l.onPointerDown,
|
|
1888
|
+
pointermove: l.onPointerMove,
|
|
1889
|
+
pointerup: l.onPointerUp,
|
|
1890
|
+
pointercancel: l.onPointerCancel,
|
|
1891
|
+
lostpointercapture: l.onPointerCancel
|
|
1828
1892
|
}
|
|
1829
1893
|
);
|
|
1830
1894
|
return n({
|
|
1831
|
-
onPointerDown:
|
|
1832
|
-
onPointerMove:
|
|
1833
|
-
onPointerUp:
|
|
1834
|
-
onPointerCancel:
|
|
1835
|
-
onWheel:
|
|
1836
|
-
readiness:
|
|
1837
|
-
core:
|
|
1838
|
-
rotateBy:
|
|
1839
|
-
resetTransform:
|
|
1840
|
-
zoomIn: () =>
|
|
1841
|
-
zoomOut: () =>
|
|
1842
|
-
togglePlayback: () =>
|
|
1843
|
-
toggleFullscreen: () =>
|
|
1844
|
-
captureFrame: () =>
|
|
1845
|
-
retainFrame: () =>
|
|
1846
|
-
}), (
|
|
1895
|
+
onPointerDown: l.onPointerDown,
|
|
1896
|
+
onPointerMove: l.onPointerMove,
|
|
1897
|
+
onPointerUp: l.onPointerUp,
|
|
1898
|
+
onPointerCancel: l.onPointerCancel,
|
|
1899
|
+
onWheel: l.onWheel,
|
|
1900
|
+
readiness: x,
|
|
1901
|
+
core: l.core,
|
|
1902
|
+
rotateBy: l.core.rotateBy,
|
|
1903
|
+
resetTransform: l.core.resetTransform,
|
|
1904
|
+
zoomIn: () => l.core.zoomTo(c.level * 1.5, void 0, !0),
|
|
1905
|
+
zoomOut: () => l.core.zoomTo(c.level / 1.5, void 0, !0),
|
|
1906
|
+
togglePlayback: () => S.value.togglePlayback(),
|
|
1907
|
+
toggleFullscreen: () => S.value.toggleFullscreen(),
|
|
1908
|
+
captureFrame: () => S.value.captureFrame(),
|
|
1909
|
+
retainFrame: () => S.value.retainFrame()
|
|
1910
|
+
}), (h, k) => (q(), _("div", Ne({
|
|
1847
1911
|
ref_key: "containerRef",
|
|
1848
1912
|
ref: u,
|
|
1849
|
-
class: ["mp-stage", { "is-zoomed": f(
|
|
1913
|
+
class: ["mp-stage", { "is-zoomed": f(c).level > 1, "is-dismissing": f(c).draggingDown }],
|
|
1850
1914
|
style: f(p),
|
|
1851
|
-
"data-scale": f(
|
|
1852
|
-
"data-rotation": f(
|
|
1915
|
+
"data-scale": f(c).level.toFixed(3),
|
|
1916
|
+
"data-rotation": f(c).rotation,
|
|
1853
1917
|
"data-live-holding": a.value,
|
|
1854
|
-
onContextmenu: k[3] || (k[3] = (
|
|
1855
|
-
|
|
1918
|
+
onContextmenu: k[3] || (k[3] = (m) => {
|
|
1919
|
+
h.media.type === "live-photo" && m.preventDefault();
|
|
1856
1920
|
})
|
|
1857
|
-
},
|
|
1858
|
-
(
|
|
1921
|
+
}, gt(O.value, !0)), [
|
|
1922
|
+
(q(), We(Kt(E.value), Ne({
|
|
1859
1923
|
ref_key: "rendererRef",
|
|
1860
|
-
ref:
|
|
1861
|
-
media:
|
|
1862
|
-
},
|
|
1863
|
-
"initial-image":
|
|
1864
|
-
rendering:
|
|
1865
|
-
core: f(
|
|
1866
|
-
quality:
|
|
1867
|
-
"request-version":
|
|
1868
|
-
"load-enabled":
|
|
1869
|
-
priority:
|
|
1870
|
-
"resource-policy":
|
|
1871
|
-
"resolve-source":
|
|
1872
|
-
playing: (
|
|
1873
|
-
enabled: !
|
|
1874
|
-
"controls-visible":
|
|
1875
|
-
"teleport-controls":
|
|
1876
|
-
"controls-target":
|
|
1877
|
-
active:
|
|
1878
|
-
onReady:
|
|
1879
|
-
onError: k[0] || (k[0] = (
|
|
1880
|
-
onOriginalState: k[1] || (k[1] = (
|
|
1881
|
-
onLiveState:
|
|
1882
|
-
onLiveEnded: k[2] || (k[2] = (
|
|
1924
|
+
ref: S,
|
|
1925
|
+
media: h.media
|
|
1926
|
+
}, h.media.type === "video" ? { videoLoader: h.videoLoader } : {}, {
|
|
1927
|
+
"initial-image": h.initialImage,
|
|
1928
|
+
rendering: h.rendering,
|
|
1929
|
+
core: f(l).core,
|
|
1930
|
+
quality: w.value,
|
|
1931
|
+
"request-version": h.requestVersion,
|
|
1932
|
+
"load-enabled": h.loadEnabled,
|
|
1933
|
+
priority: h.active ? 0 : 2,
|
|
1934
|
+
"resource-policy": h.resourcePolicy,
|
|
1935
|
+
"resolve-source": h.resolveSource,
|
|
1936
|
+
playing: (h.livePlaying || a.value) && h.active,
|
|
1937
|
+
enabled: !h.disabled,
|
|
1938
|
+
"controls-visible": h.controlsVisible,
|
|
1939
|
+
"teleport-controls": h.teleportControls,
|
|
1940
|
+
"controls-target": h.controlsTarget,
|
|
1941
|
+
active: h.active,
|
|
1942
|
+
onReady: g,
|
|
1943
|
+
onError: k[0] || (k[0] = (m) => i("error", m)),
|
|
1944
|
+
onOriginalState: k[1] || (k[1] = (m, y) => i("originalState", m, y)),
|
|
1945
|
+
onLiveState: B,
|
|
1946
|
+
onLiveEnded: k[2] || (k[2] = (m) => i("liveEnded"))
|
|
1883
1947
|
}), null, 16, ["media", "initial-image", "rendering", "core", "quality", "request-version", "load-enabled", "priority", "resource-policy", "resolve-source", "playing", "enabled", "controls-visible", "teleport-controls", "controls-target", "active"]))
|
|
1884
|
-
], 16,
|
|
1948
|
+
], 16, va));
|
|
1885
1949
|
}
|
|
1886
1950
|
});
|
|
1887
|
-
function
|
|
1888
|
-
const
|
|
1889
|
-
function
|
|
1890
|
-
|
|
1951
|
+
function wa(t, n) {
|
|
1952
|
+
const r = $(/* @__PURE__ */ new Set()), e = $("idle"), i = $(""), a = $(0), o = $("");
|
|
1953
|
+
function l() {
|
|
1954
|
+
o.value = "", e.value = "idle", i.value = "", a.value = 0;
|
|
1891
1955
|
}
|
|
1892
1956
|
function u() {
|
|
1893
|
-
e.value !== "ready" && (e.value = "loading", i.value = "", a.value++,
|
|
1957
|
+
e.value !== "ready" && (e.value = "loading", i.value = "", a.value++, r.value = /* @__PURE__ */ new Set([...r.value, t().id]));
|
|
1894
1958
|
}
|
|
1895
|
-
function p(
|
|
1896
|
-
e.value =
|
|
1959
|
+
function p(c, x) {
|
|
1960
|
+
e.value = c, i.value = x, n(t(), c, x);
|
|
1897
1961
|
}
|
|
1898
1962
|
return {
|
|
1899
|
-
originalIds:
|
|
1963
|
+
originalIds: r,
|
|
1900
1964
|
originalStatus: e,
|
|
1901
1965
|
originalReason: i,
|
|
1902
1966
|
originalRequest: a,
|
|
1903
|
-
readyId:
|
|
1904
|
-
reset:
|
|
1967
|
+
readyId: o,
|
|
1968
|
+
reset: l,
|
|
1905
1969
|
requestOriginal: u,
|
|
1906
1970
|
updateOriginal: p
|
|
1907
1971
|
};
|
|
1908
1972
|
}
|
|
1909
|
-
function
|
|
1910
|
-
const i =
|
|
1973
|
+
function ba(t, n, r, e = {}) {
|
|
1974
|
+
const i = $(0), a = mt({
|
|
1911
1975
|
offset: 0,
|
|
1912
1976
|
dragging: !1,
|
|
1913
1977
|
settling: !1,
|
|
1914
1978
|
preparing: !1,
|
|
1915
1979
|
grabbed: !1,
|
|
1916
1980
|
duration: 360
|
|
1917
|
-
}),
|
|
1918
|
-
}, ...e },
|
|
1919
|
-
() => [i.value - 1, i.value, i.value + 1].filter((
|
|
1981
|
+
}), o = { readOffset: () => a.offset, flushLayout: () => {
|
|
1982
|
+
}, ...e }, l = 16, u = () => n() + l, p = V(
|
|
1983
|
+
() => [i.value - 1, i.value, i.value + 1].filter((P) => P >= 0 && P < t())
|
|
1920
1984
|
);
|
|
1921
|
-
let
|
|
1922
|
-
}, 0),
|
|
1923
|
-
},
|
|
1924
|
-
function
|
|
1925
|
-
|
|
1926
|
-
}
|
|
1927
|
-
|
|
1928
|
-
function
|
|
1985
|
+
let c = setTimeout(() => {
|
|
1986
|
+
}, 0), x = () => {
|
|
1987
|
+
}, L = 0, S = 0;
|
|
1988
|
+
function E() {
|
|
1989
|
+
L += 1, clearTimeout(c), x(), a.settling = !1, a.preparing = !1;
|
|
1990
|
+
}
|
|
1991
|
+
Te(E);
|
|
1992
|
+
function w() {
|
|
1929
1993
|
if (!a.settling && !a.preparing) return;
|
|
1930
|
-
const
|
|
1931
|
-
|
|
1994
|
+
const P = a.preparing ? a.offset : o.readOffset();
|
|
1995
|
+
E(), a.offset = P, a.grabbed = !0;
|
|
1932
1996
|
}
|
|
1933
|
-
function
|
|
1934
|
-
if (
|
|
1935
|
-
|
|
1997
|
+
function g(P) {
|
|
1998
|
+
if (P === 0) {
|
|
1999
|
+
E(), a.dragging = !1, a.grabbed = !1, a.offset = 0, S = 0;
|
|
1936
2000
|
return;
|
|
1937
2001
|
}
|
|
1938
|
-
a.dragging || (
|
|
1939
|
-
const
|
|
1940
|
-
a.offset =
|
|
1941
|
-
}
|
|
1942
|
-
async function
|
|
1943
|
-
|
|
1944
|
-
const
|
|
1945
|
-
a.offset += (
|
|
1946
|
-
const
|
|
1947
|
-
a.duration = matchMedia("(prefers-reduced-motion: reduce)").matches ? 0 :
|
|
1948
|
-
|
|
1949
|
-
}),
|
|
2002
|
+
a.dragging || (w(), S = a.offset, E(), a.dragging = !0, a.grabbed = !0);
|
|
2003
|
+
const v = S + P, R = i.value === 0 && v > 0 || i.value === t() - 1 && v < 0;
|
|
2004
|
+
a.offset = R ? Math.sign(v) * Math.sqrt(Math.abs(v)) * 6 : v;
|
|
2005
|
+
}
|
|
2006
|
+
async function B(P, v = 0) {
|
|
2007
|
+
E();
|
|
2008
|
+
const R = L, F = i.value;
|
|
2009
|
+
a.offset += (P - F) * u();
|
|
2010
|
+
const C = Math.abs(a.offset), D = J(C / u(), 0, 1), A = J(220 + D * 140 - Math.min(Math.abs(v), 2) * 35, 240, 360);
|
|
2011
|
+
a.duration = matchMedia("(prefers-reduced-motion: reduce)").matches ? 0 : A, i.value = P, a.dragging = !1, a.grabbed = !1, a.preparing = !0, P !== F && r(P), await Se(), R === L && (o.flushLayout(), a.preparing = !1, a.settling = !0, a.offset = 0, await new Promise((Z) => {
|
|
2012
|
+
x = Z, c = setTimeout(Z, a.duration);
|
|
2013
|
+
}), R === L && (a.settling = !1, x = () => {
|
|
1950
2014
|
}));
|
|
1951
2015
|
}
|
|
1952
|
-
function
|
|
1953
|
-
const
|
|
1954
|
-
|
|
2016
|
+
function O(P, v) {
|
|
2017
|
+
const R = a.offset, F = Math.abs(v) > 0.35 && Math.abs(P) > 16, C = Math.sign(F ? v : R), D = F || Math.abs(R) > n() * 0.14;
|
|
2018
|
+
B(J(i.value - (D ? C : 0), 0, t() - 1), v);
|
|
1955
2019
|
}
|
|
1956
|
-
function
|
|
1957
|
-
a.grabbed && !a.dragging &&
|
|
2020
|
+
function h() {
|
|
2021
|
+
a.grabbed && !a.dragging && B(i.value);
|
|
1958
2022
|
}
|
|
1959
|
-
function k(
|
|
2023
|
+
function k(P) {
|
|
1960
2024
|
if (a.dragging) return;
|
|
1961
|
-
|
|
1962
|
-
const
|
|
1963
|
-
|
|
2025
|
+
w();
|
|
2026
|
+
const v = J(i.value + P, 0, t() - 1);
|
|
2027
|
+
v !== i.value ? B(v) : h();
|
|
1964
2028
|
}
|
|
1965
|
-
function
|
|
1966
|
-
|
|
2029
|
+
function m(P) {
|
|
2030
|
+
E(), i.value = P, a.offset = 0, a.dragging = !1, a.grabbed = !1;
|
|
1967
2031
|
}
|
|
1968
|
-
function
|
|
1969
|
-
i.value =
|
|
2032
|
+
function y(P) {
|
|
2033
|
+
i.value = P;
|
|
1970
2034
|
}
|
|
1971
|
-
return { index: i, state: a, slots: p, stride: u, drag:
|
|
2035
|
+
return { index: i, state: a, slots: p, stride: u, drag: g, release: O, go: k, grab: w, resume: h, reset: m, rebase: y, cancel: E };
|
|
1972
2036
|
}
|
|
1973
|
-
function Ot(t, n,
|
|
1974
|
-
const e = Math[
|
|
2037
|
+
function Ot(t, n, r) {
|
|
2038
|
+
const e = Math[r === "cover" ? "max" : "min"](
|
|
1975
2039
|
n.width / t.width,
|
|
1976
2040
|
n.height / t.height
|
|
1977
2041
|
);
|
|
@@ -1985,8 +2049,8 @@ function Ot(t, n, o) {
|
|
|
1985
2049
|
radius: 0
|
|
1986
2050
|
};
|
|
1987
2051
|
}
|
|
1988
|
-
function
|
|
1989
|
-
const e = (i, a) => i + (a - i) *
|
|
2052
|
+
function ka(t, n, r) {
|
|
2053
|
+
const e = (i, a) => i + (a - i) * r;
|
|
1990
2054
|
return {
|
|
1991
2055
|
x: e(t.x, n.x),
|
|
1992
2056
|
y: e(t.y, n.y),
|
|
@@ -2003,136 +2067,136 @@ function ha(t, n, o) {
|
|
|
2003
2067
|
};
|
|
2004
2068
|
}
|
|
2005
2069
|
function Pt(t) {
|
|
2006
|
-
const n = t.rotation * Math.PI / 180,
|
|
2070
|
+
const n = t.rotation * Math.PI / 180, r = Math.abs(Math.cos(n)) * t.width + Math.abs(Math.sin(n)) * t.height, e = Math.abs(Math.sin(n)) * t.width + Math.abs(Math.cos(n)) * t.height, i = Math.max(t.x - r / 2, t.clip.left), a = Math.max(t.y - e / 2, t.clip.top);
|
|
2007
2071
|
return {
|
|
2008
2072
|
left: i,
|
|
2009
2073
|
top: a,
|
|
2010
|
-
width: Math.max(0, Math.min(t.x +
|
|
2074
|
+
width: Math.max(0, Math.min(t.x + r / 2, t.clip.left + t.clip.width) - i),
|
|
2011
2075
|
height: Math.max(0, Math.min(t.y + e / 2, t.clip.top + t.clip.height) - a)
|
|
2012
2076
|
};
|
|
2013
2077
|
}
|
|
2014
|
-
function
|
|
2015
|
-
const a = Pt(t),
|
|
2016
|
-
width: Math.max(a.width,
|
|
2017
|
-
height: Math.max(a.height,
|
|
2018
|
-
}, p = 128,
|
|
2019
|
-
for (let
|
|
2020
|
-
const
|
|
2021
|
-
let
|
|
2078
|
+
function xa(t, n, r, e, i) {
|
|
2079
|
+
const a = Pt(t), o = Pt(n), l = Math.min(a.width / o.width, a.height / o.height), u = {
|
|
2080
|
+
width: Math.max(a.width, o.width, 1),
|
|
2081
|
+
height: Math.max(a.height, o.height, 1)
|
|
2082
|
+
}, p = 128, c = [], x = [];
|
|
2083
|
+
for (let L = 0; L <= p; L += 1) {
|
|
2084
|
+
const S = L / p, E = ka(t, n, S);
|
|
2085
|
+
let w;
|
|
2022
2086
|
if (i)
|
|
2023
|
-
|
|
2024
|
-
left: a.left + (
|
|
2025
|
-
top: a.top + (
|
|
2026
|
-
width: a.width + (
|
|
2027
|
-
height: a.height + (
|
|
2087
|
+
w = {
|
|
2088
|
+
left: a.left + (o.left - a.left) * S,
|
|
2089
|
+
top: a.top + (o.top - a.top) * S,
|
|
2090
|
+
width: a.width + (o.width - a.width) * S,
|
|
2091
|
+
height: a.height + (o.height - a.height) * S
|
|
2028
2092
|
};
|
|
2029
2093
|
else {
|
|
2030
|
-
const
|
|
2031
|
-
|
|
2032
|
-
left: a.left + a.width / 2 + (
|
|
2033
|
-
top: a.top + a.height / 2 + (
|
|
2034
|
-
width:
|
|
2035
|
-
height:
|
|
2094
|
+
const O = Math.min(S / 0.78, 1), h = 1 - O * O * O * (O * (O * 6 - 15) + 10), k = l + (1 - l) * S, m = o.width * k + (a.width - o.width * l) * h, y = o.height * k + (a.height - o.height * l) * h;
|
|
2095
|
+
w = {
|
|
2096
|
+
left: a.left + a.width / 2 + (o.left + o.width / 2 - a.left - a.width / 2) * S - m / 2,
|
|
2097
|
+
top: a.top + a.height / 2 + (o.top + o.height / 2 - a.top - a.height / 2) * S - y / 2,
|
|
2098
|
+
width: m,
|
|
2099
|
+
height: y
|
|
2036
2100
|
};
|
|
2037
2101
|
}
|
|
2038
|
-
const
|
|
2039
|
-
|
|
2040
|
-
transform: `scale(${1 /
|
|
2041
|
-
offset:
|
|
2042
|
-
}),
|
|
2043
|
-
transform: `translate3d(${
|
|
2044
|
-
...t.radius === 0 && n.radius === 0 ? {} : { borderRadius: `${
|
|
2045
|
-
offset:
|
|
2102
|
+
const g = Math.max(w.width, 1e-3) / u.width, B = Math.max(w.height, 1e-3) / u.height;
|
|
2103
|
+
c.push({
|
|
2104
|
+
transform: `scale(${1 / g},${1 / B}) translate3d(${E.x - w.left}px,${E.y - w.top}px,0) rotate(${E.rotation}deg) scale(${E.width / e.width}) translate3d(${-e.width / 2}px,${-e.height / 2}px,0)`,
|
|
2105
|
+
offset: S
|
|
2106
|
+
}), x.push({
|
|
2107
|
+
transform: `translate3d(${w.left - r.left}px,${w.top - r.top}px,0) scale(${g},${B})`,
|
|
2108
|
+
...t.radius === 0 && n.radius === 0 ? {} : { borderRadius: `${E.radius / g}px / ${E.radius / B}px` },
|
|
2109
|
+
offset: S
|
|
2046
2110
|
});
|
|
2047
2111
|
}
|
|
2048
|
-
return { pictures:
|
|
2112
|
+
return { pictures: c, masks: x, maskSize: u };
|
|
2049
2113
|
}
|
|
2050
|
-
function
|
|
2114
|
+
function Ma() {
|
|
2051
2115
|
let t = { kind: "idle" };
|
|
2052
2116
|
function n() {
|
|
2053
2117
|
t.kind === "playing" && t.animations.forEach((i) => i.cancel()), t = { kind: "idle" };
|
|
2054
2118
|
}
|
|
2055
|
-
function
|
|
2119
|
+
function r() {
|
|
2056
2120
|
return t.kind !== "playing" || !t.entering ? { kind: "inactive" } : (t.entering = !1, t.animations.forEach((i) => i.reverse()), t.finished = Promise.all(t.animations.map((i) => i.finished)).then(() => {
|
|
2057
2121
|
}).catch(() => {
|
|
2058
2122
|
}), { kind: "reversing", finished: t.finished });
|
|
2059
2123
|
}
|
|
2060
|
-
async function e(i, a,
|
|
2124
|
+
async function e(i, a, o, l, u, p, c, x, L = x ? 0 : 1, S = 340) {
|
|
2061
2125
|
n();
|
|
2062
|
-
const
|
|
2126
|
+
const E = Math.max(l.width, u.width), w = E * u.height / u.width, g = Math.min(
|
|
2063
2127
|
devicePixelRatio,
|
|
2064
2128
|
2,
|
|
2065
|
-
Math.sqrt(ue.maxCanvasPixels / (
|
|
2129
|
+
Math.sqrt(ue.maxCanvasPixels / (E * w))
|
|
2066
2130
|
);
|
|
2067
|
-
i.width = Math.max(1, Math.round(
|
|
2068
|
-
const
|
|
2069
|
-
((
|
|
2070
|
-
|
|
2071
|
-
})(
|
|
2072
|
-
const
|
|
2073
|
-
a.style.width = `${
|
|
2074
|
-
const
|
|
2075
|
-
duration: matchMedia("(prefers-reduced-motion: reduce)").matches ? 0 : Math.max(0,
|
|
2131
|
+
i.width = Math.max(1, Math.round(E * g)), i.height = Math.max(1, Math.round(w * g)), i.style.width = `${E}px`, i.style.height = `${w}px`;
|
|
2132
|
+
const B = i.getContext("2d");
|
|
2133
|
+
((v) => {
|
|
2134
|
+
B.clearRect(0, 0, i.width, i.height), B.imageSmoothingEnabled = !0, B.imageSmoothingQuality = "high", B.drawImage(v, 0, 0, i.width, i.height);
|
|
2135
|
+
})(o);
|
|
2136
|
+
const h = xa(l, u, p, { width: E, height: w }, x);
|
|
2137
|
+
a.style.width = `${h.maskSize.width}px`, a.style.height = `${h.maskSize.height}px`, a.style.borderRadius = "0";
|
|
2138
|
+
const m = {
|
|
2139
|
+
duration: matchMedia("(prefers-reduced-motion: reduce)").matches ? 0 : Math.max(0, S),
|
|
2076
2140
|
easing: "cubic-bezier(.2,.78,.2,1)",
|
|
2077
2141
|
fill: "both"
|
|
2078
|
-
},
|
|
2079
|
-
i.animate(
|
|
2080
|
-
a.animate(
|
|
2081
|
-
|
|
2082
|
-
],
|
|
2142
|
+
}, y = [
|
|
2143
|
+
i.animate(h.pictures, m),
|
|
2144
|
+
a.animate(h.masks, m),
|
|
2145
|
+
c.animate([{ opacity: L }, { opacity: x ? 1 : 0 }], m)
|
|
2146
|
+
], P = Promise.all(y.map((v) => v.finished)).then(() => {
|
|
2083
2147
|
}).catch(() => {
|
|
2084
2148
|
});
|
|
2085
|
-
t = { kind: "playing", entering:
|
|
2149
|
+
t = { kind: "playing", entering: x, animations: y, finished: P }, await P;
|
|
2086
2150
|
}
|
|
2087
|
-
return { play: e, cancel: n, reverseOpening:
|
|
2151
|
+
return { play: e, cancel: n, reverseOpening: r };
|
|
2088
2152
|
}
|
|
2089
2153
|
function At(t, n) {
|
|
2090
|
-
const
|
|
2154
|
+
const r = Math.max(t.left, n.left), e = Math.max(t.top, n.top);
|
|
2091
2155
|
return {
|
|
2092
|
-
left:
|
|
2156
|
+
left: r,
|
|
2093
2157
|
top: e,
|
|
2094
|
-
width: Math.max(0, Math.min(t.left + t.width, n.left + n.width) -
|
|
2158
|
+
width: Math.max(0, Math.min(t.left + t.width, n.left + n.width) - r),
|
|
2095
2159
|
height: Math.max(0, Math.min(t.top + t.height, n.top + n.height) - e)
|
|
2096
2160
|
};
|
|
2097
2161
|
}
|
|
2098
|
-
function
|
|
2099
|
-
let
|
|
2162
|
+
function Sa(t, n) {
|
|
2163
|
+
let r = { ...n };
|
|
2100
2164
|
const e = /^(auto|scroll|overlay)$/;
|
|
2101
2165
|
for (let i = t.parentElement; i !== document.documentElement; i = i.parentElement) {
|
|
2102
|
-
const a = getComputedStyle(i),
|
|
2103
|
-
if (!
|
|
2166
|
+
const a = getComputedStyle(i), o = e.test(a.overflowX), l = e.test(a.overflowY);
|
|
2167
|
+
if (!o && !l) continue;
|
|
2104
2168
|
const u = i.getBoundingClientRect(), p = Number(i.style.getPropertyValue("--mp-transition-inset-top"));
|
|
2105
|
-
|
|
2106
|
-
left:
|
|
2107
|
-
top:
|
|
2108
|
-
width:
|
|
2109
|
-
height:
|
|
2169
|
+
r = At(r, {
|
|
2170
|
+
left: o ? u.left : r.left,
|
|
2171
|
+
top: l ? u.top + p : r.top,
|
|
2172
|
+
width: o ? u.width : r.width,
|
|
2173
|
+
height: l ? Math.max(0, u.height - p) : r.height
|
|
2110
2174
|
});
|
|
2111
2175
|
}
|
|
2112
|
-
return
|
|
2176
|
+
return r;
|
|
2113
2177
|
}
|
|
2114
|
-
function Rt(t, n,
|
|
2178
|
+
function Rt(t, n, r) {
|
|
2115
2179
|
if (t.kind === "unavailable") return t;
|
|
2116
2180
|
const e = Ot(n, t.element.getBoundingClientRect(), "cover");
|
|
2117
|
-
return e.clip = At(e.clip,
|
|
2181
|
+
return e.clip = At(e.clip, Sa(t.element, r)), e.clip.width <= 0 || e.clip.height <= 0 ? { kind: "unavailable" } : (e.radius = parseFloat(getComputedStyle(t.element).borderTopLeftRadius) || 0, { kind: "element", element: t.element, frame: e, viewport: r });
|
|
2118
2182
|
}
|
|
2119
|
-
const
|
|
2183
|
+
const Pa = ["aria-label", "data-phase", "data-chrome", "inert"], Ra = ["aria-hidden", "inert", "data-media-id"], Ea = {
|
|
2120
2184
|
key: 0,
|
|
2121
2185
|
class: "mp-resource-state mp-viewer__loading mp-viewer__pages",
|
|
2122
2186
|
role: "status",
|
|
2123
2187
|
"aria-label": "加载中"
|
|
2124
|
-
},
|
|
2188
|
+
}, Ca = /* @__PURE__ */ T("span", {
|
|
2125
2189
|
class: "mp-spinner",
|
|
2126
2190
|
"aria-hidden": "true"
|
|
2127
|
-
}, null, -1),
|
|
2128
|
-
|
|
2129
|
-
],
|
|
2191
|
+
}, null, -1), La = [
|
|
2192
|
+
Ca
|
|
2193
|
+
], $a = ["inert"], Fa = { class: "mp-viewer__toolbar" }, Ta = { class: "mp-viewer__title" }, Ba = ["disabled"], za = { class: "mp-viewer__footer" }, Ia = {
|
|
2130
2194
|
class: "mp-viewer__counter",
|
|
2131
2195
|
"aria-live": "polite"
|
|
2132
|
-
},
|
|
2196
|
+
}, Da = {
|
|
2133
2197
|
key: 1,
|
|
2134
2198
|
class: "mp-viewer__detail"
|
|
2135
|
-
},
|
|
2199
|
+
}, Ya = /* @__PURE__ */ $e({
|
|
2136
2200
|
inheritAttrs: !1,
|
|
2137
2201
|
__name: "MediaPreview",
|
|
2138
2202
|
props: {
|
|
@@ -2143,7 +2207,7 @@ const ba = ["aria-label", "data-phase", "data-chrome", "inert"], ka = ["aria-hid
|
|
|
2143
2207
|
gesturesEnabled: { type: Boolean, default: !0 },
|
|
2144
2208
|
persistentChrome: { type: Boolean, default: !1 },
|
|
2145
2209
|
videoLoader: { type: Function, default: it },
|
|
2146
|
-
resourcePolicy: { default: () =>
|
|
2210
|
+
resourcePolicy: { default: () => Ge },
|
|
2147
2211
|
resolveImageSource: { type: Function, default: Ke },
|
|
2148
2212
|
hasMore: { type: Boolean, default: !1 },
|
|
2149
2213
|
appearance: { default: "dark" },
|
|
@@ -2152,141 +2216,141 @@ const ba = ["aria-label", "data-phase", "data-chrome", "inert"], ka = ["aria-hid
|
|
|
2152
2216
|
resolveAnchor: { type: Function, default: () => ({ kind: "unavailable" }) }
|
|
2153
2217
|
},
|
|
2154
2218
|
emits: ["open", "opened", "ready", "closing", "close", "change", "error", "originalState", "loadMore", "phaseChange", "chromeChange"],
|
|
2155
|
-
setup(t, { expose: n, emit:
|
|
2156
|
-
const e = Qt(), i = t, a =
|
|
2157
|
-
|
|
2158
|
-
const
|
|
2159
|
-
() =>
|
|
2219
|
+
setup(t, { expose: n, emit: r }) {
|
|
2220
|
+
const e = Qt(), i = t, a = r, o = $("closed");
|
|
2221
|
+
te(o, (s) => a("phaseChange", s), { flush: "sync" });
|
|
2222
|
+
const l = `mp-video-controls-${Jt().uid}`, u = $(), p = $(), c = wa(
|
|
2223
|
+
() => Y.value,
|
|
2160
2224
|
(s, b, M) => a("originalState", s, b, M)
|
|
2161
|
-
), { originalIds:
|
|
2162
|
-
let
|
|
2163
|
-
const
|
|
2164
|
-
|
|
2165
|
-
const
|
|
2166
|
-
let
|
|
2167
|
-
const
|
|
2168
|
-
function
|
|
2225
|
+
), { originalIds: x, originalStatus: L, originalReason: S, originalRequest: E, readyId: w } = c;
|
|
2226
|
+
let g = "", B = -1;
|
|
2227
|
+
const O = $(), h = $(), k = $(), m = $(!1), y = $(0), P = $(!0);
|
|
2228
|
+
te(P, (s) => a("chromeChange", s), { flush: "sync" });
|
|
2229
|
+
const v = $(!1), R = $("loading"), F = $(1), C = $(!1), D = $(1), A = $(!1), Z = $(!1), K = ft(Ce);
|
|
2230
|
+
let be = "", ne = { kind: "unavailable" };
|
|
2231
|
+
const me = /* @__PURE__ */ new Map(), oe = /* @__PURE__ */ new Map();
|
|
2232
|
+
function Pe(s) {
|
|
2169
2233
|
return (b) => {
|
|
2170
|
-
|
|
2234
|
+
oe.set(s, b);
|
|
2171
2235
|
};
|
|
2172
2236
|
}
|
|
2173
|
-
function
|
|
2237
|
+
function ee(s) {
|
|
2174
2238
|
return (b) => {
|
|
2175
|
-
|
|
2239
|
+
me.set(s, b);
|
|
2176
2240
|
};
|
|
2177
2241
|
}
|
|
2178
|
-
const
|
|
2242
|
+
const I = ba(
|
|
2179
2243
|
() => i.items.length,
|
|
2180
|
-
() =>
|
|
2244
|
+
() => D.value,
|
|
2181
2245
|
(s) => {
|
|
2182
|
-
|
|
2246
|
+
g = i.items[s].id, c.reset(), F.value = 1, v.value = !1, R.value = "loading", a("change", s), Ae(s);
|
|
2183
2247
|
},
|
|
2184
2248
|
{
|
|
2185
|
-
readOffset: () => new DOMMatrixReadOnly(getComputedStyle(
|
|
2249
|
+
readOffset: () => new DOMMatrixReadOnly(getComputedStyle(oe.get(g)).transform).m41,
|
|
2186
2250
|
flushLayout: () => {
|
|
2187
|
-
|
|
2251
|
+
oe.get(g).getBoundingClientRect();
|
|
2188
2252
|
}
|
|
2189
2253
|
}
|
|
2190
|
-
),
|
|
2191
|
-
() =>
|
|
2254
|
+
), U = I.index, Y = V(() => i.items[U.value]), Oe = I.slots, Qe = V(
|
|
2255
|
+
() => o.value === "opening" || m.value ? [U.value] : Oe.value
|
|
2192
2256
|
);
|
|
2193
|
-
|
|
2194
|
-
|
|
2257
|
+
te(Oe, () => {
|
|
2258
|
+
Se(() => {
|
|
2195
2259
|
const s = new Set(Oe.value.map((b) => i.items[b].id));
|
|
2260
|
+
for (const b of me.keys()) s.has(b) || me.delete(b);
|
|
2196
2261
|
for (const b of oe.keys()) s.has(b) || oe.delete(b);
|
|
2197
|
-
for (const b of se.keys()) s.has(b) || se.delete(b);
|
|
2198
2262
|
});
|
|
2199
2263
|
});
|
|
2200
|
-
const
|
|
2264
|
+
const ae = {
|
|
2201
2265
|
close: N,
|
|
2202
2266
|
setChromeVisible: (s) => {
|
|
2203
|
-
|
|
2267
|
+
P.value = s;
|
|
2204
2268
|
},
|
|
2205
2269
|
goTo: lt,
|
|
2206
|
-
previous: () =>
|
|
2207
|
-
next: () =>
|
|
2270
|
+
previous: () => I.go(-1),
|
|
2271
|
+
next: () => I.go(1),
|
|
2208
2272
|
rotate: (s = 90) => W().rotateBy(s),
|
|
2209
2273
|
reset: () => W().resetTransform(),
|
|
2210
2274
|
zoomIn: () => W().zoomIn(),
|
|
2211
2275
|
zoomOut: () => W().zoomOut(),
|
|
2212
|
-
original:
|
|
2213
|
-
fullscreen:
|
|
2276
|
+
original: c.requestOriginal,
|
|
2277
|
+
fullscreen: Me,
|
|
2214
2278
|
togglePlayback: () => W().togglePlayback(),
|
|
2215
2279
|
toggleLive: () => {
|
|
2216
|
-
|
|
2280
|
+
o.value !== "open" || R.value === "loading" || R.value === "error" || (v.value = !v.value);
|
|
2217
2281
|
},
|
|
2218
2282
|
toggleDetail: () => {
|
|
2219
|
-
|
|
2283
|
+
C.value = !C.value;
|
|
2220
2284
|
}
|
|
2221
|
-
},
|
|
2222
|
-
let
|
|
2223
|
-
},
|
|
2224
|
-
},
|
|
2225
|
-
const
|
|
2226
|
-
const s = `${p.value.clientWidth}:${p.value.clientHeight}`, b = `${u.value.clientWidth}:${u.value.clientHeight}`, M =
|
|
2227
|
-
|
|
2285
|
+
}, ge = Ma(), de = nn();
|
|
2286
|
+
let ke = Promise.resolve(), pe = () => {
|
|
2287
|
+
}, G = 0, xe = "", se = !1, fe = "", he = "", Re = () => {
|
|
2288
|
+
}, ve = { kind: "idle" }, Be = 0;
|
|
2289
|
+
const Ee = () => new Promise((s) => requestAnimationFrame(() => s())), ze = new ResizeObserver(() => {
|
|
2290
|
+
const s = `${p.value.clientWidth}:${p.value.clientHeight}`, b = `${u.value.clientWidth}:${u.value.clientHeight}`, M = fe !== "" && fe !== s, H = he !== "" && he !== b;
|
|
2291
|
+
fe = s, he = b, D.value = p.value.clientWidth, M && o.value === "open" && I.reset(U.value), H && ge.cancel();
|
|
2228
2292
|
});
|
|
2229
2293
|
function Ae(s) {
|
|
2230
|
-
i.hasMore && s >= i.items.length - 3 &&
|
|
2294
|
+
i.hasMore && s >= i.items.length - 3 && B !== i.items.length && (B = i.items.length, a("loadMore", s));
|
|
2231
2295
|
}
|
|
2232
|
-
function
|
|
2233
|
-
s ===
|
|
2296
|
+
function rt(s, b) {
|
|
2297
|
+
s === U.value && (Z.value && (w.value = Y.value.id), a("ready", s, b));
|
|
2234
2298
|
}
|
|
2235
|
-
function
|
|
2236
|
-
s ===
|
|
2299
|
+
function ot(s, b, M) {
|
|
2300
|
+
s === U.value && c.updateOriginal(b, M);
|
|
2237
2301
|
}
|
|
2238
|
-
|
|
2302
|
+
te(
|
|
2239
2303
|
() => i.items.map((s) => s.id),
|
|
2240
2304
|
(s) => {
|
|
2241
|
-
if (
|
|
2305
|
+
if (o.value === "closed") return;
|
|
2242
2306
|
if (s.length === 0) {
|
|
2243
|
-
|
|
2307
|
+
G++, ge.cancel(), pe(), de.clear(), I.cancel(), Be++, ve.kind === "active" && ve.animation.cancel(), ze.disconnect(), fe = "", he = "", Re(), a("closing"), o.value = "closed", K.value = Ce, me.clear(), oe.clear(), document.body.style.overflow = xe, a("close");
|
|
2244
2308
|
return;
|
|
2245
2309
|
}
|
|
2246
|
-
const b = s.indexOf(
|
|
2247
|
-
(M !==
|
|
2310
|
+
const b = s.indexOf(g), M = b >= 0 ? b : Math.min(U.value, s.length - 1);
|
|
2311
|
+
(M !== U.value || b < 0) && (b >= 0 ? I.rebase(M) : (I.reset(M), g = s[M], c.reset(), F.value = 1, v.value = !1, a("change", M))), Ae(M);
|
|
2248
2312
|
},
|
|
2249
2313
|
{ flush: "sync" }
|
|
2250
2314
|
);
|
|
2251
2315
|
function lt(s) {
|
|
2252
2316
|
if (!Number.isInteger(s) || s < 0 || s >= i.items.length)
|
|
2253
2317
|
throw new RangeError("无效的预览下标");
|
|
2254
|
-
if (!(
|
|
2255
|
-
if (Math.abs(s -
|
|
2256
|
-
|
|
2318
|
+
if (!(o.value !== "open" || s === U.value)) {
|
|
2319
|
+
if (Math.abs(s - U.value) === 1) {
|
|
2320
|
+
I.go(s - U.value);
|
|
2257
2321
|
return;
|
|
2258
2322
|
}
|
|
2259
|
-
|
|
2323
|
+
I.reset(s), g = i.items[s].id, c.reset(), F.value = 1, v.value = !1, R.value = "loading", a("change", s), Ae(s);
|
|
2260
2324
|
}
|
|
2261
2325
|
}
|
|
2262
2326
|
function st() {
|
|
2263
|
-
i.persistentChrome || (
|
|
2327
|
+
i.persistentChrome || (P.value = !P.value);
|
|
2264
2328
|
}
|
|
2265
2329
|
function W() {
|
|
2266
|
-
return
|
|
2330
|
+
return me.get(g);
|
|
2267
2331
|
}
|
|
2268
|
-
function
|
|
2269
|
-
|
|
2332
|
+
function Ue(s) {
|
|
2333
|
+
Re();
|
|
2270
2334
|
const b = s.element.classList.contains("mp-transition-source");
|
|
2271
|
-
s.element.classList.add("mp-transition-source"),
|
|
2335
|
+
s.element.classList.add("mp-transition-source"), Re = () => {
|
|
2272
2336
|
s.element.classList.toggle("mp-transition-source", b);
|
|
2273
2337
|
};
|
|
2274
2338
|
}
|
|
2275
|
-
function
|
|
2339
|
+
function d() {
|
|
2276
2340
|
const s = u.value.getBoundingClientRect();
|
|
2277
2341
|
return { left: s.left, top: s.top, width: s.width, height: s.height };
|
|
2278
2342
|
}
|
|
2279
|
-
function
|
|
2343
|
+
function z() {
|
|
2280
2344
|
return p.value.getBoundingClientRect();
|
|
2281
2345
|
}
|
|
2282
|
-
function
|
|
2283
|
-
const b =
|
|
2346
|
+
function X(s = 1) {
|
|
2347
|
+
const b = z(), M = W().core, H = M.state, ie = H.downScale;
|
|
2284
2348
|
return {
|
|
2285
|
-
x: b.left + b.width / 2 +
|
|
2286
|
-
y: b.top + b.height / 2 +
|
|
2287
|
-
width: M.mediaSize.value.width * M.displayScale.value *
|
|
2288
|
-
height: M.mediaSize.value.height * M.displayScale.value *
|
|
2289
|
-
rotation:
|
|
2349
|
+
x: b.left + b.width / 2 + I.state.offset + H.offsetX * ie * s + H.downOffsetX,
|
|
2350
|
+
y: b.top + b.height / 2 + H.offsetY * ie * s + H.downOffsetY,
|
|
2351
|
+
width: M.mediaSize.value.width * M.displayScale.value * ie * s,
|
|
2352
|
+
height: M.mediaSize.value.height * M.displayScale.value * ie * s,
|
|
2353
|
+
rotation: H.rotation,
|
|
2290
2354
|
clip: b,
|
|
2291
2355
|
radius: 0
|
|
2292
2356
|
};
|
|
@@ -2294,157 +2358,157 @@ const ba = ["aria-label", "data-phase", "data-chrome", "inert"], ka = ["aria-hid
|
|
|
2294
2358
|
async function j(s = 0) {
|
|
2295
2359
|
if (!Number.isInteger(s) || s < 0 || s >= i.items.length)
|
|
2296
2360
|
throw new RangeError("无效的预览下标");
|
|
2297
|
-
if (
|
|
2298
|
-
const b = ++
|
|
2299
|
-
if (
|
|
2300
|
-
|
|
2361
|
+
if (o.value === "closing" && await ke, o.value !== "closed" || se) return;
|
|
2362
|
+
const b = ++G;
|
|
2363
|
+
if (de.clear(), xe = document.body.style.overflow, document.body.style.overflow = "hidden", I.reset(s), g = i.items[s].id, c.reset(), F.value = 1, P.value = !0, v.value = !1, R.value = "loading", C.value = !1, y.value = 0, Z.value = !1, o.value = "opening", K.value = Ce, A.value = !1, be = Y.value.id, ne = { kind: "unavailable" }, m.value = !1, a("open", s), await Se(), b !== G || se) return;
|
|
2364
|
+
D.value = p.value.clientWidth, ze.observe(u.value), ze.observe(p.value);
|
|
2301
2365
|
try {
|
|
2302
|
-
const
|
|
2303
|
-
if (b !==
|
|
2304
|
-
const
|
|
2305
|
-
|
|
2306
|
-
const
|
|
2307
|
-
if (
|
|
2308
|
-
const Xe = W().readiness === "ready" ? W().core.mediaRef.value :
|
|
2309
|
-
if (
|
|
2310
|
-
|
|
2311
|
-
|
|
2312
|
-
|
|
2366
|
+
const H = await i.resolveAnchor(Y.value);
|
|
2367
|
+
if (b !== G) return;
|
|
2368
|
+
const ie = Rt(H, Y.value, d());
|
|
2369
|
+
ne = ie, K.value = Fn(ie), A.value = K.value.kind === "image" || W().readiness === "ready";
|
|
2370
|
+
const Ye = z();
|
|
2371
|
+
if (ie.kind === "element") {
|
|
2372
|
+
const Xe = W().readiness === "ready" ? W().core.mediaRef.value : K.value.kind === "image" ? K.value.image : xt();
|
|
2373
|
+
if (m.value = !0, await Se(), b !== G || se) return;
|
|
2374
|
+
Ue(ie), await ge.play(
|
|
2375
|
+
O.value,
|
|
2376
|
+
h.value,
|
|
2313
2377
|
Xe,
|
|
2314
|
-
|
|
2315
|
-
Ot(
|
|
2316
|
-
|
|
2378
|
+
ie.frame,
|
|
2379
|
+
Ot(Y.value, Ye, "contain"),
|
|
2380
|
+
ie.viewport,
|
|
2317
2381
|
k.value,
|
|
2318
2382
|
!0,
|
|
2319
2383
|
0,
|
|
2320
2384
|
i.transitionDuration
|
|
2321
2385
|
);
|
|
2322
2386
|
} else
|
|
2323
|
-
|
|
2324
|
-
} catch (
|
|
2325
|
-
if (b !==
|
|
2326
|
-
a("error",
|
|
2387
|
+
y.value = 1, m.value = !1, await ye(!0);
|
|
2388
|
+
} catch (H) {
|
|
2389
|
+
if (b !== G) return;
|
|
2390
|
+
a("error", Ve(H), Y.value);
|
|
2327
2391
|
}
|
|
2328
|
-
if (b !==
|
|
2329
|
-
const M =
|
|
2330
|
-
M.kind === "pointer" && i.gesturesEnabled && (W().onPointerDown(M.down,
|
|
2392
|
+
if (b !== G || se || (y.value = 1, o.value = "open", await Se(), b !== G || se)) return;
|
|
2393
|
+
const M = de.take();
|
|
2394
|
+
M.kind === "pointer" && i.gesturesEnabled && (W().onPointerDown(M.down, z(), M.target), W().onPointerMove(M.latest)), W().core.renderNow(), await Ee(), !(b !== G || se) && (m.value = !1, ge.cancel(), Re(), a("opened", s), await Ee(), !(b !== G || se || o.value !== "open") && (Z.value = !0, Ae(s)));
|
|
2331
2395
|
}
|
|
2332
2396
|
function N() {
|
|
2333
|
-
return
|
|
2397
|
+
return o.value === "closed" || o.value === "closing" || (ke = Q()), ke;
|
|
2334
2398
|
}
|
|
2335
|
-
async function
|
|
2336
|
-
|
|
2337
|
-
const s =
|
|
2338
|
-
image:
|
|
2399
|
+
async function Q() {
|
|
2400
|
+
de.clear(), I.grab();
|
|
2401
|
+
const s = y.value, b = o.value === "opening", M = !b && W().readiness === "ready" ? W().retainFrame() : {
|
|
2402
|
+
image: K.value.kind === "image" && Y.value.id === be ? K.value.image : xt(),
|
|
2339
2403
|
scale: 1,
|
|
2340
2404
|
release: () => {
|
|
2341
2405
|
}
|
|
2342
2406
|
};
|
|
2343
|
-
|
|
2407
|
+
pe = M.release;
|
|
2344
2408
|
try {
|
|
2345
|
-
let
|
|
2409
|
+
let H = b ? { kind: "opening" } : { kind: "captured", frame: X(M.scale) };
|
|
2346
2410
|
b || W().core.cancelGesture(!0);
|
|
2347
|
-
const
|
|
2348
|
-
|
|
2411
|
+
const ie = ++G, Ye = b ? ge.reverseOpening() : { kind: "inactive" };
|
|
2412
|
+
Ye.kind === "inactive" && ge.cancel(), I.cancel(), v.value = !1, o.value = "closing", a("closing");
|
|
2349
2413
|
try {
|
|
2350
|
-
if (await
|
|
2351
|
-
const Xe = b ?
|
|
2352
|
-
if (
|
|
2353
|
-
const
|
|
2354
|
-
if (
|
|
2355
|
-
await
|
|
2356
|
-
else if (
|
|
2414
|
+
if (await Se(), ie !== G || se || (document.fullscreenElement === u.value && (await document.exitFullscreen(), await Ee(), await Ee(), H.kind === "captured" && (H.frame = X(M.scale))), ie !== G || se)) return;
|
|
2415
|
+
const Xe = b ? ne : await i.resolveAnchor(Y.value);
|
|
2416
|
+
if (ie !== G || se) return;
|
|
2417
|
+
const et = b ? ne : Rt(Xe, Y.value, d());
|
|
2418
|
+
if (Ye.kind === "reversing")
|
|
2419
|
+
await Ye.finished;
|
|
2420
|
+
else if (H.kind === "captured" && et.kind === "element") {
|
|
2357
2421
|
const Nt = M.image;
|
|
2358
|
-
|
|
2359
|
-
|
|
2360
|
-
|
|
2422
|
+
Ue(et), m.value = !0, await Se(), await ge.play(
|
|
2423
|
+
O.value,
|
|
2424
|
+
h.value,
|
|
2361
2425
|
Nt,
|
|
2362
|
-
|
|
2363
|
-
|
|
2364
|
-
|
|
2426
|
+
H.frame,
|
|
2427
|
+
et.frame,
|
|
2428
|
+
et.viewport,
|
|
2365
2429
|
k.value,
|
|
2366
2430
|
!1,
|
|
2367
2431
|
s,
|
|
2368
2432
|
i.closeDuration
|
|
2369
2433
|
);
|
|
2370
2434
|
} else
|
|
2371
|
-
|
|
2435
|
+
m.value = !1, await ye(!1);
|
|
2372
2436
|
} catch (Xe) {
|
|
2373
|
-
a("error",
|
|
2437
|
+
a("error", Ve(Xe), Y.value), await ye(!1);
|
|
2374
2438
|
}
|
|
2375
|
-
if (
|
|
2376
|
-
ze.disconnect(),
|
|
2439
|
+
if (ie !== G || se) return;
|
|
2440
|
+
ze.disconnect(), fe = "", he = "", y.value = 0, o.value = "closed", K.value = Ce, me.clear(), oe.clear(), Re(), document.body.style.overflow = xe, a("close"), await Se(), ge.cancel();
|
|
2377
2441
|
} finally {
|
|
2378
|
-
M.release(),
|
|
2442
|
+
M.release(), pe === M.release && (pe = () => {
|
|
2379
2443
|
});
|
|
2380
2444
|
}
|
|
2381
2445
|
}
|
|
2382
|
-
async function
|
|
2446
|
+
async function ye(s) {
|
|
2383
2447
|
const b = ++Be, M = s ? 0 : Number(getComputedStyle(u.value).opacity);
|
|
2384
|
-
|
|
2385
|
-
const
|
|
2448
|
+
ve.kind === "active" && ve.animation.cancel(), u.value.style.opacity = String(M);
|
|
2449
|
+
const H = u.value.animate([{ opacity: M }, { opacity: s ? 1 : 0 }], {
|
|
2386
2450
|
duration: matchMedia("(prefers-reduced-motion: reduce)").matches ? 0 : 180,
|
|
2387
2451
|
fill: "forwards"
|
|
2388
2452
|
});
|
|
2389
|
-
|
|
2390
|
-
}), !(b !== Be ||
|
|
2453
|
+
ve = { kind: "active", animation: H }, await H.finished.catch(() => {
|
|
2454
|
+
}), !(b !== Be || se) && (u.value.style.opacity = s ? "1" : "0", H.cancel(), ve = { kind: "idle" });
|
|
2391
2455
|
}
|
|
2392
|
-
async function
|
|
2456
|
+
async function Me() {
|
|
2393
2457
|
if (document.fullscreenEnabled)
|
|
2394
2458
|
try {
|
|
2395
2459
|
document.fullscreenElement === u.value ? await document.exitFullscreen() : await u.value.requestFullscreen();
|
|
2396
2460
|
} catch (s) {
|
|
2397
|
-
a("error",
|
|
2461
|
+
a("error", Ve(s), Y.value);
|
|
2398
2462
|
}
|
|
2399
2463
|
}
|
|
2400
|
-
function
|
|
2464
|
+
function Le(s) {
|
|
2401
2465
|
if (i.gesturesEnabled) {
|
|
2402
|
-
if (
|
|
2403
|
-
|
|
2466
|
+
if (o.value === "opening") {
|
|
2467
|
+
de.start(s);
|
|
2404
2468
|
return;
|
|
2405
2469
|
}
|
|
2406
|
-
|
|
2470
|
+
o.value === "open" && W().onPointerDown(s, z()) && I.grab();
|
|
2407
2471
|
}
|
|
2408
2472
|
}
|
|
2409
|
-
function
|
|
2410
|
-
if (
|
|
2411
|
-
i.gesturesEnabled &&
|
|
2473
|
+
function Je(s) {
|
|
2474
|
+
if (o.value === "opening") {
|
|
2475
|
+
i.gesturesEnabled && de.finish(s, z()) && N();
|
|
2412
2476
|
return;
|
|
2413
2477
|
}
|
|
2414
|
-
|
|
2478
|
+
o.value === "open" && (W().onPointerUp(s), o.value === "open" && I.resume());
|
|
2415
2479
|
}
|
|
2416
2480
|
function ht(s) {
|
|
2417
|
-
|
|
2418
|
-
}
|
|
2419
|
-
function Vt(s) {
|
|
2420
|
-
l.value === "opening" && ge.clear(), l.value === "open" && s.target === W().core.containerRef.value && ht(s);
|
|
2481
|
+
de.clear(), o.value === "open" && (W().onPointerCancel(s), o.value === "open" && I.resume());
|
|
2421
2482
|
}
|
|
2422
2483
|
function _t(s) {
|
|
2423
|
-
|
|
2484
|
+
o.value === "opening" && de.clear(), o.value === "open" && s.target === W().core.containerRef.value && ht(s);
|
|
2424
2485
|
}
|
|
2425
|
-
function
|
|
2426
|
-
|
|
2486
|
+
function Vt(s) {
|
|
2487
|
+
o.value === "opening" && de.move(s), o.value === "open" && W().onPointerMove(s);
|
|
2427
2488
|
}
|
|
2428
2489
|
function Ut(s) {
|
|
2429
|
-
|
|
2490
|
+
o.value === "open" && i.gesturesEnabled && W().onWheel(s);
|
|
2491
|
+
}
|
|
2492
|
+
function Yt(s) {
|
|
2493
|
+
o.value === "open" && (y.value = 1 - s);
|
|
2430
2494
|
}
|
|
2431
2495
|
function Xt(s) {
|
|
2432
|
-
|
|
2496
|
+
o.value === "open" && I.drag(s);
|
|
2433
2497
|
}
|
|
2434
2498
|
function Ht(s, b) {
|
|
2435
|
-
|
|
2499
|
+
o.value === "open" && (v.value = !1, I.release(s, b));
|
|
2436
2500
|
}
|
|
2437
2501
|
function Wt(s) {
|
|
2438
|
-
|
|
2502
|
+
F.value = s, s > 1.02 && !i.persistentChrome && (P.value = !1);
|
|
2439
2503
|
}
|
|
2440
2504
|
function vt(s) {
|
|
2441
|
-
if (!(
|
|
2505
|
+
if (!(o.value === "closed" || !i.keyboardEnabled) && !(s.key === "Escape" && document.fullscreenElement === u.value)) {
|
|
2442
2506
|
if (s.key === "Escape") {
|
|
2443
2507
|
s.preventDefault(), N();
|
|
2444
2508
|
return;
|
|
2445
2509
|
}
|
|
2446
|
-
if (!(
|
|
2447
|
-
if (
|
|
2510
|
+
if (!(o.value !== "open" || s.target.matches("input, textarea, select, button, [role='slider']"))) {
|
|
2511
|
+
if (Y.value.type === "video") {
|
|
2448
2512
|
if (s.code === "Space") {
|
|
2449
2513
|
s.preventDefault(), W().togglePlayback();
|
|
2450
2514
|
return;
|
|
@@ -2454,31 +2518,31 @@ const ba = ["aria-label", "data-phase", "data-chrome", "inert"], ka = ["aria-hid
|
|
|
2454
2518
|
return;
|
|
2455
2519
|
}
|
|
2456
2520
|
}
|
|
2457
|
-
if (
|
|
2458
|
-
s.preventDefault(),
|
|
2521
|
+
if (Y.value.type === "live-photo" && s.code === "Space") {
|
|
2522
|
+
s.preventDefault(), ae.toggleLive();
|
|
2459
2523
|
return;
|
|
2460
2524
|
}
|
|
2461
|
-
s.key === "ArrowLeft" && (s.preventDefault(),
|
|
2525
|
+
s.key === "ArrowLeft" && (s.preventDefault(), I.go(-1)), s.key === "ArrowRight" && (s.preventDefault(), I.go(1)), (s.key === "+" || s.key === "=") && ae.zoomIn(), s.key === "-" && ae.zoomOut(), s.key === "0" && ae.reset();
|
|
2462
2526
|
}
|
|
2463
2527
|
}
|
|
2464
2528
|
}
|
|
2465
2529
|
return qe(() => {
|
|
2466
2530
|
document.addEventListener("keydown", vt);
|
|
2467
|
-
}),
|
|
2468
|
-
|
|
2531
|
+
}), Te(() => {
|
|
2532
|
+
se = !0, G += 1, ge.cancel(), pe(), de.clear(), Be += 1, ve.kind === "active" && ve.animation.cancel(), Re(), ze.disconnect(), document.removeEventListener("keydown", vt), o.value !== "closed" && (document.body.style.overflow = xe);
|
|
2469
2533
|
}), n({
|
|
2470
2534
|
open: j,
|
|
2471
|
-
...
|
|
2472
|
-
currentIndex:
|
|
2473
|
-
phase:
|
|
2535
|
+
...ae,
|
|
2536
|
+
currentIndex: U,
|
|
2537
|
+
phase: o,
|
|
2474
2538
|
element: u,
|
|
2475
2539
|
mediaElement: () => W().core.mediaRef.value,
|
|
2476
2540
|
canvasElement: () => W().core.canvasRef.value
|
|
2477
|
-
}), (s, b) => (
|
|
2541
|
+
}), (s, b) => (q(), We(Ct, {
|
|
2478
2542
|
to: "body",
|
|
2479
2543
|
disabled: s.teleportDisabled
|
|
2480
2544
|
}, [
|
|
2481
|
-
|
|
2545
|
+
o.value !== "closed" ? (q(), _("div", Ne({
|
|
2482
2546
|
key: 0,
|
|
2483
2547
|
ref_key: "root",
|
|
2484
2548
|
ref: u
|
|
@@ -2486,210 +2550,210 @@ const ba = ["aria-label", "data-phase", "data-chrome", "inert"], ka = ["aria-hid
|
|
|
2486
2550
|
class: ["mp-viewer", { "is-mobile": s.mobile, "is-album": s.appearance === "album" }],
|
|
2487
2551
|
role: "dialog",
|
|
2488
2552
|
"aria-modal": "true",
|
|
2489
|
-
"aria-label":
|
|
2490
|
-
"data-phase":
|
|
2491
|
-
"data-chrome":
|
|
2492
|
-
inert:
|
|
2493
|
-
onPointerdown:
|
|
2494
|
-
onPointermove:
|
|
2495
|
-
onPointerup:
|
|
2553
|
+
"aria-label": Y.value.title,
|
|
2554
|
+
"data-phase": o.value,
|
|
2555
|
+
"data-chrome": P.value ? "visible" : "hidden",
|
|
2556
|
+
inert: o.value === "closing",
|
|
2557
|
+
onPointerdown: Le,
|
|
2558
|
+
onPointermove: Vt,
|
|
2559
|
+
onPointerup: Je,
|
|
2496
2560
|
onPointercancel: ht,
|
|
2497
|
-
onLostpointercapture:
|
|
2498
|
-
onWheel:
|
|
2561
|
+
onLostpointercapture: _t,
|
|
2562
|
+
onWheel: Ut
|
|
2499
2563
|
}), [
|
|
2500
|
-
|
|
2564
|
+
T("div", {
|
|
2501
2565
|
ref_key: "backdrop",
|
|
2502
2566
|
ref: k,
|
|
2503
2567
|
class: "mp-viewer__backdrop",
|
|
2504
|
-
style:
|
|
2568
|
+
style: we({ opacity: y.value })
|
|
2505
2569
|
}, null, 4),
|
|
2506
|
-
|
|
2507
|
-
id:
|
|
2570
|
+
T("div", {
|
|
2571
|
+
id: l,
|
|
2508
2572
|
class: "mp-viewer__video-controls"
|
|
2509
2573
|
}),
|
|
2510
|
-
|
|
2574
|
+
T("div", {
|
|
2511
2575
|
ref_key: "mediaViewport",
|
|
2512
2576
|
ref: p,
|
|
2513
|
-
class:
|
|
2577
|
+
class: De(["mp-viewer__pages", { "is-transitioning": m.value }])
|
|
2514
2578
|
}, [
|
|
2515
|
-
(
|
|
2579
|
+
(q(!0), _(Fe, null, Ze(Qe.value, (M) => (q(), _("div", {
|
|
2516
2580
|
key: s.items[M].id,
|
|
2517
2581
|
ref_for: !0,
|
|
2518
|
-
ref:
|
|
2582
|
+
ref: Pe(s.items[M].id),
|
|
2519
2583
|
class: "mp-viewer__page",
|
|
2520
|
-
style:
|
|
2521
|
-
transform: `translate3d(${(M - f(
|
|
2522
|
-
transition: f(
|
|
2584
|
+
style: we({
|
|
2585
|
+
transform: `translate3d(${(M - f(U)) * f(I).stride() + f(I).state.offset}px,0,0)`,
|
|
2586
|
+
transition: f(I).state.settling ? `transform ${f(I).state.duration}ms cubic-bezier(.22,.61,.36,1)` : "none"
|
|
2523
2587
|
}),
|
|
2524
|
-
"aria-hidden": M !== f(
|
|
2525
|
-
inert: M !== f(
|
|
2588
|
+
"aria-hidden": M !== f(U),
|
|
2589
|
+
inert: M !== f(U),
|
|
2526
2590
|
"data-media-id": s.items[M].id
|
|
2527
2591
|
}, [
|
|
2528
|
-
|
|
2592
|
+
Ie(ya, {
|
|
2529
2593
|
ref_for: !0,
|
|
2530
|
-
ref:
|
|
2594
|
+
ref: ee(s.items[M].id),
|
|
2531
2595
|
media: s.items[M],
|
|
2532
2596
|
"video-loader": s.videoLoader,
|
|
2533
|
-
rendering:
|
|
2534
|
-
paging: f(
|
|
2597
|
+
rendering: o.value === "open",
|
|
2598
|
+
paging: f(I).state.dragging || f(I).state.preparing || f(I).state.settling || f(I).state.grabbed,
|
|
2535
2599
|
"external-gestures": "",
|
|
2536
|
-
active: M === f(
|
|
2537
|
-
disabled:
|
|
2538
|
-
"inactive-reset-duration": f(
|
|
2600
|
+
active: M === f(U),
|
|
2601
|
+
disabled: o.value !== "open" || !s.gesturesEnabled,
|
|
2602
|
+
"inactive-reset-duration": f(I).state.duration,
|
|
2539
2603
|
"resource-policy": s.resourcePolicy,
|
|
2540
2604
|
"resolve-source": s.resolveImageSource,
|
|
2541
|
-
"request-version": M === f(
|
|
2542
|
-
"load-enabled": M === f(
|
|
2605
|
+
"request-version": M === f(U) ? f(E) : 0,
|
|
2606
|
+
"load-enabled": M === f(U) ? Z.value && o.value === "open" : o.value === "open" && !m.value && f(w) === Y.value.id,
|
|
2543
2607
|
"teleport-controls": "",
|
|
2544
|
-
"controls-target": `#${
|
|
2545
|
-
"controls-visible":
|
|
2546
|
-
"initial-image": s.items[M].id === f(
|
|
2547
|
-
quality: M === f(
|
|
2548
|
-
"live-playing":
|
|
2608
|
+
"controls-target": `#${l}`,
|
|
2609
|
+
"controls-visible": P.value && y.value === 1,
|
|
2610
|
+
"initial-image": s.items[M].id === f(be) ? K.value : f(Ce),
|
|
2611
|
+
quality: M === f(U) && f(x).has(s.items[M].id) ? "full" : M === f(U) ? "screen" : "thumbnail",
|
|
2612
|
+
"live-playing": v.value,
|
|
2549
2613
|
onTap: st,
|
|
2550
2614
|
onScale: Wt,
|
|
2551
2615
|
onPageDrag: Xt,
|
|
2552
2616
|
onPageRelease: Ht,
|
|
2553
2617
|
onClose: N,
|
|
2554
|
-
onSwipeDownProgress:
|
|
2555
|
-
onLiveState: (
|
|
2556
|
-
M === f(
|
|
2618
|
+
onSwipeDownProgress: Yt,
|
|
2619
|
+
onLiveState: (H) => {
|
|
2620
|
+
M === f(U) && (R.value = H);
|
|
2557
2621
|
},
|
|
2558
2622
|
onLiveEnded: () => {
|
|
2559
|
-
M === f(
|
|
2623
|
+
M === f(U) && (v.value = !1);
|
|
2560
2624
|
},
|
|
2561
|
-
onReady: (
|
|
2562
|
-
onOriginalState: (
|
|
2563
|
-
onError: (
|
|
2625
|
+
onReady: (H) => rt(M, H),
|
|
2626
|
+
onOriginalState: (H, ie) => ot(M, H, ie),
|
|
2627
|
+
onError: (H) => a("error", H, s.items[M])
|
|
2564
2628
|
}, null, 8, ["media", "video-loader", "rendering", "paging", "active", "disabled", "inactive-reset-duration", "resource-policy", "resolve-source", "request-version", "load-enabled", "controls-target", "controls-visible", "initial-image", "quality", "live-playing", "onLiveState", "onLiveEnded", "onReady", "onOriginalState", "onError"])
|
|
2565
|
-
], 12,
|
|
2629
|
+
], 12, Ra))), 128))
|
|
2566
2630
|
], 2),
|
|
2567
|
-
en(
|
|
2631
|
+
en(T("div", {
|
|
2568
2632
|
ref_key: "transitionMask",
|
|
2569
|
-
ref:
|
|
2633
|
+
ref: h,
|
|
2570
2634
|
class: "mp-shared-clip",
|
|
2571
2635
|
"aria-hidden": "true"
|
|
2572
2636
|
}, [
|
|
2573
|
-
|
|
2637
|
+
T("canvas", {
|
|
2574
2638
|
ref_key: "transitionCanvas",
|
|
2575
|
-
ref:
|
|
2639
|
+
ref: O,
|
|
2576
2640
|
class: "mp-shared-transition"
|
|
2577
2641
|
}, null, 512)
|
|
2578
2642
|
], 512), [
|
|
2579
|
-
[tn,
|
|
2643
|
+
[tn, m.value]
|
|
2580
2644
|
]),
|
|
2581
|
-
|
|
2582
|
-
|
|
2583
|
-
class:
|
|
2584
|
-
inert: !
|
|
2645
|
+
o.value === "opening" && !A.value ? (q(), _("div", Ea, La)) : le("", !0),
|
|
2646
|
+
T("div", {
|
|
2647
|
+
class: De(["mp-viewer__chrome", { "is-hidden": !P.value || o.value !== "open" || y.value < 1 }]),
|
|
2648
|
+
inert: !P.value || o.value !== "open" || y.value < 1
|
|
2585
2649
|
}, [
|
|
2586
2650
|
ut(s.$slots, "toolbar", {
|
|
2587
|
-
media:
|
|
2588
|
-
index: f(
|
|
2651
|
+
media: Y.value,
|
|
2652
|
+
index: f(U),
|
|
2589
2653
|
total: s.items.length,
|
|
2590
|
-
scale:
|
|
2591
|
-
controls:
|
|
2592
|
-
originalStatus: f(
|
|
2593
|
-
originalReason: f(
|
|
2594
|
-
livePlaying:
|
|
2595
|
-
liveStatus:
|
|
2654
|
+
scale: F.value,
|
|
2655
|
+
controls: ae,
|
|
2656
|
+
originalStatus: f(L),
|
|
2657
|
+
originalReason: f(S),
|
|
2658
|
+
livePlaying: v.value,
|
|
2659
|
+
liveStatus: R.value
|
|
2596
2660
|
}, () => [
|
|
2597
|
-
|
|
2598
|
-
|
|
2661
|
+
T("header", Fa, [
|
|
2662
|
+
T("button", {
|
|
2599
2663
|
type: "button",
|
|
2600
2664
|
"aria-label": "关闭预览",
|
|
2601
2665
|
onClick: N
|
|
2602
2666
|
}, "‹"),
|
|
2603
|
-
|
|
2604
|
-
|
|
2605
|
-
|
|
2667
|
+
T("div", Ta, [
|
|
2668
|
+
T("strong", null, ce(Y.value.title), 1),
|
|
2669
|
+
T("span", null, ce(f(U) + 1) + " / " + ce(s.items.length), 1)
|
|
2606
2670
|
]),
|
|
2607
|
-
|
|
2671
|
+
T("button", {
|
|
2608
2672
|
type: "button",
|
|
2609
2673
|
"aria-label": "旋转图片",
|
|
2610
|
-
disabled:
|
|
2611
|
-
onClick: b[0] || (b[0] = (M) =>
|
|
2612
|
-
}, " ↻ ", 8,
|
|
2674
|
+
disabled: Y.value.type === "video",
|
|
2675
|
+
onClick: b[0] || (b[0] = (M) => ae.rotate())
|
|
2676
|
+
}, " ↻ ", 8, Ba)
|
|
2613
2677
|
]),
|
|
2614
|
-
|
|
2615
|
-
|
|
2616
|
-
|
|
2678
|
+
T("footer", za, [
|
|
2679
|
+
Y.value.type !== "video" ? (q(), _(Fe, { key: 0 }, [
|
|
2680
|
+
T("button", {
|
|
2617
2681
|
type: "button",
|
|
2618
2682
|
"aria-label": "缩小",
|
|
2619
2683
|
onClick: b[1] || (b[1] = //@ts-ignore
|
|
2620
|
-
(...M) =>
|
|
2684
|
+
(...M) => ae.zoomOut && ae.zoomOut(...M))
|
|
2621
2685
|
}, "−"),
|
|
2622
|
-
|
|
2686
|
+
T("button", {
|
|
2623
2687
|
type: "button",
|
|
2624
2688
|
"aria-label": "放大",
|
|
2625
2689
|
onClick: b[2] || (b[2] = //@ts-ignore
|
|
2626
|
-
(...M) =>
|
|
2690
|
+
(...M) => ae.zoomIn && ae.zoomIn(...M))
|
|
2627
2691
|
}, "+"),
|
|
2628
|
-
|
|
2692
|
+
T("button", {
|
|
2629
2693
|
type: "button",
|
|
2630
2694
|
"aria-label": "复位",
|
|
2631
2695
|
onClick: b[3] || (b[3] = //@ts-ignore
|
|
2632
|
-
(...M) =>
|
|
2696
|
+
(...M) => ae.reset && ae.reset(...M))
|
|
2633
2697
|
}, "复位")
|
|
2634
2698
|
], 64)) : le("", !0),
|
|
2635
|
-
|
|
2699
|
+
T("button", {
|
|
2636
2700
|
type: "button",
|
|
2637
2701
|
"aria-label": "图片详情",
|
|
2638
2702
|
onClick: b[4] || (b[4] = //@ts-ignore
|
|
2639
|
-
(...M) =>
|
|
2703
|
+
(...M) => ae.toggleDetail && ae.toggleDetail(...M))
|
|
2640
2704
|
}, "ⓘ")
|
|
2641
2705
|
])
|
|
2642
2706
|
]),
|
|
2643
|
-
!s.mobile && f(
|
|
2707
|
+
!s.mobile && f(U) > 0 ? (q(), _("button", {
|
|
2644
2708
|
key: 0,
|
|
2645
2709
|
class: "mp-viewer__arrow is-left",
|
|
2646
2710
|
"aria-label": "上一张",
|
|
2647
|
-
onClick: b[5] || (b[5] = (M) => f(
|
|
2711
|
+
onClick: b[5] || (b[5] = (M) => f(I).go(-1))
|
|
2648
2712
|
}, " ‹ ")) : le("", !0),
|
|
2649
|
-
!s.mobile && f(
|
|
2713
|
+
!s.mobile && f(U) < s.items.length - 1 ? (q(), _("button", {
|
|
2650
2714
|
key: 1,
|
|
2651
2715
|
class: "mp-viewer__arrow is-right",
|
|
2652
2716
|
"aria-label": "下一张",
|
|
2653
|
-
onClick: b[6] || (b[6] = (M) => f(
|
|
2717
|
+
onClick: b[6] || (b[6] = (M) => f(I).go(1))
|
|
2654
2718
|
}, " › ")) : le("", !0),
|
|
2655
|
-
|
|
2656
|
-
], 10,
|
|
2657
|
-
|
|
2658
|
-
|
|
2719
|
+
T("div", Ia, ce(f(U) + 1) + " / " + ce(s.items.length), 1)
|
|
2720
|
+
], 10, $a),
|
|
2721
|
+
C.value ? (q(), _("aside", Da, [
|
|
2722
|
+
T("button", {
|
|
2659
2723
|
type: "button",
|
|
2660
2724
|
"aria-label": "关闭详情",
|
|
2661
|
-
onClick: b[7] || (b[7] = (M) =>
|
|
2725
|
+
onClick: b[7] || (b[7] = (M) => C.value = !1)
|
|
2662
2726
|
}, "×"),
|
|
2663
|
-
|
|
2664
|
-
|
|
2665
|
-
|
|
2727
|
+
T("strong", null, ce(Y.value.title), 1),
|
|
2728
|
+
T("span", null, ce(Y.value.width) + " × " + ce(Y.value.height), 1),
|
|
2729
|
+
T("span", null, ce(Y.value.type) + " · " + ce(F.value.toFixed(2)) + "×", 1)
|
|
2666
2730
|
])) : le("", !0)
|
|
2667
|
-
], 16,
|
|
2731
|
+
], 16, Pa)) : le("", !0)
|
|
2668
2732
|
], 8, ["disabled"]));
|
|
2669
2733
|
}
|
|
2670
2734
|
});
|
|
2671
|
-
function
|
|
2672
|
-
const i = Math.max(1, (n - e * (
|
|
2673
|
-
let
|
|
2674
|
-
return t.forEach((p,
|
|
2675
|
-
|
|
2676
|
-
for (let
|
|
2677
|
-
const
|
|
2678
|
-
a.push({ kind: "items", group:
|
|
2679
|
-
for (let
|
|
2680
|
-
u +=
|
|
2681
|
-
}
|
|
2682
|
-
}), { rows: a, locations:
|
|
2735
|
+
function qa(t, n, r, e = 2) {
|
|
2736
|
+
const i = Math.max(1, (n - e * (r - 1)) / r), a = [], o = /* @__PURE__ */ new Map();
|
|
2737
|
+
let l = 0, u = 0;
|
|
2738
|
+
return t.forEach((p, c) => {
|
|
2739
|
+
c > 0 && (a.push({ kind: "header", group: c, first: 0, count: 0, start: l, end: l + 52 }), l += 52);
|
|
2740
|
+
for (let x = 0; x < p.items.length; x += r) {
|
|
2741
|
+
const L = Math.min(r, p.items.length - x), S = a.length;
|
|
2742
|
+
a.push({ kind: "items", group: c, first: x, count: L, start: l, end: l + i });
|
|
2743
|
+
for (let E = 0; E < L; E++) o.set(p.items[x + E].id, S);
|
|
2744
|
+
u += L, l += i + (x + L < p.items.length ? e : 0);
|
|
2745
|
+
}
|
|
2746
|
+
}), { rows: a, locations: o, height: l, size: i, total: u };
|
|
2683
2747
|
}
|
|
2684
2748
|
function Et(t, n) {
|
|
2685
|
-
let
|
|
2686
|
-
for (;
|
|
2687
|
-
const i =
|
|
2688
|
-
t[i].end < n ?
|
|
2749
|
+
let r = 0, e = t.length;
|
|
2750
|
+
for (; r < e; ) {
|
|
2751
|
+
const i = r + e >>> 1;
|
|
2752
|
+
t[i].end < n ? r = i + 1 : e = i;
|
|
2689
2753
|
}
|
|
2690
|
-
return Math.min(
|
|
2754
|
+
return Math.min(r, Math.max(0, t.length - 1));
|
|
2691
2755
|
}
|
|
2692
|
-
const
|
|
2756
|
+
const Oa = ["data-total-items", "data-rendered-items"], Aa = /* @__PURE__ */ $e({
|
|
2693
2757
|
__name: "VirtualTimeline",
|
|
2694
2758
|
props: {
|
|
2695
2759
|
groups: {},
|
|
@@ -2698,97 +2762,97 @@ const Ba = ["data-total-items", "data-rendered-items"], za = /* @__PURE__ */ Te(
|
|
|
2698
2762
|
hasMore: { type: Boolean, default: !1 }
|
|
2699
2763
|
},
|
|
2700
2764
|
emits: ["loadMore", "date"],
|
|
2701
|
-
setup(t, { expose: n, emit:
|
|
2702
|
-
const e = t, i =
|
|
2703
|
-
() => e.mobile ?
|
|
2704
|
-
),
|
|
2705
|
-
const k =
|
|
2706
|
-
let
|
|
2707
|
-
for (;
|
|
2708
|
-
return k.slice(
|
|
2709
|
-
}),
|
|
2710
|
-
let
|
|
2765
|
+
setup(t, { expose: n, emit: r }) {
|
|
2766
|
+
const e = t, i = r, a = $(), o = $(390), l = $(844), u = $(0), p = V(
|
|
2767
|
+
() => e.mobile ? o.value >= 640 ? 5 : o.value >= 480 ? 4 : 3 : Math.max(1, Math.floor((o.value + 2) / 172))
|
|
2768
|
+
), c = V(() => qa(e.groups, o.value, p.value)), x = V(() => {
|
|
2769
|
+
const k = c.value.rows, m = Et(k, Math.max(0, u.value - c.value.size * 3)), y = u.value + l.value + c.value.size * 3;
|
|
2770
|
+
let P = m;
|
|
2771
|
+
for (; P < k.length && k[P].start <= y; ) P++;
|
|
2772
|
+
return k.slice(m, P);
|
|
2773
|
+
}), L = V(() => x.value.reduce((k, m) => k + m.count, 0));
|
|
2774
|
+
let S = 0, E = !1, w = () => {
|
|
2711
2775
|
};
|
|
2712
|
-
function
|
|
2776
|
+
function g() {
|
|
2713
2777
|
const k = e.scrollElement();
|
|
2714
|
-
|
|
2715
|
-
const
|
|
2716
|
-
|
|
2778
|
+
o.value = k.clientWidth, l.value = k.clientHeight, u.value = k.scrollTop, c.value.rows.length > 0 && i("date", e.groups[c.value.rows[Et(c.value.rows, u.value)].group].key);
|
|
2779
|
+
const m = u.value + l.value >= c.value.height - c.value.size * 3;
|
|
2780
|
+
m && e.hasMore && !E && (E = !0, i("loadMore")), m || (E = !1);
|
|
2717
2781
|
}
|
|
2718
|
-
function
|
|
2719
|
-
|
|
2720
|
-
|
|
2782
|
+
function B() {
|
|
2783
|
+
S === 0 && (S = requestAnimationFrame(() => {
|
|
2784
|
+
S = 0, g();
|
|
2721
2785
|
}));
|
|
2722
2786
|
}
|
|
2723
|
-
const
|
|
2787
|
+
const O = new ResizeObserver(g);
|
|
2724
2788
|
qe(() => {
|
|
2725
|
-
const k = e.scrollElement(),
|
|
2726
|
-
k.style.overflowAnchor = "none",
|
|
2727
|
-
k.style.overflowAnchor =
|
|
2728
|
-
}, k.addEventListener("scroll",
|
|
2729
|
-
}),
|
|
2730
|
-
e.scrollElement().removeEventListener("scroll",
|
|
2731
|
-
}),
|
|
2789
|
+
const k = e.scrollElement(), m = k.style.overflowAnchor;
|
|
2790
|
+
k.style.overflowAnchor = "none", w = () => {
|
|
2791
|
+
k.style.overflowAnchor = m;
|
|
2792
|
+
}, k.addEventListener("scroll", B, { passive: !0 }), O.observe(k), g();
|
|
2793
|
+
}), Te(() => {
|
|
2794
|
+
e.scrollElement().removeEventListener("scroll", B), O.disconnect(), cancelAnimationFrame(S), w();
|
|
2795
|
+
}), te(
|
|
2732
2796
|
() => e.groups,
|
|
2733
2797
|
() => {
|
|
2734
|
-
|
|
2798
|
+
E = !1, Se(g);
|
|
2735
2799
|
}
|
|
2736
2800
|
);
|
|
2737
|
-
async function
|
|
2738
|
-
if (!
|
|
2739
|
-
const
|
|
2740
|
-
return (
|
|
2741
|
-
(
|
|
2801
|
+
async function h(k) {
|
|
2802
|
+
if (!c.value.locations.has(k)) return { kind: "unavailable" };
|
|
2803
|
+
const m = c.value.rows[c.value.locations.get(k)], y = e.scrollElement();
|
|
2804
|
+
return (m.start < y.scrollTop || m.end > y.scrollTop + y.clientHeight) && (y.scrollTop = Math.max(0, m.start - (y.clientHeight - c.value.size) / 2)), g(), await Se(), await new Promise((v) => requestAnimationFrame(() => v())), { kind: "element", element: [...a.value.querySelectorAll("[data-id]")].find(
|
|
2805
|
+
(v) => v.dataset.id === k
|
|
2742
2806
|
).querySelector("img") };
|
|
2743
2807
|
}
|
|
2744
|
-
return n({ resolveAnchor:
|
|
2808
|
+
return n({ resolveAnchor: h, rendered: L, total: V(() => c.value.total) }), (k, m) => (q(), _("div", {
|
|
2745
2809
|
ref_key: "root",
|
|
2746
2810
|
ref: a,
|
|
2747
2811
|
class: "mp-virtual-timeline",
|
|
2748
|
-
style:
|
|
2749
|
-
"data-total-items":
|
|
2750
|
-
"data-rendered-items":
|
|
2812
|
+
style: we({ height: c.value.height + "px" }),
|
|
2813
|
+
"data-total-items": c.value.total,
|
|
2814
|
+
"data-rendered-items": L.value
|
|
2751
2815
|
}, [
|
|
2752
|
-
(
|
|
2753
|
-
key: k.groups[
|
|
2816
|
+
(q(!0), _(Fe, null, Ze(x.value, (y) => (q(), _("div", {
|
|
2817
|
+
key: k.groups[y.group].key + ":" + y.kind + ":" + y.first,
|
|
2754
2818
|
class: "mp-timeline-row",
|
|
2755
|
-
style:
|
|
2756
|
-
top:
|
|
2757
|
-
height:
|
|
2758
|
-
display:
|
|
2819
|
+
style: we({
|
|
2820
|
+
top: y.start + "px",
|
|
2821
|
+
height: y.end - y.start + "px",
|
|
2822
|
+
display: y.kind === "items" ? "grid" : "block",
|
|
2759
2823
|
gridTemplateColumns: `repeat(${p.value},minmax(0,1fr))`,
|
|
2760
2824
|
gap: "2px"
|
|
2761
2825
|
})
|
|
2762
2826
|
}, [
|
|
2763
|
-
|
|
2827
|
+
y.kind === "header" ? ut(k.$slots, "header", {
|
|
2764
2828
|
key: 0,
|
|
2765
|
-
group: k.groups[
|
|
2766
|
-
index:
|
|
2767
|
-
}, void 0, !0) : (
|
|
2768
|
-
key:
|
|
2769
|
-
item:
|
|
2829
|
+
group: k.groups[y.group],
|
|
2830
|
+
index: y.group
|
|
2831
|
+
}, void 0, !0) : (q(!0), _(Fe, { key: 1 }, Ze(k.groups[y.group].items.slice(y.first, y.first + y.count), (P) => ut(k.$slots, "item", {
|
|
2832
|
+
key: P.id,
|
|
2833
|
+
item: P
|
|
2770
2834
|
}, void 0, !0)), 128))
|
|
2771
2835
|
], 4))), 128))
|
|
2772
|
-
], 12,
|
|
2836
|
+
], 12, Oa));
|
|
2773
2837
|
}
|
|
2774
|
-
}),
|
|
2775
|
-
const
|
|
2838
|
+
}), _a = (t, n) => {
|
|
2839
|
+
const r = t.__vccOpts || t;
|
|
2776
2840
|
for (const [e, i] of n)
|
|
2777
|
-
|
|
2778
|
-
return
|
|
2779
|
-
},
|
|
2841
|
+
r[e] = i;
|
|
2842
|
+
return r;
|
|
2843
|
+
}, Xa = /* @__PURE__ */ _a(Aa, [["__scopeId", "data-v-05c756fb"]]);
|
|
2780
2844
|
export {
|
|
2781
2845
|
pt as ImageCanvasRenderer,
|
|
2782
|
-
|
|
2783
|
-
|
|
2784
|
-
|
|
2785
|
-
|
|
2786
|
-
|
|
2787
|
-
|
|
2788
|
-
|
|
2846
|
+
Ln as ImageStore,
|
|
2847
|
+
Nn as LivePhotoRenderer,
|
|
2848
|
+
Ya as MediaPreview,
|
|
2849
|
+
ya as PreviewStage,
|
|
2850
|
+
ha as VideoDomRenderer,
|
|
2851
|
+
Xa as VirtualTimeline,
|
|
2852
|
+
Ge as defaultImagePolicy,
|
|
2789
2853
|
Ke as defaultImageSource,
|
|
2790
|
-
|
|
2854
|
+
_e as formatVideoTime,
|
|
2791
2855
|
it as nativeVideoSource,
|
|
2792
|
-
|
|
2856
|
+
$n as previewImageStore,
|
|
2793
2857
|
pn as usePreviewViewport
|
|
2794
2858
|
};
|