layershift 0.7.0 → 0.8.0
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 +16 -7
- package/dist/components/layershift.js +31 -31
- package/dist/npm/layershift.es.js +999 -857
- package/dist/types/components/layershift/layershift-element.d.ts +1 -1
- package/dist/types/components/layershift/layershift-element.d.ts.map +1 -1
- package/dist/types/components/layershift/lifecycle.d.ts.map +1 -1
- package/dist/types/components/layershift/portal-element.d.ts +1 -1
- package/dist/types/components/layershift/portal-element.d.ts.map +1 -1
- package/dist/types/depth/create-depth-session.d.ts +11 -0
- package/dist/types/depth/create-depth-session.d.ts.map +1 -0
- package/dist/types/depth/depth-estimator.d.ts.map +1 -1
- package/dist/types/depth/precomputed-depth.d.ts +35 -0
- package/dist/types/depth/precomputed-depth.d.ts.map +1 -1
- package/dist/types/renderers/renderer-base.d.ts +5 -0
- package/dist/types/renderers/renderer-base.d.ts.map +1 -1
- package/package.json +15 -13
|
@@ -1,4 +1,130 @@
|
|
|
1
|
-
|
|
1
|
+
const lt = new Uint8Array([76, 83, 70, 84]), At = 4, ie = 22, re = At + ie, se = 1, oe = 0, ae = 1, le = 3;
|
|
2
|
+
function ue(s) {
|
|
3
|
+
return s.byteLength < At ? !1 : s[0] === lt[0] && s[1] === lt[1] && s[2] === lt[2] && s[3] === lt[3];
|
|
4
|
+
}
|
|
5
|
+
function ce(s) {
|
|
6
|
+
let t = At;
|
|
7
|
+
const e = s.getUint16(t, !0);
|
|
8
|
+
t += 2;
|
|
9
|
+
const n = s.getUint32(t, !0);
|
|
10
|
+
t += 4;
|
|
11
|
+
const i = s.getFloat32(t, !0);
|
|
12
|
+
t += 4;
|
|
13
|
+
const r = s.getUint16(t, !0);
|
|
14
|
+
t += 2;
|
|
15
|
+
const o = s.getUint16(t, !0);
|
|
16
|
+
t += 2;
|
|
17
|
+
const l = s.getUint16(t, !0);
|
|
18
|
+
return { version: e, frameCount: n, fps: i, width: r, height: o, signalsPresent: l };
|
|
19
|
+
}
|
|
20
|
+
function he(s) {
|
|
21
|
+
let t = 0, e = s;
|
|
22
|
+
for (; e; )
|
|
23
|
+
t += e & 1, e >>>= 1;
|
|
24
|
+
return t;
|
|
25
|
+
}
|
|
26
|
+
function fe(s, t) {
|
|
27
|
+
const e = [];
|
|
28
|
+
let n = re;
|
|
29
|
+
for (let i = 0; i < t; i++) {
|
|
30
|
+
const r = s.getUint16(n, !0);
|
|
31
|
+
n += 2;
|
|
32
|
+
const o = s.getUint32(n, !0);
|
|
33
|
+
n += 4;
|
|
34
|
+
const l = s.getUint32(n, !0);
|
|
35
|
+
n += 4;
|
|
36
|
+
const a = o + l * 4294967296, h = s.getUint32(n, !0);
|
|
37
|
+
n += 4;
|
|
38
|
+
const c = s.getUint32(n, !0);
|
|
39
|
+
n += 4;
|
|
40
|
+
const f = h + c * 4294967296, u = s.getUint32(n, !0);
|
|
41
|
+
n += 4;
|
|
42
|
+
const v = s.getUint8(n);
|
|
43
|
+
n += 1;
|
|
44
|
+
const p = s.getUint8(n);
|
|
45
|
+
n += 1, n += 6, e.push({ signalId: r, dataOffset: a, dataLength: f, frameStride: u, encoding: v, channels: p });
|
|
46
|
+
}
|
|
47
|
+
return e;
|
|
48
|
+
}
|
|
49
|
+
function de(s) {
|
|
50
|
+
const t = s >>> 15 & 1, e = s >>> 10 & 31, n = s & 1023;
|
|
51
|
+
if (e === 31)
|
|
52
|
+
return n === 0 ? t ? -1 / 0 : 1 / 0 : NaN;
|
|
53
|
+
if (e === 0) {
|
|
54
|
+
const r = n / 1024 * 6103515625e-14;
|
|
55
|
+
return t ? -r : r;
|
|
56
|
+
}
|
|
57
|
+
const i = (1 + n / 1024) * Math.pow(2, e - 15);
|
|
58
|
+
return t ? -i : i;
|
|
59
|
+
}
|
|
60
|
+
function me(s) {
|
|
61
|
+
const t = de(s);
|
|
62
|
+
return Number.isNaN(t) || t <= 0 ? 0 : t >= 1 ? 255 : t * 255 + 0.5 | 0;
|
|
63
|
+
}
|
|
64
|
+
function pe(s, t, e) {
|
|
65
|
+
const n = new Uint8Array(e);
|
|
66
|
+
for (let i = 0; i < e; i++) {
|
|
67
|
+
const r = s.getUint16(t + i * 2, !0);
|
|
68
|
+
n[i] = me(r);
|
|
69
|
+
}
|
|
70
|
+
return n;
|
|
71
|
+
}
|
|
72
|
+
async function ge(s) {
|
|
73
|
+
const t = new DecompressionStream("deflate-raw"), e = t.writable.getWriter();
|
|
74
|
+
e.write(s), e.close();
|
|
75
|
+
const n = t.readable.getReader(), i = [];
|
|
76
|
+
for (; ; ) {
|
|
77
|
+
const { done: a, value: h } = await n.read();
|
|
78
|
+
if (a) break;
|
|
79
|
+
i.push(h);
|
|
80
|
+
}
|
|
81
|
+
const r = i.reduce((a, h) => a + h.byteLength, 0), o = new Uint8Array(r);
|
|
82
|
+
let l = 0;
|
|
83
|
+
for (const a of i)
|
|
84
|
+
o.set(a, l), l += a.byteLength;
|
|
85
|
+
return o;
|
|
86
|
+
}
|
|
87
|
+
async function ve(s, t, e, n) {
|
|
88
|
+
const i = new DataView(s.buffer, s.byteOffset, s.byteLength), r = ce(i), o = he(r.signalsPresent), a = fe(i, o).find((p) => p.signalId === se);
|
|
89
|
+
if (!a)
|
|
90
|
+
throw new Error(
|
|
91
|
+
`LSFT file does not contain a depth signal (signals_present: 0x${r.signalsPresent.toString(16).padStart(4, "0")})`
|
|
92
|
+
);
|
|
93
|
+
const h = t ?? r.width, c = e ?? r.height, f = n ?? r.fps, u = h * c, v = [];
|
|
94
|
+
if (a.encoding === le) {
|
|
95
|
+
const p = s.subarray(
|
|
96
|
+
a.dataOffset,
|
|
97
|
+
a.dataOffset + a.dataLength
|
|
98
|
+
), d = await ge(p);
|
|
99
|
+
for (let S = 0; S < r.frameCount; S++) {
|
|
100
|
+
const E = S * a.frameStride;
|
|
101
|
+
v.push(d.slice(E, E + a.frameStride));
|
|
102
|
+
}
|
|
103
|
+
} else if (a.encoding === oe)
|
|
104
|
+
for (let p = 0; p < r.frameCount; p++) {
|
|
105
|
+
const d = a.dataOffset + p * a.frameStride;
|
|
106
|
+
v.push(s.slice(d, d + a.frameStride));
|
|
107
|
+
}
|
|
108
|
+
else if (a.encoding === ae)
|
|
109
|
+
for (let p = 0; p < r.frameCount; p++) {
|
|
110
|
+
const d = a.dataOffset + p * a.frameStride;
|
|
111
|
+
v.push(pe(i, d, u));
|
|
112
|
+
}
|
|
113
|
+
else
|
|
114
|
+
throw new Error(`Unsupported depth encoding: ${a.encoding}`);
|
|
115
|
+
return {
|
|
116
|
+
width: h,
|
|
117
|
+
height: c,
|
|
118
|
+
fps: f,
|
|
119
|
+
frameCount: r.frameCount,
|
|
120
|
+
frames: v,
|
|
121
|
+
metadata: {
|
|
122
|
+
version: r.version,
|
|
123
|
+
signalsPresent: r.signalsPresent
|
|
124
|
+
}
|
|
125
|
+
};
|
|
126
|
+
}
|
|
127
|
+
class Ht {
|
|
2
128
|
constructor(t) {
|
|
3
129
|
this.depthData = t;
|
|
4
130
|
const e = t.width * t.height;
|
|
@@ -10,59 +136,52 @@ class Vt {
|
|
|
10
136
|
lastNextFrameIndex = -1;
|
|
11
137
|
lastLerpFactor = -1;
|
|
12
138
|
sample(t) {
|
|
13
|
-
const e =
|
|
139
|
+
const e = Te(t * this.depthData.fps, 0, this.depthData.frameCount - 1), n = Math.floor(e), i = Math.min(n + 1, this.depthData.frameCount - 1), r = e - n, o = n !== this.lastFrameIndex || i !== this.lastNextFrameIndex, l = Math.abs(r - this.lastLerpFactor) > 1e-3;
|
|
14
140
|
if (!o && !l)
|
|
15
141
|
return this.uint8Output;
|
|
16
|
-
this.lastFrameIndex =
|
|
17
|
-
const a = 1 - r, h = this.depthData.frames[
|
|
142
|
+
this.lastFrameIndex = n, this.lastNextFrameIndex = i, this.lastLerpFactor = r;
|
|
143
|
+
const a = 1 - r, h = this.depthData.frames[n], c = this.depthData.frames[i];
|
|
18
144
|
for (let f = 0; f < this.uint8Output.length; f += 1)
|
|
19
145
|
this.uint8Output[f] = h[f] * a + c[f] * r + 0.5 | 0;
|
|
20
146
|
return this.uint8Output;
|
|
21
147
|
}
|
|
22
148
|
}
|
|
23
|
-
async function
|
|
24
|
-
const r = await
|
|
25
|
-
|
|
149
|
+
async function Nt(s, t = 512, e = 512, n = 5, i) {
|
|
150
|
+
const r = await xe(s);
|
|
151
|
+
if (!ue(r))
|
|
152
|
+
throw new Error(
|
|
153
|
+
"Unsupported depth data format. Expected LSFT (.lsb) file. Use the layershift precompute CLI to produce LSFT-format files."
|
|
154
|
+
);
|
|
155
|
+
return await ve(r, t !== 512 ? t : void 0, e !== 512 ? e : void 0, n !== 5 ? n : void 0);
|
|
26
156
|
}
|
|
27
|
-
async function
|
|
157
|
+
async function xe(s, t) {
|
|
28
158
|
const e = await fetch(s);
|
|
29
159
|
if (!e.ok)
|
|
30
160
|
throw new Error(`Failed to fetch depth data (${e.status} ${e.statusText}).`);
|
|
161
|
+
if ((e.headers.get("content-type") ?? "").includes("text/html"))
|
|
162
|
+
throw new Error(
|
|
163
|
+
`Depth data URL returned HTML instead of binary data. The file may not exist at "${s}". Check the URL and server configuration.`
|
|
164
|
+
);
|
|
31
165
|
e.headers.get("content-length");
|
|
32
166
|
const i = e.body;
|
|
33
167
|
if (!i)
|
|
34
168
|
return new Uint8Array(await e.arrayBuffer());
|
|
35
|
-
const
|
|
36
|
-
let
|
|
37
|
-
const
|
|
169
|
+
const r = [];
|
|
170
|
+
let o = 0;
|
|
171
|
+
const l = i.getReader();
|
|
38
172
|
for (; ; ) {
|
|
39
|
-
const { done:
|
|
40
|
-
if (
|
|
173
|
+
const { done: c, value: f } = await l.read();
|
|
174
|
+
if (c)
|
|
41
175
|
break;
|
|
42
|
-
|
|
43
|
-
}
|
|
44
|
-
const l = new Uint8Array(r);
|
|
45
|
-
let a = 0;
|
|
46
|
-
for (const h of n)
|
|
47
|
-
l.set(h, a), a += h.byteLength;
|
|
48
|
-
return l;
|
|
49
|
-
}
|
|
50
|
-
function ee(s, t, e, i) {
|
|
51
|
-
const n = t * e;
|
|
52
|
-
if (n === 0)
|
|
53
|
-
throw new Error("Depth frame dimensions must be non-zero.");
|
|
54
|
-
if (s.byteLength % n !== 0)
|
|
55
|
-
throw new Error(
|
|
56
|
-
`Depth data byte length (${s.byteLength}) is not evenly divisible by frame size (${n} = ${t}×${e}).`
|
|
57
|
-
);
|
|
58
|
-
const r = s.byteLength / n, o = new Array(r);
|
|
59
|
-
for (let l = 0; l < r; l += 1) {
|
|
60
|
-
const a = l * n;
|
|
61
|
-
o[l] = s.subarray(a, a + n);
|
|
176
|
+
f && (r.push(f), o += f.byteLength);
|
|
62
177
|
}
|
|
63
|
-
|
|
178
|
+
const a = new Uint8Array(o);
|
|
179
|
+
let h = 0;
|
|
180
|
+
for (const c of r)
|
|
181
|
+
a.set(c, h), h += c.byteLength;
|
|
182
|
+
return a;
|
|
64
183
|
}
|
|
65
|
-
function
|
|
184
|
+
function N(s, t) {
|
|
66
185
|
const e = new Uint8Array(s * t);
|
|
67
186
|
return e.fill(128), {
|
|
68
187
|
width: s,
|
|
@@ -72,10 +191,10 @@ function X(s, t) {
|
|
|
72
191
|
frames: [e]
|
|
73
192
|
};
|
|
74
193
|
}
|
|
75
|
-
function
|
|
194
|
+
function Te(s, t, e) {
|
|
76
195
|
return Math.min(e, Math.max(t, s));
|
|
77
196
|
}
|
|
78
|
-
const
|
|
197
|
+
const Ee = {
|
|
79
198
|
parallaxStrength: 0.05,
|
|
80
199
|
contrastLow: 0.05,
|
|
81
200
|
contrastHigh: 0.95,
|
|
@@ -85,63 +204,63 @@ const ne = {
|
|
|
85
204
|
pomSteps: 16,
|
|
86
205
|
overscanPadding: 0.08
|
|
87
206
|
};
|
|
88
|
-
function
|
|
89
|
-
const
|
|
207
|
+
function be(s, t, e) {
|
|
208
|
+
const n = new Float32Array(256);
|
|
90
209
|
if (s.length === 0 || t <= 0 || e <= 0)
|
|
91
|
-
return
|
|
92
|
-
const
|
|
210
|
+
return Ft(n);
|
|
211
|
+
const i = ye(s.length), r = t * e;
|
|
93
212
|
let o = 0;
|
|
94
213
|
const l = new Uint32Array(256);
|
|
95
|
-
for (const m of
|
|
214
|
+
for (const m of i) {
|
|
96
215
|
const T = s[m], w = Math.min(T.length, r);
|
|
97
216
|
for (let A = 0; A < w; A += 1)
|
|
98
217
|
l[T[A]] += 1;
|
|
99
218
|
o += w;
|
|
100
219
|
}
|
|
101
220
|
if (o === 0)
|
|
102
|
-
return
|
|
221
|
+
return Ft(n);
|
|
103
222
|
const a = 1 / o;
|
|
104
223
|
for (let m = 0; m < 256; m += 1)
|
|
105
|
-
|
|
224
|
+
n[m] = l[m] * a;
|
|
106
225
|
const h = new Float32Array(256);
|
|
107
|
-
h[0] =
|
|
226
|
+
h[0] = n[0];
|
|
108
227
|
for (let m = 1; m < 256; m += 1)
|
|
109
|
-
h[m] = h[m - 1] +
|
|
110
|
-
const c =
|
|
228
|
+
h[m] = h[m - 1] + n[m];
|
|
229
|
+
const c = nt(h, 0.05), f = nt(h, 0.25), u = nt(h, 0.5), v = nt(h, 0.75), p = nt(h, 0.95);
|
|
111
230
|
let d = 0;
|
|
112
231
|
for (let m = 0; m < 256; m += 1)
|
|
113
|
-
d += m / 255 *
|
|
114
|
-
let
|
|
232
|
+
d += m / 255 * n[m];
|
|
233
|
+
let S = 0;
|
|
115
234
|
for (let m = 0; m < 256; m += 1) {
|
|
116
235
|
const T = m / 255 - d;
|
|
117
|
-
|
|
236
|
+
S += n[m] * T * T;
|
|
118
237
|
}
|
|
119
|
-
const
|
|
238
|
+
const E = Math.sqrt(S), b = p - c, g = v - f, x = we(n);
|
|
120
239
|
return {
|
|
121
240
|
mean: d,
|
|
122
|
-
stdDev:
|
|
241
|
+
stdDev: E,
|
|
123
242
|
p5: c,
|
|
124
243
|
p25: f,
|
|
125
244
|
median: u,
|
|
126
|
-
p75:
|
|
245
|
+
p75: v,
|
|
127
246
|
p95: p,
|
|
128
|
-
effectiveRange:
|
|
247
|
+
effectiveRange: b,
|
|
129
248
|
iqr: g,
|
|
130
|
-
bimodality:
|
|
131
|
-
histogram:
|
|
249
|
+
bimodality: x,
|
|
250
|
+
histogram: n
|
|
132
251
|
};
|
|
133
252
|
}
|
|
134
|
-
function
|
|
253
|
+
function Se(s) {
|
|
135
254
|
if (s.effectiveRange < 0.05 || s.stdDev < 0.02)
|
|
136
|
-
return { ...
|
|
137
|
-
const t = s.effectiveRange - 0.5, e = s.bimodality - 0.4,
|
|
255
|
+
return { ...Ee };
|
|
256
|
+
const t = s.effectiveRange - 0.5, e = s.bimodality - 0.4, n = H(
|
|
138
257
|
0.05 - t * 0.03 + e * 0.01,
|
|
139
258
|
0.035,
|
|
140
259
|
0.065
|
|
141
|
-
),
|
|
260
|
+
), i = H(s.p5 - 0.03, 0, 0.25), r = H(s.p95 + 0.03, 0.75, 1), o = H((n - 0.03) / 0.05, 0, 1), l = H(0.6 - o * 0.25, 0.35, 0.6), a = H(0.6 - t * 0.2, 0.5, 0.7), h = H(0.4 + t * 0.2, 0.25, 0.5), c = 16, f = H(n + 0.03, 0.06, 0.1);
|
|
142
261
|
return {
|
|
143
|
-
parallaxStrength:
|
|
144
|
-
contrastLow:
|
|
262
|
+
parallaxStrength: n,
|
|
263
|
+
contrastLow: i,
|
|
145
264
|
contrastHigh: r,
|
|
146
265
|
verticalReduction: l,
|
|
147
266
|
dofStart: a,
|
|
@@ -150,7 +269,7 @@ function se(s) {
|
|
|
150
269
|
overscanPadding: f
|
|
151
270
|
};
|
|
152
271
|
}
|
|
153
|
-
function
|
|
272
|
+
function ye(s) {
|
|
154
273
|
if (s <= 0) return [];
|
|
155
274
|
if (s === 1) return [0];
|
|
156
275
|
const t = s - 1, e = [
|
|
@@ -159,37 +278,37 @@ function oe(s) {
|
|
|
159
278
|
Math.floor(s / 2),
|
|
160
279
|
Math.floor(3 * s / 4),
|
|
161
280
|
t
|
|
162
|
-
],
|
|
281
|
+
], n = /* @__PURE__ */ new Set(), i = [];
|
|
163
282
|
for (const r of e)
|
|
164
|
-
|
|
165
|
-
return
|
|
283
|
+
n.has(r) || (n.add(r), i.push(r));
|
|
284
|
+
return i;
|
|
166
285
|
}
|
|
167
|
-
function
|
|
286
|
+
function nt(s, t) {
|
|
168
287
|
for (let e = 0; e < 256; e += 1)
|
|
169
288
|
if (s[e] >= t)
|
|
170
289
|
return e / 255;
|
|
171
290
|
return 1;
|
|
172
291
|
}
|
|
173
|
-
function
|
|
292
|
+
function we(s) {
|
|
174
293
|
const t = new Float32Array(256);
|
|
175
294
|
for (let u = 0; u < 256; u += 1) {
|
|
176
|
-
let
|
|
295
|
+
let v = 0, p = 0;
|
|
177
296
|
for (let d = u - 2; d <= u + 2; d += 1)
|
|
178
|
-
d >= 0 && d < 256 && (
|
|
179
|
-
t[u] =
|
|
297
|
+
d >= 0 && d < 256 && (v += s[d], p += 1);
|
|
298
|
+
t[u] = v / p;
|
|
180
299
|
}
|
|
181
300
|
let e = 0;
|
|
182
301
|
for (let u = 0; u < 256; u += 1)
|
|
183
302
|
e += t[u];
|
|
184
303
|
e /= 256;
|
|
185
|
-
const
|
|
304
|
+
const n = e * 2, i = 25, r = [];
|
|
186
305
|
for (let u = 1; u < 255; u += 1)
|
|
187
|
-
t[u] > t[u - 1] && t[u] > t[u + 1] && t[u] >=
|
|
188
|
-
if (t[0] > t[1] && t[0] >=
|
|
306
|
+
t[u] > t[u - 1] && t[u] > t[u + 1] && t[u] >= n && r.push({ bin: u, height: t[u] });
|
|
307
|
+
if (t[0] > t[1] && t[0] >= n && r.push({ bin: 0, height: t[0] }), t[255] > t[254] && t[255] >= n && r.push({ bin: 255, height: t[255] }), r.sort((u, v) => v.height - u.height), r.length < 2) return 0;
|
|
189
308
|
const o = r[0];
|
|
190
309
|
let l = null;
|
|
191
310
|
for (let u = 1; u < r.length; u += 1)
|
|
192
|
-
if (Math.abs(r[u].bin - o.bin) >=
|
|
311
|
+
if (Math.abs(r[u].bin - o.bin) >= i) {
|
|
193
312
|
l = r[u];
|
|
194
313
|
break;
|
|
195
314
|
}
|
|
@@ -201,7 +320,7 @@ function ae(s) {
|
|
|
201
320
|
const f = Math.min(o.height, l.height);
|
|
202
321
|
return f <= 0 ? 0 : H(1 - c / f, 0, 1);
|
|
203
322
|
}
|
|
204
|
-
function
|
|
323
|
+
function Ft(s) {
|
|
205
324
|
return {
|
|
206
325
|
mean: 0,
|
|
207
326
|
stdDev: 0,
|
|
@@ -220,32 +339,32 @@ function H(s, t, e) {
|
|
|
220
339
|
return Math.min(e, Math.max(t, s));
|
|
221
340
|
}
|
|
222
341
|
function G(s, t, e) {
|
|
223
|
-
const
|
|
224
|
-
if (!
|
|
225
|
-
if (s.shaderSource(
|
|
226
|
-
const
|
|
227
|
-
throw s.deleteShader(
|
|
228
|
-
${
|
|
342
|
+
const n = s.createShader(t);
|
|
343
|
+
if (!n) throw new Error("Failed to create shader.");
|
|
344
|
+
if (s.shaderSource(n, e), s.compileShader(n), !s.getShaderParameter(n, s.COMPILE_STATUS)) {
|
|
345
|
+
const i = s.getShaderInfoLog(n) ?? "";
|
|
346
|
+
throw s.deleteShader(n), new Error(`Shader compilation failed:
|
|
347
|
+
${i}`);
|
|
229
348
|
}
|
|
230
|
-
return
|
|
231
|
-
}
|
|
232
|
-
function mt(s, t, e) {
|
|
233
|
-
const i = s.createProgram();
|
|
234
|
-
if (!i) throw new Error("Failed to create program.");
|
|
235
|
-
if (s.attachShader(i, t), s.attachShader(i, e), s.linkProgram(i), !s.getProgramParameter(i, s.LINK_STATUS)) {
|
|
236
|
-
const n = s.getProgramInfoLog(i) ?? "";
|
|
237
|
-
throw s.deleteProgram(i), new Error(`Program linking failed:
|
|
238
|
-
${n}`);
|
|
239
|
-
}
|
|
240
|
-
return s.detachShader(i, t), s.detachShader(i, e), s.deleteShader(t), s.deleteShader(e), i;
|
|
349
|
+
return n;
|
|
241
350
|
}
|
|
242
351
|
function pt(s, t, e) {
|
|
243
|
-
const
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
352
|
+
const n = s.createProgram();
|
|
353
|
+
if (!n) throw new Error("Failed to create program.");
|
|
354
|
+
if (s.attachShader(n, t), s.attachShader(n, e), s.linkProgram(n), !s.getProgramParameter(n, s.LINK_STATUS)) {
|
|
355
|
+
const i = s.getProgramInfoLog(n) ?? "";
|
|
356
|
+
throw s.deleteProgram(n), new Error(`Program linking failed:
|
|
357
|
+
${i}`);
|
|
358
|
+
}
|
|
359
|
+
return s.detachShader(n, t), s.detachShader(n, e), s.deleteShader(t), s.deleteShader(e), n;
|
|
360
|
+
}
|
|
361
|
+
function gt(s, t, e) {
|
|
362
|
+
const n = {};
|
|
363
|
+
for (const i of e)
|
|
364
|
+
n[i] = s.getUniformLocation(t, i);
|
|
365
|
+
return n;
|
|
247
366
|
}
|
|
248
|
-
const
|
|
367
|
+
const Re = new Float32Array([
|
|
249
368
|
-1,
|
|
250
369
|
-1,
|
|
251
370
|
1,
|
|
@@ -255,16 +374,16 @@ const le = new Float32Array([
|
|
|
255
374
|
1,
|
|
256
375
|
1
|
|
257
376
|
]);
|
|
258
|
-
function
|
|
377
|
+
function Xt(s, t) {
|
|
259
378
|
const e = s.createVertexArray();
|
|
260
379
|
if (!e) throw new Error("Failed to create VAO.");
|
|
261
380
|
s.bindVertexArray(e);
|
|
262
|
-
const
|
|
263
|
-
s.bindBuffer(s.ARRAY_BUFFER,
|
|
264
|
-
const
|
|
265
|
-
return s.enableVertexAttribArray(
|
|
381
|
+
const n = s.createBuffer();
|
|
382
|
+
s.bindBuffer(s.ARRAY_BUFFER, n), s.bufferData(s.ARRAY_BUFFER, Re, s.STATIC_DRAW);
|
|
383
|
+
const i = s.getAttribLocation(t, "aPosition");
|
|
384
|
+
return s.enableVertexAttribArray(i), s.vertexAttribPointer(i, 2, s.FLOAT, !1, 0, 0), s.bindVertexArray(null), e;
|
|
266
385
|
}
|
|
267
|
-
class
|
|
386
|
+
class Gt {
|
|
268
387
|
slots = /* @__PURE__ */ new Map();
|
|
269
388
|
nextUnit = 0;
|
|
270
389
|
/**
|
|
@@ -300,8 +419,8 @@ class Ht {
|
|
|
300
419
|
return this.slots.size;
|
|
301
420
|
}
|
|
302
421
|
}
|
|
303
|
-
function
|
|
304
|
-
const r = G(s, s.VERTEX_SHADER, e), o = G(s, s.FRAGMENT_SHADER,
|
|
422
|
+
function k(s, t, e, n, i) {
|
|
423
|
+
const r = G(s, s.VERTEX_SHADER, e), o = G(s, s.FRAGMENT_SHADER, n), l = pt(s, r, o), a = gt(s, l, i);
|
|
305
424
|
return {
|
|
306
425
|
name: t,
|
|
307
426
|
program: l,
|
|
@@ -311,8 +430,8 @@ function O(s, t, e, i, n) {
|
|
|
311
430
|
}
|
|
312
431
|
};
|
|
313
432
|
}
|
|
314
|
-
function
|
|
315
|
-
const o = G(s, s.VERTEX_SHADER, e), l = G(s, s.FRAGMENT_SHADER,
|
|
433
|
+
function Ct(s, t, e, n, i, r) {
|
|
434
|
+
const o = G(s, s.VERTEX_SHADER, e), l = G(s, s.FRAGMENT_SHADER, n), a = pt(s, o, l), h = gt(s, a, i), c = {
|
|
316
435
|
texture: null,
|
|
317
436
|
unit: r.textureUnit,
|
|
318
437
|
attachment: s.COLOR_ATTACHMENT0
|
|
@@ -324,12 +443,12 @@ function Dt(s, t, e, i, n, r) {
|
|
|
324
443
|
outputs: [c],
|
|
325
444
|
width: 0,
|
|
326
445
|
height: 0,
|
|
327
|
-
resize(u,
|
|
328
|
-
f.fbo && u.deleteFramebuffer(f.fbo), c.texture && u.deleteTexture(c.texture), f.width =
|
|
446
|
+
resize(u, v, p) {
|
|
447
|
+
f.fbo && u.deleteFramebuffer(f.fbo), c.texture && u.deleteTexture(c.texture), f.width = v, f.height = p, c.texture = u.createTexture(), u.activeTexture(u.TEXTURE0 + c.unit), u.bindTexture(u.TEXTURE_2D, c.texture), u.texParameteri(u.TEXTURE_2D, u.TEXTURE_MIN_FILTER, u.LINEAR), u.texParameteri(u.TEXTURE_2D, u.TEXTURE_MAG_FILTER, u.LINEAR), u.texParameteri(u.TEXTURE_2D, u.TEXTURE_WRAP_S, u.CLAMP_TO_EDGE), u.texParameteri(u.TEXTURE_2D, u.TEXTURE_WRAP_T, u.CLAMP_TO_EDGE), u.texImage2D(
|
|
329
448
|
u.TEXTURE_2D,
|
|
330
449
|
0,
|
|
331
450
|
r.internalFormat,
|
|
332
|
-
|
|
451
|
+
v,
|
|
333
452
|
p,
|
|
334
453
|
0,
|
|
335
454
|
r.format,
|
|
@@ -349,7 +468,7 @@ function Dt(s, t, e, i, n, r) {
|
|
|
349
468
|
};
|
|
350
469
|
return r.width > 0 && r.height > 0 && f.resize(s, r.width, r.height), f;
|
|
351
470
|
}
|
|
352
|
-
const
|
|
471
|
+
const Ae = {
|
|
353
472
|
high: {
|
|
354
473
|
dprCap: 2,
|
|
355
474
|
depthMaxDim: 512,
|
|
@@ -372,22 +491,22 @@ const ue = {
|
|
|
372
491
|
jfaDivisor: 4
|
|
373
492
|
}
|
|
374
493
|
};
|
|
375
|
-
function
|
|
494
|
+
function Pe(s) {
|
|
376
495
|
let t = "unknown";
|
|
377
496
|
const e = s.getExtension("WEBGL_debug_renderer_info");
|
|
378
497
|
e && (t = s.getParameter(e.UNMASKED_RENDERER_WEBGL) || "unknown");
|
|
379
|
-
const
|
|
498
|
+
const n = s.getParameter(s.MAX_TEXTURE_SIZE), i = typeof navigator < "u" && navigator.hardwareConcurrency || 0, r = typeof navigator < "u" && navigator.deviceMemory || 0, o = typeof window < "u" && window.devicePixelRatio || 1, l = typeof screen < "u" ? (screen.width || 0) * (screen.height || 0) : 0, a = typeof navigator < "u" && ("ontouchstart" in window || navigator.maxTouchPoints > 0), h = l > 0 && l < 1920 * 1080;
|
|
380
499
|
return {
|
|
381
500
|
gpuRenderer: t,
|
|
382
|
-
maxTextureSize:
|
|
383
|
-
hardwareConcurrency:
|
|
501
|
+
maxTextureSize: n,
|
|
502
|
+
hardwareConcurrency: i,
|
|
384
503
|
deviceMemory: r,
|
|
385
504
|
devicePixelRatio: o,
|
|
386
505
|
screenPixels: l,
|
|
387
506
|
isMobile: a && h
|
|
388
507
|
};
|
|
389
508
|
}
|
|
390
|
-
const
|
|
509
|
+
const De = [
|
|
391
510
|
"mali-4",
|
|
392
511
|
"mali-t",
|
|
393
512
|
"adreno 3",
|
|
@@ -400,7 +519,7 @@ const he = [
|
|
|
400
519
|
"llvmpipe",
|
|
401
520
|
"swiftshader",
|
|
402
521
|
"software"
|
|
403
|
-
],
|
|
522
|
+
], Fe = [
|
|
404
523
|
"nvidia",
|
|
405
524
|
"geforce",
|
|
406
525
|
"radeon rx",
|
|
@@ -412,16 +531,16 @@ const he = [
|
|
|
412
531
|
"mali-g7",
|
|
413
532
|
"mali-g6"
|
|
414
533
|
];
|
|
415
|
-
function
|
|
534
|
+
function Ce(s) {
|
|
416
535
|
let t = 0;
|
|
417
|
-
const e = s.gpuRenderer.toLowerCase(),
|
|
418
|
-
return
|
|
536
|
+
const e = s.gpuRenderer.toLowerCase(), n = De.some((r) => e.includes(r)), i = Fe.some((r) => e.includes(r));
|
|
537
|
+
return n && (t -= 30), i && (t += 20), s.maxTextureSize >= 16384 ? t += 10 : s.maxTextureSize >= 8192 ? t += 5 : s.maxTextureSize <= 4096 && (t -= 15), s.hardwareConcurrency >= 8 ? t += 5 : s.hardwareConcurrency >= 4 ? t += 0 : s.hardwareConcurrency > 0 && s.hardwareConcurrency < 4 && (t -= 10), s.deviceMemory >= 8 ? t += 5 : s.deviceMemory >= 4 ? t += 0 : s.deviceMemory > 0 && s.deviceMemory < 4 && (t -= 15), s.isMobile && (t -= 10), t >= 0 ? "high" : t >= -25 ? "medium" : "low";
|
|
419
538
|
}
|
|
420
|
-
function
|
|
421
|
-
const e = t && t !== "auto" ? t :
|
|
422
|
-
return { tier: e, ...
|
|
539
|
+
function Wt(s, t) {
|
|
540
|
+
const e = t && t !== "auto" ? t : Ce(Pe(s));
|
|
541
|
+
return { tier: e, ...Ae[e] };
|
|
423
542
|
}
|
|
424
|
-
class
|
|
543
|
+
class vt {
|
|
425
544
|
static RESIZE_DEBOUNCE_MS = 100;
|
|
426
545
|
// ---- Canvas + container ----
|
|
427
546
|
canvas;
|
|
@@ -452,6 +571,11 @@ class gt {
|
|
|
452
571
|
* The Web Component uses this to dispatch frame events.
|
|
453
572
|
*/
|
|
454
573
|
onVideoFrame = null;
|
|
574
|
+
/**
|
|
575
|
+
* Optional callback invoked when a render loop error causes the loop to stop.
|
|
576
|
+
* The Web Component uses this to dispatch error events.
|
|
577
|
+
*/
|
|
578
|
+
onError = null;
|
|
455
579
|
// ---- Animation & resize ----
|
|
456
580
|
animationFrameHandle = 0;
|
|
457
581
|
/** requestVideoFrameCallback handle (0 = inactive). */
|
|
@@ -482,8 +606,8 @@ class gt {
|
|
|
482
606
|
*
|
|
483
607
|
* For static sources (image) or when RVFC is unavailable, RAF-only.
|
|
484
608
|
*/
|
|
485
|
-
start(t, e,
|
|
486
|
-
this.stop(), this.mediaSource = t, this.readDepth = e, this.readInput =
|
|
609
|
+
start(t, e, n, i) {
|
|
610
|
+
this.stop(), this.mediaSource = t, this.readDepth = e, this.readInput = n, this.onVideoFrame = i ?? null, this.rvfcSupported = t.isLive && typeof t.requestVideoFrameCallback == "function", this.rvfcSupported ? this.rvfcHandle = t.requestVideoFrameCallback(this._videoFrameLoop) : t.isLive || this.onDepthUpdate(t.currentTime), this.animationFrameHandle = window.requestAnimationFrame(this._rafLoop);
|
|
487
611
|
}
|
|
488
612
|
/** Stop both render loops and release callbacks. */
|
|
489
613
|
stop() {
|
|
@@ -527,18 +651,32 @@ class gt {
|
|
|
527
651
|
* Delegates to subclass `onRenderFrame()` for the actual render work.
|
|
528
652
|
*/
|
|
529
653
|
_rafLoop = () => {
|
|
530
|
-
this.animationFrameHandle = window.requestAnimationFrame(this._rafLoop)
|
|
654
|
+
this.animationFrameHandle = window.requestAnimationFrame(this._rafLoop);
|
|
655
|
+
try {
|
|
656
|
+
this.onRenderFrame();
|
|
657
|
+
} catch (t) {
|
|
658
|
+
this.stopLoops();
|
|
659
|
+
const e = t instanceof Error ? t : new Error(String(t));
|
|
660
|
+
console.error("Layershift: render loop stopped due to error.", e), this.onError && this.onError(e);
|
|
661
|
+
}
|
|
531
662
|
};
|
|
532
663
|
/**
|
|
533
664
|
* RVFC callback — fires only when the browser presents a new video frame.
|
|
534
665
|
* Delegates to subclass `onDepthUpdate()` for depth texture upload.
|
|
535
666
|
*/
|
|
536
667
|
_videoFrameLoop = (t, e) => {
|
|
537
|
-
const
|
|
538
|
-
if (!
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
668
|
+
const n = this.mediaSource;
|
|
669
|
+
if (!(!n || !n.requestVideoFrameCallback)) {
|
|
670
|
+
this.rvfcHandle = n.requestVideoFrameCallback(this._videoFrameLoop);
|
|
671
|
+
try {
|
|
672
|
+
const i = e.mediaTime ?? n.currentTime;
|
|
673
|
+
this.onDepthUpdate(i), this.onVideoFrame && this.onVideoFrame(i, e.presentedFrames ?? 0);
|
|
674
|
+
} catch (i) {
|
|
675
|
+
this.stopLoops();
|
|
676
|
+
const r = i instanceof Error ? i : new Error(String(i));
|
|
677
|
+
console.error("Layershift: video frame loop stopped due to error.", r), this.onError && this.onError(r);
|
|
678
|
+
}
|
|
679
|
+
}
|
|
542
680
|
};
|
|
543
681
|
// -----------------------------------------------------------------------
|
|
544
682
|
// Context loss handling
|
|
@@ -565,7 +703,7 @@ class gt {
|
|
|
565
703
|
scheduleResizeRecalculate = () => {
|
|
566
704
|
this.resizeTimer !== null && window.clearTimeout(this.resizeTimer), this.resizeTimer = window.setTimeout(() => {
|
|
567
705
|
this.resizeTimer = null, this.recalculateViewportLayout();
|
|
568
|
-
},
|
|
706
|
+
}, vt.RESIZE_DEBOUNCE_MS);
|
|
569
707
|
};
|
|
570
708
|
/** Read the container's pixel dimensions, with a minimum of 1x1. */
|
|
571
709
|
getViewportSize() {
|
|
@@ -579,14 +717,14 @@ class gt {
|
|
|
579
717
|
* Clamp depth dimensions to the quality tier's maximum and allocate
|
|
580
718
|
* the subsample buffer if needed. Called during `initialize()`.
|
|
581
719
|
*/
|
|
582
|
-
clampDepthDimensions(t, e,
|
|
720
|
+
clampDepthDimensions(t, e, n) {
|
|
583
721
|
this.sourceDepthWidth = t, this.sourceDepthHeight = e;
|
|
584
|
-
let
|
|
585
|
-
if (
|
|
586
|
-
const o =
|
|
587
|
-
|
|
722
|
+
let i = t, r = e;
|
|
723
|
+
if (i > n || r > n) {
|
|
724
|
+
const o = n / Math.max(i, r);
|
|
725
|
+
i = Math.max(1, Math.round(i * o)), r = Math.max(1, Math.round(r * o));
|
|
588
726
|
}
|
|
589
|
-
this.depthWidth =
|
|
727
|
+
this.depthWidth = i, this.depthHeight = r, i !== t || r !== e ? this.depthSubsampleBuffer = new Uint8Array(i * r) : this.depthSubsampleBuffer = null;
|
|
590
728
|
}
|
|
591
729
|
/**
|
|
592
730
|
* CPU nearest-neighbor depth subsampling.
|
|
@@ -596,11 +734,11 @@ class gt {
|
|
|
596
734
|
*/
|
|
597
735
|
subsampleDepth(t) {
|
|
598
736
|
if (!this.depthSubsampleBuffer) return t;
|
|
599
|
-
const e = this.depthSubsampleBuffer,
|
|
737
|
+
const e = this.depthSubsampleBuffer, n = this.sourceDepthWidth, i = this.depthWidth, r = this.depthHeight;
|
|
600
738
|
for (let o = 0; o < r; o++) {
|
|
601
|
-
const a = Math.min(Math.round(o * this.sourceDepthHeight / r), this.sourceDepthHeight - 1) *
|
|
602
|
-
for (let c = 0; c <
|
|
603
|
-
const f = Math.min(Math.round(c *
|
|
739
|
+
const a = Math.min(Math.round(o * this.sourceDepthHeight / r), this.sourceDepthHeight - 1) * n, h = o * i;
|
|
740
|
+
for (let c = 0; c < i; c++) {
|
|
741
|
+
const f = Math.min(Math.round(c * n / i), n - 1);
|
|
604
742
|
e[h + c] = t[a + f];
|
|
605
743
|
}
|
|
606
744
|
}
|
|
@@ -617,14 +755,14 @@ class gt {
|
|
|
617
755
|
* Updates `this.uvOffset` and `this.uvScale`.
|
|
618
756
|
*/
|
|
619
757
|
computeCoverFitUV(t, e) {
|
|
620
|
-
const { width:
|
|
758
|
+
const { width: n, height: i } = this.getViewportSize(), r = n / i, o = t + e;
|
|
621
759
|
let l = 1, a = 1;
|
|
622
760
|
r > this.videoAspect ? a = this.videoAspect / r : l = r / this.videoAspect;
|
|
623
761
|
const h = 1 + o * 2;
|
|
624
762
|
l /= h, a /= h, this.uvOffset = [(1 - l) / 2, (1 - a) / 2], this.uvScale = [l, a], this.isCameraSource && (this.uvOffset[0] += this.uvScale[0], this.uvScale[0] = -this.uvScale[0]);
|
|
625
763
|
}
|
|
626
764
|
}
|
|
627
|
-
const
|
|
765
|
+
const Ue = `#version 300 es
|
|
628
766
|
in vec2 aPosition;
|
|
629
767
|
|
|
630
768
|
// UV coordinates for cover-fit + overscan.
|
|
@@ -645,7 +783,7 @@ void main() {
|
|
|
645
783
|
vScreenUv = baseUv;
|
|
646
784
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
647
785
|
}
|
|
648
|
-
`,
|
|
786
|
+
`, St = `#version 300 es
|
|
649
787
|
in vec2 aPosition;
|
|
650
788
|
out vec2 vUv;
|
|
651
789
|
|
|
@@ -653,7 +791,7 @@ void main() {
|
|
|
653
791
|
vUv = aPosition * 0.5 + 0.5;
|
|
654
792
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
655
793
|
}
|
|
656
|
-
`,
|
|
794
|
+
`, Le = `#version 300 es
|
|
657
795
|
precision highp float;
|
|
658
796
|
|
|
659
797
|
// BILATERAL_RADIUS is injected as a #define at compile time.
|
|
@@ -691,7 +829,7 @@ void main() {
|
|
|
691
829
|
|
|
692
830
|
fragColor = vec4(totalDepth / totalWeight, 0.0, 0.0, 1.0);
|
|
693
831
|
}
|
|
694
|
-
`,
|
|
832
|
+
`, _e = `#version 300 es
|
|
695
833
|
precision highp float;
|
|
696
834
|
|
|
697
835
|
// ---- Uniforms ----
|
|
@@ -1078,7 +1216,7 @@ void main() {
|
|
|
1078
1216
|
|
|
1079
1217
|
fragColor = color;
|
|
1080
1218
|
}
|
|
1081
|
-
`,
|
|
1219
|
+
`, Ut = `#version 300 es
|
|
1082
1220
|
precision highp float;
|
|
1083
1221
|
|
|
1084
1222
|
// Separable glow blur — 7-tap box filter.
|
|
@@ -1143,18 +1281,18 @@ void main() {
|
|
|
1143
1281
|
tiltHalfTanFov: Math.tan(50 * Math.PI / 360),
|
|
1144
1282
|
tiltTransitionWidth: 0.3 * 4.5,
|
|
1145
1283
|
tiltPeakIntensity: 0.8
|
|
1146
|
-
},
|
|
1284
|
+
}, Ie = ["uRawDepth", "uTexelSize", "uSpatialSigma2"], Me = {
|
|
1147
1285
|
2: 2.25,
|
|
1148
1286
|
// 1.5²
|
|
1149
1287
|
1: 0.5625
|
|
1150
1288
|
// 0.75²
|
|
1151
1289
|
};
|
|
1152
|
-
function
|
|
1153
|
-
const e =
|
|
1290
|
+
function Be(s, t) {
|
|
1291
|
+
const e = Le.replace(
|
|
1154
1292
|
"#version 300 es",
|
|
1155
1293
|
`#version 300 es
|
|
1156
1294
|
#define BILATERAL_RADIUS ${t}`
|
|
1157
|
-
),
|
|
1295
|
+
), n = G(s, s.VERTEX_SHADER, St), i = G(s, s.FRAGMENT_SHADER, e), r = pt(s, n, i), o = gt(s, r, Ie), l = Me[t] ?? 2.25;
|
|
1158
1296
|
let a = null;
|
|
1159
1297
|
const h = {
|
|
1160
1298
|
name: "bilateral-filter",
|
|
@@ -1166,16 +1304,16 @@ function Te(s, t) {
|
|
|
1166
1304
|
height: 0,
|
|
1167
1305
|
resize(c, f, u) {
|
|
1168
1306
|
},
|
|
1169
|
-
initFBO(c, f, u,
|
|
1170
|
-
a && c.deleteFramebuffer(a), h.width = u, h.height =
|
|
1307
|
+
initFBO(c, f, u, v) {
|
|
1308
|
+
a && c.deleteFramebuffer(a), h.width = u, h.height = v, a = c.createFramebuffer(), h.fbo = a, c.bindFramebuffer(c.FRAMEBUFFER, a), c.framebufferTexture2D(
|
|
1171
1309
|
c.FRAMEBUFFER,
|
|
1172
1310
|
c.COLOR_ATTACHMENT0,
|
|
1173
1311
|
c.TEXTURE_2D,
|
|
1174
1312
|
f,
|
|
1175
1313
|
0
|
|
1176
|
-
), c.bindFramebuffer(c.FRAMEBUFFER, null), c.useProgram(r), c.uniform1i(o.uRawDepth, 2), c.uniform2f(o.uTexelSize, 1 / u, 1 /
|
|
1314
|
+
), c.bindFramebuffer(c.FRAMEBUFFER, null), c.useProgram(r), c.uniform1i(o.uRawDepth, 2), c.uniform2f(o.uTexelSize, 1 / u, 1 / v), c.uniform1f(o.uSpatialSigma2, l);
|
|
1177
1315
|
},
|
|
1178
|
-
execute(c, f, u,
|
|
1316
|
+
execute(c, f, u, v, p, d, S, E) {
|
|
1179
1317
|
a && (c.activeTexture(c.TEXTURE2), c.bindTexture(c.TEXTURE_2D, u), c.texSubImage2D(
|
|
1180
1318
|
c.TEXTURE_2D,
|
|
1181
1319
|
0,
|
|
@@ -1185,8 +1323,8 @@ function Te(s, t) {
|
|
|
1185
1323
|
d,
|
|
1186
1324
|
c.RED,
|
|
1187
1325
|
c.UNSIGNED_BYTE,
|
|
1188
|
-
|
|
1189
|
-
), c.bindFramebuffer(c.FRAMEBUFFER, a), c.viewport(0, 0, p, d), c.useProgram(r), c.bindVertexArray(f), c.drawArrays(c.TRIANGLE_STRIP, 0, 4), c.bindFramebuffer(c.FRAMEBUFFER, null), c.viewport(0, 0,
|
|
1326
|
+
v
|
|
1327
|
+
), c.bindFramebuffer(c.FRAMEBUFFER, a), c.viewport(0, 0, p, d), c.useProgram(r), c.bindVertexArray(f), c.drawArrays(c.TRIANGLE_STRIP, 0, 4), c.bindFramebuffer(c.FRAMEBUFFER, null), c.viewport(0, 0, S, E));
|
|
1190
1328
|
},
|
|
1191
1329
|
dispose(c) {
|
|
1192
1330
|
a && (c.deleteFramebuffer(a), a = null, h.fbo = null), c.deleteProgram(r);
|
|
@@ -1194,7 +1332,7 @@ function Te(s, t) {
|
|
|
1194
1332
|
};
|
|
1195
1333
|
return h;
|
|
1196
1334
|
}
|
|
1197
|
-
const
|
|
1335
|
+
const Ve = [
|
|
1198
1336
|
"uImage",
|
|
1199
1337
|
"uDepth",
|
|
1200
1338
|
"uOffset",
|
|
@@ -1233,29 +1371,29 @@ const Ee = [
|
|
|
1233
1371
|
"uTiltPeakIntensity",
|
|
1234
1372
|
"uTiltPlaneNormal",
|
|
1235
1373
|
"uTiltPlaneD"
|
|
1236
|
-
],
|
|
1237
|
-
function
|
|
1238
|
-
const t =
|
|
1374
|
+
], Oe = 64;
|
|
1375
|
+
function ke(s) {
|
|
1376
|
+
const t = _e.replace(
|
|
1239
1377
|
"#version 300 es",
|
|
1240
1378
|
`#version 300 es
|
|
1241
|
-
#define MAX_POM_STEPS ${
|
|
1242
|
-
), e = G(s, s.VERTEX_SHADER,
|
|
1379
|
+
#define MAX_POM_STEPS ${Oe}`
|
|
1380
|
+
), e = G(s, s.VERTEX_SHADER, Ue), n = G(s, s.FRAGMENT_SHADER, t), i = pt(s, e, n), r = gt(s, i, Ve);
|
|
1243
1381
|
return {
|
|
1244
1382
|
name: "depth-effect",
|
|
1245
|
-
program:
|
|
1383
|
+
program: i,
|
|
1246
1384
|
uniforms: r,
|
|
1247
1385
|
setStaticUniforms(o, l, a, h) {
|
|
1248
|
-
o.useProgram(
|
|
1386
|
+
o.useProgram(i), o.uniform1i(r.uImage, 0), o.uniform1i(r.uDepth, 1), o.uniform1f(r.uStrength, l.parallaxStrength), o.uniform1i(r.uPomEnabled, l.pomEnabled ? 1 : 0), o.uniform1i(r.uPomSteps, l.pomSteps), o.uniform1f(r.uContrastLow, l.contrastLow), o.uniform1f(r.uContrastHigh, l.contrastHigh), o.uniform1f(r.uVerticalReduction, l.verticalReduction), o.uniform1f(r.uDofStart, l.dofStart), o.uniform1f(r.uDofStrength, l.dofStrength), o.uniform2f(r.uImageTexelSize, 1 / a, 1 / h), o.uniform1i(r.uDisplacementCurve, 3), o.uniform1i(r.uBlurCurve, 4), o.uniform1i(r.uCurvesEnabled, 0), o.uniform1f(r.uBlurRadius, l.blurRadius), o.uniform1f(r.uFocalBandOffset, 0), o.uniform1i(r.uGlowCurve, 5), o.uniform1i(r.uGlowEnabled, 0), o.uniform3f(r.uGlowColor, l.glowColor[0], l.glowColor[1], l.glowColor[2]), o.uniform1f(r.uGlowRadius, l.glowRadius), o.uniform1f(r.uGlowSoftness, l.glowSoftness), o.uniform1i(r.uGlowBlurred, 8), o.uniform1i(r.uColorShiftCurve, 6), o.uniform1i(r.uColorShiftEnabled, 0), o.uniform1f(r.uColorShiftHue, 0), o.uniform1f(r.uColorShiftSaturation, 1), o.uniform1f(r.uColorShiftBrightness, 1), o.uniform1f(r.uColorShiftTintStrength, 0), o.uniform3f(r.uColorShiftTintColor, 0.7, 0.8, 0.9), o.uniform1i(r.uTiltEnabled, l.tiltEnabled ? 1 : 0), o.uniform1f(r.uTiltHalfTanFov, l.tiltHalfTanFov), o.uniform1f(r.uTiltTransitionWidth, l.tiltTransitionWidth), o.uniform1f(r.uTiltPeakIntensity, l.tiltPeakIntensity), o.uniform3f(r.uTiltPlaneNormal, 0, 0, 1), o.uniform1f(r.uTiltPlaneD, 2.75);
|
|
1249
1387
|
},
|
|
1250
1388
|
updateUvTransform(o, l, a) {
|
|
1251
|
-
o.useProgram(
|
|
1389
|
+
o.useProgram(i), o.uniform2f(r.uUvOffset, l[0], l[1]), o.uniform2f(r.uUvScale, a[0], a[1]);
|
|
1252
1390
|
},
|
|
1253
1391
|
dispose(o) {
|
|
1254
|
-
o.deleteProgram(
|
|
1392
|
+
o.deleteProgram(i);
|
|
1255
1393
|
}
|
|
1256
1394
|
};
|
|
1257
1395
|
}
|
|
1258
|
-
class
|
|
1396
|
+
class He extends vt {
|
|
1259
1397
|
// ---- Shared GPU resources ----
|
|
1260
1398
|
gl = null;
|
|
1261
1399
|
quadVao = null;
|
|
@@ -1263,7 +1401,7 @@ class ye extends gt {
|
|
|
1263
1401
|
bilateralPass = null;
|
|
1264
1402
|
effectPass = null;
|
|
1265
1403
|
// ---- Texture registry (init-time allocation, zero per-frame overhead) ----
|
|
1266
|
-
textures = new
|
|
1404
|
+
textures = new Gt();
|
|
1267
1405
|
videoSlot;
|
|
1268
1406
|
filteredDepthSlot;
|
|
1269
1407
|
rawDepthSlot;
|
|
@@ -1307,14 +1445,14 @@ class ye extends gt {
|
|
|
1307
1445
|
tiltTransitionWidth: e.tiltTransitionWidth ?? B.tiltTransitionWidth,
|
|
1308
1446
|
tiltPeakIntensity: e.tiltPeakIntensity ?? B.tiltPeakIntensity
|
|
1309
1447
|
};
|
|
1310
|
-
const
|
|
1448
|
+
const n = this.canvas.getContext("webgl2", {
|
|
1311
1449
|
antialias: !1,
|
|
1312
1450
|
alpha: !1,
|
|
1313
1451
|
desynchronized: !0,
|
|
1314
1452
|
powerPreference: "high-performance"
|
|
1315
1453
|
});
|
|
1316
|
-
if (!
|
|
1317
|
-
this.gl =
|
|
1454
|
+
if (!n) throw new Error("WebGL 2 is not supported.");
|
|
1455
|
+
this.gl = n, this.qualityParams = Wt(n, e.quality), "drawingBufferColorSpace" in n && (n.drawingBufferColorSpace = "srgb"), n.clearColor(0, 0, 0, 1), n.pixelStorei(n.UNPACK_FLIP_Y_WEBGL, !0), this.initGPUResources(), this.setupResizeHandling();
|
|
1318
1456
|
}
|
|
1319
1457
|
/**
|
|
1320
1458
|
* Set up the scene: create video texture, depth textures + FBO, and
|
|
@@ -1327,14 +1465,14 @@ class ye extends gt {
|
|
|
1327
1465
|
* @param depthWidth - Width of the precomputed depth map (e.g. 512).
|
|
1328
1466
|
* @param depthHeight - Height of the precomputed depth map (e.g. 512).
|
|
1329
1467
|
*/
|
|
1330
|
-
initialize(t, e,
|
|
1331
|
-
const
|
|
1332
|
-
if (
|
|
1333
|
-
if (this.disposeTextures(), this.isCameraSource = t.type === "camera", this.videoAspect = t.width / t.height, this.clampDepthDimensions(e,
|
|
1468
|
+
initialize(t, e, n) {
|
|
1469
|
+
const i = this.gl;
|
|
1470
|
+
if (i) {
|
|
1471
|
+
if (this.disposeTextures(), this.isCameraSource = t.type === "camera", this.videoAspect = t.width / t.height, this.clampDepthDimensions(e, n, this.qualityParams.depthMaxDim), this.videoSlot.texture = i.createTexture(), i.activeTexture(i.TEXTURE0 + this.videoSlot.unit), i.bindTexture(i.TEXTURE_2D, this.videoSlot.texture), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MIN_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MAG_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_S, i.CLAMP_TO_EDGE), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_T, i.CLAMP_TO_EDGE), this.rawDepthSlot.texture = i.createTexture(), i.activeTexture(i.TEXTURE0 + this.rawDepthSlot.unit), i.bindTexture(i.TEXTURE_2D, this.rawDepthSlot.texture), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MIN_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MAG_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_S, i.CLAMP_TO_EDGE), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_T, i.CLAMP_TO_EDGE), i.texStorage2D(i.TEXTURE_2D, 1, i.R8, e, n), this.filteredDepthSlot.texture = i.createTexture(), i.activeTexture(i.TEXTURE0 + this.filteredDepthSlot.unit), i.bindTexture(i.TEXTURE_2D, this.filteredDepthSlot.texture), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MIN_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MAG_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_S, i.CLAMP_TO_EDGE), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_T, i.CLAMP_TO_EDGE), i.texStorage2D(i.TEXTURE_2D, 1, i.R8, e, n), this.bilateralPass && this.filteredDepthSlot.texture && this.bilateralPass.initFBO(i, this.filteredDepthSlot.texture, e, n), this.glowBlurHPass && this.glowBlurVPass) {
|
|
1334
1472
|
const r = this.depthWidth, o = this.depthHeight;
|
|
1335
|
-
this.glowBlurHPass.resize(
|
|
1473
|
+
this.glowBlurHPass.resize(i, r, o), this.glowBlurVPass.resize(i, r, o), this.glowBlurHorizSlot.texture = this.glowBlurHPass.outputs[0].texture, this.glowBlurResultSlot.texture = this.glowBlurVPass.outputs[0].texture, i.useProgram(this.glowBlurHPass.program), i.uniform1i(this.glowBlurHPass.uniforms.uDepth, this.filteredDepthSlot.unit), i.uniform1i(this.glowBlurHPass.uniforms.uGlowCurve, this.glowLutSlot.unit), i.uniform2f(this.glowBlurHPass.uniforms.uBlurDir, 1, 0), i.uniform2f(this.glowBlurHPass.uniforms.uTexelSize, 1 / r, 1 / o), i.uniform1f(this.glowBlurHPass.uniforms.uGlowRadius, this.config.glowRadius), i.useProgram(this.glowBlurVPass.program), i.uniform1i(this.glowBlurVPass.uniforms.uHorizResult, this.glowBlurHorizSlot.unit), i.uniform2f(this.glowBlurVPass.uniforms.uBlurDir, 0, 1), i.uniform2f(this.glowBlurVPass.uniforms.uTexelSize, 1 / r, 1 / o), i.uniform1f(this.glowBlurVPass.uniforms.uGlowRadius, this.config.glowRadius);
|
|
1336
1474
|
}
|
|
1337
|
-
this.effectPass && this.effectPass.setStaticUniforms(
|
|
1475
|
+
this.effectPass && this.effectPass.setStaticUniforms(i, this.config, t.width, t.height), this.recalculateViewportLayout();
|
|
1338
1476
|
}
|
|
1339
1477
|
}
|
|
1340
1478
|
/**
|
|
@@ -1349,18 +1487,18 @@ class ye extends gt {
|
|
|
1349
1487
|
const e = this.gl;
|
|
1350
1488
|
if (!e || !this.effectPass) return;
|
|
1351
1489
|
t.parallaxStrength !== void 0 && (this.config.parallaxStrength = t.parallaxStrength), t.pomEnabled !== void 0 && (this.config.pomEnabled = t.pomEnabled), t.pomSteps !== void 0 && (this.config.pomSteps = t.pomSteps), t.overscanPadding !== void 0 && (this.config.overscanPadding = t.overscanPadding), t.contrastLow !== void 0 && (this.config.contrastLow = t.contrastLow), t.contrastHigh !== void 0 && (this.config.contrastHigh = t.contrastHigh), t.verticalReduction !== void 0 && (this.config.verticalReduction = t.verticalReduction), t.dofStart !== void 0 && (this.config.dofStart = t.dofStart), t.dofStrength !== void 0 && (this.config.dofStrength = t.dofStrength), t.blurRadius !== void 0 && (this.config.blurRadius = t.blurRadius), t.glowColor !== void 0 && (this.config.glowColor = t.glowColor), t.glowRadius !== void 0 && (this.config.glowRadius = t.glowRadius), t.glowSoftness !== void 0 && (this.config.glowSoftness = t.glowSoftness), t.tiltEnabled !== void 0 && (this.config.tiltEnabled = t.tiltEnabled), t.tiltHalfTanFov !== void 0 && (this.config.tiltHalfTanFov = t.tiltHalfTanFov), t.tiltTransitionWidth !== void 0 && (this.config.tiltTransitionWidth = t.tiltTransitionWidth), t.tiltPeakIntensity !== void 0 && (this.config.tiltPeakIntensity = t.tiltPeakIntensity);
|
|
1352
|
-
const { uniforms:
|
|
1353
|
-
e.useProgram(
|
|
1490
|
+
const { uniforms: n, program: i } = this.effectPass;
|
|
1491
|
+
e.useProgram(i), e.uniform1f(n.uStrength, this.config.parallaxStrength), e.uniform1i(n.uPomEnabled, this.config.pomEnabled ? 1 : 0), e.uniform1i(n.uPomSteps, this.config.pomSteps), e.uniform1f(n.uContrastLow, this.config.contrastLow), e.uniform1f(n.uContrastHigh, this.config.contrastHigh), e.uniform1f(n.uVerticalReduction, this.config.verticalReduction), e.uniform1f(n.uDofStart, this.config.dofStart), e.uniform1f(n.uDofStrength, this.config.dofStrength), e.uniform1f(n.uBlurRadius, this.config.blurRadius), e.uniform3f(n.uGlowColor, this.config.glowColor[0], this.config.glowColor[1], this.config.glowColor[2]), e.uniform1f(n.uGlowRadius, this.config.glowRadius), e.uniform1f(n.uGlowSoftness, this.config.glowSoftness), e.uniform1i(n.uTiltEnabled, this.config.tiltEnabled ? 1 : 0), e.uniform1f(n.uTiltHalfTanFov, this.config.tiltHalfTanFov), e.uniform1f(n.uTiltTransitionWidth, this.config.tiltTransitionWidth), e.uniform1f(n.uTiltPeakIntensity, this.config.tiltPeakIntensity), t.glowRadius !== void 0 && (this.glowBlurHPass && (e.useProgram(this.glowBlurHPass.program), e.uniform1f(this.glowBlurHPass.uniforms.uGlowRadius, this.config.glowRadius)), this.glowBlurVPass && (e.useProgram(this.glowBlurVPass.program), e.uniform1f(this.glowBlurVPass.uniforms.uGlowRadius, this.config.glowRadius)), this.refreshGlowBlur()), (t.parallaxStrength !== void 0 || t.overscanPadding !== void 0) && this.recalculateViewportLayout();
|
|
1354
1492
|
}
|
|
1355
1493
|
/**
|
|
1356
1494
|
* Upload new curve LUT data to the GPU.
|
|
1357
1495
|
* Call this whenever the curve editor changes.
|
|
1358
1496
|
*/
|
|
1359
|
-
updateCurveLUTs(t, e,
|
|
1497
|
+
updateCurveLUTs(t, e, n, i, r) {
|
|
1360
1498
|
const o = this.gl;
|
|
1361
1499
|
if (!o || !this.effectPass) return;
|
|
1362
|
-
const l = !!(t || e), a = !!
|
|
1363
|
-
t && this.uploadLUT(this.displacementLutSlot, t), e && this.uploadLUT(this.blurLutSlot, e),
|
|
1500
|
+
const l = !!(t || e), a = !!n, h = !!i;
|
|
1501
|
+
t && this.uploadLUT(this.displacementLutSlot, t), e && this.uploadLUT(this.blurLutSlot, e), n && this.uploadLUT(this.glowLutSlot, n), i && this.uploadLUT(this.colorShiftLutSlot, i), o.useProgram(this.effectPass.program), o.uniform1i(
|
|
1364
1502
|
this.effectPass.uniforms.uCurvesEnabled,
|
|
1365
1503
|
l ? 1 : 0
|
|
1366
1504
|
), o.uniform1i(
|
|
@@ -1371,7 +1509,7 @@ class ye extends gt {
|
|
|
1371
1509
|
h ? 1 : 0
|
|
1372
1510
|
);
|
|
1373
1511
|
const c = this.glowEnabled !== a;
|
|
1374
|
-
if (this.glowEnabled = a, a && (c ||
|
|
1512
|
+
if (this.glowEnabled = a, a && (c || n) && this.refreshGlowBlur(), h && r) {
|
|
1375
1513
|
const f = this.effectPass.uniforms;
|
|
1376
1514
|
o.uniform1f(f.uColorShiftHue, r.hueShift * (Math.PI / 180)), o.uniform1f(f.uColorShiftSaturation, r.saturation), o.uniform1f(f.uColorShiftBrightness, r.brightness), o.uniform1f(f.uColorShiftTintStrength, r.tintStrength), o.uniform3f(
|
|
1377
1515
|
f.uColorShiftTintColor,
|
|
@@ -1393,12 +1531,12 @@ class ye extends gt {
|
|
|
1393
1531
|
initGPUResources() {
|
|
1394
1532
|
const t = this.gl;
|
|
1395
1533
|
if (!t) return;
|
|
1396
|
-
this.bilateralPass =
|
|
1397
|
-
const e =
|
|
1534
|
+
this.bilateralPass = Be(t, this.qualityParams.bilateralRadius), this.effectPass = ke(t);
|
|
1535
|
+
const e = Ut.replace(
|
|
1398
1536
|
"#version 300 es",
|
|
1399
1537
|
`#version 300 es
|
|
1400
1538
|
#define PASS_HORIZONTAL`
|
|
1401
|
-
),
|
|
1539
|
+
), n = [
|
|
1402
1540
|
"uDepth",
|
|
1403
1541
|
"uGlowCurve",
|
|
1404
1542
|
"uHorizResult",
|
|
@@ -1406,12 +1544,12 @@ class ye extends gt {
|
|
|
1406
1544
|
"uGlowRadius",
|
|
1407
1545
|
"uBlurDir"
|
|
1408
1546
|
];
|
|
1409
|
-
this.glowBlurHPass =
|
|
1547
|
+
this.glowBlurHPass = Ct(
|
|
1410
1548
|
t,
|
|
1411
1549
|
"glow-blur-h",
|
|
1412
|
-
|
|
1550
|
+
St,
|
|
1413
1551
|
e,
|
|
1414
|
-
|
|
1552
|
+
n,
|
|
1415
1553
|
{
|
|
1416
1554
|
internalFormat: t.R8,
|
|
1417
1555
|
format: t.RED,
|
|
@@ -1420,12 +1558,12 @@ class ye extends gt {
|
|
|
1420
1558
|
width: 0,
|
|
1421
1559
|
height: 0
|
|
1422
1560
|
}
|
|
1423
|
-
), this.glowBlurVPass =
|
|
1561
|
+
), this.glowBlurVPass = Ct(
|
|
1424
1562
|
t,
|
|
1425
1563
|
"glow-blur-v",
|
|
1426
|
-
|
|
1427
|
-
|
|
1428
|
-
|
|
1564
|
+
St,
|
|
1565
|
+
Ut,
|
|
1566
|
+
n,
|
|
1429
1567
|
{
|
|
1430
1568
|
internalFormat: t.R8,
|
|
1431
1569
|
format: t.RED,
|
|
@@ -1434,7 +1572,7 @@ class ye extends gt {
|
|
|
1434
1572
|
width: 0,
|
|
1435
1573
|
height: 0
|
|
1436
1574
|
}
|
|
1437
|
-
), this.quadVao =
|
|
1575
|
+
), this.quadVao = Xt(t, this.effectPass.program), t.disable(t.DEPTH_TEST);
|
|
1438
1576
|
}
|
|
1439
1577
|
// -----------------------------------------------------------------------
|
|
1440
1578
|
// Curve LUT texture management
|
|
@@ -1444,8 +1582,8 @@ class ye extends gt {
|
|
|
1444
1582
|
* Creates the texture on first call, updates via texSubImage2D thereafter.
|
|
1445
1583
|
*/
|
|
1446
1584
|
uploadLUT(t, e) {
|
|
1447
|
-
const
|
|
1448
|
-
|
|
1585
|
+
const n = this.gl;
|
|
1586
|
+
n && (n.activeTexture(n.TEXTURE0 + t.unit), t.texture ? n.bindTexture(n.TEXTURE_2D, t.texture) : (t.texture = n.createTexture(), n.bindTexture(n.TEXTURE_2D, t.texture), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_MIN_FILTER, n.LINEAR), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_MAG_FILTER, n.LINEAR), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_WRAP_S, n.CLAMP_TO_EDGE), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_WRAP_T, n.CLAMP_TO_EDGE), n.texStorage2D(n.TEXTURE_2D, 1, n.R8, 256, 1)), n.texSubImage2D(n.TEXTURE_2D, 0, 0, 0, 256, 1, n.RED, n.UNSIGNED_BYTE, e));
|
|
1449
1587
|
}
|
|
1450
1588
|
// -----------------------------------------------------------------------
|
|
1451
1589
|
// Abstract method implementations
|
|
@@ -1465,16 +1603,16 @@ class ye extends gt {
|
|
|
1465
1603
|
const t = this.gl, e = this.mediaSource;
|
|
1466
1604
|
if (!t || !this.effectPass || !this.quadVao)
|
|
1467
1605
|
return;
|
|
1468
|
-
const
|
|
1469
|
-
if (
|
|
1470
|
-
if (!this.rvfcSupported && e.isLive && this.onDepthUpdate(e.currentTime), t.useProgram(this.effectPass.program), t.activeTexture(t.TEXTURE0 + this.videoSlot.unit), t.bindTexture(t.TEXTURE_2D, this.videoSlot.texture), t.texImage2D(t.TEXTURE_2D, 0, t.RGBA, t.RGBA, t.UNSIGNED_BYTE,
|
|
1471
|
-
const
|
|
1472
|
-
t.uniform2f(this.effectPass.uniforms.uOffset, -
|
|
1606
|
+
const n = e?.getImageSource();
|
|
1607
|
+
if (n) {
|
|
1608
|
+
if (!this.rvfcSupported && e.isLive && this.onDepthUpdate(e.currentTime), t.useProgram(this.effectPass.program), t.activeTexture(t.TEXTURE0 + this.videoSlot.unit), t.bindTexture(t.TEXTURE_2D, this.videoSlot.texture), t.texImage2D(t.TEXTURE_2D, 0, t.RGBA, t.RGBA, t.UNSIGNED_BYTE, n), this.readInput) {
|
|
1609
|
+
const i = this.readInput();
|
|
1610
|
+
t.uniform2f(this.effectPass.uniforms.uOffset, -i.x, i.y), i.focalBandOffset !== void 0 && t.uniform1f(this.effectPass.uniforms.uFocalBandOffset, i.focalBandOffset), i.tiltPlaneNormal !== void 0 && t.uniform3f(
|
|
1473
1611
|
this.effectPass.uniforms.uTiltPlaneNormal,
|
|
1474
|
-
|
|
1475
|
-
|
|
1476
|
-
|
|
1477
|
-
),
|
|
1612
|
+
i.tiltPlaneNormal[0],
|
|
1613
|
+
i.tiltPlaneNormal[1],
|
|
1614
|
+
i.tiltPlaneNormal[2]
|
|
1615
|
+
), i.tiltPlaneD !== void 0 && t.uniform1f(this.effectPass.uniforms.uTiltPlaneD, i.tiltPlaneD);
|
|
1478
1616
|
}
|
|
1479
1617
|
t.bindVertexArray(this.quadVao), t.drawArrays(t.TRIANGLE_STRIP, 0, 4);
|
|
1480
1618
|
}
|
|
@@ -1490,12 +1628,12 @@ class ye extends gt {
|
|
|
1490
1628
|
onDepthUpdate(t) {
|
|
1491
1629
|
const e = this.gl;
|
|
1492
1630
|
if (!e || !this.readDepth || !this.rawDepthSlot.texture || !this.bilateralPass) return;
|
|
1493
|
-
const
|
|
1631
|
+
const n = this.subsampleDepth(this.readDepth(t));
|
|
1494
1632
|
this.bilateralPass.execute(
|
|
1495
1633
|
e,
|
|
1496
1634
|
this.quadVao,
|
|
1497
1635
|
this.rawDepthSlot.texture,
|
|
1498
|
-
|
|
1636
|
+
n,
|
|
1499
1637
|
this.depthWidth,
|
|
1500
1638
|
this.depthHeight,
|
|
1501
1639
|
this.canvas.width,
|
|
@@ -1508,8 +1646,8 @@ class ye extends gt {
|
|
|
1508
1646
|
*/
|
|
1509
1647
|
executeGlowBlur(t) {
|
|
1510
1648
|
if (!this.glowBlurHPass?.fbo || !this.glowBlurVPass?.fbo || !this.quadVao) return;
|
|
1511
|
-
const e = this.depthWidth,
|
|
1512
|
-
t.bindFramebuffer(t.FRAMEBUFFER, this.glowBlurHPass.fbo), t.viewport(0, 0, e,
|
|
1649
|
+
const e = this.depthWidth, n = this.depthHeight;
|
|
1650
|
+
t.bindFramebuffer(t.FRAMEBUFFER, this.glowBlurHPass.fbo), t.viewport(0, 0, e, n), t.useProgram(this.glowBlurHPass.program), t.bindVertexArray(this.quadVao), t.drawArrays(t.TRIANGLE_STRIP, 0, 4), t.bindFramebuffer(t.FRAMEBUFFER, this.glowBlurVPass.fbo), t.useProgram(this.glowBlurVPass.program), t.drawArrays(t.TRIANGLE_STRIP, 0, 4), t.bindFramebuffer(t.FRAMEBUFFER, null), t.viewport(0, 0, this.canvas.width, this.canvas.height);
|
|
1513
1651
|
}
|
|
1514
1652
|
/**
|
|
1515
1653
|
* Re-execute glow blur on demand (when glow LUT or radius changes).
|
|
@@ -1529,7 +1667,7 @@ class ye extends gt {
|
|
|
1529
1667
|
recalculateViewportLayout() {
|
|
1530
1668
|
const t = this.gl;
|
|
1531
1669
|
if (!t) return;
|
|
1532
|
-
const { width: e, height:
|
|
1670
|
+
const { width: e, height: n } = this.getViewportSize(), i = Math.min(window.devicePixelRatio, this.qualityParams.dprCap), r = Math.round(e * i), o = Math.round(n * i);
|
|
1533
1671
|
(this.canvas.width !== r || this.canvas.height !== o) && (this.canvas.width = r, this.canvas.height = o, t.viewport(0, 0, r, o)), this.computeCoverFitUV(this.config.parallaxStrength, this.config.overscanPadding), this.effectPass && this.effectPass.updateUvTransform(t, this.uvOffset, this.uvScale);
|
|
1534
1672
|
}
|
|
1535
1673
|
/** Release all GPU resources. */
|
|
@@ -1555,15 +1693,15 @@ class ye extends gt {
|
|
|
1555
1693
|
t && (this.bilateralPass && (this.bilateralPass.dispose(t), this.bilateralPass = null), this.effectPass && (this.effectPass.dispose(t), this.effectPass = null), this.glowBlurHPass && (this.glowBlurHPass.dispose(t), this.glowBlurHPass = null), this.glowBlurVPass && (this.glowBlurVPass.dispose(t), this.glowBlurVPass = null), this.quadVao && (t.deleteVertexArray(this.quadVao), this.quadVao = null));
|
|
1556
1694
|
}
|
|
1557
1695
|
}
|
|
1558
|
-
async function
|
|
1696
|
+
async function ft(s, t = {}) {
|
|
1559
1697
|
const {
|
|
1560
1698
|
parent: e = document.body,
|
|
1561
|
-
loop:
|
|
1562
|
-
muted:
|
|
1699
|
+
loop: n = !0,
|
|
1700
|
+
muted: i = !0
|
|
1563
1701
|
} = t, r = document.createElement("video");
|
|
1564
|
-
return r.crossOrigin = "anonymous", r.setAttribute("crossorigin", "anonymous"), r.playsInline = !0, r.setAttribute("playsinline", ""), r.setAttribute("webkit-playsinline", "true"), r.muted =
|
|
1702
|
+
return r.crossOrigin = "anonymous", r.setAttribute("crossorigin", "anonymous"), r.playsInline = !0, r.setAttribute("playsinline", ""), r.setAttribute("webkit-playsinline", "true"), r.muted = i, r.defaultMuted = i, i && r.setAttribute("muted", ""), r.loop = n, r.preload = "auto", r.style.display = "none", r.src = s, e.appendChild(r), await qt(r), new Ne(r);
|
|
1565
1703
|
}
|
|
1566
|
-
class
|
|
1704
|
+
class Ne {
|
|
1567
1705
|
constructor(t) {
|
|
1568
1706
|
this.video = t;
|
|
1569
1707
|
}
|
|
@@ -1609,17 +1747,17 @@ class we {
|
|
|
1609
1747
|
this.video.pause(), this.video.removeAttribute("src"), this.video.load(), this.video.remove();
|
|
1610
1748
|
}
|
|
1611
1749
|
}
|
|
1612
|
-
async function
|
|
1750
|
+
async function dt(s, t = {}) {
|
|
1613
1751
|
const e = new Image();
|
|
1614
|
-
return e.crossOrigin = "anonymous", e.src = s, await new Promise((
|
|
1752
|
+
return e.crossOrigin = "anonymous", e.src = s, await new Promise((n, i) => {
|
|
1615
1753
|
if (e.complete && e.naturalWidth > 0) {
|
|
1616
|
-
|
|
1754
|
+
n();
|
|
1617
1755
|
return;
|
|
1618
1756
|
}
|
|
1619
|
-
e.addEventListener("load", () =>
|
|
1620
|
-
}), new
|
|
1757
|
+
e.addEventListener("load", () => n(), { once: !0 }), e.addEventListener("error", () => i(new Error(`Failed to load image: ${s}`)), { once: !0 });
|
|
1758
|
+
}), new Xe(e);
|
|
1621
1759
|
}
|
|
1622
|
-
class
|
|
1760
|
+
class Xe {
|
|
1623
1761
|
constructor(t) {
|
|
1624
1762
|
this.img = t;
|
|
1625
1763
|
}
|
|
@@ -1641,11 +1779,11 @@ class Re {
|
|
|
1641
1779
|
this.img.removeAttribute("src");
|
|
1642
1780
|
}
|
|
1643
1781
|
}
|
|
1644
|
-
async function
|
|
1645
|
-
const { parent: e = document.body } = t,
|
|
1646
|
-
return
|
|
1782
|
+
async function zt(s = { video: !0 }, t = {}) {
|
|
1783
|
+
const { parent: e = document.body } = t, n = await navigator.mediaDevices.getUserMedia(s), i = document.createElement("video");
|
|
1784
|
+
return i.playsInline = !0, i.setAttribute("playsinline", ""), i.muted = !0, i.defaultMuted = !0, i.style.display = "none", i.srcObject = n, e.appendChild(i), await qt(i), await i.play(), new Ge(i, n);
|
|
1647
1785
|
}
|
|
1648
|
-
class
|
|
1786
|
+
class Ge {
|
|
1649
1787
|
constructor(t, e) {
|
|
1650
1788
|
this.video = t, this.stream = e;
|
|
1651
1789
|
}
|
|
@@ -1691,28 +1829,34 @@ class Ae {
|
|
|
1691
1829
|
t.stop();
|
|
1692
1830
|
}
|
|
1693
1831
|
}
|
|
1694
|
-
async function
|
|
1832
|
+
async function qt(s) {
|
|
1695
1833
|
s.readyState >= HTMLMediaElement.HAVE_METADATA || await new Promise((t, e) => {
|
|
1696
|
-
const
|
|
1834
|
+
const n = () => {
|
|
1697
1835
|
r(), t();
|
|
1698
|
-
},
|
|
1836
|
+
}, i = () => {
|
|
1699
1837
|
r(), e(new Error("Failed to load video metadata."));
|
|
1700
1838
|
}, r = () => {
|
|
1701
|
-
s.removeEventListener("loadedmetadata",
|
|
1839
|
+
s.removeEventListener("loadedmetadata", n), s.removeEventListener("error", i);
|
|
1702
1840
|
};
|
|
1703
|
-
s.addEventListener("loadedmetadata",
|
|
1841
|
+
s.addEventListener("loadedmetadata", n), s.addEventListener("error", i), s.load();
|
|
1842
|
+
});
|
|
1843
|
+
}
|
|
1844
|
+
async function Lt(s, t, e) {
|
|
1845
|
+
return s.create(t, {
|
|
1846
|
+
executionProviders: e,
|
|
1847
|
+
graphOptimizationLevel: "disabled"
|
|
1704
1848
|
});
|
|
1705
1849
|
}
|
|
1706
1850
|
const Z = 518;
|
|
1707
|
-
async function
|
|
1851
|
+
async function We() {
|
|
1708
1852
|
return await import("onnxruntime-web/webgpu");
|
|
1709
1853
|
}
|
|
1710
|
-
class
|
|
1854
|
+
class ze {
|
|
1711
1855
|
constructor(t, e) {
|
|
1712
1856
|
this.depthWidth = t, this.depthHeight = e;
|
|
1713
|
-
const
|
|
1714
|
-
this.frontBuffer = new Uint8Array(
|
|
1715
|
-
this.readyResolve =
|
|
1857
|
+
const n = t * e;
|
|
1858
|
+
this.frontBuffer = new Uint8Array(n), this.frontBuffer.fill(128), this.backBuffer = new Uint8Array(n), this.backBuffer.fill(128), this.readyPromise = new Promise((i) => {
|
|
1859
|
+
this.readyResolve = i;
|
|
1716
1860
|
});
|
|
1717
1861
|
}
|
|
1718
1862
|
// ONNX session + module (set after init)
|
|
@@ -1746,23 +1890,19 @@ class De {
|
|
|
1746
1890
|
* (GPU-accelerated on main thread), falls back to WASM EP.
|
|
1747
1891
|
*/
|
|
1748
1892
|
async init(t, e) {
|
|
1749
|
-
const
|
|
1750
|
-
if (this.ort =
|
|
1893
|
+
const n = await We();
|
|
1894
|
+
if (this.ort = n, this.captureCanvas = document.createElement("canvas"), this.captureCanvas.width = Z, this.captureCanvas.height = Z, this.captureCtx = this.captureCanvas.getContext("2d", {
|
|
1751
1895
|
willReadFrequently: !0
|
|
1752
1896
|
}), !this.captureCtx)
|
|
1753
1897
|
throw new Error("[DepthEstimator] Failed to create 2D canvas context.");
|
|
1754
1898
|
e?.({ receivedBytes: 0, totalBytes: null, fraction: 0, label: "Downloading depth model…" });
|
|
1755
|
-
const
|
|
1756
|
-
e?.({ receivedBytes:
|
|
1899
|
+
const i = await qe(t, e);
|
|
1900
|
+
e?.({ receivedBytes: i.byteLength, totalBytes: i.byteLength, fraction: 1, label: "Initialising depth model…" });
|
|
1757
1901
|
let r;
|
|
1758
1902
|
try {
|
|
1759
|
-
r = await
|
|
1760
|
-
executionProviders: ["webgpu"]
|
|
1761
|
-
}), console.log("[DepthEstimator] Using WebGPU execution provider");
|
|
1903
|
+
r = await Lt(n.InferenceSession, i, ["webgpu"]), console.log("[DepthEstimator] Using WebGPU execution provider");
|
|
1762
1904
|
} catch (o) {
|
|
1763
|
-
console.warn("[DepthEstimator] WebGPU EP unavailable, falling back to WASM:", o),
|
|
1764
|
-
executionProviders: ["wasm"]
|
|
1765
|
-
}), console.log("[DepthEstimator] Using WASM execution provider (proxy worker)");
|
|
1905
|
+
console.warn("[DepthEstimator] WebGPU EP unavailable, falling back to WASM:", o), n.env.wasm.proxy = !0, r = await Lt(n.InferenceSession, i, ["wasm"]), console.log("[DepthEstimator] Using WASM execution provider (proxy worker)");
|
|
1766
1906
|
}
|
|
1767
1907
|
this.session = r, this.inputName = r.inputNames[0], this.outputName = r.outputNames[0], this.preprocessWorker = new Worker(
|
|
1768
1908
|
new URL(
|
|
@@ -1829,7 +1969,7 @@ class De {
|
|
|
1829
1969
|
0,
|
|
1830
1970
|
Z,
|
|
1831
1971
|
Z
|
|
1832
|
-
),
|
|
1972
|
+
), n = await this.workerPreprocess(e.data.buffer, e.width, e.height), i = new this.ort.Tensor("float32", new Float32Array(n), [1, 3, e.height, e.width]), o = (await this.session.run({ [this.inputName]: i }))[this.outputName], l = o.data, a = o.dims, h = a.length === 3 ? a[1] : a[2], c = a.length === 3 ? a[2] : a[3], f = await this.workerPostprocess(l.slice(0).buffer, c, h);
|
|
1833
1973
|
this.backBuffer.set(new Uint8Array(f));
|
|
1834
1974
|
const u = this.frontBuffer;
|
|
1835
1975
|
this.frontBuffer = this.backBuffer, this.backBuffer = u;
|
|
@@ -1839,50 +1979,50 @@ class De {
|
|
|
1839
1979
|
this.inferenceInFlight = !1;
|
|
1840
1980
|
}
|
|
1841
1981
|
}
|
|
1842
|
-
workerPreprocess(t, e,
|
|
1843
|
-
return new Promise((
|
|
1982
|
+
workerPreprocess(t, e, n) {
|
|
1983
|
+
return new Promise((i, r) => {
|
|
1844
1984
|
if (!this.preprocessWorker) {
|
|
1845
1985
|
r(new Error("Worker not ready"));
|
|
1846
1986
|
return;
|
|
1847
1987
|
}
|
|
1848
1988
|
const o = (a) => {
|
|
1849
|
-
this.preprocessWorker?.removeEventListener("message", o), a.data.type === "preprocessed" ?
|
|
1989
|
+
this.preprocessWorker?.removeEventListener("message", o), a.data.type === "preprocessed" ? i(a.data.float32) : a.data.type === "error" && r(new Error(a.data.message));
|
|
1850
1990
|
};
|
|
1851
1991
|
this.preprocessWorker.addEventListener("message", o);
|
|
1852
1992
|
const l = t.slice(0);
|
|
1853
1993
|
this.preprocessWorker.postMessage(
|
|
1854
|
-
{ type: "preprocess", pixels: l, width: e, height:
|
|
1994
|
+
{ type: "preprocess", pixels: l, width: e, height: n },
|
|
1855
1995
|
[l]
|
|
1856
1996
|
);
|
|
1857
1997
|
});
|
|
1858
1998
|
}
|
|
1859
|
-
workerPostprocess(t, e,
|
|
1860
|
-
return new Promise((
|
|
1999
|
+
workerPostprocess(t, e, n) {
|
|
2000
|
+
return new Promise((i, r) => {
|
|
1861
2001
|
if (!this.preprocessWorker) {
|
|
1862
2002
|
r(new Error("Worker not ready"));
|
|
1863
2003
|
return;
|
|
1864
2004
|
}
|
|
1865
2005
|
const o = (a) => {
|
|
1866
|
-
this.preprocessWorker?.removeEventListener("message", o), a.data.type === "postprocessed" ?
|
|
2006
|
+
this.preprocessWorker?.removeEventListener("message", o), a.data.type === "postprocessed" ? i(a.data.depth) : a.data.type === "error" && r(new Error(a.data.message));
|
|
1867
2007
|
};
|
|
1868
2008
|
this.preprocessWorker.addEventListener("message", o);
|
|
1869
2009
|
const l = t.slice(0);
|
|
1870
2010
|
this.preprocessWorker.postMessage(
|
|
1871
|
-
{ type: "postprocess", depthFloat: l, srcW: e, srcH:
|
|
2011
|
+
{ type: "postprocess", depthFloat: l, srcW: e, srcH: n, dstW: this.depthWidth, dstH: this.depthHeight },
|
|
1872
2012
|
[l]
|
|
1873
2013
|
);
|
|
1874
2014
|
});
|
|
1875
2015
|
}
|
|
1876
2016
|
}
|
|
1877
|
-
async function
|
|
1878
|
-
const
|
|
1879
|
-
return await
|
|
2017
|
+
async function mt(s, t, e, n) {
|
|
2018
|
+
const i = new ze(t, e);
|
|
2019
|
+
return await i.init(s, n), i;
|
|
1880
2020
|
}
|
|
1881
|
-
async function
|
|
2021
|
+
async function qe(s, t) {
|
|
1882
2022
|
const e = await fetch(s);
|
|
1883
2023
|
if (!e.ok)
|
|
1884
2024
|
throw new Error(`[DepthEstimator] Failed to fetch model (${e.status} ${e.statusText}).`);
|
|
1885
|
-
const
|
|
2025
|
+
const n = e.headers.get("content-length"), i = n ? Number(n) : null, r = e.body;
|
|
1886
2026
|
if (!r) {
|
|
1887
2027
|
const f = await e.arrayBuffer();
|
|
1888
2028
|
return t?.({
|
|
@@ -1900,8 +2040,8 @@ async function Fe(s, t) {
|
|
|
1900
2040
|
if (f) break;
|
|
1901
2041
|
u && (o.push(u), l += u.byteLength, t?.({
|
|
1902
2042
|
receivedBytes: l,
|
|
1903
|
-
totalBytes:
|
|
1904
|
-
fraction:
|
|
2043
|
+
totalBytes: i,
|
|
2044
|
+
fraction: i ? Math.min(l / i, 1) : 0,
|
|
1905
2045
|
label: "Downloading depth model…"
|
|
1906
2046
|
}));
|
|
1907
2047
|
}
|
|
@@ -1911,54 +2051,54 @@ async function Fe(s, t) {
|
|
|
1911
2051
|
h.set(f, c), c += f.byteLength;
|
|
1912
2052
|
return h.buffer;
|
|
1913
2053
|
}
|
|
1914
|
-
const
|
|
2054
|
+
const _t = {
|
|
1915
2055
|
sensitivityX: 0.4,
|
|
1916
2056
|
sensitivityY: 1,
|
|
1917
2057
|
lerpFactor: 0.08
|
|
1918
2058
|
};
|
|
1919
|
-
function
|
|
2059
|
+
function yt(s, t) {
|
|
1920
2060
|
const e = s.points;
|
|
1921
2061
|
if (e.length === 0) return 0;
|
|
1922
2062
|
if (e.length === 1 || t <= e[0].x) return e[0].y;
|
|
1923
2063
|
if (t >= e[e.length - 1].x) return e[e.length - 1].y;
|
|
1924
|
-
let
|
|
1925
|
-
for (;
|
|
1926
|
-
const
|
|
2064
|
+
let n = 0;
|
|
2065
|
+
for (; n < e.length - 1 && e[n + 1].x < t; ) n++;
|
|
2066
|
+
const i = e[n], r = e[n + 1], o = (t - i.x) / (r.x - i.x);
|
|
1927
2067
|
switch (s.interpolation) {
|
|
1928
2068
|
case "step":
|
|
1929
|
-
return
|
|
2069
|
+
return i.y;
|
|
1930
2070
|
case "linear":
|
|
1931
|
-
return
|
|
2071
|
+
return i.y + (r.y - i.y) * o;
|
|
1932
2072
|
case "smooth": {
|
|
1933
2073
|
const l = o * o * (3 - 2 * o);
|
|
1934
|
-
return
|
|
2074
|
+
return i.y + (r.y - i.y) * l;
|
|
1935
2075
|
}
|
|
1936
2076
|
default:
|
|
1937
|
-
return
|
|
2077
|
+
return i.y + (r.y - i.y) * o;
|
|
1938
2078
|
}
|
|
1939
2079
|
}
|
|
1940
|
-
function
|
|
2080
|
+
function ut(s, t = 256) {
|
|
1941
2081
|
const e = new Uint8Array(t);
|
|
1942
|
-
for (let
|
|
1943
|
-
const
|
|
1944
|
-
e[
|
|
2082
|
+
for (let n = 0; n < t; n++) {
|
|
2083
|
+
const i = n / (t - 1);
|
|
2084
|
+
e[n] = Math.round(yt(s, i) * 255);
|
|
1945
2085
|
}
|
|
1946
2086
|
return e;
|
|
1947
2087
|
}
|
|
1948
2088
|
function q(s, t) {
|
|
1949
2089
|
return s.find((e) => e.channel === t && e.enabled);
|
|
1950
2090
|
}
|
|
1951
|
-
function
|
|
1952
|
-
const e = q(s, "displacement"),
|
|
2091
|
+
function It(s, t) {
|
|
2092
|
+
const e = q(s, "displacement"), n = q(s, "blur"), i = q(s, "glow"), r = e?.params;
|
|
1953
2093
|
let o = 0.6, l = 0;
|
|
1954
|
-
if (
|
|
1955
|
-
const a =
|
|
2094
|
+
if (n) {
|
|
2095
|
+
const a = n.curve;
|
|
1956
2096
|
for (let h = 0; h <= 1; h += 0.01)
|
|
1957
|
-
if (
|
|
2097
|
+
if (yt(a, h) > 0.01) {
|
|
1958
2098
|
o = h;
|
|
1959
2099
|
break;
|
|
1960
2100
|
}
|
|
1961
|
-
l =
|
|
2101
|
+
l = yt(a, 1);
|
|
1962
2102
|
}
|
|
1963
2103
|
return {
|
|
1964
2104
|
parallaxStrength: r?.strength ?? 0.05,
|
|
@@ -1969,23 +2109,23 @@ function Ut(s, t) {
|
|
|
1969
2109
|
verticalReduction: t.verticalReduction,
|
|
1970
2110
|
dofStart: o,
|
|
1971
2111
|
dofStrength: l,
|
|
1972
|
-
blurRadius:
|
|
1973
|
-
glowColor:
|
|
1974
|
-
glowRadius:
|
|
1975
|
-
glowSoftness:
|
|
1976
|
-
tiltEnabled:
|
|
1977
|
-
tiltHalfTanFov: Math.tan((
|
|
1978
|
-
tiltTransitionWidth: (
|
|
1979
|
-
tiltPeakIntensity:
|
|
2112
|
+
blurRadius: n?.params?.maxRadius ?? 0.01,
|
|
2113
|
+
glowColor: i?.params?.color ?? [1, 0.95, 0.85],
|
|
2114
|
+
glowRadius: i?.params?.radius ?? 0.02,
|
|
2115
|
+
glowSoftness: i?.params?.softness ?? 0.6,
|
|
2116
|
+
tiltEnabled: n?.params?.tiltEnabled ?? !1,
|
|
2117
|
+
tiltHalfTanFov: Math.tan((n?.params?.tiltFov ?? 50) * Math.PI / 360),
|
|
2118
|
+
tiltTransitionWidth: (n?.params?.focalWidth ?? 0.3) * 4.5,
|
|
2119
|
+
tiltPeakIntensity: n?.params?.peakIntensity ?? 0.8
|
|
1980
2120
|
};
|
|
1981
2121
|
}
|
|
1982
|
-
function
|
|
1983
|
-
const t = q(s, "displacement"), e = q(s, "blur"),
|
|
2122
|
+
function Mt(s) {
|
|
2123
|
+
const t = q(s, "displacement"), e = q(s, "blur"), n = q(s, "glow"), i = q(s, "color-shift"), r = i?.params;
|
|
1984
2124
|
return {
|
|
1985
|
-
displacementLUT: t ?
|
|
1986
|
-
blurLUT: e ?
|
|
1987
|
-
glowLUT:
|
|
1988
|
-
colorShiftLUT:
|
|
2125
|
+
displacementLUT: t ? ut(t.curve) : null,
|
|
2126
|
+
blurLUT: e ? ut(e.curve) : null,
|
|
2127
|
+
glowLUT: n ? ut(n.curve) : null,
|
|
2128
|
+
colorShiftLUT: i ? ut(i.curve) : null,
|
|
1989
2129
|
colorShiftParams: r ? {
|
|
1990
2130
|
hueShift: r.hueShift ?? 0,
|
|
1991
2131
|
saturation: r.saturation ?? 1,
|
|
@@ -1995,7 +2135,7 @@ function Lt(s) {
|
|
|
1995
2135
|
} : null
|
|
1996
2136
|
};
|
|
1997
2137
|
}
|
|
1998
|
-
class
|
|
2138
|
+
class Yt {
|
|
1999
2139
|
abortController = null;
|
|
2000
2140
|
initialized = !1;
|
|
2001
2141
|
initializing = !1;
|
|
@@ -2005,13 +2145,13 @@ class Wt {
|
|
|
2005
2145
|
}
|
|
2006
2146
|
// --- Public API (called from lifecycle callbacks) ---
|
|
2007
2147
|
onConnected() {
|
|
2008
|
-
this.element.setupShadowDOM(), this.tryInit();
|
|
2148
|
+
this.cancelInit(), this.element.setupShadowDOM(), this.tryInit();
|
|
2009
2149
|
}
|
|
2010
2150
|
onDisconnected() {
|
|
2011
2151
|
this.cancelInit(), this.element.doDispose(), this.initialized = !1;
|
|
2012
2152
|
}
|
|
2013
|
-
onAttributeChanged(t, e,
|
|
2014
|
-
this.element.reinitAttributes.includes(t) && e !==
|
|
2153
|
+
onAttributeChanged(t, e, n) {
|
|
2154
|
+
this.element.reinitAttributes.includes(t) && e !== n && (this.initialized ? (this.cancelInit(), this.element.doDispose(), this.initialized = !1, this.element.setupShadowDOM(), this.tryInit()) : this.initializing || this.tryInit());
|
|
2015
2155
|
}
|
|
2016
2156
|
get isInitialized() {
|
|
2017
2157
|
return this.initialized;
|
|
@@ -2027,18 +2167,16 @@ class Wt {
|
|
|
2027
2167
|
if (t.canInit) {
|
|
2028
2168
|
if (!t.canInit()) return;
|
|
2029
2169
|
} else
|
|
2030
|
-
for (const
|
|
2031
|
-
if (!t.getAttribute(
|
|
2170
|
+
for (const n of t.reinitAttributes)
|
|
2171
|
+
if (!t.getAttribute(n)) return;
|
|
2032
2172
|
this.cancelInit();
|
|
2033
2173
|
const e = new AbortController();
|
|
2034
2174
|
this.abortController = e, this.initializing = !0;
|
|
2035
2175
|
try {
|
|
2036
|
-
|
|
2037
|
-
this.initializing = !1;
|
|
2038
|
-
return;
|
|
2039
|
-
}
|
|
2176
|
+
await t.doInit(e.signal);
|
|
2040
2177
|
} catch {
|
|
2041
|
-
|
|
2178
|
+
} finally {
|
|
2179
|
+
this.initialized || (this.initializing = !1);
|
|
2042
2180
|
}
|
|
2043
2181
|
}
|
|
2044
2182
|
cancelInit() {
|
|
@@ -2054,7 +2192,7 @@ const z = {
|
|
|
2054
2192
|
loop: !0,
|
|
2055
2193
|
muted: !0
|
|
2056
2194
|
}, $ = 512, K = 512;
|
|
2057
|
-
class
|
|
2195
|
+
class Tt extends HTMLElement {
|
|
2058
2196
|
static TAG_NAME = "layershift-effect";
|
|
2059
2197
|
static get observedAttributes() {
|
|
2060
2198
|
return [
|
|
@@ -2081,8 +2219,8 @@ class xt extends HTMLElement {
|
|
|
2081
2219
|
reinitAttributes = ["src", "map-src", "map-width", "map-height", "map-fps", "depth-model", "source-type", "config"];
|
|
2082
2220
|
canInit() {
|
|
2083
2221
|
if (this.sourceType === "camera") return !0;
|
|
2084
|
-
const t = !!this.getAttribute("src"), e = !!this.getAttribute("map-src"),
|
|
2085
|
-
return t && (e ||
|
|
2222
|
+
const t = !!this.getAttribute("src"), e = !!this.getAttribute("map-src"), n = !!this.getAttribute("depth-model");
|
|
2223
|
+
return t && (e || n);
|
|
2086
2224
|
}
|
|
2087
2225
|
shadow;
|
|
2088
2226
|
container = null;
|
|
@@ -2099,7 +2237,7 @@ class xt extends HTMLElement {
|
|
|
2099
2237
|
*/
|
|
2100
2238
|
depthFallback = null;
|
|
2101
2239
|
constructor() {
|
|
2102
|
-
super(), this.shadow = this.attachShadow({ mode: "open" }), this.lifecycle = new
|
|
2240
|
+
super(), this.shadow = this.attachShadow({ mode: "open" }), this.lifecycle = new Yt(this);
|
|
2103
2241
|
}
|
|
2104
2242
|
/** The current input offset. Set this externally to drive the effect. */
|
|
2105
2243
|
get input() {
|
|
@@ -2110,15 +2248,15 @@ class xt extends HTMLElement {
|
|
|
2110
2248
|
}
|
|
2111
2249
|
// --- Attribute helpers ---
|
|
2112
2250
|
getAttrFloat(t, e) {
|
|
2113
|
-
const
|
|
2114
|
-
if (
|
|
2115
|
-
const
|
|
2116
|
-
return Number.isFinite(
|
|
2251
|
+
const n = this.getAttribute(t);
|
|
2252
|
+
if (n === null) return e;
|
|
2253
|
+
const i = parseFloat(n);
|
|
2254
|
+
return Number.isFinite(i) ? i : e;
|
|
2117
2255
|
}
|
|
2118
2256
|
getAttrBool(t, e) {
|
|
2119
2257
|
if (!this.hasAttribute(t)) return e;
|
|
2120
|
-
const
|
|
2121
|
-
return !(
|
|
2258
|
+
const n = this.getAttribute(t);
|
|
2259
|
+
return !(n === "false" || n === "0");
|
|
2122
2260
|
}
|
|
2123
2261
|
get parallaxX() {
|
|
2124
2262
|
return this.getAttrFloat("parallax-x", z.parallaxX);
|
|
@@ -2197,8 +2335,8 @@ class xt extends HTMLElement {
|
|
|
2197
2335
|
disconnectedCallback() {
|
|
2198
2336
|
this.lifecycle.onDisconnected();
|
|
2199
2337
|
}
|
|
2200
|
-
attributeChangedCallback(t, e,
|
|
2201
|
-
this.lifecycle.onAttributeChanged(t, e,
|
|
2338
|
+
attributeChangedCallback(t, e, n) {
|
|
2339
|
+
this.lifecycle.onAttributeChanged(t, e, n);
|
|
2202
2340
|
}
|
|
2203
2341
|
// --- Shadow DOM setup ---
|
|
2204
2342
|
setupShadowDOM() {
|
|
@@ -2235,27 +2373,27 @@ class xt extends HTMLElement {
|
|
|
2235
2373
|
const e = this.getAttribute("config");
|
|
2236
2374
|
if (!e) return null;
|
|
2237
2375
|
try {
|
|
2238
|
-
const
|
|
2239
|
-
if (!
|
|
2240
|
-
return console.warn(`<layershift-effect>: Failed to fetch config from "${e}" (${
|
|
2241
|
-
const
|
|
2376
|
+
const n = await fetch(e, { signal: t });
|
|
2377
|
+
if (!n.ok)
|
|
2378
|
+
return console.warn(`<layershift-effect>: Failed to fetch config from "${e}" (${n.status})`), null;
|
|
2379
|
+
const i = await n.json();
|
|
2242
2380
|
return {
|
|
2243
|
-
channels:
|
|
2244
|
-
motion:
|
|
2245
|
-
overscanPadding:
|
|
2246
|
-
quality:
|
|
2381
|
+
channels: i.channels ?? [],
|
|
2382
|
+
motion: i.motion ?? _t,
|
|
2383
|
+
overscanPadding: i.overscanPadding ?? 0.05,
|
|
2384
|
+
quality: i.quality ?? "auto"
|
|
2247
2385
|
};
|
|
2248
|
-
} catch (
|
|
2249
|
-
return
|
|
2386
|
+
} catch (n) {
|
|
2387
|
+
return n.name === "AbortError" || console.warn("<layershift-effect>: Failed to parse config.", n), null;
|
|
2250
2388
|
}
|
|
2251
2389
|
}
|
|
2252
2390
|
/**
|
|
2253
2391
|
* Build renderer config from HTML attributes (legacy parallax-only path).
|
|
2254
2392
|
*/
|
|
2255
2393
|
buildLegacyConfig(t, e) {
|
|
2256
|
-
const
|
|
2394
|
+
const n = this.container?.clientWidth || e, i = this.hasAttribute("parallax-max") ? this.parallaxMax / Math.max(n, 1) : t.parallaxStrength, r = this.hasAttribute("overscan") ? this.overscan : t.overscanPadding;
|
|
2257
2395
|
return {
|
|
2258
|
-
parallaxStrength:
|
|
2396
|
+
parallaxStrength: i,
|
|
2259
2397
|
pomEnabled: !0,
|
|
2260
2398
|
pomSteps: t.pomSteps,
|
|
2261
2399
|
overscanPadding: r,
|
|
@@ -2270,38 +2408,38 @@ class xt extends HTMLElement {
|
|
|
2270
2408
|
// --- Initialization ---
|
|
2271
2409
|
async doInit(t) {
|
|
2272
2410
|
if (!this.container) return;
|
|
2273
|
-
const e = this.sourceType === "camera",
|
|
2411
|
+
const e = this.sourceType === "camera", n = this.depthModel;
|
|
2274
2412
|
try {
|
|
2275
|
-
let
|
|
2413
|
+
let i, r, o = null;
|
|
2276
2414
|
const l = (m) => {
|
|
2277
2415
|
this.emit("layershift-effect:model-progress", m);
|
|
2278
2416
|
};
|
|
2279
2417
|
if (e) {
|
|
2280
|
-
if (
|
|
2418
|
+
if (i = await zt(
|
|
2281
2419
|
{ video: { facingMode: "user" } },
|
|
2282
2420
|
{ parent: this.shadow }
|
|
2283
2421
|
), t.aborted) {
|
|
2284
|
-
|
|
2422
|
+
i.dispose();
|
|
2285
2423
|
return;
|
|
2286
2424
|
}
|
|
2287
|
-
if (
|
|
2288
|
-
if (o = await
|
|
2289
|
-
o.dispose(),
|
|
2425
|
+
if (n) {
|
|
2426
|
+
if (o = await mt(n, $, K, l), t.aborted) {
|
|
2427
|
+
o.dispose(), i.dispose();
|
|
2290
2428
|
return;
|
|
2291
2429
|
}
|
|
2292
|
-
r =
|
|
2430
|
+
r = N($, K);
|
|
2293
2431
|
} else
|
|
2294
|
-
r =
|
|
2432
|
+
r = N(i.width, i.height);
|
|
2295
2433
|
} else {
|
|
2296
2434
|
const m = this.getAttribute("src"), T = this.getAttribute("map-src"), w = !!T, A = this.sourceType === "image" || /\.(jpe?g|png|webp|gif|avif|bmp)(\?|$)/i.test(m);
|
|
2297
2435
|
if (w) {
|
|
2298
2436
|
const [P, F] = await Promise.all([
|
|
2299
|
-
A ?
|
|
2437
|
+
A ? dt(m) : ft(m, {
|
|
2300
2438
|
parent: this.shadow,
|
|
2301
2439
|
loop: this.shouldLoop,
|
|
2302
2440
|
muted: this.shouldMute
|
|
2303
2441
|
}),
|
|
2304
|
-
|
|
2442
|
+
Nt(
|
|
2305
2443
|
T,
|
|
2306
2444
|
this.getAttrFloat("map-width", 512),
|
|
2307
2445
|
this.getAttrFloat("map-height", 512),
|
|
@@ -2312,22 +2450,22 @@ class xt extends HTMLElement {
|
|
|
2312
2450
|
P.dispose();
|
|
2313
2451
|
return;
|
|
2314
2452
|
}
|
|
2315
|
-
|
|
2316
|
-
} else if (
|
|
2453
|
+
i = P, r = F;
|
|
2454
|
+
} else if (n) {
|
|
2317
2455
|
const [P, F] = await Promise.all([
|
|
2318
|
-
A ?
|
|
2456
|
+
A ? dt(m) : ft(m, {
|
|
2319
2457
|
parent: this.shadow,
|
|
2320
2458
|
loop: this.shouldLoop,
|
|
2321
2459
|
muted: this.shouldMute
|
|
2322
2460
|
}),
|
|
2323
|
-
|
|
2461
|
+
mt(n, $, K, l)
|
|
2324
2462
|
]);
|
|
2325
2463
|
if (t.aborted) {
|
|
2326
2464
|
P.dispose(), F.dispose();
|
|
2327
2465
|
return;
|
|
2328
2466
|
}
|
|
2329
|
-
if (
|
|
2330
|
-
const _ =
|
|
2467
|
+
if (i = P, o = F, A || !i.isLive) {
|
|
2468
|
+
const _ = i.getImageSource();
|
|
2331
2469
|
if (_) {
|
|
2332
2470
|
const I = await o.submitFrameAndWait(_);
|
|
2333
2471
|
r = {
|
|
@@ -2338,18 +2476,18 @@ class xt extends HTMLElement {
|
|
|
2338
2476
|
frames: [I]
|
|
2339
2477
|
};
|
|
2340
2478
|
} else
|
|
2341
|
-
r =
|
|
2479
|
+
r = N($, K);
|
|
2342
2480
|
} else
|
|
2343
|
-
r =
|
|
2481
|
+
r = N($, K);
|
|
2344
2482
|
} else
|
|
2345
2483
|
throw new Error("Either map-src or depth-model must be provided.");
|
|
2346
2484
|
}
|
|
2347
|
-
this.source =
|
|
2348
|
-
const a =
|
|
2485
|
+
this.source = i, this.depthEstimator = o, this.loopCount = 0, this.attachSourceEventListeners(i);
|
|
2486
|
+
const a = be(
|
|
2349
2487
|
r.frames,
|
|
2350
2488
|
r.width,
|
|
2351
2489
|
r.height
|
|
2352
|
-
), h =
|
|
2490
|
+
), h = Se(a);
|
|
2353
2491
|
this.depthFallback = {
|
|
2354
2492
|
contrastLow: h.contrastLow,
|
|
2355
2493
|
contrastHigh: h.contrastHigh,
|
|
@@ -2359,15 +2497,15 @@ class xt extends HTMLElement {
|
|
|
2359
2497
|
if (o)
|
|
2360
2498
|
c = () => o.getLatestDepth();
|
|
2361
2499
|
else {
|
|
2362
|
-
const m = new
|
|
2500
|
+
const m = new Ht(r);
|
|
2363
2501
|
c = (T) => m.sample(T);
|
|
2364
2502
|
}
|
|
2365
2503
|
if (t.aborted) return;
|
|
2366
|
-
let f, u = null,
|
|
2504
|
+
let f, u = null, v = _t;
|
|
2367
2505
|
const p = await this.fetchFilterConfig(t);
|
|
2368
2506
|
if (t.aborted) return;
|
|
2369
2507
|
if (p && p.channels.length > 0) {
|
|
2370
|
-
const m =
|
|
2508
|
+
const m = It(p.channels, {
|
|
2371
2509
|
contrastLow: h.contrastLow,
|
|
2372
2510
|
contrastHigh: h.contrastHigh,
|
|
2373
2511
|
verticalReduction: h.verticalReduction
|
|
@@ -2391,60 +2529,62 @@ class xt extends HTMLElement {
|
|
|
2391
2529
|
tiltHalfTanFov: m.tiltHalfTanFov,
|
|
2392
2530
|
tiltTransitionWidth: m.tiltTransitionWidth,
|
|
2393
2531
|
tiltPeakIntensity: m.tiltPeakIntensity
|
|
2394
|
-
}, u =
|
|
2532
|
+
}, u = Mt(p.channels), v = p.motion;
|
|
2395
2533
|
} else
|
|
2396
|
-
f = this.buildLegacyConfig(h,
|
|
2397
|
-
this.renderer = new
|
|
2534
|
+
f = this.buildLegacyConfig(h, i.width);
|
|
2535
|
+
this.renderer = new He(this.container, f), this.renderer.onError = (m) => {
|
|
2536
|
+
this.emit("layershift-effect:error", { message: m.message });
|
|
2537
|
+
}, this.renderer.initialize(i, r.width, r.height), u && this.renderer.updateCurveLUTs(
|
|
2398
2538
|
u.displacementLUT,
|
|
2399
2539
|
u.blurLUT,
|
|
2400
2540
|
u.glowLUT,
|
|
2401
2541
|
u.colorShiftLUT,
|
|
2402
2542
|
u.colorShiftParams ?? void 0
|
|
2403
2543
|
);
|
|
2404
|
-
const d =
|
|
2544
|
+
const d = v.tiltPlaneInput ?? !1, S = v.tiltPitchSensitivity ?? 0.35, E = v.tiltYawSensitivity ?? 0.15, g = p?.channels.find((m) => m.channel === "blur" && m.enabled)?.params?.focalCenter ?? 0.5, x = o;
|
|
2405
2545
|
if (this.renderer.start(
|
|
2406
|
-
|
|
2546
|
+
i,
|
|
2407
2547
|
c,
|
|
2408
2548
|
() => {
|
|
2409
2549
|
const m = this._input;
|
|
2410
2550
|
if (d) {
|
|
2411
|
-
const A = m.y *
|
|
2551
|
+
const A = m.y * S, P = m.x * E, F = Math.cos(A), _ = Math.sin(A), I = Math.cos(P), y = Math.sin(P) * F, D = -_, U = I * F, M = 0.5 + g * (5 - 0.5);
|
|
2412
2552
|
return {
|
|
2413
2553
|
x: m.x * 0.3,
|
|
2414
2554
|
y: m.y * 0.3,
|
|
2415
|
-
tiltPlaneNormal: [
|
|
2555
|
+
tiltPlaneNormal: [y, D, U],
|
|
2416
2556
|
tiltPlaneD: U * M
|
|
2417
2557
|
};
|
|
2418
2558
|
}
|
|
2419
2559
|
return { x: m.x, y: m.y };
|
|
2420
2560
|
},
|
|
2421
2561
|
(m, T) => {
|
|
2422
|
-
if (
|
|
2423
|
-
const w =
|
|
2424
|
-
w &&
|
|
2562
|
+
if (x) {
|
|
2563
|
+
const w = i.getImageSource();
|
|
2564
|
+
w && x.submitFrame(w);
|
|
2425
2565
|
}
|
|
2426
2566
|
this.emit("layershift-effect:frame", {
|
|
2427
2567
|
currentTime: m,
|
|
2428
2568
|
frameNumber: T
|
|
2429
2569
|
});
|
|
2430
2570
|
}
|
|
2431
|
-
), !e &&
|
|
2571
|
+
), !e && i.isLive && this.shouldAutoplay && i.play)
|
|
2432
2572
|
try {
|
|
2433
|
-
await
|
|
2573
|
+
await i.play();
|
|
2434
2574
|
} catch {
|
|
2435
2575
|
}
|
|
2436
2576
|
if (t.aborted) return;
|
|
2437
2577
|
this.lifecycle.markInitialized(), this.emit("layershift-effect:ready", {
|
|
2438
|
-
videoWidth:
|
|
2439
|
-
videoHeight:
|
|
2440
|
-
duration:
|
|
2578
|
+
videoWidth: i.width,
|
|
2579
|
+
videoHeight: i.height,
|
|
2580
|
+
duration: i.duration,
|
|
2441
2581
|
depthProfile: a,
|
|
2442
2582
|
derivedParams: h,
|
|
2443
|
-
motionConfig:
|
|
2583
|
+
motionConfig: v
|
|
2444
2584
|
});
|
|
2445
|
-
} catch (
|
|
2446
|
-
const r =
|
|
2447
|
-
console.error("<layershift-effect>: Failed to initialize.",
|
|
2585
|
+
} catch (i) {
|
|
2586
|
+
const r = i instanceof Error ? i.message : "Failed to initialize.";
|
|
2587
|
+
console.error("<layershift-effect>: Failed to initialize.", i), this.emit("layershift-effect:error", { message: r });
|
|
2448
2588
|
}
|
|
2449
2589
|
}
|
|
2450
2590
|
// --- Playback control ---
|
|
@@ -2493,15 +2633,15 @@ class xt extends HTMLElement {
|
|
|
2493
2633
|
contrastLow: 0.05,
|
|
2494
2634
|
contrastHigh: 0.95,
|
|
2495
2635
|
verticalReduction: 0.5
|
|
2496
|
-
},
|
|
2497
|
-
this.renderer.updateConfig(
|
|
2498
|
-
const
|
|
2636
|
+
}, n = It(t, e);
|
|
2637
|
+
this.renderer.updateConfig(n);
|
|
2638
|
+
const i = Mt(t);
|
|
2499
2639
|
this.renderer.updateCurveLUTs(
|
|
2500
|
-
|
|
2501
|
-
|
|
2502
|
-
|
|
2503
|
-
|
|
2504
|
-
|
|
2640
|
+
i.displacementLUT,
|
|
2641
|
+
i.blurLUT,
|
|
2642
|
+
i.glowLUT,
|
|
2643
|
+
i.colorShiftLUT,
|
|
2644
|
+
i.colorShiftParams ?? void 0
|
|
2505
2645
|
);
|
|
2506
2646
|
}
|
|
2507
2647
|
// --- Cleanup ---
|
|
@@ -2509,7 +2649,7 @@ class xt extends HTMLElement {
|
|
|
2509
2649
|
this.renderer?.dispose(), this.renderer = null, this.depthEstimator?.dispose(), this.depthEstimator = null, this.source?.dispose(), this.source = null, this.depthFallback = null, this.loopCount = 0, this.container = null;
|
|
2510
2650
|
}
|
|
2511
2651
|
}
|
|
2512
|
-
class
|
|
2652
|
+
class Pt {
|
|
2513
2653
|
gl;
|
|
2514
2654
|
hasColorBufferFloat;
|
|
2515
2655
|
// FBO / texture resources
|
|
@@ -2554,18 +2694,18 @@ class Rt {
|
|
|
2554
2694
|
* Create (or recreate) all JFA FBO/texture resources at the given canvas
|
|
2555
2695
|
* dimensions, divided by the quality tier's JFA divisor.
|
|
2556
2696
|
*/
|
|
2557
|
-
createResources(t, e,
|
|
2558
|
-
const
|
|
2697
|
+
createResources(t, e, n) {
|
|
2698
|
+
const i = this.gl;
|
|
2559
2699
|
this.dispose();
|
|
2560
|
-
const r = Math.max(1, Math.round(t /
|
|
2700
|
+
const r = Math.max(1, Math.round(t / n)), o = Math.max(1, Math.round(e / n));
|
|
2561
2701
|
this._width = r, this._height = o;
|
|
2562
2702
|
const l = (h, c, f, u) => {
|
|
2563
|
-
const
|
|
2564
|
-
return
|
|
2703
|
+
const v = i.createFramebuffer();
|
|
2704
|
+
return i.bindFramebuffer(i.FRAMEBUFFER, v), i.bindTexture(i.TEXTURE_2D, h), i.texStorage2D(i.TEXTURE_2D, 1, c, f, u), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MIN_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MAG_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_S, i.CLAMP_TO_EDGE), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_T, i.CLAMP_TO_EDGE), i.framebufferTexture2D(i.FRAMEBUFFER, i.COLOR_ATTACHMENT0, i.TEXTURE_2D, h, 0), i.bindFramebuffer(i.FRAMEBUFFER, null), v;
|
|
2565
2705
|
};
|
|
2566
|
-
this.maskTex =
|
|
2567
|
-
const a = this.hasColorBufferFloat ?
|
|
2568
|
-
this.pingTex =
|
|
2706
|
+
this.maskTex = i.createTexture(), this.maskFbo = l(this.maskTex, i.R8, r, o);
|
|
2707
|
+
const a = this.hasColorBufferFloat ? i.RG16F : i.RGBA8;
|
|
2708
|
+
this.pingTex = i.createTexture(), this.pingFbo = l(this.pingTex, a, r, o), this.pongTex = i.createTexture(), this.pongFbo = l(this.pongTex, a, r, o), this.distTex = i.createTexture(), this.distFbo = l(this.distTex, i.RGBA8, r, o), this._dirty = !0;
|
|
2569
2709
|
}
|
|
2570
2710
|
// -----------------------------------------------------------------------
|
|
2571
2711
|
// Distance field computation
|
|
@@ -2581,14 +2721,14 @@ class Rt {
|
|
|
2581
2721
|
compute(t) {
|
|
2582
2722
|
const e = this.gl;
|
|
2583
2723
|
if (!this.maskFbo || !this.pingFbo || !this.pongFbo || !this.distFbo) return;
|
|
2584
|
-
const
|
|
2585
|
-
if (
|
|
2586
|
-
e.viewport(0, 0,
|
|
2587
|
-
const r =
|
|
2724
|
+
const n = this._width, i = this._height;
|
|
2725
|
+
if (n === 0 || i === 0) return;
|
|
2726
|
+
e.viewport(0, 0, n, i), e.disable(e.STENCIL_TEST), e.disable(e.BLEND), e.bindFramebuffer(e.FRAMEBUFFER, this.maskFbo), e.clearColor(0, 0, 0, 1), e.clear(e.COLOR_BUFFER_BIT), e.useProgram(t.maskPass.program), e.uniform2f(t.maskPass.uniforms.uMeshScale, t.meshScaleX, t.meshScaleY), e.bindVertexArray(t.maskVao), e.drawElements(e.TRIANGLES, t.stencilIndexCount, e.UNSIGNED_SHORT, 0), e.bindFramebuffer(e.FRAMEBUFFER, this.pingFbo), e.clearColor(-1, -1, 0, 0), e.clear(e.COLOR_BUFFER_BIT), e.useProgram(t.seedPass.program), e.activeTexture(e.TEXTURE5), e.bindTexture(e.TEXTURE_2D, this.maskTex), e.uniform1i(t.seedPass.uniforms.uMask, 5), e.uniform2f(t.seedPass.uniforms.uTexelSize, 1 / n, 1 / i), e.bindVertexArray(t.quadVao), e.drawArrays(e.TRIANGLE_STRIP, 0, 4);
|
|
2727
|
+
const r = Pt.computeFloodIterations(n, i);
|
|
2588
2728
|
e.useProgram(t.floodPass.program);
|
|
2589
2729
|
let o = this.pingTex, l = this.pongFbo, a = this.pongTex;
|
|
2590
2730
|
for (let h = 0; h < r.length; h++) {
|
|
2591
|
-
const c = r[h] / Math.max(
|
|
2731
|
+
const c = r[h] / Math.max(n, i);
|
|
2592
2732
|
e.bindFramebuffer(e.FRAMEBUFFER, l), e.activeTexture(e.TEXTURE5), e.bindTexture(e.TEXTURE_2D, o), e.uniform1i(t.floodPass.uniforms.uSeedTex, 5), e.uniform1f(t.floodPass.uniforms.uStepSize, c), e.bindVertexArray(t.quadVao), e.drawArrays(e.TRIANGLE_STRIP, 0, 4);
|
|
2593
2733
|
const f = o, u = l;
|
|
2594
2734
|
o = a, l = u === this.pongFbo ? this.pingFbo : this.pongFbo, a = f;
|
|
@@ -2603,11 +2743,11 @@ class Rt {
|
|
|
2603
2743
|
* Steps halve from ceil(maxDim/2) down to 1.
|
|
2604
2744
|
*/
|
|
2605
2745
|
static computeFloodIterations(t, e) {
|
|
2606
|
-
const
|
|
2607
|
-
let r = Math.ceil(
|
|
2746
|
+
const n = Math.max(t, e), i = [];
|
|
2747
|
+
let r = Math.ceil(n / 2);
|
|
2608
2748
|
for (; r >= 1; )
|
|
2609
|
-
|
|
2610
|
-
return
|
|
2749
|
+
i.push(r), r = Math.floor(r / 2);
|
|
2750
|
+
return i;
|
|
2611
2751
|
}
|
|
2612
2752
|
// -----------------------------------------------------------------------
|
|
2613
2753
|
// Cleanup
|
|
@@ -2617,34 +2757,34 @@ class Rt {
|
|
|
2617
2757
|
this.maskTex && (t.deleteTexture(this.maskTex), this.maskTex = null), this.maskFbo && (t.deleteFramebuffer(this.maskFbo), this.maskFbo = null), this.pingTex && (t.deleteTexture(this.pingTex), this.pingTex = null), this.pingFbo && (t.deleteFramebuffer(this.pingFbo), this.pingFbo = null), this.pongTex && (t.deleteTexture(this.pongTex), this.pongTex = null), this.pongFbo && (t.deleteFramebuffer(this.pongFbo), this.pongFbo = null), this.distTex && (t.deleteTexture(this.distTex), this.distTex = null), this.distFbo && (t.deleteFramebuffer(this.distFbo), this.distFbo = null), this._width = 0, this._height = 0, this._dirty = !0;
|
|
2618
2758
|
}
|
|
2619
2759
|
}
|
|
2620
|
-
const
|
|
2760
|
+
const Ye = `#version 300 es
|
|
2621
2761
|
in vec2 aPosition;
|
|
2622
2762
|
uniform vec2 uMeshScale;
|
|
2623
2763
|
void main() {
|
|
2624
2764
|
gl_Position = vec4(aPosition * uMeshScale, 0.0, 1.0);
|
|
2625
2765
|
}
|
|
2626
|
-
`,
|
|
2766
|
+
`, je = `#version 300 es
|
|
2627
2767
|
precision lowp float;
|
|
2628
2768
|
out vec4 fragColor;
|
|
2629
2769
|
void main() { fragColor = vec4(0.0); }
|
|
2630
|
-
`,
|
|
2770
|
+
`, Ze = `#version 300 es
|
|
2631
2771
|
in vec2 aPosition;
|
|
2632
2772
|
uniform vec2 uMeshScale;
|
|
2633
2773
|
void main() {
|
|
2634
2774
|
gl_Position = vec4(aPosition * uMeshScale, 0.0, 1.0);
|
|
2635
2775
|
}
|
|
2636
|
-
`,
|
|
2776
|
+
`, $e = `#version 300 es
|
|
2637
2777
|
precision lowp float;
|
|
2638
2778
|
out vec4 fragColor;
|
|
2639
2779
|
void main() { fragColor = vec4(1.0); }
|
|
2640
|
-
`,
|
|
2780
|
+
`, Ke = `#version 300 es
|
|
2641
2781
|
in vec2 aPosition;
|
|
2642
2782
|
out vec2 vUv;
|
|
2643
2783
|
void main() {
|
|
2644
2784
|
vUv = aPosition * 0.5 + 0.5;
|
|
2645
2785
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
2646
2786
|
}
|
|
2647
|
-
`,
|
|
2787
|
+
`, Je = `#version 300 es
|
|
2648
2788
|
precision highp float;
|
|
2649
2789
|
uniform sampler2D uMask;
|
|
2650
2790
|
uniform vec2 uTexelSize;
|
|
@@ -2669,14 +2809,14 @@ void main() {
|
|
|
2669
2809
|
fragSeed = vec2(-1.0);
|
|
2670
2810
|
}
|
|
2671
2811
|
}
|
|
2672
|
-
`,
|
|
2812
|
+
`, Qe = `#version 300 es
|
|
2673
2813
|
in vec2 aPosition;
|
|
2674
2814
|
out vec2 vUv;
|
|
2675
2815
|
void main() {
|
|
2676
2816
|
vUv = aPosition * 0.5 + 0.5;
|
|
2677
2817
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
2678
2818
|
}
|
|
2679
|
-
`,
|
|
2819
|
+
`, tn = `#version 300 es
|
|
2680
2820
|
precision highp float;
|
|
2681
2821
|
uniform sampler2D uSeedTex;
|
|
2682
2822
|
uniform float uStepSize;
|
|
@@ -2705,14 +2845,14 @@ void main() {
|
|
|
2705
2845
|
|
|
2706
2846
|
fragSeed = bestSeed;
|
|
2707
2847
|
}
|
|
2708
|
-
`,
|
|
2848
|
+
`, en = `#version 300 es
|
|
2709
2849
|
in vec2 aPosition;
|
|
2710
2850
|
out vec2 vUv;
|
|
2711
2851
|
void main() {
|
|
2712
2852
|
vUv = aPosition * 0.5 + 0.5;
|
|
2713
2853
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
2714
2854
|
}
|
|
2715
|
-
`,
|
|
2855
|
+
`, nn = `#version 300 es
|
|
2716
2856
|
precision highp float;
|
|
2717
2857
|
uniform sampler2D uSeedTex;
|
|
2718
2858
|
uniform sampler2D uMask;
|
|
@@ -2737,7 +2877,7 @@ void main() {
|
|
|
2737
2877
|
float normalized = clamp(d / max(uBevelWidth, 0.001), 0.0, 1.0);
|
|
2738
2878
|
fragDist = vec4(normalized, 0.0, 0.0, 1.0);
|
|
2739
2879
|
}
|
|
2740
|
-
`,
|
|
2880
|
+
`, rn = `#version 300 es
|
|
2741
2881
|
in vec2 aPosition;
|
|
2742
2882
|
uniform vec2 uUvOffset;
|
|
2743
2883
|
uniform vec2 uUvScale;
|
|
@@ -2749,7 +2889,7 @@ void main() {
|
|
|
2749
2889
|
vScreenUv = baseUv;
|
|
2750
2890
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
2751
2891
|
}
|
|
2752
|
-
`,
|
|
2892
|
+
`, sn = `#version 300 es
|
|
2753
2893
|
precision highp float;
|
|
2754
2894
|
|
|
2755
2895
|
#define MAX_POM_STEPS 32
|
|
@@ -2880,14 +3020,14 @@ void main() {
|
|
|
2880
3020
|
// Write lens-transformed depth to second attachment for boundary effects
|
|
2881
3021
|
fragDepth = vec4(lensD, 0.0, 0.0, 1.0);
|
|
2882
3022
|
}
|
|
2883
|
-
`,
|
|
3023
|
+
`, on = `#version 300 es
|
|
2884
3024
|
in vec2 aPosition;
|
|
2885
3025
|
out vec2 vUv;
|
|
2886
3026
|
void main() {
|
|
2887
3027
|
vUv = aPosition * 0.5 + 0.5;
|
|
2888
3028
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
2889
3029
|
}
|
|
2890
|
-
`,
|
|
3030
|
+
`, an = `#version 300 es
|
|
2891
3031
|
precision highp float;
|
|
2892
3032
|
uniform sampler2D uInteriorColor;
|
|
2893
3033
|
uniform sampler2D uDistField;
|
|
@@ -2917,7 +3057,7 @@ void main() {
|
|
|
2917
3057
|
|
|
2918
3058
|
fragColor = vec4(toSRGB(linear), color.a);
|
|
2919
3059
|
}
|
|
2920
|
-
`,
|
|
3060
|
+
`, ln = `#version 300 es
|
|
2921
3061
|
in vec2 aPosition;
|
|
2922
3062
|
in vec2 aNormal;
|
|
2923
3063
|
uniform float uRimWidth;
|
|
@@ -2940,7 +3080,7 @@ void main() {
|
|
|
2940
3080
|
|
|
2941
3081
|
gl_Position = vec4(pos, 0.0, 1.0);
|
|
2942
3082
|
}
|
|
2943
|
-
`,
|
|
3083
|
+
`, un = `#version 300 es
|
|
2944
3084
|
precision highp float;
|
|
2945
3085
|
|
|
2946
3086
|
uniform sampler2D uInteriorColor;
|
|
@@ -3042,7 +3182,7 @@ void main() {
|
|
|
3042
3182
|
|
|
3043
3183
|
fragColor = vec4(color * alpha, alpha);
|
|
3044
3184
|
}
|
|
3045
|
-
`,
|
|
3185
|
+
`, cn = `#version 300 es
|
|
3046
3186
|
in vec2 aPosition;
|
|
3047
3187
|
in vec3 aNormal3;
|
|
3048
3188
|
in float aLerpT; // 0 = inner (at silhouette), 1 = outer edge
|
|
@@ -3058,7 +3198,7 @@ void main() {
|
|
|
3058
3198
|
vLerpT = aLerpT;
|
|
3059
3199
|
gl_Position = vec4(sp, 0.0, 1.0);
|
|
3060
3200
|
}
|
|
3061
|
-
`,
|
|
3201
|
+
`, hn = `#version 300 es
|
|
3062
3202
|
precision highp float;
|
|
3063
3203
|
uniform vec3 uLightDir3;
|
|
3064
3204
|
uniform vec3 uChamferColor;
|
|
@@ -3126,19 +3266,19 @@ void main() {
|
|
|
3126
3266
|
fragColor = vec4(toSRGB(lit), 1.0);
|
|
3127
3267
|
}
|
|
3128
3268
|
`;
|
|
3129
|
-
function
|
|
3269
|
+
function fn(s) {
|
|
3130
3270
|
const t = [];
|
|
3131
3271
|
let e = 0;
|
|
3132
|
-
for (let
|
|
3133
|
-
const
|
|
3272
|
+
for (let n = 0; n < s.length - 2; n += 2) {
|
|
3273
|
+
const i = s[n], r = s[n + 1], o = s[n + 2], l = s[n + 3], a = o - i, h = l - r, c = Math.sqrt(a * a + h * h);
|
|
3134
3274
|
if (c < 1e-6) continue;
|
|
3135
3275
|
const f = -h / c, u = a / c;
|
|
3136
3276
|
t.push(
|
|
3137
|
-
|
|
3277
|
+
i,
|
|
3138
3278
|
r,
|
|
3139
3279
|
f,
|
|
3140
3280
|
u,
|
|
3141
|
-
|
|
3281
|
+
i,
|
|
3142
3282
|
r,
|
|
3143
3283
|
-f,
|
|
3144
3284
|
-u,
|
|
@@ -3150,7 +3290,7 @@ function je(s) {
|
|
|
3150
3290
|
l,
|
|
3151
3291
|
f,
|
|
3152
3292
|
u,
|
|
3153
|
-
|
|
3293
|
+
i,
|
|
3154
3294
|
r,
|
|
3155
3295
|
-f,
|
|
3156
3296
|
-u,
|
|
@@ -3165,35 +3305,35 @@ function je(s) {
|
|
|
3165
3305
|
count: e
|
|
3166
3306
|
};
|
|
3167
3307
|
}
|
|
3168
|
-
function
|
|
3169
|
-
if (
|
|
3308
|
+
function dn(s, t, e, n, i) {
|
|
3309
|
+
if (n <= 0)
|
|
3170
3310
|
return { vertices: new Float32Array(0), count: 0 };
|
|
3171
|
-
const r =
|
|
3311
|
+
const r = i * Math.PI / 180, o = -Math.cos(r), l = Math.sin(r), a = [];
|
|
3172
3312
|
let h = 0;
|
|
3173
3313
|
for (let c = 0; c < t.length; c++) {
|
|
3174
3314
|
const f = t[c], p = ((c + 1 < t.length ? t[c + 1] : s.length) - f) / 2;
|
|
3175
3315
|
if (p < 3) continue;
|
|
3176
3316
|
const d = p - 1;
|
|
3177
|
-
let
|
|
3317
|
+
let S = 0;
|
|
3178
3318
|
for (let T = 0; T < d; T++) {
|
|
3179
3319
|
const w = f + T * 2, A = s[w], P = s[w + 1], F = s[w + 2], _ = s[w + 3];
|
|
3180
|
-
|
|
3320
|
+
S += A * _ - F * P;
|
|
3181
3321
|
}
|
|
3182
|
-
const
|
|
3322
|
+
const E = S >= 0 ? 1 : -1, b = [], g = [];
|
|
3183
3323
|
for (let T = 0; T < d; T++) {
|
|
3184
3324
|
const w = f + T * 2, A = s[w + 2] - s[w], P = s[w + 3] - s[w + 1], F = Math.sqrt(A * A + P * P);
|
|
3185
|
-
F < 1e-8 ? (
|
|
3325
|
+
F < 1e-8 ? (b.push(T > 0 ? b[T - 1] : 0), g.push(T > 0 ? g[T - 1] : 0)) : (b.push(-P / F * E), g.push(A / F * E));
|
|
3186
3326
|
}
|
|
3187
|
-
const
|
|
3327
|
+
const x = [], m = [];
|
|
3188
3328
|
for (let T = 0; T < d; T++) {
|
|
3189
3329
|
const w = (T - 1 + d) % d;
|
|
3190
|
-
let A =
|
|
3330
|
+
let A = b[w] + b[T], P = g[w] + g[T];
|
|
3191
3331
|
const F = Math.sqrt(A * A + P * P);
|
|
3192
|
-
F > 1e-8 ? (A /= F, P /= F) : (A =
|
|
3332
|
+
F > 1e-8 ? (A /= F, P /= F) : (A = b[T], P = g[T]), x.push(A), m.push(P);
|
|
3193
3333
|
}
|
|
3194
3334
|
for (let T = 0; T < d; T++) {
|
|
3195
|
-
const w = T, A = (T + 1) % d, P = f + T * 2, F = f + (T + 1) % d * 2, _ = s[P], I = s[P + 1], C = s[F],
|
|
3196
|
-
a.push(_, I, D, U, M, 0), a.push(at,
|
|
3335
|
+
const w = T, A = (T + 1) % d, P = f + T * 2, F = f + (T + 1) % d * 2, _ = s[P], I = s[P + 1], C = s[F], y = s[F + 1], D = x[w] * l, U = m[w] * l, M = o, O = x[A] * l, j = m[A] * l, et = o, at = _ + x[w] * n, Dt = I + m[w] * n, ee = C + x[A] * n, ne = y + m[A] * n;
|
|
3336
|
+
a.push(_, I, D, U, M, 0), a.push(at, Dt, D, U, M, 1), a.push(C, y, O, j, et, 0), a.push(C, y, O, j, et, 0), a.push(at, Dt, D, U, M, 1), a.push(ee, ne, O, j, et, 1), h += 6;
|
|
3197
3337
|
}
|
|
3198
3338
|
}
|
|
3199
3339
|
return {
|
|
@@ -3201,7 +3341,7 @@ function Ze(s, t, e, i, n) {
|
|
|
3201
3341
|
count: h
|
|
3202
3342
|
};
|
|
3203
3343
|
}
|
|
3204
|
-
class
|
|
3344
|
+
class mn extends vt {
|
|
3205
3345
|
gl = null;
|
|
3206
3346
|
// Render passes (each owns its program + cached uniforms)
|
|
3207
3347
|
stencilPass = null;
|
|
@@ -3223,7 +3363,7 @@ class $e extends gt {
|
|
|
3223
3363
|
chamferVao = null;
|
|
3224
3364
|
chamferVertexCount = 0;
|
|
3225
3365
|
// Source textures (via TextureRegistry — init-time allocation)
|
|
3226
|
-
textures = new
|
|
3366
|
+
textures = new Gt();
|
|
3227
3367
|
videoSlot;
|
|
3228
3368
|
depthSlot;
|
|
3229
3369
|
// Interior FBO (units 2, 3)
|
|
@@ -3246,10 +3386,10 @@ class $e extends gt {
|
|
|
3246
3386
|
config;
|
|
3247
3387
|
constructor(t, e) {
|
|
3248
3388
|
super(t), this.config = { ...e }, this.videoSlot = this.textures.register("video"), this.depthSlot = this.textures.register("depth");
|
|
3249
|
-
const
|
|
3250
|
-
this.lightDirX = Math.cos(
|
|
3251
|
-
const
|
|
3252
|
-
r > 1e-6 && (this.lightDir3 = [
|
|
3389
|
+
const n = this.config.bevelLightAngle * Math.PI / 180;
|
|
3390
|
+
this.lightDirX = Math.cos(n), this.lightDirY = Math.sin(n);
|
|
3391
|
+
const i = this.config.lightDirection, r = Math.sqrt(i[0] * i[0] + i[1] * i[1] + i[2] * i[2]);
|
|
3392
|
+
r > 1e-6 && (this.lightDir3 = [i[0] / r, i[1] / r, i[2] / r]);
|
|
3253
3393
|
const o = this.canvas.getContext("webgl2", {
|
|
3254
3394
|
antialias: !0,
|
|
3255
3395
|
alpha: !0,
|
|
@@ -3259,11 +3399,11 @@ class $e extends gt {
|
|
|
3259
3399
|
powerPreference: "high-performance"
|
|
3260
3400
|
});
|
|
3261
3401
|
if (!o) throw new Error("WebGL 2 is not supported.");
|
|
3262
|
-
this.gl = o, this.qualityParams =
|
|
3402
|
+
this.gl = o, this.qualityParams = Wt(o, e.quality), "drawingBufferColorSpace" in o && (o.drawingBufferColorSpace = "srgb"), this.hasColorBufferFloat = !!o.getExtension("EXT_color_buffer_float"), o.clearColor(0, 0, 0, 0), o.pixelStorei(o.UNPACK_FLIP_Y_WEBGL, !0), this.initGPUResources(), this.setupResizeHandling();
|
|
3263
3403
|
}
|
|
3264
|
-
initialize(t, e,
|
|
3404
|
+
initialize(t, e, n, i) {
|
|
3265
3405
|
const r = this.gl;
|
|
3266
|
-
r && (this.disposeTextures(), this.disposeFBO(), this.jfa && (this.jfa.dispose(), this.jfa = null), this.disposeStencilGeometry(), this.disposeBoundaryGeometry(), this.disposeChamferGeometry(), this.isCameraSource = t.type === "camera", this.videoAspect = t.width / t.height, this.meshAspect =
|
|
3406
|
+
r && (this.disposeTextures(), this.disposeFBO(), this.jfa && (this.jfa.dispose(), this.jfa = null), this.disposeStencilGeometry(), this.disposeBoundaryGeometry(), this.disposeChamferGeometry(), this.isCameraSource = t.type === "camera", this.videoAspect = t.width / t.height, this.meshAspect = i.aspect, this.clampDepthDimensions(e, n, this.qualityParams.depthMaxDim), this.videoSlot.texture = r.createTexture(), r.activeTexture(r.TEXTURE0 + this.videoSlot.unit), r.bindTexture(r.TEXTURE_2D, this.videoSlot.texture), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_MIN_FILTER, r.LINEAR), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_MAG_FILTER, r.LINEAR), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_WRAP_S, r.CLAMP_TO_EDGE), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_WRAP_T, r.CLAMP_TO_EDGE), this.depthSlot.texture = r.createTexture(), r.activeTexture(r.TEXTURE0 + this.depthSlot.unit), r.bindTexture(r.TEXTURE_2D, this.depthSlot.texture), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_MIN_FILTER, r.LINEAR), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_MAG_FILTER, r.LINEAR), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_WRAP_S, r.CLAMP_TO_EDGE), r.texParameteri(r.TEXTURE_2D, r.TEXTURE_WRAP_T, r.CLAMP_TO_EDGE), r.texStorage2D(r.TEXTURE_2D, 1, r.R8, this.depthWidth, this.depthHeight), this.uploadStencilMesh(i), this.uploadMaskMesh(i), this.uploadBoundaryMesh(i), this.uploadChamferMesh(i), this.interiorPass && (r.useProgram(this.interiorPass.program), r.uniform1i(this.interiorPass.uniforms.uImage, 0), r.uniform1i(this.interiorPass.uniforms.uDepth, 1), r.uniform1f(this.interiorPass.uniforms.uStrength, this.config.parallaxStrength), r.uniform1i(this.interiorPass.uniforms.uPomSteps, this.config.pomSteps), r.uniform1f(this.interiorPass.uniforms.uDepthPower, this.config.depthPower), r.uniform1f(this.interiorPass.uniforms.uDepthScale, this.config.depthScale), r.uniform1f(this.interiorPass.uniforms.uDepthBias, this.config.depthBias), r.uniform1f(this.interiorPass.uniforms.uContrastLow, this.config.contrastLow), r.uniform1f(this.interiorPass.uniforms.uContrastHigh, this.config.contrastHigh), r.uniform1f(this.interiorPass.uniforms.uVerticalReduction, this.config.verticalReduction), r.uniform1f(this.interiorPass.uniforms.uDofStart, this.config.dofStart), r.uniform1f(this.interiorPass.uniforms.uDofStrength, this.config.dofStrength), r.uniform2f(this.interiorPass.uniforms.uImageTexelSize, 1 / t.width, 1 / t.height), r.uniform1f(this.interiorPass.uniforms.uFogDensity, this.config.fogDensity), r.uniform3f(this.interiorPass.uniforms.uFogColor, ...this.config.fogColor), r.uniform1f(this.interiorPass.uniforms.uColorShift, this.config.colorShift), r.uniform1f(this.interiorPass.uniforms.uBrightnessBias, this.config.brightnessBias)), this.compositePass && (r.useProgram(this.compositePass.program), r.uniform1i(this.compositePass.uniforms.uInteriorColor, 2), r.uniform1i(this.compositePass.uniforms.uDistField, 4), r.uniform1f(this.compositePass.uniforms.uEdgeOcclusionWidth, this.config.edgeOcclusionWidth), r.uniform1f(this.compositePass.uniforms.uEdgeOcclusionStrength, this.config.edgeOcclusionStrength)), this.chamferPass && (r.useProgram(this.chamferPass.program), r.uniform3f(this.chamferPass.uniforms.uLightDir3, ...this.lightDir3), r.uniform3f(this.chamferPass.uniforms.uChamferColor, ...this.config.chamferColor), r.uniform1f(this.chamferPass.uniforms.uChamferAmbient, this.config.chamferAmbient), r.uniform1f(this.chamferPass.uniforms.uChamferSpecular, this.config.chamferSpecular), r.uniform1f(this.chamferPass.uniforms.uChamferShininess, this.config.chamferShininess), r.uniform1i(this.chamferPass.uniforms.uInteriorColor, 2)), this.boundaryPass && (r.useProgram(this.boundaryPass.program), r.uniform1i(this.boundaryPass.uniforms.uInteriorColor, 2), r.uniform1i(this.boundaryPass.uniforms.uInteriorDepth, 3), r.uniform1i(this.boundaryPass.uniforms.uDistField, 4), r.uniform1f(this.boundaryPass.uniforms.uRimIntensity, this.config.rimLightIntensity), r.uniform3f(this.boundaryPass.uniforms.uRimColor, ...this.config.rimLightColor), r.uniform1f(this.boundaryPass.uniforms.uRefractionStrength, this.config.refractionStrength), r.uniform1f(this.boundaryPass.uniforms.uChromaticStrength, this.config.chromaticStrength), r.uniform1f(this.boundaryPass.uniforms.uOcclusionIntensity, this.config.occlusionIntensity), r.uniform1f(this.boundaryPass.uniforms.uEdgeThickness, this.config.edgeThickness), r.uniform1f(this.boundaryPass.uniforms.uEdgeSpecular, this.config.edgeSpecular), r.uniform3f(this.boundaryPass.uniforms.uEdgeColor, ...this.config.edgeColor), r.uniform2f(this.boundaryPass.uniforms.uLightDir, this.lightDirX, this.lightDirY), r.uniform1f(this.boundaryPass.uniforms.uBevelIntensity, this.config.bevelIntensity)), this.recalculateViewportLayout());
|
|
3267
3407
|
}
|
|
3268
3408
|
// -----------------------------------------------------------------------
|
|
3269
3409
|
// Geometry upload
|
|
@@ -3272,10 +3412,10 @@ class $e extends gt {
|
|
|
3272
3412
|
const e = this.gl;
|
|
3273
3413
|
if (!e || !this.stencilPass) return;
|
|
3274
3414
|
this.stencilVao = e.createVertexArray(), e.bindVertexArray(this.stencilVao);
|
|
3275
|
-
const
|
|
3276
|
-
e.bindBuffer(e.ARRAY_BUFFER,
|
|
3277
|
-
const
|
|
3278
|
-
e.enableVertexAttribArray(
|
|
3415
|
+
const n = e.createBuffer();
|
|
3416
|
+
e.bindBuffer(e.ARRAY_BUFFER, n), e.bufferData(e.ARRAY_BUFFER, t.vertices, e.STATIC_DRAW);
|
|
3417
|
+
const i = e.getAttribLocation(this.stencilPass.program, "aPosition");
|
|
3418
|
+
e.enableVertexAttribArray(i), e.vertexAttribPointer(i, 2, e.FLOAT, !1, 0, 0);
|
|
3279
3419
|
const r = e.createBuffer();
|
|
3280
3420
|
e.bindBuffer(e.ELEMENT_ARRAY_BUFFER, r), e.bufferData(e.ELEMENT_ARRAY_BUFFER, t.indices, e.STATIC_DRAW), this.stencilIndexCount = t.indices.length, e.bindVertexArray(null);
|
|
3281
3421
|
}
|
|
@@ -3283,46 +3423,46 @@ class $e extends gt {
|
|
|
3283
3423
|
const e = this.gl;
|
|
3284
3424
|
if (!e || !this.maskPass) return;
|
|
3285
3425
|
this.maskVao = e.createVertexArray(), e.bindVertexArray(this.maskVao);
|
|
3286
|
-
const
|
|
3287
|
-
e.bindBuffer(e.ARRAY_BUFFER,
|
|
3288
|
-
const
|
|
3289
|
-
e.enableVertexAttribArray(
|
|
3426
|
+
const n = e.createBuffer();
|
|
3427
|
+
e.bindBuffer(e.ARRAY_BUFFER, n), e.bufferData(e.ARRAY_BUFFER, t.vertices, e.STATIC_DRAW);
|
|
3428
|
+
const i = e.getAttribLocation(this.maskPass.program, "aPosition");
|
|
3429
|
+
e.enableVertexAttribArray(i), e.vertexAttribPointer(i, 2, e.FLOAT, !1, 0, 0);
|
|
3290
3430
|
const r = e.createBuffer();
|
|
3291
3431
|
e.bindBuffer(e.ELEMENT_ARRAY_BUFFER, r), e.bufferData(e.ELEMENT_ARRAY_BUFFER, t.indices, e.STATIC_DRAW), e.bindVertexArray(null);
|
|
3292
3432
|
}
|
|
3293
3433
|
uploadBoundaryMesh(t) {
|
|
3294
3434
|
const e = this.gl;
|
|
3295
3435
|
if (!e || !this.boundaryPass) return;
|
|
3296
|
-
const
|
|
3297
|
-
if (
|
|
3436
|
+
const n = fn(t.edgeVertices);
|
|
3437
|
+
if (n.count === 0) return;
|
|
3298
3438
|
this.boundaryVao = e.createVertexArray(), e.bindVertexArray(this.boundaryVao);
|
|
3299
|
-
const
|
|
3300
|
-
e.bindBuffer(e.ARRAY_BUFFER,
|
|
3439
|
+
const i = e.createBuffer();
|
|
3440
|
+
e.bindBuffer(e.ARRAY_BUFFER, i), e.bufferData(e.ARRAY_BUFFER, n.vertices, e.STATIC_DRAW);
|
|
3301
3441
|
const r = 16, o = e.getAttribLocation(this.boundaryPass.program, "aPosition");
|
|
3302
3442
|
e.enableVertexAttribArray(o), e.vertexAttribPointer(o, 2, e.FLOAT, !1, r, 0);
|
|
3303
3443
|
const l = e.getAttribLocation(this.boundaryPass.program, "aNormal");
|
|
3304
|
-
l >= 0 && (e.enableVertexAttribArray(l), e.vertexAttribPointer(l, 2, e.FLOAT, !1, r, 8)), this.boundaryVertexCount =
|
|
3444
|
+
l >= 0 && (e.enableVertexAttribArray(l), e.vertexAttribPointer(l, 2, e.FLOAT, !1, r, 8)), this.boundaryVertexCount = n.count, e.bindVertexArray(null);
|
|
3305
3445
|
}
|
|
3306
3446
|
uploadChamferMesh(t) {
|
|
3307
3447
|
const e = this.gl;
|
|
3308
3448
|
if (!e || !this.chamferPass || this.config.chamferWidth <= 0) return;
|
|
3309
|
-
const
|
|
3449
|
+
const n = dn(
|
|
3310
3450
|
t.edgeVertices,
|
|
3311
3451
|
t.contourOffsets,
|
|
3312
3452
|
t.contourIsHole,
|
|
3313
3453
|
this.config.chamferWidth,
|
|
3314
3454
|
this.config.chamferAngle
|
|
3315
3455
|
);
|
|
3316
|
-
if (
|
|
3456
|
+
if (n.count === 0) return;
|
|
3317
3457
|
this.chamferVao = e.createVertexArray(), e.bindVertexArray(this.chamferVao);
|
|
3318
|
-
const
|
|
3319
|
-
e.bindBuffer(e.ARRAY_BUFFER,
|
|
3458
|
+
const i = e.createBuffer();
|
|
3459
|
+
e.bindBuffer(e.ARRAY_BUFFER, i), e.bufferData(e.ARRAY_BUFFER, n.vertices, e.STATIC_DRAW);
|
|
3320
3460
|
const r = 24, o = e.getAttribLocation(this.chamferPass.program, "aPosition");
|
|
3321
3461
|
e.enableVertexAttribArray(o), e.vertexAttribPointer(o, 2, e.FLOAT, !1, r, 0);
|
|
3322
3462
|
const l = e.getAttribLocation(this.chamferPass.program, "aNormal3");
|
|
3323
3463
|
l >= 0 && (e.enableVertexAttribArray(l), e.vertexAttribPointer(l, 3, e.FLOAT, !1, r, 8));
|
|
3324
3464
|
const a = e.getAttribLocation(this.chamferPass.program, "aLerpT");
|
|
3325
|
-
a >= 0 && (e.enableVertexAttribArray(a), e.vertexAttribPointer(a, 1, e.FLOAT, !1, r, 20)), this.chamferVertexCount =
|
|
3465
|
+
a >= 0 && (e.enableVertexAttribArray(a), e.vertexAttribPointer(a, 1, e.FLOAT, !1, r, 20)), this.chamferVertexCount = n.count, e.bindVertexArray(null);
|
|
3326
3466
|
}
|
|
3327
3467
|
disposeChamferGeometry() {
|
|
3328
3468
|
const t = this.gl;
|
|
@@ -3332,18 +3472,18 @@ class $e extends gt {
|
|
|
3332
3472
|
// FBO management
|
|
3333
3473
|
// -----------------------------------------------------------------------
|
|
3334
3474
|
createFBO(t, e) {
|
|
3335
|
-
const
|
|
3336
|
-
if (!
|
|
3337
|
-
this.disposeFBO(), this.fboWidth = t, this.fboHeight = e, this.interiorFbo =
|
|
3338
|
-
const
|
|
3339
|
-
|
|
3475
|
+
const n = this.gl;
|
|
3476
|
+
if (!n) return;
|
|
3477
|
+
this.disposeFBO(), this.fboWidth = t, this.fboHeight = e, this.interiorFbo = n.createFramebuffer(), n.bindFramebuffer(n.FRAMEBUFFER, this.interiorFbo), this.interiorColorTex = n.createTexture(), n.activeTexture(n.TEXTURE2), n.bindTexture(n.TEXTURE_2D, this.interiorColorTex), n.texStorage2D(n.TEXTURE_2D, 1, n.RGBA8, t, e), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_MIN_FILTER, n.LINEAR), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_MAG_FILTER, n.LINEAR), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_WRAP_S, n.CLAMP_TO_EDGE), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_WRAP_T, n.CLAMP_TO_EDGE), n.framebufferTexture2D(n.FRAMEBUFFER, n.COLOR_ATTACHMENT0, n.TEXTURE_2D, this.interiorColorTex, 0), this.interiorDepthTex = n.createTexture(), n.activeTexture(n.TEXTURE3), n.bindTexture(n.TEXTURE_2D, this.interiorDepthTex), n.texStorage2D(n.TEXTURE_2D, 1, n.RGBA8, t, e), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_MIN_FILTER, n.LINEAR), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_MAG_FILTER, n.LINEAR), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_WRAP_S, n.CLAMP_TO_EDGE), n.texParameteri(n.TEXTURE_2D, n.TEXTURE_WRAP_T, n.CLAMP_TO_EDGE), n.framebufferTexture2D(n.FRAMEBUFFER, n.COLOR_ATTACHMENT1, n.TEXTURE_2D, this.interiorDepthTex, 0), n.drawBuffers([n.COLOR_ATTACHMENT0, n.COLOR_ATTACHMENT1]);
|
|
3478
|
+
const i = n.checkFramebufferStatus(n.FRAMEBUFFER);
|
|
3479
|
+
i !== n.FRAMEBUFFER_COMPLETE && console.error("Interior FBO incomplete:", i), n.bindFramebuffer(n.FRAMEBUFFER, null);
|
|
3340
3480
|
}
|
|
3341
3481
|
// -----------------------------------------------------------------------
|
|
3342
3482
|
// JFA Distance Field
|
|
3343
3483
|
// -----------------------------------------------------------------------
|
|
3344
3484
|
createJFAResources(t, e) {
|
|
3345
|
-
const
|
|
3346
|
-
|
|
3485
|
+
const n = this.gl;
|
|
3486
|
+
n && (this.jfa || (this.jfa = new Pt(n, this.hasColorBufferFloat)), this.jfa.createResources(t, e, this.qualityParams.jfaDivisor));
|
|
3347
3487
|
}
|
|
3348
3488
|
computeDistanceField() {
|
|
3349
3489
|
!this.jfa || !this.maskPass || !this.jfaSeedPass || !this.jfaFloodPass || !this.jfaDistPass || !this.maskVao || !this.quadVao || this.jfa.compute({
|
|
@@ -3364,7 +3504,7 @@ class $e extends gt {
|
|
|
3364
3504
|
// -----------------------------------------------------------------------
|
|
3365
3505
|
initGPUResources() {
|
|
3366
3506
|
const t = this.gl;
|
|
3367
|
-
t && (this.stencilPass =
|
|
3507
|
+
t && (this.stencilPass = k(t, "stencil", Ye, je, ["uMeshScale"]), this.maskPass = k(t, "mask", Ze, $e, ["uMeshScale"]), this.jfaSeedPass = k(t, "jfa-seed", Ke, Je, ["uMask", "uTexelSize"]), this.jfaFloodPass = k(t, "jfa-flood", Qe, tn, ["uSeedTex", "uStepSize"]), this.jfaDistPass = k(t, "jfa-dist", en, nn, ["uSeedTex", "uMask", "uBevelWidth"]), this.interiorPass = k(t, "interior", rn, sn, [
|
|
3368
3508
|
"uImage",
|
|
3369
3509
|
"uDepth",
|
|
3370
3510
|
"uOffset",
|
|
@@ -3385,12 +3525,12 @@ class $e extends gt {
|
|
|
3385
3525
|
"uBrightnessBias",
|
|
3386
3526
|
"uUvOffset",
|
|
3387
3527
|
"uUvScale"
|
|
3388
|
-
]), this.compositePass =
|
|
3528
|
+
]), this.compositePass = k(t, "composite", on, an, [
|
|
3389
3529
|
"uInteriorColor",
|
|
3390
3530
|
"uDistField",
|
|
3391
3531
|
"uEdgeOcclusionWidth",
|
|
3392
3532
|
"uEdgeOcclusionStrength"
|
|
3393
|
-
]), this.boundaryPass =
|
|
3533
|
+
]), this.boundaryPass = k(t, "boundary", ln, un, [
|
|
3394
3534
|
"uInteriorColor",
|
|
3395
3535
|
"uInteriorDepth",
|
|
3396
3536
|
"uDistField",
|
|
@@ -3407,7 +3547,7 @@ class $e extends gt {
|
|
|
3407
3547
|
"uEdgeColor",
|
|
3408
3548
|
"uLightDir",
|
|
3409
3549
|
"uBevelIntensity"
|
|
3410
|
-
]), this.chamferPass =
|
|
3550
|
+
]), this.chamferPass = k(t, "chamfer", cn, hn, [
|
|
3411
3551
|
"uMeshScale",
|
|
3412
3552
|
"uLightDir3",
|
|
3413
3553
|
"uChamferColor",
|
|
@@ -3416,7 +3556,7 @@ class $e extends gt {
|
|
|
3416
3556
|
"uChamferShininess",
|
|
3417
3557
|
"uInteriorColor",
|
|
3418
3558
|
"uTexelSize"
|
|
3419
|
-
]), this.quadVao =
|
|
3559
|
+
]), this.quadVao = Xt(t, this.interiorPass.program), t.disable(t.DEPTH_TEST));
|
|
3420
3560
|
}
|
|
3421
3561
|
// -----------------------------------------------------------------------
|
|
3422
3562
|
// Abstract method implementations (RendererBase)
|
|
@@ -3430,23 +3570,23 @@ class $e extends gt {
|
|
|
3430
3570
|
onRenderFrame() {
|
|
3431
3571
|
const t = this.gl, e = this.mediaSource;
|
|
3432
3572
|
if (!t || !this.interiorPass || !this.quadVao) return;
|
|
3433
|
-
const
|
|
3434
|
-
if (!
|
|
3573
|
+
const n = e?.getImageSource();
|
|
3574
|
+
if (!n || !this.interiorFbo || !this.interiorColorTex || !this.interiorDepthTex) return;
|
|
3435
3575
|
if (this.jfa?.isDirty && this.maskVao) {
|
|
3436
3576
|
const o = this.qualityParams.jfaDivisor, l = Math.max(1, Math.round(this.canvas.width / o)), a = Math.max(1, Math.round(this.canvas.height / o));
|
|
3437
3577
|
(this.jfa.width !== l || this.jfa.height !== a) && this.createJFAResources(this.canvas.width, this.canvas.height), this.computeDistanceField(), t.viewport(0, 0, this.canvas.width, this.canvas.height);
|
|
3438
3578
|
}
|
|
3439
|
-
t.activeTexture(t.TEXTURE0 + this.videoSlot.unit), t.bindTexture(t.TEXTURE_2D, this.videoSlot.texture), t.texImage2D(t.TEXTURE_2D, 0, t.RGBA, t.RGBA, t.UNSIGNED_BYTE,
|
|
3440
|
-
let
|
|
3579
|
+
t.activeTexture(t.TEXTURE0 + this.videoSlot.unit), t.bindTexture(t.TEXTURE_2D, this.videoSlot.texture), t.texImage2D(t.TEXTURE_2D, 0, t.RGBA, t.RGBA, t.UNSIGNED_BYTE, n), this.rvfcSupported || this.onDepthUpdate(e.currentTime);
|
|
3580
|
+
let i = 0, r = 0;
|
|
3441
3581
|
if (this.readInput) {
|
|
3442
3582
|
const o = this.readInput();
|
|
3443
|
-
|
|
3583
|
+
i = -o.x, r = o.y;
|
|
3444
3584
|
}
|
|
3445
3585
|
if (t.bindFramebuffer(t.FRAMEBUFFER, this.interiorFbo), t.checkFramebufferStatus(t.FRAMEBUFFER) !== t.FRAMEBUFFER_COMPLETE) {
|
|
3446
3586
|
t.bindFramebuffer(t.FRAMEBUFFER, null);
|
|
3447
3587
|
return;
|
|
3448
3588
|
}
|
|
3449
|
-
t.viewport(0, 0, this.fboWidth, this.fboHeight), t.clearColor(0, 0, 0, 1), t.clear(t.COLOR_BUFFER_BIT), t.useProgram(this.interiorPass.program), t.uniform2f(this.interiorPass.uniforms.uOffset,
|
|
3589
|
+
t.viewport(0, 0, this.fboWidth, this.fboHeight), t.clearColor(0, 0, 0, 1), t.clear(t.COLOR_BUFFER_BIT), t.useProgram(this.interiorPass.program), t.uniform2f(this.interiorPass.uniforms.uOffset, i, r), t.activeTexture(t.TEXTURE0 + this.videoSlot.unit), t.bindTexture(t.TEXTURE_2D, this.videoSlot.texture), t.activeTexture(t.TEXTURE0 + this.depthSlot.unit), t.bindTexture(t.TEXTURE_2D, this.depthSlot.texture), t.bindVertexArray(this.quadVao), t.drawArrays(t.TRIANGLE_STRIP, 0, 4), t.bindFramebuffer(t.FRAMEBUFFER, null), t.clearColor(0, 0, 0, 0), t.viewport(0, 0, this.canvas.width, this.canvas.height), t.clear(t.COLOR_BUFFER_BIT | t.STENCIL_BUFFER_BIT), this.stencilVao && this.stencilPass && this.stencilIndexCount > 0 && (t.enable(t.STENCIL_TEST), t.stencilFunc(t.ALWAYS, 1, 255), t.stencilOp(t.KEEP, t.KEEP, t.REPLACE), t.stencilMask(255), t.colorMask(!1, !1, !1, !1), t.useProgram(this.stencilPass.program), t.bindVertexArray(this.stencilVao), t.drawElements(t.TRIANGLES, this.stencilIndexCount, t.UNSIGNED_SHORT, 0), t.colorMask(!0, !0, !0, !0)), t.stencilFunc(t.EQUAL, 1, 255), t.stencilMask(0), t.activeTexture(t.TEXTURE2), t.bindTexture(t.TEXTURE_2D, this.interiorColorTex), t.activeTexture(t.TEXTURE3), t.bindTexture(t.TEXTURE_2D, this.interiorDepthTex), t.activeTexture(t.TEXTURE4), t.bindTexture(t.TEXTURE_2D, this.jfa?.distanceTexture ?? null), t.useProgram(this.compositePass.program), t.bindVertexArray(this.quadVao), t.drawArrays(t.TRIANGLE_STRIP, 0, 4), t.disable(t.STENCIL_TEST), this.chamferVao && this.chamferPass && this.chamferVertexCount > 0 && (t.useProgram(this.chamferPass.program), t.uniform2f(this.chamferPass.uniforms.uMeshScale, this.meshScaleX, this.meshScaleY), t.uniform2f(this.chamferPass.uniforms.uTexelSize, 1 / this.canvas.width, 1 / this.canvas.height), t.bindVertexArray(this.chamferVao), t.drawArrays(t.TRIANGLES, 0, this.chamferVertexCount)), this.boundaryVao && this.boundaryPass && this.boundaryVertexCount > 0 && this.config.rimLightIntensity > 0 && (t.enable(t.BLEND), t.blendFunc(t.SRC_ALPHA, t.ONE_MINUS_SRC_ALPHA), t.useProgram(this.boundaryPass.program), t.bindVertexArray(this.boundaryVao), t.drawArrays(t.TRIANGLES, 0, this.boundaryVertexCount), t.disable(t.BLEND));
|
|
3450
3590
|
}
|
|
3451
3591
|
/**
|
|
3452
3592
|
* Upload depth data to the GPU texture.
|
|
@@ -3455,7 +3595,7 @@ class $e extends gt {
|
|
|
3455
3595
|
onDepthUpdate(t) {
|
|
3456
3596
|
const e = this.gl;
|
|
3457
3597
|
if (!e || !this.readDepth || !this.depthSlot.texture) return;
|
|
3458
|
-
const
|
|
3598
|
+
const n = this.subsampleDepth(this.readDepth(t));
|
|
3459
3599
|
e.activeTexture(e.TEXTURE0 + this.depthSlot.unit), e.bindTexture(e.TEXTURE_2D, this.depthSlot.texture), e.texSubImage2D(
|
|
3460
3600
|
e.TEXTURE_2D,
|
|
3461
3601
|
0,
|
|
@@ -3465,7 +3605,7 @@ class $e extends gt {
|
|
|
3465
3605
|
this.depthHeight,
|
|
3466
3606
|
e.RED,
|
|
3467
3607
|
e.UNSIGNED_BYTE,
|
|
3468
|
-
|
|
3608
|
+
n
|
|
3469
3609
|
), this.jfa && this.jfa.markDirty();
|
|
3470
3610
|
}
|
|
3471
3611
|
// -----------------------------------------------------------------------
|
|
@@ -3474,9 +3614,9 @@ class $e extends gt {
|
|
|
3474
3614
|
recalculateViewportLayout() {
|
|
3475
3615
|
const t = this.gl;
|
|
3476
3616
|
if (!t) return;
|
|
3477
|
-
const { width: e, height:
|
|
3617
|
+
const { width: e, height: n } = this.getViewportSize(), i = Math.min(window.devicePixelRatio, this.qualityParams.dprCap), r = Math.round(e * i), o = Math.round(n * i);
|
|
3478
3618
|
(this.canvas.width !== r || this.canvas.height !== o) && (this.canvas.width = r, this.canvas.height = o, t.viewport(0, 0, r, o)), (this.fboWidth !== r || this.fboHeight !== o) && this.createFBO(r, o), this.jfa || this.createJFAResources(r, o), this.computeCoverFitUV(this.config.parallaxStrength, this.config.overscanPadding), this.interiorPass && (t.useProgram(this.interiorPass.program), t.uniform2f(this.interiorPass.uniforms.uUvOffset, this.uvOffset[0], this.uvOffset[1]), t.uniform2f(this.interiorPass.uniforms.uUvScale, this.uvScale[0], this.uvScale[1]));
|
|
3479
|
-
const l = e /
|
|
3619
|
+
const l = e / n, a = 0.65;
|
|
3480
3620
|
this.meshScaleX = a, this.meshScaleY = a, l > this.meshAspect ? this.meshScaleX = a * (this.meshAspect / l) : this.meshScaleY = a * (l / this.meshAspect), this.stencilPass && (t.useProgram(this.stencilPass.program), t.uniform2f(this.stencilPass.uniforms.uMeshScale, this.meshScaleX, this.meshScaleY)), this.boundaryPass && (t.useProgram(this.boundaryPass.program), t.uniform2f(this.boundaryPass.uniforms.uMeshScale, this.meshScaleX, this.meshScaleY), t.uniform1f(this.boundaryPass.uniforms.uRimWidth, this.config.rimLightWidth), t.uniform2f(this.boundaryPass.uniforms.uTexelSize, 1 / r, 1 / o)), this.chamferPass && (t.useProgram(this.chamferPass.program), t.uniform2f(this.chamferPass.uniforms.uMeshScale, this.meshScaleX, this.meshScaleY));
|
|
3481
3621
|
}
|
|
3482
3622
|
// -----------------------------------------------------------------------
|
|
@@ -3530,56 +3670,56 @@ class $e extends gt {
|
|
|
3530
3670
|
this.boundaryPass,
|
|
3531
3671
|
this.chamferPass
|
|
3532
3672
|
];
|
|
3533
|
-
for (const
|
|
3534
|
-
|
|
3673
|
+
for (const n of e)
|
|
3674
|
+
n && n.dispose(t);
|
|
3535
3675
|
this.stencilPass = null, this.maskPass = null, this.jfaSeedPass = null, this.jfaFloodPass = null, this.jfaDistPass = null, this.interiorPass = null, this.compositePass = null, this.boundaryPass = null, this.chamferPass = null, this.quadVao && (t.deleteVertexArray(this.quadVao), this.quadVao = null);
|
|
3536
3676
|
}
|
|
3537
3677
|
}
|
|
3538
|
-
async function
|
|
3678
|
+
async function Et(s) {
|
|
3539
3679
|
const t = await fetch(s);
|
|
3540
3680
|
if (!t.ok)
|
|
3541
3681
|
throw new Error(`Failed to fetch SVG: ${t.status} ${t.statusText}`);
|
|
3542
3682
|
const e = await t.text();
|
|
3543
|
-
return
|
|
3683
|
+
return pn(e);
|
|
3544
3684
|
}
|
|
3545
|
-
function
|
|
3546
|
-
const
|
|
3547
|
-
if (!
|
|
3685
|
+
function pn(s) {
|
|
3686
|
+
const n = new DOMParser().parseFromString(s, "image/svg+xml").querySelector("svg");
|
|
3687
|
+
if (!n)
|
|
3548
3688
|
throw new Error("No <svg> element found in document.");
|
|
3549
|
-
const
|
|
3550
|
-
if (
|
|
3689
|
+
const i = gn(n);
|
|
3690
|
+
if (i.length === 0)
|
|
3551
3691
|
throw new Error("No path data found in SVG.");
|
|
3552
3692
|
let r = 1 / 0, o = 1 / 0, l = -1 / 0, a = -1 / 0;
|
|
3553
|
-
for (const C of
|
|
3554
|
-
for (let
|
|
3555
|
-
r = Math.min(r, C[
|
|
3556
|
-
const h = l - r, c = a - o, f = (r + l) / 2, u = (o + a) / 2,
|
|
3557
|
-
const
|
|
3693
|
+
for (const C of i)
|
|
3694
|
+
for (let y = 0; y < C.length; y += 2)
|
|
3695
|
+
r = Math.min(r, C[y]), l = Math.max(l, C[y]), o = Math.min(o, C[y + 1]), a = Math.max(a, C[y + 1]);
|
|
3696
|
+
const h = l - r, c = a - o, f = (r + l) / 2, u = (o + a) / 2, v = 2 / Math.max(h, c), p = h / c, d = i.map((C) => {
|
|
3697
|
+
const y = [];
|
|
3558
3698
|
for (let D = 0; D < C.length; D += 2)
|
|
3559
|
-
|
|
3560
|
-
return
|
|
3561
|
-
}),
|
|
3562
|
-
for (const C of
|
|
3563
|
-
const { flatCoords:
|
|
3564
|
-
for (const
|
|
3565
|
-
|
|
3566
|
-
for (const
|
|
3567
|
-
|
|
3568
|
-
}
|
|
3569
|
-
const g =
|
|
3699
|
+
y.push((C[D] - f) * v), y.push(-((C[D + 1] - u) * v));
|
|
3700
|
+
return y;
|
|
3701
|
+
}), S = wn(d), E = [], b = [];
|
|
3702
|
+
for (const C of S) {
|
|
3703
|
+
const { flatCoords: y, holeIndices: D } = yn(C), U = Rn(y, D), M = E.length / 2;
|
|
3704
|
+
for (const O of U)
|
|
3705
|
+
b.push(O + M);
|
|
3706
|
+
for (const O of y)
|
|
3707
|
+
E.push(O);
|
|
3708
|
+
}
|
|
3709
|
+
const g = E, x = b, m = [], T = [], w = [], A = jt(d);
|
|
3570
3710
|
for (let C = 0; C < d.length; C++) {
|
|
3571
|
-
const
|
|
3711
|
+
const y = d[C];
|
|
3572
3712
|
T.push(m.length), w.push(A[C]);
|
|
3573
|
-
for (let D = 0; D <
|
|
3574
|
-
m.push(
|
|
3575
|
-
|
|
3713
|
+
for (let D = 0; D < y.length; D++)
|
|
3714
|
+
m.push(y[D]);
|
|
3715
|
+
y.length >= 2 && m.push(y[0], y[1]);
|
|
3576
3716
|
}
|
|
3577
3717
|
let P = 1 / 0, F = 1 / 0, _ = -1 / 0, I = -1 / 0;
|
|
3578
3718
|
for (let C = 0; C < g.length; C += 2)
|
|
3579
3719
|
P = Math.min(P, g[C]), _ = Math.max(_, g[C]), F = Math.min(F, g[C + 1]), I = Math.max(I, g[C + 1]);
|
|
3580
3720
|
return {
|
|
3581
3721
|
vertices: new Float32Array(g),
|
|
3582
|
-
indices: new Uint16Array(
|
|
3722
|
+
indices: new Uint16Array(x),
|
|
3583
3723
|
edgeVertices: new Float32Array(m),
|
|
3584
3724
|
contourOffsets: T,
|
|
3585
3725
|
contourIsHole: w,
|
|
@@ -3587,117 +3727,117 @@ function Ke(s) {
|
|
|
3587
3727
|
aspect: p
|
|
3588
3728
|
};
|
|
3589
3729
|
}
|
|
3590
|
-
function
|
|
3730
|
+
function gn(s) {
|
|
3591
3731
|
const t = [];
|
|
3592
3732
|
return s.querySelectorAll("path").forEach((a) => {
|
|
3593
3733
|
const h = a.getAttribute("d");
|
|
3594
3734
|
if (!h) return;
|
|
3595
|
-
const c =
|
|
3735
|
+
const c = Tn(h);
|
|
3596
3736
|
t.push(...c);
|
|
3597
3737
|
}), s.querySelectorAll("polygon").forEach((a) => {
|
|
3598
3738
|
const h = a.getAttribute("points");
|
|
3599
3739
|
if (!h) return;
|
|
3600
|
-
const c =
|
|
3740
|
+
const c = Bt(h);
|
|
3601
3741
|
c.length >= 6 && t.push(c);
|
|
3602
3742
|
}), s.querySelectorAll("polyline").forEach((a) => {
|
|
3603
3743
|
const h = a.getAttribute("points");
|
|
3604
3744
|
if (!h) return;
|
|
3605
|
-
const c =
|
|
3745
|
+
const c = Bt(h);
|
|
3606
3746
|
c.length >= 6 && t.push(c);
|
|
3607
3747
|
}), s.querySelectorAll("rect").forEach((a) => {
|
|
3608
3748
|
const h = parseFloat(a.getAttribute("x") || "0"), c = parseFloat(a.getAttribute("y") || "0"), f = parseFloat(a.getAttribute("width") || "0"), u = parseFloat(a.getAttribute("height") || "0");
|
|
3609
3749
|
f > 0 && u > 0 && t.push([h, c, h + f, c, h + f, c + u, h, c + u]);
|
|
3610
3750
|
}), s.querySelectorAll("circle").forEach((a) => {
|
|
3611
3751
|
const h = parseFloat(a.getAttribute("cx") || "0"), c = parseFloat(a.getAttribute("cy") || "0"), f = parseFloat(a.getAttribute("r") || "0");
|
|
3612
|
-
f > 0 && t.push(
|
|
3752
|
+
f > 0 && t.push(vn(h, c, f));
|
|
3613
3753
|
}), s.querySelectorAll("ellipse").forEach((a) => {
|
|
3614
3754
|
const h = parseFloat(a.getAttribute("cx") || "0"), c = parseFloat(a.getAttribute("cy") || "0"), f = parseFloat(a.getAttribute("rx") || "0"), u = parseFloat(a.getAttribute("ry") || "0");
|
|
3615
|
-
f > 0 && u > 0 && t.push(
|
|
3755
|
+
f > 0 && u > 0 && t.push(xn(h, c, f, u));
|
|
3616
3756
|
}), t;
|
|
3617
3757
|
}
|
|
3618
|
-
function
|
|
3758
|
+
function Bt(s) {
|
|
3619
3759
|
const t = [], e = s.trim().split(/[\s,]+/);
|
|
3620
|
-
for (let
|
|
3621
|
-
const
|
|
3622
|
-
Number.isFinite(
|
|
3760
|
+
for (let n = 0; n < e.length - 1; n += 2) {
|
|
3761
|
+
const i = parseFloat(e[n]), r = parseFloat(e[n + 1]);
|
|
3762
|
+
Number.isFinite(i) && Number.isFinite(r) && t.push(i, r);
|
|
3623
3763
|
}
|
|
3624
3764
|
return t;
|
|
3625
3765
|
}
|
|
3626
|
-
function
|
|
3627
|
-
const
|
|
3628
|
-
for (let r = 0; r <
|
|
3629
|
-
const o = 2 * Math.PI * r /
|
|
3630
|
-
|
|
3766
|
+
function vn(s, t, e, n = 64) {
|
|
3767
|
+
const i = [];
|
|
3768
|
+
for (let r = 0; r < n; r++) {
|
|
3769
|
+
const o = 2 * Math.PI * r / n;
|
|
3770
|
+
i.push(s + e * Math.cos(o), t + e * Math.sin(o));
|
|
3631
3771
|
}
|
|
3632
|
-
return
|
|
3772
|
+
return i;
|
|
3633
3773
|
}
|
|
3634
|
-
function
|
|
3774
|
+
function xn(s, t, e, n, i = 64) {
|
|
3635
3775
|
const r = [];
|
|
3636
|
-
for (let o = 0; o <
|
|
3637
|
-
const l = 2 * Math.PI * o /
|
|
3638
|
-
r.push(s + e * Math.cos(l), t +
|
|
3776
|
+
for (let o = 0; o < i; o++) {
|
|
3777
|
+
const l = 2 * Math.PI * o / i;
|
|
3778
|
+
r.push(s + e * Math.cos(l), t + n * Math.sin(l));
|
|
3639
3779
|
}
|
|
3640
3780
|
return r;
|
|
3641
3781
|
}
|
|
3642
|
-
function
|
|
3782
|
+
function Tn(s) {
|
|
3643
3783
|
const t = [];
|
|
3644
|
-
let e = [],
|
|
3645
|
-
const c =
|
|
3784
|
+
let e = [], n = 0, i = 0, r = 0, o = 0, l = 0, a = 0, h = "";
|
|
3785
|
+
const c = En(s);
|
|
3646
3786
|
let f = 0;
|
|
3647
3787
|
function u() {
|
|
3648
3788
|
return f >= c.length ? 0 : parseFloat(c[f++]);
|
|
3649
3789
|
}
|
|
3650
3790
|
for (; f < c.length; ) {
|
|
3651
|
-
const
|
|
3791
|
+
const v = c[f];
|
|
3652
3792
|
let p;
|
|
3653
|
-
/^[a-zA-Z]$/.test(
|
|
3793
|
+
/^[a-zA-Z]$/.test(v) ? (p = v, f++) : p = h === "M" ? "L" : h === "m" ? "l" : h;
|
|
3654
3794
|
const d = p === p.toLowerCase();
|
|
3655
3795
|
switch (p.toUpperCase()) {
|
|
3656
3796
|
case "M": {
|
|
3657
3797
|
e.length > 0 && t.push(e), e = [];
|
|
3658
|
-
const
|
|
3659
|
-
|
|
3798
|
+
const E = u() + (d ? n : 0), b = u() + (d ? i : 0);
|
|
3799
|
+
n = E, i = b, r = E, o = b, e.push(n, i), l = n, a = i;
|
|
3660
3800
|
break;
|
|
3661
3801
|
}
|
|
3662
3802
|
case "L": {
|
|
3663
|
-
|
|
3803
|
+
n = u() + (d ? n : 0), i = u() + (d ? i : 0), e.push(n, i), l = n, a = i;
|
|
3664
3804
|
break;
|
|
3665
3805
|
}
|
|
3666
3806
|
case "H": {
|
|
3667
|
-
|
|
3807
|
+
n = u() + (d ? n : 0), e.push(n, i), l = n, a = i;
|
|
3668
3808
|
break;
|
|
3669
3809
|
}
|
|
3670
3810
|
case "V": {
|
|
3671
|
-
|
|
3811
|
+
i = u() + (d ? i : 0), e.push(n, i), l = n, a = i;
|
|
3672
3812
|
break;
|
|
3673
3813
|
}
|
|
3674
3814
|
case "C": {
|
|
3675
|
-
const
|
|
3676
|
-
|
|
3815
|
+
const E = u() + (d ? n : 0), b = u() + (d ? i : 0), g = u() + (d ? n : 0), x = u() + (d ? i : 0), m = u() + (d ? n : 0), T = u() + (d ? i : 0);
|
|
3816
|
+
it(e, n, i, E, b, g, x, m, T), n = m, i = T, l = g, a = x;
|
|
3677
3817
|
break;
|
|
3678
3818
|
}
|
|
3679
3819
|
case "S": {
|
|
3680
|
-
const
|
|
3681
|
-
|
|
3820
|
+
const E = 2 * n - l, b = 2 * i - a, g = u() + (d ? n : 0), x = u() + (d ? i : 0), m = u() + (d ? n : 0), T = u() + (d ? i : 0);
|
|
3821
|
+
it(e, n, i, E, b, g, x, m, T), n = m, i = T, l = g, a = x;
|
|
3682
3822
|
break;
|
|
3683
3823
|
}
|
|
3684
3824
|
case "Q": {
|
|
3685
|
-
const
|
|
3686
|
-
|
|
3825
|
+
const E = u() + (d ? n : 0), b = u() + (d ? i : 0), g = u() + (d ? n : 0), x = u() + (d ? i : 0);
|
|
3826
|
+
Vt(e, n, i, E, b, g, x), n = g, i = x, l = E, a = b;
|
|
3687
3827
|
break;
|
|
3688
3828
|
}
|
|
3689
3829
|
case "T": {
|
|
3690
|
-
const
|
|
3691
|
-
|
|
3830
|
+
const E = 2 * n - l, b = 2 * i - a, g = u() + (d ? n : 0), x = u() + (d ? i : 0);
|
|
3831
|
+
Vt(e, n, i, E, b, g, x), n = g, i = x, l = E, a = b;
|
|
3692
3832
|
break;
|
|
3693
3833
|
}
|
|
3694
3834
|
case "A": {
|
|
3695
|
-
const
|
|
3696
|
-
|
|
3835
|
+
const E = u(), b = u(), g = u(), x = u(), m = u(), T = u() + (d ? n : 0), w = u() + (d ? i : 0);
|
|
3836
|
+
Sn(e, n, i, E, b, g, !!x, !!m, T, w), n = T, i = w, l = n, a = i;
|
|
3697
3837
|
break;
|
|
3698
3838
|
}
|
|
3699
3839
|
case "Z": {
|
|
3700
|
-
|
|
3840
|
+
n = r, i = o, e.length > 0 && t.push(e), e = [], l = n, a = i;
|
|
3701
3841
|
break;
|
|
3702
3842
|
}
|
|
3703
3843
|
default:
|
|
@@ -3708,15 +3848,15 @@ function ei(s) {
|
|
|
3708
3848
|
}
|
|
3709
3849
|
return e.length >= 6 && t.push(e), t;
|
|
3710
3850
|
}
|
|
3711
|
-
function
|
|
3851
|
+
function En(s) {
|
|
3712
3852
|
const t = [], e = /([a-zA-Z])|([+-]?(?:\d+\.?\d*|\.\d+)(?:[eE][+-]?\d+)?)/g;
|
|
3713
|
-
let
|
|
3714
|
-
for (; (
|
|
3715
|
-
t.push(
|
|
3853
|
+
let n;
|
|
3854
|
+
for (; (n = e.exec(s)) !== null; )
|
|
3855
|
+
t.push(n[0]);
|
|
3716
3856
|
return t;
|
|
3717
3857
|
}
|
|
3718
|
-
const
|
|
3719
|
-
function
|
|
3858
|
+
const bn = 0.5;
|
|
3859
|
+
function it(s, t, e, n, i, r, o, l, a, h = 0) {
|
|
3720
3860
|
if (h > 12) {
|
|
3721
3861
|
s.push(l, a);
|
|
3722
3862
|
return;
|
|
@@ -3726,214 +3866,214 @@ function nt(s, t, e, i, n, r, o, l, a, h = 0) {
|
|
|
3726
3866
|
s.push(l, a);
|
|
3727
3867
|
return;
|
|
3728
3868
|
}
|
|
3729
|
-
const
|
|
3730
|
-
if (
|
|
3869
|
+
const v = Math.abs((n - l) * f - (i - a) * c) / u, p = Math.abs((r - l) * f - (o - a) * c) / u;
|
|
3870
|
+
if (v + p < bn) {
|
|
3731
3871
|
s.push(l, a);
|
|
3732
3872
|
return;
|
|
3733
3873
|
}
|
|
3734
|
-
const d = (t +
|
|
3735
|
-
|
|
3874
|
+
const d = (t + n) / 2, S = (e + i) / 2, E = (n + r) / 2, b = (i + o) / 2, g = (r + l) / 2, x = (o + a) / 2, m = (d + E) / 2, T = (S + b) / 2, w = (E + g) / 2, A = (b + x) / 2, P = (m + w) / 2, F = (T + A) / 2;
|
|
3875
|
+
it(s, t, e, d, S, m, T, P, F, h + 1), it(s, P, F, w, A, g, x, l, a, h + 1);
|
|
3736
3876
|
}
|
|
3737
|
-
function
|
|
3738
|
-
const l = t + 0.6666666666666666 * (
|
|
3739
|
-
|
|
3877
|
+
function Vt(s, t, e, n, i, r, o) {
|
|
3878
|
+
const l = t + 0.6666666666666666 * (n - t), a = e + 2 / 3 * (i - e), h = r + 2 / 3 * (n - r), c = o + 2 / 3 * (i - o);
|
|
3879
|
+
it(s, t, e, l, a, h, c, r, o);
|
|
3740
3880
|
}
|
|
3741
|
-
function
|
|
3742
|
-
if (
|
|
3881
|
+
function Sn(s, t, e, n, i, r, o, l, a, h) {
|
|
3882
|
+
if (n === 0 || i === 0) {
|
|
3743
3883
|
s.push(a, h);
|
|
3744
3884
|
return;
|
|
3745
3885
|
}
|
|
3746
|
-
let c = Math.abs(
|
|
3747
|
-
const u = r * Math.PI / 180,
|
|
3748
|
-
let g =
|
|
3886
|
+
let c = Math.abs(n), f = Math.abs(i);
|
|
3887
|
+
const u = r * Math.PI / 180, v = Math.cos(u), p = Math.sin(u), d = (t - a) / 2, S = (e - h) / 2, E = v * d + p * S, b = -p * d + v * S;
|
|
3888
|
+
let g = E * E / (c * c) + b * b / (f * f);
|
|
3749
3889
|
if (g > 1) {
|
|
3750
3890
|
const U = Math.sqrt(g);
|
|
3751
3891
|
c *= U, f *= U, g = 1;
|
|
3752
3892
|
}
|
|
3753
|
-
const
|
|
3754
|
-
let A = Math.max(0, (
|
|
3893
|
+
const x = c * c, m = f * f, T = E * E, w = b * b;
|
|
3894
|
+
let A = Math.max(0, (x * m - x * w - m * T) / (x * w + m * T));
|
|
3755
3895
|
A = Math.sqrt(A), o === l && (A = -A);
|
|
3756
|
-
const P = A * (c *
|
|
3757
|
-
let
|
|
3758
|
-
(
|
|
3759
|
-
(
|
|
3760
|
-
(-
|
|
3761
|
-
(-
|
|
3896
|
+
const P = A * (c * b) / f, F = A * -(f * E) / c, _ = v * P - p * F + (t + a) / 2, I = p * P + v * F + (e + h) / 2, C = Ot(1, 0, (E - P) / c, (b - F) / f);
|
|
3897
|
+
let y = Ot(
|
|
3898
|
+
(E - P) / c,
|
|
3899
|
+
(b - F) / f,
|
|
3900
|
+
(-E - P) / c,
|
|
3901
|
+
(-b - F) / f
|
|
3762
3902
|
);
|
|
3763
|
-
!l &&
|
|
3764
|
-
const D = Math.max(4, Math.ceil(Math.abs(
|
|
3903
|
+
!l && y > 0 && (y -= 2 * Math.PI), l && y < 0 && (y += 2 * Math.PI);
|
|
3904
|
+
const D = Math.max(4, Math.ceil(Math.abs(y) / (Math.PI / 16)));
|
|
3765
3905
|
for (let U = 1; U <= D; U++) {
|
|
3766
|
-
const M = C + U / D *
|
|
3906
|
+
const M = C + U / D * y, O = Math.cos(M), j = Math.sin(M), et = v * c * O - p * f * j + _, at = p * c * O + v * f * j + I;
|
|
3767
3907
|
s.push(et, at);
|
|
3768
3908
|
}
|
|
3769
3909
|
}
|
|
3770
|
-
function
|
|
3771
|
-
const
|
|
3772
|
-
return
|
|
3910
|
+
function Ot(s, t, e, n) {
|
|
3911
|
+
const i = s * n - t * e < 0 ? -1 : 1, r = s * e + t * n, o = Math.sqrt(s * s + t * t), l = Math.sqrt(e * e + n * n), a = r / (o * l);
|
|
3912
|
+
return i * Math.acos(Math.max(-1, Math.min(1, a)));
|
|
3773
3913
|
}
|
|
3774
|
-
function
|
|
3914
|
+
function yn(s) {
|
|
3775
3915
|
const t = [], e = [];
|
|
3776
|
-
for (let
|
|
3777
|
-
|
|
3778
|
-
for (const
|
|
3779
|
-
t.push(
|
|
3916
|
+
for (let n = 0; n < s.length; n++) {
|
|
3917
|
+
n > 0 && e.push(t.length / 2);
|
|
3918
|
+
for (const i of s[n])
|
|
3919
|
+
t.push(i);
|
|
3780
3920
|
}
|
|
3781
3921
|
return { flatCoords: t, holeIndices: e };
|
|
3782
3922
|
}
|
|
3783
|
-
function
|
|
3784
|
-
const t = s.length, e = s.map((
|
|
3785
|
-
for (let
|
|
3923
|
+
function jt(s) {
|
|
3924
|
+
const t = s.length, e = s.map((i) => Math.abs(Zt(i))), n = new Array(t).fill(!1);
|
|
3925
|
+
for (let i = 0; i < t; i++) {
|
|
3786
3926
|
let r = 0;
|
|
3787
|
-
const o = s[
|
|
3927
|
+
const o = s[i][0], l = s[i][1];
|
|
3788
3928
|
for (let a = 0; a < t; a++)
|
|
3789
|
-
|
|
3790
|
-
i
|
|
3929
|
+
i !== a && e[a] > e[i] && $t(o, l, s[a]) && r++;
|
|
3930
|
+
n[i] = r % 2 === 1;
|
|
3791
3931
|
}
|
|
3792
|
-
return
|
|
3932
|
+
return n;
|
|
3793
3933
|
}
|
|
3794
|
-
function
|
|
3934
|
+
function wn(s) {
|
|
3795
3935
|
if (s.length <= 1)
|
|
3796
3936
|
return [s];
|
|
3797
|
-
const t =
|
|
3798
|
-
const a =
|
|
3937
|
+
const t = jt(s), e = s.map((o, l) => {
|
|
3938
|
+
const a = Zt(o);
|
|
3799
3939
|
return { index: l, contour: o, area: a, isOuter: !t[l] };
|
|
3800
|
-
}),
|
|
3801
|
-
if (
|
|
3940
|
+
}), n = e.filter((o) => o.isOuter), i = e.filter((o) => !o.isOuter);
|
|
3941
|
+
if (n.length === 0)
|
|
3802
3942
|
return s.map((o) => [o]);
|
|
3803
|
-
const r =
|
|
3943
|
+
const r = n.map((o) => ({
|
|
3804
3944
|
outer: o.contour,
|
|
3805
3945
|
holes: []
|
|
3806
3946
|
}));
|
|
3807
|
-
for (const o of
|
|
3947
|
+
for (const o of i) {
|
|
3808
3948
|
const l = o.contour[0], a = o.contour[1];
|
|
3809
3949
|
let h = -1, c = 1 / 0;
|
|
3810
|
-
for (let f = 0; f <
|
|
3811
|
-
if (
|
|
3812
|
-
const u = Math.abs(
|
|
3950
|
+
for (let f = 0; f < n.length; f++)
|
|
3951
|
+
if ($t(l, a, n[f].contour)) {
|
|
3952
|
+
const u = Math.abs(n[f].area);
|
|
3813
3953
|
u < c && (c = u, h = f);
|
|
3814
3954
|
}
|
|
3815
3955
|
h >= 0 ? r[h].holes.push(o.contour) : r.push({ outer: o.contour, holes: [] });
|
|
3816
3956
|
}
|
|
3817
3957
|
return r.map((o) => [o.outer, ...o.holes]);
|
|
3818
3958
|
}
|
|
3819
|
-
function
|
|
3959
|
+
function Zt(s) {
|
|
3820
3960
|
let t = 0;
|
|
3821
3961
|
const e = s.length;
|
|
3822
|
-
for (let
|
|
3823
|
-
const
|
|
3824
|
-
t +=
|
|
3962
|
+
for (let n = 0; n < e; n += 2) {
|
|
3963
|
+
const i = s[n], r = s[n + 1], o = s[(n + 2) % e], l = s[(n + 3) % e];
|
|
3964
|
+
t += i * l - o * r;
|
|
3825
3965
|
}
|
|
3826
3966
|
return t / 2;
|
|
3827
3967
|
}
|
|
3828
|
-
function
|
|
3829
|
-
let
|
|
3830
|
-
const
|
|
3831
|
-
for (let r = 0, o =
|
|
3968
|
+
function $t(s, t, e) {
|
|
3969
|
+
let n = !1;
|
|
3970
|
+
const i = e.length;
|
|
3971
|
+
for (let r = 0, o = i - 2; r < i; o = r, r += 2) {
|
|
3832
3972
|
const l = e[r], a = e[r + 1], h = e[o], c = e[o + 1];
|
|
3833
|
-
a > t != c > t && s < (h - l) * (t - a) / (c - a) + l && (
|
|
3973
|
+
a > t != c > t && s < (h - l) * (t - a) / (c - a) + l && (n = !n);
|
|
3834
3974
|
}
|
|
3835
|
-
return
|
|
3975
|
+
return n;
|
|
3836
3976
|
}
|
|
3837
|
-
function
|
|
3838
|
-
const
|
|
3839
|
-
let r =
|
|
3977
|
+
function Rn(s, t, e = 2) {
|
|
3978
|
+
const n = t && t.length > 0, i = n ? t[0] * e : s.length;
|
|
3979
|
+
let r = Kt(s, 0, i, e, !0);
|
|
3840
3980
|
const o = [];
|
|
3841
3981
|
if (!r || r.next === r.prev) return o;
|
|
3842
|
-
|
|
3982
|
+
n && (r = Cn(s, t, r, e));
|
|
3843
3983
|
let l = 1 / 0, a = 1 / 0, h = -1 / 0, c = -1 / 0, f = 0;
|
|
3844
3984
|
if (s.length > 80 * e) {
|
|
3845
|
-
for (let u = 0; u <
|
|
3846
|
-
const
|
|
3847
|
-
|
|
3985
|
+
for (let u = 0; u < i; u += e) {
|
|
3986
|
+
const v = s[u], p = s[u + 1];
|
|
3987
|
+
v < l && (l = v), p < a && (a = p), v > h && (h = v), p > c && (c = p);
|
|
3848
3988
|
}
|
|
3849
3989
|
f = Math.max(h - l, c - a), f = f !== 0 ? 32767 / f : 0;
|
|
3850
3990
|
}
|
|
3851
3991
|
return rt(r, o, e, l, a, f, 0), o;
|
|
3852
3992
|
}
|
|
3853
|
-
function
|
|
3993
|
+
function Kt(s, t, e, n, i) {
|
|
3854
3994
|
let r = null;
|
|
3855
|
-
if (
|
|
3856
|
-
for (let o = t; o < e; o +=
|
|
3857
|
-
r =
|
|
3995
|
+
if (i === Hn(s, t, e, n) > 0)
|
|
3996
|
+
for (let o = t; o < e; o += n)
|
|
3997
|
+
r = kt(o, s[o], s[o + 1], r);
|
|
3858
3998
|
else
|
|
3859
|
-
for (let o = e -
|
|
3860
|
-
r =
|
|
3861
|
-
return r &&
|
|
3999
|
+
for (let o = e - n; o >= t; o -= n)
|
|
4000
|
+
r = kt(o, s[o], s[o + 1], r);
|
|
4001
|
+
return r && xt(r, r.next) && (ot(r), r = r.next), r ? (r.next.prev = r, r.prev.next = r, r.next) : null;
|
|
3862
4002
|
}
|
|
3863
4003
|
function Y(s, t) {
|
|
3864
4004
|
t || (t = s);
|
|
3865
|
-
let e = s,
|
|
4005
|
+
let e = s, n;
|
|
3866
4006
|
do
|
|
3867
|
-
if (
|
|
4007
|
+
if (n = !1, !e.steiner && (xt(e, e.next) || L(e.prev, e, e.next) === 0)) {
|
|
3868
4008
|
if (ot(e), e = t = e.prev, e === e.next) break;
|
|
3869
|
-
|
|
4009
|
+
n = !0;
|
|
3870
4010
|
} else
|
|
3871
4011
|
e = e.next;
|
|
3872
|
-
while (
|
|
4012
|
+
while (n || e !== t);
|
|
3873
4013
|
return t;
|
|
3874
4014
|
}
|
|
3875
|
-
function rt(s, t, e,
|
|
4015
|
+
function rt(s, t, e, n, i, r, o) {
|
|
3876
4016
|
if (!s) return;
|
|
3877
|
-
!o && r &&
|
|
4017
|
+
!o && r && In(s, n, i, r);
|
|
3878
4018
|
let l = s, a, h;
|
|
3879
4019
|
for (; s.prev !== s.next; ) {
|
|
3880
|
-
if (a = s.prev, h = s.next, r ?
|
|
4020
|
+
if (a = s.prev, h = s.next, r ? Pn(s, n, i, r) : An(s)) {
|
|
3881
4021
|
t.push(a.i / e, s.i / e, h.i / e), ot(s), s = h.next, l = h.next;
|
|
3882
4022
|
continue;
|
|
3883
4023
|
}
|
|
3884
4024
|
if (s = h, s === l) {
|
|
3885
|
-
o ? o === 1 ? (s =
|
|
4025
|
+
o ? o === 1 ? (s = Dn(Y(s), t, e), rt(s, t, e, n, i, r, 2)) : o === 2 && Fn(s, t, e, n, i, r) : rt(Y(s), t, e, n, i, r, 1);
|
|
3886
4026
|
break;
|
|
3887
4027
|
}
|
|
3888
4028
|
}
|
|
3889
4029
|
}
|
|
3890
|
-
function
|
|
3891
|
-
const t = s.prev, e = s,
|
|
3892
|
-
if (L(t, e,
|
|
3893
|
-
const
|
|
3894
|
-
let p =
|
|
4030
|
+
function An(s) {
|
|
4031
|
+
const t = s.prev, e = s, n = s.next;
|
|
4032
|
+
if (L(t, e, n) >= 0) return !1;
|
|
4033
|
+
const i = t.x, r = e.x, o = n.x, l = t.y, a = e.y, h = n.y, c = i < r ? i < o ? i : o : r < o ? r : o, f = l < a ? l < h ? l : h : a < h ? a : h, u = i > r ? i > o ? i : o : r > o ? r : o, v = l > a ? l > h ? l : h : a > h ? a : h;
|
|
4034
|
+
let p = n.next;
|
|
3895
4035
|
for (; p !== t; ) {
|
|
3896
|
-
if (p.x >= c && p.x <= u && p.y >= f && p.y <=
|
|
4036
|
+
if (p.x >= c && p.x <= u && p.y >= f && p.y <= v && tt(i, l, r, a, o, h, p.x, p.y) && L(p.prev, p, p.next) >= 0)
|
|
3897
4037
|
return !1;
|
|
3898
4038
|
p = p.next;
|
|
3899
4039
|
}
|
|
3900
4040
|
return !0;
|
|
3901
4041
|
}
|
|
3902
|
-
function
|
|
3903
|
-
const
|
|
3904
|
-
if (L(
|
|
3905
|
-
const l =
|
|
3906
|
-
let g = s.prevZ,
|
|
3907
|
-
for (; g && g.z >=
|
|
3908
|
-
if (g.x >=
|
|
3909
|
-
|
|
3910
|
-
}
|
|
3911
|
-
for (; g && g.z >=
|
|
3912
|
-
if (g.x >=
|
|
4042
|
+
function Pn(s, t, e, n) {
|
|
4043
|
+
const i = s.prev, r = s, o = s.next;
|
|
4044
|
+
if (L(i, r, o) >= 0) return !1;
|
|
4045
|
+
const l = i.x, a = r.x, h = o.x, c = i.y, f = r.y, u = o.y, v = l < a ? l < h ? l : h : a < h ? a : h, p = c < f ? c < u ? c : u : f < u ? f : u, d = l > a ? l > h ? l : h : a > h ? a : h, S = c > f ? c > u ? c : u : f > u ? f : u, E = wt(v, p, t, e, n), b = wt(d, S, t, e, n);
|
|
4046
|
+
let g = s.prevZ, x = s.nextZ;
|
|
4047
|
+
for (; g && g.z >= E && x && x.z <= b; ) {
|
|
4048
|
+
if (g.x >= v && g.x <= d && g.y >= p && g.y <= S && g !== i && g !== o && tt(l, c, a, f, h, u, g.x, g.y) && L(g.prev, g, g.next) >= 0 || (g = g.prevZ, x.x >= v && x.x <= d && x.y >= p && x.y <= S && x !== i && x !== o && tt(l, c, a, f, h, u, x.x, x.y) && L(x.prev, x, x.next) >= 0)) return !1;
|
|
4049
|
+
x = x.nextZ;
|
|
4050
|
+
}
|
|
4051
|
+
for (; g && g.z >= E; ) {
|
|
4052
|
+
if (g.x >= v && g.x <= d && g.y >= p && g.y <= S && g !== i && g !== o && tt(l, c, a, f, h, u, g.x, g.y) && L(g.prev, g, g.next) >= 0) return !1;
|
|
3913
4053
|
g = g.prevZ;
|
|
3914
4054
|
}
|
|
3915
|
-
for (;
|
|
3916
|
-
if (
|
|
3917
|
-
|
|
4055
|
+
for (; x && x.z <= b; ) {
|
|
4056
|
+
if (x.x >= v && x.x <= d && x.y >= p && x.y <= S && x !== i && x !== o && tt(l, c, a, f, h, u, x.x, x.y) && L(x.prev, x, x.next) >= 0) return !1;
|
|
4057
|
+
x = x.nextZ;
|
|
3918
4058
|
}
|
|
3919
4059
|
return !0;
|
|
3920
4060
|
}
|
|
3921
|
-
function
|
|
3922
|
-
let
|
|
4061
|
+
function Dn(s, t, e) {
|
|
4062
|
+
let n = s;
|
|
3923
4063
|
do {
|
|
3924
|
-
const
|
|
3925
|
-
!
|
|
3926
|
-
} while (
|
|
3927
|
-
return Y(
|
|
4064
|
+
const i = n.prev, r = n.next.next;
|
|
4065
|
+
!xt(i, r) && Jt(i, n, n.next, r) && st(i, r) && st(r, i) && (t.push(i.i / e, n.i / e, r.i / e), ot(n), ot(n.next), n = s = r), n = n.next;
|
|
4066
|
+
} while (n !== s);
|
|
4067
|
+
return Y(n);
|
|
3928
4068
|
}
|
|
3929
|
-
function
|
|
4069
|
+
function Fn(s, t, e, n, i, r) {
|
|
3930
4070
|
let o = s;
|
|
3931
4071
|
do {
|
|
3932
4072
|
let l = o.next.next;
|
|
3933
4073
|
for (; l !== o.prev; ) {
|
|
3934
|
-
if (o.i !== l.i &&
|
|
3935
|
-
let a =
|
|
3936
|
-
o = Y(o, o.next), a = Y(a, a.next), rt(o, t, e,
|
|
4074
|
+
if (o.i !== l.i && Vn(o, l)) {
|
|
4075
|
+
let a = Qt(o, l);
|
|
4076
|
+
o = Y(o, o.next), a = Y(a, a.next), rt(o, t, e, n, i, r, 0), rt(a, t, e, n, i, r, 0);
|
|
3937
4077
|
return;
|
|
3938
4078
|
}
|
|
3939
4079
|
l = l.next;
|
|
@@ -3941,31 +4081,31 @@ function hi(s, t, e, i, n, r) {
|
|
|
3941
4081
|
o = o.next;
|
|
3942
4082
|
} while (o !== s);
|
|
3943
4083
|
}
|
|
3944
|
-
function
|
|
3945
|
-
const
|
|
4084
|
+
function Cn(s, t, e, n) {
|
|
4085
|
+
const i = [];
|
|
3946
4086
|
for (let r = 0; r < t.length; r++) {
|
|
3947
|
-
const o = t[r] *
|
|
3948
|
-
a && (a === a.next && (a.steiner = !0),
|
|
4087
|
+
const o = t[r] * n, l = r < t.length - 1 ? t[r + 1] * n : s.length, a = Kt(s, o, l, n, !1);
|
|
4088
|
+
a && (a === a.next && (a.steiner = !0), i.push(Bn(a)));
|
|
3949
4089
|
}
|
|
3950
|
-
|
|
3951
|
-
for (const r of
|
|
3952
|
-
e =
|
|
4090
|
+
i.sort((r, o) => r.x - o.x);
|
|
4091
|
+
for (const r of i)
|
|
4092
|
+
e = Un(r, e);
|
|
3953
4093
|
return e;
|
|
3954
4094
|
}
|
|
3955
|
-
function
|
|
3956
|
-
const e =
|
|
4095
|
+
function Un(s, t) {
|
|
4096
|
+
const e = Ln(s, t);
|
|
3957
4097
|
if (!e) return t;
|
|
3958
|
-
const
|
|
3959
|
-
return Y(
|
|
4098
|
+
const n = Qt(e, s);
|
|
4099
|
+
return Y(n, n.next), Y(e, e.next);
|
|
3960
4100
|
}
|
|
3961
|
-
function
|
|
4101
|
+
function Ln(s, t) {
|
|
3962
4102
|
let e = t;
|
|
3963
|
-
const
|
|
4103
|
+
const n = s.x, i = s.y;
|
|
3964
4104
|
let r = -1 / 0, o = null;
|
|
3965
4105
|
do {
|
|
3966
|
-
if (
|
|
3967
|
-
const f = e.x + (
|
|
3968
|
-
if (f <=
|
|
4106
|
+
if (i <= e.y && i >= e.next.y && e.next.y !== e.y) {
|
|
4107
|
+
const f = e.x + (i - e.y) / (e.next.y - e.y) * (e.next.x - e.x);
|
|
4108
|
+
if (f <= n && f > r && (r = f, o = e.x < e.next.x ? e : e.next, f === n))
|
|
3969
4109
|
return o;
|
|
3970
4110
|
}
|
|
3971
4111
|
e = e.next;
|
|
@@ -3975,83 +4115,83 @@ function mi(s, t) {
|
|
|
3975
4115
|
let c = 1 / 0;
|
|
3976
4116
|
e = o;
|
|
3977
4117
|
do {
|
|
3978
|
-
if (
|
|
3979
|
-
const f = Math.abs(
|
|
3980
|
-
st(e, s) && (f < c || f === c && (e.x > o.x ||
|
|
4118
|
+
if (n >= e.x && e.x >= a && n !== e.x && tt(i < h ? n : r, i, a, h, i < h ? r : n, i, e.x, e.y)) {
|
|
4119
|
+
const f = Math.abs(i - e.y) / (n - e.x);
|
|
4120
|
+
st(e, s) && (f < c || f === c && (e.x > o.x || _n(o, e))) && (o = e, c = f);
|
|
3981
4121
|
}
|
|
3982
4122
|
e = e.next;
|
|
3983
4123
|
} while (e !== l);
|
|
3984
4124
|
return o;
|
|
3985
4125
|
}
|
|
3986
|
-
function
|
|
4126
|
+
function _n(s, t) {
|
|
3987
4127
|
return L(s.prev, s, t.prev) < 0 && L(t.next, s, s.next) < 0;
|
|
3988
4128
|
}
|
|
3989
|
-
function
|
|
3990
|
-
let
|
|
4129
|
+
function In(s, t, e, n) {
|
|
4130
|
+
let i = s;
|
|
3991
4131
|
do
|
|
3992
|
-
|
|
3993
|
-
while (
|
|
3994
|
-
|
|
4132
|
+
i.z === 0 && (i.z = wt(i.x, i.y, t, e, n)), i.prevZ = i.prev, i.nextZ = i.next, i = i.next;
|
|
4133
|
+
while (i !== s);
|
|
4134
|
+
i.prevZ.nextZ = null, i.prevZ = null, Mn(i);
|
|
3995
4135
|
}
|
|
3996
|
-
function
|
|
4136
|
+
function Mn(s) {
|
|
3997
4137
|
let t = 1, e;
|
|
3998
4138
|
do {
|
|
3999
|
-
let
|
|
4139
|
+
let n = s;
|
|
4000
4140
|
s = null;
|
|
4001
|
-
let
|
|
4002
|
-
for (e = 0;
|
|
4141
|
+
let i = null;
|
|
4142
|
+
for (e = 0; n; ) {
|
|
4003
4143
|
e++;
|
|
4004
|
-
let r =
|
|
4144
|
+
let r = n, o = 0;
|
|
4005
4145
|
for (let a = 0; a < t && (o++, r = r.nextZ, !!r); a++)
|
|
4006
4146
|
;
|
|
4007
4147
|
let l = t;
|
|
4008
4148
|
for (; o > 0 || l > 0 && r; ) {
|
|
4009
4149
|
let a;
|
|
4010
|
-
o !== 0 && (l === 0 || !r ||
|
|
4150
|
+
o !== 0 && (l === 0 || !r || n.z <= r.z) ? (a = n, n = n.nextZ, o--) : (a = r, r = r.nextZ, l--), i ? i.nextZ = a : s = a, a.prevZ = i, i = a;
|
|
4011
4151
|
}
|
|
4012
|
-
|
|
4152
|
+
n = r;
|
|
4013
4153
|
}
|
|
4014
|
-
|
|
4154
|
+
i.nextZ = null, t *= 2;
|
|
4015
4155
|
} while (e > 1);
|
|
4016
4156
|
return s;
|
|
4017
4157
|
}
|
|
4018
|
-
function
|
|
4019
|
-
let r = (s - e) *
|
|
4158
|
+
function wt(s, t, e, n, i) {
|
|
4159
|
+
let r = (s - e) * i | 0, o = (t - n) * i | 0;
|
|
4020
4160
|
return r = (r | r << 8) & 16711935, r = (r | r << 4) & 252645135, r = (r | r << 2) & 858993459, r = (r | r << 1) & 1431655765, o = (o | o << 8) & 16711935, o = (o | o << 4) & 252645135, o = (o | o << 2) & 858993459, o = (o | o << 1) & 1431655765, r | o << 1;
|
|
4021
4161
|
}
|
|
4022
|
-
function
|
|
4162
|
+
function Bn(s) {
|
|
4023
4163
|
let t = s, e = s;
|
|
4024
4164
|
do
|
|
4025
4165
|
(t.x < e.x || t.x === e.x && t.y < e.y) && (e = t), t = t.next;
|
|
4026
4166
|
while (t !== s);
|
|
4027
4167
|
return e;
|
|
4028
4168
|
}
|
|
4029
|
-
function tt(s, t, e,
|
|
4030
|
-
return (
|
|
4169
|
+
function tt(s, t, e, n, i, r, o, l) {
|
|
4170
|
+
return (i - o) * (t - l) - (s - o) * (r - l) >= 0 && (s - o) * (n - l) - (e - o) * (t - l) >= 0 && (e - o) * (r - l) - (i - o) * (n - l) >= 0;
|
|
4031
4171
|
}
|
|
4032
|
-
function
|
|
4033
|
-
return s.next.i !== t.i && s.prev.i !== t.i && !
|
|
4172
|
+
function Vn(s, t) {
|
|
4173
|
+
return s.next.i !== t.i && s.prev.i !== t.i && !On(s, t) && (st(s, t) && st(t, s) && kn(s, t) && (L(s.prev, s, t.prev) !== 0 || L(s, t.prev, t) !== 0) || xt(s, t) && L(s.prev, s, s.next) > 0 && L(t.prev, t, t.next) > 0);
|
|
4034
4174
|
}
|
|
4035
4175
|
function L(s, t, e) {
|
|
4036
4176
|
return (t.y - s.y) * (e.x - t.x) - (t.x - s.x) * (e.y - t.y);
|
|
4037
4177
|
}
|
|
4038
|
-
function
|
|
4178
|
+
function xt(s, t) {
|
|
4039
4179
|
return s.x === t.x && s.y === t.y;
|
|
4040
4180
|
}
|
|
4041
|
-
function
|
|
4042
|
-
const
|
|
4043
|
-
return !!(
|
|
4181
|
+
function Jt(s, t, e, n) {
|
|
4182
|
+
const i = ht(L(s, t, e)), r = ht(L(s, t, n)), o = ht(L(e, n, s)), l = ht(L(e, n, t));
|
|
4183
|
+
return !!(i !== r && o !== l || i === 0 && ct(s, e, t) || r === 0 && ct(s, n, t) || o === 0 && ct(e, s, n) || l === 0 && ct(e, t, n));
|
|
4044
4184
|
}
|
|
4045
|
-
function
|
|
4185
|
+
function ct(s, t, e) {
|
|
4046
4186
|
return t.x <= Math.max(s.x, e.x) && t.x >= Math.min(s.x, e.x) && t.y <= Math.max(s.y, e.y) && t.y >= Math.min(s.y, e.y);
|
|
4047
4187
|
}
|
|
4048
|
-
function
|
|
4188
|
+
function ht(s) {
|
|
4049
4189
|
return s > 0 ? 1 : s < 0 ? -1 : 0;
|
|
4050
4190
|
}
|
|
4051
|
-
function
|
|
4191
|
+
function On(s, t) {
|
|
4052
4192
|
let e = s;
|
|
4053
4193
|
do {
|
|
4054
|
-
if (e.i !== s.i && e.next.i !== s.i && e.i !== t.i && e.next.i !== t.i &&
|
|
4194
|
+
if (e.i !== s.i && e.next.i !== s.i && e.i !== t.i && e.next.i !== t.i && Jt(e, e.next, s, t)) return !0;
|
|
4055
4195
|
e = e.next;
|
|
4056
4196
|
} while (e !== s);
|
|
4057
4197
|
return !1;
|
|
@@ -4059,26 +4199,26 @@ function Ei(s, t) {
|
|
|
4059
4199
|
function st(s, t) {
|
|
4060
4200
|
return L(s.prev, s, s.next) < 0 ? L(s, t, s.next) >= 0 && L(s, s.prev, t) >= 0 : L(s, t, s.prev) < 0 || L(s, s.next, t) < 0;
|
|
4061
4201
|
}
|
|
4062
|
-
function
|
|
4063
|
-
let e = s,
|
|
4064
|
-
const
|
|
4202
|
+
function kn(s, t) {
|
|
4203
|
+
let e = s, n = !1;
|
|
4204
|
+
const i = (s.x + t.x) / 2, r = (s.y + t.y) / 2;
|
|
4065
4205
|
do
|
|
4066
|
-
e.y > r != e.next.y > r && e.next.y !== e.y &&
|
|
4206
|
+
e.y > r != e.next.y > r && e.next.y !== e.y && i < (e.next.x - e.x) * (r - e.y) / (e.next.y - e.y) + e.x && (n = !n), e = e.next;
|
|
4067
4207
|
while (e !== s);
|
|
4068
|
-
return
|
|
4208
|
+
return n;
|
|
4069
4209
|
}
|
|
4070
|
-
function
|
|
4071
|
-
const e =
|
|
4072
|
-
return s.next = t, t.prev = s, e.next =
|
|
4210
|
+
function Qt(s, t) {
|
|
4211
|
+
const e = Rt(s.i, s.x, s.y), n = Rt(t.i, t.x, t.y), i = s.next, r = t.prev;
|
|
4212
|
+
return s.next = t, t.prev = s, e.next = i, i.prev = e, n.next = e, e.prev = n, r.next = n, n.prev = r, n;
|
|
4073
4213
|
}
|
|
4074
|
-
function
|
|
4075
|
-
const
|
|
4076
|
-
return
|
|
4214
|
+
function kt(s, t, e, n) {
|
|
4215
|
+
const i = Rt(s, t, e);
|
|
4216
|
+
return n ? (i.next = n.next, i.prev = n, n.next.prev = i, n.next = i) : (i.prev = i, i.next = i), i;
|
|
4077
4217
|
}
|
|
4078
4218
|
function ot(s) {
|
|
4079
4219
|
s.next.prev = s.prev, s.prev.next = s.next, s.prevZ && (s.prevZ.nextZ = s.nextZ), s.nextZ && (s.nextZ.prevZ = s.prevZ);
|
|
4080
4220
|
}
|
|
4081
|
-
function
|
|
4221
|
+
function Rt(s, t, e) {
|
|
4082
4222
|
return {
|
|
4083
4223
|
i: s,
|
|
4084
4224
|
x: t,
|
|
@@ -4091,11 +4231,11 @@ function wt(s, t, e) {
|
|
|
4091
4231
|
steiner: !1
|
|
4092
4232
|
};
|
|
4093
4233
|
}
|
|
4094
|
-
function
|
|
4095
|
-
let
|
|
4096
|
-
for (let r = t, o = e -
|
|
4097
|
-
|
|
4098
|
-
return
|
|
4234
|
+
function Hn(s, t, e, n) {
|
|
4235
|
+
let i = 0;
|
|
4236
|
+
for (let r = t, o = e - n; r < e; r += n)
|
|
4237
|
+
i += (s[o] - s[r]) * (s[r + 1] + s[o + 1]), o = r;
|
|
4238
|
+
return i;
|
|
4099
4239
|
}
|
|
4100
4240
|
const R = {
|
|
4101
4241
|
parallaxX: 0.4,
|
|
@@ -4153,7 +4293,7 @@ const R = {
|
|
|
4153
4293
|
loop: !0,
|
|
4154
4294
|
muted: !0
|
|
4155
4295
|
}, J = 512, Q = 512;
|
|
4156
|
-
class
|
|
4296
|
+
class bt extends HTMLElement {
|
|
4157
4297
|
static TAG_NAME = "layershift-portal";
|
|
4158
4298
|
static get observedAttributes() {
|
|
4159
4299
|
return [
|
|
@@ -4216,8 +4356,8 @@ class Et extends HTMLElement {
|
|
|
4216
4356
|
canInit() {
|
|
4217
4357
|
const t = !!this.getAttribute("logo-src");
|
|
4218
4358
|
if (this.sourceType === "camera") return t;
|
|
4219
|
-
const e = !!this.getAttribute("src"),
|
|
4220
|
-
return e && t && (
|
|
4359
|
+
const e = !!this.getAttribute("src"), n = !!this.getAttribute("map-src"), i = !!this.getAttribute("depth-model");
|
|
4360
|
+
return e && t && (n || i);
|
|
4221
4361
|
}
|
|
4222
4362
|
_input = { x: 0, y: 0 };
|
|
4223
4363
|
/** The current input offset. Set this externally to drive the effect. */
|
|
@@ -4236,28 +4376,28 @@ class Et extends HTMLElement {
|
|
|
4236
4376
|
loopCount = 0;
|
|
4237
4377
|
lifecycle;
|
|
4238
4378
|
constructor() {
|
|
4239
|
-
super(), this.shadow = this.attachShadow({ mode: "open" }), this.lifecycle = new
|
|
4379
|
+
super(), this.shadow = this.attachShadow({ mode: "open" }), this.lifecycle = new Yt(this);
|
|
4240
4380
|
}
|
|
4241
4381
|
// --- Attribute helpers ---
|
|
4242
4382
|
getAttrFloat(t, e) {
|
|
4243
|
-
const
|
|
4244
|
-
if (
|
|
4245
|
-
const
|
|
4246
|
-
return Number.isFinite(
|
|
4383
|
+
const n = this.getAttribute(t);
|
|
4384
|
+
if (n === null) return e;
|
|
4385
|
+
const i = parseFloat(n);
|
|
4386
|
+
return Number.isFinite(i) ? i : e;
|
|
4247
4387
|
}
|
|
4248
4388
|
getAttrBool(t, e) {
|
|
4249
4389
|
if (!this.hasAttribute(t)) return e;
|
|
4250
|
-
const
|
|
4251
|
-
return !(
|
|
4390
|
+
const n = this.getAttribute(t);
|
|
4391
|
+
return !(n === "false" || n === "0");
|
|
4252
4392
|
}
|
|
4253
4393
|
getAttrColor(t, e) {
|
|
4254
|
-
const
|
|
4255
|
-
return
|
|
4394
|
+
const n = this.getAttribute(t) ?? e;
|
|
4395
|
+
return Nn(n);
|
|
4256
4396
|
}
|
|
4257
4397
|
getAttrVec3(t, e) {
|
|
4258
|
-
const
|
|
4259
|
-
if (
|
|
4260
|
-
return [
|
|
4398
|
+
const i = (this.getAttribute(t) ?? e).split(",").map((o) => parseFloat(o.trim()));
|
|
4399
|
+
if (i.length >= 3 && i.every(Number.isFinite))
|
|
4400
|
+
return [i[0], i[1], i[2]];
|
|
4261
4401
|
const r = e.split(",").map((o) => parseFloat(o.trim()));
|
|
4262
4402
|
return [r[0], r[1], r[2]];
|
|
4263
4403
|
}
|
|
@@ -4447,8 +4587,8 @@ class Et extends HTMLElement {
|
|
|
4447
4587
|
disconnectedCallback() {
|
|
4448
4588
|
this.lifecycle.onDisconnected();
|
|
4449
4589
|
}
|
|
4450
|
-
attributeChangedCallback(t, e,
|
|
4451
|
-
this.lifecycle.onAttributeChanged(t, e,
|
|
4590
|
+
attributeChangedCallback(t, e, n) {
|
|
4591
|
+
this.lifecycle.onAttributeChanged(t, e, n);
|
|
4452
4592
|
}
|
|
4453
4593
|
// --- Shadow DOM setup ---
|
|
4454
4594
|
setupShadowDOM() {
|
|
@@ -4480,69 +4620,69 @@ class Et extends HTMLElement {
|
|
|
4480
4620
|
async doInit(t) {
|
|
4481
4621
|
const e = this.getAttribute("logo-src");
|
|
4482
4622
|
if (!this.container) return;
|
|
4483
|
-
const
|
|
4623
|
+
const n = this.sourceType === "camera", i = this.depthModel;
|
|
4484
4624
|
try {
|
|
4485
4625
|
let r, o, l, a = null;
|
|
4486
4626
|
const h = (d) => {
|
|
4487
4627
|
this.emit("layershift-portal:model-progress", d);
|
|
4488
4628
|
};
|
|
4489
|
-
if (
|
|
4490
|
-
const [d,
|
|
4491
|
-
|
|
4629
|
+
if (n) {
|
|
4630
|
+
const [d, S] = await Promise.all([
|
|
4631
|
+
zt(
|
|
4492
4632
|
{ video: { facingMode: "user" } },
|
|
4493
4633
|
{ parent: this.shadow }
|
|
4494
4634
|
),
|
|
4495
|
-
|
|
4635
|
+
Et(e)
|
|
4496
4636
|
]);
|
|
4497
4637
|
if (t.aborted) {
|
|
4498
4638
|
d.dispose();
|
|
4499
4639
|
return;
|
|
4500
4640
|
}
|
|
4501
|
-
if (r = d, l =
|
|
4502
|
-
if (a = await
|
|
4641
|
+
if (r = d, l = S, i) {
|
|
4642
|
+
if (a = await mt(i, J, Q, h), t.aborted) {
|
|
4503
4643
|
a.dispose(), r.dispose();
|
|
4504
4644
|
return;
|
|
4505
4645
|
}
|
|
4506
|
-
o =
|
|
4646
|
+
o = N(J, Q);
|
|
4507
4647
|
} else
|
|
4508
|
-
o =
|
|
4648
|
+
o = N(r.width, r.height);
|
|
4509
4649
|
} else {
|
|
4510
|
-
const d = this.getAttribute("src"),
|
|
4511
|
-
if (
|
|
4512
|
-
const [g,
|
|
4513
|
-
|
|
4650
|
+
const d = this.getAttribute("src"), S = this.getAttribute("map-src"), E = !!S, b = this.sourceType === "image" || /\.(jpe?g|png|webp|gif|avif|bmp)(\?|$)/i.test(d);
|
|
4651
|
+
if (E) {
|
|
4652
|
+
const [g, x, m] = await Promise.all([
|
|
4653
|
+
b ? dt(d) : ft(d, {
|
|
4514
4654
|
parent: this.shadow,
|
|
4515
4655
|
loop: this.shouldLoop,
|
|
4516
4656
|
muted: this.shouldMute
|
|
4517
4657
|
}),
|
|
4518
|
-
|
|
4519
|
-
|
|
4658
|
+
Nt(
|
|
4659
|
+
S,
|
|
4520
4660
|
this.getAttrFloat("map-width", 512),
|
|
4521
4661
|
this.getAttrFloat("map-height", 512),
|
|
4522
4662
|
this.getAttrFloat("map-fps", 5)
|
|
4523
4663
|
),
|
|
4524
|
-
|
|
4664
|
+
Et(e)
|
|
4525
4665
|
]);
|
|
4526
4666
|
if (t.aborted) {
|
|
4527
4667
|
g.dispose();
|
|
4528
4668
|
return;
|
|
4529
4669
|
}
|
|
4530
|
-
r = g, o =
|
|
4531
|
-
} else if (
|
|
4532
|
-
const [g,
|
|
4533
|
-
|
|
4670
|
+
r = g, o = x, l = m;
|
|
4671
|
+
} else if (i) {
|
|
4672
|
+
const [g, x, m] = await Promise.all([
|
|
4673
|
+
b ? dt(d) : ft(d, {
|
|
4534
4674
|
parent: this.shadow,
|
|
4535
4675
|
loop: this.shouldLoop,
|
|
4536
4676
|
muted: this.shouldMute
|
|
4537
4677
|
}),
|
|
4538
|
-
|
|
4539
|
-
|
|
4678
|
+
mt(i, J, Q, h),
|
|
4679
|
+
Et(e)
|
|
4540
4680
|
]);
|
|
4541
4681
|
if (t.aborted) {
|
|
4542
|
-
g.dispose(),
|
|
4682
|
+
g.dispose(), x.dispose();
|
|
4543
4683
|
return;
|
|
4544
4684
|
}
|
|
4545
|
-
if (r = g, a =
|
|
4685
|
+
if (r = g, a = x, l = m, b || !r.isLive) {
|
|
4546
4686
|
const T = r.getImageSource();
|
|
4547
4687
|
if (T) {
|
|
4548
4688
|
const w = await a.submitFrameAndWait(T);
|
|
@@ -4554,9 +4694,9 @@ class Et extends HTMLElement {
|
|
|
4554
4694
|
frames: [w]
|
|
4555
4695
|
};
|
|
4556
4696
|
} else
|
|
4557
|
-
o =
|
|
4697
|
+
o = N(J, Q);
|
|
4558
4698
|
} else
|
|
4559
|
-
o =
|
|
4699
|
+
o = N(J, Q);
|
|
4560
4700
|
} else
|
|
4561
4701
|
throw new Error("Either map-src or depth-model must be provided.");
|
|
4562
4702
|
}
|
|
@@ -4566,10 +4706,10 @@ class Et extends HTMLElement {
|
|
|
4566
4706
|
if (a)
|
|
4567
4707
|
u = () => a.getLatestDepth();
|
|
4568
4708
|
else {
|
|
4569
|
-
const d = new
|
|
4570
|
-
u = (
|
|
4709
|
+
const d = new Ht(o);
|
|
4710
|
+
u = (S) => d.sample(S);
|
|
4571
4711
|
}
|
|
4572
|
-
const
|
|
4712
|
+
const v = {
|
|
4573
4713
|
parallaxStrength: f,
|
|
4574
4714
|
overscanPadding: this.overscan,
|
|
4575
4715
|
pomSteps: this.pomSteps,
|
|
@@ -4611,23 +4751,25 @@ class Et extends HTMLElement {
|
|
|
4611
4751
|
lightDirection: this.lightDirection3
|
|
4612
4752
|
};
|
|
4613
4753
|
if (t.aborted) return;
|
|
4614
|
-
this.renderer = new
|
|
4754
|
+
this.renderer = new mn(this.container, v), this.renderer.onError = (d) => {
|
|
4755
|
+
this.emit("layershift-portal:error", { message: d.message });
|
|
4756
|
+
}, this.renderer.initialize(r, o.width, o.height, l);
|
|
4615
4757
|
const p = a;
|
|
4616
4758
|
if (this.renderer.start(
|
|
4617
4759
|
r,
|
|
4618
4760
|
u,
|
|
4619
4761
|
() => ({ x: this._input.x, y: this._input.y }),
|
|
4620
|
-
(d,
|
|
4762
|
+
(d, S) => {
|
|
4621
4763
|
if (p) {
|
|
4622
|
-
const
|
|
4623
|
-
|
|
4764
|
+
const E = r.getImageSource();
|
|
4765
|
+
E && p.submitFrame(E);
|
|
4624
4766
|
}
|
|
4625
4767
|
this.emit("layershift-portal:frame", {
|
|
4626
4768
|
currentTime: d,
|
|
4627
|
-
frameNumber:
|
|
4769
|
+
frameNumber: S
|
|
4628
4770
|
});
|
|
4629
4771
|
}
|
|
4630
|
-
), !
|
|
4772
|
+
), !n && r.isLive && this.shouldAutoplay && r.play)
|
|
4631
4773
|
try {
|
|
4632
4774
|
await r.play();
|
|
4633
4775
|
} catch {
|
|
@@ -4648,15 +4790,15 @@ class Et extends HTMLElement {
|
|
|
4648
4790
|
this.renderer?.dispose(), this.renderer = null, this.depthEstimator?.dispose(), this.depthEstimator = null, this.source?.dispose(), this.source = null, this.mesh = null, this.loopCount = 0, this.container = null;
|
|
4649
4791
|
}
|
|
4650
4792
|
}
|
|
4651
|
-
function
|
|
4793
|
+
function Nn(s) {
|
|
4652
4794
|
const t = s.replace("#", "");
|
|
4653
4795
|
if (t.length === 3) {
|
|
4654
|
-
const e = parseInt(t[0] + t[0], 16) / 255,
|
|
4655
|
-
return [e,
|
|
4796
|
+
const e = parseInt(t[0] + t[0], 16) / 255, n = parseInt(t[1] + t[1], 16) / 255, i = parseInt(t[2] + t[2], 16) / 255;
|
|
4797
|
+
return [e, n, i];
|
|
4656
4798
|
}
|
|
4657
4799
|
if (t.length === 6) {
|
|
4658
|
-
const e = parseInt(t.substring(0, 2), 16) / 255,
|
|
4659
|
-
return [e,
|
|
4800
|
+
const e = parseInt(t.substring(0, 2), 16) / 255, n = parseInt(t.substring(2, 4), 16) / 255, i = parseInt(t.substring(4, 6), 16) / 255;
|
|
4801
|
+
return [e, n, i];
|
|
4660
4802
|
}
|
|
4661
4803
|
return [0, 0, 0];
|
|
4662
4804
|
}
|
|
@@ -4666,104 +4808,104 @@ function V(s, t, e) {
|
|
|
4666
4808
|
function W(s, t, e) {
|
|
4667
4809
|
return s + (t - s) * e;
|
|
4668
4810
|
}
|
|
4669
|
-
const
|
|
4670
|
-
function
|
|
4671
|
-
const e = t?.sensitivityX ?? 1,
|
|
4811
|
+
const X = 100, te = 0.06;
|
|
4812
|
+
function Xn(s, t) {
|
|
4813
|
+
const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? 0.08;
|
|
4672
4814
|
let r = 0, o = 0, l = 0, a = 0, h = 0, c = !0;
|
|
4673
4815
|
const f = (p) => {
|
|
4674
|
-
const d = s.getBoundingClientRect(),
|
|
4675
|
-
r = V(
|
|
4816
|
+
const d = s.getBoundingClientRect(), S = (p.clientX - d.left) / d.width * 2 - 1, E = (p.clientY - d.top) / d.height * 2 - 1;
|
|
4817
|
+
r = V(S, -1, 1), o = V(E, -1, 1);
|
|
4676
4818
|
}, u = () => {
|
|
4677
4819
|
r = 0, o = 0;
|
|
4678
|
-
},
|
|
4679
|
-
c && (l = W(l, r,
|
|
4820
|
+
}, v = () => {
|
|
4821
|
+
c && (l = W(l, r, i), a = W(a, o, i), s.input = { x: l * e, y: a * n }, h = requestAnimationFrame(v));
|
|
4680
4822
|
};
|
|
4681
|
-
return s.addEventListener("mousemove", f), s.addEventListener("mouseleave", u), h = requestAnimationFrame(
|
|
4823
|
+
return s.addEventListener("mousemove", f), s.addEventListener("mouseleave", u), h = requestAnimationFrame(v), () => {
|
|
4682
4824
|
c = !1, cancelAnimationFrame(h), s.removeEventListener("mousemove", f), s.removeEventListener("mouseleave", u);
|
|
4683
4825
|
};
|
|
4684
4826
|
}
|
|
4685
|
-
function
|
|
4686
|
-
const e = t?.sensitivityX ?? 1,
|
|
4827
|
+
function Gn(s, t) {
|
|
4828
|
+
const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? 0.08;
|
|
4687
4829
|
let r = 0, o = 0, l = 0, a = 0, h = 0, c = 0, f = 0, u = !0;
|
|
4688
|
-
const
|
|
4689
|
-
const
|
|
4690
|
-
|
|
4691
|
-
}, p = (
|
|
4692
|
-
const
|
|
4693
|
-
if (!
|
|
4694
|
-
const g =
|
|
4695
|
-
r = V(g /
|
|
4830
|
+
const v = (E) => {
|
|
4831
|
+
const b = E.touches[0];
|
|
4832
|
+
b && (h = b.clientX - l * X, c = b.clientY - a * X, r = l, o = a);
|
|
4833
|
+
}, p = (E) => {
|
|
4834
|
+
const b = E.touches[0];
|
|
4835
|
+
if (!b) return;
|
|
4836
|
+
const g = b.clientX - h, x = b.clientY - c;
|
|
4837
|
+
r = V(g / X, -1, 1), o = V(x / X, -1, 1);
|
|
4696
4838
|
}, d = () => {
|
|
4697
4839
|
r = 0, o = 0;
|
|
4698
|
-
},
|
|
4699
|
-
u && (l = W(l, r,
|
|
4840
|
+
}, S = () => {
|
|
4841
|
+
u && (l = W(l, r, i), a = W(a, o, i), s.input = { x: l * e, y: a * n }, f = requestAnimationFrame(S));
|
|
4700
4842
|
};
|
|
4701
|
-
return s.addEventListener("touchstart",
|
|
4702
|
-
u = !1, cancelAnimationFrame(f), s.removeEventListener("touchstart",
|
|
4843
|
+
return s.addEventListener("touchstart", v, { passive: !0 }), s.addEventListener("touchmove", p, { passive: !0 }), s.addEventListener("touchend", d, { passive: !0 }), s.addEventListener("touchcancel", d, { passive: !0 }), f = requestAnimationFrame(S), () => {
|
|
4844
|
+
u = !1, cancelAnimationFrame(f), s.removeEventListener("touchstart", v), s.removeEventListener("touchmove", p), s.removeEventListener("touchend", d), s.removeEventListener("touchcancel", d);
|
|
4703
4845
|
};
|
|
4704
4846
|
}
|
|
4705
|
-
function
|
|
4706
|
-
const e = t?.sensitivityX ?? 1,
|
|
4847
|
+
function Wn(s, t) {
|
|
4848
|
+
const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? te;
|
|
4707
4849
|
let r = 0, o = 0, l = 0, a = 0, h = 0, c = !0, f = !1;
|
|
4708
|
-
const u = (
|
|
4709
|
-
r = V((
|
|
4710
|
-
},
|
|
4711
|
-
c && (l = W(l, r,
|
|
4850
|
+
const u = (S) => {
|
|
4851
|
+
r = V((S.gamma ?? 0) / 45, -1, 1), o = V((S.beta ?? 0) / 45, -1, 1);
|
|
4852
|
+
}, v = () => {
|
|
4853
|
+
c && (l = W(l, r, i), a = W(a, o, i), s.input = { x: l * e, y: a * n }, h = requestAnimationFrame(v));
|
|
4712
4854
|
}, p = () => {
|
|
4713
4855
|
c && !f && (window.addEventListener("deviceorientation", u), f = !0);
|
|
4714
4856
|
}, d = DeviceOrientationEvent;
|
|
4715
|
-
return typeof d.requestPermission == "function" ? d.requestPermission().then((
|
|
4716
|
-
|
|
4857
|
+
return typeof d.requestPermission == "function" ? d.requestPermission().then((S) => {
|
|
4858
|
+
S === "granted" && p();
|
|
4717
4859
|
}).catch(() => {
|
|
4718
|
-
}) : p(), h = requestAnimationFrame(
|
|
4860
|
+
}) : p(), h = requestAnimationFrame(v), () => {
|
|
4719
4861
|
c = !1, cancelAnimationFrame(h), f && (window.removeEventListener("deviceorientation", u), f = !1);
|
|
4720
4862
|
};
|
|
4721
4863
|
}
|
|
4722
|
-
function
|
|
4723
|
-
const e = t?.sensitivityX ?? 1,
|
|
4724
|
-
let o = 0, l = 0, a = 0, h = 0, c = 0, f = 0, u = 0,
|
|
4725
|
-
const m = (
|
|
4726
|
-
const D = s.getBoundingClientRect(), U = (
|
|
4864
|
+
function zn(s, t) {
|
|
4865
|
+
const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? 0.08, r = t?.lerpFactor ?? te;
|
|
4866
|
+
let o = 0, l = 0, a = 0, h = 0, c = 0, f = 0, u = 0, v = 0, p = !1, d = !1, S = !1, E = 0, b = 0, g = 0, x = !0;
|
|
4867
|
+
const m = (y) => {
|
|
4868
|
+
const D = s.getBoundingClientRect(), U = (y.clientX - D.left) / D.width * 2 - 1, M = (y.clientY - D.top) / D.height * 2 - 1;
|
|
4727
4869
|
o = V(U, -1, 1), l = V(M, -1, 1);
|
|
4728
4870
|
}, T = () => {
|
|
4729
4871
|
o = 0, l = 0;
|
|
4730
|
-
}, w = (
|
|
4731
|
-
const D =
|
|
4732
|
-
D && (p = !0,
|
|
4733
|
-
}, A = (
|
|
4734
|
-
const D =
|
|
4872
|
+
}, w = (y) => {
|
|
4873
|
+
const D = y.touches[0];
|
|
4874
|
+
D && (p = !0, E = D.clientX - u * X, b = D.clientY - v * X, a = u, h = v, !d && !S && I());
|
|
4875
|
+
}, A = (y) => {
|
|
4876
|
+
const D = y.touches[0];
|
|
4735
4877
|
if (!D) return;
|
|
4736
|
-
const U = D.clientX -
|
|
4737
|
-
a = V(U /
|
|
4878
|
+
const U = D.clientX - E, M = D.clientY - b;
|
|
4879
|
+
a = V(U / X, -1, 1), h = V(M / X, -1, 1);
|
|
4738
4880
|
}, P = () => {
|
|
4739
4881
|
p = !1, a = 0, h = 0;
|
|
4740
|
-
}, F = (
|
|
4741
|
-
c = V((
|
|
4882
|
+
}, F = (y) => {
|
|
4883
|
+
c = V((y.gamma ?? 0) / 45, -1, 1), f = V((y.beta ?? 0) / 45, -1, 1);
|
|
4742
4884
|
}, _ = () => {
|
|
4743
|
-
|
|
4885
|
+
x && !S && (window.addEventListener("deviceorientation", F), S = !0, d = !0);
|
|
4744
4886
|
}, I = () => {
|
|
4745
4887
|
if (typeof DeviceOrientationEvent > "u") return;
|
|
4746
|
-
const
|
|
4747
|
-
typeof
|
|
4888
|
+
const y = DeviceOrientationEvent;
|
|
4889
|
+
typeof y.requestPermission == "function" ? y.requestPermission().then((D) => {
|
|
4748
4890
|
D === "granted" && _();
|
|
4749
4891
|
}).catch(() => {
|
|
4750
4892
|
}) : _();
|
|
4751
4893
|
}, C = () => {
|
|
4752
|
-
if (!
|
|
4753
|
-
let
|
|
4754
|
-
p ? (
|
|
4894
|
+
if (!x) return;
|
|
4895
|
+
let y, D, U;
|
|
4896
|
+
p ? (y = a, D = h, U = i) : d ? (y = c, D = f, U = r) : (y = o, D = l, U = i), u = W(u, y, U), v = W(v, D, U), s.input = { x: u * e, y: v * n }, g = requestAnimationFrame(C);
|
|
4755
4897
|
};
|
|
4756
4898
|
return s.addEventListener("mousemove", m), s.addEventListener("mouseleave", T), s.addEventListener("touchstart", w, { passive: !0 }), s.addEventListener("touchmove", A, { passive: !0 }), s.addEventListener("touchend", P, { passive: !0 }), s.addEventListener("touchcancel", P, { passive: !0 }), g = requestAnimationFrame(C), () => {
|
|
4757
|
-
|
|
4899
|
+
x = !1, cancelAnimationFrame(g), s.removeEventListener("mousemove", m), s.removeEventListener("mouseleave", T), s.removeEventListener("touchstart", w), s.removeEventListener("touchmove", A), s.removeEventListener("touchend", P), s.removeEventListener("touchcancel", P), S && (window.removeEventListener("deviceorientation", F), S = !1);
|
|
4758
4900
|
};
|
|
4759
4901
|
}
|
|
4760
|
-
customElements.get(
|
|
4761
|
-
customElements.get(
|
|
4902
|
+
customElements.get(Tt.TAG_NAME) || customElements.define(Tt.TAG_NAME, Tt);
|
|
4903
|
+
customElements.get(bt.TAG_NAME) || customElements.define(bt.TAG_NAME, bt);
|
|
4762
4904
|
export {
|
|
4763
|
-
|
|
4764
|
-
|
|
4765
|
-
|
|
4766
|
-
|
|
4767
|
-
|
|
4768
|
-
|
|
4905
|
+
Tt as LayershiftElement,
|
|
4906
|
+
bt as LayershiftPortalElement,
|
|
4907
|
+
Wn as connectGyro,
|
|
4908
|
+
Xn as connectMouse,
|
|
4909
|
+
zn as connectPointer,
|
|
4910
|
+
Gn as connectTouch
|
|
4769
4911
|
};
|