@realsee/dnalogel 2.6.7-dev.0 → 2.6.7-dev.10

package/libs/PanoTagPlugin/controller/index.js

@@ -1,56 +1,53 @@
-var x = Object.defineProperty, G = Object.defineProperties;
-var V = Object.getOwnPropertyDescriptors;
-var E = Object.getOwnPropertySymbols;
+var B = Object.defineProperty, x = Object.defineProperties;
+var G = Object.getOwnPropertyDescriptors;
+var R = Object.getOwnPropertySymbols;
 var N = Object.prototype.hasOwnProperty, W = Object.prototype.propertyIsEnumerable;
-var D = (h, a, e) => a in h ? x(h, a, { enumerable: !0, configurable: !0, writable: !0, value: e }) : h[a] = e, p = (h, a) => {
-  for (var e in a || (a = {}))
-    N.call(a, e) && D(h, e, a[e]);
-  if (E)
-    for (var e of E(a))
-      W.call(a, e) && D(h, e, a[e]);
+var P = (h, d, e) => d in h ? B(h, d, { enumerable: !0, configurable: !0, writable: !0, value: e }) : h[d] = e, p = (h, d) => {
+  for (var e in d || (d = {}))
+    N.call(d, e) && P(h, e, d[e]);
+  if (R)
+    for (var e of R(d))
+      W.call(d, e) && P(h, e, d[e]);
   return h;
-}, f = (h, a) => G(h, V(a));
-var d = (h, a, e) => (D(h, typeof a != "symbol" ? a + "" : a, e), e);
-var c = (h, a, e) => new Promise((t, i) => {
+}, v = (h, d) => x(h, G(d));
+var l = (h, d, e) => (P(h, typeof d != "symbol" ? d + "" : d, e), e);
+var c = (h, d, e) => new Promise((t, i) => {
   var s = (r) => {
     try {
       n(e.next(r));
-    } catch (l) {
-      i(l);
+    } catch (a) {
+      i(a);
     }
   }, o = (r) => {
     try {
       n(e.throw(r));
-    } catch (l) {
-      i(l);
+    } catch (a) {
+      i(a);
     }
   }, n = (r) => r.done ? t(r.value) : Promise.resolve(r.value).then(s, o);
-  n((e = e.apply(h, a)).next());
+  n((e = e.apply(h, d)).next());
 });
 import { Subscribe as z } from "@realsee/five";
-import { Group as R, Vector3 as T, Matrix4 as C, Quaternion as _ } from "three";
-import m from "object-assign-deep";
+import { Group as E, Vector3 as A, Matrix4 as S, Quaternion as _ } from "three";
+import b from "object-assign-deep";
 import { writable as $ } from "../../vendor/svelte/store/index.js";
 import q from "../Components/TagContainer.js";
 import H from "../Components/Tag/index.js";
-import { arrayPositionToVector3 as v } from "../../CSS3DRenderPlugin/utils/positionToVector3.js";
-import { addDebugPoints as Q } from "../utils/addDebugPoints.js";
-import { planeNormal as O } from "../utils/planeNormal.js";
+import { arrayPositionToVector3 as C } from "../../CSS3DRenderPlugin/utils/positionToVector3.js";
+import { addDebugPoints as J } from "../utils/addDebugPoints.js";
+import { planeNormal as k } from "../utils/planeNormal.js";
 import "@realsee/five/gltf-loader";
-import { isMediaModelTag as u } from "../utils/tag/tagCheck.js";
-import { waitFiveModelLoaded as X } from "../utils/actionAfterFiveModelLoad.js";
-import { normalPositionToPositions as J } from "../utils/normalPositionToPositions.js";
-import { debounce as k } from "../utils/debounce.js";
+import { isMediaModelTag as m } from "../utils/tag/tagCheck.js";
+import { waitFiveModelLoaded as Q } from "../utils/actionAfterFiveModelLoad.js";
+import { normalPositionToPositions as X } from "../utils/normalPositionToPositions.js";
+import { debounce as j } from "../utils/debounce.js";
 import { throttle as K } from "../utils/throttle.js";
 import { resizeObserver as I } from "../utils/resizeObserver.js";
 import { TagComputer as Y } from "./TagComputer.js";
 import { CSS3DRenderPlugin as Z } from "../../CSS3DRenderPlugin/index.js";
 import ee from "../utils/tag/format.js";
-import { generateBlankAudio as L, AudioNamespace as U } from "../../shared-utils/audio.js";
+import { generateBlankAudio as U, AudioNamespace as L } from "../../shared-utils/audio.js";
 import { loadGLTF as te } from "../../shared-utils/three/GLTFLoader.js";
-import "../../CSS3DRenderPlugin/CSS3DRender.js";
-import "../../CSS3DRenderPlugin/utils/generateBehindFiveElement.js";
-import { getMediaModelPlanPositions as ie } from "../utils/tag/index.js";
 import "../../vendor/svelte/internal/index.js";
 import "../Components/TagItem.js";
 import "../utils/noTypecheck.js";
@@ -79,23 +76,40 @@ import "../Components/Common/Text/MText.js";
 import "../Components/Tag/ImageTextTag.js";
 import "../Components/Common/Line/Polyline.js";
 import "../Components/Common/Media.js";
-import "../../vendor/swiper/svelte/swiper.js";
-import "swiper";
-import "../../vendor/swiper/components-shared/get-params.js";
-import "../../vendor/swiper/components-shared/utils.js";
-import "../../vendor/swiper/components-shared/params-list.js";
-import "../../vendor/swiper/components-shared/mount-swiper.js";
-import "../../vendor/swiper/components-shared/get-changed-params.js";
-import "../../vendor/swiper/components-shared/update-swiper.js";
-import "../../vendor/swiper/svelte/swiper-slide.js";
-import "swiper/css";
-import "swiper/css/autoplay";
+import "../../vendor/svelte-carousel/src/components/Carousel/Carousel.js";
+import "../../vendor/svelte-carousel/src/components/Dots/Dots.js";
+import "../../vendor/svelte-carousel/src/components/Dot/Dot.js";
+import "../../vendor/svelte-carousel/src/components/Arrow/Arrow.js";
+import "../../vendor/svelte-carousel/src/direction.js";
+import "../../vendor/svelte-carousel/src/components/Progress/Progress.js";
+import "../../vendor/svelte-carousel/src/actions/swipeable/swipeable.js";
+import "../../vendor/svelte-carousel/src/actions/swipeable/event.js";
+import "../../vendor/svelte-carousel/src/utils/event.js";
+import "../../vendor/svelte-carousel/src/units.js";
+import "../../vendor/svelte-carousel/src/actions/hoverable/hoverable.js";
+import "../../vendor/svelte-carousel/src/actions/hoverable/event.js";
+import "../../vendor/svelte-carousel/src/actions/tappable/tappable.js";
+import "../../vendor/svelte-carousel/src/utils/math.js";
+import "../../vendor/svelte-carousel/src/actions/tappable/event.js";
+import "../../vendor/svelte-carousel/src/utils/page.js";
+import "../../vendor/svelte-carousel/src/utils/clones.js";
+import "../../vendor/svelte-carousel/src/utils/object.js";
+import "../../vendor/svelte-carousel/src/components/Carousel/createCarousel.js";
+import "../../vendor/simply-reactive/src/simply-reactive.js";
+import "lodash.get";
+import "lodash.clonedeep";
+import "../../vendor/simply-reactive/src/utils/subscription.js";
+import "../../vendor/simply-reactive/src/utils/object.js";
+import "lodash.isequal";
+import "../../vendor/simply-reactive/src/utils/watcher.js";
+import "../../vendor/svelte-carousel/src/utils/lazy.js";
+import "../../vendor/svelte-carousel/src/utils/ProgressManager.js";
+import "../../vendor/svelte-carousel/src/utils/interval.js";
 import "../Components/Common/MediaItem.js";
 import "../Components/Tag/MarketingTag.js";
 import "hammerjs";
 import "@tweenjs/tween.js";
-import "../../shared-utils/animationFrame/BetterTween.js";
-import "../../shared-utils/animationFrame/index.js";
+import "../../CSS3DRenderPlugin/CSS3DRender.js";
 import "../../CSS3DRenderPlugin/utils/three/CSS3DRenderer.js";
 import "three/examples/jsm/renderers/CSS3DRenderer";
 import "../../CSS3DRenderPlugin/utils/getAllCSS3DObject.js";
@@ -107,6 +121,9 @@ import "../../CSS3DRenderPlugin/utils/centerPoint.js";
 import "../../CSS3DRenderPlugin/utils/three/OpacityMesh.js";
 import "../../CSS3DRenderPlugin/utils/three/CSS3DScene.js";
 import "../../CSS3DRenderPlugin/utils/three/CSS3DGroup.js";
+import "../../CSS3DRenderPlugin/utils/generateBehindFiveElement.js";
+import "../../shared-utils/animationFrame/BetterTween.js";
+import "../../shared-utils/animationFrame/index.js";
 import "../Components/Tag/AudioTag/index.js";
 import "../Components/Tag/AudioTag/AudioTag.js";
 import "../Components/Common/Audio.js";
@@ -124,73 +141,74 @@ import "./TagCacheController.js";
 import "../../base/BasePlugin.js";
 import "../../CSS3DRenderPlugin/Controller.js";
 import "../../CSS3DRenderPlugin/utils/waitFiveModelLoaded.js";
-const j = "2.0.10", S = `DnalogelPlugin-PanoTagPlugin@${j}`, se = !1, Qt = (h) => `${S}--${h}`;
-class Xt extends Y {
+const V = "2.0.10", M = `DnalogelPlugin-PanoTagPlugin@${V}`, ie = !1, hi = (h) => `${M}--${h}`;
+class pi extends Y {
   constructor(e, t) {
     super(e);
-    d(this, "version", j);
-    d(this, "state", { enabled: !0, visible: !0 });
-    d(this, "params");
-    d(this, "debug");
-    d(this, "css3DRenderPlugin");
-    d(this, "TagContainerSvelte");
-    d(this, "temporaryState", { visible: !0 });
-    d(this, "mediaStore", $({
+    l(this, "version", V);
+    l(this, "state", { enabled: !0, visible: !0 });
+    l(this, "params");
+    l(this, "debug");
+    l(this, "css3DRenderPlugin");
+    l(this, "TagContainerSvelte");
+    l(this, "temporaryState", { visible: !0 });
+    l(this, "mediaStore", $({
       currentMediaElement: null
     }));
-    d(this, "group", new R());
-    d(this, "gltfObjectGroup", new R());
-    d(this, "isIOSWX", navigator.userAgent.toLowerCase().indexOf("micromessenger") !== -1 && navigator.userAgent.toLowerCase().indexOf("iphone") !== -1);
-    d(this, "store", {
+    l(this, "group", new E());
+    l(this, "gltfObjectGroup", new E());
+    l(this, "isIOSWX", navigator.userAgent.toLowerCase().indexOf("micromessenger") !== -1 && navigator.userAgent.toLowerCase().indexOf("iphone") !== -1);
+    l(this, "store", {
       disposers: [],
       disposed: !1,
       resizeObserverDisposerAdding: !1,
       css3DRenderDisposer: /* @__PURE__ */ new Map()
     });
-    d(this, "enabledModelTagSet", /* @__PURE__ */ new Set());
-    d(this, "changeTagModel", (e, t) => c(this, null, function* () {
-      e.data = m({}, e.data, t), yield this.loadModel(e), this.updateRenderAllTags();
+    l(this, "enabledModelTagSet", /* @__PURE__ */ new Set());
+    l(this, "changeTagModel", (e, t) => c(this, null, function* () {
+      e.data = b({}, e.data, t), yield this.loadModel(e), this.updateRenderAllTags();
     }));
-    d(this, "disposedErrorLog", () => {
-      console.error(`${S} is disposed`);
+    l(this, "disposedErrorLog", () => {
+      console.error(`${M} is disposed`);
     });
-    d(this, "handleFiveInitAnimationEnded", () => {
-      this.five.getCurrentState().mode === "Panorama" && this.tags.forEach((e) => {
-        e.temporaryState = f(p({}, e.temporaryState), { visible: !0 });
-      });
+    l(this, "handleFiveInitAnimationEnded", () => {
+      const e = this.five.getCurrentState().mode;
+      this.tags.forEach((t) => {
+        m(t) && e === "Panorama" && this.changeTagMode(t, "front"), t.state.visible = this.getVisible(t);
+      }), this.updateRenderAllTags(), this.updateRenderAllTags();
     });
-    d(this, "handleFiveModelShownFloorChange", () => {
+    l(this, "handleFiveModelShownFloorChange", () => {
       this.tags.forEach((e) => {
-        !u(e) || (e.state.visible = this.checkFloorIndex(e));
+        !m(e) || (e.state.visible = this.getVisible(e));
       }), this.updateRenderAllTags();
     });
-    d(this, "loadModel", (e) => c(this, null, function* () {
+    l(this, "loadModel", (e) => c(this, null, function* () {
       var r;
       const t = e.data.modelUrl;
-      if (console.log("\u{1F436} ==> url:", t), !t)
+      if (!t)
         return;
-      const i = te(t).then((l) => Object.assign(l.scene, { customID: e.id, isTagModel: !0 }));
+      const i = te(t).then((a) => Object.assign(a.scene, { customID: e.id, isTagModel: !0 }));
       e.model = { promise: i };
       const s = yield i;
       if (((r = e.model) == null ? void 0 : r.promise) !== i || (e.model.object = s, !this.tags.includes(e)))
         return;
-      s.visible = e.state.visible, new C().fromArray(e.matrix).decompose(s.position, s.quaternion, s.scale), this.checkFloorIndex(e) || (s.visible = !1);
-      const n = this.gltfObjectGroup.children.find((l) => l.customID === e.id);
+      s.visible = e.state.visible, new S().fromArray(e.matrix).decompose(s.position, s.quaternion, s.scale), s.updateWorldMatrix(!0, !0), this.getVisibleByFloorIndex(e) || (s.visible = !1);
+      const n = this.gltfObjectGroup.children.find((a) => a.customID === e.id);
       return n && this.gltfObjectGroup.remove(n), this.gltfObjectGroup.add(s), this.updateTagCss3DObjectMatrix(e, s), s;
     }));
-    this.group.name = "PanoTagPluginModelGroup", this.gltfObjectGroup.name = "PanoTagPluginGLTFObjectGroup", this.group.add(this.gltfObjectGroup), this.params = p({ debug: !1, config: this.config }, t), this.debug = this.params.debug, this.config = this.params.config, L(1, { namespace: U.GetAudioDuration }), L(1, { namespace: U.PlayAudio }), Object.assign(window, { [`__PANOTAGPLUGIN_DEBUG_${Date.now()}__`]: this }), Object.assign(window, { __PANOTAGPLUGIN_DEBUG__: this }), this.state.enabled && this.five.scene.add(this.group);
+    this.group.name = "PanoTagPluginModelGroup", this.gltfObjectGroup.name = "PanoTagPluginGLTFObjectGroup", this.group.add(this.gltfObjectGroup), this.params = p({ debug: !1, config: this.config }, t), this.debug = this.params.debug, this.config = this.params.config, U(1, { namespace: L.GetAudioDuration }), U(1, { namespace: L.PlayAudio }), Object.assign(window, { [`__PANOTAGPLUGIN_DEBUG_${Date.now()}__`]: this }), Object.assign(window, { __PANOTAGPLUGIN_DEBUG__: this }), this.state.enabled && this.five.scene.add(this.group);
   }
   load(e, t) {
     return c(this, null, function* () {
       var s, o;
-      this.clearTags(), console.log(S, " load:", { data: e }), this.config = m({}, this.config, {
+      this.clearTags(), console.info(M, " load:", { data: JSON.parse(JSON.stringify(e)) }), this.config = b({}, this.config, {
         globalConfig: (s = e.globalConfig) != null ? s : {},
         contentTypeConfig: (o = e.contentTypeConfig) != null ? o : {}
       });
       const i = yield this.addTag(e.tagList, t);
       if (this.debug)
         try {
-          Q(this.five, this.tags);
+          J(this.five, this.tags);
         } catch (n) {
           console.error(n);
         }
@@ -200,28 +218,28 @@ class Xt extends Y {
   addTag(e, t) {
     return c(this, null, function* () {
       const s = (Array.isArray(e) ? e : [e]).map((o) => {
-        const n = this.getTagConfig(o), r = f(p({}, o), {
-          state: p({ visible: void 0, unfolded: se }, n.initialState),
+        const n = this.getTagConfig(o), r = v(p({}, o), {
+          state: p({ visible: void 0, unfolded: ie }, n.initialState),
           hooks: new z(),
           clickable: n.clickable,
           mergedConfig: n
         });
-        return u(o) && (r.temporaryState = { visible: !1 }), r;
+        return m(o) && (r.temporaryState = { visible: !1 }), r;
       }).filter((o) => o.position);
-      return s.forEach(ee), this.tags.push(...s), X(this.five).then(() => {
+      return s.forEach(ee), this.tags.push(...s), Q(this.five).then(() => {
         var o, n, r;
-        return this.store.eventListenerDisposer && ((n = (o = this.store).eventListenerDisposer) == null || n.call(o)), this.state.enabled && (this.store.eventListenerDisposer = this.addEventListener()), this.addResizeListener(), this.checkPanelTag(), this.setVisibleAndUnfolded({ withAnimation: (r = t == null ? void 0 : t.withAnimation) != null ? r : !0 }).then(() => this.updateRenderAllTags()), this.updateRenderAllTags(), console.log("\u{1F436} ==> waitFiveModelLoaded:"), this.addMediaModelTag(s);
+        return this.store.eventListenerDisposer && ((n = (o = this.store).eventListenerDisposer) == null || n.call(o)), this.state.enabled && (this.store.eventListenerDisposer = this.addEventListener()), this.addResizeListener(), this.checkPanelTag(), this.setVisibleAndUnfolded({ withAnimation: (r = t == null ? void 0 : t.withAnimation) != null ? r : !0 }).then(() => this.updateRenderAllTags()), this.updateRenderAllTags(), this.addMediaModelTag(s);
       });
     });
   }
   changeConfig(e, t = !0) {
-    t ? this.config = m({}, this.config, e) : this.config = e, this.updateTagConfig({ force: !0 }), this.updateRenderAllTags();
+    t ? this.config = b({}, this.config, e) : this.config = e, this.updateTagConfig({ force: !0 }), this.updateRenderAllTags();
   }
   changeGlobalConfig(e, t = !0) {
-    t ? this.config.globalConfig = m({}, this.config.globalConfig, e) : this.config.globalConfig = e, this.updateTagConfig({ force: !0 }), this.updateRenderAllTags();
+    t ? this.config.globalConfig = b({}, this.config.globalConfig, e) : this.config.globalConfig = e, this.updateTagConfig({ force: !0 }), this.updateRenderAllTags();
   }
   clearTags() {
-    this.tags = [], this.clearCache(), this.disposeAllCSS3DContainer(), this.updateRenderAllTags();
+    this.tags = [], this.enabledModelTagSet.clear(), this.clearCache(), this.disposeAllCSS3DContainer(), this.updateRenderAllTags();
   }
   show(e) {
     return c(this, null, function* () {
@@ -254,8 +272,8 @@ class Xt extends Y {
   dispose() {
     var e, t, i, s, o, n;
     this.pauseCurrentMedia(), this.disposeAllCSS3DContainer(), (e = this.TagContainerSvelte) == null || e.$destroy(), this.filter3DTag().forEach((r) => {
-      var l;
-      return (l = r.tag3DContentSvelte) == null ? void 0 : l.svelteApp.$destroy();
+      var a;
+      return (a = r.tag3DContentSvelte) == null ? void 0 : a.svelteApp.$destroy();
     }), this.tags = [], (t = this.store.disposers) == null || t.forEach((r) => r == null ? void 0 : r()), this.store.disposers = [], this.store.disposed = !0, (s = (i = this.store).eventListenerDisposer) == null || s.call(i), this.store.eventListenerDisposer = void 0, (n = (o = this.store).resizeObserverDisposer) == null || n.call(o), this.store.resizeObserverDisposer = void 0, this.store.resizeObserverDisposerAdding = !1, this.five.scene.remove(this.group), this.group.remove(...this.group.children), this.gltfObjectGroup.remove(...this.gltfObjectGroup.children), this.clearCache(), this.five.needsRender = !0, this.hooks.emit("dispose");
   }
   setState(e, t) {
@@ -275,18 +293,18 @@ class Xt extends Y {
   }
   changeTagNormalById(e, t) {
     const i = this.getTagById(e);
-    !i || !i.tag3DContentSvelte || (i.tag3DContentSvelte.currentNormal = v(t), this.updateRenderPlaneTag());
+    !i || !i.tag3DContentSvelte || (i.tag3DContentSvelte.currentNormal = C(t), this.updateRenderPlaneTag());
   }
   changeDataById(e, t, i = !0) {
     const s = this.getTagById(e);
-    !s || (i ? s.data = m({}, s.data, t) : s.data = p(p({}, s.data), t), this.checkPanelTag(), this.updateRenderAllTags());
+    !s || (i ? s.data = b({}, s.data, t) : s.data = p(p({}, s.data), t), this.checkPanelTag(), this.updateRenderAllTags());
   }
   changeStickTypeById(e, t, i = !0) {
     this.changeTagById(e, t, i);
   }
   changeTagById(e, t, i = !0) {
     const s = this.getTagById(e);
-    !t || (i ? m(s, t) : Object.assign(s, t), (s == null ? void 0 : s.tag3DContentSvelte) && (t == null ? void 0 : t.normal) && (s.tag3DContentSvelte.currentNormal = v(t.normal)), this.updateRenderAllTags(), this.checkPanelTag());
+    !t || (i ? b(s, t) : Object.assign(s, t), (s == null ? void 0 : s.tag3DContentSvelte) && (t == null ? void 0 : t.normal) && (s.tag3DContentSvelte.currentNormal = C(t.normal)), this.updateRenderAllTags(), this.checkPanelTag());
   }
   destroyTagById(e) {
     (Array.isArray(e) ? e : [e]).forEach((i) => {
@@ -298,16 +316,25 @@ class Xt extends Y {
     this.mediaStore.set({ currentMediaElement: null });
   }
   updateTagCss3DObjectMatrix(e, t) {
-    var P, M, w, F;
-    const i = (w = (M = (P = e.mergedConfig) == null ? void 0 : P.tag3DConfig) == null ? void 0 : M.ratio) != null ? w : 216e-5, s = (F = e.tag3DContentSvelte) == null ? void 0 : F.domContainer.css3DObject;
+    var D, w, O, F;
+    const i = (O = (w = (D = e.mergedConfig) == null ? void 0 : D.tag3DConfig) == null ? void 0 : w.ratio) != null ? O : 216e-5, s = (F = e.tag3DContentSvelte) == null ? void 0 : F.domContainer.css3DObject;
     if (!s)
       return;
-    const o = u(e) ? e.data.mediaPosition : e.position;
+    const o = m(e) ? e.data.mediaPosition : e.position;
     t.updateWorldMatrix(!1, !1);
-    const n = t.matrixWorld, r = new T().fromArray(o[0]), l = new T().fromArray(o[2]), g = new T().lerpVectors(r, l, 0.5).add(new T(0, 0, 5e-4)), A = new C().setPosition(g), B = new C().makeScale(i, i, i), y = new C().multiply(n).multiply(A).multiply(B);
-    y.decompose(s.position, s.quaternion, s.scale);
-    const b = s.opacityMesh;
-    !b || y.decompose(b.position, b.quaternion, b.scale);
+    const n = t.matrixWorld, r = new A().fromArray(o[0]), a = new A().fromArray(o[2]), f = new A().lerpVectors(r, a, 0.5).add(new A(0, 0, 5e-4)), g = new S().setPosition(f), y = new S().makeScale(i, i, i), T = new S().multiply(n).multiply(g).multiply(y);
+    T.decompose(s.position, s.quaternion, s.scale);
+    const u = s.opacityMesh;
+    !u || T.decompose(u.position, u.quaternion, u.scale);
+  }
+  updateTagCss3DObjectVisible(e) {
+    var s, o, n, r, a;
+    const t = (s = e.tag3DContentSvelte) == null ? void 0 : s.domContainer.css3DObject;
+    if (!t)
+      return;
+    t.visible = (n = (o = e.state) == null ? void 0 : o.visible) != null ? n : !0;
+    const i = t.opacityMesh;
+    !i || (i.visible = (a = (r = e.state) == null ? void 0 : r.visible) != null ? a : !0);
   }
   setVisibleAndUnfolded() {
     return c(this, arguments, function* ({ withAnimation: e } = { withAnimation: !1 }) {
@@ -336,9 +363,9 @@ class Xt extends Y {
     });
   }
   addEventListener() {
-    const { five: e, hooks: t } = this, i = this.handleFiveWantsMoveToPano.bind(this), s = this.handleFiveModeChange.bind(this), o = this.handleFiveCameraUpdate.bind(this), n = this.handleFiveCameraUpdateDebounce(), r = this.handleFivePanoArrived.bind(this), l = this.loadVideoFirstFrame.bind(this), g = this.clickhandler.bind(this), A = this.five.currentMode;
-    return this.handleFiveModeChange(A), this.handleFivePanoArrived(), e.on("wantsMoveToPano", i), e.on("modeChange", s), e.on("initAnimationEnded", this.handleFiveInitAnimationEnded), e.on("modelShownFloorChange", this.handleFiveModelShownFloorChange), e.on("cameraUpdate", o), e.on("cameraUpdate", n), e.on("panoArrived", r), e.on("panoArrived", l), t.on("click", g), () => {
-      e.off("wantsMoveToPano", i), e.off("modeChange", s), e.off("initAnimationEnded", this.handleFiveInitAnimationEnded), e.off("modelShownFloorChange", this.handleFiveModelShownFloorChange), e.off("cameraUpdate", o), e.off("cameraUpdate", n), e.off("panoArrived", r), e.off("panoArrived", l), t.off("click", g), this.store.eventListenerDisposer = void 0;
+    const { five: e, hooks: t } = this, i = this.handleFiveWantsMoveToPano.bind(this), s = this.handleFiveModeChange.bind(this), o = this.handleFiveCameraUpdate.bind(this), n = this.handleFiveCameraUpdateDebounce(), r = this.handleFivePanoArrived.bind(this), a = this.loadVideoFirstFrame.bind(this), f = this.clickhandler.bind(this), g = this.five.currentMode;
+    return this.handleFiveModeChange(g), this.handleFivePanoArrived(), e.on("wantsMoveToPano", i), e.on("modeChange", s), e.on("initAnimationEnded", this.handleFiveInitAnimationEnded), e.on("modelShownFloorChange", this.handleFiveModelShownFloorChange), e.on("cameraUpdate", o), e.on("cameraUpdate", n), e.on("panoArrived", r), e.on("panoArrived", a), t.on("click", f), () => {
+      e.off("wantsMoveToPano", i), e.off("modeChange", s), e.off("initAnimationEnded", this.handleFiveInitAnimationEnded), e.off("modelShownFloorChange", this.handleFiveModelShownFloorChange), e.off("cameraUpdate", o), e.off("cameraUpdate", n), e.off("panoArrived", r), e.off("panoArrived", a), t.off("click", f), this.store.eventListenerDisposer = void 0;
     };
   }
   loadVideoFirstFrame() {
@@ -365,7 +392,7 @@ class Xt extends Y {
       }, 500),
       e
     ), { observe: n, unobserve: r } = I(
-      k(() => t(), 400),
+      j(() => t(), 400),
       e
     );
     return s(), n(), () => {
@@ -374,17 +401,13 @@ class Xt extends Y {
   }
   handleFiveModeChange(e) {
     this.tags.forEach((t) => {
-      if (u(t)) {
-        e !== "Panorama" && (t.mediaVisible = this.checkFloorIndex(t)), this.changeTagMode(t, e === "Panorama" ? "front" : "behind"), this.updateRenderAllTags();
-        return;
-      }
-      e !== "Panorama" && (t.temporaryState = f(p({}, t.temporaryState), { visible: !1 }));
-    }), this.updateRenderAllTags();
+      m(t) && e !== "Panorama" && this.changeTagMode(t, "behind"), t.state.visible = this.getVisible(t);
+    }), this.updateRenderAllTags(), this.updateRenderAllTags();
   }
   handleFiveWantsMoveToPano() {
     this.tags.forEach((e) => {
       const t = this.getTagConfig(e);
-      typeof t.visibleConfig == "object" && (t.visibleConfig.keep ? e.temporaryState = f(p({}, e.temporaryState), { visible: t.visibleConfig.keep === "visible" }) : e.temporaryState = f(p({}, e.temporaryState), { visible: Boolean(t.visibleConfig.alwaysShowWhenMovePano) }));
+      typeof t.visibleConfig == "object" && (t.visibleConfig.keep ? e.temporaryState = v(p({}, e.temporaryState), { visible: t.visibleConfig.keep === "visible" }) : e.temporaryState = v(p({}, e.temporaryState), { visible: Boolean(t.visibleConfig.alwaysShowWhenMovePano) }));
     }), this.updateTagContainerVisible();
   }
   temporaryShow({ withAnimation: e } = { withAnimation: !1 }) {
@@ -422,7 +445,7 @@ class Xt extends Y {
     });
   }
   handleFiveCameraUpdateDebounce() {
-    return k(() => {
+    return j(() => {
       this.setUnfoldedByCamera(), this.updateRenderAllTags();
     }, 100);
   }
@@ -432,7 +455,7 @@ class Xt extends Y {
   handleFivePanoArrived() {
     return c(this, null, function* () {
       yield this.setVisibleAndUnfolded(), this.setModelMedialVisibleByPanoIndex(), this.tags.forEach((e) => {
-        e.temporaryState = f(p({}, e.temporaryState), { visible: !0 });
+        e.temporaryState = v(p({}, e.temporaryState), { visible: !0 });
       }), this.store.visibleWithAnimation = !0, this.updateTagContainerVisible();
     });
   }
@@ -463,64 +486,62 @@ class Xt extends Y {
   }
   updateRenderPlaneTag() {
     this.sort([...this.filterPlaneTag(), ...this.filter3DPointTag(), ...this.filterModelTag()]).forEach((t) => {
-      var i;
+      var r, a, f;
       if (t.tag3DContentSvelte) {
-        const { svelteApp: s, domContainer: o, initialNormal: n, currentNormal: r } = t.tag3DContentSvelte;
-        if (s.$set({
+        const { svelteApp: g, domContainer: y, initialNormal: T, currentNormal: u } = t.tag3DContentSvelte;
+        if (this.updateTagCss3DObjectVisible(t), g.$set({
           tag: t,
           hooks: this.hooks,
           state: this.state,
           temporaryState: this.temporaryState
-        }), !n.equals(r)) {
-          const l = new _().setFromUnitVectors(n, r);
-          o.css3DObject.setRotationFromQuaternion(l);
+        }), !T.equals(u)) {
+          const D = new _().setFromUnitVectors(T, u);
+          y.css3DObject.setRotationFromQuaternion(D);
         }
-      } else {
-        if (((i = t.state) == null ? void 0 : i.visible) === !1)
-          return;
-        if (this.css3DRenderPlugin || (this.css3DRenderPlugin = Z(this.five)), t.stickType === "3DPoint" && !t.normal)
-          return console.error("updateRenderPlaneTag: \u4E09\u7EF4\u70B9\u6807\u7B7E\u7F3A\u5C11\u6CD5\u5411\u91CF\uFF01");
-        const s = (() => t.stickType === "Plane" ? t.position : t.stickType === "Model" && t.contentType === "MediaModel" ? ie(t) : J(
-          this.five.camera.position,
-          v(t.position),
-          v(t.normal)
-        ))();
-        if (!s)
-          return;
-        const o = function() {
-          if (t.normal)
-            return v(t.normal);
-          if (t.stickType === "Plane")
-            return O(t.position);
-          if (t.contentType === "MediaModel")
-            return O(s);
-        }();
-        if (!o)
-          return;
-        const n = this.getTagConfig(t).tag3DConfig, r = this.css3DRenderPlugin.create3DDomContainer(s, n);
-        if (!r)
-          return;
-        this.store.css3DRenderDisposer.set(t.id, r.dispose), t.tag3DContentSvelte = {
-          svelteApp: new H({
-            target: r.container,
-            props: {
-              tag: t,
-              hooks: this.hooks,
-              state: t.contentType === "MediaModel" ? f(p({}, this.state), { visible: !1 }) : this.state,
-              mediaStore: this.mediaStore,
-              temporaryState: this.temporaryState
-            }
-          }),
-          domContainer: r,
-          initialNormal: o,
-          currentNormal: o
-        };
+        return;
       }
+      if (((r = t.state) == null ? void 0 : r.visible) === !1)
+        return;
+      if (this.css3DRenderPlugin || (this.css3DRenderPlugin = Z(this.five)), t.stickType === "3DPoint" && !t.normal)
+        return console.error("updateRenderPlaneTag: \u4E09\u7EF4\u70B9\u6807\u7B7E\u7F3A\u5C11\u6CD5\u5411\u91CF\uFF01");
+      const i = (() => t.stickType === "Plane" ? t.position : m(t) ? t.data.mediaPosition : X(
+        this.five.camera.position,
+        C(t.position),
+        C(t.normal)
+      ))();
+      if (!i)
+        return;
+      const s = function() {
+        if (t.normal)
+          return C(t.normal);
+        if (t.stickType === "Plane")
+          return k(t.position);
+        if (t.contentType === "MediaModel")
+          return k(i);
+      }();
+      if (!s)
+        return;
+      const o = this.getTagConfig(t).tag3DConfig, n = this.css3DRenderPlugin.create3DDomContainer(i, o);
+      !n || (this.updateTagCss3DObjectVisible(t), this.store.css3DRenderDisposer.set(t.id, n.dispose), t.tag3DContentSvelte = {
+        svelteApp: new H({
+          target: n.container,
+          props: {
+            tag: t,
+            hooks: this.hooks,
+            state: t.contentType === "MediaModel" ? v(p({}, this.state), { visible: !1 }) : this.state,
+            mediaStore: this.mediaStore,
+            temporaryState: this.temporaryState
+          }
+        }),
+        domContainer: n,
+        initialNormal: s,
+        currentNormal: s
+      }, m(t) && ((a = t.model) == null ? void 0 : a.object) && this.updateTagCss3DObjectMatrix(t, (f = t.model) == null ? void 0 : f.object));
     }), this.checkPanelTag();
   }
   updateRenderModelTag() {
     const e = (i) => !this.enabledModelTagSet.has(i.customID);
-    this.gltfObjectGroup.remove(...this.gltfObjectGroup.children.filter(e)), this.tags.filter(u).forEach((i) => {
+    this.gltfObjectGroup.remove(...this.gltfObjectGroup.children.filter(e)), this.tags.filter(m).forEach((i) => {
       var s;
       (s = i.model) == null || s.promise.then((o) => {
         o.visible = i.state.visible;
@@ -544,13 +565,17 @@ class Xt extends Y {
   }
   addMediaModelTag(e) {
     return c(this, null, function* () {
-      const t = e.filter(u).map(this.loadModel);
+      const t = e.filter(m).map(this.loadModel);
       yield Promise.all(t), this.five.getCurrentState().mode === "Panorama" && this.setModelMedialVisibleByPanoIndex(), this.updateRenderAllTags();
     });
   }
+  changeTagMode(e, t) {
+    var i, s, o, n, r;
+    ((o = (s = (i = e.tag3DContentSvelte) == null ? void 0 : i.domContainer) == null ? void 0 : s.css3DObject) == null ? void 0 : o.mode) !== t && ((n = e.config) != null && n.tag3DConfig ? e.config.tag3DConfig.mode = t : e.config ? e.config.tag3DConfig = { mode: t } : e.config = { tag3DConfig: { mode: t } }, (r = this.store.css3DRenderDisposer.get(e.id)) == null || r(), e.tag3DContentSvelte = void 0);
+  }
 }
 export {
-  Xt as PanoTagPluginController,
-  Xt as default,
-  Qt as pluginFlag
+  pi as PanoTagPluginController,
+  pi as default,
+  hi as pluginFlag
 };