@realsee/dnalogel 2.9.0-0 → 2.9.0-alpha.0

package/libs/PanoVideoPlugin/VideoMeshController.js

@@ -1,152 +0,0 @@
-var l = Object.defineProperty;
-var f = (o, e, t) => e in o ? l(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
-var i = (o, e, t) => (f(o, typeof e != "symbol" ? e + "" : e, t), t);
-import { vertexShader as p, fragmentShader as m } from "./utils/shader.js";
-import "hammerjs";
-import { VideoTexture as g, LinearFilter as v, ShaderMaterial as F, Vector4 as c, SphereBufferGeometry as E, Mesh as A, Quaternion as D, Vector3 as I } from "three";
-import "@realsee/five";
-import "@tweenjs/tween.js";
-import "../CSS3DRenderPlugin/CSS3DRender.js";
-import "../CSS3DRenderPlugin/utils/generateBehindFiveElement.js";
-import { requestAnimationFrameInterval as M } from "../shared-utils/animationFrame/index.js";
-import "../CSS3DRenderPlugin/utils/three/CSS3DRenderer.js";
-import "three/examples/jsm/renderers/CSS3DRenderer";
-import "../CSS3DRenderPlugin/utils/getAllCSS3DObject.js";
-import "../CSS3DRenderPlugin/utils/createResizeObserver.js";
-import "../CSS3DRenderPlugin/utils/even.js";
-import "../shared-utils/Subscribe.js";
-import "../CSS3DRenderPlugin/utils/positionToVector3.js";
-import "../CSS3DRenderPlugin/utils/three/CSS3DObject.js";
-import "../CSS3DRenderPlugin/utils/centerPoint.js";
-import "../CSS3DRenderPlugin/utils/three/OpacityMesh.js";
-import "../CSS3DRenderPlugin/utils/three/CSS3DScene.js";
-import "../CSS3DRenderPlugin/utils/three/CSS3DGroup.js";
-import "../shared-utils/animationFrame/BetterTween.js";
-class j {
-  constructor(e, t) {
-    i(this, "_id");
-    i(this, "url");
-    i(this, "five");
-    i(this, "panoIndex");
-    i(this, "origin");
-    i(this, "video");
-    i(this, "videoMesh");
-    i(this, "_enabled", !0);
-    i(this, "_disposed", !1);
-    i(this, "hasVideoEverPlayed", !1);
-    i(this, "renderFiveDisposer");
-    i(this, "onFiveDataLoaded", () => {
-      var d;
-      const e = (d = this.five.work) == null ? void 0 : d.observers[this.panoIndex];
-      if (!e)
-        return this.logWarning(`\u70B9\u4F4D ${this.panoIndex} \u4E0D\u5B58\u5728\uFF0C\u8BF7\u68C0\u67E5 Five \u6570\u636E\u662F\u5426\u6B63\u5E38\u3002`);
-      const { x: t, y: n, z: r, w: h } = e.quaternion, a = new D(t, n, r, h), s = e.position;
-      this.videoMesh.position.fromArray([s.x, s.y, s.z]), this.videoMesh.quaternion.set(0, 0, 0, 1), this.videoMesh.rotateOnAxis(new I(0, 1, 0), Math.PI / 2), this.videoMesh.applyQuaternion(a);
-    });
-    i(this, "onFiveWantsMoveToPano", (e) => {
-      e === this.panoIndex && (this.hasVideoEverPlayed || this.video.play().catch((t) => {
-        console.log("\u{1F436} ==> error:", t);
-      }));
-    });
-    i(this, "onFivePanoArrived", (e) => {
-      if (this.disposed)
-        return this.logWarning("\u5B9E\u4F8B\u5DF2\u88AB\u9500\u6BC1");
-      !this.enabled || this.panoIndex === e && this.mount();
-    });
-    i(this, "onFivePanoWillArrive", (e) => {
-      if (e !== this.panoIndex)
-        return this.unmount();
-      this.panoIndex !== e && this.unmount();
-    });
-    i(this, "onFiveModeChange", (e) => {
-      e !== "Panorama" && this.hide();
-    });
-    i(this, "onFiveInitAnimationEnded", () => {
-      const e = this.five.getCurrentState();
-      e.mode === "Panorama" && e.panoIndex === this.panoIndex && this.mount();
-    });
-    i(this, "onVideoPlaying", () => {
-      this.hasVideoEverPlayed = !0, this.video.src !== "" && (this.renderFiveDisposer = M(() => {
-        this.five.needsRender = !0;
-      }), this.five.scene.add(this.videoMesh));
-    });
-    i(this, "onVideoPaused", () => {
-      var e;
-      (e = this.renderFiveDisposer) == null || e.call(this);
-    });
-    var d, u;
-    this.five = e, this.panoIndex = t.panoIndex, this._id = t.renderID, this.url = t.url, this.origin = t.origin.slice(), this._enabled = (u = (d = t.initialState) == null ? void 0 : d.enabled) != null ? u : !0;
-    const n = document.createElement("video");
-    n.crossOrigin = "anonymous", n.autoplay = !1, n.muted = !0, n.loop = !1, n.playsInline = !0, this.video = n;
-    const r = new g(this.video);
-    r.minFilter = v, r.magFilter = v;
-    const h = new F({
-      vertexShader: p,
-      fragmentShader: m,
-      uniforms: {
-        map: { value: r },
-        size: {
-          value: new c(this.origin[0], 1 - this.origin[1] - this.origin[3], this.origin[2], this.origin[3])
-        }
-      },
-      depthTest: !0,
-      transparent: !0
-    }), a = new E(1, 64, 64);
-    a.scale(-1, 1, 1);
-    const s = new A(a, h);
-    s.name = "pano-video", this.videoMesh = s, this.five.work && this.onFiveDataLoaded(), this.enabled && this.addEventListeners(), this.mountIfNeeded();
-  }
-  get renderID() {
-    return this._id;
-  }
-  get disposed() {
-    return this._disposed;
-  }
-  get enabled() {
-    return this._enabled;
-  }
-  dispose() {
-    this.disposed || (this.disable(), this._disposed = !0);
-  }
-  enable() {
-    this.disposed || this.enabled || (this._enabled = !0, this.addEventListeners(), this.mountIfNeeded());
-  }
-  disable() {
-    this.disposed || !this.enabled || (this._enabled = !1, this.removeEventListeners(), this.unmount());
-  }
-  addEventListeners() {
-    this.five.on("loaded", this.onFiveDataLoaded), this.five.on("modeChange", this.onFiveModeChange), this.five.on("panoArrived", this.onFivePanoArrived), this.five.on("panoWillArrive", this.onFivePanoWillArrive), this.five.on("wantsMoveToPano", this.onFiveWantsMoveToPano), this.five.on("initAnimationEnded", this.onFiveInitAnimationEnded), this.video.addEventListener("playing", this.onVideoPlaying);
-  }
-  removeEventListeners() {
-    this.five.off("loaded", this.onFiveDataLoaded), this.five.off("modeChange", this.onFiveModeChange), this.five.off("panoArrived", this.onFivePanoArrived), this.five.off("panoWillArrive", this.onFivePanoWillArrive), this.five.off("wantsMoveToPano", this.onFiveWantsMoveToPano), this.five.off("initAnimationEnded", this.onFiveInitAnimationEnded), this.video.removeEventListener("playing", this.onVideoPlaying);
-  }
-  mountIfNeeded() {
-    const e = this.five.getCurrentState();
-    e.mode === "Panorama" && e.panoIndex === this.panoIndex && this.enabled && this.mount();
-  }
-  mount() {
-    if (this.disposed)
-      return this.logWarning("\u63D2\u4EF6\u5DF2\u7ECF\u9500\u6BC1\uFF0C\u65E0\u6CD5\u6302\u8F7D\u3002");
-    if (this.url === "")
-      return this.logWarning("\u89C6\u9891\u8D44\u6E90\u4E0D\u5B58\u5728\u3002");
-    this.video.src !== this.url && (this.video.src = this.url), this.video.paused && this.video.play().catch((e) => {
-      this.logWarning(e instanceof Error ? e.message : "\u89C6\u9891\u64AD\u653E\u5931\u8D25\u3002"), this.five.once("gesture", () => {
-        this.video.play().catch((t) => {
-          this.logWarning(t instanceof Error ? t.message : "\u81EA\u52A8\u64AD\u653E\u89C6\u9891\u5931\u8D25\u3002");
-        });
-      });
-    });
-  }
-  unmount() {
-    this.video.pause(), this.video.src !== "" && (this.video.src = ""), this.five.scene.remove(this.videoMesh);
-  }
-  hide() {
-    this.video.pause(), this.five.scene.remove(this.videoMesh);
-  }
-  logWarning(e) {
-    console.warn("\u26D4 ==> [VideoMeshController]:", e);
-  }
-}
-export {
-  j as VideoMeshController
-};

package/libs/PanoVideoPlugin/index.d.ts

@@ -1,16 +0,0 @@
-import type { FivePlugin } from '@realsee/five';
-import { PanoVideoPluginController } from './Controller';
-import * as _PanoVideoPluginType from './typings';
-/** 点位视频播放插件
- * - 支持一次性加载多组数据。
- * - 走到点位上时播放视频（可能是多个）。
- * - 走出点位时销毁视频。
- * - 允许动态开启和禁用功能。
- * - 视频只能在全景模式且点位一致时才会播放。不满足条件会自动销毁。
- * - 不做多媒体缓存，缓解内存占用。
- */
-export declare const PanoVideoPlugin: FivePlugin<undefined, PanoVideoPluginController>;
-export { _PanoVideoPluginType as PanoVideoPluginType };
-export declare type PanoVideoPluginParameterType = undefined;
-export declare type PanoVideoPluginReturnType = InstanceType<typeof PanoVideoPluginController>;
-export default PanoVideoPlugin;

package/libs/PanoVideoPlugin/index.js

@@ -1,31 +0,0 @@
-import { PanoVideoPluginController as r } from "./Controller.js";
-import { typings as z } from "./typings/index.js";
-import "./VideoMeshController.js";
-import "./utils/shader.js";
-import "hammerjs";
-import "three";
-import "@realsee/five";
-import "@tweenjs/tween.js";
-import "../CSS3DRenderPlugin/CSS3DRender.js";
-import "../CSS3DRenderPlugin/utils/three/CSS3DRenderer.js";
-import "three/examples/jsm/renderers/CSS3DRenderer";
-import "../CSS3DRenderPlugin/utils/getAllCSS3DObject.js";
-import "../CSS3DRenderPlugin/utils/createResizeObserver.js";
-import "../CSS3DRenderPlugin/utils/even.js";
-import "../shared-utils/Subscribe.js";
-import "../CSS3DRenderPlugin/utils/positionToVector3.js";
-import "../CSS3DRenderPlugin/utils/three/CSS3DObject.js";
-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/index.js";
-import "../shared-utils/animationFrame/BetterTween.js";
-import "../base/BasePlugin.js";
-const k = (o) => new r(o);
-export {
-  k as PanoVideoPlugin,
-  z as PanoVideoPluginType,
-  k as default
-};

package/libs/PanoVideoPlugin/typings/index.js

@@ -1,6 +0,0 @@
-const e = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
-  __proto__: null
-}, Symbol.toStringTag, { value: "Module" }));
-export {
-  e as typings
-};

