@realsee/dnalogel 2.28.1 → 2.28.3

package/dist/index.js

@@ -39,7 +39,7 @@ import cl from "animejs";
 import { GLTFLoader as Ff } from "@realsee/five/gltf-loader";
 function _f() {
   console.debug(
-    "%c %c@realsee/dnalogel %cv2.28.1",
+    "%c %c@realsee/dnalogel %cv2.28.3",
     [
       "background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAMCAMAAACHgmeRAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAABLFBMVEUAAAAapPoap/oaqvkbrfkbr/gZnfwZoPsaqfnD4v/E4/8Ylv0clPm93/+/4P/B4f8Yj/683/8Wif+33P8Uhv+x2f8ShP+s1v8Pgf+n0/8Nf/+h0f8Lff8Lff8Nf/9dl/+czv8KfP8KfP+Lxf+Uyv+Xy/+Hwv+Jw/+Mxf+Oxv+RyP8aovsapfoap/oZmfwZm/wZnvsYnPsYkf4YlP0NePsDYfgYcfi43f+63v8Xiv8Xjf4EWfwCV/sWZ/qz2v+02/8Vh/8WiP8EUf8CTf4WXv2u1/+v2P8Thf8Thv8ETf8CR/8VV/+o1f+q1f8Qgv8Rg/8DSv8BRf8UVP+j0v+k0v8OgP8Pgf8DR/8DQv9Nhf+dzv+fz/+Kv/+Vyv+Xy/+azf+Oxv+Qx/+SyP////8MUhLdAAAAK3RSTlMACEWQ2bd98uQECPXxqO7c+Pb49vj2+Pb49vj23Oul8fMHA+TwerXXjEIG2P+bHgAAAAFiS0dEY1y+LaoAAAB+SURBVAjXY2BgZGJmYWVgYGBgY9fW0eVg4ORi4NbTNzDk4eXjZxAwMjYxNTO3EGQQsrSytrG1sxdmEHFwdHJ2cXUTZRBz9/D08vbxFWeQ8PMPCAwKDpFkkAoNC4+IjIqWZpCRlZOPiY2LV2BQVGJQTkhMUlEFWaOmrqGpxQAAyg0S9Dq+VPYAAAAASUVORK5CYII=')",
       "background-repeat: no-repeat",
@@ -6849,7 +6849,7 @@ let ps = class {
     /**
      * @realsee/dnalogel 版本号
      */
-    f(this, "VERSION", "2.28.1");
+    f(this, "VERSION", "2.28.3");
     f(this, "five");
     /**
      * 插件事件钩子
@@ -32196,11 +32196,16 @@ class lE {
     f(this, "tagTransform", { left: 0, top: 0 });
     /** 标注标签的显示层级 */
     f(this, "tagZIndex", 0);
+    /** 标注实例的事件处理器 */
     f(this, "hooks", new Ri());
     /** Plugin 实例 */
     f(this, "plugin");
     /** 标注透明度动画 */
     f(this, "opacityAnime");
+    /** 是否在容器 resize 动画中 */
+    f(this, "isInContainerResizeAnimation", !1);
+    /** 监听容器 resize 的计时器 id，用于判断 resize 过程是否结束 */
+    f(this, "containerResizeTimeoutID", null);
     /** 显示标注 */
     // public show() {
     // return this.doOpacityAnime({
@@ -32243,6 +32248,10 @@ class lE {
     f(this, "onPluginConfigChange", (t) => {
       this.makerObject.material.depthTest = t.config.modelDepthTest, this.outline.material.depthTest = t.config.modelDepthTest, this.plugin.five.needsRender = !0;
     });
+    /** 插件整体可见性变化时，需要更新自身可见性 */
+    f(this, "onPluginStateChange", () => {
+      this.updateVisible(), this.updateTagVisible();
+    });
     /** 更新标注可见性 */
     f(this, "updateVisible", () => {
       const { result: t, msg: e } = this.checkVisible();
@@ -32280,6 +32289,8 @@ class lE {
     f(this, "checkTagVisible", () => {
       if (!this.visible)
         return { result: !1, msg: "标注整体不可见" };
+      if (this.isInContainerResizeAnimation)
+        return { result: !1, msg: "处于容器 resize 动画中" };
       const e = this.plugin.five, i = new P.Raycaster(), s = e.camera.position.clone();
       i.set(s.clone(), this.tagPosition.clone().sub(s).normalize());
       const [o] = e.model.intersectRaycaster(i), r = this.tagPosition.distanceTo(e.camera.position);
@@ -32292,6 +32303,14 @@ class lE {
     f(this, "onFiveCameraUpdate", () => {
       this.tagApp && this.visible && (this.updateTagNDCPosition(), this.updateTagDomTransform(), this.updateTagVisible());
     });
+    /** tag container DOM 发生 resize */
+    f(this, "onContainerResize", () => {
+      this.isInContainerResizeAnimation === !1 && (this.isInContainerResizeAnimation = !0, this.updateTag());
+      const e = () => {
+        this.isInContainerResizeAnimation = !1, this.containerResizeTimeoutID = null, this.updateTag();
+      };
+      this.containerResizeTimeoutID && clearTimeout(this.containerResizeTimeoutID), this.containerResizeTimeoutID = setTimeout(e, 100);
+    });
     var l, c, d;
     const i = e.object_data, s = i.bottom_y, o = i.height, r = new P.Color((l = i.color) != null ? l : "#FFFFFF"), a = (c = i.opacity) != null ? c : 0.4;
     this.id = e.id, this.name = (d = e.name) != null ? d : "", this.plugin = t, this.height = o, this.bottomY = s, this.opacity = a, this.shape = new P.Shape().fromJSON(i.shape), this.floorIndex = e.floor_index, this.makerObject = new P.Mesh(wh(this.shape, o), cE(r, a)), Jr(this.makerObject, s), this.makerObject.material.depthTest = this.plugin.config.modelDepthTest, this.outline = new Fh(
@@ -32310,12 +32329,12 @@ class lE {
       };
       this.tagApp = new rE({ target: e, props: i }), this.updateTag();
     }
-    this.plugin.five.needsRender = !0, this.plugin.hooks.on("configChange", this.onPluginConfigChange), this.plugin.hooks.on("stateChange", this.updateVisible), this.plugin.five.on("modeChange", this.updateVisible), this.plugin.five.on("modelShownFloorChange", this.updateVisible), this.plugin.five.on("cameraUpdate", this.onFiveCameraUpdate);
+    this.plugin.five.needsRender = !0, this.plugin.hooks.on("stateChange", this.onPluginStateChange), this.plugin.hooks.on("configChange", this.onPluginConfigChange), this.plugin.five.on("modeChange", this.updateVisible), this.plugin.five.on("modelShownFloorChange", this.updateVisible), this.plugin.five.on("cameraUpdate", this.onFiveCameraUpdate), this.plugin.resizeIframe.contentWindow.addEventListener("resize", this.onContainerResize);
   }
   /** 卸载标注 */
   unmount() {
     var t;
-    this.mounted = !1, this.modelGroup.remove(...this.modelGroup.children), (t = this.tagApp) == null || t.$destroy(), this.tagApp = null, this.plugin.hooks.off("configChange", this.onPluginConfigChange), this.plugin.hooks.off("stateChange", this.updateVisible), this.plugin.five.off("modeChange", this.updateVisible), this.plugin.five.off("modelShownFloorChange", this.updateVisible), this.plugin.five.off("cameraUpdate", this.onFiveCameraUpdate);
+    this.mounted = !1, this.modelGroup.remove(...this.modelGroup.children), (t = this.tagApp) == null || t.$destroy(), this.tagApp = null, this.plugin.hooks.off("stateChange", this.onPluginStateChange), this.plugin.hooks.off("configChange", this.onPluginConfigChange), this.plugin.five.off("modeChange", this.updateVisible), this.plugin.five.off("modelShownFloorChange", this.updateVisible), this.plugin.five.off("cameraUpdate", this.onFiveCameraUpdate), this.plugin.resizeIframe.contentWindow.removeEventListener("resize", this.onContainerResize);
   }
   /** 更改标注透明度
    * @param opacity 标注透明度，范围：0-1
@@ -32391,6 +32410,8 @@ class dE extends si {
     f(this, "data");
     /** tag 容器 */
     f(this, "tagDomContainer");
+    /** 用于监听容器尺寸变化的 iframe */
+    f(this, "resizeIframe");
     /** 查询问题使用的调试对象 */
     f(this, "checkMsg", {
       childrenMountedState: ""
@@ -32449,7 +32470,7 @@ class dE extends si {
       }))
         return !1;
     });
-    this.five = e, this.tagDomContainer = document.createElement("div"), this.tagDomContainer.style.position = "absolute", this.tagDomContainer.style.top = "0", this.tagDomContainer.style.left = "0", this.tagDomContainer.style.width = "100%", this.tagDomContainer.style.height = "100%", this.tagDomContainer.style.pointerEvents = "none";
+    this.five = e, this.tagDomContainer = document.createElement("div"), this.tagDomContainer.style.position = "absolute", this.tagDomContainer.style.top = "0", this.tagDomContainer.style.left = "0", this.tagDomContainer.style.width = "100%", this.tagDomContainer.style.height = "100%", this.tagDomContainer.style.pointerEvents = "none", this.resizeIframe = document.createElement("iframe"), this.resizeIframe.style.position = "absolute", this.resizeIframe.style.top = "0", this.resizeIframe.style.left = "0", this.resizeIframe.style.width = "100%", this.resizeIframe.style.height = "100%", this.resizeIframe.style.border = "none", this.resizeIframe.style.pointerEvents = "none", this.resizeIframe.style.zIndex = "-1", this.tagDomContainer.appendChild(this.resizeIframe);
     const s = {
       enabled: !0,
       visible: !0
@@ -32628,10 +32649,10 @@ class dE extends si {
     this.state = V(V({}, this.state), e), this.hooks.emit("stateChange", { state: this.state, prevState: s, userAction: i });
   }
   _enable(e) {
-    this.hooks.emit("enable", { userAction: e.userAction }), this.five.scene.add(this.modelGroup), this.five.needsRender = !0, this.five.on("wantsTapGesture", this.onWantsFiveTapGesture), this.five.on("initAnimationWillStart", this.onFiveInitAnimationWillStart), this.five.on("initAnimationEnded", this.onFiveInitAnimationEnded), this.five.on("modeChange", this.onFiveModeChange), this.five.on("cameraUpdate", this.onFiveCameraUpdate);
+    this.hooks.emit("enable", { userAction: e.userAction }), this.five.scene.add(this.modelGroup), this.updateChildrenMountedState(), this.five.needsRender = !0, this.five.on("wantsTapGesture", this.onWantsFiveTapGesture), this.five.on("initAnimationWillStart", this.onFiveInitAnimationWillStart), this.five.on("initAnimationEnded", this.onFiveInitAnimationEnded), this.five.on("modeChange", this.onFiveModeChange), this.five.on("cameraUpdate", this.onFiveCameraUpdate);
   }
   _disable(e) {
-    this.hooks.emit("disable", { userAction: e.userAction }), this.five.scene.remove(this.modelGroup), this.five.needsRender = !0, this.five.off("wantsTapGesture", this.onWantsFiveTapGesture), this.five.off("initAnimationWillStart", this.onFiveInitAnimationWillStart), this.five.off("initAnimationEnded", this.onFiveInitAnimationEnded), this.five.off("modeChange", this.onFiveModeChange), this.five.off("cameraUpdate", this.onFiveCameraUpdate);
+    this.hooks.emit("disable", { userAction: e.userAction }), this.five.scene.remove(this.modelGroup), this.updateChildrenMountedState(), this.five.needsRender = !0, this.five.off("wantsTapGesture", this.onWantsFiveTapGesture), this.five.off("initAnimationWillStart", this.onFiveInitAnimationWillStart), this.five.off("initAnimationEnded", this.onFiveInitAnimationEnded), this.five.off("modeChange", this.onFiveModeChange), this.five.off("cameraUpdate", this.onFiveCameraUpdate);
   }
   _show(e) {
     return H(this, null, function* () {
@@ -32644,7 +32665,7 @@ class dE extends si {
     });
   }
 }
-const Tk = (n) => new dE(n);
+const Tk = (n, t) => new dE(n, t);
 Wf();
 _f();
 export {