@realsee/vreo 2.3.10 → 2.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/lib/PlayController/createHTMLAudioElement.js +12 -22
  2. package/lib/PlayController/index.js +70 -137
  3. package/lib/Player/App.d.ts +2 -2
  4. package/lib/Player/App.js +1 -28
  5. package/lib/Player/Controller.d.ts +3 -3
  6. package/lib/Player/Controller.js +46 -110
  7. package/lib/Player/custom/SpatialScenePanel/index.d.ts +2 -2
  8. package/lib/Player/custom/SpatialScenePanel/index.js +75 -72
  9. package/lib/Player/hooks.d.ts +3 -3
  10. package/lib/Player/hooks.js +0 -10
  11. package/lib/Player/index.js +109 -175
  12. package/lib/Player/modules/Drawer/index.d.ts +2 -2
  13. package/lib/Player/modules/Drawer/index.js +2 -21
  14. package/lib/Player/modules/PopUp/index.d.ts +2 -2
  15. package/lib/Player/modules/PopUp/index.js +1 -12
  16. package/lib/Player/modules/ResizeObserver/index.d.ts +2 -2
  17. package/lib/Player/modules/ResizeObserver/index.js +0 -8
  18. package/lib/Player/modules/VideoAgent/VideoAgentMesh.d.ts +1 -1
  19. package/lib/Player/modules/VideoAgent/VideoAgentMesh.js +148 -247
  20. package/lib/Player/modules/VideoAgent/VideoAgentScene.js +7 -23
  21. package/lib/Player/modules/VideoAgent/index.d.ts +2 -2
  22. package/lib/Player/modules/VideoAgent/index.js +2 -20
  23. package/lib/Player/modules/Wave/index.d.ts +2 -2
  24. package/lib/Player/modules/Wave/index.js +12 -34
  25. package/lib/Player/modules/keyframes/BgMusic/index.d.ts +2 -2
  26. package/lib/Player/modules/keyframes/BgMusic/index.js +41 -64
  27. package/lib/Player/modules/keyframes/CameraMovement/index.d.ts +2 -2
  28. package/lib/Player/modules/keyframes/CameraMovement/index.js +42 -71
  29. package/lib/Player/modules/keyframes/InfoPanel/index.d.ts +2 -2
  30. package/lib/Player/modules/keyframes/InfoPanel/index.js +16 -47
  31. package/lib/Player/modules/keyframes/ModelVideo/index.d.ts +2 -2
  32. package/lib/Player/modules/keyframes/ModelVideo/index.js +52 -83
  33. package/lib/Player/modules/keyframes/PanoEffect/index.d.ts +2 -2
  34. package/lib/Player/modules/keyframes/PanoEffect/index.js +16 -40
  35. package/lib/Player/modules/keyframes/PanoEffect/lineAnime.js +1 -9
  36. package/lib/Player/modules/keyframes/PanoTag/index.d.ts +1 -1
  37. package/lib/Player/modules/keyframes/PanoTag/index.js +6 -25
  38. package/lib/Player/modules/keyframes/PanoTextLabel/index.d.ts +2 -2
  39. package/lib/Player/modules/keyframes/PanoTextLabel/index.js +31 -50
  40. package/lib/Player/modules/keyframes/Prompter/index.d.ts +2 -2
  41. package/lib/Player/modules/keyframes/Prompter/index.js +11 -29
  42. package/lib/Player/modules/keyframes/UpdateVRPanorama/index.d.ts +2 -2
  43. package/lib/Player/modules/keyframes/UpdateVRPanorama/index.js +25 -29
  44. package/lib/Player/modules/keyframes/VideoEffect/index.d.ts +2 -2
  45. package/lib/Player/modules/keyframes/VideoEffect/index.js +52 -87
  46. package/lib/Player/typings.d.ts +7 -4
  47. package/lib/fivePlugins/CSS3DRenderPlugin/centerPoint.js +0 -2
  48. package/lib/fivePlugins/CSS3DRenderPlugin/createResizeObserver.js +0 -1
  49. package/lib/fivePlugins/CSS3DRenderPlugin/evenNumber.js +0 -1
  50. package/lib/fivePlugins/CSS3DRenderPlugin/index.d.ts +1 -1
  51. package/lib/fivePlugins/CSS3DRenderPlugin/index.js +42 -81
  52. package/lib/fivePlugins/CSS3DRenderPlugin/transformPositionToVector3.js +3 -7
  53. package/lib/fivePlugins/CameraMovementPlugin/index.js +181 -241
  54. package/lib/fivePlugins/CameraMovementPlugin/typings.d.ts +4 -4
  55. package/lib/fivePlugins/CameraMovementPlugin/typings.js +6 -12
  56. package/lib/fivePlugins/ModelTVVideoPlugin/index.js +37 -87
  57. package/lib/index.js +0 -1
  58. package/lib/react/index.d.ts +2 -1
  59. package/lib/react/index.js +10 -35
  60. package/lib/shared-utils/Audio.js +57 -106
  61. package/lib/shared-utils/AudioLike.d.ts +1 -1
  62. package/lib/shared-utils/AudioLike.js +19 -46
  63. package/lib/shared-utils/Preloader.js +2 -10
  64. package/lib/shared-utils/addResizeListener.d.ts +1 -1
  65. package/lib/shared-utils/addResizeListener.js +0 -5
  66. package/lib/shared-utils/animationFrame/BetterTween.d.ts +1 -1
  67. package/lib/shared-utils/animationFrame/BetterTween.js +14 -45
  68. package/lib/shared-utils/animationFrame/index.d.ts +1 -2
  69. package/lib/shared-utils/animationFrame/index.js +3 -12
  70. package/lib/shared-utils/animationFrame/tween.d.ts +2 -2
  71. package/lib/shared-utils/animationFrame/tween.js +3 -14
  72. package/lib/shared-utils/createTransMatrix.js +1 -10
  73. package/lib/shared-utils/getFileExpandedName.js +0 -1
  74. package/lib/shared-utils/getMediaInfo.d.ts +3 -3
  75. package/lib/shared-utils/getMediaInfo.js +0 -10
  76. package/lib/shared-utils/setElementDataset.js +0 -2
  77. package/lib/typings/VreoUnit.d.ts +16 -16
  78. package/lib/typings/VreoUnit.js +115 -47
  79. package/package.json +23 -18