package/libs/PanoVideoPlugin/typings.d.ts

@@ -1,64 +0,0 @@
-import type * as BasePlugin from '../base/BasePlugin';
-/** 单个视频元素 */
-export interface VideoItem {
-    /** client render ID
-     * @remarks 为什么不用 id 作为唯一标识？
-     * - id 是后端生成的，而 render_id 是前端生成的，在编辑时为了保证在请求后端数据之前也能进行渲染，使用额外的 id 进行渲染。
-     * - 为了保证两端的数据一致性，插件里使用 render_id 作为唯一 ID。
-     */
-    render_id: string;
-    /** 文件地址 */
-    url: string;
-    /** 算法处理的视频 uv 信息
-     * @description [left, top, width, height]
-     */
-    origin: number[];
-}
-/** 点位视频元素 */
-export interface PanoVideoItem {
-    /** client render ID */
-    render_id: string;
-    /** 视频播放点位 */
-    pano_index: number;
-    /** 视频列表 */
-    video_list: VideoItem[];
-}
-/** 点位视频模型参数 */
-export interface VideoMeshParams {
-    /** client render ID */
-    renderID: string;
-    /** video 文件地址 */
-    url: string;
-    /** 算法处理的视频 uv 信息
-     * @description [left, top, width, height]
-     */
-    origin: number[];
-    /** 视频播放点位 */
-    panoIndex: number;
-    /** 初始状态 */
-    initialState?: {
-        enabled?: boolean;
-    };
-}
-/** 加载数据时的额外参数 */
-export interface LoadParams {
-    initialState?: {
-        enabled?: boolean;
-    };
-}
-export interface PluginState {
-    enabled: boolean;
-}
-export interface PluginData {
-    list: PanoVideoItem[];
-}
-export interface PluginEventMap extends BasePlugin.EventMap<PluginState> {
-    /** 点位视频模型开启 */
-    enable: (params: {
-        userAction: boolean;
-    }) => void;
-    /** 点位视频模型关闭 */
-    disable: (params: {
-        userAction: boolean;
-    }) => void;
-}

