@realsee/dnalogel 3.20.0-dev.2 → 3.20.1

package/libs/PanoTagPlugin/controller/TagRender.js

@@ -1,16 +1,16 @@
-var k = Object.defineProperty;
+var A = Object.defineProperty;
 var R = Object.getOwnPropertySymbols;
-var V = Object.prototype.hasOwnProperty, I = Object.prototype.propertyIsEnumerable;
-var C = (c, l, t) => l in c ? k(c, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : c[l] = t, j = (c, l) => {
-  for (var t in l || (l = {}))
-    V.call(l, t) && C(c, t, l[t]);
+var k = Object.prototype.hasOwnProperty, I = Object.prototype.propertyIsEnumerable;
+var C = (d, m, t) => m in d ? A(d, m, { enumerable: !0, configurable: !0, writable: !0, value: t }) : d[m] = t, j = (d, m) => {
+  for (var t in m || (m = {}))
+    k.call(m, t) && C(d, t, m[t]);
   if (R)
-    for (var t of R(l))
-      I.call(l, t) && C(c, t, l[t]);
-  return c;
+    for (var t of R(m))
+      I.call(m, t) && C(d, t, m[t]);
+  return d;
 };
-var h = (c, l, t) => (C(c, typeof l != "symbol" ? l + "" : l, t), t);
-var S = (c, l, t) => new Promise((e, o) => {
+var u = (d, m, t) => (C(d, typeof m != "symbol" ? m + "" : m, t), t);
+var S = (d, m, t) => new Promise((e, o) => {
   var i = (s) => {
     try {
       a(t.next(s));
@@ -24,16 +24,16 @@ var S = (c, l, t) => new Promise((e, o) => {
       o(n);
     }
   }, a = (s) => s.done ? e(s.value) : Promise.resolve(s.value).then(i, r);
-  a((t = t.apply(c, l)).next());
+  a((t = t.apply(d, m)).next());
 });
-import { TagComputer as E } from "./TagComputer.js";
-import { Group as y, Quaternion as O, Vector3 as b, Matrix4 as v } from "three";
-import x from "../Components/TagContainer.js";
-import G from "../Components/Tag/index.js";
-import { CSS3DRenderPlugin as F } from "../../CSS3DRenderPlugin/index.js";
-import { loadGLTF as _ } from "../../shared-utils/three/GLTFLoader.js";
-import { isMediaModelTag as D, isStickModelTag as L } from "../utils/tag/tagCheck.js";
-import { VideoPlane as w, ImagePlane as A } from "../utils/model/mediaPlane.js";
+import { TagComputer as V } from "./TagComputer.js";
+import { Group as y, Quaternion as E, Vector3 as b, Matrix4 as v } from "three";
+import O from "../Components/TagContainer.js";
+import x from "../Components/Tag/index.js";
+import { CSS3DRenderPlugin as G } from "../../CSS3DRenderPlugin/index.js";
+import { loadGLTF as F } from "../../shared-utils/three/GLTFLoader.js";
+import { isMediaModelTag as D, isStickModelTag as _ } from "../utils/tag/tagCheck.js";
+import { VideoPlane as L, ImagePlane as w } from "../utils/model/mediaPlane.js";
 import { centerPoint as q } from "../../shared-utils/three/centerPoint.js";
 import { arrayPositionToVector3 as g } from "../../shared-utils/positionToVector3.js";
 import "../utils/tagPosition.js";
@@ -162,38 +162,38 @@ import "../../CSS3DRenderPlugin/Controller.js";
 import "../../CSS3DRenderPlugin/utils/waitFiveModelLoaded.js";
 import "@realsee/five/gltf-loader";
 const W = /* @__PURE__ */ new Map(), $ = /* @__PURE__ */ new Map();
-class Ti extends E {
+class Ti extends V {
   constructor(t) {
     super(t);
-    h(this, "rendererMap", /* @__PURE__ */ new Map());
-    h(this, "contentTypeMap", /* @__PURE__ */ new Map());
-    h(this, "group", new y());
-    h(this, "imagePlaneGroup", new y());
-    h(this, "gltfObjectGroup", new y());
+    u(this, "rendererMap", /* @__PURE__ */ new Map());
+    u(this, "contentTypeMap", /* @__PURE__ */ new Map());
+    u(this, "group", new y());
+    u(this, "imagePlaneGroup", new y());
+    u(this, "gltfObjectGroup", new y());
     /** 维护一个可用模型表，用于快速删除不应该在场景中的模型 */
-    h(this, "enabledModelTagSet", /* @__PURE__ */ new Set());
+    u(this, "enabledModelTagSet", /* @__PURE__ */ new Set());
     /** 临时状态 */
-    h(this, "temporaryState", { visible: !0 });
+    u(this, "temporaryState", { visible: !0 });
     /** 点标签 */
-    h(this, "TagContainerSvelte");
+    u(this, "TagContainerSvelte");
     /** 加载外部模型 */
-    h(this, "loadModel", (t) => S(this, null, function* () {
+    u(this, "loadModel", (t) => S(this, null, function* () {
       var a;
       const e = t.data.modelUrl;
       if (!e)
         return;
       t.loading = !0;
-      const o = _(e).then((s) => {
-        var m;
+      const o = F(e).then((s) => {
+        var p;
         const n = Object.assign(s.scene, {
           customID: t.id,
           isTagModel: !0,
           removeEventListener: this.getTagConfig(t).clickable === !1 ? () => {
-          } : this.addObjectClickHandler(t, s.scene, (u) => {
-            this.hooks.emit("click", { target: "TagModel", tag: t, event: u });
+          } : this.addObjectClickHandler(t, s.scene, (h) => {
+            this.hooks.emit("click", { target: "TagModel", tag: t, event: h });
           })
         });
-        return n.visible = this.getCurrentVisibleState(t), new v().fromArray(t.matrix).decompose(n.position, n.quaternion, n.scale), n.updateWorldMatrix(!0, !0), n.visible = this.getVisible(t), (m = this.getTagConfig(t).modelConfig) != null && m.autoLookAtEnabled && n.lookAt(this.five.camera.position.clone().setY(n.position.y)), n;
+        return n.visible = this.getCurrentVisibleState(t), new v().fromArray(t.matrix).decompose(n.position, n.quaternion, n.scale), n.updateWorldMatrix(!0, !0), n.visible = this.getVisible(t), (p = this.getTagConfig(t).modelConfig) != null && p.autoLookAtEnabled && n.lookAt(this.five.camera.position.clone().setY(n.position.y)), n;
       });
       t.model = { promise: o };
       const i = yield o;
@@ -204,7 +204,7 @@ class Ti extends E {
       if (r && (this.gltfObjectGroup.remove(r), r.removeEventListener()), this.updateRender3DDomTag(), D(t)) {
         if (this.getRenderType(t) === "Mesh" && !t.mediaPlane) {
           const s = t.data.mediaPosition.map(g);
-          t.mediaPlane = new A(t.data.mediaData[0].url, t.data.mediaPosition.map(g), {
+          t.mediaPlane = new w(t.data.mediaData[0].url, t.data.mediaPosition.map(g), {
             objectFit: t.data.objectFit
           });
           const n = new b().addVectors(s[0], s[2]).divideScalar(2);
@@ -249,30 +249,29 @@ class Ti extends E {
       var o, i;
       return ((i = (o = e.data.mediaData) == null ? void 0 : o[0]) == null ? void 0 : i.type) === "Video";
     }).forEach((e) => {
-      var m, u, P;
+      var l;
       const o = e.data.mediaData[0];
       if (!o)
         return;
       const { url: i } = o;
       if (!i)
         return;
-      e.mediaPlane && !((u = (m = e.state) == null ? void 0 : m.visible) == null || u) && e.mediaPlane instanceof w && e.mediaPlane.pause();
-      const r = e.position.map(g), a = this.getCurrentVisibleState(e), s = (() => !!(e.mediaPlane && !a))(), n = (() => !!(!e.mediaPlane && a))(), p = (() => !!(e.mediaPlane && e.mediaPlane.src !== i))();
-      if ((s || p) && e.mediaPlane && (this.imagePlaneGroup.remove(e.mediaPlane), e.mediaPlane.dispose(), e.mediaPlane.removeFromParent(), e.mediaPlane = void 0), n || p) {
-        const d = new w(i, r, {
+      const r = this.getCurrentVisibleState(e), a = (() => !!(e.mediaPlane && !r))(), s = (() => !!(!e.mediaPlane && r))(), n = (() => !!(e.mediaPlane && e.mediaPlane.src !== i))();
+      if ((a || n) && e.mediaPlane && (this.imagePlaneGroup.remove(e.mediaPlane), e.mediaPlane.dispose(), e.mediaPlane.removeFromParent(), e.mediaPlane = void 0), s || n) {
+        const p = e.position.map(g), h = new L(i, p, {
           videoCoverSrc: o.videoCoverUrl,
           playButton: e.data.playIcon,
-          paused: !((P = e.data.autoplayConfig) != null && P.autoplayVideo),
+          paused: !((l = e.data.autoplayConfig) != null && l.autoplayVideo),
           objectFit: e.data.objectFit,
           videoTextureMap: W,
           ImageTextureMap: $,
           domEvents: this.domEvents
         });
-        d.onVideoReady = (f) => {
-          f.addEventListener("play", () => this.mediaStore.set({ currentMediaElement: d.videoInstance }));
+        h.onVideoReady = (c) => {
+          c.addEventListener("play", () => this.mediaStore.set({ currentMediaElement: h.videoInstance }));
         };
-        const T = (f) => (this.five.on("renderFrame", f), () => this.five.off("renderFrame", f));
-        d.initialRenderHooks(T), e.mediaPlane = d, this.imagePlaneGroup.add(e.mediaPlane);
+        const f = (c) => (this.five.on("renderFrame", c), () => this.five.off("renderFrame", c));
+        h.initialRenderHooks(f), e.mediaPlane = h, this.imagePlaneGroup.add(e.mediaPlane);
       }
     });
   }
@@ -288,8 +287,8 @@ class Ti extends E {
       if (!o)
         return;
       const i = e.position.map(g), r = this.getCurrentVisibleState(e), a = (() => !!(e.mediaPlane && !r))(), s = (() => !!(!e.mediaPlane && r))(), n = (() => !!(e.mediaPlane && e.mediaPlane.src !== o))();
-      (a || n) && e.mediaPlane && (this.imagePlaneGroup.remove(e.mediaPlane), e.mediaPlane.dispose(), e.mediaPlane.removeFromParent(), e.mediaPlane = void 0), (s || n) && (e.mediaPlane = new A(o, i, { objectFit: e.data.objectFit }), this.getTagConfig(e).clickable !== !1 && this.domEvents.addAutoBindEventListener(e.mediaPlane, "click", (p) => {
-        this.hooks.emit("click", { tag: e, target: "TagContent", event: p.origDomEvent });
+      (a || n) && e.mediaPlane && (this.imagePlaneGroup.remove(e.mediaPlane), e.mediaPlane.dispose(), e.mediaPlane.removeFromParent(), e.mediaPlane = void 0), (s || n) && (e.mediaPlane = new w(o, i, { objectFit: e.data.objectFit }), this.getTagConfig(e).clickable !== !1 && this.domEvents.addAutoBindEventListener(e.mediaPlane, "click", (l) => {
+        this.hooks.emit("click", { tag: e, target: "TagContent", event: l.origDomEvent });
       }), this.imagePlaneGroup.add(e.mediaPlane));
     });
   }
@@ -300,16 +299,16 @@ class Ti extends E {
     this.filterCSS3DTag.forEach((e) => {
       var o, i, r;
       if (e.tag3DContentSvelte) {
-        const { svelteApp: a, css3DInstance: s, initialNormal: n, currentNormal: p } = e.tag3DContentSvelte;
-        if (a.$set({ tag: e, hooks: this.hooks, state: this.state, temporaryState: this.temporaryState }), !n.equals(p)) {
-          const m = new O().setFromUnitVectors(n, p);
-          s.css3DObject.setRotationFromQuaternion(m);
+        const { svelteApp: a, css3DInstance: s, initialNormal: n, currentNormal: l } = e.tag3DContentSvelte;
+        if (a.$set({ tag: e, hooks: this.hooks, state: this.state, temporaryState: this.temporaryState }), !n.equals(l)) {
+          const p = new E().setFromUnitVectors(n, l);
+          s.css3DObject.setRotationFromQuaternion(p);
         }
         return;
       } else {
         if (D(e) && !((o = e.model) != null && o.object) || ((i = e.state) == null ? void 0 : i.visible) === !1 || !this.state.visible || !this.state.enabled)
           return;
-        if (this.css3DRenderPlugin || (this.css3DRenderPlugin = F(this.five)), e.stickType === "3DPoint" && !e.normal)
+        if (this.css3DRenderPlugin || (this.css3DRenderPlugin = G(this.five)), e.stickType === "3DPoint" && !e.normal)
           return console.error("updateRenderPlaneTag: 三维点标签缺少法向量！");
         const a = this.getPositions(e);
         if (!a)
@@ -317,26 +316,26 @@ class Ti extends E {
         const s = this.getTagNormal(e);
         if (!s)
           return;
-        const n = this.getTagConfig(e), p = j({ wrapperStyle: { zIndex: this.calculateTagZIndex(e).toString() } }, n.tag3DConfig);
-        if (this.getRenderType(e) === "BehindDom" || p.mode === "behind") {
-          p.mode = "behind", p.container = document.createElement("div");
-          const P = "black";
-          p.container.style.backgroundColor = P, p.container.style.border = `3px solid ${P}`, this.css3DRenderPlugin.hooks.on("render", () => {
-            var d;
-            if (m.css3DObject.opacityMesh && n.clickable !== !1) {
-              const T = this.addObjectClickHandler(e, m.css3DObject.opacityMesh, (f) => {
-                this.hooks.emit("click", { event: f, target: "TagContent", tag: e });
+        const n = this.getTagConfig(e), l = j({ wrapperStyle: { zIndex: this.calculateTagZIndex(e).toString() } }, n.tag3DConfig);
+        if (this.getRenderType(e) === "BehindDom" || l.mode === "behind") {
+          l.mode = "behind", l.container = document.createElement("div");
+          const f = "black";
+          l.container.style.backgroundColor = f, l.container.style.border = `3px solid ${f}`, this.css3DRenderPlugin.hooks.on("render", () => {
+            var c;
+            if (p.css3DObject.opacityMesh && n.clickable !== !1) {
+              const P = this.addObjectClickHandler(e, p.css3DObject.opacityMesh, (T) => {
+                this.hooks.emit("click", { event: T, target: "TagContent", tag: e });
               });
-              (d = this.store.css3DRenderDisposer.get(e.id)) == null || d.push(T);
+              (c = this.store.css3DRenderDisposer.get(e.id)) == null || c.push(P);
             }
           });
         }
-        const m = this.css3DRenderPlugin.create3DDomContainer(a, p);
-        if (!m)
+        const p = this.css3DRenderPlugin.create3DDomContainer(a, l);
+        if (!p)
           return;
-        this.store.css3DRenderDisposer.set(e.id, [m.dispose]);
-        const u = new G({
-          target: m.container,
+        this.store.css3DRenderDisposer.set(e.id, [p.dispose]);
+        const h = new x({
+          target: p.container,
           props: {
             tag: e,
             hooks: this.hooks,
@@ -347,13 +346,13 @@ class Ti extends E {
           }
         });
         e.tag3DContentSvelte = {
-          svelteApp: u,
-          domContainer: m,
-          css3DInstance: m,
+          svelteApp: h,
+          domContainer: p,
+          css3DInstance: p,
           initialNormal: s,
           currentNormal: s,
           dispose: () => {
-            u.$destroy(), m.dispose();
+            h.$destroy(), p.dispose();
           }
         }, D(e) && ((r = e.model) != null && r.object) && this.updateTagCss3DObjectMatrix(e, e.model.object);
       }
@@ -387,23 +386,23 @@ class Ti extends E {
    * @param model 模型
    */
   updateTagCss3DObjectMatrix(t, e) {
-    var T, f, M;
-    const o = (f = (T = this.getTagConfig(t).tag3DConfig) == null ? void 0 : T.ratio) != null ? f : 216e-5, i = (M = t.tag3DContentSvelte) == null ? void 0 : M.css3DInstance.css3DObject;
+    var P, T, M;
+    const o = (T = (P = this.getTagConfig(t).tag3DConfig) == null ? void 0 : P.ratio) != null ? T : 216e-5, i = (M = t.tag3DContentSvelte) == null ? void 0 : M.css3DInstance.css3DObject;
     if (!i)
       return;
     const r = D(t) ? t.data.mediaPosition : t.position;
     if (!r || r.length !== 4 || !Array.isArray(r[0]) || !Array.isArray(r[2]))
       return;
     e.updateWorldMatrix(!1, !1);
-    const a = e.matrixWorld, s = new b().fromArray(r[0]), n = new b().fromArray(r[2]), p = q(s, n).add(new b(0, 0, 5e-4)), m = new v().setPosition(p), u = new v().makeScale(o, o, o), P = new v().multiply(a).multiply(m).multiply(u);
-    P.decompose(i.position, i.quaternion, i.scale);
-    const d = i.opacityMesh;
-    d && P.decompose(d.position, d.quaternion, d.scale);
+    const a = e.matrixWorld, s = new b().fromArray(r[0]), n = new b().fromArray(r[2]), l = q(s, n).add(new b(0, 0, 5e-4)), p = new v().setPosition(l), h = new v().makeScale(o, o, o), f = new v().multiply(a).multiply(p).multiply(h);
+    f.decompose(i.position, i.quaternion, i.scale);
+    const c = i.opacityMesh;
+    c && f.decompose(c.position, c.quaternion, c.scale);
   }
   /** 添加模型标签 */
   addMediaModelTag(t) {
     return S(this, null, function* () {
-      const e = t.filter(L).map((o) => this.loadModel(o));
+      const e = t.filter(_).map((o) => this.loadModel(o));
       yield Promise.all(e), this.setVisible(), this.updateRenderAllTags();
     });
   }
@@ -480,7 +479,7 @@ class Ti extends E {
       const r = (o = this.five.getElement()) == null ? void 0 : o.parentElement;
       if (!r)
         return console.error("updateRenderPlaneTag: tag2DContainer not found");
-      this.TagContainerSvelte = new x({
+      this.TagContainerSvelte = new O({
         target: r,
         props: {
           hooks: this.hooks,

package/libs/PanoVideoPlugin/Controller.d.ts

@@ -23,6 +23,23 @@ export declare class PanoVideoPluginController extends BasePlugin.Controller<Plu
      * - 如果遇到不能自动播放的问题，需要放到用户交互事件中调用。
      */
     lookAtVideoItemByRenderID(id: string): void;
+    /**
+     * 取消静音。
+     *
+     * 大部分浏览器需要用户交互后才能开启视频声音。
+     *
+     * 如果需要取消静音，建议在用户交互事件中调用本方法。
+     *
+     * 例如:
+     *
+     * ```jsx
+     * onClick={() => {
+     *  panoVideoPluginController.lookAtVideoItemByRenderID('xxx')
+     *  panoVideoPluginController.unmuteByRenderID('xxx')
+     * }}
+     * ```
+     */
+    unmuteByRenderID(id: string): void;
     /** 为一个点位添加视频（可以是多条）。 */
     add(panoIndex: number, videoItems: VideoItem[]): void;
     /** 根据 VideoItem render_id 删除某个视频。 */

package/libs/PanoVideoPlugin/Controller.js

@@ -1,16 +1,16 @@
-var g = Object.defineProperty, m = Object.defineProperties;
+var f = Object.defineProperty, m = Object.defineProperties;
 var b = Object.getOwnPropertyDescriptors;
 var p = Object.getOwnPropertySymbols;
 var M = Object.prototype.hasOwnProperty, W = Object.prototype.propertyIsEnumerable;
-var l = (o, r, e) => r in o ? g(o, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[r] = e, a = (o, r) => {
-  for (var e in r || (r = {}))
-    M.call(r, e) && l(o, e, r[e]);
+var l = (o, t, r) => t in o ? f(o, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : o[t] = r, a = (o, t) => {
+  for (var r in t || (t = {}))
+    M.call(t, r) && l(o, r, t[r]);
   if (p)
-    for (var e of p(r))
-      W.call(r, e) && l(o, e, r[e]);
+    for (var r of p(t))
+      W.call(t, r) && l(o, r, t[r]);
   return o;
-}, d = (o, r) => m(o, b(r));
-var s = (o, r, e) => (l(o, typeof r != "symbol" ? r + "" : r, e), e);
+}, d = (o, t) => m(o, b(t));
+var s = (o, t, r) => (l(o, typeof t != "symbol" ? t + "" : t, r), r);
 import { VideoMeshController as c } from "./VideoMeshController.js";
 import { Controller as _ } from "../base/BasePlugin.js";
 import "./utils/shader.js";
@@ -39,12 +39,12 @@ import "./utils/index.js";
 import "animejs";
 import "../shared-utils/url/absoluteUrl.js";
 class T extends _ {
-  constructor(e) {
-    super(e);
+  constructor(r) {
+    super(r);
     s(this, "enabled", !0);
     s(this, "controllerMap", /* @__PURE__ */ new Map());
     s(this, "_disposed", !1);
-    this.five = e;
+    this.five = r;
   }
   /** 插件 State */
   get state() {
@@ -57,18 +57,18 @@ class T extends _ {
     return this._disposed;
   }
   /** 加载点位视频数据，加载数据并不代表会加载点位视频。 */
-  load(e, t) {
+  load(r, e) {
     var i;
     if (this.disposed)
       return this.logWarning("插件已被销毁");
-    typeof ((i = t == null ? void 0 : t.initialState) == null ? void 0 : i.enabled) != "undefined" && t.initialState.enabled !== this.enabled && (t.initialState.enabled ? this.enable() : this.disable()), e.list.forEach((n) => {
-      const f = n.pano_index, u = n.render_id;
+    typeof ((i = e == null ? void 0 : e.initialState) == null ? void 0 : i.enabled) != "undefined" && e.initialState.enabled !== this.enabled && (e.initialState.enabled ? this.enable() : this.disable()), r.list.forEach((n) => {
+      const u = n.pano_index, g = n.render_id;
       n.video_list.forEach((h) => {
         this.controllerMap.set(
           h.render_id,
           new c(this.five, d(a({}, h), {
-            panoIndex: f,
-            renderID: u,
+            panoIndex: u,
+            renderID: g,
             initialState: { enabled: this.enabled }
           }))
         );
@@ -76,51 +76,75 @@ class T extends _ {
     });
   }
   /** 开启插件功能。 */
-  enable(e) {
+  enable(r) {
     var i;
     if (this.disposed)
       return this.logWarning("插件已被销毁");
     if (this.enabled)
       return;
     this.enabled = !0, Array.from(this.controllerMap.values()).forEach((n) => n.enable());
-    const t = (i = e == null ? void 0 : e.userAction) != null ? i : !0;
-    this.hooks.emit("enable", { userAction: t });
+    const e = (i = r == null ? void 0 : r.userAction) != null ? i : !0;
+    this.hooks.emit("enable", { userAction: e });
   }
   /** 禁用插件功能。 */
-  disable(e) {
+  disable(r) {
     var i;
     if (this.disposed)
       return this.logWarning("插件已被销毁");
     if (!this.enabled)
       return;
     this.enabled = !1, Array.from(this.controllerMap.values()).forEach((n) => n.disable());
-    const t = (i = e == null ? void 0 : e.userAction) != null ? i : !0;
-    this.hooks.emit("disable", { userAction: t });
+    const e = (i = r == null ? void 0 : r.userAction) != null ? i : !0;
+    this.hooks.emit("disable", { userAction: e });
   }
   /** 看向某个视频。
    * - 会自动切换到全景模式。
    * - 如果遇到不能自动播放的问题，需要放到用户交互事件中调用。
    */
-  lookAtVideoItemByRenderID(e) {
+  lookAtVideoItemByRenderID(r) {
     if (this.disposed)
       return this.logWarning("插件已被销毁");
-    const t = this.controllerMap.get(e);
-    if (!t)
-      return this.logWarning(`ID 为 ${e} 的点位视频不存在`);
-    t.lookAtVideo();
+    const e = this.controllerMap.get(r);
+    if (!e)
+      return this.logWarning(`ID 为 ${r} 的点位视频不存在`);
+    e.lookAtVideo();
+  }
+  /**
+   * 取消静音。
+   *
+   * 大部分浏览器需要用户交互后才能开启视频声音。
+   *
+   * 如果需要取消静音，建议在用户交互事件中调用本方法。
+   *
+   * 例如:
+   *
+   * ```jsx
+   * onClick={() => {
+   *  panoVideoPluginController.lookAtVideoItemByRenderID('xxx')
+   *  panoVideoPluginController.unmuteByRenderID('xxx')
+   * }}
+   * ```
+   */
+  unmuteByRenderID(r) {
+    if (this.disposed)
+      return this.logWarning("插件已被销毁");
+    const e = this.controllerMap.get(r);
+    if (!e)
+      return this.logWarning(`ID 为 ${r} 的点位视频不存在`);
+    e.unmute();
   }
   /** 为一个点位添加视频（可以是多条）。 */
-  add(e, t) {
+  add(r, e) {
     if (this.disposed)
       return this.logWarning("插件已被销毁");
-    t.forEach((i) => {
+    e.forEach((i) => {
       if (this.controllerMap.get(i.render_id))
         return this.logWarning(`ID 为 ${i.render_id} 的点位视频已存在`);
       const n = i.render_id;
       this.controllerMap.set(
         i.render_id,
         new c(this.five, d(a({}, i), {
-          panoIndex: e,
+          panoIndex: r,
           renderID: n,
           initialState: { enabled: this.enabled }
         }))
@@ -128,30 +152,30 @@ class T extends _ {
     });
   }
   /** 根据 VideoItem render_id 删除某个视频。 */
-  removeByRenderID(e) {
+  removeByRenderID(r) {
     if (this.disposed)
       return this.logWarning("插件已被销毁");
-    const t = this.controllerMap.get(e);
-    if (!t)
-      return this.logWarning(`ID 为 ${e} 的点位视频不存在`);
-    t.dispose(), this.controllerMap.delete(e);
+    const e = this.controllerMap.get(r);
+    if (!e)
+      return this.logWarning(`ID 为 ${r} 的点位视频不存在`);
+    e.dispose(), this.controllerMap.delete(r);
   }
   /** 清空现有数据 */
   clear() {
     if (this.disposed)
       return this.logWarning("插件已被销毁");
-    Array.from(this.controllerMap.values()).forEach((e) => e.dispose()), this.controllerMap.clear();
+    Array.from(this.controllerMap.values()).forEach((r) => r.dispose()), this.controllerMap.clear();
   }
   /** 销毁插件 */
   dispose() {
     if (this.disposed)
       return this.logWarning("插件已被销毁");
-    this._disposed = !0, Array.from(this.controllerMap.values()).forEach((e) => e.dispose()), this.controllerMap.clear();
+    this._disposed = !0, Array.from(this.controllerMap.values()).forEach((r) => r.dispose()), this.controllerMap.clear();
   }
   /** 控制台打印警告 */
   // TODO: 全局函数 curry 化
-  logWarning(e) {
-    console.warn("⛔ ==> [PanoVideoPluginController]:", e);
+  logWarning(r) {
+    console.warn("⛔ ==> [PanoVideoPluginController]:", r);
   }
 }
 export {

package/libs/PanoVideoPlugin/VideoMeshController.d.ts

@@ -46,6 +46,12 @@ export declare class VideoMeshController {
     private renderFiveDisposer?;
     /** 初始化视频、模型以及相关事件监听。 */
     constructor(five: Five, params: VideoMeshParams);
+    /**
+     * 取消静音
+     *
+     * @warning 需要注意：由于大部分浏览器的限制，视频的声音必须在用户有交互事件后才能开启，否则会被浏览器禁用视频播放。
+     */
+    unmute: () => void;
     /** 彻底销毁，不响应之后的任何事件 */
     dispose(): void;
     enable(): void;

package/libs/PanoVideoPlugin/VideoMeshController.js

@@ -53,6 +53,14 @@ class ie {
      * @remark 由于 render video 依赖 Five render，因此需要自动 render five。
      */
     t(this, "renderFiveDisposer");
+    /**
+     * 取消静音
+     *
+     * @warning 需要注意：由于大部分浏览器的限制，视频的声音必须在用户有交互事件后才能开启，否则会被浏览器禁用视频播放。
+     */
+    t(this, "unmute", () => {
+      this.video.muted = !1;
+    });
     /** 把 uv 值转换成位置 */
     t(this, "uv2Position", (e, i) => {
       var c;

package/libs/base/BasePlugin.js

@@ -14,7 +14,7 @@ let b = class {
     /**
      * @realsee/dnalogel 版本号
      */
-    i(this, "VERSION", "3.20.0-dev.2");
+    i(this, "VERSION", "3.20.1");
     i(this, "five");
     /**
      * @description: 插件事件钩子