@realsee/dnalogel 3.81.10-alpha.0 → 3.81.10-alpha.2

package/libs/PanoVideoPlugin/VideoMeshController.js

@@ -1,26 +1,25 @@
 var g = Object.defineProperty;
-var I = (u, i, e) => i in u ? g(u, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : u[i] = e;
-var t = (u, i, e) => (I(u, typeof i != "symbol" ? i + "" : i, e), e);
-var f = (u, i, e) => new Promise((n, o) => {
-  var a = (s) => {
+var y = (v, i, e) => i in v ? g(v, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : v[i] = e;
+var t = (v, i, e) => (y(v, typeof i != "symbol" ? i + "" : i, e), e);
+var f = (v, i, e) => new Promise((o, n) => {
+  var r = (s) => {
     try {
-      r(e.next(s));
-    } catch (d) {
-      o(d);
+      a(e.next(s));
+    } catch (h) {
+      n(h);
     }
-  }, h = (s) => {
+  }, d = (s) => {
     try {
-      r(e.throw(s));
-    } catch (d) {
-      o(d);
+      a(e.throw(s));
+    } catch (h) {
+      n(h);
     }
-  }, r = (s) => s.done ? n(s.value) : Promise.resolve(s.value).then(a, h);
-  r((e = e.apply(u, i)).next());
+  }, a = (s) => s.done ? o(s.value) : Promise.resolve(s.value).then(r, d);
+  a((e = e.apply(v, i)).next());
 });
-import { AudioTask as M } from "../shared-utils/audioFocus.js";
-import { vertexShader as P, fragmentShader as y } from "./utils/shader.js";
+import { vertexShader as b, fragmentShader as I } from "./utils/shader.js";
 import "../shared-utils/tag.js";
-import { VideoTexture as F, LinearFilter as c, ShaderMaterial as b, Vector4 as x, SphereBufferGeometry as L, Mesh as V, Vector3 as p, Quaternion as A } from "three";
+import { VideoTexture as M, LinearFilter as c, ShaderMaterial as P, Vector4 as F, SphereBufferGeometry as x, Mesh as L, Vector3 as p, Quaternion as V } from "three";
 import "../vendor/hammerjs/hammer.js";
 import "../shared-utils/three/PointSelector/index.js";
 import "../shared-utils/three/CSS3DRenderer/index.js";
@@ -32,10 +31,10 @@ import "../shared-utils/three/blink.js";
 import "../vendor/@tweenjs/tween/dist/tween.esm.js.js";
 import "../CSS3DRenderPlugin/utils/three/CSS3DRender.js";
 import "../vendor/earcut/src/earcut.js";
-import { requestAnimationFrameInterval as T } from "../shared-utils/animationFrame/index.js";
+import { requestAnimationFrameInterval as A } from "../shared-utils/animationFrame/index.js";
 import "../shared-utils/five/FivePuppet.js";
-import w from "./utils/index.js";
-import { anime as k } from "../vendor/animejs/lib/anime.es.js";
+import k from "./utils/index.js";
+import { anime as w } from "../vendor/animejs/lib/anime.es.js";
 import "../shared-utils/positionToVector3.js";
 import "../shared-utils/five/vector3ToScreen.js";
 import "../shared-utils/five/getFiveModel.js";
@@ -89,7 +88,7 @@ import "../CSS3DRenderPlugin/utils/three/CSS3DScene.js";
 import "../CSS3DRenderPlugin/utils/getAllCSS3DObject.js";
 import "../CSS3DRenderPlugin/utils/three/CSS3DGroup.js";
 import "@realsee/five";
-class Ji {
+class Xi {
   /** 初始化视频、模型以及相关事件监听。 */
   constructor(i, e) {
     t(this, "video");
@@ -118,29 +117,41 @@ class Ji {
      * @remark 由于 render video 依赖 Five render，因此需要自动 render five。
      */
     t(this, "renderFiveDisposer");
-    t(this, "audioTask");
+    t(this, "playbackController");
+    t(this, "session");
+    t(this, "playbackGeneration", 0);
     t(this, "hooks");
     /**
      * 取消静音
      *
      * @warning 需要注意：由于大部分浏览器的限制，视频的声音必须在用户有交互事件后才能开启，否则会被浏览器禁用视频播放。
      */
-    t(this, "unmute", (i = "auto") => {
-      this.audioTask.begin(i) && (this.video.muted = !1);
-    });
+    t(this, "unmute", (i = !1) => f(this, null, function* () {
+      var n, r;
+      if (this.disposed)
+        return;
+      if (!this.video.paused)
+        return this.play(i, !1);
+      const e = (n = this.playbackController) == null ? void 0 : n.begin({ userAction: i, audible: !0 });
+      if (this.playbackController && !e)
+        return;
+      this.session = e;
+      const o = (r = e == null ? void 0 : e.bind(this.video)) != null ? r : this.video;
+      o.muted = !1;
+    }));
     /** 把 uv 值转换成位置 */
     t(this, "uv2Position", (i, e) => {
-      const o = Math.PI, a = Math.PI * 2, h = i, r = 1 - e, s = new p(
-        -1 * Math.cos(a * h) * Math.sin(o * r),
-        1 * Math.cos(o * r),
-        1 * Math.sin(a * h) * Math.sin(o * r)
+      const n = Math.PI, r = Math.PI * 2, d = i, a = 1 - e, s = new p(
+        -1 * Math.cos(r * d) * Math.sin(n * a),
+        1 * Math.cos(n * a),
+        1 * Math.sin(r * d) * Math.sin(n * a)
       );
       s.setX(-s.x);
-      const d = this.fiveUtil.workUtil.getResolvedObserver(this.panoIndex);
-      if (!d)
+      const h = this.fiveUtil.workUtil.getResolvedObserver(this.panoIndex);
+      if (!h)
         return this.logWarning(`点位 ${this.panoIndex} 不存在，请检查 Five 数据是否正常。`);
-      const l = d.position.clone(), m = d.quaternion.clone(), v = s.clone();
-      return v.applyAxisAngle(new p(0, 1, 0), Math.PI / 2), v.applyQuaternion(m), v.add(l), v;
+      const l = h.position.clone(), m = h.quaternion.clone(), u = s.clone();
+      return u.applyAxisAngle(new p(0, 1, 0), Math.PI / 2), u.applyQuaternion(m), u.add(l), u;
     });
     /** Five 数据加载后需要根据点位位姿调整点位模型位置 */
     t(this, "onFiveDataLoaded", () => {
@@ -148,12 +159,12 @@ class Ji {
       if (!i)
         return this.logWarning(`点位 ${this.panoIndex} 不存在，请检查 Five 数据是否正常。`);
       this.observer = i;
-      const { x: e, y: n, z: o, w: a } = i.quaternion, h = new A(e, n, o, a), r = i.position;
-      this.videoMesh.position.fromArray([r.x, r.y, r.z]), this.videoMesh.quaternion.set(0, 0, 0, 1), this.videoMesh.rotateOnAxis(new p(0, 1, 0), Math.PI / 2), this.videoMesh.applyQuaternion(h);
+      const { x: e, y: o, z: n, w: r } = i.quaternion, d = new V(e, o, n, r), a = i.position;
+      this.videoMesh.position.fromArray([a.x, a.y, a.z]), this.videoMesh.quaternion.set(0, 0, 0, 1), this.videoMesh.rotateOnAxis(new p(0, 1, 0), Math.PI / 2), this.videoMesh.applyQuaternion(d);
     });
     /** 兼容视频播放 */
     t(this, "onFiveWantsMoveToPano", (i) => {
-      i === this.panoIndex && (this.hasVideoEverPlayed || this.play("auto", !0).catch(() => {
+      i === this.panoIndex && (this.hasVideoEverPlayed || this.play(!1, !0).catch(() => {
       }));
     });
     /** 走到某个点位上时，挂载/卸载视频 */
@@ -188,14 +199,14 @@ class Ji {
       if (!e)
         return;
       if (this.checkIntersectionInBounding(this.origin, e)) {
-        const o = {
+        const n = {
           target: this,
           _preventDefaultReturn: !1,
           preventDefault: () => {
-            o._preventDefaultReturn = !0;
+            n._preventDefaultReturn = !0;
           }
         };
-        return this.hooks.emit("click", o), o._preventDefaultReturn === !1 && (this.video.muted ? this.unmute("user") : (this.video.muted = !0, this.audioTask.release())), !1;
+        return this.hooks.emit("click", n), n._preventDefaultReturn === !1 && (this.video.muted ? this.unmute(!0) : this.mute()), !1;
       }
     });
     /** video canplaythrough 事件触发 */
@@ -221,13 +232,13 @@ class Ji {
       this.video.addEventListener(
         "timeupdate",
         () => {
-          if (this.enabled && this.panoIndex === this.five.getCurrentState().panoIndex && this.five.getCurrentState().mode === "Panorama" && (this.renderFiveDisposer || (this.renderFiveDisposer = T(() => {
+          if (this.enabled && this.panoIndex === this.five.getCurrentState().panoIndex && this.five.getCurrentState().mode === "Panorama" && (this.renderFiveDisposer || (this.renderFiveDisposer = A(() => {
             this.five.needsRender = !0;
           }, 30)), this.five.scene.add(this.videoMesh), this.videoMesh.material.uniforms.opacity.value === 0)) {
             const i = {
               value: 0
             };
-            k({
+            w({
               targets: i,
               value: 1,
               duration: 300,
@@ -249,30 +260,30 @@ class Ji {
       var i;
       (i = this.renderFiveDisposer) == null || i.call(this), this.renderFiveDisposer = void 0;
     });
-    var s, d;
-    this.five = i, this.panoIndex = e.panoIndex, this.fiveUtil = e.fiveUtil, this._id = e.renderID, this.url = e.url, this.origin = e.origin.slice(), this.hooks = e.hooks, this._enabled = (d = (s = e.initialState) == null ? void 0 : s.enabled) != null ? d : !0;
-    const n = document.createElement("video");
-    n.crossOrigin = "anonymous", n.autoplay = !1, n.muted = !0, n.loop = !0, n.playsInline = !0, this.video = n, this.audioTask = new M(e.audioFocus, "pano-video", () => {
-      n.muted = !0, n.pause();
-    });
-    const o = new F(this.video);
-    o.minFilter = c, o.magFilter = c;
-    const a = new b({
-      vertexShader: P,
-      fragmentShader: y,
+    var s, h, l;
+    this.five = i, this.panoIndex = e.panoIndex, this.fiveUtil = e.fiveUtil, this._id = e.renderID, this.url = e.url, this.origin = e.origin.slice(), this.hooks = e.hooks, this._enabled = (h = (s = e.initialState) == null ? void 0 : s.enabled) != null ? h : !0;
+    const o = document.createElement("video");
+    o.crossOrigin = "anonymous", o.autoplay = !1, o.muted = !0, o.loop = !0, o.playsInline = !0, this.video = o, this.playbackController = (l = e.mediaManager) == null ? void 0 : l.createController({ label: "pano-video", onCancel: () => {
+      this.playbackGeneration++, this.session = void 0;
+    } });
+    const n = new M(this.video);
+    n.minFilter = c, n.magFilter = c;
+    const r = new P({
+      vertexShader: b,
+      fragmentShader: I,
       uniforms: {
-        map: { value: o },
+        map: { value: n },
         size: {
-          value: new x(this.origin[0], 1 - this.origin[1] - this.origin[3], this.origin[2], this.origin[3])
+          value: new F(this.origin[0], 1 - this.origin[1] - this.origin[3], this.origin[2], this.origin[3])
         },
         opacity: { value: 0 }
       },
       depthTest: !0,
       transparent: !0
-    }), h = new L(1, 64, 64);
-    h.scale(-1, 1, 1);
-    const r = new V(h, a);
-    r.name = "pano-video-plugin", this.videoMesh = r, this.fiveUtil.workUtil.work && this.onFiveDataLoaded(), this.enabled && this.addEventListeners(), this.mountIfNeeded(), window[`__PANOVIDEO_${this.renderID}_DEBUG__`] = this;
+    }), d = new x(1, 64, 64);
+    d.scale(-1, 1, 1);
+    const a = new L(d, r);
+    a.name = "pano-video-plugin", this.videoMesh = a, this.fiveUtil.workUtil.work && this.onFiveDataLoaded(), this.enabled && this.addEventListeners(), this.mountIfNeeded(), window[`__PANOVIDEO_${this.renderID}_DEBUG__`] = this;
   }
   /** 传入的 ID，不可更改 */
   get renderID() {
@@ -286,29 +297,43 @@ class Ji {
   get enabled() {
     return this._enabled;
   }
-  play(i = "auto", e = !1) {
+  play(i = !1, e = !1) {
     return f(this, null, function* () {
-      const n = e ? this.audioTask.beginSilent() : this.audioTask.begin(i);
-      if (!(!n || this.disposed)) {
-        this.video.muted = e;
-        try {
-          yield this.video.play();
-        } catch (o) {
-          if (n())
-            throw this.audioTask.cancel(), o;
+      var d, a;
+      if (this.disposed)
+        return;
+      const o = (d = this.playbackController) == null ? void 0 : d.begin({ userAction: i, audible: !e });
+      if (this.playbackController && !o)
+        return;
+      this.session = o;
+      const n = ++this.playbackGeneration, r = (a = o == null ? void 0 : o.bind(this.video)) != null ? a : this.video;
+      r.muted = e;
+      try {
+        yield r.play();
+      } catch (s) {
+        if (o != null && o.signal.aborted || n !== this.playbackGeneration)
+          return;
+        if (s.name === "AbortError") {
+          this.pause();
+          return;
         }
+        throw this.pause(), s;
       }
     });
   }
   pause() {
-    this.audioTask.cancel();
+    var i;
+    (i = this.playbackController) == null || i.cancel(), this.playbackGeneration++, this.session = void 0, this.video.muted = !0, this.video.pause();
   }
   mute() {
-    this.video.muted = !0, this.audioTask.release();
+    var e, o;
+    const i = (o = (e = this.session) == null ? void 0 : e.bind(this.video)) != null ? o : this.video;
+    i.muted = !0;
   }
   /** 彻底销毁，不响应之后的任何事件 */
   dispose() {
-    this.disposed || (this.disable(), this.audioTask.dispose(), this._disposed = !0);
+    var i;
+    this.disposed || (this.disable(), (i = this.playbackController) == null || i.dispose(), this._disposed = !0);
   }
   enable() {
     this.disposed || this.enabled || (this._enabled = !0, !this.observer && this.five.work && this.onFiveDataLoaded(), this.addEventListeners(), this.mountIfNeeded());
@@ -329,8 +354,8 @@ class Ji {
     const e = this.uv2Position(i[0], i[1]);
     if (!e)
       return;
-    const n = new p().subVectors(e, this.observer.position).normalize(), { longitude: o, latitude: a } = w(n);
-    this.five.setState({ panoIndex: this.panoIndex, longitude: o, latitude: a }), this.onFiveWantsMoveToPano(this.panoIndex);
+    const o = new p().subVectors(e, this.observer.position).normalize(), { longitude: n, latitude: r } = k(o);
+    this.five.setState({ panoIndex: this.panoIndex, longitude: n, latitude: r }), this.onFiveWantsMoveToPano(this.panoIndex);
   }
   /** 获取视频中心点的 uv */
   getUVCenter() {
@@ -358,17 +383,17 @@ class Ji {
       return this.logWarning("插件已经销毁，无法挂载。");
     if (this.url === "")
       return this.logWarning("视频资源不存在。");
-    this.video.src !== this.url && (this.video.src = this.url), this.video.paused && this.play("auto", this.video.muted).catch((i) => {
+    this.video.src !== this.url && (this.video.src = this.url), this.video.paused && this.play(!1, this.video.muted).catch((i) => {
       this.logWarning(i instanceof Error ? i.message : "视频播放失败。");
     });
   }
   /** 卸载：销毁视频资源；移除模型。 */
   unmount() {
-    this.audioTask.cancel(), this.video.pause(), this.videoMesh.material.uniforms.opacity.value = 0, this.video.src !== "" && (this.video.src = ""), this.five.scene.remove(this.videoMesh);
+    this.pause(), this.video.pause(), this.videoMesh.material.uniforms.opacity.value = 0, this.video.src !== "" && (this.video.src = ""), this.five.scene.remove(this.videoMesh);
   }
   /** 暂停视频，去除模型。 */
   hide() {
-    this.audioTask.cancel(), this.video.pause(), this.videoMesh.material.uniforms.opacity.value = 0, this.five.scene.remove(this.videoMesh);
+    this.pause(), this.video.pause(), this.videoMesh.material.uniforms.opacity.value = 0, this.five.scene.remove(this.videoMesh);
   }
   /** 控制台打印警告 */
   logWarning(i) {
@@ -378,10 +403,10 @@ class Ji {
   checkIntersectionInBounding(i, e) {
     if (!e.uv)
       return !1;
-    const [n, o] = e.uv.toArray(), [a, h, r, s] = i, d = 1 - h - s, l = a + r, m = d + s;
-    return n >= a && n <= l && o >= d && o <= m;
+    const [o, n] = e.uv.toArray(), [r, d, a, s] = i, h = 1 - d - s, l = r + a, m = h + s;
+    return o >= r && o <= l && n >= h && n <= m;
   }
 }
 export {
-  Ji as VideoMeshController
+  Xi as VideoMeshController
 };

package/libs/PanoVideoPlugin/index.d.ts

@@ -1,4 +1,4 @@
-import type { AudioFocusHost } from '../shared-utils/audioFocus';
+import type { PlaybackManager } from '../shared-utils/playback';
 import type { FivePlugin } from '@realsee/five';
 import { PanoVideoPluginController } from './Controller';
 import * as _PanoVideoPluginType from './typings';
@@ -11,11 +11,11 @@ import * as _PanoVideoPluginType from './typings';
  * - 不做多媒体缓存，缓解内存占用。
  */
 export declare const PanoVideoPlugin: FivePlugin<{
-    audioFocus?: AudioFocusHost;
+    mediaManager?: PlaybackManager;
 } | undefined, PanoVideoPluginController>;
 export { _PanoVideoPluginType as PanoVideoPluginType };
 export type PanoVideoPluginParameterType = {
-    audioFocus?: AudioFocusHost;
+    mediaManager?: PlaybackManager;
 } | undefined;
 export type PanoVideoPluginReturnType = InstanceType<typeof PanoVideoPluginController>;
 export default PanoVideoPlugin;

package/libs/PanoVideoPlugin/index.js

@@ -1,7 +1,6 @@
 import { PanoVideoPluginController as i } from "./Controller.js";
-import { typings as zo } from "./typings/index.js";
+import { typings as vo } from "./typings/index.js";
 import "./VideoMeshController.js";
-import "../shared-utils/audioFocus.js";
 import "./utils/shader.js";
 import "../shared-utils/tag.js";
 import "../shared-utils/positionToVector3.js";
@@ -75,9 +74,9 @@ import "../shared-utils/animationFrame/index.js";
 import "./utils/index.js";
 import "../base/BasePlugin.js";
 import "../shared-utils/url/defaultUrls.js";
-const ko = (o, r) => new i(o, r);
+const jo = (o, r) => new i(o, r);
 export {
-  ko as PanoVideoPlugin,
-  zo as PanoVideoPluginType,
-  ko as default
+  jo as PanoVideoPlugin,
+  vo as PanoVideoPluginType,
+  jo as default
 };

package/libs/base/BasePlugin.d.ts

@@ -1,4 +1,4 @@
-import type { AudioFocusHost } from '../shared-utils/audioFocus';
+import type { PlaybackManager } from '../shared-utils/playback';
 import type { Five } from '@realsee/five';
 import { Subscribe } from '../shared-utils/Subscribe';
 import { WorkUtil } from '../shared-utils/Utils/WorkUtil';
@@ -26,7 +26,7 @@ interface BaseOptions {
     [key: string]: unknown;
 }
 interface Config {
-    audioFocus?: AudioFocusHost;
+    mediaManager?: PlaybackManager;
     /** 静态资源前缀 */
     staticPrefix?: string;
     /** 国际化转换函数 */

package/libs/base/BasePlugin.js

@@ -23,7 +23,7 @@ let I = class {
     /**
      * @realsee/dnalogel 版本号
      */
-    r(this, "VERSION", "3.81.10-alpha.0");
+    r(this, "VERSION", "3.81.10-alpha.2");
     r(this, "NAME");
     r(this, "five");
     r(this, "workUtil");

package/libs/index.d.ts

@@ -30,4 +30,4 @@ export * from './ModelMakerPlugin';
 export * from './DigitalPerformancePlugin';
 export * as DigitalPerformanceV2 from './DigitalPerformanceV2Plugin';
 export * as Util from './shared-utils/exports';
-export type { AudioIntent, AudioStopReason, AudioLease, AudioSource, AudioFocusHost } from './shared-utils/audioFocus';
+export type { PlaybackManager, PlaybackController, PlaybackSession, MediaOperations } from './shared-utils/playback';