5453 lines
219 KiB
JavaScript
5453 lines
219 KiB
JavaScript
/*
|
||
* Extracted from browser-delivered Turbopack chunk: fd0220e4d10052af.701bdafa2d.js
|
||
* Module id: 117313
|
||
* For reading/searching only; this factory depends on the original Turbopack runtime.
|
||
*/
|
||
|
||
const moduleFactory = (e) => {
|
||
"use strict";
|
||
var t = e.i(462214),
|
||
n = e.i(358379),
|
||
i = e.i(111558),
|
||
r = e.i(403094),
|
||
a = e.i(983912),
|
||
o = e.i(292002),
|
||
s = e.i(768924),
|
||
c = e.i(888255),
|
||
l = e.i(968620),
|
||
u = e.i(470647),
|
||
h = e.i(415796),
|
||
f = e.i(85614),
|
||
d = e.i(867734),
|
||
p = e.i(282932),
|
||
g = e.i(755636),
|
||
b = e.i(33830),
|
||
m = e.i(435719),
|
||
w = e.i(41671),
|
||
v = e.i(777784),
|
||
x = e.i(45523),
|
||
y = e.i(722573),
|
||
_ = e.i(395),
|
||
S = e.i(876722),
|
||
E = e.i(184656),
|
||
M = e.i(184299),
|
||
T = e.i(877497),
|
||
k = e.i(772e3);
|
||
e.i(204347);
|
||
var C = e.i(317286),
|
||
A = e.i(703962),
|
||
N = e.i(505e3),
|
||
I = e.i(713118),
|
||
P = e.i(799545),
|
||
R = e.i(182004),
|
||
L = e.i(500724),
|
||
D = e.i(606095),
|
||
j = e.i(299750),
|
||
O = e.i(733077),
|
||
F = e.i(562530),
|
||
U = e.i(216257),
|
||
B = e.i(929286),
|
||
H = e.i(791997),
|
||
z = e.i(747569),
|
||
G = e.i(961258),
|
||
$ = e.i(41114),
|
||
V = e.i(135623),
|
||
W = e.i(168823),
|
||
K = e.i(664115),
|
||
q = e.i(295085),
|
||
X = e.i(528225),
|
||
Y = e.i(437425),
|
||
J = e.i(10036);
|
||
e.i(954175);
|
||
var Z = e.i(616803),
|
||
Q = e.i(301710),
|
||
ee = e.i(111581),
|
||
et = e.i(981493),
|
||
en = e.i(233038),
|
||
ei = e.i(649342),
|
||
er = e.i(44980),
|
||
ea = e.i(275704),
|
||
eo = e.i(15146),
|
||
es = e.i(689749),
|
||
ec = e.i(306677),
|
||
el = e.i(154891),
|
||
eu = e.i(717139),
|
||
eh = e.i(36108),
|
||
ef = e.i(464025),
|
||
ed = e.i(329931),
|
||
ep = e.i(316925),
|
||
eg = e.i(959248),
|
||
eb = e.i(380332),
|
||
em = e.i(710871),
|
||
ew = e.i(260561),
|
||
ev = e.i(124821),
|
||
ex = e.i(23027),
|
||
ey = ex;
|
||
let e_ = { type: "change" },
|
||
eS = { type: "start" },
|
||
eE = { type: "end" },
|
||
eM = new ey.Ray(),
|
||
eT = new ey.Plane(),
|
||
ek = Math.cos(70 * ey.MathUtils.DEG2RAD);
|
||
class eC extends ey.EventDispatcher {
|
||
constructor(e, t) {
|
||
super(),
|
||
(this.object = e),
|
||
(this.domElement = t),
|
||
(this.domElement.style.touchAction = "none"),
|
||
(this.enabled = !0),
|
||
(this.target = new ey.Vector3()),
|
||
(this.cursor = new ey.Vector3()),
|
||
(this.minDistance = 0),
|
||
(this.maxDistance = 1 / 0),
|
||
(this.minZoom = 0),
|
||
(this.maxZoom = 1 / 0),
|
||
(this.minTargetRadius = 0),
|
||
(this.maxTargetRadius = 1 / 0),
|
||
(this.minPolarAngle = 0),
|
||
(this.maxPolarAngle = Math.PI),
|
||
(this.minAzimuthAngle = -1 / 0),
|
||
(this.maxAzimuthAngle = 1 / 0),
|
||
(this.enableDamping = !1),
|
||
(this.dampingFactor = 0.05),
|
||
(this.enableZoom = !0),
|
||
(this.zoomSpeed = 1),
|
||
(this.enableRotate = !0),
|
||
(this.rotateSpeed = 1),
|
||
(this.enablePan = !0),
|
||
(this.panSpeed = 1),
|
||
(this.screenSpacePanning = !0),
|
||
(this.keyPanSpeed = 7),
|
||
(this.zoomToCursor = !1),
|
||
(this.autoRotate = !1),
|
||
(this.autoRotateSpeed = 2),
|
||
(this.keys = {
|
||
LEFT: "ArrowLeft",
|
||
UP: "ArrowUp",
|
||
RIGHT: "ArrowRight",
|
||
BOTTOM: "ArrowDown",
|
||
}),
|
||
(this.mouseButtons = {
|
||
LEFT: ey.MOUSE.ROTATE,
|
||
MIDDLE: ey.MOUSE.DOLLY,
|
||
RIGHT: ey.MOUSE.PAN,
|
||
}),
|
||
(this.touches = { ONE: ey.TOUCH.ROTATE, TWO: ey.TOUCH.DOLLY_PAN }),
|
||
(this.target0 = this.target.clone()),
|
||
(this.position0 = this.object.position.clone()),
|
||
(this.zoom0 = this.object.zoom),
|
||
(this._domElementKeyEvents = null),
|
||
(this.getPolarAngle = function () {
|
||
return o.phi;
|
||
}),
|
||
(this.getAzimuthalAngle = function () {
|
||
return o.theta;
|
||
}),
|
||
(this.getDistance = function () {
|
||
return this.object.position.distanceTo(this.target);
|
||
}),
|
||
(this.listenToKeyEvents = function (e) {
|
||
e.addEventListener("keydown", W), (this._domElementKeyEvents = e);
|
||
}),
|
||
(this.stopListenToKeyEvents = function () {
|
||
this._domElementKeyEvents.removeEventListener("keydown", W),
|
||
(this._domElementKeyEvents = null);
|
||
}),
|
||
(this.saveState = function () {
|
||
n.target0.copy(n.target),
|
||
n.position0.copy(n.object.position),
|
||
(n.zoom0 = n.object.zoom);
|
||
}),
|
||
(this.reset = function () {
|
||
n.target.copy(n.target0),
|
||
n.object.position.copy(n.position0),
|
||
(n.object.zoom = n.zoom0),
|
||
n.object.updateProjectionMatrix(),
|
||
n.dispatchEvent(e_),
|
||
n.update(),
|
||
(r = i.NONE);
|
||
}),
|
||
(this.update = (function () {
|
||
let t = new ey.Vector3(),
|
||
u = new ey.Quaternion().setFromUnitVectors(
|
||
e.up,
|
||
new ey.Vector3(0, 1, 0),
|
||
),
|
||
h = u.clone().invert(),
|
||
f = new ey.Vector3(),
|
||
d = new ey.Quaternion(),
|
||
p = new ey.Vector3(),
|
||
g = 2 * Math.PI;
|
||
return function (b = null) {
|
||
var m;
|
||
let w = n.object.position;
|
||
t.copy(w).sub(n.target),
|
||
t.applyQuaternion(u),
|
||
o.setFromVector3(t),
|
||
n.autoRotate &&
|
||
r === i.NONE &&
|
||
M(
|
||
null !== (m = b)
|
||
? ((2 * Math.PI) / 60) * n.autoRotateSpeed * m
|
||
: ((2 * Math.PI) / 60 / 60) * n.autoRotateSpeed,
|
||
),
|
||
n.enableDamping
|
||
? ((o.theta += s.theta * n.dampingFactor),
|
||
(o.phi += s.phi * n.dampingFactor))
|
||
: ((o.theta += s.theta), (o.phi += s.phi));
|
||
let _ = n.minAzimuthAngle,
|
||
S = n.maxAzimuthAngle;
|
||
isFinite(_) &&
|
||
isFinite(S) &&
|
||
(_ < -Math.PI ? (_ += g) : _ > Math.PI && (_ -= g),
|
||
S < -Math.PI ? (S += g) : S > Math.PI && (S -= g),
|
||
_ <= S
|
||
? (o.theta = Math.max(_, Math.min(S, o.theta)))
|
||
: (o.theta =
|
||
o.theta > (_ + S) / 2
|
||
? Math.max(_, o.theta)
|
||
: Math.min(S, o.theta))),
|
||
(o.phi = Math.max(
|
||
n.minPolarAngle,
|
||
Math.min(n.maxPolarAngle, o.phi),
|
||
)),
|
||
o.makeSafe(),
|
||
!0 === n.enableDamping
|
||
? n.target.addScaledVector(l, n.dampingFactor)
|
||
: n.target.add(l),
|
||
n.target.sub(n.cursor),
|
||
n.target.clampLength(n.minTargetRadius, n.maxTargetRadius),
|
||
n.target.add(n.cursor),
|
||
(n.zoomToCursor && y) || n.object.isOrthographicCamera
|
||
? (o.radius = R(o.radius))
|
||
: (o.radius = R(o.radius * c)),
|
||
t.setFromSpherical(o),
|
||
t.applyQuaternion(h),
|
||
w.copy(n.target).add(t),
|
||
n.object.lookAt(n.target),
|
||
!0 === n.enableDamping
|
||
? ((s.theta *= 1 - n.dampingFactor),
|
||
(s.phi *= 1 - n.dampingFactor),
|
||
l.multiplyScalar(1 - n.dampingFactor))
|
||
: (s.set(0, 0, 0), l.set(0, 0, 0));
|
||
let E = !1;
|
||
if (n.zoomToCursor && y) {
|
||
let i = null;
|
||
if (n.object.isPerspectiveCamera) {
|
||
let e = t.length();
|
||
i = R(e * c);
|
||
let r = e - i;
|
||
n.object.position.addScaledVector(v, r),
|
||
n.object.updateMatrixWorld();
|
||
} else if (n.object.isOrthographicCamera) {
|
||
let e = new ey.Vector3(x.x, x.y, 0);
|
||
e.unproject(n.object),
|
||
(n.object.zoom = Math.max(
|
||
n.minZoom,
|
||
Math.min(n.maxZoom, n.object.zoom / c),
|
||
)),
|
||
n.object.updateProjectionMatrix(),
|
||
(E = !0);
|
||
let r = new ey.Vector3(x.x, x.y, 0);
|
||
r.unproject(n.object),
|
||
n.object.position.sub(r).add(e),
|
||
n.object.updateMatrixWorld(),
|
||
(i = t.length());
|
||
} else
|
||
console.warn(
|
||
"WARNING: OrbitControls.js encountered an unknown camera type - zoom to cursor disabled.",
|
||
),
|
||
(n.zoomToCursor = !1);
|
||
null !== i &&
|
||
(this.screenSpacePanning
|
||
? n.target
|
||
.set(0, 0, -1)
|
||
.transformDirection(n.object.matrix)
|
||
.multiplyScalar(i)
|
||
.add(n.object.position)
|
||
: (eM.origin.copy(n.object.position),
|
||
eM.direction
|
||
.set(0, 0, -1)
|
||
.transformDirection(n.object.matrix),
|
||
Math.abs(n.object.up.dot(eM.direction)) < ek
|
||
? e.lookAt(n.target)
|
||
: (eT.setFromNormalAndCoplanarPoint(
|
||
n.object.up,
|
||
n.target,
|
||
),
|
||
eM.intersectPlane(eT, n.target))));
|
||
} else
|
||
n.object.isOrthographicCamera &&
|
||
((n.object.zoom = Math.max(
|
||
n.minZoom,
|
||
Math.min(n.maxZoom, n.object.zoom / c),
|
||
)),
|
||
n.object.updateProjectionMatrix(),
|
||
(E = !0));
|
||
return (
|
||
(c = 1),
|
||
(y = !1),
|
||
!!(
|
||
E ||
|
||
f.distanceToSquared(n.object.position) > a ||
|
||
8 * (1 - d.dot(n.object.quaternion)) > a ||
|
||
p.distanceToSquared(n.target) > 0
|
||
) &&
|
||
(n.dispatchEvent(e_),
|
||
f.copy(n.object.position),
|
||
d.copy(n.object.quaternion),
|
||
p.copy(n.target),
|
||
!0)
|
||
);
|
||
};
|
||
})()),
|
||
(this.dispose = function () {
|
||
n.domElement.removeEventListener("contextmenu", K),
|
||
n.domElement.removeEventListener("pointerdown", z),
|
||
n.domElement.removeEventListener("pointercancel", $),
|
||
n.domElement.removeEventListener("wheel", V),
|
||
n.domElement.removeEventListener("pointermove", G),
|
||
n.domElement.removeEventListener("pointerup", $),
|
||
null !== n._domElementKeyEvents &&
|
||
(n._domElementKeyEvents.removeEventListener("keydown", W),
|
||
(n._domElementKeyEvents = null));
|
||
});
|
||
const n = this,
|
||
i = {
|
||
NONE: -1,
|
||
ROTATE: 0,
|
||
DOLLY: 1,
|
||
PAN: 2,
|
||
TOUCH_ROTATE: 3,
|
||
TOUCH_PAN: 4,
|
||
TOUCH_DOLLY_PAN: 5,
|
||
TOUCH_DOLLY_ROTATE: 6,
|
||
};
|
||
let r = i.NONE;
|
||
const a = 1e-6,
|
||
o = new ey.Spherical(),
|
||
s = new ey.Spherical();
|
||
let c = 1;
|
||
const l = new ey.Vector3(),
|
||
u = new ey.Vector2(),
|
||
h = new ey.Vector2(),
|
||
f = new ey.Vector2(),
|
||
d = new ey.Vector2(),
|
||
p = new ey.Vector2(),
|
||
g = new ey.Vector2(),
|
||
b = new ey.Vector2(),
|
||
m = new ey.Vector2(),
|
||
w = new ey.Vector2(),
|
||
v = new ey.Vector3(),
|
||
x = new ey.Vector2();
|
||
let y = !1;
|
||
const _ = [],
|
||
S = {};
|
||
function E() {
|
||
return Math.pow(0.95, n.zoomSpeed);
|
||
}
|
||
function M(e) {
|
||
s.theta -= e;
|
||
}
|
||
function T(e) {
|
||
s.phi -= e;
|
||
}
|
||
const k = (function () {
|
||
let e = new ey.Vector3();
|
||
return function (t, n) {
|
||
e.setFromMatrixColumn(n, 0), e.multiplyScalar(-t), l.add(e);
|
||
};
|
||
})(),
|
||
C = (function () {
|
||
let e = new ey.Vector3();
|
||
return function (t, i) {
|
||
!0 === n.screenSpacePanning
|
||
? e.setFromMatrixColumn(i, 1)
|
||
: (e.setFromMatrixColumn(i, 0), e.crossVectors(n.object.up, e)),
|
||
e.multiplyScalar(t),
|
||
l.add(e);
|
||
};
|
||
})(),
|
||
A = (function () {
|
||
let e = new ey.Vector3();
|
||
return function (t, i) {
|
||
let r = n.domElement;
|
||
if (n.object.isPerspectiveCamera) {
|
||
let a = n.object.position;
|
||
e.copy(a).sub(n.target);
|
||
let o = e.length();
|
||
k(
|
||
(2 *
|
||
t *
|
||
(o *= Math.tan(((n.object.fov / 2) * Math.PI) / 180))) /
|
||
r.clientHeight,
|
||
n.object.matrix,
|
||
),
|
||
C((2 * i * o) / r.clientHeight, n.object.matrix);
|
||
} else
|
||
n.object.isOrthographicCamera
|
||
? (k(
|
||
(t * (n.object.right - n.object.left)) /
|
||
n.object.zoom /
|
||
r.clientWidth,
|
||
n.object.matrix,
|
||
),
|
||
C(
|
||
(i * (n.object.top - n.object.bottom)) /
|
||
n.object.zoom /
|
||
r.clientHeight,
|
||
n.object.matrix,
|
||
))
|
||
: (console.warn(
|
||
"WARNING: OrbitControls.js encountered an unknown camera type - pan disabled.",
|
||
),
|
||
(n.enablePan = !1));
|
||
};
|
||
})();
|
||
function N(e) {
|
||
n.object.isPerspectiveCamera || n.object.isOrthographicCamera
|
||
? (c /= e)
|
||
: (console.warn(
|
||
"WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled.",
|
||
),
|
||
(n.enableZoom = !1));
|
||
}
|
||
function I(e) {
|
||
n.object.isPerspectiveCamera || n.object.isOrthographicCamera
|
||
? (c *= e)
|
||
: (console.warn(
|
||
"WARNING: OrbitControls.js encountered an unknown camera type - dolly/zoom disabled.",
|
||
),
|
||
(n.enableZoom = !1));
|
||
}
|
||
function P(e) {
|
||
if (!n.zoomToCursor) return;
|
||
y = !0;
|
||
let t = n.domElement.getBoundingClientRect(),
|
||
i = e.clientX - t.left,
|
||
r = e.clientY - t.top,
|
||
a = t.width,
|
||
o = t.height;
|
||
(x.x = (i / a) * 2 - 1),
|
||
(x.y = -((r / o) * 2) + 1),
|
||
v
|
||
.set(x.x, x.y, 1)
|
||
.unproject(n.object)
|
||
.sub(n.object.position)
|
||
.normalize();
|
||
}
|
||
function R(e) {
|
||
return Math.max(n.minDistance, Math.min(n.maxDistance, e));
|
||
}
|
||
function L(e) {
|
||
u.set(e.clientX, e.clientY);
|
||
}
|
||
function D(e) {
|
||
d.set(e.clientX, e.clientY);
|
||
}
|
||
function j() {
|
||
if (1 === _.length) u.set(_[0].pageX, _[0].pageY);
|
||
else {
|
||
let e = 0.5 * (_[0].pageX + _[1].pageX),
|
||
t = 0.5 * (_[0].pageY + _[1].pageY);
|
||
u.set(e, t);
|
||
}
|
||
}
|
||
function O() {
|
||
if (1 === _.length) d.set(_[0].pageX, _[0].pageY);
|
||
else {
|
||
let e = 0.5 * (_[0].pageX + _[1].pageX),
|
||
t = 0.5 * (_[0].pageY + _[1].pageY);
|
||
d.set(e, t);
|
||
}
|
||
}
|
||
function F() {
|
||
let e = _[0].pageX - _[1].pageX,
|
||
t = _[0].pageY - _[1].pageY,
|
||
n = Math.sqrt(e * e + t * t);
|
||
b.set(0, n);
|
||
}
|
||
function U(e) {
|
||
if (1 == _.length) h.set(e.pageX, e.pageY);
|
||
else {
|
||
let t = X(e),
|
||
n = 0.5 * (e.pageX + t.x),
|
||
i = 0.5 * (e.pageY + t.y);
|
||
h.set(n, i);
|
||
}
|
||
f.subVectors(h, u).multiplyScalar(n.rotateSpeed);
|
||
let t = n.domElement;
|
||
M((2 * Math.PI * f.x) / t.clientHeight),
|
||
T((2 * Math.PI * f.y) / t.clientHeight),
|
||
u.copy(h);
|
||
}
|
||
function B(e) {
|
||
if (1 === _.length) p.set(e.pageX, e.pageY);
|
||
else {
|
||
let t = X(e),
|
||
n = 0.5 * (e.pageX + t.x),
|
||
i = 0.5 * (e.pageY + t.y);
|
||
p.set(n, i);
|
||
}
|
||
g.subVectors(p, d).multiplyScalar(n.panSpeed), A(g.x, g.y), d.copy(p);
|
||
}
|
||
function H(e) {
|
||
let t = X(e),
|
||
i = e.pageX - t.x,
|
||
r = e.pageY - t.y,
|
||
a = Math.sqrt(i * i + r * r);
|
||
m.set(0, a),
|
||
w.set(0, Math.pow(m.y / b.y, n.zoomSpeed)),
|
||
N(w.y),
|
||
b.copy(m);
|
||
}
|
||
function z(e) {
|
||
var t;
|
||
!1 !== n.enabled &&
|
||
(0 === _.length &&
|
||
(n.domElement.setPointerCapture(e.pointerId),
|
||
n.domElement.addEventListener("pointermove", G),
|
||
n.domElement.addEventListener("pointerup", $)),
|
||
(t = e),
|
||
_.push(t),
|
||
"touch" === e.pointerType
|
||
? (function (e) {
|
||
switch ((q(e), _.length)) {
|
||
case 1:
|
||
switch (n.touches.ONE) {
|
||
case ey.TOUCH.ROTATE:
|
||
if (!1 === n.enableRotate) return;
|
||
j(), (r = i.TOUCH_ROTATE);
|
||
break;
|
||
case ey.TOUCH.PAN:
|
||
if (!1 === n.enablePan) return;
|
||
O(), (r = i.TOUCH_PAN);
|
||
break;
|
||
default:
|
||
r = i.NONE;
|
||
}
|
||
break;
|
||
case 2:
|
||
switch (n.touches.TWO) {
|
||
case ey.TOUCH.DOLLY_PAN:
|
||
if (!1 === n.enableZoom && !1 === n.enablePan) return;
|
||
n.enableZoom && F(),
|
||
n.enablePan && O(),
|
||
(r = i.TOUCH_DOLLY_PAN);
|
||
break;
|
||
case ey.TOUCH.DOLLY_ROTATE:
|
||
if (!1 === n.enableZoom && !1 === n.enableRotate)
|
||
return;
|
||
n.enableZoom && F(),
|
||
n.enableRotate && j(),
|
||
(r = i.TOUCH_DOLLY_ROTATE);
|
||
break;
|
||
default:
|
||
r = i.NONE;
|
||
}
|
||
break;
|
||
default:
|
||
r = i.NONE;
|
||
}
|
||
r !== i.NONE && n.dispatchEvent(eS);
|
||
})(e)
|
||
: (function (e) {
|
||
let t;
|
||
switch (e.button) {
|
||
case 0:
|
||
t = n.mouseButtons.LEFT;
|
||
break;
|
||
case 1:
|
||
t = n.mouseButtons.MIDDLE;
|
||
break;
|
||
case 2:
|
||
t = n.mouseButtons.RIGHT;
|
||
break;
|
||
default:
|
||
t = -1;
|
||
}
|
||
switch (t) {
|
||
case ey.MOUSE.DOLLY:
|
||
if (!1 === n.enableZoom) return;
|
||
P(e), b.set(e.clientX, e.clientY), (r = i.DOLLY);
|
||
break;
|
||
case ey.MOUSE.ROTATE:
|
||
if (e.ctrlKey || e.metaKey || e.shiftKey) {
|
||
if (!1 === n.enablePan) return;
|
||
D(e), (r = i.PAN);
|
||
} else {
|
||
if (!1 === n.enableRotate) return;
|
||
L(e), (r = i.ROTATE);
|
||
}
|
||
break;
|
||
case ey.MOUSE.PAN:
|
||
if (e.ctrlKey || e.metaKey || e.shiftKey) {
|
||
if (!1 === n.enableRotate) return;
|
||
L(e), (r = i.ROTATE);
|
||
} else {
|
||
if (!1 === n.enablePan) return;
|
||
D(e), (r = i.PAN);
|
||
}
|
||
break;
|
||
default:
|
||
r = i.NONE;
|
||
}
|
||
r !== i.NONE && n.dispatchEvent(eS);
|
||
})(e));
|
||
}
|
||
function G(e) {
|
||
!1 !== n.enabled &&
|
||
("touch" === e.pointerType
|
||
? (function (e) {
|
||
switch ((q(e), r)) {
|
||
case i.TOUCH_ROTATE:
|
||
if (!1 === n.enableRotate) return;
|
||
U(e), n.update();
|
||
break;
|
||
case i.TOUCH_PAN:
|
||
if (!1 === n.enablePan) return;
|
||
B(e), n.update();
|
||
break;
|
||
case i.TOUCH_DOLLY_PAN:
|
||
if (!1 === n.enableZoom && !1 === n.enablePan) return;
|
||
n.enableZoom && H(e), n.enablePan && B(e), n.update();
|
||
break;
|
||
case i.TOUCH_DOLLY_ROTATE:
|
||
if (!1 === n.enableZoom && !1 === n.enableRotate) return;
|
||
n.enableZoom && H(e), n.enableRotate && U(e), n.update();
|
||
break;
|
||
default:
|
||
r = i.NONE;
|
||
}
|
||
})(e)
|
||
: (function (e) {
|
||
switch (r) {
|
||
case i.ROTATE:
|
||
let t;
|
||
if (!1 === n.enableRotate) return;
|
||
h.set(e.clientX, e.clientY),
|
||
f.subVectors(h, u).multiplyScalar(n.rotateSpeed),
|
||
(t = n.domElement),
|
||
M((2 * Math.PI * f.x) / t.clientHeight),
|
||
T((2 * Math.PI * f.y) / t.clientHeight),
|
||
u.copy(h),
|
||
n.update();
|
||
break;
|
||
case i.DOLLY:
|
||
if (!1 === n.enableZoom) return;
|
||
m.set(e.clientX, e.clientY),
|
||
w.subVectors(m, b),
|
||
w.y > 0 ? N(E()) : w.y < 0 && I(E()),
|
||
b.copy(m),
|
||
n.update();
|
||
break;
|
||
case i.PAN:
|
||
if (!1 === n.enablePan) return;
|
||
p.set(e.clientX, e.clientY),
|
||
g.subVectors(p, d).multiplyScalar(n.panSpeed),
|
||
A(g.x, g.y),
|
||
d.copy(p),
|
||
n.update();
|
||
}
|
||
})(e));
|
||
}
|
||
function $(e) {
|
||
(function (e) {
|
||
delete S[e.pointerId];
|
||
for (let t = 0; t < _.length; t++)
|
||
if (_[t].pointerId == e.pointerId) return void _.splice(t, 1);
|
||
})(e),
|
||
0 === _.length &&
|
||
(n.domElement.releasePointerCapture(e.pointerId),
|
||
n.domElement.removeEventListener("pointermove", G),
|
||
n.domElement.removeEventListener("pointerup", $)),
|
||
n.dispatchEvent(eE),
|
||
(r = i.NONE);
|
||
}
|
||
function V(e) {
|
||
!1 !== n.enabled &&
|
||
!1 !== n.enableZoom &&
|
||
r === i.NONE &&
|
||
(e.preventDefault(),
|
||
n.dispatchEvent(eS),
|
||
P(e),
|
||
e.deltaY < 0 ? I(E()) : e.deltaY > 0 && N(E()),
|
||
n.update(),
|
||
n.dispatchEvent(eE));
|
||
}
|
||
function W(e) {
|
||
if (!1 !== n.enabled && !1 !== n.enablePan) {
|
||
let t = !1;
|
||
switch (e.code) {
|
||
case n.keys.UP:
|
||
e.ctrlKey || e.metaKey || e.shiftKey
|
||
? T((2 * Math.PI * n.rotateSpeed) / n.domElement.clientHeight)
|
||
: A(0, n.keyPanSpeed),
|
||
(t = !0);
|
||
break;
|
||
case n.keys.BOTTOM:
|
||
e.ctrlKey || e.metaKey || e.shiftKey
|
||
? T(
|
||
(-2 * Math.PI * n.rotateSpeed) /
|
||
n.domElement.clientHeight,
|
||
)
|
||
: A(0, -n.keyPanSpeed),
|
||
(t = !0);
|
||
break;
|
||
case n.keys.LEFT:
|
||
e.ctrlKey || e.metaKey || e.shiftKey
|
||
? M((2 * Math.PI * n.rotateSpeed) / n.domElement.clientHeight)
|
||
: A(n.keyPanSpeed, 0),
|
||
(t = !0);
|
||
break;
|
||
case n.keys.RIGHT:
|
||
e.ctrlKey || e.metaKey || e.shiftKey
|
||
? M(
|
||
(-2 * Math.PI * n.rotateSpeed) /
|
||
n.domElement.clientHeight,
|
||
)
|
||
: A(-n.keyPanSpeed, 0),
|
||
(t = !0);
|
||
}
|
||
t && (e.preventDefault(), n.update());
|
||
}
|
||
}
|
||
function K(e) {
|
||
!1 !== n.enabled && e.preventDefault();
|
||
}
|
||
function q(e) {
|
||
let t = S[e.pointerId];
|
||
void 0 === t && ((t = new ey.Vector2()), (S[e.pointerId] = t)),
|
||
t.set(e.pageX, e.pageY);
|
||
}
|
||
function X(e) {
|
||
return S[(e.pointerId === _[0].pointerId ? _[1] : _[0]).pointerId];
|
||
}
|
||
n.domElement.addEventListener("contextmenu", K),
|
||
n.domElement.addEventListener("pointerdown", z),
|
||
n.domElement.addEventListener("pointercancel", $),
|
||
n.domElement.addEventListener("wheel", V, { passive: !1 }),
|
||
this.update();
|
||
}
|
||
}
|
||
let eA = {
|
||
default: {
|
||
panelWidth: null,
|
||
panelHeight: null,
|
||
panelMaxWidth: "min(92vw,200px)",
|
||
gizmoSize: Math.round(88 * 0.7),
|
||
textClassName: "text-[6px]",
|
||
},
|
||
fullscreen: {
|
||
panelWidth: 160,
|
||
panelHeight: null,
|
||
panelMaxWidth: "180px",
|
||
gizmoSize: 148,
|
||
textClassName: "text-[10px]",
|
||
},
|
||
},
|
||
eN = new ex.Vector3(),
|
||
eI = new ex.Spherical(),
|
||
eP = new ex.Vector3();
|
||
function eR(e) {
|
||
return `${Math.round(e)}\xb0`;
|
||
}
|
||
function eL(e, t) {
|
||
let n = document.createElement("canvas");
|
||
(n.width = 64), (n.height = 64);
|
||
let i = n.getContext("2d");
|
||
i &&
|
||
(i.clearRect(0, 0, 64, 64),
|
||
(i.fillStyle = t),
|
||
(i.font = "bold 44px ui-sans-serif, system-ui, sans-serif"),
|
||
(i.textAlign = "center"),
|
||
(i.textBaseline = "middle"),
|
||
i.fillText(e, 32, 32));
|
||
let r = new ex.CanvasTexture(n);
|
||
r.colorSpace = ex.SRGBColorSpace;
|
||
let a = new ex.SpriteMaterial({
|
||
map: r,
|
||
transparent: !0,
|
||
depthTest: !0,
|
||
depthWrite: !1,
|
||
}),
|
||
o = new ex.Sprite(a);
|
||
return o.scale.setScalar(0.42), o;
|
||
}
|
||
let eD = (0, n.forwardRef)(function (
|
||
{
|
||
url: e,
|
||
className: i,
|
||
showCompositionGrid: r = !1,
|
||
hudPreset: a = "default",
|
||
panoramaInteractionEnabled: o = !0,
|
||
},
|
||
s,
|
||
) {
|
||
let [c, l] = (0, n.useState)(!1),
|
||
[u, h] = (0, n.useState)(0),
|
||
f = (0, n.useRef)(null),
|
||
d = (0, n.useRef)(null),
|
||
p = (0, n.useRef)(null),
|
||
g = (0, n.useRef)(null),
|
||
b = (0, n.useRef)(null),
|
||
m = eA[a],
|
||
w = (0, n.useRef)(null),
|
||
v = (0, n.useRef)(null),
|
||
x = (0, n.useRef)(null),
|
||
y = (0, n.useRef)(new Set()),
|
||
_ = (0, n.useRef)(new ex.Vector3(1, 0, 0)),
|
||
S = (0, n.useRef)(new ex.Vector3(0, 0, 0)),
|
||
E = (0, n.useRef)(null),
|
||
M = (0, n.useRef)(o);
|
||
return ((M.current = o),
|
||
(0, n.useImperativeHandle)(
|
||
s,
|
||
() => ({
|
||
resetView: () => {
|
||
let e = v.current,
|
||
t = w.current;
|
||
e &&
|
||
t &&
|
||
(y.current.clear(),
|
||
e.position.copy(_.current),
|
||
(e.fov = 60),
|
||
e.updateProjectionMatrix(),
|
||
t.target.copy(S.current),
|
||
t.update());
|
||
},
|
||
captureScreenshot: () => {
|
||
let e = x.current;
|
||
if (!e) return null;
|
||
try {
|
||
return e.domElement.toDataURL("image/png");
|
||
} catch {
|
||
return null;
|
||
}
|
||
},
|
||
getRendererPixelSize: () => {
|
||
let e = x.current;
|
||
if (!e) return null;
|
||
let { width: t, height: n } = e.domElement;
|
||
return t < 1 || n < 1 ? null : { width: t, height: n };
|
||
},
|
||
startKeyboardNudge: (e) => {
|
||
y.current.add(e);
|
||
},
|
||
stopKeyboardNudge: (e) => {
|
||
y.current.delete(e);
|
||
},
|
||
clearKeyboardNudges: () => {
|
||
y.current.clear();
|
||
},
|
||
captureScreenshotsFromRing: (e) => {
|
||
let t = E.current,
|
||
n = v.current,
|
||
i = w.current,
|
||
r = x.current;
|
||
if (!t || !n || !i || !r) return [];
|
||
let a = n.position.clone(),
|
||
o = n.quaternion.clone(),
|
||
s = n.fov,
|
||
c = i.target.clone();
|
||
n.position.copy(_.current),
|
||
(n.fov = ex.MathUtils.clamp(s, 28, 95)),
|
||
n.updateProjectionMatrix(),
|
||
i.target.copy(S.current),
|
||
i.update();
|
||
let l = i.target.clone(),
|
||
u = n.position.distanceTo(l);
|
||
if (u < 1e-6)
|
||
return (
|
||
n.position.copy(a),
|
||
n.quaternion.copy(o),
|
||
(n.fov = s),
|
||
n.updateProjectionMatrix(),
|
||
i.target.copy(c),
|
||
i.update(),
|
||
[]
|
||
);
|
||
let h = [],
|
||
f = new ex.Vector3(),
|
||
d = new ex.Spherical(),
|
||
p = Math.PI / 2;
|
||
for (let a = 0; a < e; a++) {
|
||
let o = Math.PI / 2 + (a / e) * Math.PI * 2;
|
||
d.set(u, p, o),
|
||
f.setFromSpherical(d),
|
||
n.position.copy(l).add(f),
|
||
n.up.set(0, 1, 0),
|
||
n.lookAt(l),
|
||
i.update(),
|
||
r.render(t, n);
|
||
let { width: s, height: c } = r.domElement;
|
||
try {
|
||
let e = r.domElement.toDataURL("image/png");
|
||
h.push({ dataUrl: e, width: s, height: c });
|
||
} catch {}
|
||
}
|
||
return (
|
||
n.position.copy(a),
|
||
n.quaternion.copy(o),
|
||
(n.fov = s),
|
||
n.updateProjectionMatrix(),
|
||
i.target.copy(c),
|
||
i.update(),
|
||
h
|
||
);
|
||
},
|
||
}),
|
||
[],
|
||
),
|
||
(0, n.useEffect)(() => {
|
||
l(!1), h(0);
|
||
}, [e]),
|
||
(0, n.useEffect)(() => {
|
||
let t,
|
||
n,
|
||
i,
|
||
r,
|
||
a,
|
||
o,
|
||
s = f.current,
|
||
c = d.current;
|
||
if (!s || !c || !e) return;
|
||
let u = !1,
|
||
T = new ex.Scene();
|
||
E.current = T;
|
||
let k = Math.max(1, s.clientWidth),
|
||
C = Math.max(1, s.clientHeight),
|
||
A = new ex.PerspectiveCamera(60, k / C, 0.1, 2e3);
|
||
A.position.copy(_.current), (v.current = A);
|
||
let N = new ex.WebGLRenderer({
|
||
antialias: !0,
|
||
alpha: !1,
|
||
preserveDrawingBuffer: !0,
|
||
});
|
||
N.setSize(k, C),
|
||
N.setPixelRatio(Math.min(window.devicePixelRatio, 2)),
|
||
(N.outputColorSpace = ex.SRGBColorSpace),
|
||
(x.current = N),
|
||
s.appendChild(N.domElement);
|
||
let I = new eC(A, N.domElement);
|
||
(I.enableDamping = !0),
|
||
(I.dampingFactor = 0.08),
|
||
(I.enablePan = !1),
|
||
(I.rotateSpeed = -0.35),
|
||
(I.enableZoom = !1),
|
||
(I.minDistance = 0.05),
|
||
(I.maxDistance = 3),
|
||
I.target.copy(S.current),
|
||
(I.enabled = M.current),
|
||
I.update(),
|
||
(w.current = I);
|
||
let P = Math.min(window.devicePixelRatio, 2),
|
||
{
|
||
scene: R,
|
||
camera: L,
|
||
dispose: D,
|
||
} = ((t = new ex.Scene()),
|
||
Array.isArray((i = (n = new ex.AxesHelper(1.15)).material))
|
||
? i.forEach((e) => {
|
||
e.depthTest = !0;
|
||
})
|
||
: (i.depthTest = !0),
|
||
t.add(n),
|
||
(r = eL("X", "#f87171")).position.set(1.288, 0, 0),
|
||
(a = eL("Y", "#4ade80")).position.set(0, 1.288, 0),
|
||
(o = eL("Z", "#60a5fa")).position.set(0, 0, 1.288),
|
||
t.add(r, a, o),
|
||
{
|
||
scene: t,
|
||
camera: new ex.OrthographicCamera(
|
||
-1.55,
|
||
1.55,
|
||
1.55,
|
||
-1.55,
|
||
0.08,
|
||
12,
|
||
),
|
||
dispose: () => {
|
||
n.geometry.dispose();
|
||
let e = n.material;
|
||
Array.isArray(e) ? e.forEach((e) => e.dispose()) : e.dispose(),
|
||
[r, a, o].forEach((e) => {
|
||
let t = e.material;
|
||
t.map?.dispose(), t.dispose();
|
||
});
|
||
},
|
||
}),
|
||
j = new ex.WebGLRenderer({ antialias: !0, alpha: !0 });
|
||
j.setPixelRatio(P),
|
||
j.setSize(m.gizmoSize, m.gizmoSize),
|
||
(j.outputColorSpace = ex.SRGBColorSpace),
|
||
j.setClearColor(0, 0),
|
||
(j.domElement.style.width = `${m.gizmoSize}px`),
|
||
(j.domElement.style.height = `${m.gizmoSize}px`),
|
||
(j.domElement.style.display = "block"),
|
||
c.appendChild(j.domElement);
|
||
let O = (e) => {
|
||
if (!M.current) return;
|
||
e.preventDefault(), e.stopPropagation();
|
||
let t = e.deltaY,
|
||
n = e.deltaX;
|
||
e.deltaMode === WheelEvent.DOM_DELTA_LINE
|
||
? ((t *= 16), (n *= 16))
|
||
: e.deltaMode === WheelEvent.DOM_DELTA_PAGE &&
|
||
((t *= 800), (n *= 800));
|
||
let i = Math.abs(t) >= Math.abs(n) ? t : n;
|
||
if (0 === i) return;
|
||
let r = e.ctrlKey || e.metaKey,
|
||
a =
|
||
e.deltaMode === WheelEvent.DOM_DELTA_PIXEL
|
||
? i * (r ? 0.36 : 0.045)
|
||
: 0.12 * i;
|
||
(A.fov = ex.MathUtils.clamp(A.fov + a, 28, 95)),
|
||
A.updateProjectionMatrix();
|
||
};
|
||
N.domElement.addEventListener("wheel", O, { passive: !1 });
|
||
let F = new ex.SphereGeometry(500, 64, 32);
|
||
F.scale(-1, 1, 1);
|
||
let U = new ex.TextureLoader();
|
||
U.setCrossOrigin("anonymous");
|
||
let B = null;
|
||
U.load(
|
||
e,
|
||
(e) => {
|
||
if (u) return void e.dispose();
|
||
(e.colorSpace = ex.SRGBColorSpace), (e.anisotropy = 4);
|
||
let t = new ex.MeshBasicMaterial({ map: e });
|
||
(B = new ex.Mesh(F, t)), T.add(B), h(100), l(!0);
|
||
},
|
||
(e) => {
|
||
if (u) return;
|
||
let { loaded: t, total: n } = e;
|
||
"number" == typeof t &&
|
||
"number" == typeof n &&
|
||
n > 0 &&
|
||
h(Math.min(100, (t / n) * 100));
|
||
},
|
||
() => {
|
||
u || F.dispose(), l(!0);
|
||
},
|
||
);
|
||
let H = 0,
|
||
z = performance.now(),
|
||
G = (e = performance.now()) => {
|
||
H = requestAnimationFrame(G);
|
||
let t = Math.min((e - z) / 1e3, 0.05);
|
||
z = e;
|
||
let n = y.current;
|
||
if (n.size > 0) {
|
||
let e = I.target.clone(),
|
||
i = new ex.Vector3().subVectors(A.position, e),
|
||
r = new ex.Spherical().setFromVector3(i),
|
||
a = 0.7 * Math.PI,
|
||
o = 0.55 * Math.PI;
|
||
n.has("yawLeft") && (r.theta -= a * t),
|
||
n.has("yawRight") && (r.theta += a * t),
|
||
n.has("pitchUp") && (r.phi -= o * t),
|
||
n.has("pitchDown") && (r.phi += o * t),
|
||
(r.phi = ex.MathUtils.clamp(r.phi, 0.02, Math.PI - 0.02)),
|
||
n.has("zoomIn") &&
|
||
(A.fov = ex.MathUtils.clamp(A.fov - 34 * t, 28, 95)),
|
||
n.has("zoomOut") &&
|
||
(A.fov = ex.MathUtils.clamp(A.fov + 34 * t, 28, 95)),
|
||
i.setFromSpherical(r),
|
||
A.position.copy(e).add(i),
|
||
A.lookAt(e),
|
||
A.updateProjectionMatrix();
|
||
}
|
||
I.update(),
|
||
N.render(T, A),
|
||
A.getWorldDirection(eP),
|
||
L.position.copy(eP).multiplyScalar(-2.75),
|
||
L.up.copy(A.up),
|
||
L.lookAt(0, 0, 0),
|
||
L.updateProjectionMatrix(),
|
||
j.render(R, L),
|
||
eN.subVectors(A.position, I.target),
|
||
eI.setFromVector3(eN);
|
||
let i = ex.MathUtils.radToDeg(eI.theta),
|
||
r = Math.PI / 2 - eI.phi,
|
||
a = 60 / A.fov;
|
||
p.current && (p.current.textContent = eR(((i % 360) + 360) % 360)),
|
||
g.current &&
|
||
(g.current.textContent = eR(ex.MathUtils.radToDeg(r))),
|
||
b.current &&
|
||
(b.current.textContent = `${A.fov.toFixed(0)}\xb0\xd7${a.toFixed(2)}`);
|
||
};
|
||
G();
|
||
let $ = new ResizeObserver(() => {
|
||
let e = Math.max(1, s.clientWidth),
|
||
t = Math.max(1, s.clientHeight);
|
||
(A.aspect = e / t), A.updateProjectionMatrix(), N.setSize(e, t);
|
||
});
|
||
return (
|
||
$.observe(s),
|
||
() => {
|
||
if (
|
||
((u = !0),
|
||
y.current.clear(),
|
||
(E.current = null),
|
||
N.domElement.removeEventListener("wheel", O),
|
||
cancelAnimationFrame(H),
|
||
$.disconnect(),
|
||
I.dispose(),
|
||
(w.current = null),
|
||
(v.current = null),
|
||
(x.current = null),
|
||
D(),
|
||
j.dispose(),
|
||
j.domElement.parentNode &&
|
||
j.domElement.parentNode.removeChild(j.domElement),
|
||
B)
|
||
) {
|
||
B.geometry.dispose();
|
||
let e = B.material;
|
||
e.map?.dispose(), e.dispose();
|
||
} else F.dispose();
|
||
N.dispose(),
|
||
N.domElement.parentNode &&
|
||
N.domElement.parentNode.removeChild(N.domElement);
|
||
}
|
||
);
|
||
}, [e, m.gizmoSize]),
|
||
(0, n.useEffect)(() => {
|
||
let e = w.current;
|
||
e && (e.enabled = o);
|
||
}, [o]),
|
||
e)
|
||
? (0, t.jsxs)("div", {
|
||
className: `nodrag relative h-full min-h-[160px] w-full overflow-hidden rounded-xl ${i ?? ""}`,
|
||
onWheel: (e) => {
|
||
o && e.stopPropagation();
|
||
},
|
||
children: [
|
||
e && !c
|
||
? (0, t.jsxs)(t.Fragment, {
|
||
children: [
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"z-5 absolute inset-0 overflow-hidden rounded-xl bg-neutral-900",
|
||
"aria-hidden": !0,
|
||
children: (0, t.jsx)("img", {
|
||
src: e,
|
||
alt: "",
|
||
draggable: !1,
|
||
className:
|
||
"h-full w-full scale-[1.06] object-cover opacity-95 transition-opacity duration-300",
|
||
style: { filter: "blur(22px)" },
|
||
}),
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"z-15 pointer-events-none absolute bottom-4 left-1/2 flex h-6 max-w-[min(calc(100%-24px),420px)] -translate-x-1/2 items-center justify-center rounded-lg bg-[rgba(255,255,255,0.3)] px-4 text-[12px] leading-none text-white shadow-lg backdrop-blur-md",
|
||
role: "status",
|
||
"aria-live": "polite",
|
||
children: (0, t.jsxs)("span", {
|
||
className: "whitespace-nowrap",
|
||
children: [
|
||
"全景预览加载中",
|
||
u > 0 ? ` ${Math.round(u)}%` : "",
|
||
],
|
||
}),
|
||
}),
|
||
],
|
||
})
|
||
: null,
|
||
(0, t.jsx)("div", {
|
||
ref: f,
|
||
className: `z-1 absolute inset-0 transition-opacity duration-300 ${c ? "opacity-100" : "pointer-events-none opacity-0"}`,
|
||
}),
|
||
r && c
|
||
? (0, t.jsxs)("div", {
|
||
className: "z-8 pointer-events-none absolute inset-0",
|
||
"aria-hidden": !0,
|
||
children: [
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"bg-(--color-white-alpha-50) absolute left-[33.333%] top-0 h-full w-px",
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"bg-(--color-white-alpha-50) absolute left-[66.667%] top-0 h-full w-px",
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"bg-(--color-white-alpha-50) absolute left-0 top-[33.333%] h-px w-full",
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"bg-(--color-white-alpha-50) absolute left-0 top-[66.667%] h-px w-full",
|
||
}),
|
||
],
|
||
})
|
||
: null,
|
||
(0, t.jsxs)("div", {
|
||
className: `pointer-events-none absolute bottom-3 right-3 z-10 flex w-max flex-col items-stretch rounded-lg border border-white/10 bg-black/50 shadow-lg backdrop-blur-sm transition-opacity duration-300 ${c ? "opacity-100" : "opacity-0"} ${"fullscreen" === a ? "gap-1 p-1.5" : "gap-0.5 p-1"}`,
|
||
style: {
|
||
width: m.panelWidth ?? void 0,
|
||
height: m.panelHeight ?? void 0,
|
||
maxWidth: m.panelMaxWidth,
|
||
},
|
||
children: [
|
||
(0, t.jsx)("div", {
|
||
ref: d,
|
||
className:
|
||
"shrink-0 self-center overflow-hidden rounded-md bg-black/30",
|
||
style: { width: m.gizmoSize, height: m.gizmoSize },
|
||
"aria-hidden": !0,
|
||
}),
|
||
(0, t.jsxs)("div", {
|
||
className: `text-white/82 w-full px-0.5 text-center font-mono leading-tight ${m.textClassName}`,
|
||
children: [
|
||
(0, t.jsxs)("div", {
|
||
className: "whitespace-nowrap",
|
||
children: [
|
||
"横 ",
|
||
(0, t.jsx)("span", { ref: p, children: "0°" }),
|
||
(0, t.jsx)("span", {
|
||
className: "mx-0.5 text-white/35",
|
||
children: "·",
|
||
}),
|
||
"纵 ",
|
||
(0, t.jsx)("span", { ref: g, children: "0°" }),
|
||
],
|
||
}),
|
||
(0, t.jsxs)("div", {
|
||
className: "text-white/72 mt-px whitespace-nowrap",
|
||
children: [
|
||
"缩放 ",
|
||
(0, t.jsx)("span", { ref: b, children: "60°×1.00" }),
|
||
],
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
})
|
||
: (0, t.jsx)("div", {
|
||
className: i,
|
||
style: {
|
||
display: "flex",
|
||
alignItems: "center",
|
||
justifyContent: "center",
|
||
background: "linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%)",
|
||
color: "rgba(255,255,255,0.45)",
|
||
fontSize: 13,
|
||
},
|
||
children: "暂无全景图",
|
||
});
|
||
});
|
||
(eD.displayName = "SpaceScene360Viewer"), e.s(["default", 0, eD], 739809);
|
||
var ej = e.i(799093),
|
||
eO = e.i(439552);
|
||
function eF({ hdImageUrl: e, originalImageUrl: i, onExit: r }) {
|
||
let [a, o] = (0, n.useState)(50),
|
||
s = (0, n.useRef)(null),
|
||
c = (0, n.useRef)(!1),
|
||
l = (0, n.useCallback)((e) => {
|
||
let t = s.current;
|
||
if (!t) return;
|
||
let n = t.getBoundingClientRect();
|
||
o(Math.min(100, Math.max(0, ((e - n.left) / n.width) * 100)));
|
||
}, []),
|
||
u = (0, n.useCallback)(
|
||
(e) => {
|
||
e.preventDefault(),
|
||
e.stopPropagation(),
|
||
(c.current = !0),
|
||
e.currentTarget.setPointerCapture(e.pointerId),
|
||
l(e.clientX);
|
||
},
|
||
[l],
|
||
),
|
||
h = (0, n.useCallback)(
|
||
(e) => {
|
||
c.current &&
|
||
(e.preventDefault(), e.stopPropagation(), l(e.clientX));
|
||
},
|
||
[l],
|
||
),
|
||
f = (0, n.useCallback)((e) => {
|
||
e.stopPropagation(), (c.current = !1);
|
||
}, []);
|
||
return (
|
||
(0, n.useEffect)(() => {
|
||
let e = (e) => {
|
||
"Escape" === e.key && r();
|
||
};
|
||
return (
|
||
document.addEventListener("keydown", e),
|
||
() => document.removeEventListener("keydown", e)
|
||
);
|
||
}, [r]),
|
||
(0, t.jsxs)("div", {
|
||
ref: s,
|
||
className:
|
||
"nopan absolute inset-0 select-none overflow-hidden rounded-xl",
|
||
style: { zIndex: 20, cursor: "ew-resize" },
|
||
onPointerDown: u,
|
||
onPointerMove: h,
|
||
onPointerUp: f,
|
||
onPointerCancel: f,
|
||
children: [
|
||
(0, t.jsx)("img", {
|
||
src: i,
|
||
alt: "原图",
|
||
className: "absolute inset-0 h-full w-full object-cover",
|
||
draggable: !1,
|
||
}),
|
||
(0, t.jsx)("img", {
|
||
src: e,
|
||
alt: "高清",
|
||
className: "absolute inset-0 h-full w-full object-cover",
|
||
style: { clipPath: `inset(0 ${100 - a}% 0 0)`, zIndex: 32 },
|
||
draggable: !1,
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"pointer-events-none absolute right-2 top-2 flex h-6 items-center justify-center overflow-hidden rounded-lg px-2",
|
||
style: {
|
||
background: "rgba(0, 0, 0, 0.65)",
|
||
backdropFilter: "blur(16px)",
|
||
zIndex: 31,
|
||
},
|
||
children: (0, t.jsx)("span", {
|
||
className: "text-[13px] font-normal leading-none text-white",
|
||
children: "原图",
|
||
}),
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"pointer-events-none absolute top-0 h-full w-px -translate-x-1/2",
|
||
style: {
|
||
left: `${a}%`,
|
||
background: "rgba(255, 255, 255, 0.9)",
|
||
boxShadow: "0 0 4px rgba(0,0,0,0.4)",
|
||
zIndex: 33,
|
||
},
|
||
children: (0, t.jsx)("div", {
|
||
className:
|
||
"pointer-events-none absolute left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 items-center justify-center",
|
||
style: {
|
||
width: 30,
|
||
height: 30,
|
||
borderRadius: 8,
|
||
background: "#F7F7F7",
|
||
},
|
||
children: (0, t.jsx)(w.Icons.Drag, {
|
||
width: 14,
|
||
height: 14,
|
||
color: "#171717",
|
||
}),
|
||
}),
|
||
}),
|
||
],
|
||
})
|
||
);
|
||
}
|
||
let eU = [
|
||
{ label: "16:9", ratio: 16 / 9 },
|
||
{ label: "3:2", ratio: 1.5 },
|
||
{ label: "4:3", ratio: 4 / 3 },
|
||
{ label: "1:1", ratio: 1 },
|
||
{ label: "3:4", ratio: 3 / 4 },
|
||
{ label: "2:3", ratio: 2 / 3 },
|
||
{ label: "9:16", ratio: 9 / 16 },
|
||
],
|
||
eB = new Set(["nw", "ne", "sw", "se"]),
|
||
eH = {
|
||
n: "n-resize",
|
||
s: "s-resize",
|
||
e: "e-resize",
|
||
w: "w-resize",
|
||
nw: "nw-resize",
|
||
ne: "ne-resize",
|
||
sw: "sw-resize",
|
||
se: "se-resize",
|
||
},
|
||
ez = [
|
||
{ handle: "nw", top: -5, left: -5 },
|
||
{ handle: "n", top: -5, left: "50%", transform: "translateX(-50%)" },
|
||
{ handle: "ne", top: -5, right: -5 },
|
||
{ handle: "e", top: "50%", right: -5, transform: "translateY(-50%)" },
|
||
{ handle: "se", bottom: -5, right: -5 },
|
||
{ handle: "s", bottom: -5, left: "50%", transform: "translateX(-50%)" },
|
||
{ handle: "sw", bottom: -5, left: -5 },
|
||
{ handle: "w", top: "50%", left: -5, transform: "translateY(-50%)" },
|
||
],
|
||
eG = (0, n.memo)(function ({
|
||
isFocusDragging: e,
|
||
existingRegion: i,
|
||
externalPendingRegion: r,
|
||
onConfirm: a,
|
||
onConfirmReady: o,
|
||
clearKey: s,
|
||
onInteractStart: c,
|
||
focusAspectRatioLabel: l,
|
||
containerAspectRatio: u = 1,
|
||
}) {
|
||
let h = (0, n.useRef)(null),
|
||
[f, d] = (0, n.useState)(!1),
|
||
[p, g] = (0, n.useState)(null),
|
||
[b, m] = (0, n.useState)(null),
|
||
[w, v] = (0, n.useState)(null),
|
||
[x, y] = (0, n.useState)(!1),
|
||
_ = (0, n.useRef)(null),
|
||
[S, E] = (0, n.useState)(null),
|
||
[M, T] = (0, n.useState)(!1),
|
||
[k, C] = (0, n.useState)(null),
|
||
A = (0, n.useRef)(null);
|
||
(0, n.useEffect)(() => {
|
||
e && i && !w && E(i);
|
||
}, [e, i, w]);
|
||
let N = (0, n.useRef)(i);
|
||
(0, n.useEffect)(() => {
|
||
let e = N.current;
|
||
(N.current = i), void 0 !== e && void 0 === i && (E(null), v(null));
|
||
}, [i]),
|
||
(0, n.useEffect)(() => {
|
||
e || (v(null), E(null), d(!1), y(!1), T(!1), C(null));
|
||
}, [e]);
|
||
let I = (0, n.useRef)(s);
|
||
(0, n.useEffect)(() => {
|
||
void 0 !== s &&
|
||
s !== I.current &&
|
||
((I.current = s), v(null), E(null));
|
||
}, [s]),
|
||
(0, n.useEffect)(() => {
|
||
e &&
|
||
w &&
|
||
r &&
|
||
(r.relX !== w.relX ||
|
||
r.relY !== w.relY ||
|
||
r.width !== w.width ||
|
||
r.height !== w.height) &&
|
||
(v(r), E(r));
|
||
}, [e, w, r]);
|
||
let P = e && w && !f && !x && !M;
|
||
(0, n.useEffect)(() => {
|
||
o?.(P ? w : null);
|
||
}, [P, w, o]);
|
||
let R = (0, n.useCallback)((e, t) => {
|
||
let n = h.current;
|
||
if (!n) return { x: 0, y: 0 };
|
||
let i = n.getBoundingClientRect();
|
||
return {
|
||
x: Math.max(0, Math.min(1, (e - i.left) / i.width)),
|
||
y: Math.max(0, Math.min(1, (t - i.top) / i.height)),
|
||
};
|
||
}, []),
|
||
L = (0, n.useCallback)(
|
||
(e, t) => {
|
||
let n = R(e.x, e.y),
|
||
i = R(t.x, t.y);
|
||
return {
|
||
relX: Math.min(n.x, i.x),
|
||
relY: Math.min(n.y, i.y),
|
||
width: Math.abs(i.x - n.x),
|
||
height: Math.abs(i.y - n.y),
|
||
};
|
||
},
|
||
[R],
|
||
),
|
||
D = (0, n.useCallback)(
|
||
(t) => {
|
||
if (!e) return;
|
||
let n = S ?? w;
|
||
if (n) {
|
||
let e = R(t.clientX, t.clientY);
|
||
if (
|
||
e.x >= n.relX &&
|
||
e.x <= n.relX + n.width &&
|
||
e.y >= n.relY &&
|
||
e.y <= n.relY + n.height
|
||
) {
|
||
t.stopPropagation(),
|
||
t.preventDefault(),
|
||
c?.(),
|
||
y(!0),
|
||
(_.current = {
|
||
x: t.clientX,
|
||
y: t.clientY,
|
||
region: { ...n },
|
||
});
|
||
return;
|
||
}
|
||
}
|
||
t.stopPropagation(),
|
||
t.preventDefault(),
|
||
c?.(),
|
||
d(!0),
|
||
v(null),
|
||
E(null),
|
||
g({ x: t.clientX, y: t.clientY }),
|
||
m({ x: t.clientX, y: t.clientY });
|
||
},
|
||
[e, S, w, R],
|
||
);
|
||
(0, n.useEffect)(() => {
|
||
if (!f && !x && !M) return;
|
||
let e = (e) => {
|
||
if (f) return void m({ x: e.clientX, y: e.clientY });
|
||
let t = h.current;
|
||
if (!t) return;
|
||
let n = t.getBoundingClientRect();
|
||
if (x && _.current) {
|
||
let t = (e.clientX - _.current.x) / n.width,
|
||
i = (e.clientY - _.current.y) / n.height,
|
||
r = _.current.region,
|
||
a = Math.max(0, Math.min(1 - r.width, r.relX + t)),
|
||
o = Math.max(0, Math.min(1 - r.height, r.relY + i)),
|
||
s = { ...r, relX: a, relY: o };
|
||
E(s), v(s);
|
||
}
|
||
if (M && A.current) {
|
||
let { handle: t, region: i, targetNormRatio: r } = A.current;
|
||
if (eB.has(t) && void 0 !== r) {
|
||
let { x: n, y: a } = R(e.clientX, e.clientY),
|
||
o = (function (e, t, n, i, r, a) {
|
||
let o,
|
||
s,
|
||
c,
|
||
l,
|
||
u,
|
||
h,
|
||
f,
|
||
d,
|
||
{ relX: p, relY: g, width: b, height: m } = t,
|
||
w = p + b,
|
||
v = g + m;
|
||
switch (e) {
|
||
case "se":
|
||
(o = p), (s = g), (c = n - o), (l = i - s);
|
||
break;
|
||
case "nw":
|
||
(o = w), (s = v), (c = o - n), (l = s - i);
|
||
break;
|
||
case "ne":
|
||
(o = p), (s = v), (c = n - o), (l = s - i);
|
||
break;
|
||
case "sw":
|
||
(o = w), (s = g), (c = o - n), (l = i - s);
|
||
}
|
||
switch (
|
||
((c = Math.max(0.02, c)) / (l = Math.max(0.02, l)) > r
|
||
? (u = (h = l) * r)
|
||
: (h = (u = c) / r),
|
||
(u = Math.max(0.02, u)),
|
||
(h = Math.max(0.02, h)),
|
||
e)
|
||
) {
|
||
case "se":
|
||
(f = p), (d = g);
|
||
break;
|
||
case "nw":
|
||
(f = o - u), (d = s - h);
|
||
break;
|
||
case "ne":
|
||
(f = p), (d = s - h);
|
||
break;
|
||
case "sw":
|
||
(f = o - u), (d = g);
|
||
}
|
||
f < 0 && ((u += f), (f = 0), (h = u / r)),
|
||
d < 0 && ((h += d), (d = 0), (u = h * r));
|
||
let x = 1 - f,
|
||
y = 1 - d;
|
||
return (
|
||
u > x && (h = (u = x) / r),
|
||
h > y && (u = (h = y) * r),
|
||
(x = 1 - f),
|
||
(y = 1 - d),
|
||
u > x && (h = (u = x) / r),
|
||
h > y && (u = (h = y) * r),
|
||
{
|
||
relX: f,
|
||
relY: d,
|
||
width: (u = Math.max(0.02, u)),
|
||
height: (h = Math.max(0.02, h)),
|
||
}
|
||
);
|
||
})(t, i, n, a, r, 0);
|
||
E(o), v(o);
|
||
} else {
|
||
let r = (e.clientX - A.current.startX) / n.width,
|
||
a = (e.clientY - A.current.startY) / n.height,
|
||
{ relX: o, relY: s, width: c, height: l } = i,
|
||
u = i.relX + i.width,
|
||
h = i.relY + i.height;
|
||
if ("n" === t || "nw" === t || "ne" === t) {
|
||
let e = Math.max(0, Math.min(h - 0.02, i.relY + a));
|
||
(l = h - e), (s = e);
|
||
}
|
||
if (
|
||
(("s" === t || "sw" === t || "se" === t) &&
|
||
(l = Math.max(0.02, Math.min(1 - i.relY, i.height + a))),
|
||
"w" === t || "nw" === t || "sw" === t)
|
||
) {
|
||
let e = Math.max(0, Math.min(u - 0.02, i.relX + r));
|
||
(c = u - e), (o = e);
|
||
}
|
||
("e" === t || "ne" === t || "se" === t) &&
|
||
(c = Math.max(0.02, Math.min(1 - i.relX, i.width + r)));
|
||
let f = { relX: o, relY: s, width: c, height: l };
|
||
E(f), v(f);
|
||
}
|
||
}
|
||
},
|
||
t = (e) => {
|
||
if (f && p) {
|
||
d(!1);
|
||
let t = L(p, { x: e.clientX, y: e.clientY });
|
||
t && t.width > 0.02 && t.height > 0.02 && (v(t), E(t)),
|
||
g(null),
|
||
m(null);
|
||
}
|
||
x && (y(!1), (_.current = null)),
|
||
M && (T(!1), C(null), (A.current = null));
|
||
};
|
||
return (
|
||
window.addEventListener("mousemove", e),
|
||
window.addEventListener("mouseup", t),
|
||
() => {
|
||
window.removeEventListener("mousemove", e),
|
||
window.removeEventListener("mouseup", t);
|
||
}
|
||
);
|
||
}, [f, x, M, p, L, R]);
|
||
let j = (f && p && b ? L(p, b) : null) ?? S ?? (e ? null : i),
|
||
O = e && j && j.width > 0 && j.height > 0,
|
||
F = e ? (x ? "grabbing" : M && k ? eH[k] : "crosshair") : "default";
|
||
return (0, t.jsx)("div", {
|
||
ref: h,
|
||
className: "absolute inset-0",
|
||
style: { zIndex: 55, cursor: F, pointerEvents: e ? "auto" : "none" },
|
||
onMouseDown: D,
|
||
children:
|
||
j &&
|
||
j.width > 0 &&
|
||
j.height > 0 &&
|
||
(0, t.jsxs)("div", {
|
||
className: "absolute",
|
||
style: {
|
||
left: `${100 * j.relX}%`,
|
||
top: `${100 * j.relY}%`,
|
||
width: `${100 * j.width}%`,
|
||
height: `${100 * j.height}%`,
|
||
border: f ? "1px dashed white" : "1px solid white",
|
||
borderRadius: 4,
|
||
boxShadow: O ? "0 0 0 9999px rgba(0, 0, 0, 0.5)" : "none",
|
||
cursor: e && !f ? "grab" : void 0,
|
||
pointerEvents: e && !f ? "auto" : "none",
|
||
},
|
||
children: [
|
||
e &&
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"absolute inset-0 flex items-center justify-center",
|
||
style: { pointerEvents: "none" },
|
||
children: (0, t.jsxs)("div", {
|
||
className: "relative flex items-center justify-center",
|
||
children: [
|
||
(0, t.jsxs)("svg", {
|
||
width: "31",
|
||
height: "31",
|
||
viewBox: "0 0 31 31",
|
||
fill: "none",
|
||
xmlns: "http://www.w3.org/2000/svg",
|
||
children: [
|
||
(0, t.jsx)("path", {
|
||
d: "M8.5 0.5H2.5C1.39543 0.5 0.5 1.39543 0.5 2.5V8.5",
|
||
stroke: "white",
|
||
}),
|
||
(0, t.jsx)("path", {
|
||
d: "M8.5 30.5098H2.5C1.39543 30.5098 0.5 29.6143 0.5 28.5098V22.5098",
|
||
stroke: "white",
|
||
}),
|
||
(0, t.jsx)("path", {
|
||
d: "M22.2974 0.5H28.2974C29.4019 0.5 30.2974 1.39543 30.2974 2.5V8.5",
|
||
stroke: "white",
|
||
}),
|
||
(0, t.jsx)("path", {
|
||
d: "M22.2974 30.5098H28.2974C29.4019 30.5098 30.2974 29.6143 30.2974 28.5098V22.5098",
|
||
stroke: "white",
|
||
}),
|
||
],
|
||
}),
|
||
(0, t.jsxs)("svg", {
|
||
className: "absolute",
|
||
width: "17",
|
||
height: "17",
|
||
viewBox: "0 0 17 17",
|
||
fill: "none",
|
||
xmlns: "http://www.w3.org/2000/svg",
|
||
children: [
|
||
(0, t.jsx)("line", {
|
||
x1: "0",
|
||
y1: "8",
|
||
x2: "17",
|
||
y2: "8",
|
||
stroke: "white",
|
||
}),
|
||
(0, t.jsx)("line", {
|
||
x1: "9",
|
||
y1: "0",
|
||
x2: "9",
|
||
y2: "17",
|
||
stroke: "white",
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
}),
|
||
}),
|
||
e &&
|
||
!f &&
|
||
ez.map(({ handle: e, ...n }) =>
|
||
(0, t.jsx)(
|
||
"div",
|
||
{
|
||
style: {
|
||
position: "absolute",
|
||
width: 8,
|
||
height: 8,
|
||
background: "#fff",
|
||
border: "1.5px solid rgba(0, 0, 0, 0.35)",
|
||
borderRadius: 1,
|
||
cursor: eH[e],
|
||
zIndex: 1,
|
||
...n,
|
||
},
|
||
onMouseDown: (t) => {
|
||
t.stopPropagation(), t.preventDefault();
|
||
let n = S ?? w;
|
||
if (!n) return;
|
||
c?.(), T(!0), C(e);
|
||
let i = eB.has(e)
|
||
? (function (e, t, n) {
|
||
if (t) {
|
||
let e = eU.find((e) => e.label === t);
|
||
if (e) return e.ratio / n;
|
||
}
|
||
return e.height > 1e-9 ? e.width / e.height : 1;
|
||
})(n, l, u > 0 ? u : 1)
|
||
: void 0;
|
||
A.current = {
|
||
handle: e,
|
||
startX: t.clientX,
|
||
startY: t.clientY,
|
||
region: { ...n },
|
||
targetNormRatio: i,
|
||
};
|
||
},
|
||
},
|
||
e,
|
||
),
|
||
),
|
||
],
|
||
}),
|
||
});
|
||
});
|
||
var e$ = e.i(740151);
|
||
let eV = I.NODE_WIDTH,
|
||
eW = new Map();
|
||
function eK(e, t, i) {
|
||
let r = e ? eW.get(e) : void 0,
|
||
a = r?.height ?? i ?? eV,
|
||
o = r?.width ?? t ?? I.NODE_WIDTH,
|
||
s = void 0 !== r || (void 0 !== t && void 0 !== i),
|
||
[c, l] = (0, n.useState)(s),
|
||
[u, h] = (0, n.useState)(o),
|
||
[f, d] = (0, n.useState)(a),
|
||
[p, g] = (0, n.useState)(0),
|
||
[b, m] = (0, n.useState)(0),
|
||
w = (0, n.useRef)(t),
|
||
v = (0, n.useRef)(i);
|
||
(w.current = t), (v.current = i);
|
||
let x = (0, n.useRef)(u),
|
||
y = (0, n.useRef)(f),
|
||
_ = (0, n.useRef)(c);
|
||
return (
|
||
(x.current = u),
|
||
(y.current = f),
|
||
(_.current = c),
|
||
(0, n.useEffect)(() => {
|
||
null != t &&
|
||
null != i &&
|
||
(x.current !== t || y.current !== i || !0 !== _.current) &&
|
||
(h(t), d(i), l(!0));
|
||
}, [t, i]),
|
||
(0, n.useEffect)(() => {
|
||
if (!e) {
|
||
let e = w.current ?? I.NODE_WIDTH,
|
||
t = v.current ?? eV;
|
||
h((t) => (t !== e ? e : t)),
|
||
d((e) => (e !== t ? t : e)),
|
||
l(!1),
|
||
g(0),
|
||
m(0);
|
||
return;
|
||
}
|
||
let t = w.current,
|
||
n = v.current;
|
||
if (null != t && null != n) {
|
||
h((e) => (e !== t ? t : e)),
|
||
d((e) => (e !== n ? n : e)),
|
||
l((e) => !0 !== e || e);
|
||
return;
|
||
}
|
||
if (eW.has(e)) {
|
||
let t = eW.get(e);
|
||
if (!t) return;
|
||
h((e) => (e !== t.width ? t.width : e)),
|
||
d((e) => (e !== t.height ? t.height : e)),
|
||
l(!0);
|
||
return;
|
||
}
|
||
l(!1), d(eV);
|
||
let i = new Image();
|
||
return (
|
||
(i.onload = () => {
|
||
let t = (0, I.computeNodeDimensionsFromNatural)(
|
||
i.naturalWidth,
|
||
i.naturalHeight,
|
||
);
|
||
eW.set(e, t);
|
||
let n = w.current,
|
||
r = v.current;
|
||
(n && r && t.width === n && t.height === r) ||
|
||
(h(t.width), d(t.height)),
|
||
g(i.naturalWidth),
|
||
m(i.naturalHeight),
|
||
l(!0);
|
||
}),
|
||
(i.onerror = () => {
|
||
let e = w.current ?? I.NODE_WIDTH,
|
||
t = v.current ?? eV;
|
||
h((t) => (t !== e ? e : t)), d((e) => (e !== t ? t : e)), l(!0);
|
||
}),
|
||
(i.src = (function (e) {
|
||
let t = (0, e$.convertToChinaCdn)(e);
|
||
if (
|
||
!t.includes("libtv-res.liblib.art") ||
|
||
!t.startsWith("http") ||
|
||
t.includes("x-oss-process=")
|
||
)
|
||
return t;
|
||
let n = t.includes("?") ? "&" : "?";
|
||
return `${t}${n}x-oss-process=image/resize,w_100,m_lfit/format,webp/ignore-error,1`;
|
||
})(e)),
|
||
() => {
|
||
(i.onload = null), (i.onerror = null);
|
||
}
|
||
);
|
||
}, [e]),
|
||
{
|
||
loaded: c,
|
||
nodeWidth: u,
|
||
nodeHeight: f,
|
||
naturalWidth: p,
|
||
naturalHeight: b,
|
||
}
|
||
);
|
||
}
|
||
function eq({ size: e = 14, className: n = "" }) {
|
||
return (0, t.jsx)(w.Icons.ImageS, { width: e, height: e, className: n });
|
||
}
|
||
function eX({ size: e = 14, className: n = "" }) {
|
||
return (0, t.jsx)(w.Icons.ImagePlaceholder, {
|
||
width: e,
|
||
height: e,
|
||
className: n,
|
||
});
|
||
}
|
||
function eY({ size: e = 14, className: n = "" }) {
|
||
return (0, t.jsx)(w.Icons.Upload, { width: e, height: e, className: n });
|
||
}
|
||
function eJ({ size: e = 16, className: n = "" }) {
|
||
return (0, t.jsx)("svg", {
|
||
width: e,
|
||
height: e,
|
||
viewBox: "0 0 16 16",
|
||
fill: "none",
|
||
xmlns: "http://www.w3.org/2000/svg",
|
||
className: n,
|
||
children: (0, t.jsx)("path", {
|
||
d: "M14.666 12.6689L14.6631 12.7715C14.6112 13.7941 13.7911 14.6141 12.7686 14.666L12.666 14.6689H9.11914V13.6689H12.666C13.2182 13.6689 13.6659 13.2211 13.666 12.6689V9.11133H14.666V12.6689ZM5.99902 8.83594C6.64319 8.83594 7.16575 9.35785 7.16602 10.002V13.3359C7.16593 13.9802 6.6433 14.502 5.99902 14.502H2.66602C2.02182 14.5019 1.49911 13.9801 1.49902 13.3359V10.002C1.49929 9.3579 2.02193 8.83603 2.66602 8.83594H5.99902ZM2.66602 9.83594C2.57421 9.83603 2.49929 9.91019 2.49902 10.002V13.3359C2.49911 13.4279 2.5741 13.5019 2.66602 13.502H5.99902C6.09102 13.502 6.16593 13.4279 6.16602 13.3359V10.002C6.16575 9.91013 6.09091 9.83594 5.99902 9.83594H2.66602ZM12.7686 1.33789C13.8253 1.3915 14.666 2.26591 14.666 3.33594V7.42773H13.666V3.33594C13.666 3.2542 13.6552 3.17467 13.6367 3.09863L9.0127 7.72363L8.30566 7.0166L12.9453 2.37598C12.8567 2.35023 12.763 2.33595 12.666 2.33594H9.11914V1.33594H12.666L12.7686 1.33789ZM7.43555 2.33594H3.33301C2.78072 2.33594 2.33301 2.78365 2.33301 3.33594V7.42773H1.33301V3.33594C1.33301 2.26602 2.17294 1.39166 3.22949 1.33789L3.33301 1.33594H7.43555V2.33594Z",
|
||
fill: "currentColor",
|
||
}),
|
||
});
|
||
}
|
||
let eZ = {
|
||
padding: "2px",
|
||
borderRadius: 8,
|
||
border: "0.5px solid var(--canvas-controls-border)",
|
||
background: "var(--canvas-controls-bg)",
|
||
boxShadow: "var(--canvas-shadow-dropdown)",
|
||
backdropFilter: "blur(16px)",
|
||
};
|
||
function eQ() {
|
||
return (0, t.jsxs)("div", {
|
||
className:
|
||
"flex h-full w-full flex-col items-center justify-center gap-3 rounded-xl px-6",
|
||
style: {
|
||
background: "var(--Surface-Panel-background, #171717)",
|
||
border: "1px solid var(--canvas-node-border)",
|
||
},
|
||
children: [
|
||
(0, t.jsx)("span", {
|
||
className: "text-center text-base font-semibold text-white",
|
||
children: "聚焦模式",
|
||
}),
|
||
(0, t.jsx)("span", {
|
||
className: "text-center text-sm text-white/90",
|
||
children: "请选择一张图像进行「局部框选」操作",
|
||
}),
|
||
(0, t.jsx)("span", {
|
||
className: "text-center text-sm text-white/60",
|
||
children: "按ESC键可退出当前模式",
|
||
}),
|
||
],
|
||
});
|
||
}
|
||
function e1(e, { relX: t, relY: i, placement: r, gap: a = 8 }) {
|
||
(0, n.useLayoutEffect)(() => {
|
||
let n,
|
||
o,
|
||
s = e.current;
|
||
if (!s) return;
|
||
let c = s.offsetParent;
|
||
if (!c) return;
|
||
let l = c.clientWidth,
|
||
u = c.clientHeight,
|
||
h = s.offsetWidth,
|
||
f = s.offsetHeight;
|
||
if (0 === l || 0 === u || 0 === h || 0 === f) return;
|
||
let d = t * l,
|
||
p = i * u;
|
||
"top-center" === r
|
||
? ((n = d - h / 2), (o = p - f - a))
|
||
: ((n = d - h / 2), (o = p - f / 2));
|
||
let g = (n = Math.max(0, Math.min(n, l - h))) - d,
|
||
b = (o = Math.max(0, Math.min(o, u - f))) - p;
|
||
s.style.transform = `translate(${g}px, ${b}px)`;
|
||
}, [e, t, i, r, a]);
|
||
}
|
||
function e0({ suggestion: e }) {
|
||
let { x: n, y: i, width: r, height: a } = e.bbox;
|
||
return (0, t.jsx)("div", {
|
||
className: "pointer-events-none absolute rounded-sm",
|
||
style: {
|
||
left: `${100 * n}%`,
|
||
top: `${100 * i}%`,
|
||
width: `${100 * r}%`,
|
||
height: `${100 * a}%`,
|
||
border: "2px solid rgba(255, 255, 255, 0.8)",
|
||
},
|
||
});
|
||
}
|
||
function e2({ markPoint: e, onSuggestionChange: i, onDelete: r }) {
|
||
let {
|
||
suggestions: a,
|
||
selectedSuggestionIndex: o,
|
||
apiResponseId: s,
|
||
relX: c,
|
||
relY: l,
|
||
} = e,
|
||
[u, h] = (0, n.useState)(!1),
|
||
[f, d] = (0, n.useState)(!1),
|
||
p = (0, n.useRef)(null),
|
||
g = (0, n.useRef)(null),
|
||
b = (0, z.useMarkPointStore)((e) => e.setSelectedSuggestion);
|
||
e1(g, { relX: c, relY: l, placement: "top-center" });
|
||
let m = l > 0.6,
|
||
v = (0, n.useCallback)(() => {
|
||
setTimeout(() => h(!1), 150);
|
||
}, []);
|
||
if (!a?.length || !s) return null;
|
||
let x = a[o] ?? a[0],
|
||
y = a.length > 1;
|
||
return (0, t.jsxs)("div", {
|
||
ref: g,
|
||
className: "pointer-events-auto absolute",
|
||
style: {
|
||
left: `${100 * c}%`,
|
||
top: `${100 * l}%`,
|
||
transform: "translate(-50%, calc(-100% - 8px))",
|
||
zIndex: u ? 200 : 110,
|
||
},
|
||
onMouseDown: (e) => {
|
||
e.stopPropagation();
|
||
},
|
||
onClick: (e) => {
|
||
e.stopPropagation();
|
||
},
|
||
onBlur: v,
|
||
onMouseEnter: () => d(!0),
|
||
onMouseLeave: () => d(!1),
|
||
children: [
|
||
(0, t.jsxs)("div", {
|
||
className: "flex items-center gap-1",
|
||
children: [
|
||
(0, t.jsxs)("button", {
|
||
type: "button",
|
||
className: (0, $.cn)(
|
||
"flex items-center gap-1.5 rounded-full px-3 py-1.5",
|
||
"bg-[#2a2a2a] text-sm text-white shadow-lg",
|
||
"border border-white/10",
|
||
y && "cursor-pointer hover:bg-[#333]",
|
||
!y && "cursor-default",
|
||
),
|
||
onMouseDown: (e) => {
|
||
e.stopPropagation();
|
||
},
|
||
onClick: (e) => {
|
||
e.stopPropagation(), y && h((e) => !e);
|
||
},
|
||
children: [
|
||
(0, t.jsx)(w.Icons.sparkles, {
|
||
width: 14,
|
||
height: 14,
|
||
className: "text-white/80",
|
||
}),
|
||
(0, t.jsx)("span", {
|
||
className: "whitespace-nowrap",
|
||
children: x?.label,
|
||
}),
|
||
y &&
|
||
(0, t.jsx)(w.Icons.lucideChevronDown, {
|
||
width: 14,
|
||
height: 14,
|
||
className: (0, $.cn)(
|
||
"text-white/60 transition-transform",
|
||
u && "rotate-180",
|
||
),
|
||
}),
|
||
],
|
||
}),
|
||
(0, t.jsx)("button", {
|
||
type: "button",
|
||
className: (0, $.cn)(
|
||
"flex h-6 w-6 shrink-0 items-center justify-center rounded-full",
|
||
"border border-white/10 bg-[#2a2a2a] shadow-lg",
|
||
"text-white/60 hover:bg-[#3a3a3a] hover:text-white",
|
||
"transition-all duration-150",
|
||
f || u
|
||
? "scale-100 opacity-100"
|
||
: "pointer-events-none scale-75 opacity-0",
|
||
),
|
||
onMouseDown: (e) => {
|
||
e.stopPropagation(), e.preventDefault();
|
||
},
|
||
onClick: (e) => {
|
||
e.stopPropagation(), e.preventDefault(), r?.(s);
|
||
},
|
||
children: (0, t.jsx)(w.Icons.x, { width: 12, height: 12 }),
|
||
}),
|
||
],
|
||
}),
|
||
u &&
|
||
y &&
|
||
(0, t.jsx)("div", {
|
||
ref: p,
|
||
className: (0, $.cn)(
|
||
"absolute left-1/2 z-50 min-w-[120px] -translate-x-1/2 overflow-hidden rounded-lg border border-white/10 bg-[#2a2a2a] py-1 shadow-xl",
|
||
m ? "bottom-full mb-1" : "top-full mt-1",
|
||
),
|
||
onMouseDown: (e) => {
|
||
e.stopPropagation();
|
||
},
|
||
onClick: (e) => {
|
||
e.stopPropagation();
|
||
},
|
||
children: a.map((e, n) =>
|
||
(0, t.jsxs)(
|
||
"button",
|
||
{
|
||
type: "button",
|
||
className: (0, $.cn)(
|
||
"flex w-full items-center justify-between gap-2 px-3 py-2 text-left text-sm transition-colors",
|
||
"hover:bg-white/10",
|
||
n === o ? "text-white" : "text-white/70",
|
||
),
|
||
onMouseDown: (e) => {
|
||
e.stopPropagation();
|
||
},
|
||
onClick: (e) => {
|
||
e.preventDefault(),
|
||
e.stopPropagation(),
|
||
b(s, n),
|
||
i?.(s, n),
|
||
h(!1);
|
||
},
|
||
children: [
|
||
(0, t.jsx)("span", { children: e.label }),
|
||
n === o &&
|
||
(0, t.jsx)("div", {
|
||
className: "h-2 w-2 rounded-full bg-white/60",
|
||
}),
|
||
],
|
||
},
|
||
`${e.label}-${e.bbox.x}-${e.bbox.y}-${e.bbox.width}-${e.bbox.height}`,
|
||
),
|
||
),
|
||
}),
|
||
],
|
||
});
|
||
}
|
||
e.s(
|
||
[
|
||
"FLOATING_TOOLBAR_STYLE",
|
||
0,
|
||
eZ,
|
||
"FillFrameIcon",
|
||
() => eJ,
|
||
"FocusModePlaceholder",
|
||
() => eQ,
|
||
"Image2Icon",
|
||
() => eX,
|
||
"ImageIcon",
|
||
() => eq,
|
||
"ImageUploadIcon",
|
||
() => eY,
|
||
"useImageNodeHeight",
|
||
() => eK,
|
||
],
|
||
251292,
|
||
);
|
||
let e3 = (0, n.memo)(function ({
|
||
markPoint: e,
|
||
onSuggestionChange: n,
|
||
onDelete: i,
|
||
}) {
|
||
let { suggestions: r, selectedSuggestionIndex: a } = e;
|
||
if (!r?.length) return null;
|
||
let o = r[a] ?? r[0];
|
||
return (0, t.jsxs)(t.Fragment, {
|
||
children: [
|
||
(0, t.jsx)(e0, { suggestion: o }),
|
||
(0, t.jsx)(e2, { markPoint: e, onSuggestionChange: n, onDelete: i }),
|
||
],
|
||
});
|
||
});
|
||
function e4({ relX: e, relY: i }) {
|
||
let r = (0, n.useRef)(null);
|
||
return (
|
||
e1(r, { relX: e, relY: i, placement: "center", gap: 0 }),
|
||
(0, t.jsx)("div", {
|
||
ref: r,
|
||
className: "pointer-events-none absolute",
|
||
style: {
|
||
left: `${100 * e}%`,
|
||
top: `${100 * i}%`,
|
||
transform: "translate(-50%, -50%)",
|
||
zIndex: 100,
|
||
},
|
||
children: (0, t.jsxs)("div", {
|
||
className:
|
||
"border-border-default border-hair bg-card/95 flex items-center gap-1 rounded-lg px-2 py-1 shadow-[0px_4px_10px_0px_rgba(0,0,0,0.12),0px_2px_4px_0px_rgba(0,0,0,0.2)] backdrop-blur-[32px]",
|
||
children: [
|
||
(0, t.jsx)(w.Icons.loader2, {
|
||
className: "text-fg-muted size-3.5 shrink-0 animate-spin",
|
||
}),
|
||
(0, t.jsx)("span", {
|
||
className: "text-fg-muted whitespace-nowrap text-xs",
|
||
children: "分析中...",
|
||
}),
|
||
],
|
||
}),
|
||
})
|
||
);
|
||
}
|
||
async function e5(e) {
|
||
let t = document.createElement("canvas");
|
||
(t.width = e.naturalWidth), (t.height = e.naturalHeight);
|
||
let n = t.getContext("2d");
|
||
if (!n) throw Error("Failed to get canvas 2d context");
|
||
try {
|
||
return (
|
||
n.drawImage(e, 0, 0),
|
||
t.toDataURL("image/png").replace(/^data:image\/\w+;base64,/, "")
|
||
);
|
||
} catch {
|
||
return new Promise((i, r) => {
|
||
let a = new Image();
|
||
(a.crossOrigin = "anonymous"),
|
||
(a.onload = () => {
|
||
(t.width = a.naturalWidth),
|
||
(t.height = a.naturalHeight),
|
||
n.drawImage(a, 0, 0);
|
||
try {
|
||
let e = t.toDataURL("image/png");
|
||
i(e.replace(/^data:image\/\w+;base64,/, ""));
|
||
} catch (e) {
|
||
r(e instanceof Error ? e : Error(String(e)));
|
||
}
|
||
}),
|
||
(a.onerror = () =>
|
||
r(Error("Failed to load image for base64 conversion"))),
|
||
(a.src = e.src);
|
||
});
|
||
}
|
||
}
|
||
e3.displayName = "MagicSuggestionOverlay";
|
||
let e6 =
|
||
"flex h-8 w-8 min-w-8 shrink-0 items-center justify-center rounded-lg text-neutral-50 transition-colors hover:bg-white/10 canvas-light:text-canvas-controls-text canvas-light:hover:bg-black/5 disabled:pointer-events-none disabled:opacity-40",
|
||
e8 = [],
|
||
e9 = (0, n.memo)(function ({ id: ex, selected: ey }) {
|
||
var e_;
|
||
let eS,
|
||
eE,
|
||
eM,
|
||
eT,
|
||
ek,
|
||
eC,
|
||
eA,
|
||
eN,
|
||
eI,
|
||
eP,
|
||
eR,
|
||
eL,
|
||
eB = (0, U.useCanvasStore)((0, B.selectNodeData)(ex)),
|
||
eH = (0, U.useCanvasStore)((0, B.selectNodeResourceMeta)(ex)),
|
||
ez = (0, U.useCanvasStore)((0, B.selectHasIncomingEdge)(ex)),
|
||
e$ = (0, U.useCanvasStore)((0, B.selectHasOutgoingEdge)(ex)),
|
||
eV = (0, U.useCanvasStore)((e) => {
|
||
let t = e.getNode(ex);
|
||
if (!t?.parentId) return !1;
|
||
let n = e.getNode(t.parentId),
|
||
i = n?.data?.name ?? n?.data?.label ?? "";
|
||
return "string" == typeof i
|
||
? i.startsWith("宫格生图组")
|
||
: null != i && JSON.stringify(i).startsWith("宫格生图组");
|
||
}),
|
||
{
|
||
updateNodeData: eW,
|
||
markDownstreamStale: eJ,
|
||
updateNode: e1,
|
||
addNode: e0,
|
||
addEdge: e2,
|
||
applyNodeChanges: e9,
|
||
} = (0, U.useCanvasStore)((e) => ({
|
||
updateNodeData: e.updateNodeData,
|
||
markDownstreamStale: e.markDownstreamStale,
|
||
updateNode: e.updateNode,
|
||
addNode: e.addNode,
|
||
addEdge: e.addEdge,
|
||
applyNodeChanges: e.applyNodeChanges,
|
||
})),
|
||
{
|
||
isMarkMode: e7,
|
||
isFocusMode: te,
|
||
focusSourceNodeId: tt,
|
||
focusInteractingNodeId: tn,
|
||
focusCancelKey: ti,
|
||
isReadonly: tr,
|
||
projectId: ta,
|
||
isCanvasCaptureMode: to,
|
||
canvasCaptureCallback: ts,
|
||
setCanvasCaptureMode: tc,
|
||
markSourceNodeId: tl,
|
||
} = (0, U.useCanvasStore)((e) => ({
|
||
isMarkMode: e.isMarkMode,
|
||
isFocusMode: e.isFocusMode,
|
||
focusSourceNodeId: e.focusSourceNodeId,
|
||
focusInteractingNodeId: e.focusInteractingNodeId,
|
||
focusCancelKey: e.focusCancelKey,
|
||
isReadonly: e.isReadonly,
|
||
projectId: e.projectId,
|
||
isCanvasCaptureMode: e.isCanvasCaptureMode,
|
||
canvasCaptureCallback: e.canvasCaptureCallback,
|
||
setCanvasCaptureMode: e.setCanvasCaptureMode,
|
||
markSourceNodeId: e.markSourceNodeId,
|
||
})),
|
||
tu = (0, U.useGlobalStore)((e) => e.getModel),
|
||
th = (0, H.useCanvasThemeStore)((e) => e.theme),
|
||
tf = (0, U.useGlobalStore)((e) => e.defaultModel.image),
|
||
td = (0, eu.useNodeDimensionSync)(ex),
|
||
tp = (0, n.useRef)(null),
|
||
tg = (0, n.useRef)(null),
|
||
tb = (0, n.useRef)(null),
|
||
tm = (0, n.useRef)(null),
|
||
tw = (0, E.useIncomingNodeData)(ex),
|
||
tv = eB?.generatorType === R.GeneratorType.ENHANCE,
|
||
tx = tv ? (tw.imageList[0]?.url ?? null) : null,
|
||
ty = (0, U.useCanvasStore)((e) => e.editingNodeId),
|
||
t_ = (0, U.useCanvasStore)((e) => e.editingImageTool),
|
||
tS = (0, U.useCanvasStore)((e) => e.panoramaPreviewNodeIds),
|
||
tE = (0, U.useCanvasStore)((e) => e.setPanoramaPreviewNodeId),
|
||
tM = (0, U.useCanvasStore)((e) => e.removePanoramaPreviewNodeId),
|
||
tT = tS.has(ex),
|
||
tk = eB?.isPanoramicOutput === !0,
|
||
tC = ty === ex && "rotateOrMirror" === t_,
|
||
tA = e7 && tl === ex,
|
||
tN = !!eB?.portraitAssetId,
|
||
tI =
|
||
((0, ef.useShouldShowGenerator)(ey, ex) || tA) &&
|
||
ty !== ex &&
|
||
(!(0, R.isResourceAction)(eB?.action) || tN),
|
||
tP = eB?.showGenerator ?? eB?.action !== R.NodeAction.IMAGE_EDIT,
|
||
tR =
|
||
((0, n.useMemo)(() => {
|
||
let e = eB?.rotateAngle;
|
||
return (
|
||
null != e &&
|
||
"number" == typeof e &&
|
||
(((Math.round(e) % 360) + 360) % 360) % 90 != 0
|
||
);
|
||
}, [eB?.rotateAngle]),
|
||
(0, s.useReactFlow)()),
|
||
{ getNode: tL, getNodes: tD, setCenter: tj, getZoom: tO } = tR,
|
||
tF = (0, n.useCallback)(
|
||
(e) => {
|
||
let t = tD().map((t) => ({
|
||
type: "select",
|
||
id: t.id,
|
||
selected: t.id === e,
|
||
}));
|
||
t.push({ type: "select", id: e, selected: !0 }), e9(t);
|
||
},
|
||
[tD, e9],
|
||
),
|
||
tU = (0, n.useCallback)(
|
||
(e) => {
|
||
if (0 !== e.button || tr) return;
|
||
e.stopPropagation();
|
||
let t = tD();
|
||
if (e.shiftKey || e.metaKey || e.ctrlKey) {
|
||
let e = t.find((e) => e.id === ex);
|
||
e9([{ type: "select", id: ex, selected: !e?.selected }]);
|
||
} else
|
||
e9(
|
||
t.map((e) => ({
|
||
type: "select",
|
||
id: e.id,
|
||
selected: e.id === ex,
|
||
})),
|
||
);
|
||
},
|
||
[e9, tD, ex, tr],
|
||
),
|
||
tB = (0, eb.useNodeInteraction)(ex, ey),
|
||
{
|
||
pipelineNodeStatus: tH,
|
||
pipelineBorderColor: tz,
|
||
isDraggingConnection: tG,
|
||
} = tB,
|
||
t$ = (0, eg.isTaskGenerating)(eB?.taskInfo),
|
||
tV = (0, eg.isTaskFailed)(eB?.taskInfo),
|
||
tW = eB?.url ?? e8,
|
||
tK = tW[0],
|
||
tq = !!tK && (tK.startsWith("blob:") || tK.startsWith("data:")),
|
||
tX = !!tK,
|
||
tY = tW.length > 1,
|
||
tJ = eB?.alt,
|
||
tZ = eB?.name || eB?.label || "图片",
|
||
tQ =
|
||
eB?._mattingNode === !0 ||
|
||
(eB?.action === R.NodeAction.IMAGE_EDIT &&
|
||
(eB?.label === "抠图" || eB?.name === "抠图")),
|
||
t1 = eB?._pendingThirdAssetUuid,
|
||
t0 = eB?._starVideoCheckStatus,
|
||
{ isReviewing: t2 } = (0, ed.useThirdAssetNodeSync)({
|
||
id: ex,
|
||
nodeType: R.NodeType.IMAGE,
|
||
pendingUuid: t1,
|
||
updateNodeData: eW,
|
||
}),
|
||
t3 = t2 || "checking" === t0,
|
||
t4 = "failed" === t0,
|
||
t5 = (0, n.useMemo)(
|
||
() =>
|
||
t3
|
||
? (0, t.jsxs)("span", {
|
||
className:
|
||
"flex items-center gap-0.5 text-[12px] text-[#09CAF5]/80",
|
||
children: [
|
||
(0, t.jsx)("span", {
|
||
className:
|
||
"mr-0.5 inline-block h-1.5 w-1.5 animate-pulse rounded-full bg-[#09CAF5]",
|
||
}),
|
||
"校验中",
|
||
],
|
||
})
|
||
: t4
|
||
? (0, t.jsx)("span", {
|
||
className:
|
||
"flex items-center text-[12px] text-[#F5514F]/80",
|
||
children: "审核失败",
|
||
})
|
||
: tN
|
||
? (0, t.jsx)(y.Tooltip, {
|
||
label: "素材内容已合规，可用于Seedance2.0视频生成",
|
||
position: "top",
|
||
withArrow: !0,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className: "flex shrink-0 items-center",
|
||
children: (0, t.jsx)(w.Icons.ShieldCheck, {
|
||
width: 14,
|
||
height: 14,
|
||
className: "text-[#09CAF5]",
|
||
}),
|
||
}),
|
||
})
|
||
: void 0,
|
||
[t3, t4, tN],
|
||
),
|
||
t6 = (0, n.useMemo)(
|
||
() => (0, ea.getNodeTitleDimensionHint)(eH ?? void 0),
|
||
[eH],
|
||
),
|
||
t8 = (0, n.useCallback)((e) => eW(ex, { name: e }), [ex, eW]),
|
||
t9 = (0, n.useCallback)(() => eW(ex, { isStale: !1 }), [ex, eW]),
|
||
t7 = (0, n.useCallback)(async () => {
|
||
let e = eB?.selectedSlash,
|
||
t = eB?.params;
|
||
if (!e || !t)
|
||
return void v.Notify.error("缺少重试参数，请重新配置后生成");
|
||
let { model: n, provider: i, ...r } = e.match ?? {},
|
||
a = {
|
||
...t,
|
||
scene: e.scene || t.scene,
|
||
...r,
|
||
...(n ? { model: n } : {}),
|
||
},
|
||
o = (0, J.buildRequestData)(a, "image", ex, ta ?? "", tu);
|
||
n && (o.model = n),
|
||
i && (o.provider = i),
|
||
eW(ex, {
|
||
taskInfo: {
|
||
taskId: "",
|
||
loading: !0,
|
||
status: 0,
|
||
failedReason: void 0,
|
||
},
|
||
});
|
||
try {
|
||
let e = await (0, F.submitGenerationTask)(o);
|
||
if (e.success) {
|
||
if (!e.taskId) {
|
||
v.Notify.error("任务创建成功但缺少 taskId，请重试"),
|
||
eW(ex, {
|
||
taskInfo: {
|
||
taskId: "",
|
||
loading: !1,
|
||
status: 3,
|
||
failedReason: "任务创建成功但缺少 taskId",
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
eW(ex, {
|
||
taskInfo: {
|
||
taskId: e.taskId,
|
||
loading: !0,
|
||
status: 0,
|
||
failedReason: void 0,
|
||
},
|
||
});
|
||
} else
|
||
e.handledByCommercial ||
|
||
v.Notify.error(e.errorMsg ?? "生成失败"),
|
||
eW(ex, {
|
||
taskInfo: {
|
||
taskId: "",
|
||
loading: !1,
|
||
status: 3,
|
||
failedReason: e.errorMsg ?? "生成失败",
|
||
},
|
||
});
|
||
} catch {
|
||
v.Notify.error("网络异常，请重试"),
|
||
eW(ex, {
|
||
taskInfo: {
|
||
taskId: "",
|
||
loading: !1,
|
||
status: 3,
|
||
failedReason: "网络异常，请重试",
|
||
},
|
||
});
|
||
}
|
||
}, [eB?.selectedSlash, eB?.params, ex, ta, tu, eW]),
|
||
ne = (0, n.useCallback)(async () => {
|
||
let e = U.stores.canvas?.getNode(ex),
|
||
t = e?.data,
|
||
n = t?.params;
|
||
if (!n) return;
|
||
let i = t?._retryMeta;
|
||
eW(ex, {
|
||
isStale: !1,
|
||
taskInfo: {
|
||
taskId: "",
|
||
loading: !0,
|
||
status: 0,
|
||
failedReason: void 0,
|
||
},
|
||
});
|
||
let r = tw.imageList
|
||
.map((e) => e?.url)
|
||
.filter((e) => "string" == typeof e && e.length > 0),
|
||
a = tw.videoList
|
||
.map((e) => e?.url)
|
||
.filter((e) => "string" == typeof e && e.length > 0),
|
||
o = tw.audioList
|
||
.map((e) => e?.url)
|
||
.filter((e) => "string" == typeof e && e.length > 0),
|
||
s = tw.textList.flatMap((e) =>
|
||
Array.isArray(e?.content)
|
||
? e.content.filter(
|
||
(e) => "string" == typeof e && e.length > 0,
|
||
)
|
||
: [],
|
||
),
|
||
c = r[0];
|
||
try {
|
||
let e;
|
||
if (i) {
|
||
let t = {
|
||
...n,
|
||
textList: s,
|
||
imageList: r,
|
||
videoList: a,
|
||
audioList: o,
|
||
};
|
||
c &&
|
||
(Array.isArray(t.images) &&
|
||
(t.images = [c, ...t.images.slice(1)].filter(
|
||
(e) => "string" == typeof e && e.length > 0,
|
||
)),
|
||
Array.isArray(t.refImages) && (t.refImages = r),
|
||
Array.isArray(t.referenceImages) && (t.referenceImages = r),
|
||
"string" == typeof t.originImage &&
|
||
"erase" !== t.scene &&
|
||
(t.originImage = c));
|
||
let l = {
|
||
params: t,
|
||
metadata: { node_id: ex, project_id: ta ?? "" },
|
||
provider: i.provider ?? "",
|
||
model: i.model ?? "",
|
||
taskType: i.taskType ?? "image",
|
||
requestId: crypto.randomUUID(),
|
||
};
|
||
if ("light-control" === t.scene) {
|
||
let t = await (0, j.createLightingTask)(l);
|
||
if (t?.code === 0) e = t.data?.taskId;
|
||
else throw Error(String(t?.msg ?? "打光任务失败"));
|
||
} else {
|
||
let t = await (0, F.submitGenerationTask)(l);
|
||
if (t.success) e = t.taskId;
|
||
else {
|
||
t.handledByCommercial ||
|
||
v.Notify.error(t.errorMsg ?? "生成失败"),
|
||
eW(ex, {
|
||
taskInfo: {
|
||
taskId: "",
|
||
loading: !1,
|
||
status: 3,
|
||
failedReason: t.errorMsg ?? "生成失败",
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
}
|
||
} else {
|
||
let t = {
|
||
...n,
|
||
textList: tw.textList,
|
||
imageList: tw.imageList,
|
||
videoList: tw.videoList,
|
||
audioList: tw.audioList,
|
||
};
|
||
c &&
|
||
("string" == typeof t.originImage &&
|
||
"erase" !== t.scene &&
|
||
(t.originImage = c),
|
||
Array.isArray(t.refImages) && (t.refImages = r),
|
||
Array.isArray(t.referenceImages) && (t.referenceImages = r));
|
||
let i = (0, J.buildRequestData)(t, "image", ex, ta ?? "", tu),
|
||
a = await (0, F.submitGenerationTask)(i);
|
||
if (a.success) e = a.taskId;
|
||
else {
|
||
a.handledByCommercial ||
|
||
v.Notify.error(a.errorMsg ?? "生成失败"),
|
||
eW(ex, {
|
||
taskInfo: {
|
||
taskId: "",
|
||
loading: !1,
|
||
status: 3,
|
||
failedReason: a.errorMsg ?? "生成失败",
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
}
|
||
e &&
|
||
eW(ex, {
|
||
taskInfo: {
|
||
taskId: e,
|
||
loading: !0,
|
||
status: 0,
|
||
failedReason: void 0,
|
||
},
|
||
});
|
||
} catch (t) {
|
||
let e = t instanceof Error ? t.message : "网络异常，请重试";
|
||
v.Notify.error(e),
|
||
eW(ex, {
|
||
taskInfo: {
|
||
taskId: "",
|
||
loading: !1,
|
||
status: 3,
|
||
failedReason: e,
|
||
},
|
||
});
|
||
}
|
||
}, [ex, ta, tu, eW, tw.imageList]),
|
||
nt = (0, n.useCallback)(async () => {
|
||
let e = tw.imageList[0]?.url;
|
||
if (e) {
|
||
eW(ex, { isStale: !1 });
|
||
try {
|
||
let t = (0, T.buildRemoveBackgroundRequest)(e.trim(), {
|
||
cid: (0, V.getCookieWebid)(),
|
||
eid: (0, Y.createRandomId)(),
|
||
}),
|
||
n = await (0, j.removeBackgroundInference)(t),
|
||
i = n?.images?.[0];
|
||
if (!i) throw Error("未返回抠图结果");
|
||
let r = (0, j.getRemoveBackgroundImageUrl)(i);
|
||
eW(ex, { url: [r] }), eJ(ex);
|
||
} catch (t) {
|
||
let e = t instanceof Error ? t.message : "抠图失败";
|
||
v.Notify.error(e);
|
||
}
|
||
}
|
||
}, [ex, tw.imageList, eW, eJ]),
|
||
nn = (0, n.useCallback)(async () => {
|
||
let e = tw.imageList[0]?.url,
|
||
t = U.stores.canvas?.getNode(ex),
|
||
n = t?.data,
|
||
i = n?.params,
|
||
r = n?._outpaintPads,
|
||
a = n?._retryMeta;
|
||
if (!e || !i || !r || !a) return;
|
||
let o = (0, W.getCookie)(N.USER_TOKEN_COOKIE_KEY),
|
||
s = (0, W.getCookie)(N.USER_UUID_COOKIE_KEY);
|
||
if (!o || "string" != typeof o || !s || "string" != typeof s)
|
||
return void v.Notify.error("请先登录");
|
||
eW(ex, {
|
||
isStale: !1,
|
||
taskInfo: {
|
||
taskId: "",
|
||
loading: !0,
|
||
status: 0,
|
||
failedReason: void 0,
|
||
},
|
||
});
|
||
try {
|
||
let t = new Image();
|
||
(t.crossOrigin = "anonymous"),
|
||
await new Promise((n, i) => {
|
||
(t.onload = () => n()),
|
||
(t.onerror = () => i(Error("上游图片加载失败"))),
|
||
(t.src = e.trim());
|
||
});
|
||
let n = t.naturalWidth,
|
||
c = t.naturalHeight,
|
||
{ srcW: l, srcH: u } = r,
|
||
h = l > 0 ? n / l : 1,
|
||
f = u > 0 ? c / u : 1,
|
||
d = {
|
||
top: Math.round(r.top * f),
|
||
right: Math.round(r.right * h),
|
||
bottom: Math.round(r.bottom * f),
|
||
left: Math.round(r.left * h),
|
||
},
|
||
p = await (0, k.compositeOutpaintImage)(e.trim(), d, n, c),
|
||
g = await (0, k.dataUrlToFile)(p, "outpaint-composite"),
|
||
b = (
|
||
await (0, Q.uploadViaPreSign)(g, {
|
||
token: o,
|
||
uuid: s,
|
||
onCalcHashEnd: () => void 0,
|
||
})
|
||
).url;
|
||
if (!b) throw Error("上传图片失败");
|
||
let m = {
|
||
params: { ...i, originImage: b },
|
||
metadata: { node_id: ex, project_id: ta ?? "" },
|
||
provider: a.provider ?? "",
|
||
model: a.model ?? "",
|
||
taskType: a.taskType ?? "image",
|
||
requestId: crypto.randomUUID(),
|
||
},
|
||
w = await (0, F.submitGenerationTask)(m);
|
||
w.success && w.taskId
|
||
? eW(ex, {
|
||
taskInfo: {
|
||
taskId: w.taskId,
|
||
loading: !0,
|
||
status: 0,
|
||
failedReason: void 0,
|
||
},
|
||
})
|
||
: (w.handledByCommercial ||
|
||
v.Notify.error(w.errorMsg ?? "扩图生成失败"),
|
||
eW(ex, {
|
||
taskInfo: {
|
||
taskId: "",
|
||
loading: !1,
|
||
status: 3,
|
||
failedReason: w.errorMsg ?? "扩图生成失败",
|
||
},
|
||
}));
|
||
} catch (t) {
|
||
let e = t instanceof Error ? t.message : "扩图失败";
|
||
v.Notify.error(e),
|
||
eW(ex, {
|
||
taskInfo: {
|
||
taskId: "",
|
||
loading: !1,
|
||
status: 3,
|
||
failedReason: e,
|
||
},
|
||
});
|
||
}
|
||
}, [ex, ta, tw.imageList, eW]),
|
||
ni = (0, n.useCallback)(() => {
|
||
ne();
|
||
}, [ne]),
|
||
nr = (0, n.useCallback)(() => {
|
||
nt();
|
||
}, [nt]),
|
||
na = (0, n.useCallback)(() => {
|
||
nn();
|
||
}, [nn]),
|
||
no = (0, n.useCallback)(() => {
|
||
t7();
|
||
}, [t7]),
|
||
ns = (0, n.useCallback)(() => {
|
||
let e = eB?.taskInfo?.taskId;
|
||
e &&
|
||
(0, j.stopTaskBatch)([e]).then(() => {
|
||
let t = U.stores.canvas?.getNode(ex),
|
||
n = t?.data;
|
||
n?.taskInfo?.taskId !== e ||
|
||
eW(ex, {
|
||
taskInfo: n?.prevTaskInfo ?? void 0,
|
||
prevTaskInfo: void 0,
|
||
});
|
||
});
|
||
}, [eB?.taskInfo?.taskId, ex, eW]),
|
||
nc = t$ && tX,
|
||
nl = t$
|
||
? nc
|
||
? "generating_with_content"
|
||
: "generating"
|
||
: tV
|
||
? "failed"
|
||
: tX
|
||
? "resource"
|
||
: ez || e$
|
||
? "pending"
|
||
: "empty_generate",
|
||
nu = eH?.items?.[0]?.byteSize,
|
||
nh = (0, n.useRef)();
|
||
(0, n.useEffect)(
|
||
() => () => {
|
||
nh.current &&
|
||
(URL.revokeObjectURL(nh.current), (nh.current = void 0));
|
||
},
|
||
[],
|
||
),
|
||
tK && (tK.startsWith("blob:") || tK.startsWith("data:"))
|
||
? (nh.current &&
|
||
nh.current !== tK &&
|
||
URL.revokeObjectURL(nh.current),
|
||
(nh.current = tK))
|
||
: nh.current &&
|
||
(URL.revokeObjectURL(nh.current), (nh.current = void 0));
|
||
let nf = (0, s.useStore)((e) => e.transform[2]),
|
||
nd = ey && nf >= 1 && tX && !tq,
|
||
{
|
||
retryKey: np,
|
||
showRetryButton: ng,
|
||
handleLoadError: nb,
|
||
handleLoadSuccess: nm,
|
||
triggerManualRetry: nw,
|
||
} = (0, D.useResourceRetry)(tK),
|
||
[nv, nx] = (0, n.useState)(!1),
|
||
[ny, n_] = (0, n.useState)(null),
|
||
[nS, nE] = (0, n.useState)(null),
|
||
nM = tI && tP && (!nv || tA),
|
||
[nT, nk] = (0, n.useState)(!1),
|
||
nC = (0, n.useRef)(void 0),
|
||
[nA, nN] = (0, n.useState)(null),
|
||
[nI, nP] = (0, n.useState)(!1),
|
||
[nR, nL] = (0, n.useState)(!1),
|
||
[nD, nj] = (0, n.useState)(!1),
|
||
[nO, nF] = (0, n.useState)(!1),
|
||
nU = (0, n.useRef)(!1);
|
||
nU.current = nO;
|
||
let [nB, nH] = (0, n.useState)(!1),
|
||
nz = (0, n.useRef)(null),
|
||
nG = (0, n.useCallback)(() => {
|
||
nP(!0),
|
||
nz.current && clearTimeout(nz.current),
|
||
(nz.current = setTimeout(() => nP(!1), 350));
|
||
}, []);
|
||
(0, n.useEffect)(
|
||
() => () => {
|
||
nz.current && clearTimeout(nz.current);
|
||
},
|
||
[],
|
||
);
|
||
let {
|
||
loaded: n$,
|
||
nodeWidth: nV,
|
||
nodeHeight: nW,
|
||
naturalWidth: nK,
|
||
naturalHeight: nq,
|
||
} = eK(tK, eB?.contentWidth, eB?.contentHeight),
|
||
nX = (0, I.extractRatioFromNodeParams)(eB?.params),
|
||
nY = (0, n.useMemo)(
|
||
() => (0, I.computeNodeDimensionsFromRatio)(nX),
|
||
[nX],
|
||
),
|
||
nJ = !!eB?.scriptRowHiddenUuid,
|
||
nZ = !nJ && ((tX && !t$ && !tV) || nc),
|
||
nQ = nZ ? nV : nY.width,
|
||
n1 = nZ ? nW : nY.height,
|
||
n0 =
|
||
((eE = !!(eS = (e_ = eB ?? void 0) ?? {}).gridRegenerating),
|
||
(eM =
|
||
"number" == typeof eS.gridFrozenWidth
|
||
? eS.gridFrozenWidth
|
||
: void 0),
|
||
(eT =
|
||
"number" == typeof eS.gridFrozenHeight
|
||
? eS.gridFrozenHeight
|
||
: void 0),
|
||
(ek =
|
||
"number" == typeof e_?.contentWidth ? e_.contentWidth : void 0),
|
||
(eC =
|
||
"number" == typeof e_?.contentHeight ? e_.contentHeight : void 0),
|
||
(eA = eV ? (ek ?? nV) : nV),
|
||
(eN = eV ? (eC ?? nW) : nW),
|
||
(eI = eE ? (eM ?? ek ?? eA) : eA),
|
||
(eP = eE ? (eT ?? eC ?? eN) : eN),
|
||
(eR =
|
||
nJ &&
|
||
"number" == typeof ek &&
|
||
"number" == typeof eC &&
|
||
ek > 0 &&
|
||
eC > 0),
|
||
(eL = nJ ? (eR ? eP : nY.height) : eP),
|
||
{
|
||
effectiveNodeWidth: nJ ? (eR ? eI : nY.width) : eI,
|
||
effectiveNodeHeight: eL,
|
||
}),
|
||
n2 =
|
||
nJ &&
|
||
"number" == typeof eB?.contentWidth &&
|
||
"number" == typeof eB?.contentHeight &&
|
||
eB.contentWidth > 0 &&
|
||
eB.contentHeight > 0,
|
||
n3 = nJ && !n2,
|
||
n4 = (0, s.useStore)(
|
||
(e) => {
|
||
let t = e.nodeLookup.get(ex);
|
||
if (!t) return null;
|
||
let n = t.measured?.width ?? t.width,
|
||
i = t.measured?.height ?? t.height;
|
||
return "number" != typeof n ||
|
||
"number" != typeof i ||
|
||
!Number.isFinite(n) ||
|
||
!Number.isFinite(i) ||
|
||
n <= 0 ||
|
||
i <= 0
|
||
? null
|
||
: { width: n, height: i };
|
||
},
|
||
(e, t) =>
|
||
e === t ||
|
||
(null == e || null == t
|
||
? e === t
|
||
: e.width === t.width && e.height === t.height),
|
||
),
|
||
n5 = (0, n.useMemo)(
|
||
() =>
|
||
n3 && null != n4
|
||
? {
|
||
effectiveNodeWidth: n4.width,
|
||
effectiveNodeHeight: n4.height,
|
||
}
|
||
: {
|
||
effectiveNodeWidth: n0.effectiveNodeWidth,
|
||
effectiveNodeHeight: n0.effectiveNodeHeight,
|
||
},
|
||
[n3, n4, n0.effectiveNodeWidth, n0.effectiveNodeHeight],
|
||
),
|
||
n6 = n5.effectiveNodeWidth,
|
||
n8 = n5.effectiveNodeHeight,
|
||
n9 = tT ? Math.round((16 / 9) * n8) : n6,
|
||
n7 = tX ? n9 : nQ,
|
||
ie = tX ? n8 : n1,
|
||
it = tr && !ey && !nv && n7 * nf < 56 && ie * nf < 56,
|
||
{
|
||
imgProps: ii,
|
||
loadingOriginal: ir,
|
||
handleCacheCapture: ia,
|
||
} = (0, el.useImageLoadStrategy)({
|
||
url: it ? void 0 : tK,
|
||
contentNodeWidth: nV,
|
||
contentNodeHeight: nW,
|
||
useOriginal: nd,
|
||
isFront: !0,
|
||
fileSize: nu,
|
||
isStoryboardChild: nJ,
|
||
ratioDimensionsWidth: nJ ? n6 : nY.width,
|
||
isReadonlyPreview: tr,
|
||
}),
|
||
io = ii.src,
|
||
is = tK || io;
|
||
(0, n.useEffect)(() => {
|
||
nD || nF(!1);
|
||
}, [nD]),
|
||
(0, n.useEffect)(() => {
|
||
if (!tT || !nD) return;
|
||
let e = (e) => {
|
||
switch (e) {
|
||
case "KeyW":
|
||
return "pitchUp";
|
||
case "KeyS":
|
||
return "pitchDown";
|
||
case "KeyA":
|
||
return "yawLeft";
|
||
case "KeyD":
|
||
return "yawRight";
|
||
case "KeyQ":
|
||
return "zoomIn";
|
||
case "KeyE":
|
||
return "zoomOut";
|
||
default:
|
||
return null;
|
||
}
|
||
},
|
||
t = (t) => {
|
||
if ((0, en.isInputElement)(t.target)) return;
|
||
if ("Escape" === t.code)
|
||
return (t.preventDefault(), t.stopPropagation(), nU.current)
|
||
? void nF(!1)
|
||
: (tp.current?.clearKeyboardNudges(), void nj(!1));
|
||
let n = e(t.code);
|
||
n &&
|
||
(t.preventDefault(),
|
||
t.stopPropagation(),
|
||
tp.current?.startKeyboardNudge(n));
|
||
},
|
||
n = (t) => {
|
||
let n = e(t.code);
|
||
n &&
|
||
(t.preventDefault(),
|
||
t.stopPropagation(),
|
||
tp.current?.stopKeyboardNudge(n));
|
||
},
|
||
i = () => {
|
||
tp.current?.clearKeyboardNudges();
|
||
};
|
||
return (
|
||
window.addEventListener("keydown", t, !0),
|
||
window.addEventListener("keyup", n, !0),
|
||
window.addEventListener("blur", i),
|
||
() => {
|
||
window.removeEventListener("keydown", t, !0),
|
||
window.removeEventListener("keyup", n, !0),
|
||
window.removeEventListener("blur", i),
|
||
tp.current?.clearKeyboardNudges();
|
||
}
|
||
);
|
||
}, [tT, nD]),
|
||
(0, n.useEffect)(() => {
|
||
tT || (nj(!1), nH(!1));
|
||
}, [tT]),
|
||
(0, n.useEffect)(() => {
|
||
if (!nD) return;
|
||
let e = document.body.style.overflow;
|
||
return (
|
||
(document.body.style.overflow = "hidden"),
|
||
() => {
|
||
document.body.style.overflow = e;
|
||
}
|
||
);
|
||
}, [nD]),
|
||
(0, n.useEffect)(() => {
|
||
nC.current && !t$ && tk && tK && !tr && tE(ex);
|
||
}, [t$, tk, tK, tr, tE, ex]),
|
||
(0, n.useEffect)(() => {
|
||
tT &&
|
||
!tK &&
|
||
!(0, es.isPersistedPanoramaOpenFlag)(eB?.panoramaPreviewOpen) &&
|
||
((0, es.readPanoramaPreviewSession)(ta, ex) || tM(ex));
|
||
}, [tT, tK, tM, eB?.panoramaPreviewOpen, ta, ex]),
|
||
(0, n.useEffect)(() => {
|
||
if (tr) return;
|
||
if (tT) {
|
||
let e = tL(ex),
|
||
t = e?.data?.params;
|
||
if (!t || t.model === M.PANORAMIC_LOCKED_MODEL_KEY) return;
|
||
let n = { ...(t.settings ?? {}) };
|
||
(tm.current = { model: t.model, settings: n }),
|
||
eW(ex, {
|
||
params: {
|
||
...t,
|
||
model: M.PANORAMIC_LOCKED_MODEL_KEY,
|
||
settings: n,
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
let e = tm.current;
|
||
if (((tm.current = null), !e)) return;
|
||
let t = tL(ex),
|
||
n = t?.data?.params;
|
||
n &&
|
||
eW(ex, {
|
||
params: { ...n, model: e.model, settings: { ...e.settings } },
|
||
});
|
||
}, [tT, tr, ex, tL, eW]),
|
||
(0, n.useLayoutEffect)(() => {
|
||
let e = U.stores.canvas?.getNode(ex)?.data,
|
||
t = e?.panoramaPreviewOpen,
|
||
n = (0, es.isPersistedPanoramaOpenFlag)(eB?.panoramaPreviewOpen),
|
||
i = (0, es.isPersistedPanoramaOpenFlag)(t),
|
||
r = (0, es.readPanoramaPreviewSession)(ta, ex);
|
||
(n || i || r) &&
|
||
tK &&
|
||
(U.stores.canvas?.panoramaPreviewNodeIds.has(ex) ||
|
||
(!r || n || i || tr || eW(ex, { panoramaPreviewOpen: !0 }),
|
||
tE(ex)),
|
||
(0, es.writePanoramaPreviewSession)(ta, ex, !0));
|
||
}, [ex, tr, eB?.panoramaPreviewOpen, ta, tK, eW, tE]),
|
||
(0, n.useEffect)(() => {
|
||
if (tr) return;
|
||
let e = eB?.panoramaPreviewOpen,
|
||
t = (0, es.isPersistedPanoramaOpenFlag)(e);
|
||
t === tT ||
|
||
(void 0 === e && !tT) ||
|
||
(t && !tT && !tK) ||
|
||
(t && !tT && U.stores.canvas?.panoramaPreviewNodeIds.has(ex)) ||
|
||
(eW(ex, { panoramaPreviewOpen: tT }),
|
||
(0, es.writePanoramaPreviewSession)(ta, ex, !!tT));
|
||
}, [tr, ex, tT, eB?.panoramaPreviewOpen, eW, ta, tK]),
|
||
(0, eh.useFrozenEffect)(() => {
|
||
if (nJ || eB?.gridRegenerating || !n$ || !nK || !nq) return;
|
||
let e = U.stores.canvas?.getNode(ex)?.data,
|
||
t = "number" == typeof e?.contentWidth ? e.contentWidth : void 0,
|
||
n =
|
||
"number" == typeof e?.contentHeight ? e.contentHeight : void 0;
|
||
(t !== nV || n !== nW) &&
|
||
eW(ex, { contentWidth: nV, contentHeight: nW });
|
||
}, [nJ, n$, nK, nq, nV, nW, ex, eW]);
|
||
let ic = (0, U.useCanvasStore)(
|
||
(0, n.useCallback)(
|
||
(e) => {
|
||
if (
|
||
!tt ||
|
||
(null !== e.focusInteractingNodeId &&
|
||
e.focusInteractingNodeId !== ex)
|
||
)
|
||
return;
|
||
let t = e.getNode(tt);
|
||
if (!t) return;
|
||
let n = t.data?.params,
|
||
i = n?.focusRegion;
|
||
return i?.nodeId === ex ? i : void 0;
|
||
},
|
||
[tt, ex],
|
||
),
|
||
),
|
||
il = (0, n.useCallback)(
|
||
(e, t) => {
|
||
if (!tt) return;
|
||
let n = U.stores.canvas,
|
||
i = n?.getNode(tt);
|
||
if (!i) return;
|
||
let r = i.data?.params,
|
||
a = r?.settings ?? {},
|
||
o = tW[0] ?? "",
|
||
s = {
|
||
...r,
|
||
focusRegion: {
|
||
nodeId: ex,
|
||
relX: e.relX,
|
||
relY: e.relY,
|
||
width: e.width,
|
||
height: e.height,
|
||
imageUrl: o,
|
||
},
|
||
originImage: o,
|
||
scene: "camera_focus",
|
||
},
|
||
c = nV / nW,
|
||
l = e.height > 0 ? (e.width / e.height) * c : 1,
|
||
u =
|
||
t ??
|
||
(function (e) {
|
||
let t = eU[0],
|
||
n = Math.abs(e - t.ratio);
|
||
for (let i = 1; i < eU.length; i++) {
|
||
let r = Math.abs(e - eU[i].ratio);
|
||
r < n && ((n = r), (t = eU[i]));
|
||
}
|
||
return t.label;
|
||
})(l),
|
||
h =
|
||
Object.keys(a).find((e) =>
|
||
e.toLowerCase().startsWith("ratio"),
|
||
) ?? "ratio";
|
||
if (
|
||
((s.settings = { ...a, [h]: u }),
|
||
eW(tt, { params: s }),
|
||
(n?.edges ?? []).some(
|
||
(e) => e.source === ex && e.target === tt,
|
||
) || e2({ source: ex, target: tt }),
|
||
U.stores.canvas?.setFocusMode(!1),
|
||
i && tj && tO)
|
||
) {
|
||
let e = i.measured?.width ?? i.width ?? 200,
|
||
t = i.measured?.height ?? i.height ?? 200;
|
||
tj(i.position.x + e / 2, i.position.y + t / 2, {
|
||
zoom: tO(),
|
||
duration: 400,
|
||
});
|
||
}
|
||
},
|
||
[tt, ex, tW, nV, nW, eW, e2, tj, tO],
|
||
),
|
||
[iu, ih] = (0, n.useState)(null),
|
||
[id, ip] = (0, n.useState)(null),
|
||
[ig, ib] = (0, n.useState)(0);
|
||
(0, n.useEffect)(() => {
|
||
te || (ih(null), ip(null));
|
||
}, [te]),
|
||
(0, n.useEffect)(() => {
|
||
te &&
|
||
null !== tn &&
|
||
tn !== ex &&
|
||
(ih(null), ip(null), ib((e) => e + 1));
|
||
}, [te, tn, ex]);
|
||
let im = (0, n.useRef)(ti);
|
||
(0, n.useEffect)(() => {
|
||
ti !== im.current &&
|
||
((im.current = ti),
|
||
tn === ex &&
|
||
(ih(null),
|
||
ip(null),
|
||
ib((e) => e + 1),
|
||
U.stores.canvas?.setFocusInteractingNode(null)));
|
||
}, [ti, tn, ex]);
|
||
let iw = (0, n.useRef)(null),
|
||
iv = (0, n.useRef)(null);
|
||
(0, n.useEffect)(() => {
|
||
let e;
|
||
if (!iu || !te) return;
|
||
let t = iw.current;
|
||
if (!t) return;
|
||
let n = () => {
|
||
let e = iv.current;
|
||
if (!e) return;
|
||
let n = t.getBoundingClientRect();
|
||
(e.style.left = `${n.left + n.width / 2}px`),
|
||
(e.style.top = `${n.bottom + 8}px`),
|
||
(e.style.visibility = "visible");
|
||
};
|
||
n();
|
||
let i = t.closest(".react-flow__viewport"),
|
||
r = new ResizeObserver(n);
|
||
return (
|
||
r.observe(t),
|
||
i?.addEventListener("scroll", n),
|
||
window.addEventListener("resize", n),
|
||
i &&
|
||
(e = new MutationObserver(n)).observe(i, {
|
||
attributes: !0,
|
||
attributeFilter: ["style", "transform"],
|
||
}),
|
||
() => {
|
||
r.disconnect(),
|
||
e?.disconnect(),
|
||
i?.removeEventListener("scroll", n),
|
||
window.removeEventListener("resize", n);
|
||
}
|
||
);
|
||
}, [iu, te]);
|
||
let ix = (0, z.useMarkPointStore)((e) => e.loading),
|
||
iy = (0, z.useMarkPointStore)(
|
||
(e) => e.markPoints.filter((e) => e.nodeId === ex),
|
||
c.shallow,
|
||
),
|
||
i_ = (0, z.useMarkPointStore)((e) => e.addMarkPoint),
|
||
iS = (0, z.useMarkPointStore)((e) => e.setLoading),
|
||
iE = (0, z.useMarkPointStore)((e) => e.updateMarkPointSuggestions),
|
||
iM = (0, z.useMarkPointStore)((e) => e.removeMarkPoint),
|
||
iT = (0, z.useMarkPointStore)((e) => e.removeMarkPointByIndex),
|
||
ik = (0, n.useCallback)(
|
||
(e) => {
|
||
iM(e);
|
||
let t = U.stores.canvas,
|
||
n = t?.markSourceNodeId;
|
||
if (!n) return;
|
||
let i = t.getNode(n);
|
||
if (!i) return;
|
||
let r = i.data?.params,
|
||
a = r?.prompt ?? "",
|
||
o = r?.magicList ?? {},
|
||
s = `{{magic:${e}:`,
|
||
c = a,
|
||
l = c.indexOf(s);
|
||
if (-1 !== l) {
|
||
let e = c.indexOf("}}", l + s.length);
|
||
if (-1 !== e) {
|
||
let t = l,
|
||
n = e + 2;
|
||
for (; t > 0 && " " === c[t - 1]; ) t--;
|
||
for (; n < c.length && " " === c[n]; ) n++;
|
||
c = (c.slice(0, t) + " " + c.slice(n)).trim();
|
||
}
|
||
}
|
||
let { [e]: u, ...h } = o;
|
||
eW(n, {
|
||
params: {
|
||
...r,
|
||
prompt: c,
|
||
magicList: Object.keys(h).length > 0 ? h : void 0,
|
||
},
|
||
});
|
||
},
|
||
[iM, eW],
|
||
),
|
||
iC = (0, n.useCallback)(
|
||
(e, t) => {
|
||
let n = U.stores.canvas,
|
||
i = n?.markSourceNodeId;
|
||
if (!i) return;
|
||
let r = n.getNode(i);
|
||
if (!r) return;
|
||
let a = r.data?.params,
|
||
o = a?.prompt ?? "",
|
||
s = `{{magic:${e}:`,
|
||
c = o.indexOf(s);
|
||
if (-1 === c) return;
|
||
let l = o.indexOf("}}", c + s.length);
|
||
if (-1 === l) return;
|
||
let u = o.slice(0, c) + `{{magic:${e}:${t}}}` + o.slice(l + 2);
|
||
u !== o && eW(i, { params: { ...a, prompt: u } });
|
||
},
|
||
[eW],
|
||
),
|
||
iA = (0, n.useCallback)(
|
||
async (e) => {
|
||
if (!e7 || ix) return;
|
||
let t = U.stores.canvas,
|
||
n = t?.markSourceNodeId,
|
||
i = n ? t?.getNode(n) : void 0;
|
||
if (
|
||
(
|
||
(i?.data?.params?.prompt ?? "").match(S.MAGIC_TOKEN_REGEX) ??
|
||
[]
|
||
).length >= P.MAGIC_SELECT_MAX_COUNT
|
||
)
|
||
return void v.Notify.warn(
|
||
`焦点选择最多支持 ${P.MAGIC_SELECT_MAX_COUNT} 个标记点`,
|
||
);
|
||
let r = e.currentTarget.getBoundingClientRect(),
|
||
a = (e.clientX - r.left) / r.width,
|
||
o = (e.clientY - r.top) / r.height,
|
||
s = i_({ nodeId: ex, relX: a, relY: o }),
|
||
c = e.currentTarget.querySelector("img");
|
||
if (!c)
|
||
return void console.warn(
|
||
"[MarkMode] No img element found in clicked card",
|
||
);
|
||
iS(!0);
|
||
try {
|
||
let e = await e5(c),
|
||
t = await (0, j.clickSuggest)({
|
||
id: ex,
|
||
image_base64: e,
|
||
point: [a, o],
|
||
lang: "zh",
|
||
});
|
||
if (t?.id && t.suggestions?.length) {
|
||
let e,
|
||
n = `${t.id}_${s}`;
|
||
iE(s, n, t.suggestions);
|
||
let i = U.stores.canvas,
|
||
r = i?.markSourceNodeId;
|
||
if (!r)
|
||
return void console.warn(
|
||
"[MarkMode] markSourceNodeId is null after API response, skip store sync",
|
||
);
|
||
let a = i.getNode(r);
|
||
if (!a)
|
||
return void console.warn(
|
||
"[MarkMode] source node not found:",
|
||
r,
|
||
);
|
||
let o = a.data?.params,
|
||
c = o?.prompt ?? "",
|
||
l = `{{magic:${n}:0}}`,
|
||
u = z.useMarkPointStore.getState().promptCursorOffset;
|
||
if (null !== u && u >= 0 && u <= c.length) {
|
||
let t = c.slice(0, u),
|
||
n = c.slice(u),
|
||
i = t.length > 0 && !t.endsWith(" ") && !t.endsWith("\n"),
|
||
r =
|
||
n.length > 0 &&
|
||
!n.startsWith(" ") &&
|
||
!n.startsWith("\n");
|
||
e = `${t}${i ? " " : ""}${l}${r ? " " : ""}${n}`;
|
||
} else e = c ? `${c} ${l}` : l;
|
||
z.useMarkPointStore.getState().setPromptCursorOffset(null);
|
||
let h = i.getNode(ex),
|
||
f = h?.data?.url?.[0];
|
||
eW(r, {
|
||
params: {
|
||
...o,
|
||
magicList: {
|
||
...(o?.magicList ?? {}),
|
||
[n]: { suggestions: t.suggestions, imageUrl: f },
|
||
},
|
||
prompt: e,
|
||
},
|
||
});
|
||
} else iT(s), v.Notify.error("未识别出任何内容，请重新尝试");
|
||
} catch (e) {
|
||
console.error("[MarkMode] clickSuggest failed:", e);
|
||
} finally {
|
||
iS(!1);
|
||
}
|
||
},
|
||
[e7, ix, ex, i_, iS, iE, iT, eW],
|
||
),
|
||
iN = (0, n.useCallback)(
|
||
({ cdnUrl: e, resourceMeta: t }) => {
|
||
let n = U.stores.canvas?.getNode(ex);
|
||
eW(ex, {
|
||
url: [e],
|
||
contentWidth: void 0,
|
||
contentHeight: void 0,
|
||
resourceMeta: (0, ec.mergeResourceMetaBundle)(
|
||
n?.resourceMeta,
|
||
t,
|
||
),
|
||
}),
|
||
eJ(ex);
|
||
},
|
||
[ex, eW, eJ],
|
||
),
|
||
{ requestFileUpload: iI } = (0, ee.useCanvasCallbacks)(),
|
||
iP = (0, n.useRef)(null),
|
||
[iR, iL] = (0, n.useState)(!1),
|
||
iD = (0, n.useRef)(null);
|
||
(0, n.useEffect)(
|
||
() => () => {
|
||
iP.current &&
|
||
(URL.revokeObjectURL(iP.current), (iP.current = null));
|
||
},
|
||
[],
|
||
);
|
||
let ij = (0, n.useCallback)(
|
||
(e) => {
|
||
let t = tL(ex);
|
||
if (!t) return;
|
||
let n = {
|
||
imageToImage: {
|
||
type: R.NodeType.IMAGE,
|
||
name: "图生图",
|
||
dataOverrides: {
|
||
action: R.NodeAction.IMAGE_GENERATE,
|
||
generatorType: R.GeneratorType.DEFAULT,
|
||
},
|
||
},
|
||
}[e],
|
||
i = crypto.randomUUID();
|
||
e0({
|
||
id: i,
|
||
type: n.type,
|
||
data: {
|
||
type: n.type,
|
||
name: n.name,
|
||
url: [],
|
||
...n.dataOverrides,
|
||
},
|
||
position: {
|
||
x: t.position.x + nQ + I.NODE_GAP,
|
||
y: t.position.y,
|
||
},
|
||
sourcePosition: o.Position.Right,
|
||
targetPosition: o.Position.Left,
|
||
}),
|
||
e2({ source: ex, target: i }),
|
||
tF(i);
|
||
},
|
||
[ex, tL, e0, e2, tF],
|
||
),
|
||
iO = (0, n.useCallback)(
|
||
(t) => {
|
||
if (!t.type.startsWith("image/")) {
|
||
(0, eO.setUploadOverlay)(ex, {
|
||
type: "error",
|
||
message: "请选择图片文件",
|
||
}),
|
||
(iD.current = null);
|
||
return;
|
||
}
|
||
if (t.size > 0x1400000) {
|
||
(0, eO.setUploadOverlay)(ex, {
|
||
type: "error",
|
||
message: "图片文件大小不能超过 20MB",
|
||
}),
|
||
(iD.current = null);
|
||
return;
|
||
}
|
||
iP.current && URL.revokeObjectURL(iP.current);
|
||
let n = URL.createObjectURL(t);
|
||
iP.current = n;
|
||
let i = U.stores.canvas?.getNode(ex)?.data ?? {},
|
||
r = Array.isArray(i.url) ? [...i.url] : [],
|
||
a = i.action,
|
||
o = U.stores.canvas?.getNode(ex)?.resourceMeta,
|
||
s = "string" == typeof i.alt ? i.alt : void 0,
|
||
c = () => {
|
||
r.length > 0
|
||
? eW(ex, { url: r, action: a, resourceMeta: o, alt: s })
|
||
: eW(ex, { url: [], action: a });
|
||
},
|
||
l = (0, ec.buildUploadedResourceMeta)(t, R.NodeType.IMAGE, {
|
||
previous: o,
|
||
});
|
||
eW(ex, {
|
||
url: [n],
|
||
action: R.NodeAction.IMAGE_RESOURCE,
|
||
resourceMeta: l,
|
||
});
|
||
let u = iD.current;
|
||
(iD.current = null),
|
||
u && ij(u),
|
||
iL(!0),
|
||
(0, eO.setUploadOverlay)(ex, { type: "uploading" }),
|
||
(async () => {
|
||
try {
|
||
let n,
|
||
{ getCookie: i } = await e.A(710867),
|
||
{ uploadViaPreSign: r, resolveUploadUrl: a } =
|
||
await e.A(33412),
|
||
{ USER_TOKEN_COOKIE_KEY: s, USER_UUID_COOKIE_KEY: c } =
|
||
await e.A(525723),
|
||
l = i(s),
|
||
u = i(c);
|
||
if (
|
||
!l ||
|
||
"string" != typeof l ||
|
||
!u ||
|
||
"string" != typeof u
|
||
) {
|
||
(0, eO.clearUploadOverlay)(ex),
|
||
v.Notify.error("请先登录");
|
||
return;
|
||
}
|
||
let h = await r(t, {
|
||
token: l,
|
||
uuid: u,
|
||
verify: !0,
|
||
onCalcHashEnd: (e) => {
|
||
n = e;
|
||
},
|
||
onProgress: (e) =>
|
||
(0, eO.setUploadOverlay)(ex, {
|
||
type: "uploading",
|
||
progress: e,
|
||
}),
|
||
}),
|
||
f = a(h);
|
||
f &&
|
||
(eW(ex, {
|
||
url: [f],
|
||
contentWidth: void 0,
|
||
contentHeight: void 0,
|
||
resourceMeta: (0, ec.buildUploadedResourceMeta)(
|
||
t,
|
||
R.NodeType.IMAGE,
|
||
{ hashSha1: n, previous: o },
|
||
),
|
||
}),
|
||
eJ(ex)),
|
||
(0, eO.setUploadOverlay)(ex, { type: "success" });
|
||
} catch (e) {
|
||
console.error("图片上传到 CDN 失败:", e),
|
||
URL.revokeObjectURL(n),
|
||
(iP.current = null),
|
||
e instanceof Z.FileReviewError
|
||
? (c(),
|
||
(0, eO.setUploadOverlay)(ex, {
|
||
type: "error",
|
||
message: e.message,
|
||
}))
|
||
: (c(),
|
||
(0, eO.clearUploadOverlay)(ex),
|
||
v.Notify.error("图片上传失败，请重试"));
|
||
} finally {
|
||
iL(!1);
|
||
}
|
||
})();
|
||
},
|
||
[ex, eW, ij],
|
||
),
|
||
iF = (0, n.useCallback)(() => {
|
||
(iD.current = null),
|
||
iI({
|
||
accept: "image/*",
|
||
onFile: iO,
|
||
onCancel: () => {
|
||
iD.current = null;
|
||
},
|
||
});
|
||
}, [iI, iO]),
|
||
iU = (0, n.useCallback)(() => {
|
||
(iD.current = "imageToImage"),
|
||
iI({
|
||
accept: "image/*",
|
||
onFile: iO,
|
||
onCancel: () => {
|
||
iD.current = null;
|
||
},
|
||
});
|
||
}, [iI, iO]),
|
||
iB = (0, n.useCallback)(() => {
|
||
let e = tL(ex);
|
||
if (!e) return;
|
||
eW(ex, {
|
||
url: [L.IMAGE_PRESETS.extractHD.imageUrl],
|
||
action: R.NodeAction.IMAGE_RESOURCE,
|
||
});
|
||
let t = crypto.randomUUID();
|
||
e0({
|
||
id: t,
|
||
type: R.NodeType.IMAGE,
|
||
data: {
|
||
type: R.NodeType.IMAGE,
|
||
name: "高清",
|
||
url: [],
|
||
action: R.NodeAction.IMAGE_GENERATE,
|
||
generatorType: R.GeneratorType.ENHANCE,
|
||
},
|
||
position: { x: e.position.x + nQ + I.NODE_GAP, y: e.position.y },
|
||
sourcePosition: o.Position.Right,
|
||
targetPosition: o.Position.Left,
|
||
}),
|
||
e2({ source: ex, target: t }),
|
||
tF(t);
|
||
}, [ex, tL, eW, e0, e2, nQ, tF]),
|
||
[iH, iz] = (0, n.useState)(!1),
|
||
iG =
|
||
((0, n.useCallback)(() => {
|
||
let e = tW[0];
|
||
if (!e || e.startsWith("blob:") || e.startsWith("data:"))
|
||
return void v.Notify.error("请先保存图片后再补齐画面");
|
||
let t = (0, W.getCookie)(N.USER_TOKEN_COOKIE_KEY),
|
||
n = (0, W.getCookie)(N.USER_UUID_COOKIE_KEY);
|
||
if (!t || "string" != typeof t || !n || "string" != typeof n)
|
||
return void v.Notify.error("请先登录");
|
||
let i = tL(ex);
|
||
i &&
|
||
(iz(!0),
|
||
(async () => {
|
||
try {
|
||
let t = eH?.items?.[0],
|
||
n = t?.width,
|
||
r = t?.height;
|
||
if ("number" != typeof n || "number" != typeof r) {
|
||
let t = await (0, X.probeImageMeta)(e);
|
||
(n = t.width), (r = t.height);
|
||
}
|
||
let a =
|
||
"number" == typeof n && "number" == typeof r
|
||
? (0, I.approximateToPresetRatio)(n, r)
|
||
: "16:9",
|
||
s = {
|
||
model: tf,
|
||
prompt: "",
|
||
scene: "scene_completion",
|
||
selectedSlash: {
|
||
label: "一键补齐画面",
|
||
scene: "scene_completion",
|
||
},
|
||
count: 1,
|
||
modeType: 2,
|
||
imageList: [{ nodeId: ex, url: [e] }],
|
||
settings: { ratio: a },
|
||
},
|
||
c = crypto.randomUUID();
|
||
e0(
|
||
{
|
||
id: c,
|
||
type: R.NodeType.IMAGE,
|
||
data: {
|
||
type: R.NodeType.IMAGE,
|
||
name: "补齐画面",
|
||
url: [],
|
||
action: R.NodeAction.IMAGE_GENERATE,
|
||
generatorType: R.GeneratorType.DEFAULT,
|
||
params: s,
|
||
},
|
||
position: {
|
||
x: i.position.x + nQ + I.NODE_GAP,
|
||
y: i.position.y,
|
||
},
|
||
sourcePosition: o.Position.Right,
|
||
targetPosition: o.Position.Left,
|
||
},
|
||
{ skipOverlapResolution: !0 },
|
||
),
|
||
e2({ source: ex, target: c }),
|
||
tF(c);
|
||
let l = (0, J.buildRequestData)(s, "image", c, ta, tu),
|
||
u = await (0, F.submitGenerationTask)(l);
|
||
u.success
|
||
? eW(c, {
|
||
params: s,
|
||
_retryMeta: {
|
||
provider: l.provider,
|
||
model: l.model,
|
||
taskType: l.taskType,
|
||
},
|
||
taskInfo: { taskId: u.taskId, loading: !0 },
|
||
})
|
||
: u.handledByCommercial ||
|
||
v.Notify.error(u.errorMsg ?? "补齐画面任务创建失败");
|
||
} catch (e) {
|
||
v.Notify.error(
|
||
e instanceof Error ? e.message : "补齐画面失败",
|
||
);
|
||
} finally {
|
||
iz(!1);
|
||
}
|
||
})());
|
||
}, [ex, tW, ta, tf, tu, tL, nQ, e0, e2, eW, tF, eH]),
|
||
(0, n.useCallback)(
|
||
(e) => {
|
||
let t = U.stores.canvas?.edges ?? [],
|
||
n = tR.getNodes(),
|
||
i = (0, er.getAbsoluteNodePosition)(e, n),
|
||
r = new Set(
|
||
t.filter((t) => t.source === e.id).map((e) => e.target),
|
||
),
|
||
a = n.filter(
|
||
(e) =>
|
||
!!r.has(e.id) &&
|
||
(0, er.getAbsoluteNodePosition)(e, n).x > i.x,
|
||
);
|
||
return 0 === a.length
|
||
? i.y
|
||
: Math.max(
|
||
...a.map((e) => {
|
||
let t = (0, er.getAbsoluteNodePosition)(e, n),
|
||
i =
|
||
e.measured?.height ??
|
||
e.height ??
|
||
I.NODE_HEIGHT_EMPTY;
|
||
return t.y + i;
|
||
}),
|
||
) + 80;
|
||
},
|
||
[tR],
|
||
)),
|
||
i$ = (0, n.useCallback)(
|
||
async (e, t) => {
|
||
if (0 === e.length) return;
|
||
let n = (0, W.getCookie)(N.USER_TOKEN_COOKIE_KEY),
|
||
i = (0, W.getCookie)(N.USER_UUID_COOKIE_KEY);
|
||
if (!n || "string" != typeof n || !i || "string" != typeof i)
|
||
return void v.Notify.error("请先登录");
|
||
let r = tR.getNode(ex);
|
||
if (!r) return;
|
||
(tg.current = null), (tb.current = null);
|
||
let a = e[0],
|
||
s = (0, I.computeNodeDimensionsFromNatural)(a.width, a.height),
|
||
c = s.width,
|
||
l = s.height,
|
||
u = [],
|
||
h = 0,
|
||
f = e.length;
|
||
try {
|
||
for (let a = 0; a < e.length; a++) {
|
||
let s = e[a],
|
||
{ offsetX: d, offsetY: p } = (0,
|
||
eo.getPanoramaBatchCellOffsets)(a, f, c, l, 60);
|
||
try {
|
||
let e = await (0, k.dataUrlToFile)(
|
||
s.dataUrl,
|
||
`panorama-${a}`,
|
||
),
|
||
h = await (0, Q.uploadViaPreSign)(e, {
|
||
token: n,
|
||
uuid: i,
|
||
onCalcHashEnd: () => {},
|
||
}),
|
||
g = h.url ?? (0, Q.resolveUploadUrl)(h);
|
||
if (!g) throw Error("上传图片失败：未返回图片URL");
|
||
let b = tR.getNodes(),
|
||
m = (0, er.getAbsoluteNodePosition)(r, b);
|
||
0 === a &&
|
||
((tg.current = m.x + n9 + er.CANVAS_RIGHT_EDGE_GAP),
|
||
(tb.current = iG(r)));
|
||
let w =
|
||
(tg.current ?? m.x + n9 + er.CANVAS_RIGHT_EDGE_GAP) + d,
|
||
v = (tb.current ?? m.y) + p,
|
||
x = crypto.randomUUID(),
|
||
y =
|
||
4 === f
|
||
? eo.PANORAMA_RING4_NODE_LABELS[a]
|
||
: 12 === f
|
||
? (0, eo.getPanoramaRing12NodeLabel)(a)
|
||
: 1 === f
|
||
? t
|
||
: `${t}${a + 1}`;
|
||
e0(
|
||
{
|
||
id: x,
|
||
type: R.NodeType.IMAGE,
|
||
data: {
|
||
type: R.NodeType.IMAGE,
|
||
label: y,
|
||
url: [],
|
||
action: R.NodeAction.IMAGE_GENERATE,
|
||
generatorType: R.GeneratorType.DEFAULT,
|
||
},
|
||
position: { x: w, y: v },
|
||
sourcePosition: o.Position.Right,
|
||
targetPosition: o.Position.Left,
|
||
},
|
||
{ skipOverlapResolution: !0 },
|
||
),
|
||
u.push(x),
|
||
eW(x, {
|
||
url: [g],
|
||
contentWidth: c,
|
||
contentHeight: l,
|
||
params: { prompt: "", settings: { ratio: "auto" } },
|
||
});
|
||
} catch (e) {
|
||
if (e instanceof Z.FileReviewError) {
|
||
h++,
|
||
v.Notify.warn(`第 ${a + 1} 张图片审核未通过，已跳过`);
|
||
continue;
|
||
}
|
||
throw e;
|
||
}
|
||
}
|
||
if (
|
||
((0, ei.groupGridChildNodes)(
|
||
ex,
|
||
u,
|
||
c,
|
||
l,
|
||
`全景截图组 (${u.length} 张)`,
|
||
(e) => {
|
||
requestAnimationFrame(() => {
|
||
tR.fitBounds(e, { duration: 350, padding: 0.15 });
|
||
});
|
||
},
|
||
),
|
||
0 === u.length)
|
||
)
|
||
v.Notify.error(
|
||
h > 0 ? "所有全景截图审核未通过" : "未能创建生图节点",
|
||
);
|
||
else {
|
||
let e =
|
||
h > 0
|
||
? `生图节点创建完成（${h} 张审核未通过已跳过）`
|
||
: "生图节点创建完成";
|
||
v.Notify.success(e);
|
||
}
|
||
} catch (t) {
|
||
let e = t instanceof Error ? t.message : "全景生图节点创建失败";
|
||
v.Notify.error(e);
|
||
}
|
||
},
|
||
[ex, tR, e0, eW, n9, iG],
|
||
),
|
||
iV = (0, n.useCallback)(() => {
|
||
if (tr) return void v.Notify.warn("只读模式无法创建节点");
|
||
let e = tp.current?.captureScreenshot(),
|
||
t = tp.current?.getRendererPixelSize();
|
||
e && t
|
||
? (nL(!0),
|
||
v.Notify.info("正在上传全景截图并创建生图节点..."),
|
||
i$(
|
||
[{ dataUrl: e, width: t.width, height: t.height }],
|
||
"全景截图",
|
||
).finally(() => nL(!1)))
|
||
: v.Notify.error("截图失败");
|
||
}, [tr, i$]),
|
||
iW = (0, n.useCallback)(() => {
|
||
if (tr) return void v.Notify.warn("只读模式无法创建节点");
|
||
let e = tp.current?.captureScreenshotsFromRing(4);
|
||
e?.length
|
||
? (nL(!0),
|
||
v.Notify.info("正在上传全景截图并创建生图节点..."),
|
||
i$(e, `${tZ} 视角`).finally(() => nL(!1)))
|
||
: v.Notify.error("截图失败");
|
||
}, [tr, i$, tZ]),
|
||
iK = (0, n.useCallback)(() => {
|
||
if (tr) return void v.Notify.warn("只读模式无法创建节点");
|
||
let e = tp.current?.captureScreenshotsFromRing(12);
|
||
e?.length
|
||
? (nL(!0),
|
||
v.Notify.info("正在上传全景截图并创建生图节点..."),
|
||
i$(e, `${tZ} 视角`).finally(() => nL(!1)))
|
||
: v.Notify.error("截图失败");
|
||
}, [tr, i$, tZ]),
|
||
iq = (0, n.useCallback)(() => {
|
||
tp.current?.resetView();
|
||
}, []),
|
||
iX = (0, n.useCallback)(() => {
|
||
!tr &&
|
||
tK &&
|
||
tk &&
|
||
(e9(
|
||
tD().map((e) => ({
|
||
type: "select",
|
||
id: e.id,
|
||
selected: e.id === ex,
|
||
})),
|
||
),
|
||
tR.fitView({
|
||
nodes: [{ id: ex }],
|
||
padding: 0.25,
|
||
duration: 300,
|
||
minZoom: G.CANVAS_ZOOM.min,
|
||
maxZoom: G.CANVAS_ZOOM.max,
|
||
}),
|
||
tE(ex));
|
||
}, [e9, tD, ex, tk, tr, tK, tR, tE]),
|
||
iY = n3 ? n6 : nV,
|
||
iJ = n3 ? n8 : nW,
|
||
iZ = Math.min(tW.length, 4),
|
||
iQ = (0, n.useCallback)(
|
||
(e, t) =>
|
||
iZ <= 2
|
||
? [
|
||
{ left: 0, top: 0 },
|
||
{ left: e + 8, top: 0 },
|
||
]
|
||
: [
|
||
{ left: 0, top: 0 },
|
||
{ left: 0, top: -(t + 8) },
|
||
{ left: e + 8, top: -(t + 8) },
|
||
{ left: e + 8, top: 0 },
|
||
],
|
||
[iZ],
|
||
),
|
||
i1 = (0, n.useMemo)(
|
||
() =>
|
||
tW.map((e, t) => {
|
||
if (t >= 4)
|
||
return {
|
||
left: 0,
|
||
top: 0,
|
||
width: iY,
|
||
height: iJ,
|
||
zIndex: 0,
|
||
rotate: 0,
|
||
scale: 1,
|
||
hidden: !0,
|
||
};
|
||
if (!nv)
|
||
return {
|
||
left: 12 * t,
|
||
top: 4 * t,
|
||
width: n9,
|
||
height: n8,
|
||
zIndex: tW.length - t,
|
||
rotate: 2.5 * t,
|
||
scale: 1 - 0.035 * t,
|
||
hidden: !1,
|
||
};
|
||
let n = iQ(iY, iJ),
|
||
i = t;
|
||
null !== nA && (0 === t ? (i = nA) : t === nA && (i = 0));
|
||
let r = n[i] ?? n[0];
|
||
return {
|
||
left: r.left,
|
||
top: r.top,
|
||
width: iY,
|
||
height: iJ,
|
||
zIndex: 0 === t ? 2 : 1,
|
||
rotate: 0,
|
||
scale: 1,
|
||
hidden: !1,
|
||
};
|
||
}),
|
||
[tW, nv, n9, n8, nA, iQ, iY, iJ],
|
||
),
|
||
i0 = (0, n.useCallback)(
|
||
(e) => {
|
||
e.stopPropagation(),
|
||
nG(),
|
||
nx(!0),
|
||
nk(!1),
|
||
e1(ex, { zIndex: 9999 });
|
||
},
|
||
[ex, e1, nG],
|
||
),
|
||
i2 = (0, n.useCallback)(() => {
|
||
nG(), nx(!1), n_(null), nN(null), e1(ex, { zIndex: void 0 });
|
||
}, [ex, e1, nG]),
|
||
i3 = (0, a.useClickOutside)(i2);
|
||
(0, n.useEffect)(() => {
|
||
let e = nC.current;
|
||
(nC.current = t$),
|
||
!0 === e &&
|
||
!1 === t$ &&
|
||
tY &&
|
||
(nG(),
|
||
nx(!0),
|
||
e1(ex, { zIndex: 9999 }),
|
||
ey && e9([{ type: "select", id: ex, selected: !1 }]));
|
||
}, [t$, tY, ex, ey, e1, nG, e9]);
|
||
let i4 = (0, n.useCallback)(
|
||
(e, t) => {
|
||
if ((t.stopPropagation(), 0 === e || e >= 4)) return;
|
||
nG(), nN(e);
|
||
let n = [...tW];
|
||
setTimeout(() => {
|
||
let t = n[0];
|
||
(n[0] = n[e]), (n[e] = t), eW(ex, { url: n }), eJ(ex), nN(null);
|
||
}, 300);
|
||
},
|
||
[tW, ex, eW, eJ, nG],
|
||
),
|
||
i5 = (0, n.useCallback)(
|
||
(e, t) => {
|
||
t.stopPropagation();
|
||
let n = tW[e];
|
||
n &&
|
||
null === nS &&
|
||
(async () => {
|
||
try {
|
||
let t,
|
||
i = await (0, C.ensureWatermarkPreference)();
|
||
if (null === i) return;
|
||
nE(e);
|
||
let r =
|
||
((t = n.split("?")[0].split(".").pop()?.toLowerCase()),
|
||
"jpg" === t || "jpeg" === t ? "jpg" : "png"),
|
||
a = (0, O.checkIsVip)();
|
||
v.Notify.info("正在下载图片…");
|
||
let o = n;
|
||
(1 === i && a) ||
|
||
(o =
|
||
(await (0, O.getImageWatermarkUrl)({
|
||
imageUrl: n,
|
||
formatType: r,
|
||
watermark: 1 !== i,
|
||
communityWatermark: !a,
|
||
})) || n),
|
||
(0, K.triggerDownload)(
|
||
o,
|
||
(0, K.formatDownloadFileName)(tZ || "图片", r),
|
||
);
|
||
} catch {
|
||
v.Notify.error("下载失败，请重试");
|
||
} finally {
|
||
setTimeout(() => nE(null), 2e3);
|
||
}
|
||
})();
|
||
},
|
||
[tW, nS, tZ],
|
||
),
|
||
i6 = "resource" === nl,
|
||
i8 = "generating_with_content" === nl,
|
||
i9 = i6 || i8,
|
||
i7 = tk && i6 && !!tK && !tr && !tG,
|
||
re = i7 && tY && !nD,
|
||
rt = i7 && !re;
|
||
if (i9 && !tK) return null;
|
||
let rn = (0, ew.getPipelineStyles)(
|
||
tH,
|
||
tz,
|
||
ey,
|
||
"var(--canvas-node-border-selected)",
|
||
),
|
||
ri = {
|
||
width: `${nQ}px`,
|
||
height: `${n1}px`,
|
||
background: "var(--Surface-secondary-background, #262626)",
|
||
border: "1px solid var(--canvas-node-border)",
|
||
...rn,
|
||
transition: ["width 300ms ease", "height 300ms ease", rn.transition]
|
||
.filter(Boolean)
|
||
.join(", "),
|
||
},
|
||
rr = { width: `${n9}px`, height: `${n8}px`, position: "relative" },
|
||
ra = { width: `${n9}px`, height: `${n8}px`, position: "relative" },
|
||
ro = `relative${i6 && (e7 || te) ? " nopan" : ""}`,
|
||
rs =
|
||
("empty_generate" !== nl && "pending" !== nl) ||
|
||
tr ||
|
||
!tI ||
|
||
te ||
|
||
ez
|
||
? void 0
|
||
: (0, t.jsx)(A.default, {
|
||
children: (0, t.jsx)("div", {
|
||
className: "flex items-center",
|
||
style: eZ,
|
||
children: (0, t.jsxs)("button", {
|
||
type: "button",
|
||
onClick: iF,
|
||
className:
|
||
"text-canvas-controls-text hover:bg-canvas-controls-hover flex h-6 items-center gap-1 rounded-md px-2 text-xs transition-colors",
|
||
children: [
|
||
(0, t.jsx)(eY, { size: 14 }),
|
||
(0, t.jsx)("span", { children: "上传" }),
|
||
],
|
||
}),
|
||
}),
|
||
}),
|
||
rc = (0, t.jsxs)(t.Fragment, {
|
||
children: [
|
||
(0, t.jsx)(y.Tooltip, {
|
||
label: "当前视角截图",
|
||
withArrow: !0,
|
||
position: "top",
|
||
openDelay: 150,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className: "flex",
|
||
children: (0, t.jsx)("button", {
|
||
type: "button",
|
||
className: e6,
|
||
"aria-label": "当前视角截图",
|
||
disabled: tr || nR,
|
||
onClick: iV,
|
||
children: (0, t.jsx)(h.default, {
|
||
className: "h-4 w-4 shrink-0",
|
||
"aria-hidden": !0,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
(0, t.jsx)(y.Tooltip, {
|
||
label: "4大视角截图",
|
||
withArrow: !0,
|
||
position: "top",
|
||
openDelay: 150,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className: "flex",
|
||
children: (0, t.jsx)("button", {
|
||
type: "button",
|
||
className: e6,
|
||
"aria-label": "4大视角截图",
|
||
disabled: tr || nR,
|
||
onClick: iW,
|
||
children: (0, t.jsx)(p.default, {
|
||
className: "h-4 w-4 shrink-0",
|
||
"aria-hidden": !0,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
(0, t.jsx)(y.Tooltip, {
|
||
label: "12大视角截图",
|
||
withArrow: !0,
|
||
position: "top",
|
||
openDelay: 150,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className: "flex",
|
||
children: (0, t.jsx)("button", {
|
||
type: "button",
|
||
className: e6,
|
||
"aria-label": "12大视角截图",
|
||
disabled: tr || nR,
|
||
onClick: iK,
|
||
children: (0, t.jsx)(g.default, {
|
||
className: "h-4 w-4 shrink-0",
|
||
"aria-hidden": !0,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
(0, t.jsx)(y.Tooltip, {
|
||
label: "重置视角",
|
||
withArrow: !0,
|
||
position: "top",
|
||
openDelay: 150,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className: "flex",
|
||
children: (0, t.jsx)("button", {
|
||
type: "button",
|
||
className: e6,
|
||
"aria-label": "重置视角",
|
||
onClick: iq,
|
||
children: (0, t.jsx)(b.default, {
|
||
className: "h-4 w-4 shrink-0",
|
||
"aria-hidden": !0,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
(0, t.jsx)(y.Tooltip, {
|
||
label: "构图参考线",
|
||
withArrow: !0,
|
||
position: "top",
|
||
openDelay: 150,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className: "flex",
|
||
children: (0, t.jsx)("button", {
|
||
type: "button",
|
||
className: nB
|
||
? "flex h-8 w-8 min-w-8 shrink-0 items-center justify-center rounded-lg text-btn-primary transition-colors bg-(--btn-secondary-bg) disabled:pointer-events-none disabled:opacity-40"
|
||
: e6,
|
||
"aria-label": "构图参考线",
|
||
onClick: () => nH((e) => !e),
|
||
children: (0, t.jsx)(f.default, {
|
||
className: "h-4 w-4 shrink-0",
|
||
"aria-hidden": !0,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
],
|
||
}),
|
||
rl =
|
||
tT && tI && i6 && !tG && !nD
|
||
? (0, t.jsx)(A.default, {
|
||
nodeId: ex,
|
||
baseOffset: 24,
|
||
zIndex: 20,
|
||
children: (0, t.jsxs)("div", {
|
||
className:
|
||
"border-hair bg-panel-background border-border-muted nodrag box-border flex w-fit items-center gap-2 rounded-xl p-2 shadow-[0px_4px_10px_0px_rgba(0,0,0,0.12)]",
|
||
children: [
|
||
(0, t.jsx)(y.Tooltip, {
|
||
label: "退出全景预览(不支持esc退出)",
|
||
withArrow: !0,
|
||
position: "top",
|
||
openDelay: 150,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className: "flex",
|
||
children: (0, t.jsx)("button", {
|
||
type: "button",
|
||
className: e6,
|
||
"aria-label": "退出全景预览(不支持esc退出)",
|
||
onClick: () => tM(ex),
|
||
"data-testid": "panorama-preview-exit",
|
||
children: (0, t.jsx)(w.Icons.x, {
|
||
className: "size-[13px] shrink-0",
|
||
"aria-hidden": !0,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"canvas-light:bg-neutral-300 h-8 w-[0.5px] shrink-0 bg-neutral-600/80",
|
||
"aria-hidden": !0,
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className: "flex items-center gap-1",
|
||
children: rc,
|
||
}),
|
||
(0, t.jsx)(y.Tooltip, {
|
||
label: "全屏预览",
|
||
withArrow: !0,
|
||
position: "top",
|
||
openDelay: 150,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className: "flex",
|
||
children: (0, t.jsx)("button", {
|
||
type: "button",
|
||
className: e6,
|
||
"aria-label": "全屏预览",
|
||
onClick: () => nj(!0),
|
||
children: (0, t.jsx)(d.default, {
|
||
className: "h-4 w-4 shrink-0",
|
||
"aria-hidden": !0,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
],
|
||
}),
|
||
})
|
||
: void 0;
|
||
return (0, t.jsxs)(em.default, {
|
||
ref: td,
|
||
id: ex,
|
||
selected: ey,
|
||
label: tZ,
|
||
titleIcon: (0, t.jsx)(eq, { size: 14 }),
|
||
isStale: eV ? void 0 : eB?.isStale,
|
||
onDismissStale: eV ? void 0 : t9,
|
||
onRetry: eV
|
||
? void 0
|
||
: eB?.isStale && ez
|
||
? eB?.action === R.NodeAction.IMAGE_GENERATE &&
|
||
eB?.params &&
|
||
eB?.generatorType !== R.GeneratorType.ENHANCE &&
|
||
eB?.params?.scene !== "redraw" &&
|
||
eB?.params?.scene !== "erase"
|
||
? ni
|
||
: eB?._mattingNode === !0 ||
|
||
(eB?.action === R.NodeAction.IMAGE_EDIT &&
|
||
(eB?.label === "抠图" || eB?.name === "抠图"))
|
||
? nr
|
||
: eB?._outpaintPads != null
|
||
? na
|
||
: void 0
|
||
: void 0,
|
||
isReadonly: tr,
|
||
onLabelChange: t8,
|
||
maxWidth: i6 ? n9 : nQ,
|
||
generatorAnchorWidth: tr && i6 ? n9 : void 0,
|
||
rootClassName: ro,
|
||
interaction: tB,
|
||
contentStyle: i9 ? (i8 ? ra : rr) : ri,
|
||
contentClassName: i9
|
||
? "group overflow-visible"
|
||
: "group overflow-visible rounded-xl",
|
||
hideTargetHandle: (0, R.isResourceAction)(eB?.action),
|
||
hideSourceHandle: tq,
|
||
shouldShowGenerator: nM,
|
||
nodeType: R.NodeType.IMAGE,
|
||
generatorType: eB?.generatorType,
|
||
incomingData: tw,
|
||
beforeContent: rl ?? rs,
|
||
titleDimensionHint: t6,
|
||
labelSuffix: t5,
|
||
children: [
|
||
("generating" === nl || "failed" === nl) &&
|
||
(0, t.jsx)(eg.default, {
|
||
taskInfo: eB?.taskInfo,
|
||
onRetry: eB?.selectedSlash ? no : void 0,
|
||
nodeId: ex,
|
||
onCancel: t$ ? ns : void 0,
|
||
}),
|
||
i8 &&
|
||
(0, t.jsxs)("div", {
|
||
className: "absolute inset-0 overflow-hidden rounded-xl",
|
||
children: [
|
||
(0, t.jsx)(_.default, {
|
||
src: io,
|
||
alt: tJ ?? tZ,
|
||
className: "h-full w-full scale-110 object-cover",
|
||
style: { filter: "blur(24px)" },
|
||
skipBlobTransition: !0,
|
||
}),
|
||
(0, t.jsx)(eg.default, {
|
||
taskInfo: eB?.taskInfo,
|
||
hasContent: !0,
|
||
nodeId: ex,
|
||
onCancel: ns,
|
||
}),
|
||
],
|
||
}),
|
||
te &&
|
||
!i6 &&
|
||
(0, t.jsxs)("div", {
|
||
className:
|
||
"absolute inset-0 flex flex-col items-center justify-center gap-3 rounded-xl px-6",
|
||
style: {
|
||
background: "var(--Surface-Panel-background, #171717)",
|
||
border: "1px solid var(--canvas-node-border)",
|
||
},
|
||
children: [
|
||
(0, t.jsx)("span", {
|
||
className: "text-center text-base font-semibold text-white",
|
||
children: "聚焦模式",
|
||
}),
|
||
(0, t.jsx)("span", {
|
||
className: "text-center text-sm text-white/90",
|
||
children: "请选择一张图像进行「局部框选」操作",
|
||
}),
|
||
(0, t.jsx)("span", {
|
||
className: "text-center text-sm text-white/60",
|
||
children: "按ESC键可退出当前模式",
|
||
}),
|
||
],
|
||
}),
|
||
"empty_generate" === nl &&
|
||
!te &&
|
||
(0, t.jsx)(ep.default, {
|
||
icon: (0, t.jsx)(eX, {
|
||
size: 90,
|
||
className: "text-fg-disabled",
|
||
}),
|
||
isReadonly: tr,
|
||
actions: [
|
||
{
|
||
icon: (0, t.jsx)(eY, { size: 14 }),
|
||
label: "图生图",
|
||
onClick: iU,
|
||
},
|
||
{
|
||
icon: (0, t.jsx)(w.Icons.Hd, { className: "h-4 w-4" }),
|
||
label: "图片高清",
|
||
onClick: iB,
|
||
},
|
||
],
|
||
}),
|
||
"pending" === nl &&
|
||
(eB?.generatorType === R.GeneratorType.ENHANCE
|
||
? (0, t.jsx)("div", {
|
||
className: "flex h-full items-center justify-center px-6",
|
||
children: (0, t.jsx)("span", {
|
||
className: "text-fg-muted text-center text-sm",
|
||
children: "配置参数生成高清图像",
|
||
}),
|
||
})
|
||
: (0, t.jsx)("div", {
|
||
className: "flex h-full items-center justify-center",
|
||
children: (0, t.jsx)(eX, {
|
||
size: 90,
|
||
className: "text-fg-disabled",
|
||
}),
|
||
})),
|
||
i6 &&
|
||
(0, t.jsx)("div", {
|
||
ref: (e) => {
|
||
(iw.current = e), (i3.current = e);
|
||
},
|
||
className: "absolute inset-0 overflow-visible rounded-xl",
|
||
children:
|
||
te && ex === tt
|
||
? (0, t.jsx)(eQ, {})
|
||
: (0, t.jsxs)(t.Fragment, {
|
||
children: [
|
||
nv &&
|
||
(0, t.jsx)("div", {
|
||
className: "absolute inset-0 rounded-xl",
|
||
style: {
|
||
background:
|
||
"var(--Surface-Panel-background, #171717)",
|
||
border: "1px solid var(--canvas-node-border)",
|
||
...(0, ew.getPipelineStyles)(
|
||
tH,
|
||
tz,
|
||
ey,
|
||
"var(--canvas-node-border-selected)",
|
||
),
|
||
},
|
||
}),
|
||
tW.map((e, n) => {
|
||
let i = i1[n];
|
||
if (!i || i.hidden) return null;
|
||
let r = 0 === n,
|
||
a = !nv && n > 0,
|
||
o = tr && a,
|
||
s = nS === n,
|
||
c =
|
||
"running" === tH && !nv && r && tz
|
||
? `0 0 12px ${tz}40, 0 0 4px ${tz}20`
|
||
: void 0,
|
||
h =
|
||
!nv && tY && r
|
||
? "0 8px 20px rgba(0, 0, 0, 0.24)"
|
||
: void 0,
|
||
f =
|
||
[
|
||
1 !== i.scale && `scale(${i.scale})`,
|
||
i.rotate && `rotate(${i.rotate}deg)`,
|
||
]
|
||
.filter(Boolean)
|
||
.join(" ") || "",
|
||
d = nv && ny === n ? 1.02 : 1;
|
||
return (0, t.jsxs)(
|
||
"div",
|
||
{
|
||
className:
|
||
"absolute overflow-hidden rounded-xl",
|
||
style: {
|
||
left: `${i.left}px`,
|
||
top: `${i.top}px`,
|
||
width: `${i.width}px`,
|
||
height: `${i.height}px`,
|
||
zIndex: i.zIndex,
|
||
transform: f || void 0,
|
||
border: "1px solid var(--canvas-node-border)",
|
||
outline:
|
||
!nv && r && tz
|
||
? `2px solid ${tz}`
|
||
: !nv && r && ey
|
||
? "2px solid var(--canvas-node-border-selected)"
|
||
: "none",
|
||
outlineOffset: "-1px",
|
||
boxShadow:
|
||
c ??
|
||
(a
|
||
? "0 14px 32px rgba(0, 0, 0, 0.38)"
|
||
: void 0) ??
|
||
h,
|
||
cursor:
|
||
to && r
|
||
? "pointer"
|
||
: (e7 || te) && r
|
||
? "crosshair"
|
||
: nv
|
||
? "pointer"
|
||
: "default",
|
||
transition: nI
|
||
? "left 300ms ease, top 300ms ease, width 300ms ease, height 300ms ease, transform 300ms ease, opacity 300ms ease"
|
||
: void 0,
|
||
background: tQ
|
||
? "repeating-conic-gradient(#303030 0% 25%, #1a1a1a 0% 50%) 0 0 / 20px 20px"
|
||
: "var(--Surface-Panel-background, #171717)",
|
||
},
|
||
onMouseEnter:
|
||
nv && tY
|
||
? () => {
|
||
n_(n);
|
||
}
|
||
: void 0,
|
||
onMouseLeave:
|
||
nv && tY
|
||
? () => {
|
||
n_((e) => (e === n ? null : e));
|
||
}
|
||
: void 0,
|
||
onClick: (e) => {
|
||
if (to && r) {
|
||
e.stopPropagation();
|
||
let t =
|
||
eB?.originalUrl?.[0] ?? eB?.url?.[0];
|
||
if (t && ts)
|
||
try {
|
||
ts(t);
|
||
} catch {}
|
||
tc(!1);
|
||
return;
|
||
}
|
||
te && r
|
||
? e.stopPropagation()
|
||
: e7 && r && (e.stopPropagation(), iA(e));
|
||
},
|
||
children: [
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"h-full w-full transition-transform duration-300",
|
||
style: { transform: `scale(${d})` },
|
||
children: tC
|
||
? (0, t.jsx)("div", {
|
||
className:
|
||
"bg-(--Surface-Panel-background,#171717) h-full w-full",
|
||
})
|
||
: tT && r && is && !nD
|
||
? (0, t.jsxs)("div", {
|
||
className:
|
||
"relative h-full min-h-0 w-full",
|
||
children: [
|
||
(0, t.jsx)("div", {
|
||
className: (0, $.cn)(
|
||
"nodrag nopan absolute inset-0",
|
||
ey && "nowheel",
|
||
),
|
||
style: {
|
||
touchAction: ey
|
||
? "none"
|
||
: void 0,
|
||
},
|
||
onPointerDown: tU,
|
||
onClick: (e) =>
|
||
e.stopPropagation(),
|
||
children: (0, t.jsx)(eD, {
|
||
ref: tp,
|
||
url: is,
|
||
className:
|
||
"h-full min-h-0 w-full",
|
||
showCompositionGrid: nB,
|
||
panoramaInteractionEnabled:
|
||
ey,
|
||
}),
|
||
}),
|
||
!tr &&
|
||
(0, t.jsxs)(t.Fragment, {
|
||
children: [
|
||
(0, t.jsx)("div", {
|
||
"aria-hidden": !0,
|
||
className:
|
||
"absolute inset-x-0 top-0 z-10 h-3 cursor-grab active:cursor-grabbing",
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
"aria-hidden": !0,
|
||
className:
|
||
"absolute inset-x-0 bottom-0 z-10 h-3 cursor-grab active:cursor-grabbing",
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
"aria-hidden": !0,
|
||
className:
|
||
"absolute inset-y-0 left-0 z-10 w-3 cursor-grab active:cursor-grabbing",
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
"aria-hidden": !0,
|
||
className:
|
||
"absolute inset-y-0 right-0 z-10 w-3 cursor-grab active:cursor-grabbing",
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
})
|
||
: (0, t.jsx)(_.default, {
|
||
src:
|
||
o || r
|
||
? io
|
||
: ((0, q.getUrlForWidth)(
|
||
e,
|
||
nV,
|
||
eH?.items?.[n]?.byteSize,
|
||
) ?? e),
|
||
alt: r ? (tJ ?? tZ) : "",
|
||
className:
|
||
"h-full w-full object-cover",
|
||
retryKey: r ? np : void 0,
|
||
onLoadError: r ? nb : void 0,
|
||
onLoadSuccess: r ? nm : void 0,
|
||
onCacheCapture: r ? ia : void 0,
|
||
skipBlobTransition: r && nd,
|
||
uploaded: r && !!nh.current && !tq,
|
||
srcSet: r ? ii.srcSet : void 0,
|
||
sizes: r ? ii.sizes : void 0,
|
||
fetchPriority: r
|
||
? ii.fetchPriority
|
||
: "low",
|
||
expectedAcquireUrl: r
|
||
? ii.expectedAcquireUrl
|
||
: void 0,
|
||
}),
|
||
}),
|
||
r &&
|
||
nd &&
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"pointer-events-none absolute inset-0 flex items-center justify-center mix-blend-difference",
|
||
style: {
|
||
background: "rgba(0, 0, 0, 0.25)",
|
||
opacity: +!!ir,
|
||
transition: "opacity 300ms ease-out",
|
||
},
|
||
children: (0, t.jsx)("span", {
|
||
className:
|
||
"size-5 animate-spin rounded-full border-2 border-white/30 border-t-white",
|
||
}),
|
||
}),
|
||
r &&
|
||
ng &&
|
||
!tq &&
|
||
(0, t.jsx)(x.ResourceRetryOverlay, {
|
||
onRetry: nw,
|
||
}),
|
||
r &&
|
||
tk &&
|
||
i6 &&
|
||
tK &&
|
||
!tT &&
|
||
rt &&
|
||
!tr &&
|
||
!tG &&
|
||
(0, t.jsx)(y.Tooltip, {
|
||
label: "进入全景预览",
|
||
withArrow: !0,
|
||
position: "top",
|
||
openDelay: 150,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className:
|
||
"nodrag nopan absolute right-2 top-2 z-20 flex",
|
||
children: (0, t.jsx)("button", {
|
||
type: "button",
|
||
"data-testid":
|
||
"image-node-panorama-preview-entry",
|
||
className: (0, $.cn)(
|
||
"flex size-9 items-center justify-center transition-colors",
|
||
"pointer-events-auto rounded-lg bg-black/65 text-white",
|
||
),
|
||
onClick: (e) => {
|
||
e.stopPropagation(), iX();
|
||
},
|
||
children: (0, t.jsx)(u.default, {
|
||
className: "h-4 w-4 shrink-0",
|
||
"aria-hidden": !0,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
r &&
|
||
tk &&
|
||
i6 &&
|
||
tK &&
|
||
tT &&
|
||
rt &&
|
||
!nD &&
|
||
!tr &&
|
||
!tG &&
|
||
(0, t.jsx)(y.Tooltip, {
|
||
label: "退出全景预览",
|
||
withArrow: !0,
|
||
position: "top",
|
||
openDelay: 150,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className:
|
||
"nodrag nopan absolute right-2 top-2 z-20 flex",
|
||
children: (0, t.jsx)("button", {
|
||
type: "button",
|
||
"data-testid":
|
||
"image-node-panorama-preview-exit-corner",
|
||
className: (0, $.cn)(
|
||
"flex size-9 items-center justify-center transition-colors",
|
||
"pointer-events-auto rounded-lg bg-black/65 text-white",
|
||
),
|
||
onClick: (e) => {
|
||
e.stopPropagation(), tM(ex);
|
||
},
|
||
children: (0, t.jsx)(l.default, {
|
||
className:
|
||
"h-4 w-4 shrink-0 opacity-90",
|
||
"aria-hidden": !0,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
e7 &&
|
||
r &&
|
||
iy.length > 0 &&
|
||
(0, t.jsx)("div", {
|
||
className: "absolute inset-0",
|
||
style: {
|
||
zIndex: 50,
|
||
overflow: "visible",
|
||
},
|
||
children: iy.map((e) =>
|
||
(0, t.jsx)(
|
||
"div",
|
||
{
|
||
children: e.apiResponseId
|
||
? (0, t.jsx)(e3, {
|
||
markPoint: e,
|
||
onSuggestionChange: iC,
|
||
onDelete: ik,
|
||
})
|
||
: (0, t.jsx)(e4, {
|
||
relX: e.relX,
|
||
relY: e.relY,
|
||
}),
|
||
},
|
||
e.index,
|
||
),
|
||
),
|
||
}),
|
||
r &&
|
||
(te || ic) &&
|
||
(0, t.jsx)(eG, {
|
||
isFocusDragging: te,
|
||
existingRegion: ic,
|
||
externalPendingRegion: iu,
|
||
onConfirm: il,
|
||
onConfirmReady: ih,
|
||
clearKey: ig,
|
||
onInteractStart: () =>
|
||
U.stores.canvas?.setFocusInteractingNode(
|
||
ex,
|
||
),
|
||
focusAspectRatioLabel: id,
|
||
containerAspectRatio:
|
||
nW > 0 ? nV / nW : 1,
|
||
}),
|
||
r &&
|
||
tY &&
|
||
(nv
|
||
? (0, t.jsxs)("div", {
|
||
className:
|
||
"pointer-events-none absolute right-2 top-2 flex items-center gap-2 transition-opacity",
|
||
style: { zIndex: 10, opacity: +!!nv },
|
||
children: [
|
||
(0, t.jsxs)("button", {
|
||
type: "button",
|
||
onClick: (e) => i5(n, e),
|
||
disabled: s,
|
||
"data-auth-download-trigger":
|
||
"true",
|
||
className:
|
||
"pointer-events-auto flex items-center justify-center gap-1 rounded-lg bg-black/65 p-2 text-[13px] text-white disabled:opacity-60",
|
||
children: [
|
||
(0, t.jsx)(w.Icons.Download, {
|
||
width: 14,
|
||
height: 14,
|
||
}),
|
||
(0, t.jsx)("span", {
|
||
children: s
|
||
? "下载中"
|
||
: "下载",
|
||
}),
|
||
],
|
||
}),
|
||
(0, t.jsxs)("button", {
|
||
type: "button",
|
||
onClick: (e) => {
|
||
e.stopPropagation(), i2();
|
||
},
|
||
className:
|
||
"pointer-events-auto flex items-center justify-center gap-1 rounded-lg bg-black/65 p-2 text-[13px] text-white",
|
||
children: [
|
||
(0, t.jsx)(w.Icons.Minimize, {
|
||
width: 14,
|
||
height: 14,
|
||
}),
|
||
(0, t.jsx)("span", {
|
||
children: "收起",
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
})
|
||
: (0, t.jsxs)("div", {
|
||
className:
|
||
"pointer-events-none absolute right-2 top-2 flex items-center gap-2 transition-opacity",
|
||
style: { zIndex: 10, opacity: 1 },
|
||
children: [
|
||
re &&
|
||
(0, t.jsx)(y.Tooltip, {
|
||
label: tT
|
||
? "退出全景预览"
|
||
: "进入全景预览",
|
||
withArrow: !0,
|
||
position: "top",
|
||
openDelay: 150,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className:
|
||
"pointer-events-auto flex",
|
||
children: (0, t.jsx)(
|
||
"button",
|
||
{
|
||
type: "button",
|
||
"data-testid": tT
|
||
? "image-node-panorama-preview-exit-collapsed"
|
||
: "image-node-panorama-preview-entry-collapsed",
|
||
onClick: (e) => {
|
||
(e.stopPropagation(),
|
||
tT)
|
||
? tM(ex)
|
||
: iX();
|
||
},
|
||
className:
|
||
"pointer-events-auto flex size-9 items-center justify-center rounded-lg bg-black/65 text-white",
|
||
children: tT
|
||
? (0, t.jsx)(
|
||
l.default,
|
||
{
|
||
className:
|
||
"h-4 w-4 shrink-0 opacity-90",
|
||
"aria-hidden": !0,
|
||
},
|
||
)
|
||
: (0, t.jsx)(
|
||
u.default,
|
||
{
|
||
className:
|
||
"h-4 w-4 shrink-0",
|
||
"aria-hidden": !0,
|
||
},
|
||
),
|
||
},
|
||
),
|
||
}),
|
||
}),
|
||
!tT &&
|
||
(0, t.jsxs)("button", {
|
||
type: "button",
|
||
onClick: i0,
|
||
className:
|
||
"pointer-events-auto flex items-center justify-center gap-1 rounded-lg bg-black/65 p-2 text-[13px] text-white",
|
||
children: [
|
||
(0, t.jsx)(
|
||
w.Icons.BroadPicture,
|
||
{ width: 14, height: 14 },
|
||
),
|
||
(0, t.jsxs)("span", {
|
||
children: [tW.length, "张"],
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
})),
|
||
nv &&
|
||
!r &&
|
||
n < 4 &&
|
||
(0, t.jsxs)("div", {
|
||
className:
|
||
"pointer-events-none absolute right-2 top-2 flex items-center gap-2 transition-opacity",
|
||
style: { zIndex: 10, opacity: +!!nv },
|
||
children: [
|
||
(0, t.jsxs)("button", {
|
||
type: "button",
|
||
onClick: (e) => i5(n, e),
|
||
disabled: s,
|
||
"data-auth-download-trigger": "true",
|
||
className:
|
||
"pointer-events-auto flex items-center justify-center gap-1 rounded-lg bg-black/65 p-2 text-[13px] text-white disabled:opacity-60",
|
||
children: [
|
||
(0, t.jsx)(w.Icons.Download, {
|
||
width: 14,
|
||
height: 14,
|
||
}),
|
||
(0, t.jsx)("span", {
|
||
children: s ? "下载中" : "下载",
|
||
}),
|
||
],
|
||
}),
|
||
(0, t.jsx)("button", {
|
||
type: "button",
|
||
onClick: (e) => i4(n, e),
|
||
className:
|
||
"pointer-events-auto flex items-center justify-center rounded-lg bg-black/65 p-2 text-[13px] text-white",
|
||
children: "设为主图",
|
||
}),
|
||
],
|
||
}),
|
||
r &&
|
||
tv &&
|
||
!nv &&
|
||
tX &&
|
||
!!tx &&
|
||
(0, t.jsx)("button", {
|
||
type: "button",
|
||
onClick: (e) => {
|
||
e.stopPropagation(), nk((e) => !e);
|
||
},
|
||
className:
|
||
"pointer-events-auto absolute bottom-2 right-2 flex items-center justify-center p-2",
|
||
style: {
|
||
zIndex: 35,
|
||
background: nT
|
||
? "#F7F7F7"
|
||
: "rgba(0, 0, 0, 0.65)",
|
||
backdropFilter: "blur(16px)",
|
||
borderRadius: 4,
|
||
transition:
|
||
"background 0.2s ease, border-radius 0.2s ease",
|
||
},
|
||
title: "对比原图",
|
||
children: (0, t.jsx)(w.Icons.Comparison, {
|
||
width: 14,
|
||
height: 14,
|
||
color: nT ? "#171717" : "#F7F7F7",
|
||
}),
|
||
}),
|
||
r &&
|
||
nT &&
|
||
!!tx &&
|
||
!!io &&
|
||
(0, t.jsx)(eF, {
|
||
hdImageUrl: io,
|
||
originalImageUrl: tx,
|
||
onExit: () => nk(!1),
|
||
}),
|
||
],
|
||
},
|
||
`${e}-${i.left}-${i.top}`,
|
||
);
|
||
}),
|
||
!nv &&
|
||
!tY &&
|
||
eB?.action === R.NodeAction.IMAGE_RESOURCE &&
|
||
eB?.generatorType !== R.GeneratorType.ENHANCE &&
|
||
!eB?.portraitAssetId &&
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"pointer-events-none absolute left-0 top-0",
|
||
style: {
|
||
width: `${n9}px`,
|
||
height: `${n8}px`,
|
||
zIndex: tW.length + 1,
|
||
},
|
||
children: (0, t.jsx)("div", {
|
||
className: "pointer-events-auto",
|
||
children: (0, t.jsx)(ev.default, {
|
||
accept: "image/*",
|
||
onUploaded: iN,
|
||
isReadonly: tr,
|
||
disabled: iR,
|
||
nodeId: ex,
|
||
chromeVariant:
|
||
"light" === th ? "canvasLight" : "default",
|
||
visualVariant: "panorama",
|
||
buttonClassName: (0, $.cn)(
|
||
"size-[36.15]",
|
||
rt && "right-[6.5rem]",
|
||
),
|
||
}),
|
||
}),
|
||
}),
|
||
!nv &&
|
||
!n$ &&
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"pointer-events-none absolute left-0 top-0 flex items-center justify-center",
|
||
style: {
|
||
width: `${n9}px`,
|
||
height: `${n8}px`,
|
||
zIndex: tW.length + 1,
|
||
},
|
||
children: (0, t.jsx)(r.Loader, {
|
||
color: "white",
|
||
className: "mix-blend-difference",
|
||
}),
|
||
}),
|
||
!1,
|
||
],
|
||
}),
|
||
}),
|
||
iu &&
|
||
te &&
|
||
"u" > typeof document &&
|
||
(0, i.createPortal)(
|
||
(0, t.jsxs)("div", {
|
||
ref: iv,
|
||
className: "flex items-center",
|
||
style: {
|
||
position: "fixed",
|
||
visibility: "hidden",
|
||
transform: "translateX(-50%)",
|
||
zIndex: 9999,
|
||
pointerEvents: "auto",
|
||
background: "rgba(0, 0, 0, 0.75)",
|
||
borderRadius: 8,
|
||
padding: "4px",
|
||
backdropFilter: "blur(8px)",
|
||
gap: 2,
|
||
whiteSpace: "nowrap",
|
||
},
|
||
children: [
|
||
eU.map(({ label: e, ratio: n }) =>
|
||
(0, t.jsx)(
|
||
"button",
|
||
{
|
||
type: "button",
|
||
onClick: (t) => {
|
||
t.stopPropagation(),
|
||
iu &&
|
||
(ih(
|
||
(function (e, t, n) {
|
||
let i,
|
||
r,
|
||
{
|
||
relX: a,
|
||
relY: o,
|
||
width: s,
|
||
height: c,
|
||
} = e,
|
||
l = t / n;
|
||
return (
|
||
s / c > l
|
||
? ((r = c), (i = c * l))
|
||
: ((i = s), (r = s / l)),
|
||
{ relX: a, relY: o, width: i, height: r }
|
||
);
|
||
})(iu, n, nV / nW),
|
||
),
|
||
ip(e));
|
||
},
|
||
style: {
|
||
padding: "4px 8px",
|
||
borderRadius: 6,
|
||
fontSize: 12,
|
||
color: "rgba(255, 255, 255, 0.7)",
|
||
background: "transparent",
|
||
border: "none",
|
||
cursor: "pointer",
|
||
},
|
||
onMouseEnter: (e) => {
|
||
(e.currentTarget.style.color = "#fff"),
|
||
(e.currentTarget.style.background =
|
||
"rgba(255,255,255,0.1)");
|
||
},
|
||
onMouseLeave: (e) => {
|
||
(e.currentTarget.style.color =
|
||
"rgba(255, 255, 255, 0.7)"),
|
||
(e.currentTarget.style.background =
|
||
"transparent");
|
||
},
|
||
children: e,
|
||
},
|
||
e,
|
||
),
|
||
),
|
||
(0, t.jsx)("div", {
|
||
style: {
|
||
width: 1,
|
||
height: 16,
|
||
background: "rgba(255, 255, 255, 0.2)",
|
||
margin: "0 2px",
|
||
},
|
||
}),
|
||
(0, t.jsx)("button", {
|
||
type: "button",
|
||
onClick: (e) => {
|
||
e.stopPropagation(),
|
||
ih(null),
|
||
ip(null),
|
||
ib((e) => e + 1),
|
||
U.stores.canvas?.setFocusInteractingNode(null);
|
||
},
|
||
style: {
|
||
padding: "4px 12px",
|
||
borderRadius: 6,
|
||
fontSize: 12,
|
||
color: "rgba(255, 255, 255, 0.7)",
|
||
background: "transparent",
|
||
border: "none",
|
||
cursor: "pointer",
|
||
},
|
||
onMouseEnter: (e) => {
|
||
(e.currentTarget.style.color = "#fff"),
|
||
(e.currentTarget.style.background =
|
||
"rgba(255,255,255,0.1)");
|
||
},
|
||
onMouseLeave: (e) => {
|
||
(e.currentTarget.style.color =
|
||
"rgba(255, 255, 255, 0.7)"),
|
||
(e.currentTarget.style.background = "transparent");
|
||
},
|
||
children: "取消",
|
||
}),
|
||
(0, t.jsx)("button", {
|
||
type: "button",
|
||
onClick: (e) => {
|
||
e.stopPropagation(), il(iu, id), ih(null), ip(null);
|
||
},
|
||
style: {
|
||
padding: "4px 12px",
|
||
borderRadius: 6,
|
||
fontSize: 12,
|
||
color: "#fff",
|
||
background: "var(--color-blue-500, #3b82f6)",
|
||
border: "none",
|
||
cursor: "pointer",
|
||
},
|
||
onMouseEnter: (e) => {
|
||
e.currentTarget.style.background =
|
||
"var(--color-blue-600, #2563eb)";
|
||
},
|
||
onMouseLeave: (e) => {
|
||
e.currentTarget.style.background =
|
||
"var(--color-blue-500, #3b82f6)";
|
||
},
|
||
children: "确认",
|
||
}),
|
||
],
|
||
}),
|
||
document.body,
|
||
),
|
||
nD &&
|
||
tT &&
|
||
is &&
|
||
"u" > typeof document &&
|
||
(0, i.createPortal)(
|
||
(0, t.jsxs)("div", {
|
||
className: (0, $.cn)(
|
||
"fixed inset-0 flex flex-col overflow-visible",
|
||
"light" === th && "canvas-light",
|
||
),
|
||
style: {
|
||
zIndex: 400,
|
||
background:
|
||
"light" === th
|
||
? "rgba(252, 252, 252, 0.96)"
|
||
: "rgba(10, 10, 10, 0.95)",
|
||
backdropFilter: "blur(8px)",
|
||
},
|
||
children: [
|
||
(0, t.jsxs)("div", {
|
||
className: (0, $.cn)(
|
||
"nodrag flex shrink-0 items-center justify-between border-b border-solid px-6",
|
||
"light" === th
|
||
? "border-black/10 bg-white/70"
|
||
: "border-white/8",
|
||
),
|
||
style: { height: 56 },
|
||
children: [
|
||
(0, t.jsx)("span", {
|
||
className: (0, $.cn)(
|
||
"text-base font-medium",
|
||
"light" === th
|
||
? "text-neutral-900"
|
||
: "text-white/90",
|
||
),
|
||
children: tZ,
|
||
}),
|
||
(0, t.jsx)(y.Tooltip, {
|
||
label: "关闭（ESC）",
|
||
withArrow: !0,
|
||
position: "bottom",
|
||
openDelay: 150,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className: "flex",
|
||
children: (0, t.jsx)("button", {
|
||
type: "button",
|
||
onClick: () => nj(!1),
|
||
className: (0, $.cn)(
|
||
"flex h-7 w-7 items-center justify-center rounded-lg transition-colors",
|
||
"light" === th
|
||
? "text-neutral-500 hover:bg-black/5 hover:text-neutral-800"
|
||
: "text-white/50 hover:bg-white/10 hover:text-white/80",
|
||
),
|
||
"aria-label": "关闭（ESC）",
|
||
children: (0, t.jsx)(w.Icons.x, {
|
||
width: 12,
|
||
height: 12,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
],
|
||
}),
|
||
(0, t.jsxs)("div", {
|
||
className: (0, $.cn)(
|
||
"nodrag nopan relative min-h-0 flex-1 overflow-visible",
|
||
ey && "nowheel",
|
||
),
|
||
style: { touchAction: ey ? "none" : void 0 },
|
||
onPointerDown: tU,
|
||
children: [
|
||
(0, t.jsx)(eD, {
|
||
ref: tp,
|
||
url: is,
|
||
className: "h-full min-h-0 w-full",
|
||
showCompositionGrid: nB,
|
||
hudPreset: "fullscreen",
|
||
panoramaInteractionEnabled: ey,
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"pointer-events-none absolute inset-x-0 bottom-0 z-10 flex justify-center overflow-visible px-4 pb-6",
|
||
children: (0, t.jsxs)("div", {
|
||
className: (0, $.cn)(
|
||
"nodrag pointer-events-auto flex w-fit items-center gap-1 rounded-lg px-2 py-1.5 backdrop-blur-md",
|
||
"light" === th
|
||
? "border border-neutral-200/90 bg-white/95 shadow-[0_8px_24px_rgba(0,0,0,0.1)]"
|
||
: "border-hair bg-panel-background/92 border-border-muted shadow-[0px_8px_32px_rgba(0,0,0,0.45)]",
|
||
),
|
||
"aria-label": "全景预览工具",
|
||
children: [
|
||
(0, t.jsxs)("div", {
|
||
className: "relative shrink-0",
|
||
children: [
|
||
(0, t.jsx)(y.Tooltip, {
|
||
label: "快捷键",
|
||
withArrow: !0,
|
||
position: "top",
|
||
openDelay: 150,
|
||
zIndex: 720,
|
||
children: (0, t.jsx)("span", {
|
||
className: "flex",
|
||
children: (0, t.jsx)("button", {
|
||
type: "button",
|
||
className: e6,
|
||
"aria-label": "快捷键",
|
||
"aria-expanded": nO,
|
||
"aria-haspopup": "dialog",
|
||
onClick: () => nF((e) => !e),
|
||
children: (0, t.jsx)(m.default, {
|
||
className: "h-4 w-4 shrink-0",
|
||
"aria-hidden": !0,
|
||
}),
|
||
}),
|
||
}),
|
||
}),
|
||
nO
|
||
? (0, t.jsxs)("div", {
|
||
role: "dialog",
|
||
"aria-modal": "false",
|
||
"aria-labelledby":
|
||
"panorama-fullscreen-shortcuts-title",
|
||
className:
|
||
"border-canvas-controls-border border-hair bg-panel-background/95 absolute bottom-[calc(100%+6px)] left-1/2 z-50 mb-1.5 box-border flex w-[min(408px,calc(100vw-2rem))] min-w-0 max-w-[408px] -translate-x-1/2 flex-col rounded-2xl p-3 backdrop-blur-lg",
|
||
style: {
|
||
boxShadow:
|
||
"var(--canvas-shadow-dropdown)",
|
||
},
|
||
children: [
|
||
(0, t.jsxs)("header", {
|
||
className:
|
||
"mb-2 flex min-h-7 shrink-0 items-center justify-between gap-3",
|
||
children: [
|
||
(0, t.jsx)("h2", {
|
||
id: "panorama-fullscreen-shortcuts-title",
|
||
className:
|
||
"text-canvas-controls-text m-0 flex min-h-7 min-w-0 items-center text-base font-medium leading-none",
|
||
children: "快捷键",
|
||
}),
|
||
(0, t.jsx)("button", {
|
||
type: "button",
|
||
className:
|
||
"hover:bg-canvas-controls-hover flex size-7 shrink-0 items-center justify-center rounded-lg transition-colors",
|
||
"aria-label": "关闭快捷键面板",
|
||
onClick: () => nF(!1),
|
||
children: (0, t.jsx)(
|
||
w.Icons.Close,
|
||
{
|
||
width: 13,
|
||
height: 13,
|
||
color:
|
||
"var(--canvas-controls-icon)",
|
||
},
|
||
),
|
||
}),
|
||
],
|
||
}),
|
||
(0, t.jsxs)("div", {
|
||
className:
|
||
"flex min-h-0 flex-1 items-stretch gap-3 md:gap-4",
|
||
children: [
|
||
(0, t.jsxs)("div", {
|
||
className:
|
||
"flex min-h-0 min-w-0 flex-1 flex-col justify-between gap-3",
|
||
children: [
|
||
(0, t.jsxs)("div", {
|
||
className:
|
||
"flex w-full items-center justify-between gap-3",
|
||
children: [
|
||
(0, t.jsx)("span", {
|
||
className:
|
||
"text-fg-muted min-w-0 flex-1 text-left text-sm leading-snug",
|
||
children: "镜头推进",
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"text-canvas-controls-text flex shrink-0 items-center text-sm",
|
||
children: (0, t.jsx)(
|
||
et.KeyText,
|
||
{ children: "Q" },
|
||
),
|
||
}),
|
||
],
|
||
}),
|
||
(0, t.jsxs)("div", {
|
||
className:
|
||
"flex w-full items-center justify-between gap-3",
|
||
children: [
|
||
(0, t.jsx)("span", {
|
||
className:
|
||
"text-fg-muted min-w-0 flex-1 text-left text-sm leading-snug",
|
||
children: "镜头上摇",
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"text-canvas-controls-text flex shrink-0 items-center text-sm",
|
||
children: (0, t.jsx)(
|
||
et.KeyText,
|
||
{ children: "W" },
|
||
),
|
||
}),
|
||
],
|
||
}),
|
||
(0, t.jsxs)("div", {
|
||
className:
|
||
"flex w-full items-center justify-between gap-3",
|
||
children: [
|
||
(0, t.jsx)("span", {
|
||
className:
|
||
"text-fg-muted min-w-0 flex-1 text-left text-sm leading-snug",
|
||
children: "镜头下摇",
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"text-canvas-controls-text flex shrink-0 items-center text-sm",
|
||
children: (0, t.jsx)(
|
||
et.KeyText,
|
||
{ children: "S" },
|
||
),
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"bg-canvas-controls-border w-px shrink-0 self-stretch",
|
||
"aria-hidden": !0,
|
||
}),
|
||
(0, t.jsxs)("div", {
|
||
className:
|
||
"flex min-h-0 min-w-0 flex-1 flex-col justify-between gap-1.5",
|
||
children: [
|
||
(0, t.jsxs)("div", {
|
||
className:
|
||
"flex w-full items-center justify-between gap-3",
|
||
children: [
|
||
(0, t.jsx)("span", {
|
||
className:
|
||
"text-fg-muted min-w-0 flex-1 text-left text-sm leading-snug",
|
||
children: "镜头拉远",
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"text-canvas-controls-text flex shrink-0 items-center text-sm",
|
||
children: (0, t.jsx)(
|
||
et.KeyText,
|
||
{ children: "E" },
|
||
),
|
||
}),
|
||
],
|
||
}),
|
||
(0, t.jsxs)("div", {
|
||
className:
|
||
"flex w-full items-center justify-between gap-3",
|
||
children: [
|
||
(0, t.jsx)("span", {
|
||
className:
|
||
"text-fg-muted min-w-0 flex-1 text-left text-sm leading-snug",
|
||
children: "镜头左摇",
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"text-canvas-controls-text flex shrink-0 items-center text-sm",
|
||
children: (0, t.jsx)(
|
||
et.KeyText,
|
||
{ children: "A" },
|
||
),
|
||
}),
|
||
],
|
||
}),
|
||
(0, t.jsxs)("div", {
|
||
className:
|
||
"flex w-full items-center justify-between gap-3",
|
||
children: [
|
||
(0, t.jsx)("span", {
|
||
className:
|
||
"text-fg-muted min-w-0 flex-1 text-left text-sm leading-snug",
|
||
children: "镜头右摇",
|
||
}),
|
||
(0, t.jsx)("div", {
|
||
className:
|
||
"text-canvas-controls-text flex shrink-0 items-center text-sm",
|
||
children: (0, t.jsx)(
|
||
et.KeyText,
|
||
{ children: "D" },
|
||
),
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
})
|
||
: null,
|
||
],
|
||
}),
|
||
rc,
|
||
],
|
||
}),
|
||
}),
|
||
],
|
||
}),
|
||
],
|
||
}),
|
||
document.body,
|
||
),
|
||
(0, t.jsx)(ej.default, {
|
||
nodeId: ex,
|
||
hasContent: i6 && tW.length > 0,
|
||
}),
|
||
],
|
||
});
|
||
});
|
||
function e7(e, t, i) {
|
||
(0, n.useEffect)(() => {
|
||
let n = e.current;
|
||
if (!n) return;
|
||
let i = !1,
|
||
r = null,
|
||
a = (e) => {
|
||
if (
|
||
t ||
|
||
e.ctrlKey ||
|
||
e.metaKey ||
|
||
!(n.scrollHeight > n.clientHeight + 1) ||
|
||
Math.abs(e.deltaX) >= Math.abs(e.deltaY)
|
||
)
|
||
return;
|
||
let a = n.scrollTop <= 0 && e.deltaY < 0,
|
||
o =
|
||
n.scrollTop + n.clientHeight >= n.scrollHeight - 1 &&
|
||
e.deltaY > 0;
|
||
if (a || o) {
|
||
i &&
|
||
(e.stopPropagation(),
|
||
r && clearTimeout(r),
|
||
(r = setTimeout(() => {
|
||
i = !1;
|
||
}, 300)));
|
||
return;
|
||
}
|
||
(i = !0), r && (clearTimeout(r), (r = null)), e.stopPropagation();
|
||
};
|
||
return (
|
||
n.addEventListener("wheel", a, { passive: !0 }),
|
||
() => {
|
||
n.removeEventListener("wheel", a), r && clearTimeout(r);
|
||
}
|
||
);
|
||
}, [e, t, i]);
|
||
}
|
||
function te(e) {
|
||
let t = (0, n.useRef)(e);
|
||
t.current = e;
|
||
let i = (0, U.useCanvasStore)((e) => e.canvasLocked),
|
||
r = (0, n.useRef)(i);
|
||
r.current = i;
|
||
let a = (0, n.useRef)(null);
|
||
return (0, n.useCallback)((e) => {
|
||
if ((a.current && (a.current(), (a.current = null)), !e)) return;
|
||
let n = (e) => {
|
||
if (t.current) {
|
||
if (e.ctrlKey || e.metaKey) {
|
||
r.current && e.stopPropagation();
|
||
return;
|
||
}
|
||
e.stopPropagation();
|
||
}
|
||
};
|
||
e.addEventListener("wheel", n, { passive: !0 }),
|
||
(a.current = () => e.removeEventListener("wheel", n));
|
||
}, []);
|
||
}
|
||
(e9.displayName = "ImageNode"),
|
||
e.s(["default", 0, e9], 54936),
|
||
e.s(
|
||
["useNodeWheelCapture", () => te, "useScrollPassthrough", () => e7],
|
||
117313,
|
||
);
|
||
};
|
||
|
||
export default moduleFactory;
|