@realsee/dnalogel 2.21.0-dev.5 → 2.21.0-dev.7

package/libs/PanoMeasurePlugin/Controller/EditController.js

@@ -1,15 +1,13 @@
-var g = Object.defineProperty;
-var y = (h, r, t) => r in h ? g(h, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : h[r] = t;
-var o = (h, r, t) => (y(h, typeof r != "symbol" ? r + "" : r, t), t);
-import C from "hammerjs";
+var y = Object.defineProperty;
+var C = (p, a, t) => a in p ? y(p, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : p[a] = t;
+var s = (p, a, t) => (C(p, typeof a != "symbol" ? a + "" : a, t), t);
 import k from "../Model/line.js";
 import c from "../Model/point.js";
-import { throttle as L } from "../../shared-utils/throttle.js";
-import I from "./BaseController.js";
-import { getIntersectionFromEvent as f } from "../utils/getIntersectionFromEvent.js";
-import { Polyline as u } from "../Model/polyline.js";
-import v from "../Model/area.js";
-import P from "../utils/isIntersecting.js";
+import { throttle as S } from "../../shared-utils/throttle.js";
+import L from "./BaseController.js";
+import { Polyline as f } from "../Model/polyline.js";
+import u from "../Model/area.js";
+import v from "../utils/isIntersecting.js";
 import { PointSelector as A } from "../../shared-utils/three/PointSelector.js";
 import "../../shared-utils/uuid.js";
 import "../utils/line.js";
@@ -22,7 +20,6 @@ import "../utils/dom/base.js";
 import "../utils/isNDCPointInScreen.js";
 import "../../shared-utils/removeArrayItem.js";
 import "../utils/ironbox.js";
-import "../utils/getPointFromHammerEvent.js";
 import "../Model/polygon.js";
 import "../../shared-utils/three/IObject3D.js";
 import "../utils/generatePolygonGeometry.js";
@@ -32,6 +29,7 @@ import "../utils/geometryUtil.js";
 import "../../shared-utils/three/centerPoint.js";
 import "../../shared-utils/three/PointSelectorHelper.js";
 import "../../shared-utils/three/Magnifier.js";
+import "hammerjs";
 import "../../shared-utils/three/getIntersect.js";
 import "../../shared-utils/three/PointHelper.js";
 import "../../shared-utils/three/Assets/index.js";
@@ -54,45 +52,48 @@ import "../../CSS3DRenderPlugin/utils/three/CSS3DScene.js";
 import "../../CSS3DRenderPlugin/utils/three/CSS3DGroup.js";
 import "../../CSS3DRenderPlugin/utils/waitFiveModelLoaded.js";
 import "../../CSS3DRenderPlugin/utils/generateBehindFiveElement.js";
-import "../../shared-utils/isAbsoluteURL.js";
+import "../../shared-utils/absoluteUrl.js";
 import "../../shared-utils/animationFrame/BetterTween.js";
 import "../../shared-utils/animationFrame/index.js";
 import "../../shared-utils/isTouchDevice.js";
-class we extends I {
+import "../../shared-utils/getIntersectionFromEvent.js";
+import "../../shared-utils/getPointFromHammerEvent.js";
+const l = () => !1;
+class Ee extends L {
   constructor(t) {
-    var s;
+    var e;
     super(t);
-    o(this, "type", "edit");
-    o(this, "polyline");
-    o(this, "area");
-    /** 拖动的控制点 */
-    o(this, "pressPoint");
-    o(this, "hasAppendDashed", !1);
-    o(this, "fiveElement");
+    s(this, "type", "edit");
+    s(this, "polyline");
+    s(this, "area");
+    s(this, "hasAppendDashed", !1);
+    s(this, "fiveElement");
     /** 上一个端点位置 */
-    o(this, "lastPoint", null);
-    o(this, "hammer");
-    o(this, "pointSelector");
+    s(this, "lastPoint", null);
+    s(this, "pointSelector");
     /** 根据 intersection 更新放大镜和吸附点 */
-    o(this, "onIntersectionUpdate", L((t) => {
-      var s;
-      const e = t.point;
-      (s = this.pressPoint) == null || s.position.copy(e), this.updateDashed(), this.five.needsRender = !0;
-    }, 20));
+    s(this, "onIntersectionUpdate", S(() => this.updateDashed(), 20));
     /** 撤销编辑 */
-    o(this, "revoke", () => {
+    s(this, "revoke", () => {
       this.currentMeasureType === "area" ? this.revokeArea() : this.currentMeasureType === "line" && this.revokeLine();
     });
     /**
      * @description: 测面积的撤销功能
      */
-    o(this, "revokeArea", () => {
-      this.area.points.length !== 0 && (this.revokeLine(this.area.polyline), this.area.points.pop(), this.area.refresh(), this.five.needsRender = !0);
+    s(this, "revokeArea", () => {
+      if (this.area.points.length !== 0) {
+        if (this.area.popPoint(), this.area.points.length === 0) {
+          this.lastPoint = null, this.hasAppendDashed = !1, this.dashed.remove(), this.five.needsRender = !0, this.hook.emit("revoke", { isEmpty: !0 });
+          return;
+        } else
+          this.lastPoint = new c(this.area.points[this.area.points.length - 1]), this.updateDashed();
+        this.five.needsRender = !0;
+      }
     });
     /**
      * @description: 测距的撤销功能
      */
-    o(this, "revokeLine", (t) => {
+    s(this, "revokeLine", (t) => {
       const e = t || this.polyline;
       if (e.lines.length === 0 && this.lastPoint) {
         this.lastPoint = null, this.hasAppendDashed = !1, this.dashed.remove(), this.hook.emit("anchorChange", null), this.hook.emit("editedDashedLineChange", null), this.five.needsRender = !0;
@@ -100,140 +101,171 @@ class we extends I {
       }
       if (e.lines.length === 0 && !this.lastPoint || !this.lastPoint)
         return;
-      const s = e.lines[e.lines.length - 1], i = s.findAnotherPoint(this.lastPoint);
-      i && (this.lastPoint = i, this.hook.emit("anchorChange", i.position), this.group.remove(s.mesh), e.removeLine(s), s.distanceItem.remove(), this.updateDashed(), this.five.needsRender = !0);
+      const i = e.lines[e.lines.length - 1], o = i.findAnotherPoint(this.lastPoint);
+      o && (this.lastPoint = o, this.hook.emit("anchorChange", o.position), this.group.remove(i.mesh), e.removeLine(i), i.distanceItem.remove(), this.updateDashed(), this.five.needsRender = !0);
     });
-    o(this, "onMouseLeave", () => {
-      this.lastPoint && (this.pointSelector.position.point.copy(this.lastPoint.position), this.updateDashed()), this.area.hideArea();
+    // private wantsTapGesture = (raycaster): false => {
+    //   if (this.editParams.pointSelectorMode === 'cursor') return false // 鼠标选点的话点击动作为选点，所有没有下面的点击删除动作
+    //   // =================================    这是选择面的逻辑      =================================
+    //   const intersections = this.model.areas
+    //     .map((area) => raycaster.intersectObject(area.polygon, true)[0]) // 获取所有的交点
+    //     .sort((a, b) => a.distance - b.distance) // 按照距离排序
+    //   const intersectionObject = intersections[0]?.object.parent
+    //   if (intersectionObject.isPolygonMesh) {
+    //     const area = this.model.areas.find((area) => area.polygon === intersectionObject)
+    //     if (area) {
+    //       const { x, y } = intersections[0].point.clone().project(this.five.camera)
+    //       const left = `${((x + 1) / 2) * 100}%`
+    //       const top = `${((-y + 1) / 2) * 100}%`
+    //       this.chooseArea(area, { left, top })
+    //     }
+    //   }
+    //   return false
+    //   // // ================================= 这后面是之前的选择线的逻辑 =================================
+    //   // 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
+    //   //   .getAllLines()
+    //   //   .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) as { id: string; points: Vector2[] }[]
+    //   // 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.getAllLines().find(({ id }) => id === closestScreenLine.id)
+    //   // if (!closestLine) return
+    //   // this.chooseLine(closestLine)
+    //   // return false
+    // }
+    s(this, "onMouseLeave", () => {
+      var t;
+      this.lastPoint && ((t = this.pointSelector.position) == null || t.point.copy(this.lastPoint.position), this.updateDashed()), this.area.hideArea();
     });
     /** 编辑线条发生改变时通知外部 */
-    o(this, "onLineChanged", () => {
+    s(this, "onLineChanged", () => {
       this.hook.emit("editedPolylineChange", this.polyline);
     });
-    o(this, "onPress", (t) => {
-      const [e] = f(this.five, t);
-      if (!(e != null && e.face))
-        return;
-      const s = new c(e.point);
-      this.pressPoint = s, this.onIntersectionUpdate(e);
-    });
-    /**
-     * 1. 如果之前没有长按行为「即没有长按点时」-> 滑动全景
-     * 2. 如果有长按点，把长按点位置更新为当前位置
-     */
-    o(this, "onPan", (t) => {
-      if (!this.pressPoint)
-        return;
-      const [e] = f(this.five, t);
-      e != null && e.face && this.onIntersectionUpdate(e);
-    });
-    o(this, "onPanEnd", () => {
-      this.pressPoint && this.onTap();
-    });
     /**
      * 1. 如果存在上一个点，需要绘制当前点到上一个点的连线
      * 2. 把上一个点的位置更新为当前点的位置
      * 3. 清除 pointSelector
      */
-    o(this, "onTap", () => {
-      var i, a, d, l;
+    s(this, "onSelect", () => {
+      var o, h, d, m;
       this.hasAppendDashed || (this.dashed.distanceItem.appendTo(this.container), this.group.add(this.dashed.mesh), this.currentMeasureType === "area" && this.group.add(this.perpendicularDashed.mesh)), this.hasAppendDashed = !0;
       const t = (() => {
+        var n, r;
         if (this.currentMeasureType === "area")
-          return this.area.projectPoint(this.pointSelector.position.point);
+          return this.area.projectPoint((n = this.pointSelector.position) == null ? void 0 : n.point);
         if (this.currentMeasureType === "line")
-          return this.pointSelector.position.point;
+          return (r = this.pointSelector.position) == null ? void 0 : r.point;
       })();
       if (!t)
         return;
-      const e = new c(t), s = this.lastPoint;
+      const e = new c(t), i = this.lastPoint;
       if (this.lastPoint = e, this.currentMeasureType === "line") {
-        if (e && s) {
-          const p = new k(s, e, this.model);
-          p.distanceItem.setCanSelect(!1), p.distanceItem.appendTo(this.container), this.polyline.addLine(p), this.group.add(p.mesh), p.distanceItem.update(this.five);
+        if (e && i) {
+          const r = new k(i, e, this.model);
+          r.distanceItem.setCanSelect(!1), r.distanceItem.appendTo(this.container), this.polyline.addLine(r), this.group.add(r.mesh), r.distanceItem.update(this.five);
         }
-        const n = (a = (i = this.editParams) == null ? void 0 : i.autoEndConfig) == null ? void 0 : a.line;
-        typeof n == "number" && (this.polyline.getPointLength() >= n ? (this.hook.emit("complete"), this.polyline = new u({ model: this.model }), this.model.addPolyline(this.polyline), this.lastPoint = void 0) : this.polyline.getPointLength() === n - 1 && this.hook.emit("readyComplete"));
+        const n = (h = (o = this.editParams) == null ? void 0 : o.autoEndConfig) == null ? void 0 : h.line;
+        typeof n == "number" && (this.polyline.getPointLength() >= n ? this.complete() : this.polyline.getPointLength() === n - 1 && this.hook.emit("readyComplete"));
       } else if (this.currentMeasureType === "area") {
         this.area.addPoints(e.position);
-        const n = (l = (d = this.editParams) == null ? void 0 : d.autoEndConfig) == null ? void 0 : l.area;
-        typeof n == "number" && (this.area.points.length >= n ? (this.hook.emit("complete"), this.area = new v(void 0, {
-          five: this.five,
-          model: this.model,
-          meshContainer: this.group,
-          domContainer: this.container
-        }), this.model.addArea(this.area), this.lastPoint = void 0) : this.area.points.length === n - 1 && this.hook.emit("readyComplete"));
+        const n = (m = (d = this.editParams) == null ? void 0 : d.autoEndConfig) == null ? void 0 : m.area;
+        typeof n == "number" && (this.area.points.length >= n ? this.complete() : this.area.points.length === n - 1 && this.hook.emit("readyComplete"));
       }
-      this.pressPoint = void 0, this.updateDashed(), this.five.needsRender = !0, this.hook.emit("anchorChange", e.position);
+      this.updateDashed(), this.five.needsRender = !0, this.hook.emit("anchorChange", e.position);
     });
-    /** 存在长按点时不能移动全景 */
-    o(this, "onWantsPanGesture", () => this.pressPoint ? !1 : void 0);
     /** 移动全景时更新 distanceItem 在屏幕上的位置 */
-    o(this, "onCameraUpdate", () => {
+    s(this, "onCameraUpdate", () => {
       this.updateDistanceUI();
     });
     /** 更新虚线 */
-    o(this, "updateDashed", () => {
+    s(this, "updateDashed", () => {
+      var i;
       if (!this.lastPoint)
         return;
       const t = this.lastPoint.position, e = (() => {
+        var o, h;
         if (this.currentMeasureType === "area")
-          return this.area.projectPoint(this.pointSelector.position.point);
+          return this.area.projectPoint((o = this.pointSelector.position) == null ? void 0 : o.point);
         if (this.currentMeasureType === "line")
-          return this.pointSelector.position.point;
+          return (h = this.pointSelector.position) == null ? void 0 : h.point;
       })();
-      if (this.dashed.setPoints(t, e), this.dashed.distanceItem.update(this.five), this.hook.emit("editedDashedLineChange", this.dashed), this.currentMeasureType === "area") {
-        this.area.areaItem.setCanSelect(!1);
-        const s = this.pointSelector.position.point;
-        if (this.area.points.length >= 2) {
-          const d = this.area.polyline.lines.map((m) => ({ start: m.points[0].position, end: m.points[1].position })), l = P({ start: t, end: e }, d), n = P({ start: e, end: this.area.points[0] }, d);
-          if (l || n)
+      if (this.dashed.setPoints(t, e), this.dashed.distanceItem.update(this.five), this.hook.emit("editedDashedLineChange", this.dashed), this.currentMeasureType === "area")
+        if (this.area.areaItem.setCanSelect(!1), this.area.points.length >= 2) {
+          const o = this.area.polyline.lines.map((n) => ({ start: n.points[0].position, end: n.points[1].position })), h = v({ start: t, end: e }, o), d = v({ start: e, end: this.area.points[0] }, o);
+          if (h || d)
             this.area.hideArea(), this.hook.emit("allowAddPointStateChange", "forbid");
           else {
             this.area.showArea();
-            const m = [...this.area.points, e];
-            this.area.polygon.updatePoints(m), this.area.areaItem.updateArea(this.five), this.hook.emit("allowAddPointStateChange", "allow");
+            const n = [...this.area.points, e];
+            this.area.polygon.updatePoints(n), this.area.areaItem.updateArea(this.five);
+            const r = (i = this.pointSelector.position) == null ? void 0 : i.point;
+            if (!r) {
+              this.perpendicularDashed.hide();
+              return;
+            }
+            const g = r, P = e;
+            this.perpendicularDashed.setPoints(g, P), this.perpendicularDashed.show(), this.hook.emit("allowAddPointStateChange", "allow");
           }
         } else
-          this.area.hideArea();
-        const i = s, a = e;
-        this.perpendicularDashed.setPoints(i, a), this.perpendicularDashed.distanceItem.update(this.five);
-      }
+          this.area.hideArea(), this.perpendicularDashed.hide();
+      this.five.needsRender = !0;
     });
     this.pointSelector = new A(this.five, {
       mode: this.editParams.pointSelectorMode,
       pointSelectorHelperParams: { magnifierParams: this.magnifierParams }
-    }), this.pointSelector.enable(), this.polyline = new u({ model: this.model }), this.area = new v(void 0, {
+    }), this.pointSelector.enable(), this.polyline = new f({ model: this.model }), this.area = new u(void 0, {
       five: this.five,
       model: this.model,
       meshContainer: this.group,
       domContainer: this.container
     }), this.model.addPolyline(this.polyline), this.model.addArea(this.area), this.model.getAllLines().forEach((i) => {
-      i.distanceItem.appendTo(this.container), i.distanceItem.update(this.five), this.group.add(i.mesh);
+      i.distanceItem.appendTo(this.container), i.distanceItem.update(this.five), i.distanceItem.setCanSelect(!0), this.group.add(i.mesh);
     }), this.model.getAllAreas().forEach((i) => {
-      i.areaItem.appendTo(this.container), i.areaItem.updateDomPosition(this.five), i.areaItem.setCanSelect(!0), this.group.add(i.polygon), i.polyline.lines.forEach((a) => {
-        a.distanceItem.appendTo(this.container), a.distanceItem.update(this.five), this.group.add(a.mesh);
+      i.areaItem.appendTo(this.container), i.areaItem.updateDomPosition(this.five), i.areaItem.setCanSelect(!0), this.group.add(i.polygon), i.polyline.lines.forEach((o) => {
+        o.distanceItem.appendTo(this.container), o.distanceItem.update(this.five), this.group.add(o.mesh);
       });
-    }), this.five.on("cameraUpdate", this.onCameraUpdate), this.pointSelector.hook.on("intersectionUpdate", this.onIntersectionUpdate), this.polyline.hook.on("lineAdded", this.onLineChanged), this.polyline.hook.on("lineRemoved", this.onLineChanged);
-    const e = this.five.getElement();
-    if (e) {
-      this.fiveElement = e;
-      const i = new C(e);
-      this.hammer = i, i.on("tap", this.onTap), i.on("pan", this.onPan), i.on("press", this.onPress), i.on("panend", this.onPanEnd);
-    }
-    this.five.helperVisible = !1, (s = this.fiveElement) == null || s.addEventListener("mouseleave", this.onMouseLeave), this.hook.emit("anchorChange", null), this.hook.emit("editedDashedLineChange", null), this.five.refresh();
+    }), this.five.on("cameraUpdate", this.onCameraUpdate), this.five.on("wantsTapGesture", l), this.five.on("wantsToMoveToPano", l), this.pointSelector.hook.on("intersectionUpdate", this.onIntersectionUpdate), this.pointSelector.hook.on("select", this.onSelect), this.polyline.hook.on("lineAdded", this.onLineChanged), this.polyline.hook.on("lineRemoved", this.onLineChanged), this.five.helperVisible = !1, (e = this.fiveElement) == null || e.addEventListener("mouseleave", this.onMouseLeave), this.hook.emit("anchorChange", null), this.hook.emit("editedDashedLineChange", null), this.five.refresh();
   }
   dispose() {
-    var t, e;
-    super.dispose(), this.five.helperVisible = !0, this.pointSelector.disable(), this.dashed.remove(), this.perpendicularDashed.remove(), this.five.off("cameraUpdate", this.onCameraUpdate), this.pointSelector.hook.off("intersectionUpdate", this.onIntersectionUpdate), this.polyline.hook.off("lineAdded", this.onLineChanged), this.polyline.hook.off("lineRemoved", this.onLineChanged), (t = this.hammer) == null || t.destroy(), (e = this.fiveElement) == null || e.removeEventListener("mouseleave", this.onMouseLeave), this.magnifier.dispose(), this.dashed.distanceItem.remove(), this.five.needsRender = !0;
+    var t;
+    super.dispose(), this.model.areas.forEach((e) => {
+      (e.points.length < 2 || e.polygon.isBlank) && this.model.removeArea(e);
+    }), this.five.helperVisible = !0, this.pointSelector.disable(), this.dashed.remove(), this.perpendicularDashed.remove(), this.five.off("cameraUpdate", this.onCameraUpdate), this.five.off("wantsTapGesture", l), this.five.off("wantsToMoveToPano", l), this.pointSelector.hook.off("intersectionUpdate", this.onIntersectionUpdate), this.pointSelector.hook.off("select", this.onSelect), this.polyline.hook.off("lineAdded", this.onLineChanged), this.polyline.hook.off("lineRemoved", this.onLineChanged), (t = this.fiveElement) == null || t.removeEventListener("mouseleave", this.onMouseLeave), this.magnifier.dispose(), this.dashed.distanceItem.remove(), this.five.needsRender = !0;
   }
   getEditingLines() {
     return this.polyline.lines;
   }
   selectPoint() {
-    this.onTap();
+    this.onSelect();
+  }
+  complete() {
+    this.hook.emit("complete"), this.currentMeasureType === "area" ? (this.area = new u(void 0, { five: this.five, model: this.model, meshContainer: this.group, domContainer: this.container }), this.model.addArea(this.area)) : this.currentMeasureType === "line" && (this.polyline = new f({ model: this.model }), this.model.addPolyline(this.polyline)), this.lastPoint = void 0;
   }
 }
 export {
-  we as default
+  Ee as default
 };

package/libs/PanoMeasurePlugin/Controller/WatchController.js

@@ -9,7 +9,7 @@ import { Raycaster as T, Vector2 as u } from "three";
 import { closestPointOnLine as U } from "../utils/math.js";
 import { findClosestPoint as b } from "../utils/findClosestPoint.js";
 import { findAssociatedLines as D } from "../utils/findAssociatedLines.js";
-import { getPointFromHammerEvent as w } from "../utils/getPointFromHammerEvent.js";
+import { getPointFromHammerEvent as w } from "../../shared-utils/getPointFromHammerEvent.js";
 import j from "../Model/area.js";
 import x from "../Model/polygon.js";
 import "../Modules/DeleteDom/_Assets/delete.svg.js";

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

@@ -12,6 +12,7 @@ import { type UIControllerParams } from '../Modules/UIController';
 import { type GuideControllerParams } from '../Modules/GuideController';
 import { Magnifier } from '../../shared-utils';
 import type { MagnifierParameter } from '../../shared-utils';
+import type Area from '../Model/area';
 export type Mode = 'Watch' | 'Edit' | 'Mixed' | 'View';
 export interface PanoMeasureParameterType extends Partial<Config> {
     editParams?: EditParameter;
@@ -75,6 +76,7 @@ export default class MeasureController {
     /** 撤销编辑 */
     revoke(): void;
     removePolyline(polyline: Polyline): void;
+    removeArea(area: Area): void;
     removePolylineByID(id: string): void;
     getPolylineByID(id: string): Polyline;
     getEditedPolyline(): void;
@@ -96,6 +98,7 @@ export default class MeasureController {
     /** 导出数据 */
     toJson(): PluginData;
     /**
+     * @deprecated 暂不支持
      * @description 改变插件的模式（pc端模式或移动端模式）
      * @param isMobile true为移动端模式，false为pc端
      */