@realsee/vreo 2.4.7 → 2.5.0-alpha.2

package/lib/Player/modules/VideoAgent/VideoAgentMesh.d.ts

@@ -1,5 +1,8 @@
 import * as THREE from 'three';
 import AudioLike from '../../../shared-utils/AudioLike';
+/**
+ * 视频经纪人贴片的配置选项
+ */
 export interface VideoAgentMeshOptions {
     /**
      * 自定义视频实例。
@@ -17,31 +20,129 @@ export interface VideoAgentMeshOptions {
     preload?: boolean;
 }
 /**
- * 视频经纪人MESH
+ * 视频经纪人贴片类
+ *
+ * 基于 THREE.js 的网格对象，作为 VR 视频播放的核心媒体管理组件。
+ * 负责视频和音频的播放控制、时间同步、绿幕抠图渲染等功能。
+ *
+ * 主要特性：
+ * - 支持绿幕抠图渲染（ChromaKey）
+ * - 音视频同步播放管理
+ * - 媒体预载优化策略
+ * - 跨平台播放兼容性
+ *
+ * @example
+ * ```typescript
+ * const videoMesh = new VideoAgentMesh(1920, 1080, 32, 18, {
+ *   preload: true,
+ *   videoInstance: customVideoElement
+ * })
+ *
+ * // 播放视频
+ * await videoMesh.play('https://example.com/video.mp4', 0, 60)
+ *
+ * // 获取当前时间
+ * console.log(videoMesh.currentTime)
+ *
+ * // 销毁资源
+ * videoMesh.dispose()
+ * ```
  */
 export declare class VideoAgentMesh extends THREE.Mesh {
+    /** 配置选项 */
     options: VideoAgentMeshOptions;
+    /** 当前视频URL */
     videoUrl?: string;
+    /** 是否冻结状态 */
     freeze: boolean;
+    /** 是否暂停状态 */
     paused: boolean;
+    /** 音频实例 */
     audioInstance: HTMLAudioElement;
+    /** AudioLike 实例 */
     audioLikeInstance: AudioLike;
+    /** 移除事件监听器的函数 */
     $removeEventListener: () => void;
+    /**
+     * 获取当前的媒体实例
+     *
+     * 根据媒体类型自动返回对应的播放实例：
+     * - 无媒体时返回 AudioLike 实例
+     * - 音频文件返回 HTMLAudioElement
+     * - 视频文件返回 HTMLVideoElement
+     *
+     * @returns 当前活跃的媒体播放实例
+     */
     get mediaInstance(): HTMLAudioElement | HTMLVideoElement | AudioLike;
     /**
+     * 创建视频经纪人贴片实例
      *
-     * @param width
-     * @param height
-     * @param widthSegments
-     * @param heightSegments
-     * @param options
+     * @param width - 网格宽度
+     * @param height - 网格高度
+     * @param widthSegments - 宽度方向分段数
+     * @param heightSegments - 高度方向分段数
+     * @param options - 配置选项
+     *
+     * @example
+     * ```typescript
+     * const mesh = new VideoAgentMesh(1920, 1080, 32, 18, {
+     *   preload: true,
+     *   videoInstance: document.getElementById('video')
+     * })
+     * ```
      */
     constructor(width: number, height: number, widthSegments: number, heightSegments: number, options?: VideoAgentMeshOptions);
+    /**
+     * 更新媒体资源
+     *
+     * 内部方法，负责加载新的视频/音频资源，处理预载逻辑和着色器设置
+     * @param videoUrl - 媒体文件URL
+     * @private
+     */
     private update;
+    /**
+     * 播放媒体内容
+     *
+     * 支持多种播放模式：
+     * - 播放指定视频/音频文件
+     * - 仅设置时长（无媒体文件）
+     * - 继续播放当前媒体
+     *
+     * @param videoUrl - 媒体文件URL，默认为空字符串
+     * @param currentTime - 播放起始时间（秒），默认为 0
+     * @param duration - 媒体总时长（秒），可选
+     * @returns Promise<boolean> 播放是否成功
+     *
+     * @example
+     * ```typescript
+     * // 播放视频文件
+     * await mesh.play('video.mp4', 10, 120)
+     *
+     * // 仅设置时长（音频跟踪）
+     * await mesh.play('', 0, 60)
+     *
+     * // 继续播放当前媒体
+     * await mesh.play()
+     * ```
+     */
     play(videoUrl?: string, currentTime?: number, duration?: number): Promise<unknown>;
     /**
-     * 秒转成毫秒，保障精准度
+     * 获取当前播放时间（毫秒）
+     *
+     * 将媒体实例的秒级时间转换为毫秒，提供更高精度的时间控制
+     * @returns 当前播放时间戳（毫秒）
      */
     get currentTime(): number;
+    /**
+     * 销毁视频经纪人贴片实例
+     *
+     * 清理所有事件监听器、DOM元素和缓存实例，释放内存资源
+     *
+     * @example
+     * ```typescript
+     * // 在组件卸载时调用
+     * videoMesh.dispose()
+     * ```
+     */
     dispose(): void;
 }

package/lib/Player/modules/VideoAgent/VideoAgentMesh.js

@@ -1,45 +1,76 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.VideoAgentMesh = void 0;
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var THREE = _interopRequireWildcard(require("three"));
-var _Preloader = require("../../../shared-utils/Preloader");
-var _mobx = require("mobx");
-var _AudioLike = _interopRequireDefault(require("../../../shared-utils/AudioLike"));
-var _getMediaInfo = require("../../../shared-utils/getMediaInfo");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) { "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); } return f; })(e, t); }
-function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2["default"])(t); if (r) { var s = (0, _getPrototypeOf2["default"])(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2["default"])(this, e); }; }
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = _getPrototypeOf(t); if (r) { var s = _getPrototypeOf(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return _possibleConstructorReturn(this, e); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+import * as THREE from 'three';
+import { Preloader } from "../../../shared-utils/Preloader.js";
+import { makeObservable, observable, runInAction } from 'mobx';
+import AudioLike from "../../../shared-utils/AudioLike.js";
+import { getMediaType } from "../../../shared-utils/getMediaInfo.js";
 var vertexShader = "\nvarying vec2 vUv;\nvarying vec2 vColorUv;\nvarying vec2 vMaskUv;\nvoid main(){\n  vUv = uv;\n  vColorUv = vec2(uv.x / 2.0, uv.y);\n  vMaskUv = vec2(0.5 + uv.x / 2.0, uv.y);\n  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\n}\n";
 var fragmentShaderTpl = function fragmentShaderTpl() {
   return "\nuniform int enable;\nuniform sampler2D map;\nvarying vec2 vUv;\nvarying vec2 vColorUv;\nvarying vec2 vMaskUv;\n\nvec3 hsv2rgb(vec3 c) {\n  const vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n  vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n  return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);\n}\n\nvec3 rgb2hsv(vec3 c) {\n  const vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n  vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));\n  vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));\n\n  float d = q.x - min(q.w, q.y);\n  return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + 0.001)), d / (q.x + 0.001), q.x);\n}\n\nvoid main(void) {\n  vec3 color = texture2D(map, vUv).xyz;\n  float amask = 1.0;\n\n  float ref = color.r;\n  if (ref < color.b) ref = color.b;\n  amask = color.g - ref + 0.1;\n  amask = smoothstep(0.1, 0.3, amask);\n  amask = 1.0 - amask;\n\n  vec3 target = rgb2hsv(vec3(0.0 / 255.0, 255.0 / 255.0, 0.0 / 255.0));\n  vec3 hsv = rgb2hsv(color);\n  float distance = abs(hsv.x - target.x);\n  if (distance < 0.15) {\n    hsv.y = 0.0;\n  }\n  color = hsv2rgb(hsv);\n\n  gl_FragColor = vec4(color.rgb, amask * float(enable));\n}\n";
 };
 var cacheInstance = {};
+
+/**
+ * 视频经纪人贴片的配置选项
+ */
+
 /**
- * 视频经纪人MESH
+ * 视频经纪人贴片类
+ * 
+ * 基于 THREE.js 的网格对象，作为 VR 视频播放的核心媒体管理组件。
+ * 负责视频和音频的播放控制、时间同步、绿幕抠图渲染等功能。
+ * 
+ * 主要特性：
+ * - 支持绿幕抠图渲染（ChromaKey）
+ * - 音视频同步播放管理
+ * - 媒体预载优化策略
+ * - 跨平台播放兼容性
+ * 
+ * @example
+ * ```typescript
+ * const videoMesh = new VideoAgentMesh(1920, 1080, 32, 18, {
+ *   preload: true,
+ *   videoInstance: customVideoElement
+ * })
+ * 
+ * // 播放视频
+ * await videoMesh.play('https://example.com/video.mp4', 0, 60)
+ * 
+ * // 获取当前时间
+ * console.log(videoMesh.currentTime)
+ * 
+ * // 销毁资源
+ * videoMesh.dispose()
+ * ```
  */
-var VideoAgentMesh = exports.VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
-  (0, _inherits2["default"])(VideoAgentMesh, _THREE$Mesh);
+export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
+  _inherits(VideoAgentMesh, _THREE$Mesh);
   var _super = _createSuper(VideoAgentMesh);
   /**
-   *
-   * @param width
-   * @param height
-   * @param widthSegments
-   * @param heightSegments
-   * @param options
+   * 创建视频经纪人贴片实例
+   * 
+   * @param width - 网格宽度
+   * @param height - 网格高度  
+   * @param widthSegments - 宽度方向分段数
+   * @param heightSegments - 高度方向分段数
+   * @param options - 配置选项
+   * 
+   * @example
+   * ```typescript
+   * const mesh = new VideoAgentMesh(1920, 1080, 32, 18, {
+   *   preload: true,
+   *   videoInstance: document.getElementById('video')
+   * })
+   * ```
    */
   function VideoAgentMesh(width, height, widthSegments, heightSegments) {
     var _this$options$videoIn, _this$options$videoIn2;
@@ -47,7 +78,7 @@ var VideoAgentMesh = exports.VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh
     var options = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {
       preload: true
     };
-    (0, _classCallCheck2["default"])(this, VideoAgentMesh);
+    _classCallCheck(this, VideoAgentMesh);
     if (!options.videoInstance) {
       if (cacheInstance.videoInstance) {
         options.videoInstance = cacheInstance.videoInstance;
@@ -99,12 +130,12 @@ var VideoAgentMesh = exports.VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh
     } else {
       _this.audioInstance = options.audioInstance;
     }
-    _this.audioLikeInstance = new _AudioLike["default"]();
-    (0, _mobx.makeObservable)((0, _assertThisInitialized2["default"])(_this), {
-      paused: _mobx.observable
+    _this.audioLikeInstance = new AudioLike();
+    makeObservable(_assertThisInitialized(_this), {
+      paused: observable
     });
     var updatePaused = function updatePaused(paused) {
-      return (0, _mobx.runInAction)(function () {
+      return runInAction(function () {
         return _this.paused = paused;
       });
     };
@@ -131,13 +162,45 @@ var VideoAgentMesh = exports.VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh
     };
     return _this;
   }
-  (0, _createClass2["default"])(VideoAgentMesh, [{
+
+  /**
+   * 更新媒体资源
+   * 
+   * 内部方法，负责加载新的视频/音频资源，处理预载逻辑和着色器设置
+   * @param videoUrl - 媒体文件URL
+   * @private
+   */
+  _createClass(VideoAgentMesh, [{
     key: "mediaInstance",
-    get: function get() {
+    get: /** 配置选项 */
+
+    /** 当前视频URL */
+
+    /** 是否冻结状态 */
+
+    /** 是否暂停状态 */
+
+    /** 音频实例 */
+
+    /** AudioLike 实例 */
+
+    /** 移除事件监听器的函数 */
+
+    /**
+     * 获取当前的媒体实例
+     * 
+     * 根据媒体类型自动返回对应的播放实例：
+     * - 无媒体时返回 AudioLike 实例
+     * - 音频文件返回 HTMLAudioElement
+     * - 视频文件返回 HTMLVideoElement
+     * 
+     * @returns 当前活跃的媒体播放实例
+     */
+    function get() {
       if (!this.videoUrl) {
         return this.audioLikeInstance;
       }
-      if ((0, _getMediaInfo.getMediaType)(this.videoUrl) === 'audio') {
+      if (getMediaType(this.videoUrl) === 'audio') {
         return this.audioInstance;
       }
       var uniforms = this.material.uniforms;
@@ -146,11 +209,11 @@ var VideoAgentMesh = exports.VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh
     }
   }, {
     key: "update",
-    value: function () {
-      var _update = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(videoUrl) {
+    value: (function () {
+      var _update = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(videoUrl) {
         var _this2 = this;
         var uniforms, onStart;
-        return _regenerator["default"].wrap(function _callee$(_context) {
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) {
             switch (_context.prev = _context.next) {
               case 0:
@@ -175,13 +238,13 @@ var VideoAgentMesh = exports.VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh
               case 6:
                 uniforms = this.material.uniforms;
                 this.mediaInstance.muted = true;
-                if (!(this.options.preload || this.options.preload === undefined || (0, _getMediaInfo.getMediaType)(this.videoUrl) === 'video')) {
+                if (!(this.options.preload || this.options.preload === undefined || getMediaType(this.videoUrl) === 'video')) {
                   _context.next = 18;
                   break;
                 }
                 _context.t1 = URL;
                 _context.next = 12;
-                return _Preloader.Preloader.blob(this.videoUrl);
+                return Preloader.blob(this.videoUrl);
               case 12:
                 _context.t2 = _context.sent;
                 _context.next = 15;
@@ -199,7 +262,7 @@ var VideoAgentMesh = exports.VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh
                   if (_this2.mediaInstance.currentTime === 0) return;
                   _this2.freeze = false;
                   _this2.mediaInstance.muted = false;
-                  uniforms.enable.value = (0, _getMediaInfo.getMediaType)(_this2.videoUrl) ? 1 : 0;
+                  uniforms.enable.value = getMediaType(_this2.videoUrl) ? 1 : 0;
                   _this2.mediaInstance.removeEventListener('timeupdate', onStart, false);
                 };
                 this.mediaInstance.addEventListener('timeupdate', onStart, false);
@@ -215,16 +278,42 @@ var VideoAgentMesh = exports.VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh
       }
       return update;
     }()
+    /**
+     * 播放媒体内容
+     * 
+     * 支持多种播放模式：
+     * - 播放指定视频/音频文件
+     * - 仅设置时长（无媒体文件）
+     * - 继续播放当前媒体
+     * 
+     * @param videoUrl - 媒体文件URL，默认为空字符串
+     * @param currentTime - 播放起始时间（秒），默认为 0
+     * @param duration - 媒体总时长（秒），可选
+     * @returns Promise<boolean> 播放是否成功
+     * 
+     * @example
+     * ```typescript
+     * // 播放视频文件
+     * await mesh.play('video.mp4', 10, 120)
+     * 
+     * // 仅设置时长（音频跟踪）
+     * await mesh.play('', 0, 60)
+     * 
+     * // 继续播放当前媒体
+     * await mesh.play()
+     * ```
+     */
+    )
   }, {
     key: "play",
-    value: function () {
-      var _play = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee3() {
+    value: (function () {
+      var _play = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
         var _this3 = this;
         var videoUrl,
           currentTime,
           duration,
           _args3 = arguments;
-        return _regenerator["default"].wrap(function _callee3$(_context3) {
+        return _regeneratorRuntime.wrap(function _callee3$(_context3) {
           while (1) {
             switch (_context3.prev = _context3.next) {
               case 0:
@@ -278,8 +367,8 @@ var VideoAgentMesh = exports.VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh
                 this.mediaInstance.pause();
                 _context3.next = 28;
                 return new Promise(function (resolve) {
-                  return setTimeout(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee2() {
-                    return _regenerator["default"].wrap(function _callee2$(_context2) {
+                  return setTimeout(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+                    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
                       while (1) {
                         switch (_context2.prev = _context2.next) {
                           case 0:
@@ -311,13 +400,29 @@ var VideoAgentMesh = exports.VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh
       return play;
     }()
     /**
-     * 秒转成毫秒，保障精准度
+     * 获取当前播放时间（毫秒）
+     * 
+     * 将媒体实例的秒级时间转换为毫秒，提供更高精度的时间控制
+     * @returns 当前播放时间戳（毫秒）
      */
+    )
   }, {
     key: "currentTime",
     get: function get() {
       return this.mediaInstance.currentTime * 1000;
     }
+
+    /**
+     * 销毁视频经纪人贴片实例
+     * 
+     * 清理所有事件监听器、DOM元素和缓存实例，释放内存资源
+     * 
+     * @example
+     * ```typescript
+     * // 在组件卸载时调用
+     * videoMesh.dispose()
+     * ```
+     */
   }, {
     key: "dispose",
     value: function dispose() {

package/lib/Player/modules/VideoAgent/VideoAgentScene.js

@@ -1,42 +1,33 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.VideoAgentScene = void 0;
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var THREE = _interopRequireWildcard(require("three"));
-var _addResizeListener = require("../../../shared-utils/addResizeListener");
-var _VideoAgentMesh = require("./VideoAgentMesh");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) { "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); } return f; })(e, t); }
-var VideoAgentScene = exports.VideoAgentScene = /*#__PURE__*/(0, _createClass2["default"])(function VideoAgentScene(container, options) {
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import * as THREE from 'three';
+import { addResizeListener } from "../../../shared-utils/addResizeListener.js";
+import { VideoAgentMesh } from "./VideoAgentMesh.js";
+export var VideoAgentScene = /*#__PURE__*/_createClass(function VideoAgentScene(container, options) {
   var _this = this;
-  (0, _classCallCheck2["default"])(this, VideoAgentScene);
-  (0, _defineProperty2["default"])(this, "scene", new THREE.Scene());
-  (0, _defineProperty2["default"])(this, "camera", new THREE.OrthographicCamera(-240, 240, 135, -135));
-  (0, _defineProperty2["default"])(this, "renderer", new THREE.WebGLRenderer({
+  _classCallCheck(this, VideoAgentScene);
+  _defineProperty(this, "scene", new THREE.Scene());
+  _defineProperty(this, "camera", new THREE.OrthographicCamera(-240, 240, 135, -135));
+  _defineProperty(this, "renderer", new THREE.WebGLRenderer({
     alpha: true
   }));
-  (0, _defineProperty2["default"])(this, "disposers", []);
-  (0, _defineProperty2["default"])(this, "run", function () {
+  _defineProperty(this, "disposers", []);
+  _defineProperty(this, "run", function () {
     // 视频开始 1s 不渲染：规避某些设备黑屏闪烁问题。视频前 2s 是最好是静默的。
     if (!(_this.videoAgentMesh.paused || _this.videoAgentMesh.freeze) && _this.videoAgentMesh.currentTime > 1000) {
       _this.renderer.render(_this.scene, _this.camera);
     }
     requestAnimationFrame(_this.run);
   });
-  (0, _defineProperty2["default"])(this, "dispose", function () {
+  _defineProperty(this, "dispose", function () {
     var _this$videoAgentMesh;
     (_this$videoAgentMesh = _this.videoAgentMesh) === null || _this$videoAgentMesh === void 0 ? void 0 : _this$videoAgentMesh.dispose();
     _this.disposers.forEach(function (disposer) {
       return disposer === null || disposer === void 0 ? void 0 : disposer();
     });
   });
-  this.videoAgentMesh = new _VideoAgentMesh.VideoAgentMesh(480, 270, 1, 1, options);
+  this.videoAgentMesh = new VideoAgentMesh(480, 270, 1, 1, options);
 
   // const needRender = getMediaType(this.videoAgentMesh.videoUrl) === 'video'
 
@@ -45,7 +36,7 @@ var VideoAgentScene = exports.VideoAgentScene = /*#__PURE__*/(0, _createClass2["
     this.camera.lookAt(0, 0, 0);
     var domElement = this.renderer.domElement;
     domElement.classList.add('VideoAgent-canvas');
-    var dispose = (0, _addResizeListener.addResizeListener)(container, function (width, height) {
+    var dispose = addResizeListener(container, function (width, height) {
       _this.renderer.setSize(width * window.devicePixelRatio, height * window.devicePixelRatio);
       domElement.style.width = "".concat(width, "px");
       domElement.style.height = "".concat(height, "px");

package/lib/Player/modules/VideoAgent/index.js

@@ -1,20 +1,11 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.VideoAgent = VideoAgent;
-var React = _interopRequireWildcard(require("react"));
-var _hooks = require("../../hooks");
-var _VideoAgentScene = require("./VideoAgentScene");
-var _classnames = _interopRequireDefault(require("classnames"));
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) { "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); } return f; })(e, t); }
-function VideoAgent(props) {
+import * as React from 'react';
+import { useController } from "../../hooks.js";
+import { VideoAgentScene } from "./VideoAgentScene.js";
+import classNames from 'classnames';
+export function VideoAgent(props) {
   var _controller$avatar2;
   var ref = React.useRef(null);
-  var controller = (0, _hooks.useController)();
+  var controller = useController();
   var showAvatar = React.useMemo(function () {
     var _controller$avatar;
     return ((_controller$avatar = controller.avatar) === null || _controller$avatar === void 0 ? void 0 : _controller$avatar.url) && controller.avatar.force === true;
@@ -30,7 +21,7 @@ function VideoAgent(props) {
       console.warn('VideoAgentScene" 重复初始化，已被过滤');
       return;
     }
-    var videoAgentScene = new _VideoAgentScene.VideoAgentScene(ref.current, props.options);
+    var videoAgentScene = new VideoAgentScene(ref.current, props.options);
     controller.videoAgentScene = videoAgentScene;
     return function () {
       var _controller$videoAgen2;
@@ -53,7 +44,7 @@ function VideoAgent(props) {
       return (_props$onClick = props.onClick) === null || _props$onClick === void 0 ? void 0 : _props$onClick.call(props);
     }
   }))), /*#__PURE__*/React.createElement("div", {
-    className: (0, _classnames["default"])('VideoAgent', {
+    className: classNames('VideoAgent', {
       hide: !showVideoAgent
     })
   }, /*#__PURE__*/React.createElement("div", {