@realsee/dnalogel 2.0.2 → 2.0.4-dev.1

package/libs/PanoMeasurePlugin/Controller/WatchController.js

@@ -1,317 +1,169 @@
-import Hammer from 'hammerjs';
-import DeleteDom from '../Modules/DeleteDom';
-import isNDCPointInScreen from '../utils/isNDCPointInScreen';
-import BaseController from './BaseController';
-import { Raycaster, Vector2 } from 'three';
-import { closestPointOnLine } from '../utils/math';
-import { findClosestPoint } from '../utils/findClosestPoint';
-import { findAssociatedLines } from '../utils/findAssociatedLines';
-import { getPointFromHammerEvent } from '../utils/getPointFromHammerEvent';
-export default class WatchController extends BaseController {
-    constructor(params) {
-        super(params);
-        Object.defineProperty(this, "type", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: 'watch'
-        });
-        Object.defineProperty(this, "deleteDom", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "highlightedLines", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: []
-        });
-        Object.defineProperty(this, "fiveElement", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "editPointState", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "hammer", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "onPanStart", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (e) => {
-                var _a;
-                if (this.model.points.length === 0 || !this.fiveElement)
-                    return;
-                const mouse = getPointFromHammerEvent(e).point;
-                const closestPoint = (_a = findClosestPoint(this.five, this.model.points, mouse, 20)) === null || _a === void 0 ? void 0 : _a.point;
-                if (!closestPoint) {
-                    this.editPointState = undefined;
-                    return;
-                }
-                const editPointState = {
-                    point: closestPoint,
-                    associatedLines: findAssociatedLines(closestPoint.lines[0]),
-                };
-                const cancelDragLine = this.hook.emit('wantsDragLine', {
-                    point: closestPoint.id,
-                    lines: editPointState.associatedLines.map(({ id }) => id),
-                });
-                if (cancelDragLine)
-                    return;
-                this.editPointState = editPointState;
-                this.magnifier.appendTo(this.container);
-                this.group.add(this.mouseGroup);
-            }
-        });
-        Object.defineProperty(this, "onPanEnd", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: () => {
-                if (!this.editPointState)
-                    return;
-                // 把拖动的线从虚线转换为实线
-                this.editPointState.point.lines.forEach((line) => line.mesh.setMaterial({ dashed: false }));
-                // 还原选中态
-                this.highlightLines(this.editPointState.associatedLines);
-                this.editPointState = undefined;
-                this.magnifier.remove();
-                this.group.remove(this.mouseGroup);
-            }
-        });
-        Object.defineProperty(this, "onPan", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (e) => {
-                if (!this.editPointState || !this.fiveElement)
-                    return;
-                const mouse = getPointFromHammerEvent(e).ndcPoint;
-                const raycaster = new Raycaster();
-                raycaster.setFromCamera(mouse, this.five.camera);
-                const [intersection] = this.five.model.intersectRaycaster(raycaster);
-                if (!intersection)
-                    return;
-                this.onIntersectionUpdate(intersection);
-            }
-        });
-        Object.defineProperty(this, "onIntersectionUpdate", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (intersection, mesh) => {
-                if (!this.editPointState)
-                    return;
-                // 拖动过程中清除选中态
-                this.clearHighlightLines();
-                // 把拖动点相关的线变成虚线 & 改变相关线的位置
-                this.editPointState.point.position.copy(intersection.point);
-                this.editPointState.point.lines.forEach((line) => {
-                    line.mesh.setPoints(line.points[0].position.clone(), line.points[1].position.clone());
-                    line.lightMesh.setPoints(line.points[0].position.clone(), line.points[1].position.clone());
-                    line.mesh.setMaterial({ dashed: true });
-                });
-                this.updateDistanceUI();
-                this.magnifier.renderWithPoint(intersection.point);
-                this.mouseGroup.position.copy(intersection.point);
-                if (mesh) {
-                    this.mouseGroup.quaternion.copy(mesh.quaternion);
-                }
-                else if (intersection.face) {
-                    const face = intersection.face.normal;
-                    const positionVector = face.clone().multiplyScalar(0.05);
-                    const position = intersection.point.clone().add(positionVector);
-                    const lookAtVector = position.clone().add(positionVector);
-                    this.mouseGroup.lookAt(lookAtVector);
-                }
-                this.five.needsRender = true;
-                this.hook.emit('selectedChange', this.editPointState.associatedLines.map((line) => line.toCompletelyJson()));
-            }
-        });
-        Object.defineProperty(this, "wantsPanGesture", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: () => {
-                if (this.editPointState)
-                    return false;
-            }
-        });
-        Object.defineProperty(this, "wantsTapGesture", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (raycaster) => {
-                const [target] = this.five.model.intersectRaycaster(raycaster);
-                if (!target)
-                    return;
-                const camera = this.five.camera;
-                const ndcTarget = target.point.clone().project(camera);
-                const screenWidth = this.container.clientWidth;
-                const screenHeight = this.container.clientHeight;
-                const targetScreenPosition = new Vector2(ndcTarget.x * screenWidth, ndcTarget.y * screenHeight);
-                // 把线的端点全部映射到屏幕上，过滤掉不在视野内的线，同时乘以屏幕宽 & 高
-                const screenLines = this.model.lines
-                    .map((line) => {
-                    const [startPoint, endPoint] = line.points;
-                    const ndcStartPoint = startPoint.position.clone().project(camera);
-                    const ndcEndPoint = endPoint.position.clone().project(camera);
-                    if (!isNDCPointInScreen(ndcStartPoint) && !isNDCPointInScreen(ndcEndPoint))
-                        return null;
-                    const startScreenPosition = new Vector2(ndcStartPoint.x * screenWidth, ndcStartPoint.y * screenHeight);
-                    const endScreenPosition = new Vector2(ndcEndPoint.x * screenWidth, ndcEndPoint.y * screenHeight);
-                    return { id: line.id, points: [startScreenPosition, endScreenPosition] };
-                })
-                    .filter((line) => !!line);
-                if (screenLines.length === 0)
-                    return;
-                // 找这些线距离鼠标点击位置最近的线
-                const distanceLines = screenLines
-                    .map((line) => {
-                    const closestPoint = closestPointOnLine(targetScreenPosition, line.points);
-                    return { id: line.id, distance: closestPoint.distanceTo(targetScreenPosition) };
-                })
-                    .sort((a, b) => a.distance - b.distance);
-                const closestScreenLine = distanceLines[0];
-                if (closestScreenLine.distance > 20)
-                    return;
-                const closestLine = this.model.lines.find(({ id }) => id === closestScreenLine.id);
-                if (!closestLine)
-                    return;
-                this.chooseLine(closestLine);
-                return false;
-            }
-        });
-        Object.defineProperty(this, "chooseLine", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (line) => {
-                const highlightLines = findAssociatedLines(line);
-                this.highlightLines(highlightLines);
-                this.five.needsRender = true;
-                this.hook.emit('selectedChange', highlightLines.map((line) => line.toCompletelyJson()));
-            }
-        });
-        Object.defineProperty(this, "lineRemoved", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: (line) => {
-                this.removeLine(line);
-                // TODO: 这个逻辑不太好，改进一下
-                this.hook.emit('selectedChange', this.model.lines.filter((line) => line.selected).map((line) => line.toCompletelyJson()));
-            }
-        });
-        Object.defineProperty(this, "onCameraUpdate", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: () => {
-                this.updateDistanceUI();
-                this.highlightedLines.length > 0 && this.deleteDom.updatePosition();
-            }
-        });
-        Object.defineProperty(this, "deleteDomClickCallback", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: () => {
-                const firstLine = this.highlightedLines[0];
-                // TODO: 优化折线的删除逻辑
-                firstLine
-                    .getPolyline()
-                    .lines.slice()
-                    .reverse()
-                    .forEach((line) => this.model.removeLine(line));
-                this.highlightedLines = [];
-                // this.clearHighlightLines()
-                // this.highlightedLines.forEach((line) => this.model.removeLine(line))
-                this.deleteDom.setLines([]).hide();
-            }
-        });
-        Object.defineProperty(this, "cancelDeleteClickCallback", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: () => {
-                this.clearHighlightLines();
-            }
-        });
-        this.deleteDom = new DeleteDom(this.five, {
-            onClick: this.deleteDomClickCallback,
-            cancelDelete: this.cancelDeleteClickCallback,
-        }).appendTo(this.container);
-        this.model.lines.forEach((line) => {
-            line.distanceItem.appendTo(this.container);
-            line.distanceItem.update(this.five);
-            line.hook.on('selected', this.chooseLine);
-            this.group.add(line.mesh);
-        });
-        const fiveElement = this.five.getElement();
-        if (fiveElement) {
-            this.fiveElement = fiveElement;
-            const hammer = new Hammer(fiveElement);
-            this.hammer = hammer;
-            hammer.on('pan', this.onPan);
-            hammer.on('panstart', this.onPanStart);
-            hammer.on('panend', this.onPanEnd);
+var w = Object.defineProperty;
+var y = (a, h, e) => h in a ? w(a, h, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[h] = e;
+var s = (a, h, e) => (y(a, typeof h != "symbol" ? h + "" : h, e), e);
+import { H as E } from "../../hammer.b5b6115e.js";
+import G from "../Modules/DeleteDom/index.js";
+import L from "../utils/isNDCPointInScreen.js";
+import R from "./BaseController.js";
+import { Raycaster as H, Vector2 as f } from "three";
+import { closestPointOnLine as T } from "../utils/math.js";
+import { findClosestPoint as I } from "../utils/findClosestPoint.js";
+import { findAssociatedLines as v } from "../utils/findAssociatedLines.js";
+import { getPointFromHammerEvent as C } from "../utils/getPointFromHammerEvent.js";
+import "../Modules/DeleteDom/_Assets/delete.svg.js";
+import "../Modules/DeleteDom/_Assets/delete_bg.png.js";
+import "../Modules/DeleteDom/_Assets/delete_hover_bg.png.js";
+import "../Model/line.js";
+import "../../shared-utils/uuid.js";
+import "../Model/polyline.js";
+import "../utils/line.js";
+import "@realsee/five/line";
+import "../utils/constants.js";
+import "@realsee/five";
+import "../utils/distanceDom.js";
+import "../Model/point.js";
+import "../../shared-utils/removeArrayItem.js";
+import "../utils/ironbox.js";
+import "../utils/ndc2Screen.js";
+class oe extends R {
+  constructor(e) {
+    super(e);
+    s(this, "type", "watch");
+    s(this, "deleteDom");
+    s(this, "highlightedLines", []);
+    s(this, "fiveElement");
+    s(this, "editPointState");
+    s(this, "hammer");
+    s(this, "onPanStart", (e) => {
+      var r;
+      if (this.model.points.length === 0 || !this.fiveElement)
+        return;
+      const i = C(e).point, t = (r = I(this.five, this.model.points, i, 20)) == null ? void 0 : r.point;
+      if (!t) {
+        this.editPointState = void 0;
+        return;
+      }
+      const o = {
+        point: t,
+        associatedLines: v(t.lines[0])
+      };
+      this.hook.emit("wantsDragLine", {
+        point: t.id,
+        lines: o.associatedLines.map(({ id: l }) => l)
+      }) || (this.editPointState = o, this.magnifier.appendTo(this.container), this.group.add(this.mouseGroup));
+    });
+    s(this, "onPanEnd", () => {
+      !this.editPointState || (this.editPointState.point.lines.forEach((e) => e.mesh.setMaterial({ dashed: !1 })), this.highlightLines(this.editPointState.associatedLines), this.editPointState = void 0, this.magnifier.remove(), this.group.remove(this.mouseGroup));
+    });
+    s(this, "onPan", (e) => {
+      if (!this.editPointState || !this.fiveElement)
+        return;
+      const i = C(e).ndcPoint, t = new H();
+      t.setFromCamera(i, this.five.camera);
+      const [o] = this.five.model.intersectRaycaster(t);
+      !o || this.onIntersectionUpdate(o);
+    });
+    s(this, "onIntersectionUpdate", (e, i) => {
+      if (!!this.editPointState) {
+        if (this.clearHighlightLines(), this.editPointState.point.position.copy(e.point), this.editPointState.point.lines.forEach((t) => {
+          t.mesh.setPoints(t.points[0].position.clone(), t.points[1].position.clone()), t.lightMesh.setPoints(t.points[0].position.clone(), t.points[1].position.clone()), t.mesh.setMaterial({ dashed: !0 });
+        }), this.updateDistanceUI(), this.magnifier.renderWithPoint(e.point), this.mouseGroup.position.copy(e.point), i)
+          this.mouseGroup.quaternion.copy(i.quaternion);
+        else if (e.face) {
+          const o = e.face.normal.clone().multiplyScalar(0.05), r = e.point.clone().add(o).clone().add(o);
+          this.mouseGroup.lookAt(r);
         }
-        this.model.hook.on('lineRemoved', this.lineRemoved);
-        this.five.on('cameraUpdate', this.onCameraUpdate);
-        this.five.on('wantsTapGesture', this.wantsTapGesture);
-        this.five.on('wantsPanGesture', this.wantsPanGesture);
-        this.five.needsRender = true;
-    }
-    dispose() {
-        var _a;
-        super.dispose();
-        this.deleteDom.dispose();
-        this.model.hook.off('lineRemoved', this.lineRemoved);
-        this.model.lines.forEach((line) => line.hook.off('selected', this.chooseLine));
-        this.five.off('cameraUpdate', this.onCameraUpdate);
-        this.five.off('wantsPanGesture', this.wantsPanGesture);
-        this.five.off('wantsTapGesture', this.wantsTapGesture);
-        this.five.needsRender = true;
-        this.hook.emit('selectedChange', []);
-        (_a = this.hammer) === null || _a === void 0 ? void 0 : _a.destroy();
-    }
-    highlightLine(line) {
-        if (line.selected)
-            return;
-        line.selected = true;
-        this.group.add(line.lightMesh);
-        line.distanceItem.highlight();
-        this.five.needsRender = true;
-    }
-    clearHighlightLines() {
-        if (this.group.children.length === 0)
-            return;
-        this.deleteDom.setLines([]).hide();
-        this.model.lines.forEach((line) => {
-            line.selected = false;
-            line.distanceItem.unHighlight();
-            this.group.remove(line.lightMesh);
-        });
-        this.highlightedLines = [];
-        this.five.needsRender = true;
-    }
-    highlightLines(lines) {
-        this.clearHighlightLines();
-        this.highlightedLines = lines;
-        this.deleteDom.setLines(lines).updatePosition().show();
-        lines.forEach((line) => this.highlightLine(line));
+        this.five.needsRender = !0, this.hook.emit(
+          "selectedChange",
+          this.editPointState.associatedLines.map((t) => t.toCompletelyJson())
+        );
+      }
+    });
+    s(this, "wantsPanGesture", () => {
+      if (this.editPointState)
+        return !1;
+    });
+    s(this, "wantsTapGesture", (e) => {
+      const [i] = this.five.model.intersectRaycaster(e);
+      if (!i)
+        return;
+      const t = this.five.camera, o = i.point.clone().project(t), c = this.container.clientWidth, r = this.container.clientHeight, l = new f(o.x * c, o.y * r), u = this.model.lines.map((n) => {
+        const [d, S] = n.points, m = d.position.clone().project(t), p = S.position.clone().project(t);
+        if (!L(m) && !L(p))
+          return null;
+        const k = new f(
+          m.x * c,
+          m.y * r
+        ), D = new f(
+          p.x * c,
+          p.y * r
+        );
+        return { id: n.id, points: [k, D] };
+      }).filter((n) => !!n);
+      if (u.length === 0)
+        return;
+      const g = u.map((n) => {
+        const d = T(l, n.points);
+        return { id: n.id, distance: d.distanceTo(l) };
+      }).sort((n, d) => n.distance - d.distance)[0];
+      if (g.distance > 20)
+        return;
+      const P = this.model.lines.find(({ id: n }) => n === g.id);
+      if (!!P)
+        return this.chooseLine(P), !1;
+    });
+    s(this, "chooseLine", (e) => {
+      const i = v(e);
+      this.highlightLines(i), this.five.needsRender = !0, this.hook.emit(
+        "selectedChange",
+        i.map((t) => t.toCompletelyJson())
+      );
+    });
+    s(this, "lineRemoved", (e) => {
+      this.removeLine(e), this.hook.emit(
+        "selectedChange",
+        this.model.lines.filter((i) => i.selected).map((i) => i.toCompletelyJson())
+      );
+    });
+    s(this, "onCameraUpdate", () => {
+      this.updateDistanceUI(), this.highlightedLines.length > 0 && this.deleteDom.updatePosition();
+    });
+    s(this, "deleteDomClickCallback", () => {
+      this.highlightedLines[0].getPolyline().lines.slice().reverse().forEach((i) => this.model.removeLine(i)), this.highlightedLines = [], this.deleteDom.setLines([]).hide();
+    });
+    s(this, "cancelDeleteClickCallback", () => {
+      this.clearHighlightLines();
+    });
+    this.deleteDom = new G(this.five, {
+      onClick: this.deleteDomClickCallback,
+      cancelDelete: this.cancelDeleteClickCallback
+    }).appendTo(this.container), this.model.lines.forEach((t) => {
+      t.distanceItem.appendTo(this.container), t.distanceItem.update(this.five), t.hook.on("selected", this.chooseLine), this.group.add(t.mesh);
+    });
+    const i = this.five.getElement();
+    if (i) {
+      this.fiveElement = i;
+      const t = new E(i);
+      this.hammer = t, t.on("pan", this.onPan), t.on("panstart", this.onPanStart), t.on("panend", this.onPanEnd);
     }
+    this.model.hook.on("lineRemoved", this.lineRemoved), this.five.on("cameraUpdate", this.onCameraUpdate), this.five.on("wantsTapGesture", this.wantsTapGesture), this.five.on("wantsPanGesture", this.wantsPanGesture), this.five.needsRender = !0;
+  }
+  dispose() {
+    var e;
+    super.dispose(), this.deleteDom.dispose(), this.model.hook.off("lineRemoved", this.lineRemoved), this.model.lines.forEach((i) => i.hook.off("selected", this.chooseLine)), this.five.off("cameraUpdate", this.onCameraUpdate), this.five.off("wantsPanGesture", this.wantsPanGesture), this.five.off("wantsTapGesture", this.wantsTapGesture), this.five.needsRender = !0, this.hook.emit("selectedChange", []), (e = this.hammer) == null || e.destroy();
+  }
+  highlightLine(e) {
+    e.selected || (e.selected = !0, this.group.add(e.lightMesh), e.distanceItem.highlight(), this.five.needsRender = !0);
+  }
+  clearHighlightLines() {
+    this.group.children.length !== 0 && (this.deleteDom.setLines([]).hide(), this.model.lines.forEach((e) => {
+      e.selected = !1, e.distanceItem.unHighlight(), this.group.remove(e.lightMesh);
+    }), this.highlightedLines = [], this.five.needsRender = !0);
+  }
+  highlightLines(e) {
+    this.clearHighlightLines(), this.highlightedLines = e, this.deleteDom.setLines(e).updatePosition().show(), e.forEach((i) => this.highlightLine(i));
+  }
 }
+export {
+  oe as default
+};

package/libs/PanoMeasurePlugin/Controller/index.d.ts

@@ -51,7 +51,7 @@ export default class MeasureController {
     /** 变更场景
      * @description 如果从编辑场景改变到观看场景，不会自动保存，默认丢弃所有改动
      */
-    changeMode: (mode: Mode) => Error;
+    changeMode: (mode: Mode) => Error | undefined;
     /** 撤销编辑 */
     revoke(): void;
     removeLineByID(lineID: string): void;