@realsee/vreo 2.5.0 → 2.6.0

package/lib/PlayController/createHTMLAudioElement.js

@@ -1,14 +1,7 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.createHTMLAudioElement = createHTMLAudioElement;
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
 var BLANK_AUDIO = '' + 'data:audio/mpeg;base64,' + '//uQxAAAAAAAAAAAAAAAAAAAAAAASW5mbwAAAA8AAAADAAAGhgBVVVVVVVVVVVVVVVVVVVVVVVV' + 'VVVVVVVVVVVVVVVVVVVWqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqr///////////' + '////////////////////////////////8AAAA5TEFNRTMuOThyAc0AAAAAAAAAABSAJAiqQgAAg' + 'AAABobxtI73AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA' + 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA' + 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA' + 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA' + 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA//uQxAACFEII9ACZ/sJZwWEoEb8w/////N//////Jcxj' + 'Hjf+7/v/H2PzCCFAiDtGeyBCIx7bJJ1mmEEMy6g8mm2c8nrGABB4h2Mkmn//4z/73u773R5qHHu' + '/j/w7Kxkzh5lWRWdsifCkNAnY9Zc1HvDAhjhSHdFkHFzLmabt/AQxSg2wwzLhHIJOBnAWwVY4zr' + 'hIYhhc2kvhYDfQ4hDi2Gmh5KyFn8EcGIrHAngNgIwVIEMf5bzbAiTRoAD///8z/KVhkkWEle6IX' + '+d/z4fvH3BShK1e5kmjkCMoxVmXhd4ROlTKo3iipasvTilY21q19ta30/v/0/idPX1v8PNxJL6r' + 'amnOVsdvMv2akO0iSYIzdJFirtzWXCZicS9vHqvSKyqm5XJBdqBwPxyfJdykhWTZ0G0ZyTZGpLK' + 'xsNwwoRhsx3tZfhwmeOBVISm3impAC/IT/8hP/EKEM1KMdVdVKM2rHV4x7HVXZvbVVKN/qq8CiV' + '9VL9jjH/6l6qf7MBCjZmOqsAibjcP+qqqv0oxqpa/NVW286hPo1nz2L/h8+jXt//uSxCmDU2IK/' + 'ECN98KKtE5IYzNoCfbw+u9i5r8PoadUMFPKqWL4LK3T/LCraMSHGkW4bpLXR/E6LlHOVQxmslKV' + 'J8IULktMN06N0FKCpHCoYsjC4F+Z0NVqdNFoGSTjSiyjzLdnZ2fNqTi2eHKONONKLMPMKLONKLM' + 'PQRJGlFxZRoKcJFAYEeIFiRQkUWUeYfef//Ko04soswso40UJAgMw8wosososy0EalnZyjQUGBR' + 'QGIFggOWUacWUeYmuadrZziQKKEgQsQLAhQkUJAgMQDghltLO1onp0cpkNInSFMqlYeSEJ5AHsq' + 'FdOwy1DA2sRmRJKxdKRfLhfLw5BzUxBTUUzLjk4LjJVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV' + 'VVVVVVVVVVVVVVVVVUxBTUUzLjk4LjJVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV' + 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV' + 'VVVVVVVVVVVVVVVVVVVf/7ksRRA8AAAaQAAAAgAAA0gAAABFVVVVVVVVVVVVVVVVVVVVVVVVVVV' + 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV' + 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV' + 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV' + 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV' + 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV' + 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV' + 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVU=';
