layershift 0.4.3 → 0.5.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 +79 -1
- package/dist/components/layershift.js +29 -29
- package/dist/npm/layershift.es.js +808 -831
- package/dist/types/components/layershift/index.d.ts +8 -0
- package/dist/types/components/layershift/index.d.ts.map +1 -1
- package/dist/types/components/layershift/layershift-element.d.ts +5 -1
- package/dist/types/components/layershift/layershift-element.d.ts.map +1 -1
- package/dist/types/components/layershift/portal-element.d.ts +5 -1
- package/dist/types/components/layershift/portal-element.d.ts.map +1 -1
- package/dist/types/components/layershift/types.d.ts +2 -0
- package/dist/types/components/layershift/types.d.ts.map +1 -1
- package/dist/types/input-handler.d.ts +14 -0
- package/dist/types/input-handler.d.ts.map +1 -1
- package/dist/types/input-helpers.d.ts +70 -0
- package/dist/types/input-helpers.d.ts.map +1 -0
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
class
|
|
1
|
+
class Bt {
|
|
2
2
|
constructor(t) {
|
|
3
3
|
this.depthData = t;
|
|
4
4
|
const e = t.meta.width * t.meta.height;
|
|
@@ -10,29 +10,29 @@ class Ot {
|
|
|
10
10
|
lastNextFrameIndex = -1;
|
|
11
11
|
lastLerpFactor = -1;
|
|
12
12
|
sample(t) {
|
|
13
|
-
const e =
|
|
13
|
+
const e = ie(t * this.depthData.meta.fps, 0, this.depthData.meta.frameCount - 1), n = Math.floor(e), i = Math.min(n + 1, this.depthData.meta.frameCount - 1), r = e - n, s = n !== this.lastFrameIndex || i !== this.lastNextFrameIndex, a = Math.abs(r - this.lastLerpFactor) > 1e-3;
|
|
14
14
|
if (!s && !a)
|
|
15
15
|
return this.uint8Output;
|
|
16
16
|
this.lastFrameIndex = n, this.lastNextFrameIndex = i, this.lastLerpFactor = r;
|
|
17
|
-
const l = 1 - r,
|
|
17
|
+
const l = 1 - r, c = this.depthData.frames[n], u = this.depthData.frames[i];
|
|
18
18
|
for (let f = 0; f < this.uint8Output.length; f += 1)
|
|
19
|
-
this.uint8Output[f] =
|
|
19
|
+
this.uint8Output[f] = c[f] * l + u[f] * r + 0.5 | 0;
|
|
20
20
|
return this.uint8Output;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
23
|
-
async function
|
|
23
|
+
async function Vt(o, t, e) {
|
|
24
24
|
const [n, i] = await Promise.all([
|
|
25
|
-
|
|
26
|
-
|
|
25
|
+
Qt(t),
|
|
26
|
+
te(o)
|
|
27
27
|
]);
|
|
28
|
-
return
|
|
28
|
+
return ee(i, n);
|
|
29
29
|
}
|
|
30
|
-
async function
|
|
30
|
+
async function Qt(o) {
|
|
31
31
|
const t = await fetch(o);
|
|
32
32
|
if (!t.ok)
|
|
33
33
|
throw new Error(`Failed to fetch depth metadata (${t.status} ${t.statusText}).`);
|
|
34
34
|
const e = await t.json();
|
|
35
|
-
return
|
|
35
|
+
return ne(e), {
|
|
36
36
|
frameCount: e.frameCount,
|
|
37
37
|
fps: e.fps,
|
|
38
38
|
width: e.width,
|
|
@@ -40,7 +40,7 @@ async function ee(o) {
|
|
|
40
40
|
sourceFps: e.sourceFps
|
|
41
41
|
};
|
|
42
42
|
}
|
|
43
|
-
async function
|
|
43
|
+
async function te(o, t) {
|
|
44
44
|
const e = await fetch(o);
|
|
45
45
|
if (!e.ok)
|
|
46
46
|
throw new Error(`Failed to fetch depth data (${e.status} ${e.statusText}).`);
|
|
@@ -52,18 +52,18 @@ async function ne(o, t) {
|
|
|
52
52
|
let r = 0;
|
|
53
53
|
const s = n.getReader();
|
|
54
54
|
for (; ; ) {
|
|
55
|
-
const { done:
|
|
56
|
-
if (
|
|
55
|
+
const { done: c, value: u } = await s.read();
|
|
56
|
+
if (c)
|
|
57
57
|
break;
|
|
58
|
-
|
|
58
|
+
u && (i.push(u), r += u.byteLength);
|
|
59
59
|
}
|
|
60
60
|
const a = new Uint8Array(r);
|
|
61
61
|
let l = 0;
|
|
62
|
-
for (const
|
|
63
|
-
a.set(
|
|
62
|
+
for (const c of i)
|
|
63
|
+
a.set(c, l), l += c.byteLength;
|
|
64
64
|
return a;
|
|
65
65
|
}
|
|
66
|
-
function
|
|
66
|
+
function ee(o, t) {
|
|
67
67
|
if (o.byteLength < 4)
|
|
68
68
|
throw new Error("Depth data binary is missing the frame-count header.");
|
|
69
69
|
const n = new DataView(o.buffer, o.byteOffset, o.byteLength).getUint32(0, !0), i = t.width * t.height, r = 4 + n * i;
|
|
@@ -77,28 +77,28 @@ function ie(o, t) {
|
|
|
77
77
|
);
|
|
78
78
|
const s = o.subarray(4), a = new Array(n);
|
|
79
79
|
for (let l = 0; l < n; l += 1) {
|
|
80
|
-
const
|
|
81
|
-
a[l] = s.subarray(
|
|
80
|
+
const c = l * i;
|
|
81
|
+
a[l] = s.subarray(c, c + i);
|
|
82
82
|
}
|
|
83
83
|
return { meta: t, frames: a };
|
|
84
84
|
}
|
|
85
|
-
function
|
|
85
|
+
function ne(o) {
|
|
86
86
|
if (!o || typeof o.frameCount != "number" || typeof o.fps != "number" || typeof o.width != "number" || typeof o.height != "number" || typeof o.sourceFps != "number")
|
|
87
87
|
throw new Error("Depth metadata is malformed.");
|
|
88
88
|
if (!Number.isFinite(o.frameCount) || !Number.isFinite(o.fps) || !Number.isFinite(o.width) || !Number.isFinite(o.height) || !Number.isFinite(o.sourceFps) || o.frameCount <= 0 || o.fps <= 0 || o.width <= 0 || o.height <= 0 || o.sourceFps <= 0)
|
|
89
89
|
throw new Error("Depth metadata contains invalid numeric values.");
|
|
90
90
|
}
|
|
91
|
-
function
|
|
91
|
+
function N(o, t) {
|
|
92
92
|
const e = new Uint8Array(o * t);
|
|
93
93
|
return e.fill(128), {
|
|
94
94
|
meta: { frameCount: 1, fps: 1, width: o, height: t, sourceFps: 1 },
|
|
95
95
|
frames: [e]
|
|
96
96
|
};
|
|
97
97
|
}
|
|
98
|
-
function
|
|
98
|
+
function ie(o, t, e) {
|
|
99
99
|
return Math.min(e, Math.max(t, o));
|
|
100
100
|
}
|
|
101
|
-
const
|
|
101
|
+
const re = {
|
|
102
102
|
parallaxStrength: 0.05,
|
|
103
103
|
contrastLow: 0.05,
|
|
104
104
|
contrastHigh: 0.95,
|
|
@@ -108,72 +108,72 @@ const se = {
|
|
|
108
108
|
pomSteps: 16,
|
|
109
109
|
overscanPadding: 0.08
|
|
110
110
|
};
|
|
111
|
-
function
|
|
111
|
+
function oe(o, t, e) {
|
|
112
112
|
const n = new Float32Array(256);
|
|
113
113
|
if (o.length === 0 || t <= 0 || e <= 0)
|
|
114
|
-
return
|
|
115
|
-
const i =
|
|
114
|
+
return Pt(n);
|
|
115
|
+
const i = ae(o.length), r = t * e;
|
|
116
116
|
let s = 0;
|
|
117
117
|
const a = new Uint32Array(256);
|
|
118
|
-
for (const
|
|
119
|
-
const T = o[
|
|
120
|
-
for (let
|
|
121
|
-
a[T[
|
|
122
|
-
s +=
|
|
118
|
+
for (const m of i) {
|
|
119
|
+
const T = o[m], w = Math.min(T.length, r);
|
|
120
|
+
for (let A = 0; A < w; A += 1)
|
|
121
|
+
a[T[A]] += 1;
|
|
122
|
+
s += w;
|
|
123
123
|
}
|
|
124
124
|
if (s === 0)
|
|
125
|
-
return
|
|
125
|
+
return Pt(n);
|
|
126
126
|
const l = 1 / s;
|
|
127
|
-
for (let
|
|
128
|
-
n[
|
|
129
|
-
const
|
|
130
|
-
|
|
131
|
-
for (let
|
|
132
|
-
|
|
133
|
-
const
|
|
134
|
-
let
|
|
135
|
-
for (let
|
|
136
|
-
|
|
137
|
-
let
|
|
138
|
-
for (let
|
|
139
|
-
const T =
|
|
140
|
-
|
|
141
|
-
}
|
|
142
|
-
const
|
|
127
|
+
for (let m = 0; m < 256; m += 1)
|
|
128
|
+
n[m] = a[m] * l;
|
|
129
|
+
const c = new Float32Array(256);
|
|
130
|
+
c[0] = n[0];
|
|
131
|
+
for (let m = 1; m < 256; m += 1)
|
|
132
|
+
c[m] = c[m - 1] + n[m];
|
|
133
|
+
const u = et(c, 0.05), f = et(c, 0.25), h = et(c, 0.5), x = et(c, 0.75), g = et(c, 0.95);
|
|
134
|
+
let d = 0;
|
|
135
|
+
for (let m = 0; m < 256; m += 1)
|
|
136
|
+
d += m / 255 * n[m];
|
|
137
|
+
let y = 0;
|
|
138
|
+
for (let m = 0; m < 256; m += 1) {
|
|
139
|
+
const T = m / 255 - d;
|
|
140
|
+
y += n[m] * T * T;
|
|
141
|
+
}
|
|
142
|
+
const E = Math.sqrt(y), b = g - u, p = x - f, v = le(n);
|
|
143
143
|
return {
|
|
144
|
-
mean:
|
|
145
|
-
stdDev:
|
|
146
|
-
p5:
|
|
144
|
+
mean: d,
|
|
145
|
+
stdDev: E,
|
|
146
|
+
p5: u,
|
|
147
147
|
p25: f,
|
|
148
|
-
median:
|
|
149
|
-
p75:
|
|
150
|
-
p95:
|
|
151
|
-
effectiveRange:
|
|
152
|
-
iqr:
|
|
153
|
-
bimodality:
|
|
148
|
+
median: h,
|
|
149
|
+
p75: x,
|
|
150
|
+
p95: g,
|
|
151
|
+
effectiveRange: b,
|
|
152
|
+
iqr: p,
|
|
153
|
+
bimodality: v,
|
|
154
154
|
histogram: n
|
|
155
155
|
};
|
|
156
156
|
}
|
|
157
|
-
function
|
|
157
|
+
function se(o) {
|
|
158
158
|
if (o.effectiveRange < 0.05 || o.stdDev < 0.02)
|
|
159
|
-
return { ...
|
|
160
|
-
const t = o.effectiveRange - 0.5, e = o.bimodality - 0.4, n =
|
|
159
|
+
return { ...re };
|
|
160
|
+
const t = o.effectiveRange - 0.5, e = o.bimodality - 0.4, n = X(
|
|
161
161
|
0.05 - t * 0.03 + e * 0.01,
|
|
162
162
|
0.035,
|
|
163
163
|
0.065
|
|
164
|
-
), i =
|
|
164
|
+
), i = X(o.p5 - 0.03, 0, 0.25), r = X(o.p95 + 0.03, 0.75, 1), s = X((n - 0.03) / 0.05, 0, 1), a = X(0.6 - s * 0.25, 0.35, 0.6), l = X(0.6 - t * 0.2, 0.5, 0.7), c = X(0.4 + t * 0.2, 0.25, 0.5), u = 16, f = X(n + 0.03, 0.06, 0.1);
|
|
165
165
|
return {
|
|
166
166
|
parallaxStrength: n,
|
|
167
167
|
contrastLow: i,
|
|
168
168
|
contrastHigh: r,
|
|
169
169
|
verticalReduction: a,
|
|
170
170
|
dofStart: l,
|
|
171
|
-
dofStrength:
|
|
172
|
-
pomSteps:
|
|
171
|
+
dofStrength: c,
|
|
172
|
+
pomSteps: u,
|
|
173
173
|
overscanPadding: f
|
|
174
174
|
};
|
|
175
175
|
}
|
|
176
|
-
function
|
|
176
|
+
function ae(o) {
|
|
177
177
|
if (o <= 0) return [];
|
|
178
178
|
if (o === 1) return [0];
|
|
179
179
|
const t = o - 1, e = [
|
|
@@ -193,38 +193,38 @@ function et(o, t) {
|
|
|
193
193
|
return e / 255;
|
|
194
194
|
return 1;
|
|
195
195
|
}
|
|
196
|
-
function
|
|
196
|
+
function le(o) {
|
|
197
197
|
const t = new Float32Array(256);
|
|
198
|
-
for (let
|
|
199
|
-
let
|
|
200
|
-
for (let
|
|
201
|
-
|
|
202
|
-
t[
|
|
198
|
+
for (let h = 0; h < 256; h += 1) {
|
|
199
|
+
let x = 0, g = 0;
|
|
200
|
+
for (let d = h - 2; d <= h + 2; d += 1)
|
|
201
|
+
d >= 0 && d < 256 && (x += o[d], g += 1);
|
|
202
|
+
t[h] = x / g;
|
|
203
203
|
}
|
|
204
204
|
let e = 0;
|
|
205
|
-
for (let
|
|
206
|
-
e += t[
|
|
205
|
+
for (let h = 0; h < 256; h += 1)
|
|
206
|
+
e += t[h];
|
|
207
207
|
e /= 256;
|
|
208
208
|
const n = e * 2, i = 25, r = [];
|
|
209
|
-
for (let
|
|
210
|
-
t[
|
|
211
|
-
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((
|
|
209
|
+
for (let h = 1; h < 255; h += 1)
|
|
210
|
+
t[h] > t[h - 1] && t[h] > t[h + 1] && t[h] >= n && r.push({ bin: h, height: t[h] });
|
|
211
|
+
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((h, x) => x.height - h.height), r.length < 2) return 0;
|
|
212
212
|
const s = r[0];
|
|
213
213
|
let a = null;
|
|
214
|
-
for (let
|
|
215
|
-
if (Math.abs(r[
|
|
216
|
-
a = r[
|
|
214
|
+
for (let h = 1; h < r.length; h += 1)
|
|
215
|
+
if (Math.abs(r[h].bin - s.bin) >= i) {
|
|
216
|
+
a = r[h];
|
|
217
217
|
break;
|
|
218
218
|
}
|
|
219
219
|
if (!a) return 0;
|
|
220
|
-
const l = Math.min(s.bin, a.bin),
|
|
221
|
-
let
|
|
222
|
-
for (let
|
|
223
|
-
t[
|
|
220
|
+
const l = Math.min(s.bin, a.bin), c = Math.max(s.bin, a.bin);
|
|
221
|
+
let u = 1 / 0;
|
|
222
|
+
for (let h = l; h <= c; h += 1)
|
|
223
|
+
t[h] < u && (u = t[h]);
|
|
224
224
|
const f = Math.min(s.height, a.height);
|
|
225
|
-
return f <= 0 ? 0 :
|
|
225
|
+
return f <= 0 ? 0 : X(1 - u / f, 0, 1);
|
|
226
226
|
}
|
|
227
|
-
function
|
|
227
|
+
function Pt(o) {
|
|
228
228
|
return {
|
|
229
229
|
mean: 0,
|
|
230
230
|
stdDev: 0,
|
|
@@ -239,7 +239,7 @@ function Ct(o) {
|
|
|
239
239
|
histogram: o
|
|
240
240
|
};
|
|
241
241
|
}
|
|
242
|
-
function
|
|
242
|
+
function X(o, t, e) {
|
|
243
243
|
return Math.min(e, Math.max(t, o));
|
|
244
244
|
}
|
|
245
245
|
function Q(o, t, e) {
|
|
@@ -262,13 +262,13 @@ ${i}`);
|
|
|
262
262
|
}
|
|
263
263
|
return o.detachShader(n, t), o.detachShader(n, e), o.deleteShader(t), o.deleteShader(e), n;
|
|
264
264
|
}
|
|
265
|
-
function
|
|
265
|
+
function At(o, t, e) {
|
|
266
266
|
const n = {};
|
|
267
267
|
for (const i of e)
|
|
268
268
|
n[i] = o.getUniformLocation(t, i);
|
|
269
269
|
return n;
|
|
270
270
|
}
|
|
271
|
-
const
|
|
271
|
+
const ue = new Float32Array([
|
|
272
272
|
-1,
|
|
273
273
|
-1,
|
|
274
274
|
1,
|
|
@@ -278,16 +278,16 @@ const ce = new Float32Array([
|
|
|
278
278
|
1,
|
|
279
279
|
1
|
|
280
280
|
]);
|
|
281
|
-
function
|
|
281
|
+
function Ot(o, t) {
|
|
282
282
|
const e = o.createVertexArray();
|
|
283
283
|
if (!e) throw new Error("Failed to create VAO.");
|
|
284
284
|
o.bindVertexArray(e);
|
|
285
285
|
const n = o.createBuffer();
|
|
286
|
-
o.bindBuffer(o.ARRAY_BUFFER, n), o.bufferData(o.ARRAY_BUFFER,
|
|
286
|
+
o.bindBuffer(o.ARRAY_BUFFER, n), o.bufferData(o.ARRAY_BUFFER, ue, o.STATIC_DRAW);
|
|
287
287
|
const i = o.getAttribLocation(t, "aPosition");
|
|
288
288
|
return o.enableVertexAttribArray(i), o.vertexAttribPointer(i, 2, o.FLOAT, !1, 0, 0), o.bindVertexArray(null), e;
|
|
289
289
|
}
|
|
290
|
-
class
|
|
290
|
+
class kt {
|
|
291
291
|
slots = /* @__PURE__ */ new Map();
|
|
292
292
|
nextUnit = 0;
|
|
293
293
|
/**
|
|
@@ -323,18 +323,18 @@ class Ht {
|
|
|
323
323
|
return this.slots.size;
|
|
324
324
|
}
|
|
325
325
|
}
|
|
326
|
-
function
|
|
327
|
-
const r = Q(o, o.VERTEX_SHADER, e), s = Q(o, o.FRAGMENT_SHADER, n), a = wt(o, r, s), l =
|
|
326
|
+
function k(o, t, e, n, i) {
|
|
327
|
+
const r = Q(o, o.VERTEX_SHADER, e), s = Q(o, o.FRAGMENT_SHADER, n), a = wt(o, r, s), l = At(o, a, i);
|
|
328
328
|
return {
|
|
329
329
|
name: t,
|
|
330
330
|
program: a,
|
|
331
331
|
uniforms: l,
|
|
332
|
-
dispose(
|
|
333
|
-
|
|
332
|
+
dispose(c) {
|
|
333
|
+
c.deleteProgram(a);
|
|
334
334
|
}
|
|
335
335
|
};
|
|
336
336
|
}
|
|
337
|
-
const
|
|
337
|
+
const ce = {
|
|
338
338
|
high: {
|
|
339
339
|
dprCap: 2,
|
|
340
340
|
depthMaxDim: 512,
|
|
@@ -357,11 +357,11 @@ const fe = {
|
|
|
357
357
|
jfaDivisor: 4
|
|
358
358
|
}
|
|
359
359
|
};
|
|
360
|
-
function
|
|
360
|
+
function he(o) {
|
|
361
361
|
let t = "unknown";
|
|
362
362
|
const e = o.getExtension("WEBGL_debug_renderer_info");
|
|
363
363
|
e && (t = o.getParameter(e.UNMASKED_RENDERER_WEBGL) || "unknown");
|
|
364
|
-
const n = o.getParameter(o.MAX_TEXTURE_SIZE), i = typeof navigator < "u" && navigator.hardwareConcurrency || 0, r = typeof navigator < "u" && navigator.deviceMemory || 0, s = typeof window < "u" && window.devicePixelRatio || 1, a = typeof screen < "u" ? (screen.width || 0) * (screen.height || 0) : 0, l = typeof navigator < "u" && ("ontouchstart" in window || navigator.maxTouchPoints > 0),
|
|
364
|
+
const n = o.getParameter(o.MAX_TEXTURE_SIZE), i = typeof navigator < "u" && navigator.hardwareConcurrency || 0, r = typeof navigator < "u" && navigator.deviceMemory || 0, s = typeof window < "u" && window.devicePixelRatio || 1, a = typeof screen < "u" ? (screen.width || 0) * (screen.height || 0) : 0, l = typeof navigator < "u" && ("ontouchstart" in window || navigator.maxTouchPoints > 0), c = a > 0 && a < 1920 * 1080;
|
|
365
365
|
return {
|
|
366
366
|
gpuRenderer: t,
|
|
367
367
|
maxTextureSize: n,
|
|
@@ -369,10 +369,10 @@ function de(o) {
|
|
|
369
369
|
deviceMemory: r,
|
|
370
370
|
devicePixelRatio: s,
|
|
371
371
|
screenPixels: a,
|
|
372
|
-
isMobile: l &&
|
|
372
|
+
isMobile: l && c
|
|
373
373
|
};
|
|
374
374
|
}
|
|
375
|
-
const
|
|
375
|
+
const fe = [
|
|
376
376
|
"mali-4",
|
|
377
377
|
"mali-t",
|
|
378
378
|
"adreno 3",
|
|
@@ -385,7 +385,7 @@ const me = [
|
|
|
385
385
|
"llvmpipe",
|
|
386
386
|
"swiftshader",
|
|
387
387
|
"software"
|
|
388
|
-
],
|
|
388
|
+
], de = [
|
|
389
389
|
"nvidia",
|
|
390
390
|
"geforce",
|
|
391
391
|
"radeon rx",
|
|
@@ -397,16 +397,16 @@ const me = [
|
|
|
397
397
|
"mali-g7",
|
|
398
398
|
"mali-g6"
|
|
399
399
|
];
|
|
400
|
-
function
|
|
400
|
+
function me(o) {
|
|
401
401
|
let t = 0;
|
|
402
|
-
const e = o.gpuRenderer.toLowerCase(), n =
|
|
402
|
+
const e = o.gpuRenderer.toLowerCase(), n = fe.some((r) => e.includes(r)), i = de.some((r) => e.includes(r));
|
|
403
403
|
return n && (t -= 30), i && (t += 20), o.maxTextureSize >= 16384 ? t += 10 : o.maxTextureSize >= 8192 ? t += 5 : o.maxTextureSize <= 4096 && (t -= 15), o.hardwareConcurrency >= 8 ? t += 5 : o.hardwareConcurrency >= 4 ? t += 0 : o.hardwareConcurrency > 0 && o.hardwareConcurrency < 4 && (t -= 10), o.deviceMemory >= 8 ? t += 5 : o.deviceMemory >= 4 ? t += 0 : o.deviceMemory > 0 && o.deviceMemory < 4 && (t -= 15), o.isMobile && (t -= 10), t >= 0 ? "high" : t >= -25 ? "medium" : "low";
|
|
404
404
|
}
|
|
405
405
|
function Xt(o, t) {
|
|
406
|
-
const e = t && t !== "auto" ? t :
|
|
407
|
-
return { tier: e, ...
|
|
406
|
+
const e = t && t !== "auto" ? t : me(he(o));
|
|
407
|
+
return { tier: e, ...ce[e] };
|
|
408
408
|
}
|
|
409
|
-
class
|
|
409
|
+
class mt {
|
|
410
410
|
static RESIZE_DEBOUNCE_MS = 100;
|
|
411
411
|
// ---- Canvas + container ----
|
|
412
412
|
canvas;
|
|
@@ -531,7 +531,7 @@ class pt {
|
|
|
531
531
|
scheduleResizeRecalculate = () => {
|
|
532
532
|
this.resizeTimer !== null && window.clearTimeout(this.resizeTimer), this.resizeTimer = window.setTimeout(() => {
|
|
533
533
|
this.resizeTimer = null, this.recalculateViewportLayout();
|
|
534
|
-
},
|
|
534
|
+
}, mt.RESIZE_DEBOUNCE_MS);
|
|
535
535
|
};
|
|
536
536
|
/** Read the container's pixel dimensions, with a minimum of 1x1. */
|
|
537
537
|
getViewportSize() {
|
|
@@ -564,10 +564,10 @@ class pt {
|
|
|
564
564
|
if (!this.depthSubsampleBuffer) return t;
|
|
565
565
|
const e = this.depthSubsampleBuffer, n = this.sourceDepthWidth, i = this.depthWidth, r = this.depthHeight;
|
|
566
566
|
for (let s = 0; s < r; s++) {
|
|
567
|
-
const l = Math.min(Math.round(s * n / i), this.sourceDepthHeight - 1) * n,
|
|
568
|
-
for (let
|
|
569
|
-
const f = Math.min(Math.round(
|
|
570
|
-
e[
|
|
567
|
+
const l = Math.min(Math.round(s * n / i), this.sourceDepthHeight - 1) * n, c = s * i;
|
|
568
|
+
for (let u = 0; u < i; u++) {
|
|
569
|
+
const f = Math.min(Math.round(u * n / i), n - 1);
|
|
570
|
+
e[c + u] = t[l + f];
|
|
571
571
|
}
|
|
572
572
|
}
|
|
573
573
|
return e;
|
|
@@ -586,11 +586,11 @@ class pt {
|
|
|
586
586
|
const { width: n, height: i } = this.getViewportSize(), r = n / i, s = t + e;
|
|
587
587
|
let a = 1, l = 1;
|
|
588
588
|
r > this.videoAspect ? l = this.videoAspect / r : a = r / this.videoAspect;
|
|
589
|
-
const
|
|
590
|
-
a /=
|
|
589
|
+
const c = 1 + s * 2;
|
|
590
|
+
a /= c, l /= c, this.uvOffset = [(1 - a) / 2, (1 - l) / 2], this.uvScale = [a, l], this.isCameraSource && (this.uvOffset[0] += this.uvScale[0], this.uvScale[0] = -this.uvScale[0]);
|
|
591
591
|
}
|
|
592
592
|
}
|
|
593
|
-
const
|
|
593
|
+
const pe = `#version 300 es
|
|
594
594
|
in vec2 aPosition;
|
|
595
595
|
|
|
596
596
|
// UV coordinates for cover-fit + overscan.
|
|
@@ -611,7 +611,7 @@ void main() {
|
|
|
611
611
|
vScreenUv = baseUv;
|
|
612
612
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
613
613
|
}
|
|
614
|
-
`,
|
|
614
|
+
`, ge = `#version 300 es
|
|
615
615
|
in vec2 aPosition;
|
|
616
616
|
out vec2 vUv;
|
|
617
617
|
|
|
@@ -619,7 +619,7 @@ void main() {
|
|
|
619
619
|
vUv = aPosition * 0.5 + 0.5;
|
|
620
620
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
621
621
|
}
|
|
622
|
-
`,
|
|
622
|
+
`, ve = `#version 300 es
|
|
623
623
|
precision highp float;
|
|
624
624
|
|
|
625
625
|
// BILATERAL_RADIUS is injected as a #define at compile time.
|
|
@@ -657,7 +657,7 @@ void main() {
|
|
|
657
657
|
|
|
658
658
|
fragColor = vec4(totalDepth / totalWeight, 0.0, 0.0, 1.0);
|
|
659
659
|
}
|
|
660
|
-
`,
|
|
660
|
+
`, xe = `#version 300 es
|
|
661
661
|
precision highp float;
|
|
662
662
|
|
|
663
663
|
// ---- Uniforms ----
|
|
@@ -1068,20 +1068,20 @@ void main() {
|
|
|
1068
1068
|
tiltHalfTanFov: Math.tan(50 * Math.PI / 360),
|
|
1069
1069
|
tiltTransitionWidth: 0.3 * 4.5,
|
|
1070
1070
|
tiltPeakIntensity: 0.8
|
|
1071
|
-
},
|
|
1071
|
+
}, Te = ["uRawDepth", "uTexelSize", "uSpatialSigma2"], Ee = {
|
|
1072
1072
|
2: 2.25,
|
|
1073
1073
|
// 1.5²
|
|
1074
1074
|
1: 0.5625
|
|
1075
1075
|
// 0.75²
|
|
1076
1076
|
};
|
|
1077
|
-
function
|
|
1078
|
-
const e =
|
|
1077
|
+
function be(o, t) {
|
|
1078
|
+
const e = ve.replace(
|
|
1079
1079
|
"#version 300 es",
|
|
1080
1080
|
`#version 300 es
|
|
1081
1081
|
#define BILATERAL_RADIUS ${t}`
|
|
1082
|
-
), n = Q(o, o.VERTEX_SHADER,
|
|
1082
|
+
), n = Q(o, o.VERTEX_SHADER, ge), i = Q(o, o.FRAGMENT_SHADER, e), r = wt(o, n, i), s = At(o, r, Te), a = Ee[t] ?? 2.25;
|
|
1083
1083
|
let l = null;
|
|
1084
|
-
const
|
|
1084
|
+
const c = {
|
|
1085
1085
|
name: "bilateral-filter",
|
|
1086
1086
|
program: r,
|
|
1087
1087
|
uniforms: s,
|
|
@@ -1089,37 +1089,37 @@ function Se(o, t) {
|
|
|
1089
1089
|
outputs: [],
|
|
1090
1090
|
width: 0,
|
|
1091
1091
|
height: 0,
|
|
1092
|
-
resize(
|
|
1092
|
+
resize(u, f, h) {
|
|
1093
1093
|
},
|
|
1094
|
-
initFBO(
|
|
1095
|
-
l &&
|
|
1096
|
-
|
|
1097
|
-
|
|
1098
|
-
|
|
1094
|
+
initFBO(u, f, h, x) {
|
|
1095
|
+
l && u.deleteFramebuffer(l), c.width = h, c.height = x, l = u.createFramebuffer(), c.fbo = l, u.bindFramebuffer(u.FRAMEBUFFER, l), u.framebufferTexture2D(
|
|
1096
|
+
u.FRAMEBUFFER,
|
|
1097
|
+
u.COLOR_ATTACHMENT0,
|
|
1098
|
+
u.TEXTURE_2D,
|
|
1099
1099
|
f,
|
|
1100
1100
|
0
|
|
1101
|
-
),
|
|
1101
|
+
), u.bindFramebuffer(u.FRAMEBUFFER, null), u.useProgram(r), u.uniform1i(s.uRawDepth, 2), u.uniform2f(s.uTexelSize, 1 / h, 1 / x), u.uniform1f(s.uSpatialSigma2, a);
|
|
1102
1102
|
},
|
|
1103
|
-
execute(
|
|
1104
|
-
l && (
|
|
1105
|
-
|
|
1103
|
+
execute(u, f, h, x, g, d, y, E) {
|
|
1104
|
+
l && (u.activeTexture(u.TEXTURE2), u.bindTexture(u.TEXTURE_2D, h), u.texSubImage2D(
|
|
1105
|
+
u.TEXTURE_2D,
|
|
1106
1106
|
0,
|
|
1107
1107
|
0,
|
|
1108
1108
|
0,
|
|
1109
|
-
|
|
1110
|
-
|
|
1111
|
-
|
|
1112
|
-
|
|
1113
|
-
|
|
1114
|
-
),
|
|
1109
|
+
g,
|
|
1110
|
+
d,
|
|
1111
|
+
u.RED,
|
|
1112
|
+
u.UNSIGNED_BYTE,
|
|
1113
|
+
x
|
|
1114
|
+
), u.bindFramebuffer(u.FRAMEBUFFER, l), u.viewport(0, 0, g, d), u.useProgram(r), u.bindVertexArray(f), u.drawArrays(u.TRIANGLE_STRIP, 0, 4), u.bindFramebuffer(u.FRAMEBUFFER, null), u.viewport(0, 0, y, E));
|
|
1115
1115
|
},
|
|
1116
|
-
dispose(
|
|
1117
|
-
l && (
|
|
1116
|
+
dispose(u) {
|
|
1117
|
+
l && (u.deleteFramebuffer(l), l = null, c.fbo = null), u.deleteProgram(r);
|
|
1118
1118
|
}
|
|
1119
1119
|
};
|
|
1120
|
-
return
|
|
1120
|
+
return c;
|
|
1121
1121
|
}
|
|
1122
|
-
const
|
|
1122
|
+
const ye = [
|
|
1123
1123
|
"uImage",
|
|
1124
1124
|
"uDepth",
|
|
1125
1125
|
"uOffset",
|
|
@@ -1157,19 +1157,19 @@ const Ae = [
|
|
|
1157
1157
|
"uTiltPeakIntensity",
|
|
1158
1158
|
"uTiltPlaneNormal",
|
|
1159
1159
|
"uTiltPlaneD"
|
|
1160
|
-
],
|
|
1161
|
-
function
|
|
1162
|
-
const t =
|
|
1160
|
+
], Se = 64;
|
|
1161
|
+
function we(o) {
|
|
1162
|
+
const t = xe.replace(
|
|
1163
1163
|
"#version 300 es",
|
|
1164
1164
|
`#version 300 es
|
|
1165
|
-
#define MAX_POM_STEPS ${
|
|
1166
|
-
), e = Q(o, o.VERTEX_SHADER,
|
|
1165
|
+
#define MAX_POM_STEPS ${Se}`
|
|
1166
|
+
), e = Q(o, o.VERTEX_SHADER, pe), n = Q(o, o.FRAGMENT_SHADER, t), i = wt(o, e, n), r = At(o, i, ye);
|
|
1167
1167
|
return {
|
|
1168
1168
|
name: "depth-effect",
|
|
1169
1169
|
program: i,
|
|
1170
1170
|
uniforms: r,
|
|
1171
|
-
setStaticUniforms(s, a, l,
|
|
1172
|
-
s.useProgram(i), s.uniform1i(r.uImage, 0), s.uniform1i(r.uDepth, 1), s.uniform1f(r.uStrength, a.parallaxStrength), s.uniform1i(r.uPomEnabled, a.pomEnabled ? 1 : 0), s.uniform1i(r.uPomSteps, a.pomSteps), s.uniform1f(r.uContrastLow, a.contrastLow), s.uniform1f(r.uContrastHigh, a.contrastHigh), s.uniform1f(r.uVerticalReduction, a.verticalReduction), s.uniform1f(r.uDofStart, a.dofStart), s.uniform1f(r.uDofStrength, a.dofStrength), s.uniform2f(r.uImageTexelSize, 1 / l, 1 /
|
|
1171
|
+
setStaticUniforms(s, a, l, c) {
|
|
1172
|
+
s.useProgram(i), s.uniform1i(r.uImage, 0), s.uniform1i(r.uDepth, 1), s.uniform1f(r.uStrength, a.parallaxStrength), s.uniform1i(r.uPomEnabled, a.pomEnabled ? 1 : 0), s.uniform1i(r.uPomSteps, a.pomSteps), s.uniform1f(r.uContrastLow, a.contrastLow), s.uniform1f(r.uContrastHigh, a.contrastHigh), s.uniform1f(r.uVerticalReduction, a.verticalReduction), s.uniform1f(r.uDofStart, a.dofStart), s.uniform1f(r.uDofStrength, a.dofStrength), s.uniform2f(r.uImageTexelSize, 1 / l, 1 / c), s.uniform1i(r.uDisplacementCurve, 3), s.uniform1i(r.uBlurCurve, 4), s.uniform1i(r.uCurvesEnabled, 0), s.uniform1f(r.uBlurRadius, a.blurRadius), s.uniform1f(r.uFocalBandOffset, 0), s.uniform1i(r.uGlowCurve, 5), s.uniform1i(r.uGlowEnabled, 0), s.uniform3f(r.uGlowColor, a.glowColor[0], a.glowColor[1], a.glowColor[2]), s.uniform1f(r.uGlowRadius, a.glowRadius), s.uniform1f(r.uGlowSoftness, a.glowSoftness), s.uniform1i(r.uColorShiftCurve, 6), s.uniform1i(r.uColorShiftEnabled, 0), s.uniform1f(r.uColorShiftHue, 0), s.uniform1f(r.uColorShiftSaturation, 1), s.uniform1f(r.uColorShiftBrightness, 1), s.uniform1f(r.uColorShiftTintStrength, 0), s.uniform3f(r.uColorShiftTintColor, 0.7, 0.8, 0.9), s.uniform1i(r.uTiltEnabled, a.tiltEnabled ? 1 : 0), s.uniform1f(r.uTiltHalfTanFov, a.tiltHalfTanFov), s.uniform1f(r.uTiltTransitionWidth, a.tiltTransitionWidth), s.uniform1f(r.uTiltPeakIntensity, a.tiltPeakIntensity), s.uniform3f(r.uTiltPlaneNormal, 0, 0, 1), s.uniform1f(r.uTiltPlaneD, 2.75);
|
|
1173
1173
|
},
|
|
1174
1174
|
updateUvTransform(s, a, l) {
|
|
1175
1175
|
s.useProgram(i), s.uniform2f(r.uUvOffset, a[0], a[1]), s.uniform2f(r.uUvScale, l[0], l[1]);
|
|
@@ -1179,7 +1179,7 @@ function Re(o) {
|
|
|
1179
1179
|
}
|
|
1180
1180
|
};
|
|
1181
1181
|
}
|
|
1182
|
-
class
|
|
1182
|
+
class Ae extends mt {
|
|
1183
1183
|
// ---- Shared GPU resources ----
|
|
1184
1184
|
gl = null;
|
|
1185
1185
|
quadVao = null;
|
|
@@ -1187,7 +1187,7 @@ class De extends pt {
|
|
|
1187
1187
|
bilateralPass = null;
|
|
1188
1188
|
effectPass = null;
|
|
1189
1189
|
// ---- Texture registry (init-time allocation, zero per-frame overhead) ----
|
|
1190
|
-
textures = new
|
|
1190
|
+
textures = new kt();
|
|
1191
1191
|
videoSlot;
|
|
1192
1192
|
filteredDepthSlot;
|
|
1193
1193
|
rawDepthSlot;
|
|
@@ -1271,7 +1271,7 @@ class De extends pt {
|
|
|
1271
1271
|
updateCurveLUTs(t, e, n, i, r) {
|
|
1272
1272
|
const s = this.gl;
|
|
1273
1273
|
if (!s || !this.effectPass) return;
|
|
1274
|
-
const a = !!(t || e), l = !!n,
|
|
1274
|
+
const a = !!(t || e), l = !!n, c = !!i;
|
|
1275
1275
|
if (t && this.uploadLUT(this.displacementLutSlot, t), e && this.uploadLUT(this.blurLutSlot, e), n && this.uploadLUT(this.glowLutSlot, n), i && this.uploadLUT(this.colorShiftLutSlot, i), s.useProgram(this.effectPass.program), s.uniform1i(
|
|
1276
1276
|
this.effectPass.uniforms.uCurvesEnabled,
|
|
1277
1277
|
a ? 1 : 0
|
|
@@ -1280,11 +1280,11 @@ class De extends pt {
|
|
|
1280
1280
|
l ? 1 : 0
|
|
1281
1281
|
), s.uniform1i(
|
|
1282
1282
|
this.effectPass.uniforms.uColorShiftEnabled,
|
|
1283
|
-
|
|
1284
|
-
),
|
|
1285
|
-
const
|
|
1286
|
-
s.uniform1f(
|
|
1287
|
-
|
|
1283
|
+
c ? 1 : 0
|
|
1284
|
+
), c && r) {
|
|
1285
|
+
const u = this.effectPass.uniforms;
|
|
1286
|
+
s.uniform1f(u.uColorShiftHue, r.hueShift * (Math.PI / 180)), s.uniform1f(u.uColorShiftSaturation, r.saturation), s.uniform1f(u.uColorShiftBrightness, r.brightness), s.uniform1f(u.uColorShiftTintStrength, r.tintStrength), s.uniform3f(
|
|
1287
|
+
u.uColorShiftTintColor,
|
|
1288
1288
|
r.tintColor[0],
|
|
1289
1289
|
r.tintColor[1],
|
|
1290
1290
|
r.tintColor[2]
|
|
@@ -1302,7 +1302,7 @@ class De extends pt {
|
|
|
1302
1302
|
*/
|
|
1303
1303
|
initGPUResources() {
|
|
1304
1304
|
const t = this.gl;
|
|
1305
|
-
t && (this.bilateralPass =
|
|
1305
|
+
t && (this.bilateralPass = be(t, this.qualityParams.bilateralRadius), this.effectPass = we(t), this.quadVao = Ot(t, this.effectPass.program), t.disable(t.DEPTH_TEST));
|
|
1306
1306
|
}
|
|
1307
1307
|
// -----------------------------------------------------------------------
|
|
1308
1308
|
// Curve LUT texture management
|
|
@@ -1406,15 +1406,15 @@ class De extends pt {
|
|
|
1406
1406
|
t && (this.bilateralPass && (this.bilateralPass.dispose(t), this.bilateralPass = null), this.effectPass && (this.effectPass.dispose(t), this.effectPass = null), this.quadVao && (t.deleteVertexArray(this.quadVao), this.quadVao = null));
|
|
1407
1407
|
}
|
|
1408
1408
|
}
|
|
1409
|
-
async function
|
|
1409
|
+
async function ct(o, t = {}) {
|
|
1410
1410
|
const {
|
|
1411
1411
|
parent: e = document.body,
|
|
1412
1412
|
loop: n = !0,
|
|
1413
1413
|
muted: i = !0
|
|
1414
1414
|
} = t, r = document.createElement("video");
|
|
1415
|
-
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 = o, e.appendChild(r), await
|
|
1415
|
+
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 = o, e.appendChild(r), await Ht(r), new Re(r);
|
|
1416
1416
|
}
|
|
1417
|
-
class
|
|
1417
|
+
class Re {
|
|
1418
1418
|
constructor(t) {
|
|
1419
1419
|
this.video = t;
|
|
1420
1420
|
}
|
|
@@ -1460,7 +1460,7 @@ class Pe {
|
|
|
1460
1460
|
this.video.pause(), this.video.removeAttribute("src"), this.video.load(), this.video.remove();
|
|
1461
1461
|
}
|
|
1462
1462
|
}
|
|
1463
|
-
async function
|
|
1463
|
+
async function ht(o, t = {}) {
|
|
1464
1464
|
const e = new Image();
|
|
1465
1465
|
return e.crossOrigin = "anonymous", e.src = o, await new Promise((n, i) => {
|
|
1466
1466
|
if (e.complete && e.naturalWidth > 0) {
|
|
@@ -1468,9 +1468,9 @@ async function dt(o, t = {}) {
|
|
|
1468
1468
|
return;
|
|
1469
1469
|
}
|
|
1470
1470
|
e.addEventListener("load", () => n(), { once: !0 }), e.addEventListener("error", () => i(new Error(`Failed to load image: ${o}`)), { once: !0 });
|
|
1471
|
-
}), new
|
|
1471
|
+
}), new De(e);
|
|
1472
1472
|
}
|
|
1473
|
-
class
|
|
1473
|
+
class De {
|
|
1474
1474
|
constructor(t) {
|
|
1475
1475
|
this.img = t;
|
|
1476
1476
|
}
|
|
@@ -1492,11 +1492,11 @@ class Fe {
|
|
|
1492
1492
|
this.img.removeAttribute("src");
|
|
1493
1493
|
}
|
|
1494
1494
|
}
|
|
1495
|
-
async function
|
|
1495
|
+
async function Nt(o = { video: !0 }, t = {}) {
|
|
1496
1496
|
const { parent: e = document.body } = t, n = await navigator.mediaDevices.getUserMedia(o), i = document.createElement("video");
|
|
1497
|
-
return i.playsInline = !0, i.setAttribute("playsinline", ""), i.muted = !0, i.defaultMuted = !0, i.style.display = "none", i.srcObject = n, e.appendChild(i), await
|
|
1497
|
+
return i.playsInline = !0, i.setAttribute("playsinline", ""), i.muted = !0, i.defaultMuted = !0, i.style.display = "none", i.srcObject = n, e.appendChild(i), await Ht(i), await i.play(), new Pe(i, n);
|
|
1498
1498
|
}
|
|
1499
|
-
class
|
|
1499
|
+
class Pe {
|
|
1500
1500
|
constructor(t, e) {
|
|
1501
1501
|
this.video = t, this.stream = e;
|
|
1502
1502
|
}
|
|
@@ -1542,7 +1542,7 @@ class Ce {
|
|
|
1542
1542
|
t.stop();
|
|
1543
1543
|
}
|
|
1544
1544
|
}
|
|
1545
|
-
async function
|
|
1545
|
+
async function Ht(o) {
|
|
1546
1546
|
o.readyState >= HTMLMediaElement.HAVE_METADATA || await new Promise((t, e) => {
|
|
1547
1547
|
const n = () => {
|
|
1548
1548
|
r(), t();
|
|
@@ -1554,11 +1554,11 @@ async function Wt(o) {
|
|
|
1554
1554
|
o.addEventListener("loadedmetadata", n), o.addEventListener("error", i), o.load();
|
|
1555
1555
|
});
|
|
1556
1556
|
}
|
|
1557
|
-
const
|
|
1558
|
-
async function
|
|
1557
|
+
const gt = [0.485, 0.456, 0.406], vt = [0.229, 0.224, 0.225], Y = 518;
|
|
1558
|
+
async function Fe() {
|
|
1559
1559
|
return await import("onnxruntime-web/webgpu");
|
|
1560
1560
|
}
|
|
1561
|
-
class
|
|
1561
|
+
class Ce {
|
|
1562
1562
|
constructor(t, e) {
|
|
1563
1563
|
this.depthWidth = t, this.depthHeight = e;
|
|
1564
1564
|
const n = t * e;
|
|
@@ -1595,13 +1595,13 @@ class Ue {
|
|
|
1595
1595
|
* (GPU-accelerated on main thread), falls back to WASM EP.
|
|
1596
1596
|
*/
|
|
1597
1597
|
async init(t, e) {
|
|
1598
|
-
const n = await
|
|
1599
|
-
if (this.ort = n, this.captureCanvas = document.createElement("canvas"), this.captureCanvas.width =
|
|
1598
|
+
const n = await Fe();
|
|
1599
|
+
if (this.ort = n, this.captureCanvas = document.createElement("canvas"), this.captureCanvas.width = Y, this.captureCanvas.height = Y, this.captureCtx = this.captureCanvas.getContext("2d", {
|
|
1600
1600
|
willReadFrequently: !0
|
|
1601
1601
|
}), !this.captureCtx)
|
|
1602
1602
|
throw new Error("[DepthEstimator] Failed to create 2D canvas context.");
|
|
1603
1603
|
e?.({ receivedBytes: 0, totalBytes: null, fraction: 0, label: "Downloading depth model…" });
|
|
1604
|
-
const i = await
|
|
1604
|
+
const i = await Ue(t, e);
|
|
1605
1605
|
e?.({ receivedBytes: i.byteLength, totalBytes: i.byteLength, fraction: 1, label: "Initialising depth model…" });
|
|
1606
1606
|
let r;
|
|
1607
1607
|
try {
|
|
@@ -1663,18 +1663,18 @@ class Ue {
|
|
|
1663
1663
|
t,
|
|
1664
1664
|
0,
|
|
1665
1665
|
0,
|
|
1666
|
-
|
|
1667
|
-
|
|
1666
|
+
Y,
|
|
1667
|
+
Y
|
|
1668
1668
|
);
|
|
1669
1669
|
const e = this.captureCtx.getImageData(
|
|
1670
1670
|
0,
|
|
1671
1671
|
0,
|
|
1672
|
-
|
|
1673
|
-
|
|
1674
|
-
), n = this.preprocess(e), r = (await this.session.run({ [this.inputName]: n }))[this.outputName], s = r.data, a = r.dims, l = a.length === 3 ? a[1] : a[2],
|
|
1675
|
-
this.postProcess(s,
|
|
1676
|
-
const
|
|
1677
|
-
this.frontBuffer = this.backBuffer, this.backBuffer =
|
|
1672
|
+
Y,
|
|
1673
|
+
Y
|
|
1674
|
+
), n = this.preprocess(e), r = (await this.session.run({ [this.inputName]: n }))[this.outputName], s = r.data, a = r.dims, l = a.length === 3 ? a[1] : a[2], c = a.length === 3 ? a[2] : a[3];
|
|
1675
|
+
this.postProcess(s, c, l);
|
|
1676
|
+
const u = this.frontBuffer;
|
|
1677
|
+
this.frontBuffer = this.backBuffer, this.backBuffer = u;
|
|
1678
1678
|
} catch (e) {
|
|
1679
1679
|
console.error("[DepthEstimator] Inference failed:", e);
|
|
1680
1680
|
} finally {
|
|
@@ -1688,7 +1688,7 @@ class Ue {
|
|
|
1688
1688
|
const { data: e, width: n, height: i } = t, r = n * i, s = new Float32Array(3 * r);
|
|
1689
1689
|
for (let a = 0; a < r; a++) {
|
|
1690
1690
|
const l = a * 4;
|
|
1691
|
-
s[a] = (e[l] / 255 -
|
|
1691
|
+
s[a] = (e[l] / 255 - gt[0]) / vt[0], s[r + a] = (e[l + 1] / 255 - gt[1]) / vt[1], s[2 * r + a] = (e[l + 2] / 255 - gt[2]) / vt[2];
|
|
1692
1692
|
}
|
|
1693
1693
|
return new this.ort.Tensor("float32", s, [1, 3, i, n]);
|
|
1694
1694
|
}
|
|
@@ -1705,22 +1705,22 @@ class Ue {
|
|
|
1705
1705
|
const { depthWidth: i, depthHeight: r } = this;
|
|
1706
1706
|
let s = 1 / 0, a = -1 / 0;
|
|
1707
1707
|
for (let f = 0; f < t.length; f++) {
|
|
1708
|
-
const
|
|
1709
|
-
|
|
1708
|
+
const h = t[f];
|
|
1709
|
+
h < s && (s = h), h > a && (a = h);
|
|
1710
1710
|
}
|
|
1711
|
-
const l = a - s || 1,
|
|
1711
|
+
const l = a - s || 1, c = e / i, u = n / r;
|
|
1712
1712
|
for (let f = 0; f < r; f++)
|
|
1713
|
-
for (let
|
|
1714
|
-
const
|
|
1715
|
-
this.backBuffer[f * i +
|
|
1713
|
+
for (let h = 0; h < i; h++) {
|
|
1714
|
+
const x = h * c, g = f * u, d = Math.floor(x), y = Math.floor(g), E = Math.min(d + 1, e - 1), b = Math.min(y + 1, n - 1), p = x - d, v = g - y, m = t[y * e + d], T = t[y * e + E], w = t[b * e + d], A = t[b * e + E], P = (m * (1 - p) * (1 - v) + T * p * (1 - v) + w * (1 - p) * v + A * p * v - s) / l;
|
|
1715
|
+
this.backBuffer[f * i + h] = P * 255 + 0.5 | 0;
|
|
1716
1716
|
}
|
|
1717
1717
|
}
|
|
1718
1718
|
}
|
|
1719
|
-
async function
|
|
1720
|
-
const i = new
|
|
1719
|
+
async function ft(o, t, e, n) {
|
|
1720
|
+
const i = new Ce(t, e);
|
|
1721
1721
|
return await i.init(o, n), i;
|
|
1722
1722
|
}
|
|
1723
|
-
async function
|
|
1723
|
+
async function Ue(o, t) {
|
|
1724
1724
|
const e = await fetch(o);
|
|
1725
1725
|
if (!e.ok)
|
|
1726
1726
|
throw new Error(`[DepthEstimator] Failed to fetch model (${e.status} ${e.statusText}).`);
|
|
@@ -1738,27 +1738,27 @@ async function _e(o, t) {
|
|
|
1738
1738
|
let a = 0;
|
|
1739
1739
|
const l = r.getReader();
|
|
1740
1740
|
for (; ; ) {
|
|
1741
|
-
const { done: f, value:
|
|
1741
|
+
const { done: f, value: h } = await l.read();
|
|
1742
1742
|
if (f) break;
|
|
1743
|
-
|
|
1743
|
+
h && (s.push(h), a += h.byteLength, t?.({
|
|
1744
1744
|
receivedBytes: a,
|
|
1745
1745
|
totalBytes: i,
|
|
1746
1746
|
fraction: i ? Math.min(a / i, 1) : 0,
|
|
1747
1747
|
label: "Downloading depth model…"
|
|
1748
1748
|
}));
|
|
1749
1749
|
}
|
|
1750
|
-
const
|
|
1751
|
-
let
|
|
1750
|
+
const c = new Uint8Array(a);
|
|
1751
|
+
let u = 0;
|
|
1752
1752
|
for (const f of s)
|
|
1753
|
-
|
|
1754
|
-
return
|
|
1753
|
+
c.set(f, u), u += f.byteLength;
|
|
1754
|
+
return c.buffer;
|
|
1755
1755
|
}
|
|
1756
|
-
const
|
|
1756
|
+
const Ft = {
|
|
1757
1757
|
sensitivityX: 0.4,
|
|
1758
1758
|
sensitivityY: 1,
|
|
1759
1759
|
lerpFactor: 0.08
|
|
1760
1760
|
};
|
|
1761
|
-
function
|
|
1761
|
+
function bt(o, t) {
|
|
1762
1762
|
const e = o.points;
|
|
1763
1763
|
if (e.length === 0) return 0;
|
|
1764
1764
|
if (e.length === 1 || t <= e[0].x) return e[0].y;
|
|
@@ -1783,24 +1783,24 @@ function at(o, t = 256) {
|
|
|
1783
1783
|
const e = new Uint8Array(t);
|
|
1784
1784
|
for (let n = 0; n < t; n++) {
|
|
1785
1785
|
const i = n / (t - 1);
|
|
1786
|
-
e[n] = Math.round(
|
|
1786
|
+
e[n] = Math.round(bt(o, i) * 255);
|
|
1787
1787
|
}
|
|
1788
1788
|
return e;
|
|
1789
1789
|
}
|
|
1790
|
-
function
|
|
1790
|
+
function W(o, t) {
|
|
1791
1791
|
return o.find((e) => e.channel === t && e.enabled);
|
|
1792
1792
|
}
|
|
1793
|
-
function
|
|
1794
|
-
const e =
|
|
1793
|
+
function Ct(o, t) {
|
|
1794
|
+
const e = W(o, "displacement"), n = W(o, "blur"), i = W(o, "glow"), r = e?.params;
|
|
1795
1795
|
let s = 0.6, a = 0;
|
|
1796
1796
|
if (n) {
|
|
1797
1797
|
const l = n.curve;
|
|
1798
|
-
for (let
|
|
1799
|
-
if (
|
|
1800
|
-
s =
|
|
1798
|
+
for (let c = 0; c <= 1; c += 0.01)
|
|
1799
|
+
if (bt(l, c) > 0.01) {
|
|
1800
|
+
s = c;
|
|
1801
1801
|
break;
|
|
1802
1802
|
}
|
|
1803
|
-
a =
|
|
1803
|
+
a = bt(l, 1);
|
|
1804
1804
|
}
|
|
1805
1805
|
return {
|
|
1806
1806
|
parallaxStrength: r?.strength ?? 0.05,
|
|
@@ -1821,8 +1821,8 @@ function Ut(o, t) {
|
|
|
1821
1821
|
tiltPeakIntensity: n?.params?.peakIntensity ?? 0.8
|
|
1822
1822
|
};
|
|
1823
1823
|
}
|
|
1824
|
-
function
|
|
1825
|
-
const t =
|
|
1824
|
+
function Ut(o) {
|
|
1825
|
+
const t = W(o, "displacement"), e = W(o, "blur"), n = W(o, "glow"), i = W(o, "color-shift"), r = i?.params;
|
|
1826
1826
|
return {
|
|
1827
1827
|
displacementLUT: t ? at(t.curve) : null,
|
|
1828
1828
|
blurLUT: e ? at(e.curve) : null,
|
|
@@ -1837,7 +1837,7 @@ function _t(o) {
|
|
|
1837
1837
|
} : null
|
|
1838
1838
|
};
|
|
1839
1839
|
}
|
|
1840
|
-
class
|
|
1840
|
+
class Gt {
|
|
1841
1841
|
abortController = null;
|
|
1842
1842
|
initialized = !1;
|
|
1843
1843
|
initializing = !1;
|
|
@@ -1887,7 +1887,7 @@ class zt {
|
|
|
1887
1887
|
this.abortController?.abort(), this.abortController = null, this.initializing = !1;
|
|
1888
1888
|
}
|
|
1889
1889
|
}
|
|
1890
|
-
const
|
|
1890
|
+
const G = {
|
|
1891
1891
|
parallaxX: 0.4,
|
|
1892
1892
|
parallaxY: 1,
|
|
1893
1893
|
parallaxMax: 30,
|
|
@@ -1895,68 +1895,8 @@ const X = {
|
|
|
1895
1895
|
autoplay: !0,
|
|
1896
1896
|
loop: !0,
|
|
1897
1897
|
muted: !0
|
|
1898
|
-
},
|
|
1899
|
-
|
|
1900
|
-
constructor(t, e = 0.08, n = 0.06) {
|
|
1901
|
-
this.host = t, this.lerpFactor = e, this.motionLerpFactor = n, this.host.addEventListener("mousemove", this.handleMouseMove), this.host.addEventListener("mouseleave", this.resetPointerTarget), this.host.addEventListener("touchstart", this.handleTouchStart, { passive: !0 }), this.host.addEventListener("touchmove", this.handleTouchMove, { passive: !0 }), this.host.addEventListener("touchend", this.handleTouchEnd, { passive: !0 }), this.host.addEventListener("touchcancel", this.handleTouchEnd, { passive: !0 });
|
|
1902
|
-
}
|
|
1903
|
-
pointerTarget = { x: 0, y: 0 };
|
|
1904
|
-
motionTarget = { x: 0, y: 0 };
|
|
1905
|
-
smoothedOutput = { x: 0, y: 0 };
|
|
1906
|
-
usingMotionInput = !1;
|
|
1907
|
-
motionListenerAttached = !1;
|
|
1908
|
-
motionRequested = !1;
|
|
1909
|
-
touchActive = !1;
|
|
1910
|
-
touchAnchorX = 0;
|
|
1911
|
-
touchAnchorY = 0;
|
|
1912
|
-
lerpFactor;
|
|
1913
|
-
motionLerpFactor;
|
|
1914
|
-
/** Pixels of finger drag to reach full parallax offset (-1 or 1). */
|
|
1915
|
-
static TOUCH_DRAG_RANGE = 100;
|
|
1916
|
-
update() {
|
|
1917
|
-
const t = this.touchActive ? this.pointerTarget : this.usingMotionInput ? this.motionTarget : this.pointerTarget, e = this.usingMotionInput && !this.touchActive ? this.motionLerpFactor : this.lerpFactor;
|
|
1918
|
-
return this.smoothedOutput.x = lt(this.smoothedOutput.x, t.x, e), this.smoothedOutput.y = lt(this.smoothedOutput.y, t.y, e), this.smoothedOutput;
|
|
1919
|
-
}
|
|
1920
|
-
dispose() {
|
|
1921
|
-
this.host.removeEventListener("mousemove", this.handleMouseMove), this.host.removeEventListener("mouseleave", this.resetPointerTarget), this.host.removeEventListener("touchstart", this.handleTouchStart), this.host.removeEventListener("touchmove", this.handleTouchMove), this.host.removeEventListener("touchend", this.handleTouchEnd), this.host.removeEventListener("touchcancel", this.handleTouchEnd), this.motionListenerAttached && (window.removeEventListener("deviceorientation", this.handleDeviceOrientation), this.motionListenerAttached = !1);
|
|
1922
|
-
}
|
|
1923
|
-
handleMouseMove = (t) => {
|
|
1924
|
-
const e = this.host.getBoundingClientRect(), n = (t.clientX - e.left) / e.width * 2 - 1, i = (t.clientY - e.top) / e.height * 2 - 1;
|
|
1925
|
-
this.pointerTarget.x = j(n, -1, 1), this.pointerTarget.y = j(i, -1, 1);
|
|
1926
|
-
};
|
|
1927
|
-
resetPointerTarget = () => {
|
|
1928
|
-
this.pointerTarget.x = 0, this.pointerTarget.y = 0;
|
|
1929
|
-
};
|
|
1930
|
-
handleTouchStart = (t) => {
|
|
1931
|
-
const e = t.touches[0];
|
|
1932
|
-
e && (this.touchActive = !0, this.touchAnchorX = e.clientX, this.touchAnchorY = e.clientY, this.pointerTarget.x = 0, this.pointerTarget.y = 0, this.motionRequested || (this.motionRequested = !0, this.requestMotionPermission()));
|
|
1933
|
-
};
|
|
1934
|
-
handleTouchMove = (t) => {
|
|
1935
|
-
const e = t.touches[0];
|
|
1936
|
-
if (!e) return;
|
|
1937
|
-
const n = e.clientX - this.touchAnchorX, i = e.clientY - this.touchAnchorY, r = qt.TOUCH_DRAG_RANGE;
|
|
1938
|
-
this.pointerTarget.x = j(n / r, -1, 1), this.pointerTarget.y = j(i / r, -1, 1);
|
|
1939
|
-
};
|
|
1940
|
-
handleTouchEnd = () => {
|
|
1941
|
-
this.touchActive = !1, this.pointerTarget.x = 0, this.pointerTarget.y = 0;
|
|
1942
|
-
};
|
|
1943
|
-
async requestMotionPermission() {
|
|
1944
|
-
if (typeof DeviceOrientationEvent > "u") return;
|
|
1945
|
-
const t = DeviceOrientationEvent;
|
|
1946
|
-
if (typeof t.requestPermission == "function")
|
|
1947
|
-
try {
|
|
1948
|
-
if (await t.requestPermission() !== "granted") return;
|
|
1949
|
-
} catch {
|
|
1950
|
-
return;
|
|
1951
|
-
}
|
|
1952
|
-
this.motionListenerAttached || (window.addEventListener("deviceorientation", this.handleDeviceOrientation), this.motionListenerAttached = !0), this.usingMotionInput = !0;
|
|
1953
|
-
}
|
|
1954
|
-
handleDeviceOrientation = (t) => {
|
|
1955
|
-
const e = j((t.gamma ?? 0) / 45, -1, 1), n = j((t.beta ?? 0) / 45, -1, 1);
|
|
1956
|
-
this.motionTarget.x = lt(this.motionTarget.x, e, this.motionLerpFactor), this.motionTarget.y = lt(this.motionTarget.y, n, this.motionLerpFactor);
|
|
1957
|
-
};
|
|
1958
|
-
};
|
|
1959
|
-
class Tt extends HTMLElement {
|
|
1898
|
+
}, j = 512, Z = 512;
|
|
1899
|
+
class xt extends HTMLElement {
|
|
1960
1900
|
static TAG_NAME = "layershift-effect";
|
|
1961
1901
|
static get observedAttributes() {
|
|
1962
1902
|
return [
|
|
@@ -1987,7 +1927,7 @@ class Tt extends HTMLElement {
|
|
|
1987
1927
|
shadow;
|
|
1988
1928
|
container = null;
|
|
1989
1929
|
renderer = null;
|
|
1990
|
-
|
|
1930
|
+
_input = { x: 0, y: 0 };
|
|
1991
1931
|
source = null;
|
|
1992
1932
|
depthEstimator = null;
|
|
1993
1933
|
loopCount = 0;
|
|
@@ -1999,7 +1939,14 @@ class Tt extends HTMLElement {
|
|
|
1999
1939
|
*/
|
|
2000
1940
|
depthFallback = null;
|
|
2001
1941
|
constructor() {
|
|
2002
|
-
super(), this.shadow = this.attachShadow({ mode: "open" }), this.lifecycle = new
|
|
1942
|
+
super(), this.shadow = this.attachShadow({ mode: "open" }), this.lifecycle = new Gt(this);
|
|
1943
|
+
}
|
|
1944
|
+
/** The current input offset. Set this externally to drive the effect. */
|
|
1945
|
+
get input() {
|
|
1946
|
+
return { x: this._input.x, y: this._input.y };
|
|
1947
|
+
}
|
|
1948
|
+
set input(t) {
|
|
1949
|
+
this._input.x = t.x, this._input.y = t.y;
|
|
2003
1950
|
}
|
|
2004
1951
|
// --- Attribute helpers ---
|
|
2005
1952
|
getAttrFloat(t, e) {
|
|
@@ -2014,16 +1961,16 @@ class Tt extends HTMLElement {
|
|
|
2014
1961
|
return !(n === "false" || n === "0");
|
|
2015
1962
|
}
|
|
2016
1963
|
get parallaxX() {
|
|
2017
|
-
return this.getAttrFloat("parallax-x",
|
|
1964
|
+
return this.getAttrFloat("parallax-x", G.parallaxX);
|
|
2018
1965
|
}
|
|
2019
1966
|
get parallaxY() {
|
|
2020
|
-
return this.getAttrFloat("parallax-y",
|
|
1967
|
+
return this.getAttrFloat("parallax-y", G.parallaxY);
|
|
2021
1968
|
}
|
|
2022
1969
|
get parallaxMax() {
|
|
2023
|
-
return this.getAttrFloat("parallax-max",
|
|
1970
|
+
return this.getAttrFloat("parallax-max", G.parallaxMax);
|
|
2024
1971
|
}
|
|
2025
1972
|
get overscan() {
|
|
2026
|
-
return this.getAttrFloat("overscan",
|
|
1973
|
+
return this.getAttrFloat("overscan", G.overscan);
|
|
2027
1974
|
}
|
|
2028
1975
|
get quality() {
|
|
2029
1976
|
const t = this.getAttribute("quality");
|
|
@@ -2041,13 +1988,13 @@ class Tt extends HTMLElement {
|
|
|
2041
1988
|
return this.getAttribute("depth-model");
|
|
2042
1989
|
}
|
|
2043
1990
|
get shouldAutoplay() {
|
|
2044
|
-
return this.getAttrBool("autoplay",
|
|
1991
|
+
return this.getAttrBool("autoplay", G.autoplay);
|
|
2045
1992
|
}
|
|
2046
1993
|
get shouldLoop() {
|
|
2047
|
-
return this.getAttrBool("loop",
|
|
1994
|
+
return this.getAttrBool("loop", G.loop);
|
|
2048
1995
|
}
|
|
2049
1996
|
get shouldMute() {
|
|
2050
|
-
return this.getAttrBool("muted",
|
|
1997
|
+
return this.getAttrBool("muted", G.muted);
|
|
2051
1998
|
}
|
|
2052
1999
|
// --- Event dispatching ---
|
|
2053
2000
|
/**
|
|
@@ -2134,7 +2081,7 @@ class Tt extends HTMLElement {
|
|
|
2134
2081
|
const i = await n.json();
|
|
2135
2082
|
return {
|
|
2136
2083
|
channels: i.channels ?? [],
|
|
2137
|
-
motion: i.motion ??
|
|
2084
|
+
motion: i.motion ?? Ft,
|
|
2138
2085
|
overscanPadding: i.overscanPadding ?? 0.05,
|
|
2139
2086
|
quality: i.quality ?? "auto"
|
|
2140
2087
|
};
|
|
@@ -2170,7 +2117,7 @@ class Tt extends HTMLElement {
|
|
|
2170
2117
|
this.emit("layershift-effect:model-progress", m);
|
|
2171
2118
|
};
|
|
2172
2119
|
if (e) {
|
|
2173
|
-
if (i = await
|
|
2120
|
+
if (i = await Nt(
|
|
2174
2121
|
{ video: { facingMode: "user" } },
|
|
2175
2122
|
{ parent: this.shadow }
|
|
2176
2123
|
), t.aborted) {
|
|
@@ -2178,91 +2125,91 @@ class Tt extends HTMLElement {
|
|
|
2178
2125
|
return;
|
|
2179
2126
|
}
|
|
2180
2127
|
if (n) {
|
|
2181
|
-
if (s = await
|
|
2128
|
+
if (s = await ft(n, j, Z, a), t.aborted) {
|
|
2182
2129
|
s.dispose(), i.dispose();
|
|
2183
2130
|
return;
|
|
2184
2131
|
}
|
|
2185
|
-
r =
|
|
2132
|
+
r = N(j, Z);
|
|
2186
2133
|
} else
|
|
2187
|
-
r =
|
|
2134
|
+
r = N(i.width, i.height);
|
|
2188
2135
|
} else {
|
|
2189
|
-
const m = this.getAttribute("src"),
|
|
2190
|
-
if (
|
|
2191
|
-
const [
|
|
2192
|
-
|
|
2136
|
+
const m = this.getAttribute("src"), T = this.getAttribute("depth-src"), w = this.getAttribute("depth-meta"), A = !!T && !!w, D = this.sourceType === "image" || /\.(jpe?g|png|webp|gif|avif|bmp)(\?|$)/i.test(m);
|
|
2137
|
+
if (A) {
|
|
2138
|
+
const [P, _] = await Promise.all([
|
|
2139
|
+
D ? ht(m) : ct(m, {
|
|
2193
2140
|
parent: this.shadow,
|
|
2194
2141
|
loop: this.shouldLoop,
|
|
2195
2142
|
muted: this.shouldMute
|
|
2196
2143
|
}),
|
|
2197
|
-
|
|
2144
|
+
Vt(T, w)
|
|
2198
2145
|
]);
|
|
2199
2146
|
if (t.aborted) {
|
|
2200
|
-
|
|
2147
|
+
P.dispose();
|
|
2201
2148
|
return;
|
|
2202
2149
|
}
|
|
2203
|
-
i =
|
|
2150
|
+
i = P, r = _;
|
|
2204
2151
|
} else if (n) {
|
|
2205
|
-
const [
|
|
2206
|
-
|
|
2152
|
+
const [P, _] = await Promise.all([
|
|
2153
|
+
D ? ht(m) : ct(m, {
|
|
2207
2154
|
parent: this.shadow,
|
|
2208
2155
|
loop: this.shouldLoop,
|
|
2209
2156
|
muted: this.shouldMute
|
|
2210
2157
|
}),
|
|
2211
|
-
|
|
2158
|
+
ft(n, j, Z, a)
|
|
2212
2159
|
]);
|
|
2213
2160
|
if (t.aborted) {
|
|
2214
|
-
|
|
2161
|
+
P.dispose(), _.dispose();
|
|
2215
2162
|
return;
|
|
2216
2163
|
}
|
|
2217
|
-
if (i =
|
|
2218
|
-
const
|
|
2219
|
-
if (
|
|
2220
|
-
const
|
|
2164
|
+
if (i = P, s = _, D || !i.isLive) {
|
|
2165
|
+
const I = i.getImageSource();
|
|
2166
|
+
if (I) {
|
|
2167
|
+
const C = await s.submitFrameAndWait(I);
|
|
2221
2168
|
r = {
|
|
2222
|
-
meta: { frameCount: 1, fps: 1, width:
|
|
2223
|
-
frames: [
|
|
2169
|
+
meta: { frameCount: 1, fps: 1, width: j, height: Z, sourceFps: 1 },
|
|
2170
|
+
frames: [C]
|
|
2224
2171
|
};
|
|
2225
2172
|
} else
|
|
2226
|
-
r =
|
|
2173
|
+
r = N(j, Z);
|
|
2227
2174
|
} else
|
|
2228
|
-
r =
|
|
2175
|
+
r = N(j, Z);
|
|
2229
2176
|
} else
|
|
2230
2177
|
throw new Error("Either depth-src/depth-meta or depth-model must be provided.");
|
|
2231
2178
|
}
|
|
2232
2179
|
this.source = i, this.depthEstimator = s, this.loopCount = 0, this.attachSourceEventListeners(i);
|
|
2233
|
-
const l =
|
|
2180
|
+
const l = oe(
|
|
2234
2181
|
r.frames,
|
|
2235
2182
|
r.meta.width,
|
|
2236
2183
|
r.meta.height
|
|
2237
|
-
),
|
|
2184
|
+
), c = se(l);
|
|
2238
2185
|
this.depthFallback = {
|
|
2239
|
-
contrastLow:
|
|
2240
|
-
contrastHigh:
|
|
2241
|
-
verticalReduction:
|
|
2186
|
+
contrastLow: c.contrastLow,
|
|
2187
|
+
contrastHigh: c.contrastHigh,
|
|
2188
|
+
verticalReduction: c.verticalReduction
|
|
2242
2189
|
};
|
|
2243
|
-
let
|
|
2190
|
+
let u;
|
|
2244
2191
|
if (s)
|
|
2245
|
-
|
|
2192
|
+
u = () => s.getLatestDepth();
|
|
2246
2193
|
else {
|
|
2247
|
-
const m = new
|
|
2248
|
-
|
|
2194
|
+
const m = new Bt(r);
|
|
2195
|
+
u = (T) => m.sample(T);
|
|
2249
2196
|
}
|
|
2250
2197
|
if (t.aborted) return;
|
|
2251
|
-
let f,
|
|
2252
|
-
const
|
|
2198
|
+
let f, h = null, x = Ft;
|
|
2199
|
+
const g = await this.fetchFilterConfig(t);
|
|
2253
2200
|
if (t.aborted) return;
|
|
2254
|
-
if (
|
|
2255
|
-
const m =
|
|
2256
|
-
contrastLow:
|
|
2257
|
-
contrastHigh:
|
|
2258
|
-
verticalReduction:
|
|
2201
|
+
if (g && g.channels.length > 0) {
|
|
2202
|
+
const m = Ct(g.channels, {
|
|
2203
|
+
contrastLow: c.contrastLow,
|
|
2204
|
+
contrastHigh: c.contrastHigh,
|
|
2205
|
+
verticalReduction: c.verticalReduction
|
|
2259
2206
|
});
|
|
2260
2207
|
f = {
|
|
2261
2208
|
parallaxStrength: m.parallaxStrength,
|
|
2262
2209
|
pomEnabled: m.pomEnabled,
|
|
2263
2210
|
pomSteps: m.pomSteps,
|
|
2264
|
-
overscanPadding:
|
|
2265
|
-
quality:
|
|
2211
|
+
overscanPadding: g.overscanPadding,
|
|
2212
|
+
quality: g.quality,
|
|
2266
2213
|
contrastLow: m.contrastLow,
|
|
2267
2214
|
contrastHigh: m.contrastHigh,
|
|
2268
2215
|
verticalReduction: m.verticalReduction,
|
|
@@ -2276,45 +2223,41 @@ class Tt extends HTMLElement {
|
|
|
2276
2223
|
tiltHalfTanFov: m.tiltHalfTanFov,
|
|
2277
2224
|
tiltTransitionWidth: m.tiltTransitionWidth,
|
|
2278
2225
|
tiltPeakIntensity: m.tiltPeakIntensity
|
|
2279
|
-
},
|
|
2226
|
+
}, h = Ut(g.channels), x = g.motion;
|
|
2280
2227
|
} else
|
|
2281
|
-
f = this.buildLegacyConfig(
|
|
2282
|
-
this.renderer = new
|
|
2283
|
-
|
|
2284
|
-
|
|
2285
|
-
|
|
2286
|
-
|
|
2287
|
-
|
|
2288
|
-
)
|
|
2289
|
-
const
|
|
2228
|
+
f = this.buildLegacyConfig(c, i.width);
|
|
2229
|
+
this.renderer = new Ae(this.container, f), this.renderer.initialize(i, r.meta.width, r.meta.height), h && this.renderer.updateCurveLUTs(
|
|
2230
|
+
h.displacementLUT,
|
|
2231
|
+
h.blurLUT,
|
|
2232
|
+
h.glowLUT,
|
|
2233
|
+
h.colorShiftLUT,
|
|
2234
|
+
h.colorShiftParams ?? void 0
|
|
2235
|
+
);
|
|
2236
|
+
const d = x.tiltPlaneInput ?? !1, y = x.tiltPitchSensitivity ?? 0.35, E = x.tiltYawSensitivity ?? 0.15, p = g?.channels.find((m) => m.channel === "blur" && m.enabled)?.params?.focalCenter ?? 0.5, v = s;
|
|
2290
2237
|
if (this.renderer.start(
|
|
2291
2238
|
i,
|
|
2292
|
-
|
|
2239
|
+
u,
|
|
2293
2240
|
() => {
|
|
2294
|
-
|
|
2295
|
-
|
|
2296
|
-
|
|
2297
|
-
const F = m.y * P * y, U = m.x * p * d, _ = Math.cos(F), R = Math.sin(F), D = Math.cos(U), M = Math.sin(U) * _, V = -R, I = D * _, N = 0.5 + b * (5 - 0.5);
|
|
2241
|
+
const m = this._input;
|
|
2242
|
+
if (d) {
|
|
2243
|
+
const A = m.y * y, D = m.x * E, P = Math.cos(A), _ = Math.sin(A), I = Math.cos(D), S = Math.sin(D) * P, F = -_, U = I * P, M = 0.5 + p * (5 - 0.5);
|
|
2298
2244
|
return {
|
|
2299
|
-
x: m.x *
|
|
2300
|
-
y: m.y *
|
|
2301
|
-
tiltPlaneNormal: [
|
|
2302
|
-
tiltPlaneD:
|
|
2245
|
+
x: m.x * 0.3,
|
|
2246
|
+
y: m.y * 0.3,
|
|
2247
|
+
tiltPlaneNormal: [S, F, U],
|
|
2248
|
+
tiltPlaneD: U * M
|
|
2303
2249
|
};
|
|
2304
2250
|
}
|
|
2305
|
-
return {
|
|
2306
|
-
x: m.x * p,
|
|
2307
|
-
y: m.y * P
|
|
2308
|
-
};
|
|
2251
|
+
return { x: m.x, y: m.y };
|
|
2309
2252
|
},
|
|
2310
|
-
(m,
|
|
2311
|
-
if (
|
|
2253
|
+
(m, T) => {
|
|
2254
|
+
if (v) {
|
|
2312
2255
|
const w = i.getImageSource();
|
|
2313
|
-
w &&
|
|
2256
|
+
w && v.submitFrame(w);
|
|
2314
2257
|
}
|
|
2315
2258
|
this.emit("layershift-effect:frame", {
|
|
2316
2259
|
currentTime: m,
|
|
2317
|
-
frameNumber:
|
|
2260
|
+
frameNumber: T
|
|
2318
2261
|
});
|
|
2319
2262
|
}
|
|
2320
2263
|
), !e && i.isLive && this.shouldAutoplay && i.play)
|
|
@@ -2328,7 +2271,8 @@ class Tt extends HTMLElement {
|
|
|
2328
2271
|
videoHeight: i.height,
|
|
2329
2272
|
duration: i.duration,
|
|
2330
2273
|
depthProfile: l,
|
|
2331
|
-
derivedParams:
|
|
2274
|
+
derivedParams: c,
|
|
2275
|
+
motionConfig: x
|
|
2332
2276
|
});
|
|
2333
2277
|
} catch (i) {
|
|
2334
2278
|
const r = i instanceof Error ? i.message : "Failed to initialize.";
|
|
@@ -2351,9 +2295,9 @@ class Tt extends HTMLElement {
|
|
|
2351
2295
|
contrastLow: 0.05,
|
|
2352
2296
|
contrastHigh: 0.95,
|
|
2353
2297
|
verticalReduction: 0.5
|
|
2354
|
-
}, n =
|
|
2298
|
+
}, n = Ct(t, e);
|
|
2355
2299
|
this.renderer.updateConfig(n);
|
|
2356
|
-
const i =
|
|
2300
|
+
const i = Ut(t);
|
|
2357
2301
|
this.renderer.updateCurveLUTs(
|
|
2358
2302
|
i.displacementLUT,
|
|
2359
2303
|
i.blurLUT,
|
|
@@ -2364,16 +2308,10 @@ class Tt extends HTMLElement {
|
|
|
2364
2308
|
}
|
|
2365
2309
|
// --- Cleanup ---
|
|
2366
2310
|
doDispose() {
|
|
2367
|
-
this.renderer?.dispose(), this.renderer = null, this.
|
|
2311
|
+
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;
|
|
2368
2312
|
}
|
|
2369
2313
|
}
|
|
2370
|
-
|
|
2371
|
-
return Math.min(e, Math.max(t, o));
|
|
2372
|
-
}
|
|
2373
|
-
function lt(o, t, e) {
|
|
2374
|
-
return o + (t - o) * e;
|
|
2375
|
-
}
|
|
2376
|
-
class Dt {
|
|
2314
|
+
class Rt {
|
|
2377
2315
|
gl;
|
|
2378
2316
|
hasColorBufferFloat;
|
|
2379
2317
|
// FBO / texture resources
|
|
@@ -2423,9 +2361,9 @@ class Dt {
|
|
|
2423
2361
|
this.dispose();
|
|
2424
2362
|
const r = Math.max(1, Math.round(t / n)), s = Math.max(1, Math.round(e / n));
|
|
2425
2363
|
this._width = r, this._height = s;
|
|
2426
|
-
const a = (
|
|
2427
|
-
const
|
|
2428
|
-
return i.bindFramebuffer(i.FRAMEBUFFER,
|
|
2364
|
+
const a = (c, u, f, h) => {
|
|
2365
|
+
const x = i.createFramebuffer();
|
|
2366
|
+
return i.bindFramebuffer(i.FRAMEBUFFER, x), i.bindTexture(i.TEXTURE_2D, c), i.texStorage2D(i.TEXTURE_2D, 1, u, f, h), 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, c, 0), i.bindFramebuffer(i.FRAMEBUFFER, null), x;
|
|
2429
2367
|
};
|
|
2430
2368
|
this.maskTex = i.createTexture(), this.maskFbo = a(this.maskTex, i.R8, r, s);
|
|
2431
2369
|
const l = this.hasColorBufferFloat ? i.RG16F : i.RGBA8;
|
|
@@ -2448,14 +2386,14 @@ class Dt {
|
|
|
2448
2386
|
const n = this._width, i = this._height;
|
|
2449
2387
|
if (n === 0 || i === 0) return;
|
|
2450
2388
|
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);
|
|
2451
|
-
const r =
|
|
2389
|
+
const r = Rt.computeFloodIterations(n, i);
|
|
2452
2390
|
e.useProgram(t.floodPass.program);
|
|
2453
2391
|
let s = this.pingTex, a = this.pongFbo, l = this.pongTex;
|
|
2454
|
-
for (let
|
|
2455
|
-
const
|
|
2456
|
-
e.bindFramebuffer(e.FRAMEBUFFER, a), e.activeTexture(e.TEXTURE5), e.bindTexture(e.TEXTURE_2D, s), e.uniform1i(t.floodPass.uniforms.uSeedTex, 5), e.uniform1f(t.floodPass.uniforms.uStepSize,
|
|
2457
|
-
const f = s,
|
|
2458
|
-
s = l, a =
|
|
2392
|
+
for (let c = 0; c < r.length; c++) {
|
|
2393
|
+
const u = r[c] / Math.max(n, i);
|
|
2394
|
+
e.bindFramebuffer(e.FRAMEBUFFER, a), e.activeTexture(e.TEXTURE5), e.bindTexture(e.TEXTURE_2D, s), e.uniform1i(t.floodPass.uniforms.uSeedTex, 5), e.uniform1f(t.floodPass.uniforms.uStepSize, u), e.bindVertexArray(t.quadVao), e.drawArrays(e.TRIANGLE_STRIP, 0, 4);
|
|
2395
|
+
const f = s, h = a;
|
|
2396
|
+
s = l, a = h === this.pongFbo ? this.pingFbo : this.pongFbo, l = f;
|
|
2459
2397
|
}
|
|
2460
2398
|
e.bindFramebuffer(e.FRAMEBUFFER, this.distFbo), e.clearColor(0, 0, 0, 1), e.clear(e.COLOR_BUFFER_BIT), e.useProgram(t.distPass.program), e.activeTexture(e.TEXTURE5), e.bindTexture(e.TEXTURE_2D, s), e.uniform1i(t.distPass.uniforms.uSeedTex, 5), e.activeTexture(e.TEXTURE6), e.bindTexture(e.TEXTURE_2D, this.maskTex), e.uniform1i(t.distPass.uniforms.uMask, 6), e.uniform1f(t.distPass.uniforms.uBevelWidth, t.distRange), e.bindVertexArray(t.quadVao), e.drawArrays(e.TRIANGLE_STRIP, 0, 4), e.activeTexture(e.TEXTURE4), e.bindTexture(e.TEXTURE_2D, this.distTex), e.bindFramebuffer(e.FRAMEBUFFER, null), this._dirty = !1;
|
|
2461
2399
|
}
|
|
@@ -2481,34 +2419,34 @@ class Dt {
|
|
|
2481
2419
|
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;
|
|
2482
2420
|
}
|
|
2483
2421
|
}
|
|
2484
|
-
const
|
|
2422
|
+
const Le = `#version 300 es
|
|
2485
2423
|
in vec2 aPosition;
|
|
2486
2424
|
uniform vec2 uMeshScale;
|
|
2487
2425
|
void main() {
|
|
2488
2426
|
gl_Position = vec4(aPosition * uMeshScale, 0.0, 1.0);
|
|
2489
2427
|
}
|
|
2490
|
-
`,
|
|
2428
|
+
`, _e = `#version 300 es
|
|
2491
2429
|
precision lowp float;
|
|
2492
2430
|
out vec4 fragColor;
|
|
2493
2431
|
void main() { fragColor = vec4(0.0); }
|
|
2494
|
-
`,
|
|
2432
|
+
`, Ie = `#version 300 es
|
|
2495
2433
|
in vec2 aPosition;
|
|
2496
2434
|
uniform vec2 uMeshScale;
|
|
2497
2435
|
void main() {
|
|
2498
2436
|
gl_Position = vec4(aPosition * uMeshScale, 0.0, 1.0);
|
|
2499
2437
|
}
|
|
2500
|
-
`,
|
|
2438
|
+
`, Me = `#version 300 es
|
|
2501
2439
|
precision lowp float;
|
|
2502
2440
|
out vec4 fragColor;
|
|
2503
2441
|
void main() { fragColor = vec4(1.0); }
|
|
2504
|
-
`,
|
|
2442
|
+
`, Be = `#version 300 es
|
|
2505
2443
|
in vec2 aPosition;
|
|
2506
2444
|
out vec2 vUv;
|
|
2507
2445
|
void main() {
|
|
2508
2446
|
vUv = aPosition * 0.5 + 0.5;
|
|
2509
2447
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
2510
2448
|
}
|
|
2511
|
-
`,
|
|
2449
|
+
`, Ve = `#version 300 es
|
|
2512
2450
|
precision highp float;
|
|
2513
2451
|
uniform sampler2D uMask;
|
|
2514
2452
|
uniform vec2 uTexelSize;
|
|
@@ -2533,14 +2471,14 @@ void main() {
|
|
|
2533
2471
|
fragSeed = vec2(-1.0);
|
|
2534
2472
|
}
|
|
2535
2473
|
}
|
|
2536
|
-
`,
|
|
2474
|
+
`, Oe = `#version 300 es
|
|
2537
2475
|
in vec2 aPosition;
|
|
2538
2476
|
out vec2 vUv;
|
|
2539
2477
|
void main() {
|
|
2540
2478
|
vUv = aPosition * 0.5 + 0.5;
|
|
2541
2479
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
2542
2480
|
}
|
|
2543
|
-
`,
|
|
2481
|
+
`, ke = `#version 300 es
|
|
2544
2482
|
precision highp float;
|
|
2545
2483
|
uniform sampler2D uSeedTex;
|
|
2546
2484
|
uniform float uStepSize;
|
|
@@ -2569,14 +2507,14 @@ void main() {
|
|
|
2569
2507
|
|
|
2570
2508
|
fragSeed = bestSeed;
|
|
2571
2509
|
}
|
|
2572
|
-
`,
|
|
2510
|
+
`, Xe = `#version 300 es
|
|
2573
2511
|
in vec2 aPosition;
|
|
2574
2512
|
out vec2 vUv;
|
|
2575
2513
|
void main() {
|
|
2576
2514
|
vUv = aPosition * 0.5 + 0.5;
|
|
2577
2515
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
2578
2516
|
}
|
|
2579
|
-
`,
|
|
2517
|
+
`, Ne = `#version 300 es
|
|
2580
2518
|
precision highp float;
|
|
2581
2519
|
uniform sampler2D uSeedTex;
|
|
2582
2520
|
uniform sampler2D uMask;
|
|
@@ -2601,7 +2539,7 @@ void main() {
|
|
|
2601
2539
|
float normalized = clamp(d / max(uBevelWidth, 0.001), 0.0, 1.0);
|
|
2602
2540
|
fragDist = vec4(normalized, 0.0, 0.0, 1.0);
|
|
2603
2541
|
}
|
|
2604
|
-
`,
|
|
2542
|
+
`, He = `#version 300 es
|
|
2605
2543
|
in vec2 aPosition;
|
|
2606
2544
|
uniform vec2 uUvOffset;
|
|
2607
2545
|
uniform vec2 uUvScale;
|
|
@@ -2613,7 +2551,7 @@ void main() {
|
|
|
2613
2551
|
vScreenUv = baseUv;
|
|
2614
2552
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
2615
2553
|
}
|
|
2616
|
-
`,
|
|
2554
|
+
`, Ge = `#version 300 es
|
|
2617
2555
|
precision highp float;
|
|
2618
2556
|
|
|
2619
2557
|
#define MAX_POM_STEPS 32
|
|
@@ -2744,14 +2682,14 @@ void main() {
|
|
|
2744
2682
|
// Write lens-transformed depth to second attachment for boundary effects
|
|
2745
2683
|
fragDepth = vec4(lensD, 0.0, 0.0, 1.0);
|
|
2746
2684
|
}
|
|
2747
|
-
`,
|
|
2685
|
+
`, We = `#version 300 es
|
|
2748
2686
|
in vec2 aPosition;
|
|
2749
2687
|
out vec2 vUv;
|
|
2750
2688
|
void main() {
|
|
2751
2689
|
vUv = aPosition * 0.5 + 0.5;
|
|
2752
2690
|
gl_Position = vec4(aPosition, 0.0, 1.0);
|
|
2753
2691
|
}
|
|
2754
|
-
`,
|
|
2692
|
+
`, ze = `#version 300 es
|
|
2755
2693
|
precision highp float;
|
|
2756
2694
|
uniform sampler2D uInteriorColor;
|
|
2757
2695
|
uniform sampler2D uDistField;
|
|
@@ -2781,7 +2719,7 @@ void main() {
|
|
|
2781
2719
|
|
|
2782
2720
|
fragColor = vec4(toSRGB(linear), color.a);
|
|
2783
2721
|
}
|
|
2784
|
-
`,
|
|
2722
|
+
`, qe = `#version 300 es
|
|
2785
2723
|
in vec2 aPosition;
|
|
2786
2724
|
in vec2 aNormal;
|
|
2787
2725
|
uniform float uRimWidth;
|
|
@@ -2804,7 +2742,7 @@ void main() {
|
|
|
2804
2742
|
|
|
2805
2743
|
gl_Position = vec4(pos, 0.0, 1.0);
|
|
2806
2744
|
}
|
|
2807
|
-
`,
|
|
2745
|
+
`, Ye = `#version 300 es
|
|
2808
2746
|
precision highp float;
|
|
2809
2747
|
|
|
2810
2748
|
uniform sampler2D uInteriorColor;
|
|
@@ -2906,7 +2844,7 @@ void main() {
|
|
|
2906
2844
|
|
|
2907
2845
|
fragColor = vec4(color * alpha, alpha);
|
|
2908
2846
|
}
|
|
2909
|
-
`,
|
|
2847
|
+
`, je = `#version 300 es
|
|
2910
2848
|
in vec2 aPosition;
|
|
2911
2849
|
in vec3 aNormal3;
|
|
2912
2850
|
in float aLerpT; // 0 = inner (at silhouette), 1 = outer edge
|
|
@@ -2922,7 +2860,7 @@ void main() {
|
|
|
2922
2860
|
vLerpT = aLerpT;
|
|
2923
2861
|
gl_Position = vec4(sp, 0.0, 1.0);
|
|
2924
2862
|
}
|
|
2925
|
-
`,
|
|
2863
|
+
`, Ze = `#version 300 es
|
|
2926
2864
|
precision highp float;
|
|
2927
2865
|
uniform vec3 uLightDir3;
|
|
2928
2866
|
uniform vec3 uChamferColor;
|
|
@@ -2990,38 +2928,38 @@ void main() {
|
|
|
2990
2928
|
fragColor = vec4(toSRGB(lit), 1.0);
|
|
2991
2929
|
}
|
|
2992
2930
|
`;
|
|
2993
|
-
function
|
|
2931
|
+
function $e(o) {
|
|
2994
2932
|
const t = [];
|
|
2995
2933
|
let e = 0;
|
|
2996
2934
|
for (let n = 0; n < o.length - 2; n += 2) {
|
|
2997
|
-
const i = o[n], r = o[n + 1], s = o[n + 2], a = o[n + 3], l = s - i,
|
|
2998
|
-
if (
|
|
2999
|
-
const f = -
|
|
2935
|
+
const i = o[n], r = o[n + 1], s = o[n + 2], a = o[n + 3], l = s - i, c = a - r, u = Math.sqrt(l * l + c * c);
|
|
2936
|
+
if (u < 1e-6) continue;
|
|
2937
|
+
const f = -c / u, h = l / u;
|
|
3000
2938
|
t.push(
|
|
3001
2939
|
i,
|
|
3002
2940
|
r,
|
|
3003
2941
|
f,
|
|
3004
|
-
|
|
2942
|
+
h,
|
|
3005
2943
|
i,
|
|
3006
2944
|
r,
|
|
3007
2945
|
-f,
|
|
3008
|
-
-
|
|
2946
|
+
-h,
|
|
3009
2947
|
s,
|
|
3010
2948
|
a,
|
|
3011
2949
|
f,
|
|
3012
|
-
|
|
2950
|
+
h,
|
|
3013
2951
|
s,
|
|
3014
2952
|
a,
|
|
3015
2953
|
f,
|
|
3016
|
-
|
|
2954
|
+
h,
|
|
3017
2955
|
i,
|
|
3018
2956
|
r,
|
|
3019
2957
|
-f,
|
|
3020
|
-
-
|
|
2958
|
+
-h,
|
|
3021
2959
|
s,
|
|
3022
2960
|
a,
|
|
3023
2961
|
-f,
|
|
3024
|
-
-
|
|
2962
|
+
-h
|
|
3025
2963
|
), e += 6;
|
|
3026
2964
|
}
|
|
3027
2965
|
return {
|
|
@@ -3029,43 +2967,43 @@ function Qe(o) {
|
|
|
3029
2967
|
count: e
|
|
3030
2968
|
};
|
|
3031
2969
|
}
|
|
3032
|
-
function
|
|
2970
|
+
function Ke(o, t, e, n, i) {
|
|
3033
2971
|
if (n <= 0)
|
|
3034
2972
|
return { vertices: new Float32Array(0), count: 0 };
|
|
3035
2973
|
const r = i * Math.PI / 180, s = -Math.cos(r), a = Math.sin(r), l = [];
|
|
3036
|
-
let
|
|
3037
|
-
for (let
|
|
3038
|
-
const f = t[
|
|
3039
|
-
if (
|
|
3040
|
-
const
|
|
3041
|
-
let
|
|
3042
|
-
for (let T = 0; T <
|
|
3043
|
-
const
|
|
3044
|
-
|
|
2974
|
+
let c = 0;
|
|
2975
|
+
for (let u = 0; u < t.length; u++) {
|
|
2976
|
+
const f = t[u], g = ((u + 1 < t.length ? t[u + 1] : o.length) - f) / 2;
|
|
2977
|
+
if (g < 3) continue;
|
|
2978
|
+
const d = g - 1;
|
|
2979
|
+
let y = 0;
|
|
2980
|
+
for (let T = 0; T < d; T++) {
|
|
2981
|
+
const w = f + T * 2, A = o[w], D = o[w + 1], P = o[w + 2], _ = o[w + 3];
|
|
2982
|
+
y += A * _ - P * D;
|
|
3045
2983
|
}
|
|
3046
|
-
const
|
|
3047
|
-
for (let T = 0; T <
|
|
3048
|
-
const
|
|
3049
|
-
|
|
2984
|
+
const E = y >= 0 ? 1 : -1, b = [], p = [];
|
|
2985
|
+
for (let T = 0; T < d; T++) {
|
|
2986
|
+
const w = f + T * 2, A = o[w + 2] - o[w], D = o[w + 3] - o[w + 1], P = Math.sqrt(A * A + D * D);
|
|
2987
|
+
P < 1e-8 ? (b.push(T > 0 ? b[T - 1] : 0), p.push(T > 0 ? p[T - 1] : 0)) : (b.push(-D / P * E), p.push(A / P * E));
|
|
3050
2988
|
}
|
|
3051
|
-
const
|
|
3052
|
-
for (let T = 0; T <
|
|
3053
|
-
const
|
|
3054
|
-
let
|
|
3055
|
-
const
|
|
3056
|
-
|
|
2989
|
+
const v = [], m = [];
|
|
2990
|
+
for (let T = 0; T < d; T++) {
|
|
2991
|
+
const w = (T - 1 + d) % d;
|
|
2992
|
+
let A = b[w] + b[T], D = p[w] + p[T];
|
|
2993
|
+
const P = Math.sqrt(A * A + D * D);
|
|
2994
|
+
P > 1e-8 ? (A /= P, D /= P) : (A = b[T], D = p[T]), v.push(A), m.push(D);
|
|
3057
2995
|
}
|
|
3058
|
-
for (let T = 0; T <
|
|
3059
|
-
const
|
|
3060
|
-
l.push(
|
|
2996
|
+
for (let T = 0; T < d; T++) {
|
|
2997
|
+
const w = T, A = (T + 1) % d, D = f + T * 2, P = f + (T + 1) % d * 2, _ = o[D], I = o[D + 1], C = o[P], S = o[P + 1], F = v[w] * a, U = m[w] * a, M = s, O = v[A] * a, q = m[A] * a, tt = s, st = _ + v[w] * n, Dt = I + m[w] * n, Kt = C + v[A] * n, Jt = S + m[A] * n;
|
|
2998
|
+
l.push(_, I, F, U, M, 0), l.push(st, Dt, F, U, M, 1), l.push(C, S, O, q, tt, 0), l.push(C, S, O, q, tt, 0), l.push(st, Dt, F, U, M, 1), l.push(Kt, Jt, O, q, tt, 1), c += 6;
|
|
3061
2999
|
}
|
|
3062
3000
|
}
|
|
3063
3001
|
return {
|
|
3064
3002
|
vertices: new Float32Array(l),
|
|
3065
|
-
count:
|
|
3003
|
+
count: c
|
|
3066
3004
|
};
|
|
3067
3005
|
}
|
|
3068
|
-
class
|
|
3006
|
+
class Je extends mt {
|
|
3069
3007
|
gl = null;
|
|
3070
3008
|
// Render passes (each owns its program + cached uniforms)
|
|
3071
3009
|
stencilPass = null;
|
|
@@ -3087,7 +3025,7 @@ class en extends pt {
|
|
|
3087
3025
|
chamferVao = null;
|
|
3088
3026
|
chamferVertexCount = 0;
|
|
3089
3027
|
// Source textures (via TextureRegistry — init-time allocation)
|
|
3090
|
-
textures = new
|
|
3028
|
+
textures = new kt();
|
|
3091
3029
|
videoSlot;
|
|
3092
3030
|
depthSlot;
|
|
3093
3031
|
// Interior FBO (units 2, 3)
|
|
@@ -3157,7 +3095,7 @@ class en extends pt {
|
|
|
3157
3095
|
uploadBoundaryMesh(t) {
|
|
3158
3096
|
const e = this.gl;
|
|
3159
3097
|
if (!e || !this.boundaryPass) return;
|
|
3160
|
-
const n =
|
|
3098
|
+
const n = $e(t.edgeVertices);
|
|
3161
3099
|
if (n.count === 0) return;
|
|
3162
3100
|
this.boundaryVao = e.createVertexArray(), e.bindVertexArray(this.boundaryVao);
|
|
3163
3101
|
const i = e.createBuffer();
|
|
@@ -3170,7 +3108,7 @@ class en extends pt {
|
|
|
3170
3108
|
uploadChamferMesh(t) {
|
|
3171
3109
|
const e = this.gl;
|
|
3172
3110
|
if (!e || !this.chamferPass || this.config.chamferWidth <= 0) return;
|
|
3173
|
-
const n =
|
|
3111
|
+
const n = Ke(
|
|
3174
3112
|
t.edgeVertices,
|
|
3175
3113
|
t.contourOffsets,
|
|
3176
3114
|
t.contourIsHole,
|
|
@@ -3207,7 +3145,7 @@ class en extends pt {
|
|
|
3207
3145
|
// -----------------------------------------------------------------------
|
|
3208
3146
|
createJFAResources(t, e) {
|
|
3209
3147
|
const n = this.gl;
|
|
3210
|
-
n && (this.jfa || (this.jfa = new
|
|
3148
|
+
n && (this.jfa || (this.jfa = new Rt(n, this.hasColorBufferFloat)), this.jfa.createResources(t, e, this.qualityParams.jfaDivisor));
|
|
3211
3149
|
}
|
|
3212
3150
|
computeDistanceField() {
|
|
3213
3151
|
!this.jfa || !this.maskPass || !this.jfaSeedPass || !this.jfaFloodPass || !this.jfaDistPass || !this.maskVao || !this.quadVao || this.jfa.compute({
|
|
@@ -3228,7 +3166,7 @@ class en extends pt {
|
|
|
3228
3166
|
// -----------------------------------------------------------------------
|
|
3229
3167
|
initGPUResources() {
|
|
3230
3168
|
const t = this.gl;
|
|
3231
|
-
t && (this.stencilPass =
|
|
3169
|
+
t && (this.stencilPass = k(t, "stencil", Le, _e, ["uMeshScale"]), this.maskPass = k(t, "mask", Ie, Me, ["uMeshScale"]), this.jfaSeedPass = k(t, "jfa-seed", Be, Ve, ["uMask", "uTexelSize"]), this.jfaFloodPass = k(t, "jfa-flood", Oe, ke, ["uSeedTex", "uStepSize"]), this.jfaDistPass = k(t, "jfa-dist", Xe, Ne, ["uSeedTex", "uMask", "uBevelWidth"]), this.interiorPass = k(t, "interior", He, Ge, [
|
|
3232
3170
|
"uImage",
|
|
3233
3171
|
"uDepth",
|
|
3234
3172
|
"uOffset",
|
|
@@ -3249,12 +3187,12 @@ class en extends pt {
|
|
|
3249
3187
|
"uBrightnessBias",
|
|
3250
3188
|
"uUvOffset",
|
|
3251
3189
|
"uUvScale"
|
|
3252
|
-
]), this.compositePass =
|
|
3190
|
+
]), this.compositePass = k(t, "composite", We, ze, [
|
|
3253
3191
|
"uInteriorColor",
|
|
3254
3192
|
"uDistField",
|
|
3255
3193
|
"uEdgeOcclusionWidth",
|
|
3256
3194
|
"uEdgeOcclusionStrength"
|
|
3257
|
-
]), this.boundaryPass =
|
|
3195
|
+
]), this.boundaryPass = k(t, "boundary", qe, Ye, [
|
|
3258
3196
|
"uInteriorColor",
|
|
3259
3197
|
"uInteriorDepth",
|
|
3260
3198
|
"uDistField",
|
|
@@ -3271,7 +3209,7 @@ class en extends pt {
|
|
|
3271
3209
|
"uEdgeColor",
|
|
3272
3210
|
"uLightDir",
|
|
3273
3211
|
"uBevelIntensity"
|
|
3274
|
-
]), this.chamferPass =
|
|
3212
|
+
]), this.chamferPass = k(t, "chamfer", je, Ze, [
|
|
3275
3213
|
"uMeshScale",
|
|
3276
3214
|
"uLightDir3",
|
|
3277
3215
|
"uChamferColor",
|
|
@@ -3280,7 +3218,7 @@ class en extends pt {
|
|
|
3280
3218
|
"uChamferShininess",
|
|
3281
3219
|
"uInteriorColor",
|
|
3282
3220
|
"uTexelSize"
|
|
3283
|
-
]), this.quadVao =
|
|
3221
|
+
]), this.quadVao = Ot(t, this.interiorPass.program), t.disable(t.DEPTH_TEST));
|
|
3284
3222
|
}
|
|
3285
3223
|
// -----------------------------------------------------------------------
|
|
3286
3224
|
// Abstract method implementations (RendererBase)
|
|
@@ -3336,10 +3274,10 @@ class en extends pt {
|
|
|
3336
3274
|
if (!t) return;
|
|
3337
3275
|
const { width: e, height: n } = this.getViewportSize(), i = Math.min(window.devicePixelRatio, this.qualityParams.dprCap), r = Math.round(e * i), s = Math.round(n * i);
|
|
3338
3276
|
(this.canvas.width !== r || this.canvas.height !== s) && (this.canvas.width = r, this.canvas.height = s, t.viewport(0, 0, r, s)), (this.fboWidth !== r || this.fboHeight !== s) && this.createFBO(r, s);
|
|
3339
|
-
const a = this.qualityParams.jfaDivisor, l = Math.max(1, Math.round(r / a)),
|
|
3340
|
-
(!this.jfa || this.jfa.width !== l || this.jfa.height !==
|
|
3341
|
-
const
|
|
3342
|
-
this.meshScaleX = f, this.meshScaleY = f,
|
|
3277
|
+
const a = this.qualityParams.jfaDivisor, l = Math.max(1, Math.round(r / a)), c = Math.max(1, Math.round(s / a));
|
|
3278
|
+
(!this.jfa || this.jfa.width !== l || this.jfa.height !== c) && this.createJFAResources(r, s), 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]));
|
|
3279
|
+
const u = e / n, f = 0.65;
|
|
3280
|
+
this.meshScaleX = f, this.meshScaleY = f, u > this.meshAspect ? this.meshScaleX = f * (this.meshAspect / u) : this.meshScaleY = f * (u / 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 / s)), this.chamferPass && (t.useProgram(this.chamferPass.program), t.uniform2f(this.chamferPass.uniforms.uMeshScale, this.meshScaleX, this.meshScaleY)), this.jfa && this.jfa.markDirty();
|
|
3343
3281
|
}
|
|
3344
3282
|
// -----------------------------------------------------------------------
|
|
3345
3283
|
// Context loss
|
|
@@ -3397,87 +3335,87 @@ class en extends pt {
|
|
|
3397
3335
|
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);
|
|
3398
3336
|
}
|
|
3399
3337
|
}
|
|
3400
|
-
async function
|
|
3338
|
+
async function Tt(o) {
|
|
3401
3339
|
const t = await fetch(o);
|
|
3402
3340
|
if (!t.ok)
|
|
3403
3341
|
throw new Error(`Failed to fetch SVG: ${t.status} ${t.statusText}`);
|
|
3404
3342
|
const e = await t.text();
|
|
3405
|
-
return
|
|
3343
|
+
return Qe(e);
|
|
3406
3344
|
}
|
|
3407
|
-
function
|
|
3345
|
+
function Qe(o) {
|
|
3408
3346
|
const n = new DOMParser().parseFromString(o, "image/svg+xml").querySelector("svg");
|
|
3409
3347
|
if (!n)
|
|
3410
3348
|
throw new Error("No <svg> element found in document.");
|
|
3411
|
-
const i =
|
|
3349
|
+
const i = tn(n);
|
|
3412
3350
|
if (i.length === 0)
|
|
3413
3351
|
throw new Error("No path data found in SVG.");
|
|
3414
3352
|
let r = 1 / 0, s = 1 / 0, a = -1 / 0, l = -1 / 0;
|
|
3415
|
-
for (const
|
|
3416
|
-
for (let
|
|
3417
|
-
r = Math.min(r,
|
|
3418
|
-
const
|
|
3419
|
-
const
|
|
3420
|
-
for (let
|
|
3421
|
-
|
|
3422
|
-
return
|
|
3423
|
-
}),
|
|
3424
|
-
for (const
|
|
3425
|
-
const { flatCoords:
|
|
3426
|
-
for (const
|
|
3427
|
-
|
|
3428
|
-
for (const
|
|
3429
|
-
|
|
3430
|
-
}
|
|
3431
|
-
const
|
|
3432
|
-
for (let
|
|
3433
|
-
const
|
|
3434
|
-
T.push(
|
|
3435
|
-
for (let
|
|
3436
|
-
|
|
3437
|
-
|
|
3438
|
-
}
|
|
3439
|
-
let
|
|
3440
|
-
for (let
|
|
3441
|
-
|
|
3353
|
+
for (const C of i)
|
|
3354
|
+
for (let S = 0; S < C.length; S += 2)
|
|
3355
|
+
r = Math.min(r, C[S]), a = Math.max(a, C[S]), s = Math.min(s, C[S + 1]), l = Math.max(l, C[S + 1]);
|
|
3356
|
+
const c = a - r, u = l - s, f = (r + a) / 2, h = (s + l) / 2, x = 2 / Math.max(c, u), g = c / u, d = i.map((C) => {
|
|
3357
|
+
const S = [];
|
|
3358
|
+
for (let F = 0; F < C.length; F += 2)
|
|
3359
|
+
S.push((C[F] - f) * x), S.push(-((C[F + 1] - h) * x));
|
|
3360
|
+
return S;
|
|
3361
|
+
}), y = un(d), E = [], b = [];
|
|
3362
|
+
for (const C of y) {
|
|
3363
|
+
const { flatCoords: S, holeIndices: F } = ln(C), U = cn(S, F), M = E.length / 2;
|
|
3364
|
+
for (const O of U)
|
|
3365
|
+
b.push(O + M);
|
|
3366
|
+
for (const O of S)
|
|
3367
|
+
E.push(O);
|
|
3368
|
+
}
|
|
3369
|
+
const p = E, v = b, m = [], T = [], w = [], A = Wt(d);
|
|
3370
|
+
for (let C = 0; C < d.length; C++) {
|
|
3371
|
+
const S = d[C];
|
|
3372
|
+
T.push(m.length), w.push(A[C]);
|
|
3373
|
+
for (let F = 0; F < S.length; F++)
|
|
3374
|
+
m.push(S[F]);
|
|
3375
|
+
S.length >= 2 && m.push(S[0], S[1]);
|
|
3376
|
+
}
|
|
3377
|
+
let D = 1 / 0, P = 1 / 0, _ = -1 / 0, I = -1 / 0;
|
|
3378
|
+
for (let C = 0; C < p.length; C += 2)
|
|
3379
|
+
D = Math.min(D, p[C]), _ = Math.max(_, p[C]), P = Math.min(P, p[C + 1]), I = Math.max(I, p[C + 1]);
|
|
3442
3380
|
return {
|
|
3443
|
-
vertices: new Float32Array(
|
|
3444
|
-
indices: new Uint16Array(
|
|
3445
|
-
edgeVertices: new Float32Array(
|
|
3381
|
+
vertices: new Float32Array(p),
|
|
3382
|
+
indices: new Uint16Array(v),
|
|
3383
|
+
edgeVertices: new Float32Array(m),
|
|
3446
3384
|
contourOffsets: T,
|
|
3447
|
-
contourIsHole:
|
|
3448
|
-
bounds: { minX:
|
|
3449
|
-
aspect:
|
|
3385
|
+
contourIsHole: w,
|
|
3386
|
+
bounds: { minX: D, maxX: _, minY: P, maxY: I },
|
|
3387
|
+
aspect: g
|
|
3450
3388
|
};
|
|
3451
3389
|
}
|
|
3452
|
-
function
|
|
3390
|
+
function tn(o) {
|
|
3453
3391
|
const t = [];
|
|
3454
3392
|
return o.querySelectorAll("path").forEach((l) => {
|
|
3455
|
-
const
|
|
3456
|
-
if (!
|
|
3457
|
-
const
|
|
3458
|
-
t.push(...
|
|
3393
|
+
const c = l.getAttribute("d");
|
|
3394
|
+
if (!c) return;
|
|
3395
|
+
const u = rn(c);
|
|
3396
|
+
t.push(...u);
|
|
3459
3397
|
}), o.querySelectorAll("polygon").forEach((l) => {
|
|
3460
|
-
const
|
|
3461
|
-
if (!
|
|
3462
|
-
const
|
|
3463
|
-
|
|
3398
|
+
const c = l.getAttribute("points");
|
|
3399
|
+
if (!c) return;
|
|
3400
|
+
const u = Lt(c);
|
|
3401
|
+
u.length >= 6 && t.push(u);
|
|
3464
3402
|
}), o.querySelectorAll("polyline").forEach((l) => {
|
|
3465
|
-
const
|
|
3466
|
-
if (!
|
|
3467
|
-
const
|
|
3468
|
-
|
|
3403
|
+
const c = l.getAttribute("points");
|
|
3404
|
+
if (!c) return;
|
|
3405
|
+
const u = Lt(c);
|
|
3406
|
+
u.length >= 6 && t.push(u);
|
|
3469
3407
|
}), o.querySelectorAll("rect").forEach((l) => {
|
|
3470
|
-
const
|
|
3471
|
-
f > 0 &&
|
|
3408
|
+
const c = parseFloat(l.getAttribute("x") || "0"), u = parseFloat(l.getAttribute("y") || "0"), f = parseFloat(l.getAttribute("width") || "0"), h = parseFloat(l.getAttribute("height") || "0");
|
|
3409
|
+
f > 0 && h > 0 && t.push([c, u, c + f, u, c + f, u + h, c, u + h]);
|
|
3472
3410
|
}), o.querySelectorAll("circle").forEach((l) => {
|
|
3473
|
-
const
|
|
3474
|
-
f > 0 && t.push(
|
|
3411
|
+
const c = parseFloat(l.getAttribute("cx") || "0"), u = parseFloat(l.getAttribute("cy") || "0"), f = parseFloat(l.getAttribute("r") || "0");
|
|
3412
|
+
f > 0 && t.push(en(c, u, f));
|
|
3475
3413
|
}), o.querySelectorAll("ellipse").forEach((l) => {
|
|
3476
|
-
const
|
|
3477
|
-
f > 0 &&
|
|
3414
|
+
const c = parseFloat(l.getAttribute("cx") || "0"), u = parseFloat(l.getAttribute("cy") || "0"), f = parseFloat(l.getAttribute("rx") || "0"), h = parseFloat(l.getAttribute("ry") || "0");
|
|
3415
|
+
f > 0 && h > 0 && t.push(nn(c, u, f, h));
|
|
3478
3416
|
}), t;
|
|
3479
3417
|
}
|
|
3480
|
-
function
|
|
3418
|
+
function Lt(o) {
|
|
3481
3419
|
const t = [], e = o.trim().split(/[\s,]+/);
|
|
3482
3420
|
for (let n = 0; n < e.length - 1; n += 2) {
|
|
3483
3421
|
const i = parseFloat(e[n]), r = parseFloat(e[n + 1]);
|
|
@@ -3485,7 +3423,7 @@ function Mt(o) {
|
|
|
3485
3423
|
}
|
|
3486
3424
|
return t;
|
|
3487
3425
|
}
|
|
3488
|
-
function
|
|
3426
|
+
function en(o, t, e, n = 64) {
|
|
3489
3427
|
const i = [];
|
|
3490
3428
|
for (let r = 0; r < n; r++) {
|
|
3491
3429
|
const s = 2 * Math.PI * r / n;
|
|
@@ -3493,7 +3431,7 @@ function on(o, t, e, n = 64) {
|
|
|
3493
3431
|
}
|
|
3494
3432
|
return i;
|
|
3495
3433
|
}
|
|
3496
|
-
function
|
|
3434
|
+
function nn(o, t, e, n, i = 64) {
|
|
3497
3435
|
const r = [];
|
|
3498
3436
|
for (let s = 0; s < i; s++) {
|
|
3499
3437
|
const a = 2 * Math.PI * s / i;
|
|
@@ -3501,61 +3439,61 @@ function sn(o, t, e, n, i = 64) {
|
|
|
3501
3439
|
}
|
|
3502
3440
|
return r;
|
|
3503
3441
|
}
|
|
3504
|
-
function
|
|
3442
|
+
function rn(o) {
|
|
3505
3443
|
const t = [];
|
|
3506
|
-
let e = [], n = 0, i = 0, r = 0, s = 0, a = 0, l = 0,
|
|
3507
|
-
const
|
|
3444
|
+
let e = [], n = 0, i = 0, r = 0, s = 0, a = 0, l = 0, c = "";
|
|
3445
|
+
const u = on(o);
|
|
3508
3446
|
let f = 0;
|
|
3509
|
-
function
|
|
3510
|
-
return f >=
|
|
3511
|
-
}
|
|
3512
|
-
for (; f <
|
|
3513
|
-
const
|
|
3514
|
-
let
|
|
3515
|
-
/^[a-zA-Z]$/.test(
|
|
3516
|
-
const
|
|
3517
|
-
switch (
|
|
3447
|
+
function h() {
|
|
3448
|
+
return f >= u.length ? 0 : parseFloat(u[f++]);
|
|
3449
|
+
}
|
|
3450
|
+
for (; f < u.length; ) {
|
|
3451
|
+
const x = u[f];
|
|
3452
|
+
let g;
|
|
3453
|
+
/^[a-zA-Z]$/.test(x) ? (g = x, f++) : g = c === "M" ? "L" : c === "m" ? "l" : c;
|
|
3454
|
+
const d = g === g.toLowerCase();
|
|
3455
|
+
switch (g.toUpperCase()) {
|
|
3518
3456
|
case "M": {
|
|
3519
3457
|
e.length > 0 && t.push(e), e = [];
|
|
3520
|
-
const
|
|
3521
|
-
n =
|
|
3458
|
+
const E = h() + (d ? n : 0), b = h() + (d ? i : 0);
|
|
3459
|
+
n = E, i = b, r = E, s = b, e.push(n, i), a = n, l = i;
|
|
3522
3460
|
break;
|
|
3523
3461
|
}
|
|
3524
3462
|
case "L": {
|
|
3525
|
-
n =
|
|
3463
|
+
n = h() + (d ? n : 0), i = h() + (d ? i : 0), e.push(n, i), a = n, l = i;
|
|
3526
3464
|
break;
|
|
3527
3465
|
}
|
|
3528
3466
|
case "H": {
|
|
3529
|
-
n =
|
|
3467
|
+
n = h() + (d ? n : 0), e.push(n, i), a = n, l = i;
|
|
3530
3468
|
break;
|
|
3531
3469
|
}
|
|
3532
3470
|
case "V": {
|
|
3533
|
-
i =
|
|
3471
|
+
i = h() + (d ? i : 0), e.push(n, i), a = n, l = i;
|
|
3534
3472
|
break;
|
|
3535
3473
|
}
|
|
3536
3474
|
case "C": {
|
|
3537
|
-
const
|
|
3538
|
-
nt(e, n, i,
|
|
3475
|
+
const E = h() + (d ? n : 0), b = h() + (d ? i : 0), p = h() + (d ? n : 0), v = h() + (d ? i : 0), m = h() + (d ? n : 0), T = h() + (d ? i : 0);
|
|
3476
|
+
nt(e, n, i, E, b, p, v, m, T), n = m, i = T, a = p, l = v;
|
|
3539
3477
|
break;
|
|
3540
3478
|
}
|
|
3541
3479
|
case "S": {
|
|
3542
|
-
const
|
|
3543
|
-
nt(e, n, i,
|
|
3480
|
+
const E = 2 * n - a, b = 2 * i - l, p = h() + (d ? n : 0), v = h() + (d ? i : 0), m = h() + (d ? n : 0), T = h() + (d ? i : 0);
|
|
3481
|
+
nt(e, n, i, E, b, p, v, m, T), n = m, i = T, a = p, l = v;
|
|
3544
3482
|
break;
|
|
3545
3483
|
}
|
|
3546
3484
|
case "Q": {
|
|
3547
|
-
const
|
|
3548
|
-
|
|
3485
|
+
const E = h() + (d ? n : 0), b = h() + (d ? i : 0), p = h() + (d ? n : 0), v = h() + (d ? i : 0);
|
|
3486
|
+
_t(e, n, i, E, b, p, v), n = p, i = v, a = E, l = b;
|
|
3549
3487
|
break;
|
|
3550
3488
|
}
|
|
3551
3489
|
case "T": {
|
|
3552
|
-
const
|
|
3553
|
-
|
|
3490
|
+
const E = 2 * n - a, b = 2 * i - l, p = h() + (d ? n : 0), v = h() + (d ? i : 0);
|
|
3491
|
+
_t(e, n, i, E, b, p, v), n = p, i = v, a = E, l = b;
|
|
3554
3492
|
break;
|
|
3555
3493
|
}
|
|
3556
3494
|
case "A": {
|
|
3557
|
-
const
|
|
3558
|
-
|
|
3495
|
+
const E = h(), b = h(), p = h(), v = h(), m = h(), T = h() + (d ? n : 0), w = h() + (d ? i : 0);
|
|
3496
|
+
an(e, n, i, E, b, p, !!v, !!m, T, w), n = T, i = w, a = n, l = i;
|
|
3559
3497
|
break;
|
|
3560
3498
|
}
|
|
3561
3499
|
case "Z": {
|
|
@@ -3566,74 +3504,74 @@ function an(o) {
|
|
|
3566
3504
|
f++;
|
|
3567
3505
|
break;
|
|
3568
3506
|
}
|
|
3569
|
-
|
|
3507
|
+
c = g;
|
|
3570
3508
|
}
|
|
3571
3509
|
return e.length >= 6 && t.push(e), t;
|
|
3572
3510
|
}
|
|
3573
|
-
function
|
|
3511
|
+
function on(o) {
|
|
3574
3512
|
const t = [], e = /([a-zA-Z])|([+-]?(?:\d+\.?\d*|\.\d+)(?:[eE][+-]?\d+)?)/g;
|
|
3575
3513
|
let n;
|
|
3576
3514
|
for (; (n = e.exec(o)) !== null; )
|
|
3577
3515
|
t.push(n[0]);
|
|
3578
3516
|
return t;
|
|
3579
3517
|
}
|
|
3580
|
-
const
|
|
3581
|
-
function nt(o, t, e, n, i, r, s, a, l,
|
|
3582
|
-
if (
|
|
3518
|
+
const sn = 0.5;
|
|
3519
|
+
function nt(o, t, e, n, i, r, s, a, l, c = 0) {
|
|
3520
|
+
if (c > 12) {
|
|
3583
3521
|
o.push(a, l);
|
|
3584
3522
|
return;
|
|
3585
3523
|
}
|
|
3586
|
-
const
|
|
3587
|
-
if (
|
|
3524
|
+
const u = a - t, f = l - e, h = Math.sqrt(u * u + f * f);
|
|
3525
|
+
if (h < 1e-6) {
|
|
3588
3526
|
o.push(a, l);
|
|
3589
3527
|
return;
|
|
3590
3528
|
}
|
|
3591
|
-
const
|
|
3592
|
-
if (
|
|
3529
|
+
const x = Math.abs((n - a) * f - (i - l) * u) / h, g = Math.abs((r - a) * f - (s - l) * u) / h;
|
|
3530
|
+
if (x + g < sn) {
|
|
3593
3531
|
o.push(a, l);
|
|
3594
3532
|
return;
|
|
3595
3533
|
}
|
|
3596
|
-
const
|
|
3597
|
-
nt(o, t, e,
|
|
3534
|
+
const d = (t + n) / 2, y = (e + i) / 2, E = (n + r) / 2, b = (i + s) / 2, p = (r + a) / 2, v = (s + l) / 2, m = (d + E) / 2, T = (y + b) / 2, w = (E + p) / 2, A = (b + v) / 2, D = (m + w) / 2, P = (T + A) / 2;
|
|
3535
|
+
nt(o, t, e, d, y, m, T, D, P, c + 1), nt(o, D, P, w, A, p, v, a, l, c + 1);
|
|
3598
3536
|
}
|
|
3599
|
-
function
|
|
3600
|
-
const a = t + 0.6666666666666666 * (n - t), l = e + 2 / 3 * (i - e),
|
|
3601
|
-
nt(o, t, e, a, l,
|
|
3537
|
+
function _t(o, t, e, n, i, r, s) {
|
|
3538
|
+
const a = t + 0.6666666666666666 * (n - t), l = e + 2 / 3 * (i - e), c = r + 2 / 3 * (n - r), u = s + 2 / 3 * (i - s);
|
|
3539
|
+
nt(o, t, e, a, l, c, u, r, s);
|
|
3602
3540
|
}
|
|
3603
|
-
function
|
|
3541
|
+
function an(o, t, e, n, i, r, s, a, l, c) {
|
|
3604
3542
|
if (n === 0 || i === 0) {
|
|
3605
|
-
o.push(l,
|
|
3543
|
+
o.push(l, c);
|
|
3606
3544
|
return;
|
|
3607
3545
|
}
|
|
3608
|
-
let
|
|
3609
|
-
const
|
|
3610
|
-
let
|
|
3611
|
-
if (
|
|
3612
|
-
const
|
|
3613
|
-
|
|
3614
|
-
}
|
|
3615
|
-
const
|
|
3616
|
-
let
|
|
3617
|
-
|
|
3618
|
-
const
|
|
3619
|
-
let
|
|
3620
|
-
(
|
|
3621
|
-
(
|
|
3622
|
-
(-
|
|
3623
|
-
(-
|
|
3546
|
+
let u = Math.abs(n), f = Math.abs(i);
|
|
3547
|
+
const h = r * Math.PI / 180, x = Math.cos(h), g = Math.sin(h), d = (t - l) / 2, y = (e - c) / 2, E = x * d + g * y, b = -g * d + x * y;
|
|
3548
|
+
let p = E * E / (u * u) + b * b / (f * f);
|
|
3549
|
+
if (p > 1) {
|
|
3550
|
+
const U = Math.sqrt(p);
|
|
3551
|
+
u *= U, f *= U, p = 1;
|
|
3552
|
+
}
|
|
3553
|
+
const v = u * u, m = f * f, T = E * E, w = b * b;
|
|
3554
|
+
let A = Math.max(0, (v * m - v * w - m * T) / (v * w + m * T));
|
|
3555
|
+
A = Math.sqrt(A), s === a && (A = -A);
|
|
3556
|
+
const D = A * (u * b) / f, P = A * -(f * E) / u, _ = x * D - g * P + (t + l) / 2, I = g * D + x * P + (e + c) / 2, C = It(1, 0, (E - D) / u, (b - P) / f);
|
|
3557
|
+
let S = It(
|
|
3558
|
+
(E - D) / u,
|
|
3559
|
+
(b - P) / f,
|
|
3560
|
+
(-E - D) / u,
|
|
3561
|
+
(-b - P) / f
|
|
3624
3562
|
);
|
|
3625
|
-
!a &&
|
|
3626
|
-
const
|
|
3627
|
-
for (let
|
|
3628
|
-
const
|
|
3563
|
+
!a && S > 0 && (S -= 2 * Math.PI), a && S < 0 && (S += 2 * Math.PI);
|
|
3564
|
+
const F = Math.max(4, Math.ceil(Math.abs(S) / (Math.PI / 16)));
|
|
3565
|
+
for (let U = 1; U <= F; U++) {
|
|
3566
|
+
const M = C + U / F * S, O = Math.cos(M), q = Math.sin(M), tt = x * u * O - g * f * q + _, st = g * u * O + x * f * q + I;
|
|
3629
3567
|
o.push(tt, st);
|
|
3630
3568
|
}
|
|
3631
3569
|
}
|
|
3632
|
-
function
|
|
3570
|
+
function It(o, t, e, n) {
|
|
3633
3571
|
const i = o * n - t * e < 0 ? -1 : 1, r = o * e + t * n, s = Math.sqrt(o * o + t * t), a = Math.sqrt(e * e + n * n), l = r / (s * a);
|
|
3634
3572
|
return i * Math.acos(Math.max(-1, Math.min(1, l)));
|
|
3635
3573
|
}
|
|
3636
|
-
function
|
|
3574
|
+
function ln(o) {
|
|
3637
3575
|
const t = [], e = [];
|
|
3638
3576
|
for (let n = 0; n < o.length; n++) {
|
|
3639
3577
|
n > 0 && e.push(t.length / 2);
|
|
@@ -3642,22 +3580,22 @@ function cn(o) {
|
|
|
3642
3580
|
}
|
|
3643
3581
|
return { flatCoords: t, holeIndices: e };
|
|
3644
3582
|
}
|
|
3645
|
-
function
|
|
3646
|
-
const t = o.length, e = o.map((i) => Math.abs(
|
|
3583
|
+
function Wt(o) {
|
|
3584
|
+
const t = o.length, e = o.map((i) => Math.abs(zt(i))), n = new Array(t).fill(!1);
|
|
3647
3585
|
for (let i = 0; i < t; i++) {
|
|
3648
3586
|
let r = 0;
|
|
3649
3587
|
const s = o[i][0], a = o[i][1];
|
|
3650
3588
|
for (let l = 0; l < t; l++)
|
|
3651
|
-
i !== l && e[l] > e[i] &&
|
|
3589
|
+
i !== l && e[l] > e[i] && qt(s, a, o[l]) && r++;
|
|
3652
3590
|
n[i] = r % 2 === 1;
|
|
3653
3591
|
}
|
|
3654
3592
|
return n;
|
|
3655
3593
|
}
|
|
3656
|
-
function
|
|
3594
|
+
function un(o) {
|
|
3657
3595
|
if (o.length <= 1)
|
|
3658
3596
|
return [o];
|
|
3659
|
-
const t =
|
|
3660
|
-
const l =
|
|
3597
|
+
const t = Wt(o), e = o.map((s, a) => {
|
|
3598
|
+
const l = zt(s);
|
|
3661
3599
|
return { index: a, contour: s, area: l, isOuter: !t[a] };
|
|
3662
3600
|
}), n = e.filter((s) => s.isOuter), i = e.filter((s) => !s.isOuter);
|
|
3663
3601
|
if (n.length === 0)
|
|
@@ -3668,17 +3606,17 @@ function fn(o) {
|
|
|
3668
3606
|
}));
|
|
3669
3607
|
for (const s of i) {
|
|
3670
3608
|
const a = s.contour[0], l = s.contour[1];
|
|
3671
|
-
let
|
|
3609
|
+
let c = -1, u = 1 / 0;
|
|
3672
3610
|
for (let f = 0; f < n.length; f++)
|
|
3673
|
-
if (
|
|
3674
|
-
const
|
|
3675
|
-
|
|
3611
|
+
if (qt(a, l, n[f].contour)) {
|
|
3612
|
+
const h = Math.abs(n[f].area);
|
|
3613
|
+
h < u && (u = h, c = f);
|
|
3676
3614
|
}
|
|
3677
|
-
|
|
3615
|
+
c >= 0 ? r[c].holes.push(s.contour) : r.push({ outer: s.contour, holes: [] });
|
|
3678
3616
|
}
|
|
3679
3617
|
return r.map((s) => [s.outer, ...s.holes]);
|
|
3680
3618
|
}
|
|
3681
|
-
function
|
|
3619
|
+
function zt(o) {
|
|
3682
3620
|
let t = 0;
|
|
3683
3621
|
const e = o.length;
|
|
3684
3622
|
for (let n = 0; n < e; n += 2) {
|
|
@@ -3687,46 +3625,46 @@ function jt(o) {
|
|
|
3687
3625
|
}
|
|
3688
3626
|
return t / 2;
|
|
3689
3627
|
}
|
|
3690
|
-
function
|
|
3628
|
+
function qt(o, t, e) {
|
|
3691
3629
|
let n = !1;
|
|
3692
3630
|
const i = e.length;
|
|
3693
3631
|
for (let r = 0, s = i - 2; r < i; s = r, r += 2) {
|
|
3694
|
-
const a = e[r], l = e[r + 1],
|
|
3695
|
-
l > t !=
|
|
3632
|
+
const a = e[r], l = e[r + 1], c = e[s], u = e[s + 1];
|
|
3633
|
+
l > t != u > t && o < (c - a) * (t - l) / (u - l) + a && (n = !n);
|
|
3696
3634
|
}
|
|
3697
3635
|
return n;
|
|
3698
3636
|
}
|
|
3699
|
-
function
|
|
3637
|
+
function cn(o, t, e = 2) {
|
|
3700
3638
|
const n = t && t.length > 0, i = n ? t[0] * e : o.length;
|
|
3701
|
-
let r =
|
|
3639
|
+
let r = Yt(o, 0, i, e, !0);
|
|
3702
3640
|
const s = [];
|
|
3703
3641
|
if (!r || r.next === r.prev) return s;
|
|
3704
|
-
n && (r =
|
|
3705
|
-
let a = 1 / 0, l = 1 / 0,
|
|
3642
|
+
n && (r = pn(o, t, r, e));
|
|
3643
|
+
let a = 1 / 0, l = 1 / 0, c = -1 / 0, u = -1 / 0, f = 0;
|
|
3706
3644
|
if (o.length > 80 * e) {
|
|
3707
|
-
for (let
|
|
3708
|
-
const
|
|
3709
|
-
|
|
3645
|
+
for (let h = 0; h < i; h += e) {
|
|
3646
|
+
const x = o[h], g = o[h + 1];
|
|
3647
|
+
x < a && (a = x), g < l && (l = g), x > c && (c = x), g > u && (u = g);
|
|
3710
3648
|
}
|
|
3711
|
-
f = Math.max(
|
|
3649
|
+
f = Math.max(c - a, u - l), f = f !== 0 ? 32767 / f : 0;
|
|
3712
3650
|
}
|
|
3713
3651
|
return it(r, s, e, a, l, f, 0), s;
|
|
3714
3652
|
}
|
|
3715
|
-
function
|
|
3653
|
+
function Yt(o, t, e, n, i) {
|
|
3716
3654
|
let r = null;
|
|
3717
|
-
if (i ===
|
|
3655
|
+
if (i === An(o, t, e, n) > 0)
|
|
3718
3656
|
for (let s = t; s < e; s += n)
|
|
3719
|
-
r =
|
|
3657
|
+
r = Mt(s, o[s], o[s + 1], r);
|
|
3720
3658
|
else
|
|
3721
3659
|
for (let s = e - n; s >= t; s -= n)
|
|
3722
|
-
r =
|
|
3723
|
-
return r &&
|
|
3660
|
+
r = Mt(s, o[s], o[s + 1], r);
|
|
3661
|
+
return r && pt(r, r.next) && (ot(r), r = r.next), r ? (r.next.prev = r, r.prev.next = r, r.next) : null;
|
|
3724
3662
|
}
|
|
3725
|
-
function
|
|
3663
|
+
function z(o, t) {
|
|
3726
3664
|
t || (t = o);
|
|
3727
3665
|
let e = o, n;
|
|
3728
3666
|
do
|
|
3729
|
-
if (n = !1, !e.steiner && (
|
|
3667
|
+
if (n = !1, !e.steiner && (pt(e, e.next) || L(e.prev, e, e.next) === 0)) {
|
|
3730
3668
|
if (ot(e), e = t = e.prev, e === e.next) break;
|
|
3731
3669
|
n = !0;
|
|
3732
3670
|
} else
|
|
@@ -3736,66 +3674,66 @@ function W(o, t) {
|
|
|
3736
3674
|
}
|
|
3737
3675
|
function it(o, t, e, n, i, r, s) {
|
|
3738
3676
|
if (!o) return;
|
|
3739
|
-
!s && r &&
|
|
3740
|
-
let a = o, l,
|
|
3677
|
+
!s && r && Tn(o, n, i, r);
|
|
3678
|
+
let a = o, l, c;
|
|
3741
3679
|
for (; o.prev !== o.next; ) {
|
|
3742
|
-
if (l = o.prev,
|
|
3743
|
-
t.push(l.i / e, o.i / e,
|
|
3680
|
+
if (l = o.prev, c = o.next, r ? fn(o, n, i, r) : hn(o)) {
|
|
3681
|
+
t.push(l.i / e, o.i / e, c.i / e), ot(o), o = c.next, a = c.next;
|
|
3744
3682
|
continue;
|
|
3745
3683
|
}
|
|
3746
|
-
if (o =
|
|
3747
|
-
s ? s === 1 ? (o =
|
|
3684
|
+
if (o = c, o === a) {
|
|
3685
|
+
s ? s === 1 ? (o = dn(z(o), t, e), it(o, t, e, n, i, r, 2)) : s === 2 && mn(o, t, e, n, i, r) : it(z(o), t, e, n, i, r, 1);
|
|
3748
3686
|
break;
|
|
3749
3687
|
}
|
|
3750
3688
|
}
|
|
3751
3689
|
}
|
|
3752
|
-
function
|
|
3690
|
+
function hn(o) {
|
|
3753
3691
|
const t = o.prev, e = o, n = o.next;
|
|
3754
|
-
if (
|
|
3755
|
-
const i = t.x, r = e.x, s = n.x, a = t.y, l = e.y,
|
|
3756
|
-
let
|
|
3757
|
-
for (;
|
|
3758
|
-
if (
|
|
3692
|
+
if (L(t, e, n) >= 0) return !1;
|
|
3693
|
+
const i = t.x, r = e.x, s = n.x, a = t.y, l = e.y, c = n.y, u = i < r ? i < s ? i : s : r < s ? r : s, f = a < l ? a < c ? a : c : l < c ? l : c, h = i > r ? i > s ? i : s : r > s ? r : s, x = a > l ? a > c ? a : c : l > c ? l : c;
|
|
3694
|
+
let g = n.next;
|
|
3695
|
+
for (; g !== t; ) {
|
|
3696
|
+
if (g.x >= u && g.x <= h && g.y >= f && g.y <= x && J(i, a, r, l, s, c, g.x, g.y) && L(g.prev, g, g.next) >= 0)
|
|
3759
3697
|
return !1;
|
|
3760
|
-
|
|
3698
|
+
g = g.next;
|
|
3761
3699
|
}
|
|
3762
3700
|
return !0;
|
|
3763
3701
|
}
|
|
3764
|
-
function
|
|
3702
|
+
function fn(o, t, e, n) {
|
|
3765
3703
|
const i = o.prev, r = o, s = o.next;
|
|
3766
|
-
if (
|
|
3767
|
-
const a = i.x, l = r.x,
|
|
3768
|
-
let
|
|
3769
|
-
for (;
|
|
3770
|
-
if (
|
|
3771
|
-
|
|
3704
|
+
if (L(i, r, s) >= 0) return !1;
|
|
3705
|
+
const a = i.x, l = r.x, c = s.x, u = i.y, f = r.y, h = s.y, x = a < l ? a < c ? a : c : l < c ? l : c, g = u < f ? u < h ? u : h : f < h ? f : h, d = a > l ? a > c ? a : c : l > c ? l : c, y = u > f ? u > h ? u : h : f > h ? f : h, E = yt(x, g, t, e, n), b = yt(d, y, t, e, n);
|
|
3706
|
+
let p = o.prevZ, v = o.nextZ;
|
|
3707
|
+
for (; p && p.z >= E && v && v.z <= b; ) {
|
|
3708
|
+
if (p.x >= x && p.x <= d && p.y >= g && p.y <= y && p !== i && p !== s && J(a, u, l, f, c, h, p.x, p.y) && L(p.prev, p, p.next) >= 0 || (p = p.prevZ, v.x >= x && v.x <= d && v.y >= g && v.y <= y && v !== i && v !== s && J(a, u, l, f, c, h, v.x, v.y) && L(v.prev, v, v.next) >= 0)) return !1;
|
|
3709
|
+
v = v.nextZ;
|
|
3772
3710
|
}
|
|
3773
|
-
for (;
|
|
3774
|
-
if (
|
|
3775
|
-
|
|
3711
|
+
for (; p && p.z >= E; ) {
|
|
3712
|
+
if (p.x >= x && p.x <= d && p.y >= g && p.y <= y && p !== i && p !== s && J(a, u, l, f, c, h, p.x, p.y) && L(p.prev, p, p.next) >= 0) return !1;
|
|
3713
|
+
p = p.prevZ;
|
|
3776
3714
|
}
|
|
3777
|
-
for (;
|
|
3778
|
-
if (
|
|
3779
|
-
|
|
3715
|
+
for (; v && v.z <= b; ) {
|
|
3716
|
+
if (v.x >= x && v.x <= d && v.y >= g && v.y <= y && v !== i && v !== s && J(a, u, l, f, c, h, v.x, v.y) && L(v.prev, v, v.next) >= 0) return !1;
|
|
3717
|
+
v = v.nextZ;
|
|
3780
3718
|
}
|
|
3781
3719
|
return !0;
|
|
3782
3720
|
}
|
|
3783
|
-
function
|
|
3721
|
+
function dn(o, t, e) {
|
|
3784
3722
|
let n = o;
|
|
3785
3723
|
do {
|
|
3786
3724
|
const i = n.prev, r = n.next.next;
|
|
3787
|
-
!
|
|
3725
|
+
!pt(i, r) && jt(i, n, n.next, r) && rt(i, r) && rt(r, i) && (t.push(i.i / e, n.i / e, r.i / e), ot(n), ot(n.next), n = o = r), n = n.next;
|
|
3788
3726
|
} while (n !== o);
|
|
3789
|
-
return
|
|
3727
|
+
return z(n);
|
|
3790
3728
|
}
|
|
3791
|
-
function
|
|
3729
|
+
function mn(o, t, e, n, i, r) {
|
|
3792
3730
|
let s = o;
|
|
3793
3731
|
do {
|
|
3794
3732
|
let a = s.next.next;
|
|
3795
3733
|
for (; a !== s.prev; ) {
|
|
3796
|
-
if (s.i !== a.i &&
|
|
3797
|
-
let l =
|
|
3798
|
-
s =
|
|
3734
|
+
if (s.i !== a.i && yn(s, a)) {
|
|
3735
|
+
let l = Zt(s, a);
|
|
3736
|
+
s = z(s, s.next), l = z(l, l.next), it(s, t, e, n, i, r, 0), it(l, t, e, n, i, r, 0);
|
|
3799
3737
|
return;
|
|
3800
3738
|
}
|
|
3801
3739
|
a = a.next;
|
|
@@ -3803,24 +3741,24 @@ function vn(o, t, e, n, i, r) {
|
|
|
3803
3741
|
s = s.next;
|
|
3804
3742
|
} while (s !== o);
|
|
3805
3743
|
}
|
|
3806
|
-
function
|
|
3744
|
+
function pn(o, t, e, n) {
|
|
3807
3745
|
const i = [];
|
|
3808
3746
|
for (let r = 0; r < t.length; r++) {
|
|
3809
|
-
const s = t[r] * n, a = r < t.length - 1 ? t[r + 1] * n : o.length, l =
|
|
3810
|
-
l && (l === l.next && (l.steiner = !0), i.push(
|
|
3747
|
+
const s = t[r] * n, a = r < t.length - 1 ? t[r + 1] * n : o.length, l = Yt(o, s, a, n, !1);
|
|
3748
|
+
l && (l === l.next && (l.steiner = !0), i.push(bn(l)));
|
|
3811
3749
|
}
|
|
3812
3750
|
i.sort((r, s) => r.x - s.x);
|
|
3813
3751
|
for (const r of i)
|
|
3814
|
-
e =
|
|
3752
|
+
e = gn(r, e);
|
|
3815
3753
|
return e;
|
|
3816
3754
|
}
|
|
3817
|
-
function
|
|
3818
|
-
const e =
|
|
3755
|
+
function gn(o, t) {
|
|
3756
|
+
const e = vn(o, t);
|
|
3819
3757
|
if (!e) return t;
|
|
3820
|
-
const n =
|
|
3821
|
-
return
|
|
3758
|
+
const n = Zt(e, o);
|
|
3759
|
+
return z(n, n.next), z(e, e.next);
|
|
3822
3760
|
}
|
|
3823
|
-
function
|
|
3761
|
+
function vn(o, t) {
|
|
3824
3762
|
let e = t;
|
|
3825
3763
|
const n = o.x, i = o.y;
|
|
3826
3764
|
let r = -1 / 0, s = null;
|
|
@@ -3833,29 +3771,29 @@ function En(o, t) {
|
|
|
3833
3771
|
e = e.next;
|
|
3834
3772
|
} while (e !== t);
|
|
3835
3773
|
if (!s) return null;
|
|
3836
|
-
const a = s, l = s.x,
|
|
3837
|
-
let
|
|
3774
|
+
const a = s, l = s.x, c = s.y;
|
|
3775
|
+
let u = 1 / 0;
|
|
3838
3776
|
e = s;
|
|
3839
3777
|
do {
|
|
3840
|
-
if (n >= e.x && e.x >= l && n !== e.x && J(i <
|
|
3778
|
+
if (n >= e.x && e.x >= l && n !== e.x && J(i < c ? n : r, i, l, c, i < c ? r : n, i, e.x, e.y)) {
|
|
3841
3779
|
const f = Math.abs(i - e.y) / (n - e.x);
|
|
3842
|
-
rt(e, o) && (f <
|
|
3780
|
+
rt(e, o) && (f < u || f === u && (e.x > s.x || xn(s, e))) && (s = e, u = f);
|
|
3843
3781
|
}
|
|
3844
3782
|
e = e.next;
|
|
3845
3783
|
} while (e !== a);
|
|
3846
3784
|
return s;
|
|
3847
3785
|
}
|
|
3848
|
-
function
|
|
3849
|
-
return
|
|
3786
|
+
function xn(o, t) {
|
|
3787
|
+
return L(o.prev, o, t.prev) < 0 && L(t.next, o, o.next) < 0;
|
|
3850
3788
|
}
|
|
3851
|
-
function
|
|
3789
|
+
function Tn(o, t, e, n) {
|
|
3852
3790
|
let i = o;
|
|
3853
3791
|
do
|
|
3854
|
-
i.z === 0 && (i.z =
|
|
3792
|
+
i.z === 0 && (i.z = yt(i.x, i.y, t, e, n)), i.prevZ = i.prev, i.nextZ = i.next, i = i.next;
|
|
3855
3793
|
while (i !== o);
|
|
3856
|
-
i.prevZ.nextZ = null, i.prevZ = null,
|
|
3794
|
+
i.prevZ.nextZ = null, i.prevZ = null, En(i);
|
|
3857
3795
|
}
|
|
3858
|
-
function
|
|
3796
|
+
function En(o) {
|
|
3859
3797
|
let t = 1, e;
|
|
3860
3798
|
do {
|
|
3861
3799
|
let n = o;
|
|
@@ -3877,11 +3815,11 @@ function Sn(o) {
|
|
|
3877
3815
|
} while (e > 1);
|
|
3878
3816
|
return o;
|
|
3879
3817
|
}
|
|
3880
|
-
function
|
|
3818
|
+
function yt(o, t, e, n, i) {
|
|
3881
3819
|
let r = (o - e) * i | 0, s = (t - n) * i | 0;
|
|
3882
3820
|
return r = (r | r << 8) & 16711935, r = (r | r << 4) & 252645135, r = (r | r << 2) & 858993459, r = (r | r << 1) & 1431655765, s = (s | s << 8) & 16711935, s = (s | s << 4) & 252645135, s = (s | s << 2) & 858993459, s = (s | s << 1) & 1431655765, r | s << 1;
|
|
3883
3821
|
}
|
|
3884
|
-
function
|
|
3822
|
+
function bn(o) {
|
|
3885
3823
|
let t = o, e = o;
|
|
3886
3824
|
do
|
|
3887
3825
|
(t.x < e.x || t.x === e.x && t.y < e.y) && (e = t), t = t.next;
|
|
@@ -3891,37 +3829,37 @@ function An(o) {
|
|
|
3891
3829
|
function J(o, t, e, n, i, r, s, a) {
|
|
3892
3830
|
return (i - s) * (t - a) - (o - s) * (r - a) >= 0 && (o - s) * (n - a) - (e - s) * (t - a) >= 0 && (e - s) * (r - a) - (i - s) * (n - a) >= 0;
|
|
3893
3831
|
}
|
|
3894
|
-
function
|
|
3895
|
-
return o.next.i !== t.i && o.prev.i !== t.i && !
|
|
3832
|
+
function yn(o, t) {
|
|
3833
|
+
return o.next.i !== t.i && o.prev.i !== t.i && !Sn(o, t) && (rt(o, t) && rt(t, o) && wn(o, t) && (L(o.prev, o, t.prev) !== 0 || L(o, t.prev, t) !== 0) || pt(o, t) && L(o.prev, o, o.next) > 0 && L(t.prev, t, t.next) > 0);
|
|
3896
3834
|
}
|
|
3897
|
-
function
|
|
3835
|
+
function L(o, t, e) {
|
|
3898
3836
|
return (t.y - o.y) * (e.x - t.x) - (t.x - o.x) * (e.y - t.y);
|
|
3899
3837
|
}
|
|
3900
|
-
function
|
|
3838
|
+
function pt(o, t) {
|
|
3901
3839
|
return o.x === t.x && o.y === t.y;
|
|
3902
3840
|
}
|
|
3903
|
-
function
|
|
3904
|
-
const i = ut(
|
|
3905
|
-
return !!(i !== r && s !== a || i === 0 &&
|
|
3841
|
+
function jt(o, t, e, n) {
|
|
3842
|
+
const i = ut(L(o, t, e)), r = ut(L(o, t, n)), s = ut(L(e, n, o)), a = ut(L(e, n, t));
|
|
3843
|
+
return !!(i !== r && s !== a || i === 0 && lt(o, e, t) || r === 0 && lt(o, n, t) || s === 0 && lt(e, o, n) || a === 0 && lt(e, t, n));
|
|
3906
3844
|
}
|
|
3907
|
-
function
|
|
3845
|
+
function lt(o, t, e) {
|
|
3908
3846
|
return t.x <= Math.max(o.x, e.x) && t.x >= Math.min(o.x, e.x) && t.y <= Math.max(o.y, e.y) && t.y >= Math.min(o.y, e.y);
|
|
3909
3847
|
}
|
|
3910
3848
|
function ut(o) {
|
|
3911
3849
|
return o > 0 ? 1 : o < 0 ? -1 : 0;
|
|
3912
3850
|
}
|
|
3913
|
-
function
|
|
3851
|
+
function Sn(o, t) {
|
|
3914
3852
|
let e = o;
|
|
3915
3853
|
do {
|
|
3916
|
-
if (e.i !== o.i && e.next.i !== o.i && e.i !== t.i && e.next.i !== t.i &&
|
|
3854
|
+
if (e.i !== o.i && e.next.i !== o.i && e.i !== t.i && e.next.i !== t.i && jt(e, e.next, o, t)) return !0;
|
|
3917
3855
|
e = e.next;
|
|
3918
3856
|
} while (e !== o);
|
|
3919
3857
|
return !1;
|
|
3920
3858
|
}
|
|
3921
3859
|
function rt(o, t) {
|
|
3922
|
-
return
|
|
3860
|
+
return L(o.prev, o, o.next) < 0 ? L(o, t, o.next) >= 0 && L(o, o.prev, t) >= 0 : L(o, t, o.prev) < 0 || L(o, o.next, t) < 0;
|
|
3923
3861
|
}
|
|
3924
|
-
function
|
|
3862
|
+
function wn(o, t) {
|
|
3925
3863
|
let e = o, n = !1;
|
|
3926
3864
|
const i = (o.x + t.x) / 2, r = (o.y + t.y) / 2;
|
|
3927
3865
|
do
|
|
@@ -3929,18 +3867,18 @@ function Dn(o, t) {
|
|
|
3929
3867
|
while (e !== o);
|
|
3930
3868
|
return n;
|
|
3931
3869
|
}
|
|
3932
|
-
function
|
|
3933
|
-
const e =
|
|
3870
|
+
function Zt(o, t) {
|
|
3871
|
+
const e = St(o.i, o.x, o.y), n = St(t.i, t.x, t.y), i = o.next, r = t.prev;
|
|
3934
3872
|
return o.next = t, t.prev = o, e.next = i, i.prev = e, n.next = e, e.prev = n, r.next = n, n.prev = r, n;
|
|
3935
3873
|
}
|
|
3936
|
-
function
|
|
3937
|
-
const i =
|
|
3874
|
+
function Mt(o, t, e, n) {
|
|
3875
|
+
const i = St(o, t, e);
|
|
3938
3876
|
return n ? (i.next = n.next, i.prev = n, n.next.prev = i, n.next = i) : (i.prev = i, i.next = i), i;
|
|
3939
3877
|
}
|
|
3940
3878
|
function ot(o) {
|
|
3941
3879
|
o.next.prev = o.prev, o.prev.next = o.next, o.prevZ && (o.prevZ.nextZ = o.nextZ), o.nextZ && (o.nextZ.prevZ = o.prevZ);
|
|
3942
3880
|
}
|
|
3943
|
-
function
|
|
3881
|
+
function St(o, t, e) {
|
|
3944
3882
|
return {
|
|
3945
3883
|
i: o,
|
|
3946
3884
|
x: t,
|
|
@@ -3953,13 +3891,13 @@ function At(o, t, e) {
|
|
|
3953
3891
|
steiner: !1
|
|
3954
3892
|
};
|
|
3955
3893
|
}
|
|
3956
|
-
function
|
|
3894
|
+
function An(o, t, e, n) {
|
|
3957
3895
|
let i = 0;
|
|
3958
3896
|
for (let r = t, s = e - n; r < e; r += n)
|
|
3959
3897
|
i += (o[s] - o[r]) * (o[r + 1] + o[s + 1]), s = r;
|
|
3960
3898
|
return i;
|
|
3961
3899
|
}
|
|
3962
|
-
const
|
|
3900
|
+
const R = {
|
|
3963
3901
|
parallaxX: 0.4,
|
|
3964
3902
|
parallaxY: 0.8,
|
|
3965
3903
|
parallaxMax: 30,
|
|
@@ -4014,67 +3952,8 @@ const A = {
|
|
|
4014
3952
|
autoplay: !0,
|
|
4015
3953
|
loop: !0,
|
|
4016
3954
|
muted: !0
|
|
4017
|
-
},
|
|
4018
|
-
class
|
|
4019
|
-
constructor(t, e = 0.08, n = 0.06) {
|
|
4020
|
-
this.host = t, this.lerpFactor = e, this.motionLerpFactor = n, this.host.addEventListener("mousemove", this.handleMouseMove), this.host.addEventListener("mouseleave", this.resetPointerTarget), this.host.addEventListener("touchstart", this.handleTouchStart, { passive: !0 }), this.host.addEventListener("touchmove", this.handleTouchMove, { passive: !0 }), this.host.addEventListener("touchend", this.handleTouchEnd, { passive: !0 }), this.host.addEventListener("touchcancel", this.handleTouchEnd, { passive: !0 });
|
|
4021
|
-
}
|
|
4022
|
-
pointerTarget = { x: 0, y: 0 };
|
|
4023
|
-
motionTarget = { x: 0, y: 0 };
|
|
4024
|
-
smoothedOutput = { x: 0, y: 0 };
|
|
4025
|
-
usingMotionInput = !1;
|
|
4026
|
-
motionListenerAttached = !1;
|
|
4027
|
-
motionRequested = !1;
|
|
4028
|
-
touchActive = !1;
|
|
4029
|
-
touchAnchorX = 0;
|
|
4030
|
-
touchAnchorY = 0;
|
|
4031
|
-
lerpFactor;
|
|
4032
|
-
motionLerpFactor;
|
|
4033
|
-
static TOUCH_DRAG_RANGE = 100;
|
|
4034
|
-
update() {
|
|
4035
|
-
const t = this.touchActive ? this.pointerTarget : this.usingMotionInput ? this.motionTarget : this.pointerTarget, e = this.usingMotionInput && !this.touchActive ? this.motionLerpFactor : this.lerpFactor;
|
|
4036
|
-
return this.smoothedOutput.x = ct(this.smoothedOutput.x, t.x, e), this.smoothedOutput.y = ct(this.smoothedOutput.y, t.y, e), this.smoothedOutput;
|
|
4037
|
-
}
|
|
4038
|
-
dispose() {
|
|
4039
|
-
this.host.removeEventListener("mousemove", this.handleMouseMove), this.host.removeEventListener("mouseleave", this.resetPointerTarget), this.host.removeEventListener("touchstart", this.handleTouchStart), this.host.removeEventListener("touchmove", this.handleTouchMove), this.host.removeEventListener("touchend", this.handleTouchEnd), this.host.removeEventListener("touchcancel", this.handleTouchEnd), this.motionListenerAttached && (window.removeEventListener("deviceorientation", this.handleDeviceOrientation), this.motionListenerAttached = !1);
|
|
4040
|
-
}
|
|
4041
|
-
handleMouseMove = (t) => {
|
|
4042
|
-
const e = this.host.getBoundingClientRect(), n = (t.clientX - e.left) / e.width * 2 - 1, i = (t.clientY - e.top) / e.height * 2 - 1;
|
|
4043
|
-
this.pointerTarget.x = K(n, -1, 1), this.pointerTarget.y = K(i, -1, 1);
|
|
4044
|
-
};
|
|
4045
|
-
resetPointerTarget = () => {
|
|
4046
|
-
this.pointerTarget.x = 0, this.pointerTarget.y = 0;
|
|
4047
|
-
};
|
|
4048
|
-
handleTouchStart = (t) => {
|
|
4049
|
-
const e = t.touches[0];
|
|
4050
|
-
e && (this.touchActive = !0, this.touchAnchorX = e.clientX, this.touchAnchorY = e.clientY, this.pointerTarget.x = 0, this.pointerTarget.y = 0, this.motionRequested || (this.motionRequested = !0, this.requestMotionPermission()));
|
|
4051
|
-
};
|
|
4052
|
-
handleTouchMove = (t) => {
|
|
4053
|
-
const e = t.touches[0];
|
|
4054
|
-
if (!e) return;
|
|
4055
|
-
const n = e.clientX - this.touchAnchorX, i = e.clientY - this.touchAnchorY, r = Pt.TOUCH_DRAG_RANGE;
|
|
4056
|
-
this.pointerTarget.x = K(n / r, -1, 1), this.pointerTarget.y = K(i / r, -1, 1);
|
|
4057
|
-
};
|
|
4058
|
-
handleTouchEnd = () => {
|
|
4059
|
-
this.touchActive = !1, this.pointerTarget.x = 0, this.pointerTarget.y = 0;
|
|
4060
|
-
};
|
|
4061
|
-
async requestMotionPermission() {
|
|
4062
|
-
if (typeof DeviceOrientationEvent > "u") return;
|
|
4063
|
-
const t = DeviceOrientationEvent;
|
|
4064
|
-
if (typeof t.requestPermission == "function")
|
|
4065
|
-
try {
|
|
4066
|
-
if (await t.requestPermission() !== "granted") return;
|
|
4067
|
-
} catch {
|
|
4068
|
-
return;
|
|
4069
|
-
}
|
|
4070
|
-
this.motionListenerAttached || (window.addEventListener("deviceorientation", this.handleDeviceOrientation), this.motionListenerAttached = !0), this.usingMotionInput = !0;
|
|
4071
|
-
}
|
|
4072
|
-
handleDeviceOrientation = (t) => {
|
|
4073
|
-
const e = K((t.gamma ?? 0) / 45, -1, 1), n = K((t.beta ?? 0) / 45, -1, 1);
|
|
4074
|
-
this.motionTarget.x = ct(this.motionTarget.x, e, this.motionLerpFactor), this.motionTarget.y = ct(this.motionTarget.y, n, this.motionLerpFactor);
|
|
4075
|
-
};
|
|
4076
|
-
}
|
|
4077
|
-
class bt extends HTMLElement {
|
|
3955
|
+
}, $ = 512, K = 512;
|
|
3956
|
+
class Et extends HTMLElement {
|
|
4078
3957
|
static TAG_NAME = "layershift-portal";
|
|
4079
3958
|
static get observedAttributes() {
|
|
4080
3959
|
return [
|
|
@@ -4138,17 +4017,24 @@ class bt extends HTMLElement {
|
|
|
4138
4017
|
const e = !!this.getAttribute("src"), n = !!this.getAttribute("depth-src") && !!this.getAttribute("depth-meta"), i = !!this.getAttribute("depth-model");
|
|
4139
4018
|
return e && t && (n || i);
|
|
4140
4019
|
}
|
|
4020
|
+
_input = { x: 0, y: 0 };
|
|
4021
|
+
/** The current input offset. Set this externally to drive the effect. */
|
|
4022
|
+
get input() {
|
|
4023
|
+
return { x: this._input.x, y: this._input.y };
|
|
4024
|
+
}
|
|
4025
|
+
set input(t) {
|
|
4026
|
+
this._input.x = t.x, this._input.y = t.y;
|
|
4027
|
+
}
|
|
4141
4028
|
shadow;
|
|
4142
4029
|
container = null;
|
|
4143
4030
|
renderer = null;
|
|
4144
|
-
inputHandler = null;
|
|
4145
4031
|
source = null;
|
|
4146
4032
|
depthEstimator = null;
|
|
4147
4033
|
mesh = null;
|
|
4148
4034
|
loopCount = 0;
|
|
4149
4035
|
lifecycle;
|
|
4150
4036
|
constructor() {
|
|
4151
|
-
super(), this.shadow = this.attachShadow({ mode: "open" }), this.lifecycle = new
|
|
4037
|
+
super(), this.shadow = this.attachShadow({ mode: "open" }), this.lifecycle = new Gt(this);
|
|
4152
4038
|
}
|
|
4153
4039
|
// --- Attribute helpers ---
|
|
4154
4040
|
getAttrFloat(t, e) {
|
|
@@ -4164,7 +4050,7 @@ class bt extends HTMLElement {
|
|
|
4164
4050
|
}
|
|
4165
4051
|
getAttrColor(t, e) {
|
|
4166
4052
|
const n = this.getAttribute(t) ?? e;
|
|
4167
|
-
return
|
|
4053
|
+
return Rn(n);
|
|
4168
4054
|
}
|
|
4169
4055
|
getAttrVec3(t, e) {
|
|
4170
4056
|
const i = (this.getAttribute(t) ?? e).split(",").map((s) => parseFloat(s.trim()));
|
|
@@ -4178,19 +4064,19 @@ class bt extends HTMLElement {
|
|
|
4178
4064
|
return t === "camera" ? "camera" : t === "image" ? "image" : "video";
|
|
4179
4065
|
}
|
|
4180
4066
|
get parallaxX() {
|
|
4181
|
-
return this.getAttrFloat("parallax-x",
|
|
4067
|
+
return this.getAttrFloat("parallax-x", R.parallaxX);
|
|
4182
4068
|
}
|
|
4183
4069
|
get parallaxY() {
|
|
4184
|
-
return this.getAttrFloat("parallax-y",
|
|
4070
|
+
return this.getAttrFloat("parallax-y", R.parallaxY);
|
|
4185
4071
|
}
|
|
4186
4072
|
get parallaxMax() {
|
|
4187
|
-
return this.getAttrFloat("parallax-max",
|
|
4073
|
+
return this.getAttrFloat("parallax-max", R.parallaxMax);
|
|
4188
4074
|
}
|
|
4189
4075
|
get overscan() {
|
|
4190
|
-
return this.getAttrFloat("overscan",
|
|
4076
|
+
return this.getAttrFloat("overscan", R.overscan);
|
|
4191
4077
|
}
|
|
4192
4078
|
get pomSteps() {
|
|
4193
|
-
return this.getAttrFloat("pom-steps",
|
|
4079
|
+
return this.getAttrFloat("pom-steps", R.pomSteps);
|
|
4194
4080
|
}
|
|
4195
4081
|
get quality() {
|
|
4196
4082
|
const t = this.getAttribute("quality");
|
|
@@ -4202,128 +4088,128 @@ class bt extends HTMLElement {
|
|
|
4202
4088
|
}
|
|
4203
4089
|
// Boundary
|
|
4204
4090
|
get rimIntensity() {
|
|
4205
|
-
return this.getAttrFloat("rim-intensity",
|
|
4091
|
+
return this.getAttrFloat("rim-intensity", R.rimIntensity);
|
|
4206
4092
|
}
|
|
4207
4093
|
get rimWidth() {
|
|
4208
|
-
return this.getAttrFloat("rim-width",
|
|
4094
|
+
return this.getAttrFloat("rim-width", R.rimWidth);
|
|
4209
4095
|
}
|
|
4210
4096
|
get rimColor() {
|
|
4211
|
-
return this.getAttrColor("rim-color",
|
|
4097
|
+
return this.getAttrColor("rim-color", R.rimColor);
|
|
4212
4098
|
}
|
|
4213
4099
|
get refractionStrength() {
|
|
4214
|
-
return this.getAttrFloat("refraction-strength",
|
|
4100
|
+
return this.getAttrFloat("refraction-strength", R.refractionStrength);
|
|
4215
4101
|
}
|
|
4216
4102
|
get chromaticStrength() {
|
|
4217
|
-
return this.getAttrFloat("chromatic-strength",
|
|
4103
|
+
return this.getAttrFloat("chromatic-strength", R.chromaticStrength);
|
|
4218
4104
|
}
|
|
4219
4105
|
get occlusionIntensity() {
|
|
4220
|
-
return this.getAttrFloat("occlusion-intensity",
|
|
4106
|
+
return this.getAttrFloat("occlusion-intensity", R.occlusionIntensity);
|
|
4221
4107
|
}
|
|
4222
4108
|
// Lens transform
|
|
4223
4109
|
get depthPower() {
|
|
4224
|
-
return this.getAttrFloat("depth-power",
|
|
4110
|
+
return this.getAttrFloat("depth-power", R.depthPower);
|
|
4225
4111
|
}
|
|
4226
4112
|
get depthScale() {
|
|
4227
|
-
return this.getAttrFloat("depth-scale",
|
|
4113
|
+
return this.getAttrFloat("depth-scale", R.depthScale);
|
|
4228
4114
|
}
|
|
4229
4115
|
get depthBias() {
|
|
4230
|
-
return this.getAttrFloat("depth-bias",
|
|
4116
|
+
return this.getAttrFloat("depth-bias", R.depthBias);
|
|
4231
4117
|
}
|
|
4232
4118
|
// Interior mood
|
|
4233
4119
|
get fogDensity() {
|
|
4234
|
-
return this.getAttrFloat("fog-density",
|
|
4120
|
+
return this.getAttrFloat("fog-density", R.fogDensity);
|
|
4235
4121
|
}
|
|
4236
4122
|
get fogColor() {
|
|
4237
|
-
return this.getAttrColor("fog-color",
|
|
4123
|
+
return this.getAttrColor("fog-color", R.fogColor);
|
|
4238
4124
|
}
|
|
4239
4125
|
get colorShift() {
|
|
4240
|
-
return this.getAttrFloat("color-shift",
|
|
4126
|
+
return this.getAttrFloat("color-shift", R.colorShift);
|
|
4241
4127
|
}
|
|
4242
4128
|
get brightnessBias() {
|
|
4243
|
-
return this.getAttrFloat("brightness-bias",
|
|
4129
|
+
return this.getAttrFloat("brightness-bias", R.brightnessBias);
|
|
4244
4130
|
}
|
|
4245
4131
|
// Depth-adaptive
|
|
4246
4132
|
get contrastLow() {
|
|
4247
|
-
return this.getAttrFloat("contrast-low",
|
|
4133
|
+
return this.getAttrFloat("contrast-low", R.contrastLow);
|
|
4248
4134
|
}
|
|
4249
4135
|
get contrastHigh() {
|
|
4250
|
-
return this.getAttrFloat("contrast-high",
|
|
4136
|
+
return this.getAttrFloat("contrast-high", R.contrastHigh);
|
|
4251
4137
|
}
|
|
4252
4138
|
get verticalReduction() {
|
|
4253
|
-
return this.getAttrFloat("vertical-reduction",
|
|
4139
|
+
return this.getAttrFloat("vertical-reduction", R.verticalReduction);
|
|
4254
4140
|
}
|
|
4255
4141
|
get dofStart() {
|
|
4256
|
-
return this.getAttrFloat("dof-start",
|
|
4142
|
+
return this.getAttrFloat("dof-start", R.dofStart);
|
|
4257
4143
|
}
|
|
4258
4144
|
get dofStrength() {
|
|
4259
|
-
return this.getAttrFloat("dof-strength",
|
|
4145
|
+
return this.getAttrFloat("dof-strength", R.dofStrength);
|
|
4260
4146
|
}
|
|
4261
4147
|
// Bevel / dimensional typography
|
|
4262
4148
|
get bevelIntensity() {
|
|
4263
|
-
return this.getAttrFloat("bevel-intensity",
|
|
4149
|
+
return this.getAttrFloat("bevel-intensity", R.bevelIntensity);
|
|
4264
4150
|
}
|
|
4265
4151
|
get bevelWidth() {
|
|
4266
|
-
return this.getAttrFloat("bevel-width",
|
|
4152
|
+
return this.getAttrFloat("bevel-width", R.bevelWidth);
|
|
4267
4153
|
}
|
|
4268
4154
|
get bevelDarkening() {
|
|
4269
|
-
return this.getAttrFloat("bevel-darkening",
|
|
4155
|
+
return this.getAttrFloat("bevel-darkening", R.bevelDarkening);
|
|
4270
4156
|
}
|
|
4271
4157
|
get bevelDesaturation() {
|
|
4272
|
-
return this.getAttrFloat("bevel-desaturation",
|
|
4158
|
+
return this.getAttrFloat("bevel-desaturation", R.bevelDesaturation);
|
|
4273
4159
|
}
|
|
4274
4160
|
get bevelLightAngle() {
|
|
4275
|
-
return this.getAttrFloat("bevel-light-angle",
|
|
4161
|
+
return this.getAttrFloat("bevel-light-angle", R.bevelLightAngle);
|
|
4276
4162
|
}
|
|
4277
4163
|
// Volumetric edge wall
|
|
4278
4164
|
get edgeThickness() {
|
|
4279
|
-
return this.getAttrFloat("edge-thickness",
|
|
4165
|
+
return this.getAttrFloat("edge-thickness", R.edgeThickness);
|
|
4280
4166
|
}
|
|
4281
4167
|
get edgeSpecular() {
|
|
4282
|
-
return this.getAttrFloat("edge-specular",
|
|
4168
|
+
return this.getAttrFloat("edge-specular", R.edgeSpecular);
|
|
4283
4169
|
}
|
|
4284
4170
|
get edgeColor() {
|
|
4285
|
-
return this.getAttrColor("edge-color",
|
|
4171
|
+
return this.getAttrColor("edge-color", R.edgeColor);
|
|
4286
4172
|
}
|
|
4287
4173
|
// Chamfer geometry
|
|
4288
4174
|
get chamferWidth() {
|
|
4289
|
-
return this.getAttrFloat("chamfer-width",
|
|
4175
|
+
return this.getAttrFloat("chamfer-width", R.chamferWidth);
|
|
4290
4176
|
}
|
|
4291
4177
|
get chamferAngle() {
|
|
4292
|
-
return this.getAttrFloat("chamfer-angle",
|
|
4178
|
+
return this.getAttrFloat("chamfer-angle", R.chamferAngle);
|
|
4293
4179
|
}
|
|
4294
4180
|
get chamferColor() {
|
|
4295
|
-
return this.getAttrColor("chamfer-color",
|
|
4181
|
+
return this.getAttrColor("chamfer-color", R.chamferColor);
|
|
4296
4182
|
}
|
|
4297
4183
|
get chamferAmbient() {
|
|
4298
|
-
return this.getAttrFloat("chamfer-ambient",
|
|
4184
|
+
return this.getAttrFloat("chamfer-ambient", R.chamferAmbient);
|
|
4299
4185
|
}
|
|
4300
4186
|
get chamferSpecular() {
|
|
4301
|
-
return this.getAttrFloat("chamfer-specular",
|
|
4187
|
+
return this.getAttrFloat("chamfer-specular", R.chamferSpecular);
|
|
4302
4188
|
}
|
|
4303
4189
|
get chamferShininess() {
|
|
4304
|
-
return this.getAttrFloat("chamfer-shininess",
|
|
4190
|
+
return this.getAttrFloat("chamfer-shininess", R.chamferShininess);
|
|
4305
4191
|
}
|
|
4306
4192
|
// Edge occlusion
|
|
4307
4193
|
get edgeOcclusionWidth() {
|
|
4308
|
-
return this.getAttrFloat("edge-occlusion-width",
|
|
4194
|
+
return this.getAttrFloat("edge-occlusion-width", R.edgeOcclusionWidth);
|
|
4309
4195
|
}
|
|
4310
4196
|
get edgeOcclusionStrength() {
|
|
4311
|
-
return this.getAttrFloat("edge-occlusion-strength",
|
|
4197
|
+
return this.getAttrFloat("edge-occlusion-strength", R.edgeOcclusionStrength);
|
|
4312
4198
|
}
|
|
4313
4199
|
get lightDirection3() {
|
|
4314
|
-
return this.getAttrVec3("light-direction",
|
|
4200
|
+
return this.getAttrVec3("light-direction", R.lightDirection);
|
|
4315
4201
|
}
|
|
4316
4202
|
get depthModel() {
|
|
4317
4203
|
return this.getAttribute("depth-model");
|
|
4318
4204
|
}
|
|
4319
4205
|
get shouldAutoplay() {
|
|
4320
|
-
return this.getAttrBool("autoplay",
|
|
4206
|
+
return this.getAttrBool("autoplay", R.autoplay);
|
|
4321
4207
|
}
|
|
4322
4208
|
get shouldLoop() {
|
|
4323
|
-
return this.getAttrBool("loop",
|
|
4209
|
+
return this.getAttrBool("loop", R.loop);
|
|
4324
4210
|
}
|
|
4325
4211
|
get shouldMute() {
|
|
4326
|
-
return this.getAttrBool("muted",
|
|
4212
|
+
return this.getAttrBool("muted", R.muted);
|
|
4327
4213
|
}
|
|
4328
4214
|
// --- Event dispatching ---
|
|
4329
4215
|
emit(t, e) {
|
|
@@ -4395,85 +4281,85 @@ class bt extends HTMLElement {
|
|
|
4395
4281
|
const n = this.sourceType === "camera", i = this.depthModel;
|
|
4396
4282
|
try {
|
|
4397
4283
|
let r, s, a, l = null;
|
|
4398
|
-
const
|
|
4399
|
-
this.emit("layershift-portal:model-progress",
|
|
4284
|
+
const c = (d) => {
|
|
4285
|
+
this.emit("layershift-portal:model-progress", d);
|
|
4400
4286
|
};
|
|
4401
4287
|
if (n) {
|
|
4402
|
-
const [
|
|
4403
|
-
|
|
4288
|
+
const [d, y] = await Promise.all([
|
|
4289
|
+
Nt(
|
|
4404
4290
|
{ video: { facingMode: "user" } },
|
|
4405
4291
|
{ parent: this.shadow }
|
|
4406
4292
|
),
|
|
4407
|
-
|
|
4293
|
+
Tt(e)
|
|
4408
4294
|
]);
|
|
4409
4295
|
if (t.aborted) {
|
|
4410
|
-
|
|
4296
|
+
d.dispose();
|
|
4411
4297
|
return;
|
|
4412
4298
|
}
|
|
4413
|
-
if (r =
|
|
4414
|
-
if (l = await
|
|
4299
|
+
if (r = d, a = y, i) {
|
|
4300
|
+
if (l = await ft(i, $, K, c), t.aborted) {
|
|
4415
4301
|
l.dispose(), r.dispose();
|
|
4416
4302
|
return;
|
|
4417
4303
|
}
|
|
4418
|
-
s =
|
|
4304
|
+
s = N($, K);
|
|
4419
4305
|
} else
|
|
4420
|
-
s =
|
|
4306
|
+
s = N(r.width, r.height);
|
|
4421
4307
|
} else {
|
|
4422
|
-
const
|
|
4423
|
-
if (
|
|
4424
|
-
const [
|
|
4425
|
-
|
|
4308
|
+
const d = this.getAttribute("src"), y = this.getAttribute("depth-src"), E = this.getAttribute("depth-meta"), b = !!y && !!E, p = this.sourceType === "image" || /\.(jpe?g|png|webp|gif|avif|bmp)(\?|$)/i.test(d);
|
|
4309
|
+
if (b) {
|
|
4310
|
+
const [v, m, T] = await Promise.all([
|
|
4311
|
+
p ? ht(d) : ct(d, {
|
|
4426
4312
|
parent: this.shadow,
|
|
4427
4313
|
loop: this.shouldLoop,
|
|
4428
4314
|
muted: this.shouldMute
|
|
4429
4315
|
}),
|
|
4430
|
-
|
|
4431
|
-
|
|
4316
|
+
Vt(y, E),
|
|
4317
|
+
Tt(e)
|
|
4432
4318
|
]);
|
|
4433
4319
|
if (t.aborted) {
|
|
4434
|
-
|
|
4320
|
+
v.dispose();
|
|
4435
4321
|
return;
|
|
4436
4322
|
}
|
|
4437
|
-
r =
|
|
4323
|
+
r = v, s = m, a = T;
|
|
4438
4324
|
} else if (i) {
|
|
4439
|
-
const [
|
|
4440
|
-
|
|
4325
|
+
const [v, m, T] = await Promise.all([
|
|
4326
|
+
p ? ht(d) : ct(d, {
|
|
4441
4327
|
parent: this.shadow,
|
|
4442
4328
|
loop: this.shouldLoop,
|
|
4443
4329
|
muted: this.shouldMute
|
|
4444
4330
|
}),
|
|
4445
|
-
|
|
4446
|
-
|
|
4331
|
+
ft(i, $, K, c),
|
|
4332
|
+
Tt(e)
|
|
4447
4333
|
]);
|
|
4448
4334
|
if (t.aborted) {
|
|
4449
|
-
|
|
4335
|
+
v.dispose(), m.dispose();
|
|
4450
4336
|
return;
|
|
4451
4337
|
}
|
|
4452
|
-
if (r =
|
|
4338
|
+
if (r = v, l = m, a = T, p || !r.isLive) {
|
|
4453
4339
|
const w = r.getImageSource();
|
|
4454
4340
|
if (w) {
|
|
4455
|
-
const
|
|
4341
|
+
const A = await l.submitFrameAndWait(w);
|
|
4456
4342
|
s = {
|
|
4457
|
-
meta: { frameCount: 1, fps: 1, width:
|
|
4458
|
-
frames: [
|
|
4343
|
+
meta: { frameCount: 1, fps: 1, width: $, height: K, sourceFps: 1 },
|
|
4344
|
+
frames: [A]
|
|
4459
4345
|
};
|
|
4460
4346
|
} else
|
|
4461
|
-
s =
|
|
4347
|
+
s = N($, K);
|
|
4462
4348
|
} else
|
|
4463
|
-
s =
|
|
4349
|
+
s = N($, K);
|
|
4464
4350
|
} else
|
|
4465
4351
|
throw new Error("Either depth-src/depth-meta or depth-model must be provided.");
|
|
4466
4352
|
}
|
|
4467
4353
|
this.source = r, this.depthEstimator = l, this.mesh = a, this.loopCount = 0, this.attachSourceEventListeners(r);
|
|
4468
|
-
const
|
|
4469
|
-
let
|
|
4354
|
+
const u = this.container?.clientWidth || r.width, f = this.parallaxMax / Math.max(u, 1);
|
|
4355
|
+
let h;
|
|
4470
4356
|
if (l)
|
|
4471
|
-
|
|
4357
|
+
h = () => l.getLatestDepth();
|
|
4472
4358
|
else {
|
|
4473
|
-
const
|
|
4474
|
-
|
|
4359
|
+
const d = new Bt(s);
|
|
4360
|
+
h = (y) => d.sample(y);
|
|
4475
4361
|
}
|
|
4476
|
-
const
|
|
4362
|
+
const x = {
|
|
4477
4363
|
parallaxStrength: f,
|
|
4478
4364
|
overscanPadding: this.overscan,
|
|
4479
4365
|
pomSteps: this.pomSteps,
|
|
@@ -4515,23 +4401,19 @@ class bt extends HTMLElement {
|
|
|
4515
4401
|
lightDirection: this.lightDirection3
|
|
4516
4402
|
};
|
|
4517
4403
|
if (t.aborted) return;
|
|
4518
|
-
this.renderer = new
|
|
4519
|
-
const
|
|
4404
|
+
this.renderer = new Je(this.container, x), this.renderer.initialize(r, s.meta.width, s.meta.height, a);
|
|
4405
|
+
const g = l;
|
|
4520
4406
|
if (this.renderer.start(
|
|
4521
4407
|
r,
|
|
4522
|
-
|
|
4523
|
-
() => {
|
|
4524
|
-
|
|
4525
|
-
|
|
4526
|
-
|
|
4527
|
-
|
|
4528
|
-
(x, y) => {
|
|
4529
|
-
if (P) {
|
|
4530
|
-
const d = r.getImageSource();
|
|
4531
|
-
d && P.submitFrame(d);
|
|
4408
|
+
h,
|
|
4409
|
+
() => ({ x: this._input.x, y: this._input.y }),
|
|
4410
|
+
(d, y) => {
|
|
4411
|
+
if (g) {
|
|
4412
|
+
const E = r.getImageSource();
|
|
4413
|
+
E && g.submitFrame(E);
|
|
4532
4414
|
}
|
|
4533
4415
|
this.emit("layershift-portal:frame", {
|
|
4534
|
-
currentTime:
|
|
4416
|
+
currentTime: d,
|
|
4535
4417
|
frameNumber: y
|
|
4536
4418
|
});
|
|
4537
4419
|
}
|
|
@@ -4553,16 +4435,10 @@ class bt extends HTMLElement {
|
|
|
4553
4435
|
}
|
|
4554
4436
|
// --- Cleanup ---
|
|
4555
4437
|
doDispose() {
|
|
4556
|
-
this.renderer?.dispose(), this.renderer = null, this.
|
|
4438
|
+
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;
|
|
4557
4439
|
}
|
|
4558
4440
|
}
|
|
4559
|
-
function
|
|
4560
|
-
return Math.min(e, Math.max(t, o));
|
|
4561
|
-
}
|
|
4562
|
-
function ct(o, t, e) {
|
|
4563
|
-
return o + (t - o) * e;
|
|
4564
|
-
}
|
|
4565
|
-
function Fn(o) {
|
|
4441
|
+
function Rn(o) {
|
|
4566
4442
|
const t = o.replace("#", "");
|
|
4567
4443
|
if (t.length === 3) {
|
|
4568
4444
|
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;
|
|
@@ -4574,9 +4450,110 @@ function Fn(o) {
|
|
|
4574
4450
|
}
|
|
4575
4451
|
return [0, 0, 0];
|
|
4576
4452
|
}
|
|
4577
|
-
|
|
4578
|
-
|
|
4453
|
+
function V(o, t, e) {
|
|
4454
|
+
return Math.min(e, Math.max(t, o));
|
|
4455
|
+
}
|
|
4456
|
+
function H(o, t, e) {
|
|
4457
|
+
return o + (t - o) * e;
|
|
4458
|
+
}
|
|
4459
|
+
const dt = 100, $t = 0.06;
|
|
4460
|
+
function Dn(o, t) {
|
|
4461
|
+
const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? 0.08;
|
|
4462
|
+
let r = 0, s = 0, a = 0, l = 0, c = 0, u = !0;
|
|
4463
|
+
const f = (g) => {
|
|
4464
|
+
const d = o.getBoundingClientRect(), y = (g.clientX - d.left) / d.width * 2 - 1, E = (g.clientY - d.top) / d.height * 2 - 1;
|
|
4465
|
+
r = V(y, -1, 1), s = V(E, -1, 1);
|
|
4466
|
+
}, h = () => {
|
|
4467
|
+
r = 0, s = 0;
|
|
4468
|
+
}, x = () => {
|
|
4469
|
+
u && (a = H(a, r, i), l = H(l, s, i), o.input = { x: a * e, y: l * n }, c = requestAnimationFrame(x));
|
|
4470
|
+
};
|
|
4471
|
+
return o.addEventListener("mousemove", f), o.addEventListener("mouseleave", h), c = requestAnimationFrame(x), () => {
|
|
4472
|
+
u = !1, cancelAnimationFrame(c), o.removeEventListener("mousemove", f), o.removeEventListener("mouseleave", h);
|
|
4473
|
+
};
|
|
4474
|
+
}
|
|
4475
|
+
function Pn(o, t) {
|
|
4476
|
+
const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? 0.08;
|
|
4477
|
+
let r = 0, s = 0, a = 0, l = 0, c = 0, u = 0, f = 0, h = !0;
|
|
4478
|
+
const x = (E) => {
|
|
4479
|
+
const b = E.touches[0];
|
|
4480
|
+
b && (c = b.clientX, u = b.clientY, r = 0, s = 0);
|
|
4481
|
+
}, g = (E) => {
|
|
4482
|
+
const b = E.touches[0];
|
|
4483
|
+
if (!b) return;
|
|
4484
|
+
const p = b.clientX - c, v = b.clientY - u;
|
|
4485
|
+
r = V(p / dt, -1, 1), s = V(v / dt, -1, 1);
|
|
4486
|
+
}, d = () => {
|
|
4487
|
+
r = 0, s = 0;
|
|
4488
|
+
}, y = () => {
|
|
4489
|
+
h && (a = H(a, r, i), l = H(l, s, i), o.input = { x: a * e, y: l * n }, f = requestAnimationFrame(y));
|
|
4490
|
+
};
|
|
4491
|
+
return o.addEventListener("touchstart", x, { passive: !0 }), o.addEventListener("touchmove", g, { passive: !0 }), o.addEventListener("touchend", d, { passive: !0 }), o.addEventListener("touchcancel", d, { passive: !0 }), f = requestAnimationFrame(y), () => {
|
|
4492
|
+
h = !1, cancelAnimationFrame(f), o.removeEventListener("touchstart", x), o.removeEventListener("touchmove", g), o.removeEventListener("touchend", d), o.removeEventListener("touchcancel", d);
|
|
4493
|
+
};
|
|
4494
|
+
}
|
|
4495
|
+
function Fn(o, t) {
|
|
4496
|
+
const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? $t;
|
|
4497
|
+
let r = 0, s = 0, a = 0, l = 0, c = 0, u = !0, f = !1;
|
|
4498
|
+
const h = (y) => {
|
|
4499
|
+
r = V((y.gamma ?? 0) / 45, -1, 1), s = V((y.beta ?? 0) / 45, -1, 1);
|
|
4500
|
+
}, x = () => {
|
|
4501
|
+
u && (a = H(a, r, i), l = H(l, s, i), o.input = { x: a * e, y: l * n }, c = requestAnimationFrame(x));
|
|
4502
|
+
}, g = () => {
|
|
4503
|
+
u && !f && (window.addEventListener("deviceorientation", h), f = !0);
|
|
4504
|
+
}, d = DeviceOrientationEvent;
|
|
4505
|
+
return typeof d.requestPermission == "function" ? d.requestPermission().then((y) => {
|
|
4506
|
+
y === "granted" && g();
|
|
4507
|
+
}).catch(() => {
|
|
4508
|
+
}) : g(), c = requestAnimationFrame(x), () => {
|
|
4509
|
+
u = !1, cancelAnimationFrame(c), f && (window.removeEventListener("deviceorientation", h), f = !1);
|
|
4510
|
+
};
|
|
4511
|
+
}
|
|
4512
|
+
function Cn(o, t) {
|
|
4513
|
+
const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? 0.08, r = t?.lerpFactor ?? $t;
|
|
4514
|
+
let s = 0, a = 0, l = 0, c = 0, u = 0, f = 0, h = 0, x = 0, g = !1, d = !1, y = !1, E = 0, b = 0, p = 0, v = !0;
|
|
4515
|
+
const m = (S) => {
|
|
4516
|
+
const F = o.getBoundingClientRect(), U = (S.clientX - F.left) / F.width * 2 - 1, M = (S.clientY - F.top) / F.height * 2 - 1;
|
|
4517
|
+
s = V(U, -1, 1), a = V(M, -1, 1);
|
|
4518
|
+
}, T = () => {
|
|
4519
|
+
s = 0, a = 0;
|
|
4520
|
+
}, w = (S) => {
|
|
4521
|
+
const F = S.touches[0];
|
|
4522
|
+
F && (g = !0, E = F.clientX, b = F.clientY, l = 0, c = 0, !d && !y && I());
|
|
4523
|
+
}, A = (S) => {
|
|
4524
|
+
const F = S.touches[0];
|
|
4525
|
+
if (!F) return;
|
|
4526
|
+
const U = F.clientX - E, M = F.clientY - b;
|
|
4527
|
+
l = V(U / dt, -1, 1), c = V(M / dt, -1, 1);
|
|
4528
|
+
}, D = () => {
|
|
4529
|
+
g = !1, l = 0, c = 0;
|
|
4530
|
+
}, P = (S) => {
|
|
4531
|
+
u = V((S.gamma ?? 0) / 45, -1, 1), f = V((S.beta ?? 0) / 45, -1, 1);
|
|
4532
|
+
}, _ = () => {
|
|
4533
|
+
v && !y && (window.addEventListener("deviceorientation", P), y = !0, d = !0);
|
|
4534
|
+
}, I = () => {
|
|
4535
|
+
if (typeof DeviceOrientationEvent > "u") return;
|
|
4536
|
+
const S = DeviceOrientationEvent;
|
|
4537
|
+
typeof S.requestPermission == "function" ? S.requestPermission().then((F) => {
|
|
4538
|
+
F === "granted" && _();
|
|
4539
|
+
}).catch(() => {
|
|
4540
|
+
}) : _();
|
|
4541
|
+
}, C = () => {
|
|
4542
|
+
if (!v) return;
|
|
4543
|
+
let S, F, U;
|
|
4544
|
+
g ? (S = l, F = c, U = i) : d ? (S = u, F = f, U = r) : (S = s, F = a, U = i), h = H(h, S, U), x = H(x, F, U), o.input = { x: h * e, y: x * n }, p = requestAnimationFrame(C);
|
|
4545
|
+
};
|
|
4546
|
+
return o.addEventListener("mousemove", m), o.addEventListener("mouseleave", T), o.addEventListener("touchstart", w, { passive: !0 }), o.addEventListener("touchmove", A, { passive: !0 }), o.addEventListener("touchend", D, { passive: !0 }), o.addEventListener("touchcancel", D, { passive: !0 }), p = requestAnimationFrame(C), () => {
|
|
4547
|
+
v = !1, cancelAnimationFrame(p), o.removeEventListener("mousemove", m), o.removeEventListener("mouseleave", T), o.removeEventListener("touchstart", w), o.removeEventListener("touchmove", A), o.removeEventListener("touchend", D), o.removeEventListener("touchcancel", D), y && (window.removeEventListener("deviceorientation", P), y = !1);
|
|
4548
|
+
};
|
|
4549
|
+
}
|
|
4550
|
+
customElements.get(xt.TAG_NAME) || customElements.define(xt.TAG_NAME, xt);
|
|
4551
|
+
customElements.get(Et.TAG_NAME) || customElements.define(Et.TAG_NAME, Et);
|
|
4579
4552
|
export {
|
|
4580
|
-
|
|
4581
|
-
|
|
4553
|
+
xt as LayershiftElement,
|
|
4554
|
+
Et as LayershiftPortalElement,
|
|
4555
|
+
Fn as connectGyro,
|
|
4556
|
+
Dn as connectMouse,
|
|
4557
|
+
Cn as connectPointer,
|
|
4558
|
+
Pn as connectTouch
|
|
4582
4559
|
};
|