@@ -1,32 +1,20 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
4
  var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
5
  Object.defineProperty(exports, "__esModule", {
8
6
  value: true
9
7
  });
10
8
  exports.PanoTextLabel = PanoTextLabel;
11
-
12
9
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
13
-
14
10
  var React = _interopRequireWildcard(require("react"));
15
-
16
- var THREE = _interopRequireWildcard(require("three"));
17
-
11
+ var _three = _interopRequireWildcard(require("three"));
12
+ var THREE = _three;
18
13
  var _reactDom = _interopRequireDefault(require("react-dom"));
19
-
20
14
  var _hooks = require("../../../hooks");
21
-
22
15
  var _CSS3DRenderPlugin = require("../../../../fivePlugins/CSS3DRenderPlugin");
23
-
24
16
  var _VreoUnit = require("../../../../typings/VreoUnit");
25
-
26
- 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); }
27
-
28
- 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; }
29
-
17
+ 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); }
30
18
  /**
31
19
  * 通过传入中心点确定矩形框架容器的四个点:
32
20
  * 1. 已知矩形长宽和中心点
@@ -38,18 +26,18 @@ var calcPoints = function calcPoints(centerPoint, normal, wrapperLength, wrapper
38
26
  var length = wrapperLength / 375;
39
27
  var width = wrapperWidth / 375;
40
28
  var geometry = new THREE.PlaneGeometry(length, width);
41
-
42
29
  if (normal) {
43
30
  var lookPoint = new THREE.Vector3(normal.x + centerPoint.x, normal.y + centerPoint.y, normal.z + centerPoint.z);
44
31
  geometry.lookAt(lookPoint);
45
- } // const pointgeometry = new THREE.Geometry()
32
+ }
33
+ // const pointgeometry = new THREE.Geometry()
46
34
  // pointgeometry.vertices.push(cameraPosition)
47
35
  // const pointmaterial = new THREE.PointsMaterial({
48
36
  // color: 0xffffff,
49
37
  // size: 0.4,
50
38
  // })
51
39
  // _point = new THREE.Points(pointgeometry, pointmaterial)
52
-
40
+ // console.log(cameraPosition)
53
41
 
54
42
  var material = new THREE.MeshBasicMaterial({
55
43
  color: 0xffff00,
@@ -57,26 +45,26 @@ var calcPoints = function calcPoints(centerPoint, normal, wrapperLength, wrapper
57
45
  });
58
46
  var plane = new THREE.Mesh(geometry, material);
59
47
  var v0 = centerPoint.clone();
60
- plane.position.copy(v0); // 计算传入的四个点的坐标
48
+ plane.position.copy(v0);
61
49
 
50
+ // 计算传入的四个点的坐标
62
51
  var _plane$geometry$verti = (0, _slicedToArray2["default"])(plane.geometry.vertices, 4),
63
- v1 = _plane$geometry$verti[0],
64
- v2 = _plane$geometry$verti[1],
65
- v3 = _plane$geometry$verti[2],
66
- v4 = _plane$geometry$verti[3];
67
-
52
+ v1 = _plane$geometry$verti[0],
53
+ v2 = _plane$geometry$verti[1],
54
+ v3 = _plane$geometry$verti[2],
55
+ v4 = _plane$geometry$verti[3];
68
56
  var downLeft = v0.clone().add(v4);
69
57
  var downRight = v0.clone().add(v3);
70
58
  var upLeft = v0.clone().add(v2);
71
- var upRight = v0.clone().add(v1); // 插件使用要求:矩形四个点位数据,顺序为**必须**为左下、右下、右上、左上
59
+ var upRight = v0.clone().add(v1);
72
60
 
61
+ // 插件使用要求:矩形四个点位数据,顺序为**必须**为左下、右下、右上、左上
73
62
  return [downLeft, downRight, upRight, upLeft];
74
63
  };
64
+
75
65
  /**
76
66
  * 空间文本标签。
77
67
  */