-function createHTMLAudioElement() {
+export function createHTMLAudioElement() {
   var ndAudio = document.querySelector('#vreo-playController-audio');
   if (ndAudio) {
     return ndAudio;
@@ -21,8 +14,8 @@ function createHTMLAudioElement() {
   audio.src = BLANK_AUDIO;
 
   // 触发一次播放
-  Promise.resolve(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() {
-    return _regenerator["default"].wrap(function _callee$(_context) {
+  Promise.resolve(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
       while (1) {
         switch (_context.prev = _context.next) {
           case 0:

package/lib/PlayController/index.js

@@ -1,36 +1,29 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.PlayController = 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 _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _five = require("@realsee/five");
-var _animationFrame = require("../shared-utils/animationFrame");
-var _createHTMLAudioElement = require("./createHTMLAudioElement");
-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 _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+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 { Subscribe } from '@realsee/five';
+import { requestAnimationFrameInterval } from "../shared-utils/animationFrame/index.js";
+import { createHTMLAudioElement } from "./createHTMLAudioElement.js";
 var closures = {};
-var PlayController = exports.PlayController = /*#__PURE__*/function (_Subscribe) {
-  (0, _inherits2["default"])(PlayController, _Subscribe);
+export var PlayController = /*#__PURE__*/function (_Subscribe) {
+  _inherits(PlayController, _Subscribe);
   var _super = _createSuper(PlayController);
   function PlayController() {
     var _this;
     var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    (0, _classCallCheck2["default"])(this, PlayController);
+    _classCallCheck(this, PlayController);
     _this = _super.call(this);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "config", {});
+    _defineProperty(_assertThisInitialized(_this), "config", {});
     if (!config.audio) {
-      config.audio = (0, _createHTMLAudioElement.createHTMLAudioElement)();
+      config.audio = createHTMLAudioElement();
     }
     _this.config = Object.assign(_this.config, config);
     closures.onPlaying = function () {
@@ -45,7 +38,7 @@ var PlayController = exports.PlayController = /*#__PURE__*/function (_Subscribe)
     _this.audioInstance.addEventListener('play', closures.onPlaying);
     _this.audioInstance.addEventListener('pause', closures.onPaused);
     _this.audioInstance.addEventListener('ended', closures.onEnded);
-    _this.stopInterval = (0, _animationFrame.requestAnimationFrameInterval)(function () {
+    _this.stopInterval = requestAnimationFrameInterval(function () {
       if (_this.audioInstance.paused) {
         return;
       }
@@ -72,7 +65,7 @@ var PlayController = exports.PlayController = /*#__PURE__*/function (_Subscribe)
   /**
    * 载入数据
    */
-  (0, _createClass2["default"])(PlayController, [{
+  _createClass(PlayController, [{
     key: "paused",
     get: function get() {
       return this.audioInstance.paused;
@@ -112,9 +105,9 @@ var PlayController = exports.PlayController = /*#__PURE__*/function (_Subscribe)
   }, {
     key: "load",
     value: (function () {
-      var _load = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(vreoUnit) {
+      var _load = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(vreoUnit) {
         var _this3 = this;
-        return _regenerator["default"].wrap(function _callee$(_context) {
+        return _regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) {
             switch (_context.prev = _context.next) {
               case 0:
@@ -160,8 +153,8 @@ var PlayController = exports.PlayController = /*#__PURE__*/function (_Subscribe)
   }, {
     key: "play",
     value: (function () {
-      var _play = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee2() {
-        return _regenerator["default"].wrap(function _callee2$(_context2) {
+      var _play = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
           while (1) {
             switch (_context2.prev = _context2.next) {
               case 0:
@@ -185,8 +178,8 @@ var PlayController = exports.PlayController = /*#__PURE__*/function (_Subscribe)
   }, {
     key: "pause",
     value: (function () {
-      var _pause = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee3() {
-        return _regenerator["default"].wrap(function _callee3$(_context3) {
+      var _pause = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
+        return _regeneratorRuntime.wrap(function _callee3$(_context3) {
           while (1) {
             switch (_context3.prev = _context3.next) {
               case 0:
@@ -230,4 +223,4 @@ var PlayController = exports.PlayController = /*#__PURE__*/function (_Subscribe)
     }
   }]);
   return PlayController;
-}(_five.Subscribe);
+}(Subscribe);

package/lib/Player/App.js

@@ -1,43 +1,34 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.App = App;
-var React = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _mobxReact = require("mobx-react");
-var _hooks = require("./hooks");
-var _CameraMovement = require("./modules/keyframes/CameraMovement");
-var _ResizeObserver = require("./modules/ResizeObserver");
-var _InfoPanel = require("./modules/keyframes/InfoPanel");
-var _ModelVideo = require("./modules/keyframes/ModelVideo");
-var _PanoEffect = require("./modules/keyframes/PanoEffect");
-var _PanoTag = require("./modules/keyframes/PanoTag");
-var _PanoTextLabel = require("./modules/keyframes/PanoTextLabel");
-var _Prompter = require("./modules/keyframes/Prompter");
-var _UpdateVRPanorama = require("./modules/keyframes/UpdateVRPanorama");
-var _VideoEffect = require("./modules/keyframes/VideoEffect");
-var _VideoAgent = require("./modules/VideoAgent");
-var _BgMusic = require("./modules/keyframes/BgMusic");
-var _Wave = require("./modules/Wave");
-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 AppView = (0, _mobxReact.observer)(function (_ref) {
+import * as React from 'react';
+import classNames from 'classnames';
+import { observer } from 'mobx-react';
+import { useController } from "./hooks.js";
+import { CameraMovement } from "./modules/keyframes/CameraMovement/index.js";
+import { ResizeObserver } from "./modules/ResizeObserver/index.js";
+import { InfoPanel } from "./modules/keyframes/InfoPanel/index.js";
+import { ModelVideo } from "./modules/keyframes/ModelVideo/index.js";
+import { PanoEffect } from "./modules/keyframes/PanoEffect/index.js";
+import { PanoTag } from "./modules/keyframes/PanoTag/index.js";
+import { PanoTextLabel } from "./modules/keyframes/PanoTextLabel/index.js";
+import { Prompter } from "./modules/keyframes/Prompter/index.js";
+import { UpdateVRPanorama } from "./modules/keyframes/UpdateVRPanorama/index.js";
+import { VideoEffect } from "./modules/keyframes/VideoEffect/index.js";
+import { VideoAgent } from "./modules/VideoAgent/index.js";
+import { BgMusic } from "./modules/keyframes/BgMusic/index.js";
+import { Wave } from "./modules/Wave/index.js";
+var AppView = observer(function (_ref) {
   var _controller$configs, _controller$waveAppea, _controller$configs3, _controller$configs4;
   var controller = _ref.controller;
   return /*#__PURE__*/React.createElement("div", {
-    className: (0, _classnames["default"])('vreo-panel', {
+    className: classNames('vreo-panel', {
       'vreo-panel--hidden': !controller.visible
     })
   }, /*#__PURE__*/React.createElement("div", {
     className: "vreo-panel-inner"
-  }, /*#__PURE__*/React.createElement(_Wave.Wave, {
+  }, /*#__PURE__*/React.createElement(Wave, {
     onClick: (_controller$configs = controller.configs) === null || _controller$configs === void 0 ? void 0 : _controller$configs.onWaveClick,
     appearance: (_controller$waveAppea = controller.waveAppearance) !== null && _controller$waveAppea !== void 0 ? _controller$waveAppea : 'single',
     staticPrefix: controller.configs.waveStaticPrefix
-  }), /*#__PURE__*/React.createElement(_VideoAgent.VideoAgent, {
+  }), /*#__PURE__*/React.createElement(VideoAgent, {
     onClick: function onClick() {
       var _controller$configs2;
       if ((_controller$configs2 = controller.configs) !== null && _controller$configs2 !== void 0 && _controller$configs2.onAvatarClick) {
@@ -51,11 +42,11 @@ var AppView = (0, _mobxReact.observer)(function (_ref) {
       }
     },
     options: ((_controller$configs3 = controller.configs) === null || _controller$configs3 === void 0 ? void 0 : _controller$configs3.videoAgentMeshOptions) || {}
-  }), /*#__PURE__*/React.createElement(_Prompter.Prompter, null), (_controller$configs4 = controller.configs) === null || _controller$configs4 === void 0 ? void 0 : _controller$configs4.customPanelChildren));
+  }), /*#__PURE__*/React.createElement(Prompter, null), (_controller$configs4 = controller.configs) === null || _controller$configs4 === void 0 ? void 0 : _controller$configs4.customPanelChildren));
 });
-function App() {
-  var controller = (0, _hooks.useController)();
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_ResizeObserver.ResizeObserver, null), /*#__PURE__*/React.createElement(_CameraMovement.CameraMovement, null), /*#__PURE__*/React.createElement(_ModelVideo.ModelVideo, null), /*#__PURE__*/React.createElement(_UpdateVRPanorama.UpdateVRPanorama, null), /*#__PURE__*/React.createElement(_VideoEffect.VideoEffect, null), /*#__PURE__*/React.createElement(_PanoTag.PanoTag, null), /*#__PURE__*/React.createElement(_PanoTextLabel.PanoTextLabel, null), /*#__PURE__*/React.createElement(_InfoPanel.InfoPanel, null), /*#__PURE__*/React.createElement(_PanoEffect.PanoEffect, null), /*#__PURE__*/React.createElement(_BgMusic.BgMusic, null)), /*#__PURE__*/React.createElement(AppView, {
+export function App() {
+  var controller = useController();
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ResizeObserver, null), /*#__PURE__*/React.createElement(CameraMovement, null), /*#__PURE__*/React.createElement(ModelVideo, null), /*#__PURE__*/React.createElement(UpdateVRPanorama, null), /*#__PURE__*/React.createElement(VideoEffect, null), /*#__PURE__*/React.createElement(PanoTag, null), /*#__PURE__*/React.createElement(PanoTextLabel, null), /*#__PURE__*/React.createElement(InfoPanel, null), /*#__PURE__*/React.createElement(PanoEffect, null), /*#__PURE__*/React.createElement(BgMusic, null)), /*#__PURE__*/React.createElement(AppView, {
     controller: controller
   }));
 }

package/lib/Player/Controller.js

@@ -1,31 +1,22 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ControllerContext = exports.Controller = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-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 _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _five = require("@realsee/five");
-var _mobx = require("mobx");
-var React = _interopRequireWildcard(require("react"));
-var _animationFrame = require("../shared-utils/animationFrame");
-var _VreoUnit = require("../typings/VreoUnit");
-var _setElementDataset = _interopRequireDefault(require("../shared-utils/setElementDataset"));
-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); }
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+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 _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-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); }; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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 { Subscribe } from '@realsee/five';
+import { action, makeObservable, observable, reaction } from 'mobx';
+import * as React from 'react';
+import { requestAnimationFrameInterval } from "../shared-utils/animationFrame/index.js";
+import { VreoKeyframeEnum } from "../typings/VreoUnit.js";
+import setElementDataset from "../shared-utils/setElementDataset.js";
+import { getMediaType } from "../shared-utils/getMediaInfo.js";
 /**
  * Vreo 播放器逻辑控制器
  * 
@@ -50,8 +41,8 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
  * controller.openDrawer({ content: '抽屉内容', height: 300 })
  * ```
  */
-var Controller = exports.Controller = /*#__PURE__*/function (_Subscribe) {
-  (0, _inherits2["default"])(Controller, _Subscribe);
+export var Controller = /*#__PURE__*/function (_Subscribe) {
+  _inherits(Controller, _Subscribe);
   var _super = _createSuper(Controller);
   /**
    * 创建 Controller 实例
@@ -65,55 +56,55 @@ var Controller = exports.Controller = /*#__PURE__*/function (_Subscribe) {
     var five = _ref.five,
       container = _ref.container,
       configs = _ref.configs;
-    (0, _classCallCheck2["default"])(this, Controller);
+    _classCallCheck(this, Controller);
     _this = _super.call(this);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "playing", false);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "ended", false);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "loading", false);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "containerSize", {
+    _defineProperty(_assertThisInitialized(_this), "playing", false);
+    _defineProperty(_assertThisInitialized(_this), "ended", false);
+    _defineProperty(_assertThisInitialized(_this), "loading", false);
+    _defineProperty(_assertThisInitialized(_this), "containerSize", {
       width: 0,
       height: 0
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "waveAppearance", null);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "appearance", {
+    _defineProperty(_assertThisInitialized(_this), "waveAppearance", null);
+    _defineProperty(_assertThisInitialized(_this), "appearance", {
       waveStyle: 'wave'
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "avatar", {});
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "visible", false);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "popUp", null);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "drawerConfig", null);
+    _defineProperty(_assertThisInitialized(_this), "avatar", {});
+    _defineProperty(_assertThisInitialized(_this), "visible", false);
+    _defineProperty(_assertThisInitialized(_this), "popUp", null);
+    _defineProperty(_assertThisInitialized(_this), "drawerConfig", null);
     _this.configs = configs;
     _this.container = container;
     _this.five = five;
     _this.appSize = configs.appSize;
     _this.appearance = _objectSpread(_objectSpread({}, _this.appearance), configs.appearance);
-    (0, _mobx.makeObservable)((0, _assertThisInitialized2["default"])(_this), {
-      visible: _mobx.observable,
-      setVisible: _mobx.action,
-      playing: _mobx.observable,
-      setPlaying: _mobx.action,
-      loading: _mobx.observable,
+    makeObservable(_assertThisInitialized(_this), {
+      visible: observable,
+      setVisible: action,
+      playing: observable,
+      setPlaying: action,
+      loading: observable,
       // videoAgentScene: observable.ref,
-      setLoading: _mobx.action,
-      popUp: _mobx.observable.ref,
-      openPopUp: _mobx.action,
-      drawerConfig: _mobx.observable.ref,
-      openDrawer: _mobx.action,
-      ended: _mobx.observable,
-      waveAppearance: _mobx.observable,
-      avatar: _mobx.observable,
-      containerSize: _mobx.observable,
-      setContainerSize: _mobx.action,
-      appearance: _mobx.observable,
-      setAppearance: _mobx.action,
-      configs: _mobx.observable.ref,
-      setEnded: _mobx.action,
-      setAvatar: _mobx.action
+      setLoading: action,
+      popUp: observable.ref,
+      openPopUp: action,
+      drawerConfig: observable.ref,
+      openDrawer: action,
+      ended: observable,
+      waveAppearance: observable,
+      avatar: observable,
+      containerSize: observable,
+      setContainerSize: action,
+      appearance: observable,
+      setAppearance: action,
+      configs: observable.ref,
+      setEnded: action,
+      setAvatar: action
     });
-    (0, _mobx.reaction)(function () {
+    reaction(function () {
       return [_this.appearance.waveStyle, _this.loading];
     }, function (_ref2) {
-      var _ref3 = (0, _slicedToArray2["default"])(_ref2, 2),
+      var _ref3 = _slicedToArray(_ref2, 2),
         waveStyle = _ref3[0],
         loading = _ref3[1];
       if (loading === null) {
@@ -143,7 +134,7 @@ var Controller = exports.Controller = /*#__PURE__*/function (_Subscribe) {
       fireImmediately: true
     });
     if (!_this.appSize) {
-      (0, _mobx.reaction)(function () {
+      reaction(function () {
         return _this.containerSize;
       }, function (containerSize) {
         if (!(containerSize !== null && containerSize !== void 0 && containerSize.width)) return;
@@ -159,30 +150,30 @@ var Controller = exports.Controller = /*#__PURE__*/function (_Subscribe) {
           if (height > width) return 'portrait';
           return 'landscape';
         }();
-        (0, _setElementDataset["default"])(_this.container, {
+        setElementDataset(_this.container, {
           size: size
         });
-        (0, _setElementDataset["default"])(_this.container, {
+        setElementDataset(_this.container, {
           orientation: orientation
         });
       }, {
         fireImmediately: true
       });
     } else {
-      (0, _setElementDataset["default"])(_this.container, {
+      setElementDataset(_this.container, {
         size: _this.appSize
       });
     }
 
     // 监听播放情况：抛出触发时机
-    (0, _mobx.reaction)(function () {
+    reaction(function () {
       return _this.ended;
     }, function (ended) {
       if (ended) {
         _this.emit('paused', true);
       }
     });
-    (0, _mobx.reaction)(function () {
+    reaction(function () {
       return _this.playing;
     }, function (playing) {
       if (!_this.ended) {
@@ -196,7 +187,7 @@ var Controller = exports.Controller = /*#__PURE__*/function (_Subscribe) {
    * 获取播放器是否准备就绪
    * @returns 是否有可用的视频代理场景
    */
-  (0, _createClass2["default"])(Controller, [{
+  _createClass(Controller, [{
     key: "agentType",
     get:
     // null 表示加载失败
@@ -207,7 +198,7 @@ var Controller = exports.Controller = /*#__PURE__*/function (_Subscribe) {
      */
     function get() {
       var _this$videoAgentScene, _this$avatar;
-      var type = (0, _getMediaInfo.getMediaType)((_this$videoAgentScene = this.videoAgentScene) === null || _this$videoAgentScene === void 0 ? void 0 : _this$videoAgentScene.videoAgentMesh.videoUrl);
+      var type = getMediaType((_this$videoAgentScene = this.videoAgentScene) === null || _this$videoAgentScene === void 0 ? void 0 : _this$videoAgentScene.videoAgentMesh.videoUrl);
       if ((_this$avatar = this.avatar) !== null && _this$avatar !== void 0 && _this$avatar.force) return 'avatar';
       if (type === 'video') return 'video';
       return 'none';
@@ -352,7 +343,7 @@ var Controller = exports.Controller = /*#__PURE__*/function (_Subscribe) {
         if (keyframe.end < _this2.currentTime) return false;
         // 检测开始时间
         if (keyframe.start > _this2.currentTime) return false;
-        if (keyframe.type === _VreoUnit.VreoKeyframeEnum.BgMusic) return true;
+        if (keyframe.type === VreoKeyframeEnum.BgMusic) return true;
         // 开始时间低于当前时间戳 100ms
         var dur = _this2.currentTime - keyframe.start;
         return dur <= 100 && dur >= 0;
@@ -427,7 +418,7 @@ var Controller = exports.Controller = /*#__PURE__*/function (_Subscribe) {
     value: function run(callback) {
       var _this4 = this;
       if (this.stopInterval) return;
-      this.stopInterval = (0, _animationFrame.requestAnimationFrameInterval)(function () {
+      this.stopInterval = requestAnimationFrameInterval(function () {
         return _this4.requestAnimationFrameLoop(callback);
       });
     }
@@ -470,5 +461,6 @@ var Controller = exports.Controller = /*#__PURE__*/function (_Subscribe) {
     }
   }]);
   return Controller;
-}(_five.Subscribe);
-var ControllerContext = exports.ControllerContext = /*#__PURE__*/React.createContext(null);
+}(Subscribe);
+var ControllerContext = /*#__PURE__*/React.createContext(null);
+export { ControllerContext };

package/lib/Player/custom/SpatialScenePanel/index.js

@@ -1,20 +1,10 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SpatialScenePanel = SpatialScenePanel;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var React = _interopRequireWildcard(require("react"));
-var _reactDom = _interopRequireDefault(require("react-dom"));
-var _three = require("three");
-var _BetterTween = require("../../../shared-utils/animationFrame/BetterTween");
-var _CSS3DRenderPlugin = require("../../../fivePlugins/CSS3DRenderPlugin");
-var _VreoUnit = require("../../../typings/VreoUnit");
-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); }
-// __debug__
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import ReactDOM from 'react-dom';
+import { Raycaster, Vector3 } from 'three';
+import { tweenProgress } from "../../../shared-utils/animationFrame/BetterTween.js";
+import { CSS3DRenderPlugin } from "../../../fivePlugins/CSS3DRenderPlugin/index.js";
+import { VreoKeyframeEnum } from "../../../typings/VreoUnit.js"; // __debug__
 // const mockData: SpatialScenePanelData = {
 //   customType: 'SpatialScenePanel',
 //   "stateList": [
@@ -38,7 +28,6 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 //   "temperature": "27",
 //   "title": "沉浸式回家"
 // }
-
 // const getSphere = (position: Vector3, color = 0xffff00) => {
 //   const geometry = new SphereGeometry(0.05, 32, 16)
 //   const material = new MeshBasicMaterial({ color })
@@ -50,11 +39,11 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 var searchV1 = function searchV1(_ref) {
   var five = _ref.five,
     dom = _ref.dom;
-  var cameraDirection = new _three.Vector3();
+  var cameraDirection = new Vector3();
   five.camera.getWorldDirection(cameraDirection);
   var cameraPosition = five.camera.position;
-  var _five$model$intersect = five.model.intersectRaycaster(new _three.Raycaster(cameraPosition, cameraDirection)),
-    _five$model$intersect2 = (0, _slicedToArray2["default"])(_five$model$intersect, 1),
+  var _five$model$intersect = five.model.intersectRaycaster(new Raycaster(cameraPosition, cameraDirection)),
+    _five$model$intersect2 = _slicedToArray(_five$model$intersect, 1),
     intersect = _five$model$intersect2[0];
   var point = five.project2d(intersect.point);
   var widescreen = window.innerWidth > 560 ? true : false;
@@ -67,10 +56,10 @@ var searchV1 = function searchV1(_ref) {
     top = rect.top,
     bottom = rect.bottom,
     right = rect.right;
-  var leftBottom = new _three.Vector3(left, bottom);
-  var leftTop = new _three.Vector3(left, top);
-  var rightTop = new _three.Vector3(right, top);
-  var rightBottom = new _three.Vector3(right, bottom);
+  var leftBottom = new Vector3(left, bottom);
+  var leftTop = new Vector3(left, top);
+  var rightTop = new Vector3(right, top);
+  var rightBottom = new Vector3(right, bottom);
   var points = [leftBottom, rightBottom, rightTop, leftTop].map(function (point) {
     point.setX(point.x / window.innerWidth * 2 - (widescreen ? 1.25 : 1.75));
     point.setY(-(point.y / window.innerHeight) * 2 + (widescreen ? 1.35 : 1.125));
@@ -94,11 +83,11 @@ var searchV1 = function searchV1(_ref) {
  * 空间场景面板
  * @returns
  */
-function SpatialScenePanel(props) {
+export function SpatialScenePanel(props) {
   var timeoutRef = React.useRef(null);
   var ref = React.useRef(null);
   var panelRef = React.useRef(null);
-  var rendererRef = React.useRef((0, _CSS3DRenderPlugin.CSS3DRenderPlugin)(props.five));
+  var rendererRef = React.useRef(CSS3DRenderPlugin(props.five));
   React.useEffect(function () {
     if (!ref.current) {
       return;
@@ -128,7 +117,7 @@ function SpatialScenePanel(props) {
         $css3DObject: css3DObject
       });
       if (!container) return;
-      _reactDom["default"].render(/*#__PURE__*/React.createElement(Panel, {
+      ReactDOM.render(/*#__PURE__*/React.createElement(Panel, {
         ref: function ref(_ref3) {
           return panelRef.current = _ref3;
         },
@@ -136,7 +125,7 @@ function SpatialScenePanel(props) {
       }), container);
       var startRotateY = -(Math.PI * 2) / 9;
       var lastRotateY = 0;
-      (0, _BetterTween.tweenProgress)(1000).onUpdate(function (_ref4) {
+      tweenProgress(1000).onUpdate(function (_ref4) {
         var progress = _ref4.progress;
         var needRotateY = Math.PI / 90 * 11 * progress;
         var rotateY = needRotateY - lastRotateY;
@@ -172,9 +161,9 @@ function SpatialScenePanel(props) {
     });
 
     // setTimeout(() => {callback()}, 8000)
-    props.subscribe.on(_VreoUnit.VreoKeyframeEnum.Custom, callback);
+    props.subscribe.on(VreoKeyframeEnum.Custom, callback);
     return function () {
-      props.subscribe.off(_VreoUnit.VreoKeyframeEnum.Custom, callback);
+      props.subscribe.off(VreoKeyframeEnum.Custom, callback);
       if (timeoutRef.current) {
         clearTimeout(timeoutRef.current);
       }

package/lib/Player/hooks.js

@@ -1,29 +1,20 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useController = useController;
-exports.useFiveInstance = useFiveInstance;
-exports.useFiveProject2d = useFiveProject2d;
-var _react = _interopRequireDefault(require("react"));
-var _Controller = require("./Controller");
-function useController() {
-  var controller = _react["default"].useContext(_Controller.ControllerContext);
+import React from 'react';
+import { ControllerContext } from "./Controller.js";
+export function useController() {
+  var controller = React.useContext(ControllerContext);
   if (!controller) {
     throw new Error('没有找到 "ControllerContext"');
   }
   return controller;
 }
-function useFiveInstance() {
+export function useFiveInstance() {
   var controller = useController();
   if (!controller.five) {
     throw new Error('没有找到 "five" 实例');
   }
   return controller.five;
 }
-function useFiveProject2d() {
+export function useFiveProject2d() {
   var five = useFiveInstance();
   return function (vector) {
     return five.project2d(vector, false);