@realsee/vreo 2.6.4-alpha.5 → 2.6.4
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/CHANGELOG.md +7 -0
- package/lib/PlayController/createHTMLAudioElement.js +14 -10
- package/lib/PlayController/index.js +73 -63
- package/lib/Player/Controller.js +56 -50
- package/lib/Player/PlaybackLifecycle.js +7 -6
- package/lib/Player/custom/SpatialScenePanel/index.js +11 -34
- package/lib/Player/index.js +166 -160
- package/lib/Player/modules/Drawer/index.js +2 -1
- package/lib/Player/modules/VideoAgent/VideoAgentMesh.js +157 -146
- package/lib/Player/modules/VideoAgent/VideoAgentScene.js +1 -1
- package/lib/Player/modules/VideoAgent/index.js +3 -3
- package/lib/Player/modules/keyframes/BgMusic/index.js +12 -12
- package/lib/Player/modules/keyframes/CameraMovement/index.js +45 -43
- package/lib/Player/modules/keyframes/InfoPanel/index.js +8 -8
- package/lib/Player/modules/keyframes/ModelVideo/index.js +83 -81
- package/lib/Player/modules/keyframes/PanoTag/index.js +1 -1
- package/lib/Player/modules/keyframes/PanoTextLabel/index.js +3 -3
- package/lib/Player/modules/keyframes/UpdateVRPanorama/index.js +3 -3
- package/lib/Player/modules/keyframes/VideoEffect/index.js +71 -69
- package/lib/fivePlugins/CSS3DRenderPlugin/index.js +6 -6
- package/lib/fivePlugins/CameraMovementPlugin/index.js +180 -173
- package/lib/fivePlugins/CameraMovementPlugin/typings.js +6 -6
- package/lib/fivePlugins/ModelTVVideoPlugin/index.js +59 -57
- package/lib/react/index.js +1 -1
- package/lib/shared-utils/Audio.js +56 -52
- package/lib/shared-utils/AudioLike.js +14 -11
- package/lib/shared-utils/animationFrame/BetterTween.js +15 -13
- package/lib/shared-utils/animationFrame/tween.js +3 -1
- package/lib/shared-utils/getMediaInfo.js +1 -0
- package/lib/typings/VreoUnit.js +27 -134
- package/package.json +3 -3
|
@@ -1,18 +1,17 @@
|
|
|
1
1
|
import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
|
|
2
|
-
import _readOnlyError from "@babel/runtime/helpers/esm/readOnlyError";
|
|
3
2
|
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
|
|
4
3
|
import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
4
|
+
import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
|
|
5
|
+
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
5
6
|
import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
|
|
6
7
|
import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
|
|
7
|
-
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
8
8
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
9
|
-
function _createForOfIteratorHelper(
|
|
10
|
-
function _unsupportedIterableToArray(
|
|
11
|
-
function _arrayLikeToArray(
|
|
12
|
-
|
|
13
|
-
function
|
|
14
|
-
function
|
|
15
|
-
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
9
|
+
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
|
|
10
|
+
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); }
|
|
11
|
+
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; }
|
|
12
|
+
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
13
|
+
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
14
|
+
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
16
15
|
import * as THREE from 'three';
|
|
17
16
|
import { Preloader } from "../../../shared-utils/Preloader.js";
|
|
18
17
|
import { makeObservable, observable, runInAction } from 'mobx';
|
|
@@ -57,6 +56,8 @@ var fragmentShaderTpl = function fragmentShaderTpl() {
|
|
|
57
56
|
* ```
|
|
58
57
|
*/
|
|
59
58
|
export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
59
|
+
_inherits(VideoAgentMesh, _THREE$Mesh);
|
|
60
|
+
var _super = _createSuper(VideoAgentMesh);
|
|
60
61
|
/**
|
|
61
62
|
* 创建视频经纪人贴片实例
|
|
62
63
|
*
|
|
@@ -105,16 +106,11 @@ export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
105
106
|
fragmentShader: fragmentShaderTpl(),
|
|
106
107
|
transparent: true
|
|
107
108
|
});
|
|
108
|
-
_this =
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
/** 音频实例 */
|
|
114
|
-
_defineProperty(_this, "outputs", new Map());
|
|
115
|
-
_defineProperty(_this, "ownsVideo", false);
|
|
116
|
-
_defineProperty(_this, "ownsAudio", false);
|
|
117
|
-
_defineProperty(_this, "generation", 0);
|
|
109
|
+
_this = _super.call(this, geometry, material);
|
|
110
|
+
_defineProperty(_assertThisInitialized(_this), "outputs", new Map());
|
|
111
|
+
_defineProperty(_assertThisInitialized(_this), "ownsVideo", false);
|
|
112
|
+
_defineProperty(_assertThisInitialized(_this), "ownsAudio", false);
|
|
113
|
+
_defineProperty(_assertThisInitialized(_this), "generation", 0);
|
|
118
114
|
_this.ownsVideo = ownsVideo;
|
|
119
115
|
_this.ownsAudio = !options.audioInstance;
|
|
120
116
|
_this.options = options;
|
|
@@ -129,7 +125,7 @@ export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
129
125
|
_this.audioInstance = options.audioInstance;
|
|
130
126
|
}
|
|
131
127
|
_this.audioLikeInstance = new AudioLike();
|
|
132
|
-
makeObservable(_this, {
|
|
128
|
+
makeObservable(_assertThisInitialized(_this), {
|
|
133
129
|
paused: observable
|
|
134
130
|
});
|
|
135
131
|
var updatePaused = function updatePaused(paused) {
|
|
@@ -145,16 +141,16 @@ export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
145
141
|
};
|
|
146
142
|
_this.audioInstance.addEventListener('pause', onPause);
|
|
147
143
|
_this.audioInstance.addEventListener('play', onPlay);
|
|
148
|
-
(_this$options$videoIn = _this.options.videoInstance) === null || _this$options$videoIn === void 0
|
|
149
|
-
(_this$options$videoIn2 = _this.options.videoInstance) === null || _this$options$videoIn2 === void 0
|
|
144
|
+
(_this$options$videoIn = _this.options.videoInstance) === null || _this$options$videoIn === void 0 ? void 0 : _this$options$videoIn.addEventListener('pause', onPause);
|
|
145
|
+
(_this$options$videoIn2 = _this.options.videoInstance) === null || _this$options$videoIn2 === void 0 ? void 0 : _this$options$videoIn2.addEventListener('play', onPlay);
|
|
150
146
|
_this.audioLikeInstance.addEventListener('pause', onPause);
|
|
151
147
|
_this.audioLikeInstance.addEventListener('play', onPlay);
|
|
152
148
|
_this.$removeEventListener = function () {
|
|
153
149
|
var _this$options$videoIn3, _this$options$videoIn4;
|
|
154
150
|
_this.audioInstance.removeEventListener('pause', onPause);
|
|
155
151
|
_this.audioInstance.removeEventListener('play', onPlay);
|
|
156
|
-
(_this$options$videoIn3 = _this.options.videoInstance) === null || _this$options$videoIn3 === void 0
|
|
157
|
-
(_this$options$videoIn4 = _this.options.videoInstance) === null || _this$options$videoIn4 === void 0
|
|
152
|
+
(_this$options$videoIn3 = _this.options.videoInstance) === null || _this$options$videoIn3 === void 0 ? void 0 : _this$options$videoIn3.removeEventListener('pause', onPause);
|
|
153
|
+
(_this$options$videoIn4 = _this.options.videoInstance) === null || _this$options$videoIn4 === void 0 ? void 0 : _this$options$videoIn4.removeEventListener('play', onPlay);
|
|
158
154
|
_this.audioLikeInstance.removeEventListener('pause', onPause);
|
|
159
155
|
_this.audioLikeInstance.removeEventListener('play', onPlay);
|
|
160
156
|
};
|
|
@@ -168,20 +164,26 @@ export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
168
164
|
* @param videoUrl - 媒体文件URL
|
|
169
165
|
* @private
|
|
170
166
|
*/
|
|
171
|
-
|
|
172
|
-
return _createClass(VideoAgentMesh, [{
|
|
167
|
+
_createClass(VideoAgentMesh, [{
|
|
173
168
|
key: "operations",
|
|
174
|
-
value:
|
|
169
|
+
value: /** 配置选项 */
|
|
170
|
+
|
|
171
|
+
/** 当前视频URL */
|
|
172
|
+
|
|
173
|
+
/** 是否冻结状态 */
|
|
174
|
+
|
|
175
|
+
/** 是否暂停状态 */
|
|
176
|
+
|
|
177
|
+
/** 音频实例 */
|
|
178
|
+
|
|
179
|
+
function operations(run, element) {
|
|
175
180
|
var operations = run ? run.bind(element) : element;
|
|
176
181
|
this.outputs.set(element, operations);
|
|
177
182
|
return operations;
|
|
178
183
|
}
|
|
179
184
|
}, {
|
|
180
185
|
key: "mediaInstance",
|
|
181
|
-
get:
|
|
182
|
-
|
|
183
|
-
/** 移除事件监听器的函数 */
|
|
184
|
-
|
|
186
|
+
get:
|
|
185
187
|
/**
|
|
186
188
|
* 获取当前的媒体实例
|
|
187
189
|
*
|
|
@@ -205,65 +207,69 @@ export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
205
207
|
}
|
|
206
208
|
}, {
|
|
207
209
|
key: "update",
|
|
208
|
-
value:
|
|
209
|
-
var _update = _asyncToGenerator(/*#__PURE__*/
|
|
210
|
+
value: function () {
|
|
211
|
+
var _update = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(videoUrl, valid, run) {
|
|
210
212
|
var _this2 = this;
|
|
211
|
-
var element, media, src, onStart
|
|
212
|
-
return
|
|
213
|
-
while (1)
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
_t = videoUrl;
|
|
239
|
-
case 4:
|
|
240
|
-
src = _t;
|
|
241
|
-
if (valid()) {
|
|
242
|
-
_context.n = 5;
|
|
213
|
+
var element, media, src, onStart;
|
|
214
|
+
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
215
|
+
while (1) {
|
|
216
|
+
switch (_context.prev = _context.next) {
|
|
217
|
+
case 0:
|
|
218
|
+
if (!(this.videoUrl === videoUrl)) {
|
|
219
|
+
_context.next = 2;
|
|
220
|
+
break;
|
|
221
|
+
}
|
|
222
|
+
return _context.abrupt("return");
|
|
223
|
+
case 2:
|
|
224
|
+
this.stop();
|
|
225
|
+
this.freeze = true;
|
|
226
|
+
element = getMediaType(videoUrl) === 'audio' ? this.audioInstance : this.options.videoInstance;
|
|
227
|
+
media = this.operations(run, element);
|
|
228
|
+
media.muted = true;
|
|
229
|
+
if (!(this.options.preload !== false || getMediaType(videoUrl) === 'video')) {
|
|
230
|
+
_context.next = 15;
|
|
231
|
+
break;
|
|
232
|
+
}
|
|
233
|
+
_context.t1 = URL;
|
|
234
|
+
_context.next = 11;
|
|
235
|
+
return Preloader.blob(videoUrl);
|
|
236
|
+
case 11:
|
|
237
|
+
_context.t2 = _context.sent;
|
|
238
|
+
_context.t0 = _context.t1.createObjectURL.call(_context.t1, _context.t2);
|
|
239
|
+
_context.next = 16;
|
|
243
240
|
break;
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
(
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
241
|
+
case 15:
|
|
242
|
+
_context.t0 = videoUrl;
|
|
243
|
+
case 16:
|
|
244
|
+
src = _context.t0;
|
|
245
|
+
if (valid()) {
|
|
246
|
+
_context.next = 20;
|
|
247
|
+
break;
|
|
248
|
+
}
|
|
249
|
+
if (src !== videoUrl) URL.revokeObjectURL(src);
|
|
250
|
+
return _context.abrupt("return");
|
|
251
|
+
case 20:
|
|
252
|
+
this.videoUrl = videoUrl;
|
|
253
|
+
if (this.objectURL) URL.revokeObjectURL(this.objectURL);
|
|
254
|
+
this.objectURL = src !== videoUrl ? src : undefined;
|
|
255
|
+
media.src = src;
|
|
256
|
+
element.setAttribute('data-src', videoUrl);
|
|
257
|
+
onStart = function onStart() {
|
|
258
|
+
var _this2$removeStart;
|
|
259
|
+
if (!valid() || media.currentTime === 0) return;
|
|
260
|
+
_this2.freeze = false;
|
|
261
|
+
media.muted = false;
|
|
262
|
+
_this2.material.uniforms.enable.value = getMediaType(videoUrl) ? 1 : 0;
|
|
263
|
+
(_this2$removeStart = _this2.removeStart) === null || _this2$removeStart === void 0 ? void 0 : _this2$removeStart.call(_this2);
|
|
264
|
+
};
|
|
265
|
+
this.removeStart = function () {
|
|
266
|
+
return element.removeEventListener('timeupdate', onStart);
|
|
267
|
+
};
|
|
268
|
+
element.addEventListener('timeupdate', onStart);
|
|
269
|
+
case 28:
|
|
270
|
+
case "end":
|
|
271
|
+
return _context.stop();
|
|
272
|
+
}
|
|
267
273
|
}
|
|
268
274
|
}, _callee, this);
|
|
269
275
|
}));
|
|
@@ -297,11 +303,10 @@ export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
297
303
|
* await mesh.play()
|
|
298
304
|
* ```
|
|
299
305
|
*/
|
|
300
|
-
)
|
|
301
306
|
}, {
|
|
302
307
|
key: "play",
|
|
303
|
-
value:
|
|
304
|
-
var _play = _asyncToGenerator(/*#__PURE__*/
|
|
308
|
+
value: function () {
|
|
309
|
+
var _play = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
|
|
305
310
|
var _this$options$getPlay,
|
|
306
311
|
_this$options,
|
|
307
312
|
_this3 = this;
|
|
@@ -313,58 +318,63 @@ export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
313
318
|
valid,
|
|
314
319
|
media,
|
|
315
320
|
_args2 = arguments;
|
|
316
|
-
return
|
|
317
|
-
while (1)
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
321
|
+
return _regeneratorRuntime.wrap(function _callee2$(_context2) {
|
|
322
|
+
while (1) {
|
|
323
|
+
switch (_context2.prev = _context2.next) {
|
|
324
|
+
case 0:
|
|
325
|
+
videoUrl = _args2.length > 0 && _args2[0] !== undefined ? _args2[0] : '';
|
|
326
|
+
currentTime = _args2.length > 1 && _args2[1] !== undefined ? _args2[1] : 0;
|
|
327
|
+
duration = _args2.length > 2 ? _args2[2] : undefined;
|
|
328
|
+
run = (_this$options$getPlay = (_this$options = this.options).getPlayback) === null || _this$options$getPlay === void 0 ? void 0 : _this$options$getPlay.call(_this$options);
|
|
329
|
+
if (!(this.options.getPlayback && !(run !== null && run !== void 0 && run.valid()))) {
|
|
330
|
+
_context2.next = 6;
|
|
331
|
+
break;
|
|
332
|
+
}
|
|
333
|
+
return _context2.abrupt("return", false);
|
|
334
|
+
case 6:
|
|
335
|
+
// stop() invalidates all earlier loads before the new generation is captured.
|
|
336
|
+
if (videoUrl && videoUrl !== this.videoUrl) this.stop();
|
|
337
|
+
generation = this.generation;
|
|
338
|
+
valid = function valid() {
|
|
339
|
+
return generation === _this3.generation && (!_this3.options.getPlayback || !!(run !== null && run !== void 0 && run.valid()));
|
|
340
|
+
};
|
|
341
|
+
if (!(videoUrl && videoUrl !== this.videoUrl)) {
|
|
342
|
+
_context2.next = 13;
|
|
343
|
+
break;
|
|
344
|
+
}
|
|
345
|
+
// update's synchronous stop is accounted for before awaiting its load.
|
|
346
|
+
generation++;
|
|
347
|
+
_context2.next = 13;
|
|
348
|
+
return this.update(videoUrl, valid, run);
|
|
349
|
+
case 13:
|
|
350
|
+
if (valid()) {
|
|
351
|
+
_context2.next = 15;
|
|
352
|
+
break;
|
|
353
|
+
}
|
|
354
|
+
return _context2.abrupt("return", false);
|
|
355
|
+
case 15:
|
|
356
|
+
if (duration && !videoUrl) {
|
|
357
|
+
this.videoUrl = '';
|
|
358
|
+
this.audioLikeInstance.duration = duration;
|
|
359
|
+
}
|
|
360
|
+
media = this.videoUrl ? this.operations(run, this.mediaInstance) : this.audioLikeInstance;
|
|
361
|
+
if (videoUrl || duration) media.currentTime = currentTime;
|
|
362
|
+
media.muted = true;
|
|
363
|
+
_context2.next = 21;
|
|
364
|
+
return media.play();
|
|
365
|
+
case 21:
|
|
366
|
+
if (valid()) {
|
|
367
|
+
_context2.next = 23;
|
|
368
|
+
break;
|
|
369
|
+
}
|
|
370
|
+
return _context2.abrupt("return", false);
|
|
371
|
+
case 23:
|
|
372
|
+
media.muted = false;
|
|
373
|
+
return _context2.abrupt("return", true);
|
|
374
|
+
case 25:
|
|
375
|
+
case "end":
|
|
376
|
+
return _context2.stop();
|
|
377
|
+
}
|
|
368
378
|
}
|
|
369
379
|
}, _callee2, this);
|
|
370
380
|
}));
|
|
@@ -372,7 +382,7 @@ export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
372
382
|
return _play.apply(this, arguments);
|
|
373
383
|
}
|
|
374
384
|
return play;
|
|
375
|
-
}()
|
|
385
|
+
}()
|
|
376
386
|
}, {
|
|
377
387
|
key: "mediaOperations",
|
|
378
388
|
get: function get() {
|
|
@@ -386,7 +396,7 @@ export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
386
396
|
value: function stop() {
|
|
387
397
|
var _this$removeStart;
|
|
388
398
|
++this.generation;
|
|
389
|
-
(_this$removeStart = this.removeStart) === null || _this$removeStart === void 0
|
|
399
|
+
(_this$removeStart = this.removeStart) === null || _this$removeStart === void 0 ? void 0 : _this$removeStart.call(this);
|
|
390
400
|
this.removeStart = undefined;
|
|
391
401
|
var _iterator = _createForOfIteratorHelper(this.outputs.values()),
|
|
392
402
|
_step;
|
|
@@ -434,7 +444,7 @@ export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
434
444
|
var _this$options$videoIn5;
|
|
435
445
|
this.stop();
|
|
436
446
|
this.$removeEventListener();
|
|
437
|
-
if (this.ownsVideo) (_this$options$videoIn5 = this.options.videoInstance) === null || _this$options$videoIn5 === void 0
|
|
447
|
+
if (this.ownsVideo) (_this$options$videoIn5 = this.options.videoInstance) === null || _this$options$videoIn5 === void 0 ? void 0 : _this$options$videoIn5.remove();
|
|
438
448
|
if (this.ownsAudio) this.audioInstance.remove();
|
|
439
449
|
if (this.objectURL) URL.revokeObjectURL(this.objectURL);
|
|
440
450
|
this.geometry.dispose();
|
|
@@ -442,4 +452,5 @@ export var VideoAgentMesh = /*#__PURE__*/function (_THREE$Mesh) {
|
|
|
442
452
|
this.material.dispose();
|
|
443
453
|
}
|
|
444
454
|
}]);
|
|
455
|
+
return VideoAgentMesh;
|
|
445
456
|
}(THREE.Mesh);
|
|
@@ -26,7 +26,7 @@ export var VideoAgentScene = /*#__PURE__*/_createClass(function VideoAgentScene(
|
|
|
26
26
|
cancelAnimationFrame(_this.frame);
|
|
27
27
|
_this.renderer.dispose();
|
|
28
28
|
_this.renderer.domElement.remove();
|
|
29
|
-
(_this$videoAgentMesh = _this.videoAgentMesh) === null || _this$videoAgentMesh === void 0
|
|
29
|
+
(_this$videoAgentMesh = _this.videoAgentMesh) === null || _this$videoAgentMesh === void 0 ? void 0 : _this$videoAgentMesh.dispose();
|
|
30
30
|
_this.disposers.forEach(function (disposer) {
|
|
31
31
|
return disposer === null || disposer === void 0 ? void 0 : disposer();
|
|
32
32
|
});
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
2
|
-
function ownKeys(
|
|
3
|
-
function _objectSpread(
|
|
2
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
4
|
import * as React from 'react';
|
|
5
5
|
import { useController } from "../../hooks.js";
|
|
6
6
|
import { VideoAgentScene } from "./VideoAgentScene.js";
|
|
@@ -33,7 +33,7 @@ export function VideoAgent(props) {
|
|
|
33
33
|
return function () {
|
|
34
34
|
var _controller$videoAgen2;
|
|
35
35
|
controller.dispose();
|
|
36
|
-
(_controller$videoAgen2 = controller.videoAgentScene) === null || _controller$videoAgen2 === void 0
|
|
36
|
+
(_controller$videoAgen2 = controller.videoAgentScene) === null || _controller$videoAgen2 === void 0 ? void 0 : _controller$videoAgen2.dispose();
|
|
37
37
|
controller.videoAgentScene = undefined;
|
|
38
38
|
};
|
|
39
39
|
}, []);
|
|
@@ -16,27 +16,27 @@ export function BgMusic() {
|
|
|
16
16
|
var element = getAudio();
|
|
17
17
|
var audio = run.bind(element);
|
|
18
18
|
var cleaned = false;
|
|
19
|
-
var
|
|
19
|
+
var clean = function clean() {
|
|
20
20
|
if (cleaned) return;
|
|
21
21
|
cleaned = true;
|
|
22
|
-
element.removeEventListener('canplay',
|
|
23
|
-
element.removeEventListener('ended',
|
|
22
|
+
element.removeEventListener('canplay', play);
|
|
23
|
+
element.removeEventListener('ended', clean);
|
|
24
24
|
audio.muted = true;
|
|
25
25
|
audio.pause();
|
|
26
26
|
audio.src = '';
|
|
27
27
|
remove();
|
|
28
|
-
tracks.delete(
|
|
28
|
+
tracks.delete(clean);
|
|
29
29
|
controller.setWaitingForBgMusic(false);
|
|
30
30
|
};
|
|
31
|
-
var remove = controller.playback.add(
|
|
32
|
-
tracks.add(
|
|
33
|
-
var
|
|
34
|
-
element.removeEventListener('canplay',
|
|
31
|
+
var remove = controller.playback.add(clean);
|
|
32
|
+
tracks.add(clean);
|
|
33
|
+
var play = function play() {
|
|
34
|
+
element.removeEventListener('canplay', play);
|
|
35
35
|
if (!valid() || cleaned) return;
|
|
36
36
|
audio.muted = false;
|
|
37
37
|
void audio.play().catch(function (error) {
|
|
38
38
|
if (valid() && !cleaned) {
|
|
39
|
-
|
|
39
|
+
clean();
|
|
40
40
|
controller.playback.cancel();
|
|
41
41
|
console.error(error);
|
|
42
42
|
}
|
|
@@ -46,11 +46,11 @@ export function BgMusic() {
|
|
|
46
46
|
audio.muted = true;
|
|
47
47
|
audio.src = keyframe.data.url;
|
|
48
48
|
audio.currentTime = Math.max(0, (currentTime - keyframe.start) / 1000);
|
|
49
|
-
element.addEventListener('ended',
|
|
49
|
+
element.addEventListener('ended', clean);
|
|
50
50
|
if (controller.configs.waitForBgMusicLoaded && element.readyState < 3) {
|
|
51
51
|
controller.setWaitingForBgMusic(true);
|
|
52
|
-
element.addEventListener('canplay',
|
|
53
|
-
} else
|
|
52
|
+
element.addEventListener('canplay', play);
|
|
53
|
+
} else play();
|
|
54
54
|
};
|
|
55
55
|
controller.on(VreoKeyframeEnum.BgMusic, callback);
|
|
56
56
|
return function () {
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
|
|
2
|
-
|
|
3
|
-
function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
|
|
2
|
+
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
4
3
|
import * as React from 'react';
|
|
5
4
|
import { CameraMovementPlugin } from "../../../../fivePlugins/CameraMovementPlugin/index.js";
|
|
6
5
|
import { CameraMovementEffect } from "../../../../fivePlugins/CameraMovementPlugin/typings.js";
|
|
@@ -12,51 +11,54 @@ export function CameraMovement() {
|
|
|
12
11
|
var ref = React.useRef();
|
|
13
12
|
React.useEffect(function () {
|
|
14
13
|
var callback = /*#__PURE__*/function () {
|
|
15
|
-
var _ref = _asyncToGenerator(/*#__PURE__*/
|
|
14
|
+
var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(keyframe) {
|
|
16
15
|
var start, end, data, cameraMovementData, effect;
|
|
17
|
-
return
|
|
18
|
-
while (1)
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
ref.current
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
16
|
+
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
|
17
|
+
while (1) {
|
|
18
|
+
switch (_context.prev = _context.next) {
|
|
19
|
+
case 0:
|
|
20
|
+
if (!ref.current) {
|
|
21
|
+
ref.current = CameraMovementPlugin(five, {});
|
|
22
|
+
}
|
|
23
|
+
start = keyframe.start, end = keyframe.end, data = keyframe.data;
|
|
24
|
+
cameraMovementData = data;
|
|
25
|
+
effect = cameraMovementData.effect;
|
|
26
|
+
if (!(effect === CameraMovementEffect.Rotate)) {
|
|
27
|
+
_context.next = 9;
|
|
28
|
+
break;
|
|
29
|
+
}
|
|
30
|
+
_context.next = 7;
|
|
31
|
+
return ref.current.rotate(data, end - start);
|
|
32
|
+
case 7:
|
|
33
|
+
_context.next = 21;
|
|
28
34
|
break;
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
_context.
|
|
35
|
+
case 9:
|
|
36
|
+
if (!(effect === CameraMovementEffect.Move)) {
|
|
37
|
+
_context.next = 14;
|
|
38
|
+
break;
|
|
39
|
+
}
|
|
40
|
+
_context.next = 12;
|
|
41
|
+
return ref.current.move(data, end - start);
|
|
42
|
+
case 12:
|
|
43
|
+
_context.next = 21;
|
|
38
44
|
break;
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
_context.
|
|
45
|
+
case 14:
|
|
46
|
+
if (!(cameraMovementData.panoIndex !== undefined && cameraMovementData.panoIndex !== five.panoIndex)) {
|
|
47
|
+
_context.next = 19;
|
|
48
|
+
break;
|
|
49
|
+
}
|
|
50
|
+
_context.next = 17;
|
|
51
|
+
return ref.current.move(data, end - start);
|
|
52
|
+
case 17:
|
|
53
|
+
_context.next = 21;
|
|
48
54
|
break;
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
_context.n = 7;
|
|
57
|
-
return ref.current.rotate(data, end - start);
|
|
58
|
-
case 7:
|
|
59
|
-
return _context.a(2);
|
|
55
|
+
case 19:
|
|
56
|
+
_context.next = 21;
|
|
57
|
+
return ref.current.rotate(data, end - start);
|
|
58
|
+
case 21:
|
|
59
|
+
case "end":
|
|
60
|
+
return _context.stop();
|
|
61
|
+
}
|
|
60
62
|
}
|
|
61
63
|
}, _callee);
|
|
62
64
|
}));
|