package/libs/PanoVideoPlugin/typings.js

@@ -1 +0,0 @@
-

package/libs/PanoVideoPlugin/utils/shader.d.ts

@@ -1,2 +0,0 @@
-export declare const vertexShader = "\nvarying vec2 vUv;\nvoid main() {\n  vUv = uv;\n  vec4 mvPosition = modelViewMatrix * vec4(position, 1);\n  gl_Position = projectionMatrix * mvPosition;\n}\n";
-export declare const fragmentShader = "\nuniform sampler2D map;\nuniform vec4 size;\nvarying vec2 vUv;\n\nvoid main() {\n  vec2 uv = vec2((vUv.x - size[0]) / size[2], (vUv.y - size[1]) / size[3]);\n  float a = 0.1;\n  float transX = uv.x < a ? 1.0 / a * uv.x : (uv.x > (1.0 - a) ? 1.0 / a * (1.0 - uv.x) : 1.0);\n  float transY = uv.y < a ? 1.0 / a * uv.y : (uv.y > (1.0 - a) ? 1.0 / a * (1.0 - uv.y) : 1.0);\n\tfloat match = (1.0 - step(0.5, abs(uv.x - 0.5))) * (1.0 - step(0.5, abs(uv.y - 0.5))) * (transX < transY ? transX : transY);\n  gl_FragColor = vec4(texture2D(map, uv).xyz, match);\n}\n";

