@realsee/vreo 1.1.0-dev.1 → 1.2.0-alpha.0

package/lib/Player/App.js

@@ -44,7 +44,6 @@ var AppView = (0, _mobxReact.observer)(function (_ref) {
         controller.configs.onAvatarClick();
         return;
       }
-      // 默认点击逻辑
       if (controller.playing) {
         controller.setPlaying(false);
       } else {

package/lib/Player/index.js

@@ -133,19 +133,14 @@ var Player = /*#__PURE__*/function (_Subscribe) {
                 if (force) {
                   vreoUnit = JSON.parse(JSON.stringify(vreoUnit));
                 }
-                if (this.controller.visible) {
-                  _context.next = 10;
-                  break;
-                }
-                this.controller.setVisible(true);
-                // 延迟 500ms 规避跟 DOM 动画冲突
-                _context.next = 10;
-                return new Promise(function (resolve) {
-                  setTimeout(function () {
-                    return resolve(true);
-                  }, 500);
-                });
-              case 10:
+                // if (!this.controller.visible) {
+                //     this.controller.setVisible(true)
+                //     // 延迟 500ms 规避跟 DOM 动画冲突
+                //     await new Promise((resolve) => {
+                //         setTimeout(() => resolve(true), 500)
+                //     })
+                // }
+
                 if (this.controller.stopInterval) {
                   this.controller.stopInterval();
                   this.controller.stopInterval = undefined;
@@ -161,7 +156,7 @@ var Player = /*#__PURE__*/function (_Subscribe) {
 
                 // 预载数据中的点位
                 if (!(preload || preload === undefined && this.configs.autoPreload)) {
-                  _context.next = 24;
+                  _context.next = 20;
                   break;
                 }
                 panoIndexMap = vreoUnit.keyframes.filter(function (vreoKeyframe) {
@@ -182,18 +177,18 @@ var Player = /*#__PURE__*/function (_Subscribe) {
                 }, {});
                 panoIndexes = Object.keys(panoIndexMap);
                 i = 0;
-              case 18:
+              case 14:
                 if (!(i < panoIndexes.length)) {
-                  _context.next = 24;
+                  _context.next = 20;
                   break;
                 }
-                _context.next = 21;
+                _context.next = 17;
                 return this.$five.preloadPano(Number(panoIndexes[i]));
-              case 21:
+              case 17:
                 i++;
-                _context.next = 18;
+                _context.next = 14;
                 break;
-              case 24:
+              case 20:
                 // 新数据载入就绪
                 this.emit('loaded', vreoUnit);
                 this.controller.emit('loaded', vreoUnit);
@@ -201,12 +196,12 @@ var Player = /*#__PURE__*/function (_Subscribe) {
                   this.controller.videoAgentScene.videoAgentMesh.mediaInstance.currentTime = currentTime / 1000;
                 }
                 this.controller.setAvatar(vreoUnit.video.avatar);
-                _context.next = 30;
+                _context.next = 26;
                 return (0, _Audio.waitForBlankAudioGenerated)();
-              case 30:
-                _context.next = 32;
+              case 26:
+                _context.next = 28;
                 return (_this$controller$vide2 = this.controller.videoAgentScene) === null || _this$controller$vide2 === void 0 ? void 0 : _this$controller$vide2.videoAgentMesh.play(vreoUnit.video.url, currentTime / 1000, vreoUnit.video.duration);
-              case 32:
+              case 28:
                 this.controller.setEnded(false);
                 this.play();
                 this.controller.run(function (type, keyframe) {
@@ -214,7 +209,7 @@ var Player = /*#__PURE__*/function (_Subscribe) {
                 });
                 this.controller.setLoading(false);
                 return _context.abrupt("return", true);
-              case 37:
+              case 33:
               case "end":
                 return _context.stop();
             }

package/lib/Player/modules/keyframes/InfoPanel/index.d.ts

@@ -1,2 +1,3 @@
 /// <reference types="react" />
+export declare const isWX: boolean;
 export declare function InfoPanel(): JSX.Element;

package/lib/Player/modules/keyframes/InfoPanel/index.js

@@ -5,11 +5,24 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.InfoPanel = InfoPanel;
+exports.isWX = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _VreoUnit = require("../../../../typings/VreoUnit");
 var _hooks = require("../../../hooks");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var isWX = navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1;
+exports.isWX = isWX;
+var videoElement = document.createElement('video');
+if (isWX) {
+  videoElement.playsInline = true;
+  videoElement.classList.add('vreo-infoPanelVideo');
+  document.body.addEventListener('click', function () {
+    return videoElement.play();
+  }, {
+    once: true
+  });
+}
 function InfoPanelImg(_ref) {
   var url = _ref.url,
     children = _ref.children;
@@ -29,6 +42,16 @@ function InfoPanelImg(_ref) {
 function InfoPanelVideo(_ref2) {
   var url = _ref2.url,
     children = _ref2.children;
+  var videoWrapperRef = React.useRef(null);
+  React.useEffect(function () {
+    if (!isWX) return;
+    if (!videoWrapperRef.current) return;
+    videoElement.src = url;
+    if (!videoWrapperRef.current.contains(videoElement)) {
+      videoWrapperRef.current.appendChild(videoElement);
+    }
+    videoElement.play();
+  }, [videoWrapperRef.current]);
   return /*#__PURE__*/React.createElement("div", {
     className: "vreo-infoPanel-container"
   }, /*#__PURE__*/React.createElement("div", {
@@ -38,8 +61,9 @@ function InfoPanelVideo(_ref2) {
   }, /*#__PURE__*/React.createElement("div", {
     className: "vreo-infoPanel-inner"
   }, children, /*#__PURE__*/React.createElement("div", {
-    className: "vreo-infoPanelVideo"
-  }, /*#__PURE__*/React.createElement("video", {
+    className: "vreo-infoPanelVideo",
+    ref: videoWrapperRef
+  }, !isWX && /*#__PURE__*/React.createElement("video", {
     playsInline: true,
     autoPlay: true,
     className: "vreo-infoPanelVideo",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@realsee/vreo",
-  "version": "1.1.0-dev.1",
+  "version": "1.2.0-alpha.0",
   "description": "Vreo (VR Video 缩写) 是基于如视三维渲染引擎 Five 和 用户界面构建库 React 实现的如视 3D 空间剧本播放器。",
   "keywords": [
     "realsee",