@realsee/vreo 2.3.6 → 2.3.8
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.
- package/lib/PlayController/createHTMLAudioElement.js +7 -13
- package/lib/PlayController/index.js +27 -95
- package/lib/Player/App.js +2 -28
- package/lib/Player/Controller.js +48 -132
- package/lib/Player/custom/SpatialScenePanel/index.js +45 -76
- package/lib/Player/hooks.js +1 -11
- package/lib/Player/index.js +34 -101
- package/lib/Player/modules/Drawer/index.js +2 -19
- package/lib/Player/modules/PopUp/index.js +2 -12
- package/lib/Player/modules/ResizeObserver/index.js +1 -9
- package/lib/Player/modules/VideoAgent/VideoAgentMesh.js +29 -123
- package/lib/Player/modules/VideoAgent/VideoAgentScene.js +15 -37
- package/lib/Player/modules/VideoAgent/index.js +2 -19
- package/lib/Player/modules/Wave/index.js +14 -43
- package/lib/Player/modules/keyframes/BgMusic/index.js +10 -28
- package/lib/Player/modules/keyframes/CameraMovement/index.js +6 -30
- package/lib/Player/modules/keyframes/InfoPanel/index.js +9 -39
- package/lib/Player/modules/keyframes/ModelVideo/index.js +6 -32
- package/lib/Player/modules/keyframes/PanoEffect/index.js +19 -52
- package/lib/Player/modules/keyframes/PanoEffect/lineAnime.js +1 -8
- package/lib/Player/modules/keyframes/PanoTag/index.js +5 -23
- package/lib/Player/modules/keyframes/PanoTextLabel/index.js +27 -57
- package/lib/Player/modules/keyframes/Prompter/index.js +15 -42
- package/lib/Player/modules/keyframes/UpdateVRPanorama/index.js +19 -26
- package/lib/Player/modules/keyframes/VideoEffect/index.js +18 -59
- package/lib/fivePlugins/CSS3DRenderPlugin/centerPoint.js +0 -2
- package/lib/fivePlugins/CSS3DRenderPlugin/createResizeObserver.js +0 -1
- package/lib/fivePlugins/CSS3DRenderPlugin/evenNumber.js +0 -1
- package/lib/fivePlugins/CSS3DRenderPlugin/index.js +21 -62
- package/lib/fivePlugins/CSS3DRenderPlugin/transformPositionToVector3.js +2 -5
- package/lib/fivePlugins/CameraMovementPlugin/index.js +20 -74
- package/lib/fivePlugins/CameraMovementPlugin/typings.js +0 -4
- package/lib/fivePlugins/ModelTVVideoPlugin/index.js +15 -69
- package/lib/index.js +0 -1
- package/lib/react/index.js +10 -41
- package/lib/shared-utils/Audio.js +35 -96
- package/lib/shared-utils/AudioLike.js +20 -56
- package/lib/shared-utils/Preloader.js +0 -7
- package/lib/shared-utils/addResizeListener.js +0 -5
- package/lib/shared-utils/animationFrame/BetterTween.js +19 -58
- package/lib/shared-utils/animationFrame/index.js +2 -10
- package/lib/shared-utils/animationFrame/tween.js +2 -11
- package/lib/shared-utils/createTransMatrix.js +5 -26
- package/lib/shared-utils/getFileExpandedName.js +0 -1
- package/lib/shared-utils/getMediaInfo.js +1 -10
- package/lib/shared-utils/setElementDataset.js +0 -2
- package/lib/typings/VreoUnit.js +0 -15
- package/package.json +4 -3
|
@@ -1,55 +1,40 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
8
|
exports.VideoAgent = VideoAgent;
|
|
9
|
-
|
|
10
9
|
var React = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
10
|
var _hooks = require("../../hooks");
|
|
13
|
-
|
|
14
11
|
var _VideoAgentScene = require("./VideoAgentScene");
|
|
15
|
-
|
|
16
12
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
17
|
-
|
|
18
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
19
|
-
|
|
20
13
|
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); }
|
|
21
|
-
|
|
22
14
|
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; }
|
|
23
|
-
|
|
24
15
|
function VideoAgent(props) {
|
|
25
16
|
var _controller$avatar2;
|
|
26
|
-
|
|
27
17
|
var ref = React.useRef(null);
|
|
28
18
|
var controller = (0, _hooks.useController)();
|
|
29
19
|
var showAvatar = React.useMemo(function () {
|
|
30
20
|
var _controller$avatar;
|
|
31
|
-
|
|
32
21
|
return ((_controller$avatar = controller.avatar) === null || _controller$avatar === void 0 ? void 0 : _controller$avatar.url) && controller.avatar.force === true;
|
|
33
22
|
}, [controller.avatar]);
|
|
34
23
|
var showVideoAgent = React.useMemo(function () {
|
|
35
24
|
var _controller$videoAgen;
|
|
36
|
-
|
|
37
25
|
if (showAvatar) return false;
|
|
38
26
|
return ((_controller$videoAgen = controller.videoAgentScene) === null || _controller$videoAgen === void 0 ? void 0 : _controller$videoAgen.videoAgentMesh.mediaInstance) instanceof HTMLVideoElement;
|
|
39
27
|
}, [controller.videoAgentScene, showAvatar]);
|
|
40
28
|
React.useEffect(function () {
|
|
41
29
|
if (!ref.current) throw new Error('React 渲染异常,请稍后重试 ...');
|
|
42
|
-
|
|
43
30
|
if (controller.videoAgentScene) {
|
|
44
31
|
console.warn('VideoAgentScene" 重复初始化,已被过滤');
|
|
45
32
|
return;
|
|
46
33
|
}
|
|
47
|
-
|
|
48
34
|
var videoAgentScene = new _VideoAgentScene.VideoAgentScene(ref.current, props.options);
|
|
49
35
|
controller.videoAgentScene = videoAgentScene;
|
|
50
36
|
return function () {
|
|
51
37
|
var _controller$videoAgen2;
|
|
52
|
-
|
|
53
38
|
controller.dispose();
|
|
54
39
|
(_controller$videoAgen2 = controller.videoAgentScene) === null || _controller$videoAgen2 === void 0 ? void 0 : _controller$videoAgen2.dispose();
|
|
55
40
|
};
|
|
@@ -66,7 +51,6 @@ function VideoAgent(props) {
|
|
|
66
51
|
src: (_controller$avatar2 = controller.avatar) === null || _controller$avatar2 === void 0 ? void 0 : _controller$avatar2.url,
|
|
67
52
|
onClick: function onClick() {
|
|
68
53
|
var _props$onClick;
|
|
69
|
-
|
|
70
54
|
return (_props$onClick = props.onClick) === null || _props$onClick === void 0 ? void 0 : _props$onClick.call(props);
|
|
71
55
|
}
|
|
72
56
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
@@ -84,7 +68,6 @@ function VideoAgent(props) {
|
|
|
84
68
|
className: "VideoAgent-play",
|
|
85
69
|
onClick: function onClick() {
|
|
86
70
|
var _props$onClick2;
|
|
87
|
-
|
|
88
71
|
return (_props$onClick2 = props.onClick) === null || _props$onClick2 === void 0 ? void 0 : _props$onClick2.call(props);
|
|
89
72
|
}
|
|
90
73
|
}))))));
|
|
@@ -1,30 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
8
|
exports.Wave = Wave;
|
|
9
|
-
|
|
9
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
10
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
11
|
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); }
|
|
13
|
-
|
|
14
12
|
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; }
|
|
15
|
-
|
|
16
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
17
|
-
|
|
18
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
19
|
-
|
|
20
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
21
|
-
|
|
22
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
23
|
-
|
|
24
|
-
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
25
|
-
|
|
26
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
27
|
-
|
|
28
13
|
var defaultPrefix = 'https://vr-public.realsee-cdn.cn/release/static/image/release/';
|
|
29
14
|
var WAVES = {
|
|
30
15
|
single: {
|
|
@@ -74,21 +59,16 @@ var isSafari = /safari/i.test(userAgent) && !/chrome/i.test(userAgent) && /versi
|
|
|
74
59
|
var isMicroMessenger = /microMessenger/i.test(userAgent);
|
|
75
60
|
var canPlayHevc = isAppleDevice || isSafari;
|
|
76
61
|
var canPlayVp9 = typeof MediaSource !== 'undefined' && MediaSource.isTypeSupported("video/webm; codecs=vp9");
|
|
77
|
-
|
|
78
62
|
function Wave(props) {
|
|
79
63
|
var wave = _react["default"].useMemo(function () {
|
|
80
64
|
var _props$appearance;
|
|
81
|
-
|
|
82
65
|
var appearance = (_props$appearance = props === null || props === void 0 ? void 0 : props.appearance) !== null && _props$appearance !== void 0 ? _props$appearance : 'solid';
|
|
83
66
|
return WAVES[appearance];
|
|
84
67
|
}, [props === null || props === void 0 ? void 0 : props.appearance]);
|
|
85
|
-
|
|
86
68
|
var heightWidthRatio = _react["default"].useMemo(function () {
|
|
87
69
|
return wave.height / wave.width;
|
|
88
70
|
}, [wave]);
|
|
89
|
-
|
|
90
71
|
var content = null;
|
|
91
|
-
|
|
92
72
|
if (isMicroMessenger) {
|
|
93
73
|
content = /*#__PURE__*/_react["default"].createElement(KeyframeWaveContent, {
|
|
94
74
|
wave: wave,
|
|
@@ -112,7 +92,6 @@ function Wave(props) {
|
|
|
112
92
|
prefix: props === null || props === void 0 ? void 0 : props.staticPrefix
|
|
113
93
|
});
|
|
114
94
|
}
|
|
115
|
-
|
|
116
95
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
117
96
|
className: "vreo-wave",
|
|
118
97
|
onClick: props === null || props === void 0 ? void 0 : props.onClick
|
|
@@ -132,24 +111,20 @@ function Wave(props) {
|
|
|
132
111
|
}
|
|
133
112
|
}, content)));
|
|
134
113
|
}
|
|
135
|
-
|
|
136
114
|
var VideoWaveContent = function VideoWaveContent(_ref) {
|
|
137
115
|
var wave = _ref.wave,
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
116
|
+
format = _ref.format,
|
|
117
|
+
_ref$prefix = _ref.prefix,
|
|
118
|
+
prefix = _ref$prefix === void 0 ? defaultPrefix : _ref$prefix;
|
|
141
119
|
var videoRef = (0, _react.useRef)(null);
|
|
142
|
-
|
|
143
120
|
var _useState = (0, _react.useState)(false),
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
121
|
+
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
122
|
+
canPlay = _useState2[0],
|
|
123
|
+
setCanPlay = _useState2[1];
|
|
148
124
|
var _useState3 = (0, _react.useState)(false),
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
125
|
+
_useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
|
|
126
|
+
errored = _useState4[0],
|
|
127
|
+
setErrored = _useState4[1];
|
|
153
128
|
var source = prefix + wave[format];
|
|
154
129
|
(0, _react.useEffect)(function () {
|
|
155
130
|
setCanPlay(false);
|
|
@@ -158,20 +133,17 @@ var VideoWaveContent = function VideoWaveContent(_ref) {
|
|
|
158
133
|
if (videoRef.current) {
|
|
159
134
|
videoRef.current.play();
|
|
160
135
|
}
|
|
161
|
-
|
|
162
136
|
setCanPlay(true);
|
|
163
137
|
}, []);
|
|
164
138
|
var errorHandler = (0, _react.useCallback)(function () {
|
|
165
139
|
setErrored(true);
|
|
166
140
|
}, []);
|
|
167
|
-
|
|
168
141
|
if (errored) {
|
|
169
142
|
return /*#__PURE__*/_react["default"].createElement(KeyframeWaveContent, {
|
|
170
143
|
wave: wave,
|
|
171
144
|
prefix: prefix
|
|
172
145
|
});
|
|
173
146
|
}
|
|
174
|
-
|
|
175
147
|
return /*#__PURE__*/_react["default"].createElement("video", {
|
|
176
148
|
style: {
|
|
177
149
|
opacity: canPlay ? 1 : 0
|
|
@@ -189,11 +161,10 @@ var VideoWaveContent = function VideoWaveContent(_ref) {
|
|
|
189
161
|
src: source
|
|
190
162
|
});
|
|
191
163
|
};
|
|
192
|
-
|
|
193
164
|
var KeyframeWaveContent = function KeyframeWaveContent(_ref2) {
|
|
194
165
|
var wave = _ref2.wave,
|
|
195
|
-
|
|
196
|
-
|
|
166
|
+
_ref2$prefix = _ref2.prefix,
|
|
167
|
+
prefix = _ref2$prefix === void 0 ? defaultPrefix : _ref2$prefix;
|
|
197
168
|
var source = prefix + wave.png;
|
|
198
169
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
199
170
|
style: {
|
|
@@ -1,80 +1,64 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
8
|
exports.BgMusic = BgMusic;
|
|
9
|
-
|
|
9
|
+
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
10
|
+
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
10
11
|
var React = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
12
|
var _Audio = require("../../../../shared-utils/Audio");
|
|
13
|
-
|
|
14
13
|
var _VreoUnit = require("../../../../typings/VreoUnit");
|
|
15
|
-
|
|
16
14
|
var _hooks = require("../../../hooks");
|
|
17
|
-
|
|
18
15
|
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
16
|
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
|
-
|
|
22
|
-
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
|
|
23
|
-
|
|
24
|
-
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
|
|
25
|
-
|
|
26
17
|
function BgMusic() {
|
|
27
18
|
var controller = (0, _hooks.useController)();
|
|
28
19
|
React.useEffect(function () {
|
|
29
20
|
var callback = /*#__PURE__*/function () {
|
|
30
|
-
var _ref =
|
|
21
|
+
var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(keyframe, currentTime) {
|
|
31
22
|
var start, end, _currentTime, audio, cleanAudio, play;
|
|
32
|
-
|
|
33
|
-
return regeneratorRuntime.wrap(function _callee$(_context) {
|
|
23
|
+
return _regenerator["default"].wrap(function _callee$(_context) {
|
|
34
24
|
while (1) {
|
|
35
25
|
switch (_context.prev = _context.next) {
|
|
36
26
|
case 0:
|
|
37
27
|
start = keyframe.start, end = keyframe.end;
|
|
38
28
|
_currentTime = (currentTime - start) / 1000;
|
|
39
|
-
|
|
40
29
|
if (!(_currentTime < 0 || _currentTime >= keyframe.end - keyframe.start)) {
|
|
41
30
|
_context.next = 4;
|
|
42
31
|
break;
|
|
43
32
|
}
|
|
44
|
-
|
|
45
33
|
return _context.abrupt("return");
|
|
46
|
-
|
|
47
34
|
case 4:
|
|
48
35
|
audio = (0, _Audio.getAudio)(keyframe.data.url);
|
|
49
|
-
audio.currentTime = Math.max(0, _currentTime);
|
|
36
|
+
audio.currentTime = Math.max(0, _currentTime);
|
|
37
|
+
// console.log('play', audio.src)
|
|
50
38
|
// const play = () => audio.play()
|
|
51
39
|
|
|
52
40
|
audio.play();
|
|
53
|
-
|
|
54
41
|
cleanAudio = function cleanAudio() {
|
|
55
42
|
// audio.removeEventListener('canplaythrough', play)
|
|
56
43
|
audio.removeEventListener('pause', play);
|
|
57
44
|
audio.pause();
|
|
58
|
-
audio.src = '';
|
|
45
|
+
audio.src = '';
|
|
46
|
+
// cleanTimeout()
|
|
59
47
|
}; // audio.addEventListener('canplaythrough', play)
|
|
60
48
|
|
|
61
|
-
|
|
62
49
|
audio.addEventListener('ended', function () {
|
|
63
50
|
cleanAudio();
|
|
64
51
|
});
|
|
65
|
-
|
|
66
52
|
play = function play() {
|
|
67
53
|
if (audio.realSrc === keyframe.data.url) {
|
|
68
54
|
// 有可能会被其他音轨打断
|
|
69
55
|
audio.play();
|
|
70
56
|
}
|
|
71
57
|
};
|
|
72
|
-
|
|
73
58
|
audio.addEventListener('pause', play);
|
|
74
59
|
controller.once('paused', function () {
|
|
75
60
|
cleanAudio();
|
|
76
61
|
});
|
|
77
|
-
|
|
78
62
|
case 12:
|
|
79
63
|
case "end":
|
|
80
64
|
return _context.stop();
|
|
@@ -82,12 +66,10 @@ function BgMusic() {
|
|
|
82
66
|
}
|
|
83
67
|
}, _callee);
|
|
84
68
|
}));
|
|
85
|
-
|
|
86
69
|
return function callback(_x, _x2) {
|
|
87
70
|
return _ref.apply(this, arguments);
|
|
88
71
|
};
|
|
89
72
|
}();
|
|
90
|
-
|
|
91
73
|
controller.on(_VreoUnit.VreoKeyframeEnum.BgMusic, callback);
|
|
92
74
|
return function () {
|
|
93
75
|
controller.off(_VreoUnit.VreoKeyframeEnum.BgMusic, callback);
|
|
@@ -1,92 +1,70 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
8
|
exports.CameraMovement = CameraMovement;
|
|
9
|
-
|
|
9
|
+
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
10
|
+
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
10
11
|
var React = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
12
|
var _CameraMovementPlugin = require("../../../../fivePlugins/CameraMovementPlugin");
|
|
13
|
-
|
|
14
13
|
var _typings = require("../../../../fivePlugins/CameraMovementPlugin/typings");
|
|
15
|
-
|
|
16
14
|
var _VreoUnit = require("../../../../typings/VreoUnit");
|
|
17
|
-
|
|
18
15
|
var _hooks = require("../../../hooks");
|
|
19
|
-
|
|
20
16
|
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); }
|
|
21
|
-
|
|
22
17
|
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; }
|
|
23
|
-
|
|
24
|
-
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
|
|
25
|
-
|
|
26
|
-
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
|
|
27
|
-
|
|
28
18
|
function CameraMovement() {
|
|
29
19
|
var controller = (0, _hooks.useController)();
|
|
30
20
|
var five = (0, _hooks.useFiveInstance)();
|
|
31
21
|
var ref = React.useRef();
|
|
32
22
|
React.useEffect(function () {
|
|
33
23
|
var callback = /*#__PURE__*/function () {
|
|
34
|
-
var _ref =
|
|
24
|
+
var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(keyframe) {
|
|
35
25
|
var start, end, data, cameraMovementData, effect;
|
|
36
|
-
return
|
|
26
|
+
return _regenerator["default"].wrap(function _callee$(_context) {
|
|
37
27
|
while (1) {
|
|
38
28
|
switch (_context.prev = _context.next) {
|
|
39
29
|
case 0:
|
|
40
30
|
if (!ref.current) {
|
|
41
31
|
ref.current = (0, _CameraMovementPlugin.CameraMovementPlugin)(five, {});
|
|
42
32
|
}
|
|
43
|
-
|
|
44
33
|
start = keyframe.start, end = keyframe.end, data = keyframe.data;
|
|
45
34
|
cameraMovementData = data;
|
|
46
35
|
effect = cameraMovementData.effect;
|
|
47
|
-
|
|
48
36
|
if (!(effect === _typings.CameraMovementEffect.Rotate)) {
|
|
49
37
|
_context.next = 9;
|
|
50
38
|
break;
|
|
51
39
|
}
|
|
52
|
-
|
|
53
40
|
_context.next = 7;
|
|
54
41
|
return ref.current.rotate(data, end - start);
|
|
55
|
-
|
|
56
42
|
case 7:
|
|
57
43
|
_context.next = 21;
|
|
58
44
|
break;
|
|
59
|
-
|
|
60
45
|
case 9:
|
|
61
46
|
if (!(effect === _typings.CameraMovementEffect.Move)) {
|
|
62
47
|
_context.next = 14;
|
|
63
48
|
break;
|
|
64
49
|
}
|
|
65
|
-
|
|
66
50
|
_context.next = 12;
|
|
67
51
|
return ref.current.move(data, end - start);
|
|
68
|
-
|
|
69
52
|
case 12:
|
|
70
53
|
_context.next = 21;
|
|
71
54
|
break;
|
|
72
|
-
|
|
73
55
|
case 14:
|
|
74
56
|
if (!(cameraMovementData.panoIndex !== undefined && cameraMovementData.panoIndex !== five.panoIndex)) {
|
|
75
57
|
_context.next = 19;
|
|
76
58
|
break;
|
|
77
59
|
}
|
|
78
|
-
|
|
79
60
|
_context.next = 17;
|
|
80
61
|
return ref.current.move(data, end - start);
|
|
81
|
-
|
|
82
62
|
case 17:
|
|
83
63
|
_context.next = 21;
|
|
84
64
|
break;
|
|
85
|
-
|
|
86
65
|
case 19:
|
|
87
66
|
_context.next = 21;
|
|
88
67
|
return ref.current.rotate(data, end - start);
|
|
89
|
-
|
|
90
68
|
case 21:
|
|
91
69
|
case "end":
|
|
92
70
|
return _context.stop();
|
|
@@ -94,12 +72,10 @@ function CameraMovement() {
|
|
|
94
72
|
}
|
|
95
73
|
}, _callee);
|
|
96
74
|
}));
|
|
97
|
-
|
|
98
75
|
return function callback(_x) {
|
|
99
76
|
return _ref.apply(this, arguments);
|
|
100
77
|
};
|
|
101
78
|
}();
|
|
102
|
-
|
|
103
79
|
controller.on(_VreoUnit.VreoKeyframeEnum.CameraMovement, callback);
|
|
104
80
|
return function () {
|
|
105
81
|
controller.off(_VreoUnit.VreoKeyframeEnum.CameraMovement, callback);
|
|
@@ -1,32 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.InfoPanel = InfoPanel;
|
|
9
|
-
|
|
10
8
|
var React = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
9
|
var _VreoUnit = require("../../../../typings/VreoUnit");
|
|
13
|
-
|
|
14
10
|
var _hooks = require("../../../hooks");
|
|
15
|
-
|
|
16
11
|
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); }
|
|
17
|
-
|
|
18
12
|
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; }
|
|
19
|
-
|
|
20
13
|
var isWX = navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1;
|
|
21
14
|
var isIOS = navigator.userAgent.toLowerCase().indexOf('iphone') !== -1;
|
|
22
15
|
var isIOSorWX = isIOS || isWX;
|
|
23
|
-
|
|
24
16
|
var _videoElement = document.createElement('video');
|
|
25
|
-
|
|
26
17
|
_videoElement.setAttribute('playsinline', 'true');
|
|
27
|
-
|
|
28
18
|
_videoElement.setAttribute('webkit-playsinline', 'true');
|
|
29
|
-
|
|
30
19
|
if (isIOSorWX) {
|
|
31
20
|
if (_videoElement.paused) {
|
|
32
21
|
_videoElement.addEventListener('click', function () {
|
|
@@ -36,10 +25,9 @@ if (isIOSorWX) {
|
|
|
36
25
|
});
|
|
37
26
|
}
|
|
38
27
|
}
|
|
39
|
-
|
|
40
28
|
function InfoPanelImg(_ref) {
|
|
41
29
|
var url = _ref.url,
|
|
42
|
-
|
|
30
|
+
children = _ref.children;
|
|
43
31
|
return /*#__PURE__*/React.createElement("div", {
|
|
44
32
|
className: "vreo-infoPanel-container"
|
|
45
33
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -48,40 +36,33 @@ function InfoPanelImg(_ref) {
|
|
|
48
36
|
src: url
|
|
49
37
|
})));
|
|
50
38
|
}
|
|
51
|
-
|
|
52
39
|
function InfoPanelVideo(_ref2) {
|
|
53
40
|
var url = _ref2.url,
|
|
54
|
-
|
|
41
|
+
children = _ref2.children;
|
|
55
42
|
var videoWrapperRef = React.useRef(null);
|
|
56
43
|
var controller = (0, _hooks.useController)();
|
|
57
44
|
React.useEffect(function () {
|
|
58
45
|
var _controller$configs, _controller$configs$v;
|
|
59
|
-
|
|
60
46
|
// if (!isIOSorWX) return
|
|
61
47
|
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.videoPanel) || _videoElement;
|
|
62
48
|
if (!videoWrapperRef.current) return;
|
|
63
49
|
video.src = url;
|
|
64
|
-
|
|
65
50
|
if (!videoWrapperRef.current.contains(video)) {
|
|
66
51
|
videoWrapperRef.current.appendChild(video);
|
|
67
52
|
}
|
|
68
|
-
|
|
69
53
|
var canplaythrough = function canplaythrough() {
|
|
70
54
|
video.removeEventListener('canplaythrough', canplaythrough);
|
|
71
|
-
|
|
72
55
|
try {
|
|
73
56
|
video.play();
|
|
74
57
|
} catch (error) {}
|
|
75
58
|
};
|
|
76
|
-
|
|
77
59
|
video.addEventListener('canplaythrough', canplaythrough);
|
|
78
|
-
video.load();
|
|
60
|
+
video.load();
|
|
61
|
+
// video.play()
|
|
79
62
|
|
|
80
63
|
return function () {
|
|
81
64
|
var _videoWrapperRef$curr;
|
|
82
|
-
|
|
83
65
|
video.pause();
|
|
84
|
-
|
|
85
66
|
if ((_videoWrapperRef$curr = videoWrapperRef.current) !== null && _videoWrapperRef$curr !== void 0 && _videoWrapperRef$curr.contains(video)) {
|
|
86
67
|
videoWrapperRef.current.removeChild(video);
|
|
87
68
|
}
|
|
@@ -96,12 +77,10 @@ function InfoPanelVideo(_ref2) {
|
|
|
96
77
|
ref: videoWrapperRef
|
|
97
78
|
})));
|
|
98
79
|
}
|
|
99
|
-
|
|
100
80
|
var Title = function Title(props) {
|
|
101
81
|
if (!props.title && !props.subTitle) {
|
|
102
82
|
return null;
|
|
103
83
|
}
|
|
104
|
-
|
|
105
84
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
106
85
|
className: "vreo-infoPanel-title"
|
|
107
86
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -110,26 +89,22 @@ var Title = function Title(props) {
|
|
|
110
89
|
className: "vreo-infoPanel-t2"
|
|
111
90
|
}, props.subTitle)));
|
|
112
91
|
};
|
|
113
|
-
|
|
114
92
|
function InfoPanel() {
|
|
115
93
|
var timeoutRef = React.useRef();
|
|
116
94
|
var controller = (0, _hooks.useController)();
|
|
117
95
|
React.useEffect(function () {
|
|
118
96
|
var _controller$configs2;
|
|
119
|
-
|
|
120
97
|
if (((_controller$configs2 = controller.configs) === null || _controller$configs2 === void 0 ? void 0 : _controller$configs2.keyframeMap.InfoPanel) === false) {
|
|
121
98
|
return;
|
|
122
99
|
}
|
|
123
|
-
|
|
124
100
|
var callback = function callback(keyframe) {
|
|
125
101
|
var start = keyframe.start,
|
|
126
|
-
|
|
127
|
-
|
|
102
|
+
end = keyframe.end,
|
|
103
|
+
data = keyframe.data;
|
|
128
104
|
var infoPanelData = data;
|
|
129
105
|
var title = infoPanelData.title,
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
106
|
+
subTitle = infoPanelData.subTitle,
|
|
107
|
+
style = infoPanelData.style;
|
|
133
108
|
do {
|
|
134
109
|
if (style === _VreoUnit.InfoPanelStyleEnum.PopUp) {
|
|
135
110
|
if (infoPanelData.type === _VreoUnit.InfoPanelTypeEnum.Image) {
|
|
@@ -147,10 +122,8 @@ function InfoPanel() {
|
|
|
147
122
|
subTitle: subTitle
|
|
148
123
|
})));
|
|
149
124
|
}
|
|
150
|
-
|
|
151
125
|
break;
|
|
152
126
|
}
|
|
153
|
-
|
|
154
127
|
if (infoPanelData.type === _VreoUnit.InfoPanelTypeEnum.Image) {
|
|
155
128
|
controller.openDrawer({
|
|
156
129
|
content: /*#__PURE__*/React.createElement(InfoPanelImg, {
|
|
@@ -173,13 +146,11 @@ function InfoPanel() {
|
|
|
173
146
|
});
|
|
174
147
|
}
|
|
175
148
|
} while (false);
|
|
176
|
-
|
|
177
149
|
timeoutRef.current = setTimeout(function () {
|
|
178
150
|
controller.openDrawer(false);
|
|
179
151
|
controller.openPopUp(false);
|
|
180
152
|
}, end - start);
|
|
181
153
|
};
|
|
182
|
-
|
|
183
154
|
controller.on(_VreoUnit.VreoKeyframeEnum.InfoPanel, callback);
|
|
184
155
|
controller.on('ended', function () {
|
|
185
156
|
controller.openPopUp(false);
|
|
@@ -189,7 +160,6 @@ function InfoPanel() {
|
|
|
189
160
|
});
|
|
190
161
|
return function () {
|
|
191
162
|
controller.off(_VreoUnit.VreoKeyframeEnum.InfoPanel, callback);
|
|
192
|
-
|
|
193
163
|
if (timeoutRef.current) {
|
|
194
164
|
clearTimeout(timeoutRef.current);
|
|
195
165
|
}
|