package/libs/PanoVideoPlugin/utils/shader.js

@@ -1,25 +0,0 @@
-const v = `
-varying vec2 vUv;
-void main() {
-  vUv = uv;
-  vec4 mvPosition = modelViewMatrix * vec4(position, 1);
-  gl_Position = projectionMatrix * mvPosition;
-}
-`, a = `
-uniform sampler2D map;
-uniform vec4 size;
-varying vec2 vUv;
-
-void main() {
-  vec2 uv = vec2((vUv.x - size[0]) / size[2], (vUv.y - size[1]) / size[3]);
-  float a = 0.1;
-  float transX = uv.x < a ? 1.0 / a * uv.x : (uv.x > (1.0 - a) ? 1.0 / a * (1.0 - uv.x) : 1.0);
-  float transY = uv.y < a ? 1.0 / a * uv.y : (uv.y > (1.0 - a) ? 1.0 / a * (1.0 - uv.y) : 1.0);
-	float match = (1.0 - step(0.5, abs(uv.x - 0.5))) * (1.0 - step(0.5, abs(uv.y - 0.5))) * (transX < transY ? transX : transY);
-  gl_FragColor = vec4(texture2D(map, uv).xyz, match);
-}
-`;
-export {
-  a as fragmentShader,
-  v as vertexShader
-};