@realsee/dnalogel 2.3.7-3 → 2.3.7-5

package/libs/PanoMeasurePlugin/Modules/Magnifier.js

@@ -1,95 +1,139 @@
-var P = Object.defineProperty;
-var w = (a, t, e) => t in a ? P(a, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[t] = e;
-var i = (a, t, e) => (w(a, typeof t != "symbol" ? t + "" : t, e), e);
-import E from "hammerjs";
-import * as y from "three";
-import { Subscribe as b } from "@realsee/five";
-function g(a, t, e) {
-  const n = a[t];
-  a[t] = a[e], a[e] = n;
+var p = Object.defineProperty;
+var C = (r, t, e) => t in r ? p(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
+var n = (r, t, e) => (C(r, typeof t != "symbol" ? t + "" : t, e), e);
+import b from "hammerjs";
+import * as l from "three";
+import { Subscribe as w } from "@realsee/five";
+function d(r, t, e) {
+  const i = r[t], s = r[e];
+  i === void 0 || s === void 0 || (r[t] = s, r[e] = i);
 }
-function C(a, t, e) {
-  const n = e / 2;
-  for (let s = 1; s <= n; s++) {
+function R(r, t, e) {
+  const i = e / 2;
+  for (let s = 1; s <= i; s++) {
     const h = e - (s - 1);
-    for (let r = 1; r <= t; r++) {
-      const l = (s - 1) * t + r - 1, o = (h - 1) * t + r - 1;
-      g(a, l * 4 + 0, o * 4 + 0), g(a, l * 4 + 1, o * 4 + 1), g(a, l * 4 + 2, o * 4 + 2), g(a, l * 4 + 3, o * 4 + 3);
+    for (let a = 1; a <= t; a++) {
+      const o = (s - 1) * t + a - 1, f = (h - 1) * t + a - 1;
+      d(r, o * 4 + 0, f * 4 + 0), d(r, o * 4 + 1, f * 4 + 1), d(r, o * 4 + 2, f * 4 + 2), d(r, o * 4 + 3, f * 4 + 3);
     }
   }
 }
-class H {
+class S {
   constructor(t, e) {
-    i(this, "width");
-    i(this, "height");
-    i(this, "visible", !1);
-    i(this, "hooks", new b());
-    i(this, "contentDom", document.createElement("canvas"));
-    i(this, "five");
-    i(this, "scale");
-    i(this, "wrapper");
-    i(this, "config");
-    i(this, "offset", { x: 0, y: 0 });
-    i(this, "canvas", this.contentDom);
-    i(this, "context");
-    i(this, "renderCenter", new y.Vector3());
-    i(this, "lastPanEvent");
-    i(this, "hammer");
-    i(this, "onPan", (t) => {
-      var c, d, f, x;
-      if (!this.wrapper)
-        return;
-      const e = (d = (c = this.lastPanEvent) == null ? void 0 : c.deltaX) != null ? d : 0, n = (x = (f = this.lastPanEvent) == null ? void 0 : f.deltaY) != null ? x : 0, s = t.deltaX - e, h = t.deltaY - n;
-      if (this.lastPanEvent = t, this.hooks.emit("wantsPanGesture", { srcEvent: t, deltaX: s, deltaY: h }))
+    n(this, "width");
+    n(this, "height");
+    n(this, "containerDom");
+    n(this, "hooks", new w());
+    n(this, "canvas", document.createElement("canvas"));
+    n(this, "five");
+    n(this, "scale");
+    n(this, "config");
+    n(this, "offset", { x: 0, y: 0 });
+    n(this, "context");
+    n(this, "renderCenter", new l.Vector3());
+    n(this, "hammer");
+    n(this, "state", { enabled: !1 });
+    n(this, "offsetRange");
+    n(this, "isPanning", !1);
+    n(this, "onPanstart", () => {
+      this.isPanning = !0, this.canvas.style.boxShadow = "0 2px 30px 0 rgba(0,0,0,0.20)";
+    });
+    n(this, "onPan", (t) => {
+      if (!this.isPanning || !this.offsetRange || this.hooks.emit("wantsPanGesture", t))
         return;
-      const l = this.offset.x + s, o = this.offset.y + h;
-      this.contentDom.style.boxShadow = "0 2px 30px 0 rgba(0,0,0,0.20)", this.canvas.style.transform = `translate3d(${l}px, ${o}px, 100px)`, this.offset = { x: l, y: o };
+      const { translateX: i, translateY: s } = this.getPanOffset(t, this.offsetRange);
+      this.canvas.style.transform = `translate3d(${i}px, ${s}px, 100px)`;
     });
-    i(this, "onPanEnd", (t) => {
-      this.lastPanEvent = void 0, this.contentDom.style.boxShadow = "none";
+    n(this, "onPanend", (t) => {
+      if (this.isPanning = !1, this.canvas.style.boxShadow = "none", !this.offsetRange)
+        return;
+      const { translateX: e, translateY: i } = this.getPanOffset(t, this.offsetRange);
+      this.canvas.style.transform = `translate3d(${e}px, ${i}px, 100px)`, this.offset = { x: e, y: i };
     });
-    var s, h, r;
+    var s, h, a;
     if (!t.renderer)
       throw new Error("Five Render \u672A\u521D\u59CB\u5316");
-    this.five = t, this.scale = (s = e == null ? void 0 : e.scale) != null ? s : 2, this.width = (h = e == null ? void 0 : e.width) != null ? h : 190, this.height = (r = e == null ? void 0 : e.height) != null ? r : 190, this.config = {
+    this.five = t, this.scale = (s = e == null ? void 0 : e.scale) != null ? s : 2, this.width = (h = e == null ? void 0 : e.width) != null ? h : 190, this.height = (a = e == null ? void 0 : e.height) != null ? a : 190, this.config = {
       dragEnabled: (e == null ? void 0 : e.dragEnabled) || !1,
       autoFixPCPosition: (e == null ? void 0 : e.autoFixPCPosition) || !1,
       initialPosition: (e == null ? void 0 : e.initialPosition) || { left: "0", top: "0" }
     };
-    const n = this.canvas.getContext("2d");
-    if (!n)
+    const i = this.canvas.getContext("2d");
+    if (!i)
       throw new Error("CANNOT CREATE CONTEXT2D");
-    this.context = n, this.config.dragEnabled && (this.hammer = new E(this.canvas), this.hammer.on("pan", this.onPan), this.hammer.on("panend", this.onPanEnd));
+    this.context = i, this.config.dragEnabled && (this.hammer = new b(this.canvas), this.hammer.on("pan", this.onPan), this.hammer.on("panstart", this.onPanstart), this.hammer.on("panend", this.onPanend)), this.initStyle();
   }
   dispose() {
     var t;
-    this.clear(), this.remove(), (t = this.hammer) == null || t.destroy();
+    this.clear(), this.disable(), (t = this.hammer) == null || t.destroy();
   }
-  remove() {
-    this.canvas.remove(), this.visible = !1;
+  enable() {
+    if (!this.state.enabled)
+      return this.state.enabled = !0, this.containerDom && this._appendTo(this.containerDom), this;
   }
-  clear() {
-    this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
+  disable() {
+    if (!!this.state.enabled)
+      return this.state.enabled = !1, this.canvas.remove(), this;
   }
   appendTo(t) {
-    this.wrapper = t, this.initStyle(), t.append(this.canvas), this.visible = !0;
+    return this.containerDom = t, this.state.enabled && this._appendTo(t), this;
+  }
+  clear() {
+    return this.context.clearRect(0, 0, this.canvas.width, this.canvas.height), this;
   }
   renderWithPoint(t) {
-    !this.wrapper || (this.renderCenter = t, this.render(), this.config.autoFixPCPosition && this.autoFixPCPosition());
+    !this.containerDom || !this.state.enabled || (this.renderCenter = t, this.render(), this.config.autoFixPCPosition && this.autoFixPCPosition());
+  }
+  renderWithScreenPoint(t) {
+    !this.containerDom || !this.state.enabled || (this.renderCenter = t, this.render(), this.config.autoFixPCPosition && this.autoFixPCPosition());
+  }
+  resetOffset() {
+    this.offset = { x: 0, y: 0 }, this.canvas.style.transform = `translate3d(${0}px, ${0}px, 100px)`;
+  }
+  getCurrentState() {
+    return { enabled: this.state.enabled };
+  }
+  getRenderCenter() {
+    return this.renderCenter;
+  }
+  _appendTo(t) {
+    if (this.resetOffset(), t.appendChild(this.canvas), !this.offsetRange) {
+      const e = this.canvas.getBoundingClientRect(), i = t.getBoundingClientRect(), s = i.right - e.right, h = i.bottom - e.bottom, a = i.left - e.left, o = i.top - e.top;
+      this.offsetRange = {
+        min: { x: a, y: o },
+        max: { x: s, y: h }
+      };
+    }
   }
   autoFixPCPosition() {
-    if (!this.wrapper)
+    if (!this.containerDom)
       return;
-    const { width: t, height: e } = this, n = this.renderCenter.clone().project(this.five.camera), s = (n.x + 1) / 2 * this.wrapper.clientWidth, h = -(n.x - 1) / 2 * this.wrapper.clientWidth, r = -(n.y - 1) / 2 * this.wrapper.clientHeight;
-    s < 183 ? (this.canvas.style.top = -e / 2 + "px", this.canvas.style.left = 90 + "px") : r < 183 ? (this.canvas.style.top = 90 + "px", this.canvas.style.left = -t / 2 + "px") : h < 183 ? (this.canvas.style.top = -e / 2 + "px", this.canvas.style.left = -t - 90 + "px") : (this.canvas.style.left = -t / 2 + "px", this.canvas.style.top = -e - 90 + "px"), this.canvas.style.transform = `translate3d(${s}px, ${r}px, 10px)`, this.offset = { x: s, y: r };
+    const { width: t, height: e } = this, [i, s, h] = (() => {
+      if (this.renderCenter instanceof l.Vector3) {
+        const a = this.renderCenter.clone().project(this.five.camera);
+        return [
+          (a.x + 1) / 2 * this.containerDom.clientWidth,
+          -(a.x - 1) / 2 * this.containerDom.clientWidth,
+          -(a.y - 1) / 2 * this.containerDom.clientHeight
+        ];
+      } else
+        return [this.renderCenter.x, this.containerDom.clientWidth - this.renderCenter.x, this.renderCenter.y];
+    })();
+    i < 183 ? (this.canvas.style.top = -e / 2 + "px", this.canvas.style.left = 90 + "px") : h < 183 ? (this.canvas.style.top = 90 + "px", this.canvas.style.left = -t / 2 + "px") : s < 183 ? (this.canvas.style.top = -e / 2 + "px", this.canvas.style.left = -t - 90 + "px") : (this.canvas.style.left = -t / 2 + "px", this.canvas.style.top = -e - 90 + "px"), this.canvas.style.transform = `translate3d(${i}px, ${h}px, 10px)`, this.offset = { x: i, y: h };
   }
   render() {
-    if (!this.five.renderer || !this.wrapper)
+    if (!this.five.renderer || !this.containerDom)
       return;
-    const { scale: t, context: e, width: n, height: s } = this, h = this.renderCenter.clone().project(this.five.camera), r = this.five.renderer.getSize(new y.Vector2()), l = 1, o = n / t, c = s / t, d = l * t, f = (h.x + 1) / 2 * r.x, x = (h.y + 1) / 2 * r.y, v = this.five.getPixels(f - o / 2, x - o / 2, o, c, d), p = Math.floor(n * l), m = Math.floor(s * l);
-    C(v, p, m);
-    const u = new ImageData(p, m);
-    u.data.set(v), e.putImageData(u, 0, 0);
+    const { scale: t, context: e, width: i, height: s } = this, h = this.five.renderer.getSize(new l.Vector2()), [a, o] = (() => {
+      if (this.renderCenter instanceof l.Vector3) {
+        const y = this.renderCenter.clone().project(this.five.camera);
+        return [(y.x + 1) / 2 * h.x, (y.y + 1) / 2 * h.y];
+      } else
+        return [this.renderCenter.x, h.y - this.renderCenter.y];
+    })(), f = 1, c = i / t, x = s / t, P = f * t, g = this.five.getPixels(a - c / 2, o - c / 2, c, x, P), m = Math.floor(i * f), u = Math.floor(s * f);
+    R(g, m, u);
+    const v = new ImageData(m, u);
+    v.data.set(g), e.putImageData(v, 0, 0);
   }
   initStyle() {
     const t = this.canvas;
@@ -97,7 +141,14 @@ class H {
     const e = 1;
     t.setAttribute("width", (this.width * e).toString()), t.setAttribute("height", (this.height * e).toString()), t.style.border = "2px solid rgba(255,255,255,0.20)", t.style.width = this.width + "px", t.style.height = this.height + "px", t.style.top = this.config.initialPosition.top, t.style.left = this.config.initialPosition.left, t.style.transform = "translate(0,0,100px)", this.config.dragEnabled && (this.canvas.style.cursor = "pointer");
   }
+  getPanOffset(t, e) {
+    const {
+      min: { x: i, y: s },
+      max: { x: h, y: a }
+    } = e, o = this.offset.x + t.deltaX, f = this.offset.y + t.deltaY, c = Math.min(Math.max(o, i), h), x = Math.min(Math.max(f, s), a);
+    return { translateX: c, translateY: x };
+  }
 }
 export {
-  H as Magnifier
+  S as Magnifier
 };

package/libs/PanoMeasurePlugin/Modules/UIController/mobileMainBtnController.js

@@ -3,7 +3,7 @@ var r = (i, t, e) => t in i ? _(i, t, { enumerable: !0, configurable: !0, writab
 var n = (i, t, e) => (r(i, typeof t != "symbol" ? t + "" : t, e), e);
 import { mainIconStyle as l, mainItemStyle as o } from "./style.js";
 import "three";
-class f {
+class p {
   constructor(t, e, s) {
     n(this, "container");
     n(this, "measureController");
@@ -21,7 +21,7 @@ class f {
     this._params = s, this._btnTexts = {
       start: (a = this._params.startButtonText) != null ? a : this._btnTexts.start,
       end: (m = this._params.endButtonText) != null ? m : this._btnTexts.end
-    }, this.measureController = t, this.container = e, this.mainElement = this.getMainElement(), Object.assign(this.mainElement.mainIcon.style, l), Object.assign(this.mainElement.mainItem.style, o), this.change2Add(), this.mainElement.mainItem.addEventListener("click", this.onClick);
+    }, this.measureController = t, this.container = e, this.mainElement = this.getMainElement(), this.mainElement.mainIcon.setAttribute("style", "-webkit-tap-highlight-color: rgba(0,0,0,0);"), Object.assign(this.mainElement.mainIcon.style, l), Object.assign(this.mainElement.mainItem.style, o), this.change2Add(), this.mainElement.mainItem.addEventListener("click", this.onClick);
   }
   dispose() {
     this.mainElement.mainItem.removeEventListener("click", this.onClick);
@@ -50,5 +50,5 @@ class f {
   }
 }
 export {
-  f as MobileMainBtnController
+  p as MobileMainBtnController
 };

package/libs/PanoMeasurePlugin/index.js

@@ -14,9 +14,6 @@ import "./utils/ironbox.js";
 import "./utils/getIntersectionFromEvent.js";
 import "./utils/getPointFromHammerEvent.js";
 import "./Controller/ViewController.js";
-import "./utils/math.js";
-import "./utils/isNDCPointInScreen.js";
-import "./utils/findAssociatedLines.js";
 import "@realsee/five/line";
 import "./utils/constants.js";
 import "@realsee/five";
@@ -25,8 +22,11 @@ import "./Modules/DeleteDom/index.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 "./utils/isNDCPointInScreen.js";
+import "./utils/math.js";
 import "./utils/findClosestPoint.js";
 import "./utils/ndc2Screen.js";
+import "./utils/findAssociatedLines.js";
 import "./Controller/MixedController.js";
 import "./Modules/rangePiece/index.js";
 import "@tweenjs/tween.js";

package/libs/PanoMeasurePlugin/utils/distanceDom.js

@@ -5,7 +5,10 @@ import "./constants.js";
 import "@realsee/five";
 function j() {
   const t = document.createElement("div");
-  return t.setAttribute("style", "backdrop-filter: blur(4px);-webkit-backdrop-filter: blur(4px);"), t.style.width = "max-content", t.style.padding = "3px 6px", t.style.lineHeight = "1", t.style.textAlign = "center", t.style.transform = "translate(-50%, -50%)", t.style.borderRadius = "100px", t.style.fontSize = "14px", t.style.color = "#fff", t.style.background = "rgba(195,195,195,0.70)", t.style.border = "0.5px solid rgba(255,255,255,0.6)", t.style.cursor = "pointer", t;
+  return t.setAttribute(
+    "style",
+    "backdrop-filter: blur(4px);-webkit-backdrop-filter: blur(4px);-webkit-tap-highlight-color: rgba(0,0,0,0);"
+  ), t.style.width = "max-content", t.style.padding = "3px 6px", t.style.lineHeight = "1", t.style.textAlign = "center", t.style.transform = "translate(-50%, -50%)", t.style.borderRadius = "100px", t.style.fontSize = "14px", t.style.color = "#fff", t.style.background = "rgba(195,195,195,0.70)", t.style.border = "0.5px solid rgba(255,255,255,0.6)", t.style.cursor = "pointer", t;
 }
 function V(t) {
   const e = document.createElement("div");
@@ -19,8 +22,8 @@ function J(t) {
     update: H,
     appendTo: I,
     remove: T,
-    highlight: F,
-    unHighlight: w,
+    highlight: w,
+    unHighlight: F,
     getCurrentContent: P,
     setItemSelectable: A
   };
@@ -29,12 +32,12 @@ function J(t) {
     var i;
     (i = t.clickCallback) == null || i.call(t, E);
   }
-  function F() {
+  function w() {
     if (o)
       return o.highlight();
     r.style.border = "0.5px solid #95AEFF", r.style.background = "linear-gradient(90deg, #95AEFF 0%, #6386FF 100%)";
   }
-  function w() {
+  function F() {
     if (o)
       return o.unHighlight();
     r.style.border = "0.5px solid rgba(255,255,255,0.6)", r.style.background = "rgba(195,195,195,0.70)";
@@ -47,15 +50,15 @@ function J(t) {
     const f = i.getElement();
     if (!f)
       return;
-    const u = f.clientWidth, l = f.clientHeight, m = u / 2, a = l / 2;
+    const u = f.clientWidth, l = f.clientHeight, p = u / 2, a = l / 2;
     if (s.points.length < 2)
       return;
-    const [p, d] = s.points, c = p.position.clone().project(i.camera), y = d.position.clone().project(i.camera), g = c.clone().lerp(y, 0.5), h = new D(c.x * m, c.y * a), b = new D(y.x * m, y.y * a), k = h.distanceTo(b);
-    if ((() => !(Math.abs(c.z) > 1 || Math.abs(y.z) > 1 || !x(c) && !x(y) || !x(g) || k === 0))() === !1) {
+    const [g, d] = s.points, c = g.position.clone().project(i.camera), y = d.position.clone().project(i.camera), m = c.clone().lerp(y, 0.5), h = new D(c.x * p, c.y * a), b = new D(y.x * p, y.y * a), k = h.distanceTo(b);
+    if ((() => !(Math.abs(c.z) > 1 || Math.abs(y.z) > 1 || !x(c) && !x(y) || !x(m) || k === 0))() === !1) {
       n.style.opacity = "0", n.style.pointerEvents = "none";
       return;
     }
-    const L = (g.x + 1) / 2 * u, M = -(g.y - 1) / 2 * l, W = -(Math.atan((h.y - b.y) / (h.x - b.x)) * 180) / Math.PI, $ = n.parentElement && r.clientWidth > k ? -20 : 0;
+    const L = (m.x + 1) / 2 * u, M = -(m.y - 1) / 2 * l, W = -(Math.atan((h.y - b.y) / (h.x - b.x)) * 180) / Math.PI, $ = n.parentElement && r.clientWidth > k ? -20 : 0;
     n.style.transform = `translate(${L}px, ${M}px) rotate(${W}deg) translateY(${$}px)`, n.style.opacity = "1", n.style.pointerEvents = e ? "all" : "none", o && o.update({ line: s, polyline: s.getPolyline() });
     const z = P();
     r.innerText = z;
@@ -67,10 +70,10 @@ function J(t) {
     r.removeEventListener("click", v), n.remove();
   }
   function P() {
-    var p, d, c;
+    var g, d, c;
     if (s.points.length < 2)
       return "";
-    const [i, f] = s.points, u = i.position.clone().distanceTo(f.position), l = (p = t.line.text) != null ? p : t.line.model.config.defaultText, m = (c = (d = t.line.model.config) == null ? void 0 : d.getDistanceText) == null ? void 0 : c.call(d, u), a = l != null ? l : m;
+    const [i, f] = s.points, u = i.position.clone().distanceTo(f.position), l = (g = t.line.text) != null ? g : t.line.model.config.defaultText, p = (c = (d = t.line.model.config) == null ? void 0 : d.getDistanceText) == null ? void 0 : c.call(d, u), a = l != null ? l : p;
     return a != null ? a : u.toFixed(2) + "m";
   }
   function A(i) {

package/libs/index.js

@@ -152,17 +152,17 @@ import "./PanoMeasurePlugin/utils/ironbox.js";
 import "./PanoMeasurePlugin/utils/getIntersectionFromEvent.js";
 import "./PanoMeasurePlugin/utils/getPointFromHammerEvent.js";
 import "./PanoMeasurePlugin/Controller/ViewController.js";
-import "./PanoMeasurePlugin/utils/math.js";
-import "./PanoMeasurePlugin/utils/isNDCPointInScreen.js";
-import "./PanoMeasurePlugin/utils/findAssociatedLines.js";
 import "./PanoMeasurePlugin/utils/constants.js";
 import "./PanoMeasurePlugin/Controller/WatchController.js";
 import "./PanoMeasurePlugin/Modules/DeleteDom/index.js";
 import "./PanoMeasurePlugin/Modules/DeleteDom/_Assets/delete.svg.js";
 import "./PanoMeasurePlugin/Modules/DeleteDom/_Assets/delete_bg.png.js";
 import "./PanoMeasurePlugin/Modules/DeleteDom/_Assets/delete_hover_bg.png.js";
+import "./PanoMeasurePlugin/utils/isNDCPointInScreen.js";
+import "./PanoMeasurePlugin/utils/math.js";
 import "./PanoMeasurePlugin/utils/findClosestPoint.js";
 import "./PanoMeasurePlugin/utils/ndc2Screen.js";
+import "./PanoMeasurePlugin/utils/findAssociatedLines.js";
 import "./PanoMeasurePlugin/Controller/MixedController.js";
 import "./PanoMeasurePlugin/Modules/rangePiece/index.js";
 import "./PanoMeasurePlugin/Modules/rangePiece/html.js";

package/package.json

@@ -7,7 +7,7 @@
   "repository": "https://github.com/realsee-developer/dnalogel.git",
   "description": "如视 VR 看房插件合集",
   "private": false,
-  "version": "2.3.7-3",
+  "version": "2.3.7-5",
   "license": "SEE LICENSE IN TERMS.txt",
   "scripts": {
     "clean": "rm -rf components dist docs libs types ./vite.config.js.timestamp*",