78
-
79
-
80
68
  function PanoTextLabel() {
81
69
  var timeoutRef = React.useRef();
82
70
  var controller = (0, _hooks.useController)();
@@ -84,40 +72,36 @@ function PanoTextLabel() {
84
72
  var ref = React.useRef();
85
73
  React.useEffect(function () {
86
74
  var _controller$configs;
87
-
88
75
  if (((_controller$configs = controller.configs) === null || _controller$configs === void 0 ? void 0 : _controller$configs.keyframeMap.PanoTextLabel) === false) {
89
76
  return;
90
77
  }
91
-
92
78
  var callback = function callback(keyframe) {
93
79
  var _panoTextLabelData$no, _panoTextLabelData$no2, _panoTextLabelData$no3;
94
-
95
80
  var start = keyframe.start,
96
- end = keyframe.end,
97
- data = keyframe.data;
98
- var panoTextLabelData = data; // 增加无文本情况的判断
99
-
81
+ end = keyframe.end,
82
+ data = keyframe.data;
83
+ var panoTextLabelData = data;
84
+ // 增加无文本情况的判断
100
85
  if (data.text === '') return;
101
86
  var _panoTextLabelData$ve = panoTextLabelData.vertex,
102
- x = _panoTextLabelData$ve.x,
103
- y = _panoTextLabelData$ve.y,
104
- z = _panoTextLabelData$ve.z;
105
- var centerPoint = new THREE.Vector3(x, y, z);
106
- var normal = new THREE.Vector3((_panoTextLabelData$no = panoTextLabelData.normal) === null || _panoTextLabelData$no === void 0 ? void 0 : _panoTextLabelData$no.x, (_panoTextLabelData$no2 = panoTextLabelData.normal) === null || _panoTextLabelData$no2 === void 0 ? void 0 : _panoTextLabelData$no2.y, (_panoTextLabelData$no3 = panoTextLabelData.normal) === null || _panoTextLabelData$no3 === void 0 ? void 0 : _panoTextLabelData$no3.z); // 生成传入的四个点,将文本框最大宽度定在200px,最高高度在30px
107
-
87
+ x = _panoTextLabelData$ve.x,
88
+ y = _panoTextLabelData$ve.y,
89
+ z = _panoTextLabelData$ve.z;
90
+ var centerPoint = new _three.Vector3(x, y, z);
91
+ var normal = new _three.Vector3((_panoTextLabelData$no = panoTextLabelData.normal) === null || _panoTextLabelData$no === void 0 ? void 0 : _panoTextLabelData$no.x, (_panoTextLabelData$no2 = panoTextLabelData.normal) === null || _panoTextLabelData$no2 === void 0 ? void 0 : _panoTextLabelData$no2.y, (_panoTextLabelData$no3 = panoTextLabelData.normal) === null || _panoTextLabelData$no3 === void 0 ? void 0 : _panoTextLabelData$no3.z);
92
+ // 生成传入的四个点,将文本框最大宽度定在200px,最高高度在30px
108
93
  var wrapperLength = 200;
109
94
  var wrapperWidth = 30;
110
95
  var points = calcPoints(centerPoint, panoTextLabelData.normal && normal, wrapperLength, wrapperWidth);
111
96
  if (!ref.current) ref.current = (0, _CSS3DRenderPlugin.CSS3DRenderPlugin)(five);
112
97
  var container = ref.current.create3DDomContainer(points);
113
- var css3DObject = container === null || container === void 0 ? void 0 : container.css3DObject; // 将获取的mesh进行旋转操作,根据欧拉角去进行mesh的变换
114
-
98
+ var css3DObject = container === null || container === void 0 ? void 0 : container.css3DObject;
99
+ // 将获取的mesh进行旋转操作,根据欧拉角去进行mesh的变换
115
100
  if (data.quaternion) {
116
- var quaternion = new THREE.Quaternion(data.quaternion.x, data.quaternion.y, data.quaternion.z, data.quaternion.w);
117
- css3DObject === null || css3DObject === void 0 ? void 0 : css3DObject.quaternion.copy(quaternion);
101
+ var quaternion = new _three.Quaternion(data.quaternion.x, data.quaternion.y, data.quaternion.z, data.quaternion.w);
102
+ css3DObject === null || css3DObject === void 0 || css3DObject.quaternion.copy(quaternion);
118
103
  }
119
-
120
- if (container !== null && container !== void 0 && container.container) _reactDom["default"].render( /*#__PURE__*/React.createElement("div", {
104
+ if (container !== null && container !== void 0 && container.container) _reactDom["default"].render(/*#__PURE__*/React.createElement("div", {
121
105
  className: "PanoTextLabel PanoTextLabel--notHidden"
122
106
  }, /*#__PURE__*/React.createElement("div", {
123
107
  className: "PanoTextLabel-wrapper"
@@ -129,15 +113,12 @@ function PanoTextLabel() {
129
113
  }, data.text || ''))), container === null || container === void 0 ? void 0 : container.container);
130
114
  timeoutRef.current = setTimeout(function () {
131
115
  var _ref$current;
132
-
133
- (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.disposeAll();
116
+ (_ref$current = ref.current) === null || _ref$current === void 0 || _ref$current.disposeAll();
134
117
  }, end - start);
135
118
  };
136
-
137
119
  controller.on(_VreoUnit.VreoKeyframeEnum.PanoTextLabel, callback);
138
120
  return function () {
139
121
  controller.off(_VreoUnit.VreoKeyframeEnum.PanoTextLabel, callback);
140
-
141
122
  if (timeoutRef.current) {
142
123
  clearTimeout(timeoutRef.current);
143
124
  }
@@ -1,2 +1,2 @@
1
- /// <reference types="react" />
2
- export declare function Prompter(): JSX.Element;
1
+ import * as React from 'react';
2
+ export declare function Prompter(): React.JSX.Element;
@@ -1,71 +1,53 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
4
  var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
5
  Object.defineProperty(exports, "__esModule", {
8
6
  value: true
9
7
  });
10
8
  exports.Prompter = Prompter;
11
-
12
9
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
13
-
14
10
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
15
-
16
11
  var React = _interopRequireWildcard(require("react"));
17
-
18
12
  var _classnames = _interopRequireDefault(require("classnames"));
19
-
20
13
  var _hooks = require("../../../hooks");
21
-
22
14
  var _VreoUnit = require("../../../../typings/VreoUnit");
23
-
24
- 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); }
25
-
26
- 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; }
27
-
15
+ 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); }
28
16
  function Prompter() {
29
17
  var _React$useState = React.useState(''),
30
- _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
31
- text = _React$useState2[0],
32
- setText = _React$useState2[1];
33
-
18
+ _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
19
+ text = _React$useState2[0],
20
+ setText = _React$useState2[1];
34
21
  var _React$useState3 = React.useState(true),
35
- _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
36
- hidden = _React$useState4[0],
37
- setHidden = _React$useState4[1];
38
-
22
+ _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
23
+ hidden = _React$useState4[0],
24
+ setHidden = _React$useState4[1];
39
25
  var ref = React.useRef(null);
40
26
  var controller = (0, _hooks.useController)();
41
27
  React.useEffect(function () {
42
28
  var _controller$configs;
43
-
44
29
  if (((_controller$configs = controller.configs) === null || _controller$configs === void 0 ? void 0 : _controller$configs.keyframeMap.Prompter) === false) {
45
30
  return;
46
31
  }
47
-
48
32
  var callback = function callback(keyframe) {
49
33
  var start = keyframe.start,
50
- end = keyframe.end,
51
- data = keyframe.data;
34
+ end = keyframe.end,
35
+ data = keyframe.data;
52
36
  setText(data.text);
53
37
  setHidden(false);
54
-
55
38
  if (ref.current) {
56
39
  clearTimeout(ref.current);
57
40
  ref.current = null;
58
41
  }
59
-
60
42
  ref.current = setTimeout(function () {
61
43
  setHidden(true);
62
- setText(''); // setTimeout(() => setText(''), 500)
44
+ setText('');
45
+ // setTimeout(() => setText(''), 500)
63
46
 
64
47
  if (ref.current) clearTimeout(ref.current);
65
48
  ref.current = null;
66
49
  }, end - start);
67
50
  };
68
-
69
51
  controller.on(_VreoUnit.VreoKeyframeEnum.Prompter, callback);
70
52
  return function () {
71
53
  controller.off(_VreoUnit.VreoKeyframeEnum.Prompter, callback);
@@ -1,2 +1,2 @@
1
- /// <reference types="react" />
2
- export declare function UpdateVRPanorama(): JSX.Element;
1
+ import * as React from 'react';
2
+ export declare function UpdateVRPanorama(): React.JSX.Element;
@@ -1,40 +1,32 @@
1
1
  "use strict";
2
2
 
3
3
  var _typeof = require("@babel/runtime/helpers/typeof");
4
-
5
4
  Object.defineProperty(exports, "__esModule", {
6
5
  value: true
7
6
  });
8
7
  exports.UpdateVRPanorama = UpdateVRPanorama;
9
-
10
8
  var React = _interopRequireWildcard(require("react"));
11
-
12
9
  var _five = require("@realsee/five");
13
-
14
10
  var _hooks = require("../../../hooks");
15
-
16
11
  var _VreoUnit = require("../../../../typings/VreoUnit");
17
-
18
- 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); }
19
-
20
- 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; }
21
-
12
+ 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); }
22
13
  function UpdateVRPanorama() {
23
14
  var controller = (0, _hooks.useController)();
24
15
  var five = (0, _hooks.useFiveInstance)();
25
16
  var deafultWorkRef = React.useRef(null);
26
- var updateWorkRef = React.useRef(null); // 恢复默认 VR
17
+ var updateWorkRef = React.useRef(null);
27
18
 
19
+ // 恢复默认 VR
28
20
  var restoreCallback = React.useCallback(function () {
29
21
  // 先清理掉 之前的 VR 数据备份
30
22
  updateWorkRef.current = null;
31
-
32
23
  if (deafultWorkRef.current) {
33
24
  var work = (0, _five.parseWork)(deafultWorkRef.current);
34
25
  five.load(work);
35
26
  }
36
- }, []); // 暂停时: 恢复默认 VR
27
+ }, []);
37
28
 
29
+ // 暂停时: 恢复默认 VR
38
30
  var pausedCallback = React.useCallback(function () {
39
31
  if (deafultWorkRef.current) {
40
32
  var work = (0, _five.parseWork)(deafultWorkRef.current);
@@ -43,33 +35,36 @@ function UpdateVRPanorama() {
43
35
  });
44
36
  five.load(work);
45
37
  }
46
- }, []); // 播放时:如果暂停前有更新 VR 需要还原
38
+ }, []);
47
39
 
