@realsee/vreo 1.0.0-alpha.30 → 1.0.0-alpha.32
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.
|
@@ -57,6 +57,7 @@ export declare class Controller extends Subscribe<VreoKeyframeEvent> {
|
|
|
57
57
|
*/
|
|
58
58
|
requestAnimationFrameLoop(callback: (type: VreoKeyframeEnum, keyframe: VreoKeyframe, currentTime: number) => void): void;
|
|
59
59
|
run(callback: (type: VreoKeyframeEnum, keyframe: VreoKeyframe) => void): void;
|
|
60
|
+
clear(): void;
|
|
60
61
|
dispose(): void;
|
|
61
62
|
}
|
|
62
63
|
declare const ControllerContext: React.Context<Controller | null>;
|
package/lib/Player/Controller.js
CHANGED
|
@@ -332,8 +332,8 @@ var Controller = /*#__PURE__*/function (_Subscribe) {
|
|
|
332
332
|
});
|
|
333
333
|
}
|
|
334
334
|
}, {
|
|
335
|
-
key: "
|
|
336
|
-
value: function
|
|
335
|
+
key: "clear",
|
|
336
|
+
value: function clear() {
|
|
337
337
|
var _this$vreoUnit2, _this$stopInterval;
|
|
338
338
|
this.setPlaying(false);
|
|
339
339
|
(_this$vreoUnit2 = this.vreoUnit) === null || _this$vreoUnit2 === void 0 ? void 0 : _this$vreoUnit2.keyframes.forEach(function (keyframe) {
|
|
@@ -351,6 +351,11 @@ var Controller = /*#__PURE__*/function (_Subscribe) {
|
|
|
351
351
|
(_this$stopInterval = this.stopInterval) === null || _this$stopInterval === void 0 ? void 0 : _this$stopInterval.call(this);
|
|
352
352
|
this.stopInterval = undefined;
|
|
353
353
|
}
|
|
354
|
+
}, {
|
|
355
|
+
key: "dispose",
|
|
356
|
+
value: function dispose() {
|
|
357
|
+
this.clear();
|
|
358
|
+
}
|
|
354
359
|
}]);
|
|
355
360
|
return Controller;
|
|
356
361
|
}(_five.Subscribe);
|
package/lib/Player/index.js
CHANGED
|
@@ -124,23 +124,24 @@ var Player = /*#__PURE__*/function (_Subscribe) {
|
|
|
124
124
|
currentTime = _args.length > 1 && _args[1] !== undefined ? _args[1] : 0;
|
|
125
125
|
preload = _args.length > 2 && _args[2] !== undefined ? _args[2] : false;
|
|
126
126
|
force = _args.length > 3 && _args[3] !== undefined ? _args[3] : false;
|
|
127
|
+
this.controller.clear();
|
|
127
128
|
this.controller.setLoading(true);
|
|
128
129
|
if (force) {
|
|
129
130
|
vreoUnit = JSON.parse(JSON.stringify(vreoUnit));
|
|
130
131
|
}
|
|
131
132
|
if (this.controller.visible) {
|
|
132
|
-
_context.next =
|
|
133
|
+
_context.next = 10;
|
|
133
134
|
break;
|
|
134
135
|
}
|
|
135
136
|
this.controller.setVisible(true);
|
|
136
137
|
// 延迟 500ms 规避跟 DOM 动画冲突
|
|
137
|
-
_context.next =
|
|
138
|
+
_context.next = 10;
|
|
138
139
|
return new Promise(function (resolve) {
|
|
139
140
|
setTimeout(function () {
|
|
140
141
|
return resolve(true);
|
|
141
142
|
}, 500);
|
|
142
143
|
});
|
|
143
|
-
case
|
|
144
|
+
case 10:
|
|
144
145
|
if (this.controller.stopInterval) {
|
|
145
146
|
this.controller.stopInterval();
|
|
146
147
|
this.controller.stopInterval = undefined;
|
|
@@ -156,7 +157,7 @@ var Player = /*#__PURE__*/function (_Subscribe) {
|
|
|
156
157
|
|
|
157
158
|
// 预载数据中的点位
|
|
158
159
|
if (!(preload || preload === undefined && this.configs.autoPreload)) {
|
|
159
|
-
_context.next =
|
|
160
|
+
_context.next = 24;
|
|
160
161
|
break;
|
|
161
162
|
}
|
|
162
163
|
panoIndexMap = vreoUnit.keyframes.filter(function (vreoKeyframe) {
|
|
@@ -177,18 +178,18 @@ var Player = /*#__PURE__*/function (_Subscribe) {
|
|
|
177
178
|
}, {});
|
|
178
179
|
panoIndexes = Object.keys(panoIndexMap);
|
|
179
180
|
i = 0;
|
|
180
|
-
case
|
|
181
|
+
case 18:
|
|
181
182
|
if (!(i < panoIndexes.length)) {
|
|
182
|
-
_context.next =
|
|
183
|
+
_context.next = 24;
|
|
183
184
|
break;
|
|
184
185
|
}
|
|
185
|
-
_context.next =
|
|
186
|
+
_context.next = 21;
|
|
186
187
|
return this.$five.preloadPano(Number(panoIndexes[i]));
|
|
187
|
-
case
|
|
188
|
+
case 21:
|
|
188
189
|
i++;
|
|
189
|
-
_context.next =
|
|
190
|
+
_context.next = 18;
|
|
190
191
|
break;
|
|
191
|
-
case
|
|
192
|
+
case 24:
|
|
192
193
|
// 新数据载入就绪
|
|
193
194
|
this.emit('loaded', vreoUnit);
|
|
194
195
|
this.controller.emit('loaded', vreoUnit);
|
|
@@ -196,12 +197,12 @@ var Player = /*#__PURE__*/function (_Subscribe) {
|
|
|
196
197
|
this.controller.videoAgentScene.videoAgentMesh.mediaInstance.currentTime = currentTime / 1000;
|
|
197
198
|
}
|
|
198
199
|
this.controller.setAvatar(vreoUnit.video.avatar);
|
|
199
|
-
_context.next =
|
|
200
|
+
_context.next = 30;
|
|
200
201
|
return (0, _Audio.waitForBlankAudioGenerated)();
|
|
201
|
-
case
|
|
202
|
-
_context.next =
|
|
202
|
+
case 30:
|
|
203
|
+
_context.next = 32;
|
|
203
204
|
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);
|
|
204
|
-
case
|
|
205
|
+
case 32:
|
|
205
206
|
this.controller.setEnded(false);
|
|
206
207
|
this.play();
|
|
207
208
|
this.controller.run(function (type, keyframe) {
|
|
@@ -209,7 +210,7 @@ var Player = /*#__PURE__*/function (_Subscribe) {
|
|
|
209
210
|
});
|
|
210
211
|
this.controller.setLoading(false);
|
|
211
212
|
return _context.abrupt("return", true);
|
|
212
|
-
case
|
|
213
|
+
case 37:
|
|
213
214
|
case "end":
|
|
214
215
|
return _context.stop();
|
|
215
216
|
}
|
|
@@ -274,7 +275,6 @@ var Player = /*#__PURE__*/function (_Subscribe) {
|
|
|
274
275
|
}, {
|
|
275
276
|
key: "dispose",
|
|
276
277
|
value: function dispose() {
|
|
277
|
-
this.pause();
|
|
278
278
|
this.controller.dispose();
|
|
279
279
|
if (this.configs.container) {
|
|
280
280
|
ReactDOM.unmountComponentAtNode(this.configs.container);
|
|
@@ -46,7 +46,7 @@ var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
46
46
|
* @param options
|
|
47
47
|
*/
|
|
48
48
|
function VideoAgentMesh(width, height, widthSegments, heightSegments) {
|
|
49
|
-
var _this$options$videoIn, _this$options$videoIn2
|
|
49
|
+
var _this$options$videoIn, _this$options$videoIn2;
|
|
50
50
|
var _this;
|
|
51
51
|
var options = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {
|
|
52
52
|
preload: true
|
|
@@ -118,25 +118,20 @@ var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
118
118
|
var onPlay = function onPlay() {
|
|
119
119
|
return updatePaused(false);
|
|
120
120
|
};
|
|
121
|
-
var onEnded = function onEnded() {
|
|
122
|
-
return console.log('vreo: video 播放结束');
|
|
123
|
-
};
|
|
124
121
|
_this.audioInstance.addEventListener('pause', onPause);
|
|
125
122
|
_this.audioInstance.addEventListener('play', onPlay);
|
|
126
123
|
(_this$options$videoIn = _this.options.videoInstance) === null || _this$options$videoIn === void 0 ? void 0 : _this$options$videoIn.addEventListener('pause', onPause);
|
|
127
124
|
(_this$options$videoIn2 = _this.options.videoInstance) === null || _this$options$videoIn2 === void 0 ? void 0 : _this$options$videoIn2.addEventListener('play', onPlay);
|
|
128
125
|
_this.audioLikeInstance.addEventListener('pause', onPause);
|
|
129
126
|
_this.audioLikeInstance.addEventListener('play', onPlay);
|
|
130
|
-
(_this$options$videoIn3 = _this.options.videoInstance) === null || _this$options$videoIn3 === void 0 ? void 0 : _this$options$videoIn3.addEventListener('ended', onEnded);
|
|
131
127
|
_this.$removeEventListener = function () {
|
|
132
|
-
var _this$options$
|
|
128
|
+
var _this$options$videoIn3, _this$options$videoIn4;
|
|
133
129
|
_this.audioInstance.removeEventListener('pause', onPause);
|
|
134
130
|
_this.audioInstance.removeEventListener('play', onPlay);
|
|
135
|
-
(_this$options$
|
|
136
|
-
(_this$options$
|
|
131
|
+
(_this$options$videoIn3 = _this.options.videoInstance) === null || _this$options$videoIn3 === void 0 ? void 0 : _this$options$videoIn3.removeEventListener('pause', onPause);
|
|
132
|
+
(_this$options$videoIn4 = _this.options.videoInstance) === null || _this$options$videoIn4 === void 0 ? void 0 : _this$options$videoIn4.removeEventListener('play', onPlay);
|
|
137
133
|
_this.audioLikeInstance.removeEventListener('pause', onPause);
|
|
138
134
|
_this.audioLikeInstance.removeEventListener('play', onPlay);
|
|
139
|
-
(_this$options$videoIn6 = _this.options.videoInstance) === null || _this$options$videoIn6 === void 0 ? void 0 : _this$options$videoIn6.removeEventListener('ended', onEnded);
|
|
140
135
|
};
|
|
141
136
|
return _this;
|
|
142
137
|
}
|
|
@@ -66,7 +66,7 @@ function _waitForBlankAudioGenerated() {
|
|
|
66
66
|
case 0:
|
|
67
67
|
checkInterval = _args.length > 0 && _args[0] !== undefined ? _args[0] : 100;
|
|
68
68
|
timeout = _args.length > 1 && _args[1] !== undefined ? _args[1] : 2000;
|
|
69
|
-
console.log('waitForBlankAudioGenerated', audioList.some(function (audio) {
|
|
69
|
+
console.log('waitForBlankAudioGenerated, needGenerate: ', audioList.some(function (audio) {
|
|
70
70
|
return !audio.ended && audio.src === blankAudioSrc;
|
|
71
71
|
}));
|
|
72
72
|
// while any audioList not ended
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@realsee/vreo",
|
|
3
|
-
"version": "1.0.0-alpha.
|
|
3
|
+
"version": "1.0.0-alpha.32",
|
|
4
4
|
"description": "Vreo (VR Video 缩写) 是基于如视三维渲染引擎 Five 和 用户界面构建库 React 实现的如视 3D 空间剧本播放器。",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"realsee",
|
|
@@ -24,7 +24,8 @@
|
|
|
24
24
|
"packages": "node ./dev-tools/build-packages.js"
|
|
25
25
|
},
|
|
26
26
|
"peerDependencies": {
|
|
27
|
-
"@realsee/five": "^5.0.0
|
|
27
|
+
"@realsee/five": "^5.0.0",
|
|
28
|
+
"@realsee/dnalogel": "^2.3.3",
|
|
28
29
|
"react": "^17.0.0",
|
|
29
30
|
"react-dom": "^17.0.0"
|
|
30
31
|
},
|
|
@@ -34,7 +35,9 @@
|
|
|
34
35
|
"@babel/preset-env": "^7.16.4",
|
|
35
36
|
"@babel/preset-react": "^7.16.0",
|
|
36
37
|
"@babel/preset-typescript": "^7.16.0",
|
|
38
|
+
"@realsee/dnalogel": "^2.3.3",
|
|
37
39
|
"@realsee/five": "5.0.0-alpha.149",
|
|
40
|
+
"@types/node": "^18.11.17",
|
|
38
41
|
"@types/offscreencanvas": "^2019.6.4",
|
|
39
42
|
"@types/react": "^17.0.37",
|
|
40
43
|
"@types/react-dom": "^17.0.11",
|
|
@@ -49,7 +52,6 @@
|
|
|
49
52
|
"vite": "^2.6.14"
|
|
50
53
|
},
|
|
51
54
|
"dependencies": {
|
|
52
|
-
"@realsee/dnalogel": "^2.3.3",
|
|
53
55
|
"@tweenjs/tween.js": "18.6.4",
|
|
54
56
|
"classnames": "^2.3.1",
|
|
55
57
|
"mobx": "^6.3.7",
|