40
+ // 播放时:如果暂停前有更新 VR 需要还原
48
41
  var playingCallback = React.useCallback(function () {
49
42
  if (!updateWorkRef.current) {
50
43
  return;
51
44
  }
52
-
53
45
  five.load(updateWorkRef.current);
54
46
  }, []);
55
47
  React.useEffect(function () {
56
48
  var callback = function callback(keyframe) {
57
- var _five$work;
58
-
59
- if (!deafultWorkRef.current) {
49
+ var _five$work, _five$work2;
50
+ if (!deafultWorkRef.current && (_five$work = five.work) !== null && _five$work !== void 0 && _five$work.raw.works) {
60
51
  deafultWorkRef.current = five.work.raw.works;
61
52
  }
53
+ var data = keyframe.data;
62
54
 
63
- var data = keyframe.data; // 如果数据中有新 work 数据,则直接载入
64
-
55
+ // 如果数据中有新 work 数据,则直接载入
65
56
  if (data.work) {
66
57
  updateWorkRef.current = (0, _five.parseWork)(data.work);
67
58
  five.load(updateWorkRef.current);
68
59
  return;
69
60
  }
61
+ var lastRawWork = (_five$work2 = five.work) === null || _five$work2 === void 0 || (_five$work2 = _five$work2.raw.works) === null || _five$work2 === void 0 ? void 0 : _five$work2[0];
62
+ if (!lastRawWork) {
63
+ console.warn('No raw work data available');
64
+ return;
65
+ }
70
66
 
71
- var lastRawWork = (_five$work = five.work) === null || _five$work === void 0 ? void 0 : _five$work.raw.works[0]; // 动态场景:不提供完成的签名数据,需重新整理
72
-
67
+ // 动态场景:不提供完成的签名数据,需重新整理
73
68
  if (data.dynamic_scene && !data.panorama) {
74
69
  var lastWork = JSON.parse(lastRawWork);
75
70
  var panorama = lastWork.panorama;
@@ -78,7 +73,6 @@ function UpdateVRPanorama() {
78
73
  data.panorama = panorama;
79
74
  delete data.dynamic_scene;
80
75
  }
81
-
82
76
  Object.assign(window, {
83
77
  $work1: JSON.parse(lastRawWork),
84
78
  $work2: data,
@@ -87,15 +81,17 @@ function UpdateVRPanorama() {
87
81
  updateWorkRef.current = (0, _five.parseWork)([lastRawWork, data]);
88
82
  five.load(updateWorkRef.current);
89
83
  };
84
+ controller.on(_VreoUnit.VreoKeyframeEnum.UpdateVRPanorama, callback);
90
85
 
91
- controller.on(_VreoUnit.VreoKeyframeEnum.UpdateVRPanorama, callback); // 离开 将之前的内容清空
92
-
93
- controller.on(_VreoUnit.VreoKeyframeEnum.Exit, restoreCallback); // 新载入数据 将之前的内容清空
94
-
95
- controller.on('loaded', restoreCallback); // 暂停 回到默认状态
86
+ // 离开 将之前的内容清空
87
+ controller.on(_VreoUnit.VreoKeyframeEnum.Exit, restoreCallback);
96
88
 
97
- controller.on('paused', pausedCallback); // 播放 回归暂停前状态
89
+ // 新载入数据 将之前的内容清空
90
+ controller.on('loaded', restoreCallback);
98
91
 
92
+ // 暂停 回到默认状态
93
+ controller.on('paused', pausedCallback);
94
+ // 播放 回归暂停前状态
99
95
  controller.on('playing', playingCallback);
100
96
  return function () {
101
97
  // 清理事件监听
@@ -1,2 +1,2 @@
1
- /// <reference types="react" />
2
- export declare function VideoEffect(): JSX.Element;
1
+ import * as React from 'react';
2
+ export declare function VideoEffect(): React.JSX.Element;
@@ -1,139 +1,106 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
4
  var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
5
  Object.defineProperty(exports, "__esModule", {
8
6
  value: true
9
7
  });
10
8
  exports.VideoEffect = VideoEffect;
11
-
12
9
  var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
13
-
14
10
  var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
15
-
16
11
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
17
-
18
12
  var _classnames = _interopRequireDefault(require("classnames"));
19
-
20
13
  var React = _interopRequireWildcard(require("react"));
21
-
22
14
  var _VreoUnit = require("../../../../typings/VreoUnit");
23
-
24
15
  var _hooks = require("../../../hooks");
25
-
26
- 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); }
27
-
28
- 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; }
29
-
16
+ 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); }
30
17
  // import { Preloader } from '../../../../shared-utils/Preloader'
18
+
31
19
  var inlinePlay = function inlinePlay(videoInstance) {
32
20
  if (!videoInstance) return;
33
-
34
- var canplaythrough = function canplaythrough() {
35
- videoInstance.removeEventListener('canplaythrough', canplaythrough);
36
-
21
+ var _canplaythrough = function canplaythrough() {
22
+ videoInstance.removeEventListener('canplaythrough', _canplaythrough);
37
23
  try {
38
24
  videoInstance.play();
39
25
  } catch (error) {}
40
26
  };
41
-
42
- videoInstance.addEventListener('canplaythrough', canplaythrough);
27
+ videoInstance.addEventListener('canplaythrough', _canplaythrough);
43
28
  videoInstance.load();
44
- }; // const emptyVideo = '//vrlab-static.ljcdn.com/release/web/leisure.69fd3522.mov'
45
-
29
+ };
46
30
 
31
+ // const emptyVideo = '//vrlab-static.ljcdn.com/release/web/leisure.69fd3522.mov'
47
32
  var PI = Math.PI;
48
33
  var PI_2 = PI * 2;
49
-
50
34
  function VideoEffect() {
51
35
  var ref = React.useRef(null);
52
36
  var videoRef = React.useRef();
53
37
  var controller = (0, _hooks.useController)();
54
38
  var timeoutRef = React.useRef();
55
-
56
39
  var _React$useState = React.useState(false),
57
- _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
58
- visible = _React$useState2[0],
59
- setVisible = _React$useState2[1];
60
-
40
+ _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
41
+ visible = _React$useState2[0],
42
+ setVisible = _React$useState2[1];
61
43
  var five = (0, _hooks.useFiveInstance)();
62
-
63
44
  var setBlobSrc = function setBlobSrc(blob) {
64
45
  if (!videoRef.current) return;
65
46
  videoRef.current.src = blob;
66
47
  };
67
-
68
48
  React.useEffect(function () {
69
49
  var callback = /*#__PURE__*/function () {
70
- var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(keyframe) {
50
+ var _ref = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(keyframe) {
71
51
  var start, end, _ref2, videoSrc, fov, direction, panoIndex, vector, _ref3, _ref4, longitude, latitude;
72
-
73
52
  return _regenerator["default"].wrap(function _callee$(_context) {
74
- while (1) {
75
- switch (_context.prev = _context.next) {
76
- case 0:
77
- start = keyframe.start, end = keyframe.end;
78
- _ref2 = keyframe.data, videoSrc = _ref2.videoSrc, fov = _ref2.fov, direction = _ref2.direction, panoIndex = _ref2.panoIndex, vector = _ref2.vector;
79
- _ref3 = function () {
80
- if (vector) {
81
- return [vector.longitude, vector.latitude];
82
- }
83
-
84
- if (!direction) {
85
- return [0, 0];
86
- }
87
-
88
- var longitude = -Math.atan2(direction.x, -direction.z);
89
- longitude = (longitude % PI_2 + PI_2) % PI_2;
90
- var latitude = -Math.asin(direction.y / 1);
91
- return [longitude, latitude];
92
- }(), _ref4 = (0, _slicedToArray2["default"])(_ref3, 2), longitude = _ref4[0], latitude = _ref4[1];
93
- five.setState({
94
- fov: fov,
95
- panoIndex: panoIndex,
96
- longitude: longitude,
97
- latitude: latitude
98
- }, true);
99
- setBlobSrc(videoSrc);
100
- inlinePlay(videoRef.current);
101
- setVisible(true);
102
- timeoutRef.current = setTimeout(function () {
103
- var _videoRef$current;
104
-
105
- (_videoRef$current = videoRef.current) === null || _videoRef$current === void 0 ? void 0 : _videoRef$current.pause();
106
- setVisible(false);
107
- setBlobSrc('');
108
- }, end - start);
109
-
110
- case 8:
111
- case "end":
112
- return _context.stop();
113
- }
53
+ while (1) switch (_context.prev = _context.next) {
54
+ case 0:
55
+ start = keyframe.start, end = keyframe.end;
56
+ _ref2 = keyframe.data, videoSrc = _ref2.videoSrc, fov = _ref2.fov, direction = _ref2.direction, panoIndex = _ref2.panoIndex, vector = _ref2.vector;
57
+ _ref3 = function () {
58
+ if (vector) {
59
+ return [vector.longitude, vector.latitude];
60
+ }
61
+ if (!direction) {
62
+ return [0, 0];
63
+ }
64
+ var longitude = -Math.atan2(direction.x, -direction.z);
65
+ longitude = (longitude % PI_2 + PI_2) % PI_2;
66
+ var latitude = -Math.asin(direction.y / 1);
67
+ return [longitude, latitude];
68
+ }(), _ref4 = (0, _slicedToArray2["default"])(_ref3, 2), longitude = _ref4[0], latitude = _ref4[1];
69
+ five.setState({
70
+ fov: fov,
71
+ panoIndex: panoIndex,
72
+ longitude: longitude,
73
+ latitude: latitude
74
+ }, true);
75
+ setBlobSrc(videoSrc);
76
+ inlinePlay(videoRef.current);
77
+ setVisible(true);
78
+ timeoutRef.current = setTimeout(function () {
79
+ var _videoRef$current;
80
+ (_videoRef$current = videoRef.current) === null || _videoRef$current === void 0 || _videoRef$current.pause();
81
+ setVisible(false);
82
+ setBlobSrc('');
83
+ }, end - start);
84
+ case 8:
85
+ case "end":
86
+ return _context.stop();
114
87
  }
115
88
  }, _callee);
116
89
  }));
117
-
118
90
  return function callback(_x) {
119
91
  return _ref.apply(this, arguments);
120
92
  };
121
93
  }();
122
-
123
94
  controller.on(_VreoUnit.VreoKeyframeEnum.VideoEffect, callback);
124
-
125
95
  var destroy = function destroy() {
126
96
  var _videoRef$current2;
127
-
128
97
  if (timeoutRef.current) {
129
98
  clearTimeout(timeoutRef.current);
130
99
  }
131
-
132
- (_videoRef$current2 = videoRef.current) === null || _videoRef$current2 === void 0 ? void 0 : _videoRef$current2.pause();
100
+ (_videoRef$current2 = videoRef.current) === null || _videoRef$current2 === void 0 || _videoRef$current2.pause();
133
101
  setVisible(false);
134
102
  setBlobSrc('');
135
103
  };
136
-
137
104
  controller.on('paused', function () {
138
105
  return destroy();
139
106
  });
@@ -142,18 +109,16 @@ function VideoEffect() {
142
109
  });
143
110
  return function () {
144
111
  controller.off(_VreoUnit.VreoKeyframeEnum.VideoEffect, callback);
145
-
146
112
  if (timeoutRef.current) {
147
113
  clearTimeout(timeoutRef.current);
148
114
  }
149
115
  };
150
116
  }, [controller]);
151
117
  React.useEffect(function () {
152
- var _controller$configs, _controller$configs$v;
153
-
118
+ var _controller$configs;
154
119
  if (!ref.current) return;
155
- var video = ((_controller$configs = controller.configs) === null || _controller$configs === void 0 ? void 0 : (_controller$configs$v = _controller$configs.videos) === null || _controller$configs$v === void 0 ? void 0 : _controller$configs$v.videoEffect) || document.createElement('video'); // <video playsInline key="VideoEffect-video" className="VideoEffect-video" src={blobSrc} />
156
-
120
+ var video = ((_controller$configs = controller.configs) === null || _controller$configs === void 0 || (_controller$configs = _controller$configs.videos) === null || _controller$configs === void 0 ? void 0 : _controller$configs.videoEffect) || document.createElement('video');
121
+ // <video playsInline key="VideoEffect-video" className="VideoEffect-video" src={blobSrc} />
157
122
  video.setAttribute('playsinline', 'true');
158
123
  video.setAttribute('webkit-playsinline', 'true');
159
124
  video.setAttribute('autoplay', 'true');
@@ -163,10 +128,10 @@ function VideoEffect() {
163
128
  ref.current.append(videoRef.current);
164
129
  document.addEventListener('WeixinJSBridgeReady', function () {
165
130
  var _videoRef$current3;
166
-
167
- (_videoRef$current3 = videoRef.current) === null || _videoRef$current3 === void 0 ? void 0 : _videoRef$current3.play();
131
+ (_videoRef$current3 = videoRef.current) === null || _videoRef$current3 === void 0 || _videoRef$current3.play();
168
132
  }, false);
169
- if (!ref.current) return; // const asyncfunc = async () => {
133
+ if (!ref.current) return;
134
+ // const asyncfunc = async () => {
170
135
  // setBlobSrc(await URL.createObjectURL(await Preloader.blob(emptyVideo)))
171
136
  // inlinePlay(videoRef.current)
172
137
  // }