@realsee/vreo 2.6.4-alpha.5 → 3.0.0-webgpu-react18.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.
Files changed (174) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/README.md +6 -6
  3. package/lib/PlayController/createHTMLAudioElement.d.ts +1 -0
  4. package/lib/PlayController/createHTMLAudioElement.d.ts.map +1 -0
  5. package/lib/PlayController/index.d.ts +14 -24
  6. package/lib/PlayController/index.d.ts.map +1 -0
  7. package/lib/PlayController/index.js +74 -210
  8. package/lib/PlayController/index.js.map +1 -0
  9. package/lib/Player/App.d.ts +2 -2
  10. package/lib/Player/App.d.ts.map +1 -0
  11. package/lib/Player/Controller.d.ts +11 -6
  12. package/lib/Player/Controller.d.ts.map +1 -0
  13. package/lib/Player/PlaybackLifecycle.d.ts +1 -0
  14. package/lib/Player/PlaybackLifecycle.d.ts.map +1 -0
  15. package/lib/Player/custom/SpatialScenePanel/index.d.ts +2 -2
  16. package/lib/Player/custom/SpatialScenePanel/index.d.ts.map +1 -0
  17. package/lib/Player/hooks.d.ts +3 -2
  18. package/lib/Player/hooks.d.ts.map +1 -0
  19. package/lib/Player/index.d.ts +3 -2
  20. package/lib/Player/index.d.ts.map +1 -0
  21. package/lib/Player/index.js +1769 -430
  22. package/lib/Player/index.js.map +1 -0
  23. package/lib/Player/modules/Drawer/index.d.ts +2 -2
  24. package/lib/Player/modules/Drawer/index.d.ts.map +1 -0
  25. package/lib/Player/modules/PopUp/index.d.ts +2 -2
  26. package/lib/Player/modules/PopUp/index.d.ts.map +1 -0
  27. package/lib/Player/modules/ResizeObserver/index.d.ts +2 -2
  28. package/lib/Player/modules/ResizeObserver/index.d.ts.map +1 -0
  29. package/lib/Player/modules/VideoAgent/VideoAgentMesh.d.ts +5 -2
  30. package/lib/Player/modules/VideoAgent/VideoAgentMesh.d.ts.map +1 -0
  31. package/lib/Player/modules/VideoAgent/VideoAgentScene.d.ts +8 -5
  32. package/lib/Player/modules/VideoAgent/VideoAgentScene.d.ts.map +1 -0
  33. package/lib/Player/modules/VideoAgent/index.d.ts +11 -2
  34. package/lib/Player/modules/VideoAgent/index.d.ts.map +1 -0
  35. package/lib/Player/modules/Wave/index.d.ts +2 -2
  36. package/lib/Player/modules/Wave/index.d.ts.map +1 -0
  37. package/lib/Player/modules/keyframes/BgMusic/index.d.ts +2 -2
  38. package/lib/Player/modules/keyframes/BgMusic/index.d.ts.map +1 -0
  39. package/lib/Player/modules/keyframes/CameraMovement/index.d.ts +2 -2
  40. package/lib/Player/modules/keyframes/CameraMovement/index.d.ts.map +1 -0
  41. package/lib/Player/modules/keyframes/InfoPanel/index.d.ts +2 -2
  42. package/lib/Player/modules/keyframes/InfoPanel/index.d.ts.map +1 -0
  43. package/lib/Player/modules/keyframes/ModelVideo/index.d.ts +2 -2
  44. package/lib/Player/modules/keyframes/ModelVideo/index.d.ts.map +1 -0
  45. package/lib/Player/modules/keyframes/PanoEffect/index.d.ts +2 -2
  46. package/lib/Player/modules/keyframes/PanoEffect/index.d.ts.map +1 -0
  47. package/lib/Player/modules/keyframes/PanoEffect/lineAnime.d.ts +3 -2
  48. package/lib/Player/modules/keyframes/PanoEffect/lineAnime.d.ts.map +1 -0
  49. package/lib/Player/modules/keyframes/PanoTag/index.d.ts +1 -0
  50. package/lib/Player/modules/keyframes/PanoTag/index.d.ts.map +1 -0
  51. package/lib/Player/modules/keyframes/PanoTextLabel/index.d.ts +2 -2
  52. package/lib/Player/modules/keyframes/PanoTextLabel/index.d.ts.map +1 -0
  53. package/lib/Player/modules/keyframes/Prompter/index.d.ts +2 -2
  54. package/lib/Player/modules/keyframes/Prompter/index.d.ts.map +1 -0
  55. package/lib/Player/modules/keyframes/UpdateVRPanorama/index.d.ts +2 -2
  56. package/lib/Player/modules/keyframes/UpdateVRPanorama/index.d.ts.map +1 -0
  57. package/lib/Player/modules/keyframes/VideoEffect/index.d.ts +2 -2
  58. package/lib/Player/modules/keyframes/VideoEffect/index.d.ts.map +1 -0
  59. package/lib/Player/playback-types.d.ts +1 -0
  60. package/lib/Player/playback-types.d.ts.map +1 -0
  61. package/lib/Player/typings.d.ts +2 -1
  62. package/lib/Player/typings.d.ts.map +1 -0
  63. package/lib/chunks/index-BgPSzRSs.js +93 -0
  64. package/lib/chunks/index-BgPSzRSs.js.map +1 -0
  65. package/lib/chunks/index-CunyJn6H.js +51 -0
  66. package/lib/chunks/index-CunyJn6H.js.map +1 -0
  67. package/lib/fivePlugins/CSS3DRenderPlugin/centerPoint.d.ts +2 -1
  68. package/lib/fivePlugins/CSS3DRenderPlugin/centerPoint.d.ts.map +1 -0
  69. package/lib/fivePlugins/CSS3DRenderPlugin/createResizeObserver.d.ts +5 -6
  70. package/lib/fivePlugins/CSS3DRenderPlugin/createResizeObserver.d.ts.map +1 -0
  71. package/lib/fivePlugins/CSS3DRenderPlugin/evenNumber.d.ts +1 -0
  72. package/lib/fivePlugins/CSS3DRenderPlugin/evenNumber.d.ts.map +1 -0
  73. package/lib/fivePlugins/CSS3DRenderPlugin/index.d.ts +5 -22
  74. package/lib/fivePlugins/CSS3DRenderPlugin/index.d.ts.map +1 -0
  75. package/lib/fivePlugins/CSS3DRenderPlugin/transformPositionToVector3.d.ts +2 -1
  76. package/lib/fivePlugins/CSS3DRenderPlugin/transformPositionToVector3.d.ts.map +1 -0
  77. package/lib/fivePlugins/CameraMovementPlugin/index.d.ts +2 -1
  78. package/lib/fivePlugins/CameraMovementPlugin/index.d.ts.map +1 -0
  79. package/lib/fivePlugins/CameraMovementPlugin/typings.d.ts +2 -1
  80. package/lib/fivePlugins/CameraMovementPlugin/typings.d.ts.map +1 -0
  81. package/lib/fivePlugins/ModelTVVideoPlugin/index.d.ts +2 -1
  82. package/lib/fivePlugins/ModelTVVideoPlugin/index.d.ts.map +1 -0
  83. package/lib/index.d.ts +3 -0
  84. package/lib/index.d.ts.map +1 -0
  85. package/lib/index.js +12 -1
  86. package/lib/index.js.map +1 -0
  87. package/lib/plugins/CSS3DRenderPlugin.js +115 -0
  88. package/lib/plugins/CSS3DRenderPlugin.js.map +1 -0
  89. package/lib/plugins/CameraMovementPlugin.js +6 -0
  90. package/lib/plugins/CameraMovementPlugin.js.map +1 -0
  91. package/lib/plugins/ModelTVVideoPlugin.js +162 -0
  92. package/lib/plugins/ModelTVVideoPlugin.js.map +1 -0
  93. package/lib/react/index.d.ts +5 -4
  94. package/lib/react/index.d.ts.map +1 -0
  95. package/lib/react/index.js +39 -226
  96. package/lib/react/index.js.map +1 -0
  97. package/lib/shared-utils/Audio.d.ts +3 -1
  98. package/lib/shared-utils/Audio.d.ts.map +1 -0
  99. package/lib/shared-utils/AudioLike.d.ts +2 -1
  100. package/lib/shared-utils/AudioLike.d.ts.map +1 -0
  101. package/lib/shared-utils/Preloader.d.ts +1 -0
  102. package/lib/shared-utils/Preloader.d.ts.map +1 -0
  103. package/lib/shared-utils/addResizeListener.d.ts +2 -1
  104. package/lib/shared-utils/addResizeListener.d.ts.map +1 -0
  105. package/lib/shared-utils/animationFrame/BetterTween.d.ts +1 -0
  106. package/lib/shared-utils/animationFrame/BetterTween.d.ts.map +1 -0
  107. package/lib/shared-utils/animationFrame/index.d.ts +5 -14
  108. package/lib/shared-utils/animationFrame/index.d.ts.map +1 -0
  109. package/lib/shared-utils/animationFrame/tween.d.ts +1 -0
  110. package/lib/shared-utils/animationFrame/tween.d.ts.map +1 -0
  111. package/lib/shared-utils/createTransMatrix.d.ts +3 -1
  112. package/lib/shared-utils/createTransMatrix.d.ts.map +1 -0
  113. package/lib/shared-utils/getFileExpandedName.d.ts +1 -0
  114. package/lib/shared-utils/getFileExpandedName.d.ts.map +1 -0
  115. package/lib/shared-utils/getMediaInfo.d.ts +1 -0
  116. package/lib/shared-utils/getMediaInfo.d.ts.map +1 -0
  117. package/lib/shared-utils/setElementDataset.d.ts +1 -0
  118. package/lib/shared-utils/setElementDataset.d.ts.map +1 -0
  119. package/lib/timeline/index.d.ts +18 -0
  120. package/lib/timeline/index.d.ts.map +1 -0
  121. package/lib/types/index.js +10 -0
  122. package/lib/types/index.js.map +1 -0
  123. package/lib/typings/VreoUnit.d.ts +2 -1
  124. package/lib/typings/VreoUnit.d.ts.map +1 -0
  125. package/lib/typings/index.d.ts +1 -0
  126. package/lib/typings/index.d.ts.map +1 -0
  127. package/package.json +51 -71
  128. package/lib/PlayController/createHTMLAudioElement.js +0 -30
  129. package/lib/Player/App.js +0 -52
  130. package/lib/Player/Controller.js +0 -530
  131. package/lib/Player/PlaybackLifecycle.js +0 -117
  132. package/lib/Player/custom/SpatialScenePanel/index.js +0 -263
  133. package/lib/Player/hooks.js +0 -22
  134. package/lib/Player/modules/Drawer/index.js +0 -39
  135. package/lib/Player/modules/PopUp/index.js +0 -23
  136. package/lib/Player/modules/ResizeObserver/index.js +0 -22
  137. package/lib/Player/modules/VideoAgent/VideoAgentMesh.js +0 -445
  138. package/lib/Player/modules/VideoAgent/VideoAgentScene.js +0 -53
  139. package/lib/Player/modules/VideoAgent/index.js +0 -72
  140. package/lib/Player/modules/Wave/index.js +0 -171
  141. package/lib/Player/modules/keyframes/BgMusic/index.js +0 -65
  142. package/lib/Player/modules/keyframes/CameraMovement/index.js +0 -73
  143. package/lib/Player/modules/keyframes/InfoPanel/index.js +0 -170
  144. package/lib/Player/modules/keyframes/ModelVideo/index.js +0 -126
  145. package/lib/Player/modules/keyframes/PanoEffect/index.js +0 -99
  146. package/lib/Player/modules/keyframes/PanoEffect/lineAnime.js +0 -30
  147. package/lib/Player/modules/keyframes/PanoTag/index.js +0 -110
  148. package/lib/Player/modules/keyframes/PanoTextLabel/index.js +0 -122
  149. package/lib/Player/modules/keyframes/Prompter/index.js +0 -56
  150. package/lib/Player/modules/keyframes/UpdateVRPanorama/index.js +0 -98
  151. package/lib/Player/modules/keyframes/VideoEffect/index.js +0 -152
  152. package/lib/Player/playback-types.js +0 -1
  153. package/lib/Player/typings.js +0 -1
  154. package/lib/fivePlugins/CSS3DRenderPlugin/centerPoint.js +0 -4
  155. package/lib/fivePlugins/CSS3DRenderPlugin/createResizeObserver.js +0 -25
  156. package/lib/fivePlugins/CSS3DRenderPlugin/evenNumber.js +0 -4
  157. package/lib/fivePlugins/CSS3DRenderPlugin/index.js +0 -226
  158. package/lib/fivePlugins/CSS3DRenderPlugin/transformPositionToVector3.js +0 -8
  159. package/lib/fivePlugins/CameraMovementPlugin/index.js +0 -238
  160. package/lib/fivePlugins/CameraMovementPlugin/typings.js +0 -15
  161. package/lib/fivePlugins/ModelTVVideoPlugin/index.js +0 -347
  162. package/lib/shared-utils/Audio.js +0 -147
  163. package/lib/shared-utils/AudioLike.js +0 -120
  164. package/lib/shared-utils/Preloader.js +0 -37
  165. package/lib/shared-utils/addResizeListener.js +0 -39
  166. package/lib/shared-utils/animationFrame/BetterTween.js +0 -56
  167. package/lib/shared-utils/animationFrame/index.js +0 -52
  168. package/lib/shared-utils/animationFrame/tween.js +0 -56
  169. package/lib/shared-utils/createTransMatrix.js +0 -12
  170. package/lib/shared-utils/getFileExpandedName.js +0 -6
  171. package/lib/shared-utils/getMediaInfo.js +0 -54
  172. package/lib/shared-utils/setElementDataset.js +0 -16
  173. package/lib/typings/VreoUnit.js +0 -171
  174. package/lib/typings/index.js +0 -1
@@ -1,171 +0,0 @@
1
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
- import React, { useState, useCallback, useRef, useEffect } from 'react';
3
- var defaultPrefix = 'https://vr-public.realsee-cdn.cn/release/static/image/release/';
4
- var WAVES = {
5
- single: {
6
- width: 766,
7
- height: 60,
8
- frames: 20,
9
- hevc: 'vapor/static/wave-single.140d197f4838c130b69e87dfd0705479.mov',
10
- vp9: 'vapor/static/wave-single.eda65de390a830193fff40d1f1255555.webm',
11
- png: 'vapor/static/wave-single.f51aade2a6e1c59211698a1a24e6135f.png'
12
- },
13
- double: {
14
- width: 766,
15
- height: 60,
16
- frames: 16,
17
- hevc: 'vapor/static/wave-double.3e6d73050ee6958cc3060b107ebe5f39.mov',
18
- vp9: '/vapor/static/wave-double.77dfe8548ebcb3f3d336785d4fe9c7b2.webm',
19
- png: '/vapor/static/wave-double.ab4fe7d8a70395109ca4f759af7bd53f.png'
20
- },
21
- solid: {
22
- width: 1126,
23
- height: 90,
24
- frames: 48,
25
- hevc: 'vapor/static/wave-solid.cf68912a93275d07aa6b5097ea11fdda.mov',
26
- vp9: 'vapor/static/wave-solid.64438b63cbb346906d066bb7b8dc3e20.webm',
27
- png: 'vapor/static/wave-solid.6969d7f3f2f44f7ac1ade30e65660cb1.png'
28
- },
29
- swap: {
30
- width: 2250,
31
- height: 180,
32
- frames: 41,
33
- hevc: 'vapor/static/wave-swap.b38f22e2cf84ee21e9be35f7f56c9cfc.mov',
34
- vp9: 'vapor/static/wave-swap.c02e4b94cf05aecf6e7a0023bc7bb90f.webm',
35
- png: 'vapor/static/wave-swap.772ba526a7210dcc01567062c6319545.png'
36
- },
37
- expand: {
38
- width: 2250,
39
- height: 180,
40
- frames: 45,
41
- hevc: 'vapor/static/wave-expand.9529956c5954740cd4c9d07d51e32822.mov',
42
- vp9: 'vapor/static/wave-expand.a0d2a0074001cd3d4fea56818c6d3c38.webm',
43
- png: 'vapor/static/wave-expand.62fcf27b445533e6eb1b17bab5eafa0d.png'
44
- }
45
- };
46
- var userAgent = typeof navigator !== 'undefined' ? navigator.userAgent : '';
47
- var isAppleDevice = /(iPhone|iPad|iPod)/i.test(userAgent);
48
- var isSafari = /safari/i.test(userAgent) && !/chrome/i.test(userAgent) && /version/i.test(userAgent);
49
- var isMicroMessenger = /microMessenger/i.test(userAgent);
50
- var canPlayHevc = isAppleDevice || isSafari;
51
- var canPlayVp9 = typeof MediaSource !== 'undefined' && MediaSource.isTypeSupported("video/webm; codecs=vp9");
52
- export function Wave(props) {
53
- var wave = React.useMemo(function () {
54
- var _props$appearance;
55
- var appearance = (_props$appearance = props === null || props === void 0 ? void 0 : props.appearance) !== null && _props$appearance !== void 0 ? _props$appearance : 'solid';
56
- return WAVES[appearance];
57
- }, [props === null || props === void 0 ? void 0 : props.appearance]);
58
- var heightWidthRatio = React.useMemo(function () {
59
- return wave.height / wave.width;
60
- }, [wave]);
61
- var content = null;
62
- if (isMicroMessenger) {
63
- content = /*#__PURE__*/React.createElement(KeyframeWaveContent, {
64
- wave: wave,
65
- prefix: props === null || props === void 0 ? void 0 : props.staticPrefix
66
- });
67
- } else if (canPlayHevc) {
68
- content = /*#__PURE__*/React.createElement(VideoWaveContent, {
69
- format: "hevc",
70
- wave: wave,
71
- prefix: props === null || props === void 0 ? void 0 : props.staticPrefix
72
- });
73
- } else if (canPlayVp9) {
74
- content = /*#__PURE__*/React.createElement(VideoWaveContent, {
75
- format: "vp9",
76
- wave: wave,
77
- prefix: props === null || props === void 0 ? void 0 : props.staticPrefix
78
- });
79
- } else {
80
- content = /*#__PURE__*/React.createElement(KeyframeWaveContent, {
81
- wave: wave,
82
- prefix: props === null || props === void 0 ? void 0 : props.staticPrefix
83
- });
84
- }
85
- return /*#__PURE__*/React.createElement("div", {
86
- className: "vreo-wave",
87
- onClick: props === null || props === void 0 ? void 0 : props.onClick
88
- }, /*#__PURE__*/React.createElement("div", {
89
- style: {
90
- position: 'relative',
91
- width: '100%',
92
- paddingTop: "".concat(heightWidthRatio * 100, "%")
93
- }
94
- }, /*#__PURE__*/React.createElement("div", {
95
- style: {
96
- position: 'absolute',
97
- width: '100%',
98
- height: '100%',
99
- left: 0,
100
- top: 0
101
- }
102
- }, content)));
103
- }
104
- var VideoWaveContent = function VideoWaveContent(_ref) {
105
- var wave = _ref.wave,
106
- format = _ref.format,
107
- _ref$prefix = _ref.prefix,
108
- prefix = _ref$prefix === void 0 ? defaultPrefix : _ref$prefix;
109
- var videoRef = useRef(null);
110
- var _useState = useState(false),
111
- _useState2 = _slicedToArray(_useState, 2),
112
- canPlay = _useState2[0],
113
- setCanPlay = _useState2[1];
114
- var _useState3 = useState(false),
115
- _useState4 = _slicedToArray(_useState3, 2),
116
- errored = _useState4[0],
117
- setErrored = _useState4[1];
118
- var source = prefix + wave[format];
119
- useEffect(function () {
120
- setCanPlay(false);
121
- }, [source]);
122
- var canPlayHandler = useCallback(function () {
123
- if (videoRef.current) {
124
- videoRef.current.play();
125
- }
126
- setCanPlay(true);
127
- }, []);
128
- var errorHandler = useCallback(function () {
129
- setErrored(true);
130
- }, []);
131
- if (errored) {
132
- return /*#__PURE__*/React.createElement(KeyframeWaveContent, {
133
- wave: wave,
134
- prefix: prefix
135
- });
136
- }
137
- return /*#__PURE__*/React.createElement("video", {
138
- style: {
139
- opacity: canPlay ? 1 : 0
140
- },
141
- preload: "auto",
142
- ref: videoRef,
143
- width: "100%",
144
- height: "100%",
145
- playsInline: true,
146
- autoPlay: true,
147
- onCanPlay: canPlayHandler,
148
- onError: errorHandler,
149
- muted: true,
150
- loop: true,
151
- src: source
152
- });
153
- };
154
- var KeyframeWaveContent = function KeyframeWaveContent(_ref2) {
155
- var wave = _ref2.wave,
156
- _ref2$prefix = _ref2.prefix,
157
- prefix = _ref2$prefix === void 0 ? defaultPrefix : _ref2$prefix;
158
- var source = prefix + wave.png;
159
- return /*#__PURE__*/React.createElement("div", {
160
- style: {
161
- width: "100%",
162
- height: "100%",
163
- backgroundImage: "url(".concat(source, ")"),
164
- backgroundSize: "100%",
165
- animationName: "vreo-wave-keyframes",
166
- animationTimingFunction: "steps(".concat(wave.frames - 1, ")"),
167
- animationDuration: "".concat(wave.frames / 25, "s"),
168
- animationIterationCount: 'infinite'
169
- }
170
- });
171
- };
@@ -1,65 +0,0 @@
1
- import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
2
- import * as React from 'react';
3
- import { getAudio } from "../../../../shared-utils/Audio.js";
4
- import { VreoKeyframeEnum } from "../../../../typings/VreoUnit.js";
5
- import { useController } from "../../../hooks.js";
6
- export function BgMusic() {
7
- var controller = useController();
8
- React.useEffect(function () {
9
- var tracks = new Set();
10
- var callback = function callback(keyframe, currentTime) {
11
- var run = controller.playback.capture();
12
- var valid = function valid() {
13
- return !!(run !== null && run !== void 0 && run.valid());
14
- };
15
- if (!valid()) return;
16
- var element = getAudio();
17
- var audio = run.bind(element);
18
- var cleaned = false;
19
- var _clean = function clean() {
20
- if (cleaned) return;
21
- cleaned = true;
22
- element.removeEventListener('canplay', _play);
23
- element.removeEventListener('ended', _clean);
24
- audio.muted = true;
25
- audio.pause();
26
- audio.src = '';
27
- remove();
28
- tracks.delete(_clean);
29
- controller.setWaitingForBgMusic(false);
30
- };
31
- var remove = controller.playback.add(_clean);
32
- tracks.add(_clean);
33
- var _play = function play() {
34
- element.removeEventListener('canplay', _play);
35
- if (!valid() || cleaned) return;
36
- audio.muted = false;
37
- void audio.play().catch(function (error) {
38
- if (valid() && !cleaned) {
39
- _clean();
40
- controller.playback.cancel();
41
- console.error(error);
42
- }
43
- });
44
- controller.setWaitingForBgMusic(false);
45
- };
46
- audio.muted = true;
47
- audio.src = keyframe.data.url;
48
- audio.currentTime = Math.max(0, (currentTime - keyframe.start) / 1000);
49
- element.addEventListener('ended', _clean);
50
- if (controller.configs.waitForBgMusicLoaded && element.readyState < 3) {
51
- controller.setWaitingForBgMusic(true);
52
- element.addEventListener('canplay', _play);
53
- } else _play();
54
- };
55
- controller.on(VreoKeyframeEnum.BgMusic, callback);
56
- return function () {
57
- controller.off(VreoKeyframeEnum.BgMusic, callback);
58
- for (var _i = 0, _arr = _toConsumableArray(tracks); _i < _arr.length; _i++) {
59
- var clean = _arr[_i];
60
- clean();
61
- }
62
- };
63
- }, [controller]);
64
- return /*#__PURE__*/React.createElement(React.Fragment, null);
65
- }
@@ -1,73 +0,0 @@
1
- import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
2
- function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
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); }
4
- import * as React from 'react';
5
- import { CameraMovementPlugin } from "../../../../fivePlugins/CameraMovementPlugin/index.js";
6
- import { CameraMovementEffect } from "../../../../fivePlugins/CameraMovementPlugin/typings.js";
7
- import { VreoKeyframeEnum } from "../../../../typings/VreoUnit.js";
8
- import { useController, useFiveInstance } from "../../../hooks.js";
9
- export function CameraMovement() {
10
- var controller = useController();
11
- var five = useFiveInstance();
12
- var ref = React.useRef();
13
- React.useEffect(function () {
14
- var callback = /*#__PURE__*/function () {
15
- var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(keyframe) {
16
- var start, end, data, cameraMovementData, effect;
17
- return _regenerator().w(function (_context) {
18
- while (1) switch (_context.n) {
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.n = 2;
28
- break;
29
- }
30
- _context.n = 1;
31
- return ref.current.rotate(data, end - start);
32
- case 1:
33
- _context.n = 7;
34
- break;
35
- case 2:
36
- if (!(effect === CameraMovementEffect.Move)) {
37
- _context.n = 4;
38
- break;
39
- }
40
- _context.n = 3;
41
- return ref.current.move(data, end - start);
42
- case 3:
43
- _context.n = 7;
44
- break;
45
- case 4:
46
- if (!(cameraMovementData.panoIndex !== undefined && cameraMovementData.panoIndex !== five.panoIndex)) {
47
- _context.n = 6;
48
- break;
49
- }
50
- _context.n = 5;
51
- return ref.current.move(data, end - start);
52
- case 5:
53
- _context.n = 7;
54
- break;
55
- case 6:
56
- _context.n = 7;
57
- return ref.current.rotate(data, end - start);
58
- case 7:
59
- return _context.a(2);
60
- }
61
- }, _callee);
62
- }));
63
- return function callback(_x) {
64
- return _ref.apply(this, arguments);
65
- };
66
- }();
67
- controller.on(VreoKeyframeEnum.CameraMovement, callback);
68
- return function () {
69
- controller.off(VreoKeyframeEnum.CameraMovement, callback);
70
- };
71
- }, [controller]);
72
- return /*#__PURE__*/React.createElement(React.Fragment, null);
73
- }
@@ -1,170 +0,0 @@
1
- import * as React from 'react';
2
- import { InfoPanelStyleEnum, InfoPanelTypeEnum, VreoKeyframeEnum } from "../../../../typings/VreoUnit.js";
3
- import { useController } from "../../../hooks.js";
4
- function InfoPanelImg(_ref) {
5
- var url = _ref.url,
6
- children = _ref.children;
7
- return /*#__PURE__*/React.createElement("div", {
8
- className: "vreo-infoPanel-container"
9
- }, /*#__PURE__*/React.createElement("div", {
10
- className: "vreo-infoPanel"
11
- }, children, /*#__PURE__*/React.createElement("img", {
12
- src: url
13
- })));
14
- }
15
- function InfoPanelVideo(_ref2) {
16
- var url = _ref2.url,
17
- children = _ref2.children;
18
- var videoWrapperRef = React.useRef(null);
19
- var controller = useController();
20
- React.useEffect(function () {
21
- var _controller$configs;
22
- // if (!isIOSorWX) return
23
- 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.videoPanel) || document.createElement('video');
24
- var run = controller.playback.capture();
25
- var valid = function valid() {
26
- return !!(run !== null && run !== void 0 && run.valid());
27
- };
28
- if (!(run !== null && run !== void 0 && run.valid())) return;
29
- var output = run.bind(video);
30
- var disposed = false;
31
- video.playsInline = true;
32
- output.muted = true;
33
- var stop = function stop() {
34
- disposed = true;
35
- output.muted = true;
36
- output.pause();
37
- video.removeEventListener('canplaythrough', _canplaythrough);
38
- };
39
- if (!videoWrapperRef.current) return;
40
- var remove = controller.playback.add(stop);
41
- output.src = url;
42
- if (!videoWrapperRef.current.contains(video)) {
43
- videoWrapperRef.current.appendChild(video);
44
- }
45
- var _canplaythrough = function canplaythrough() {
46
- video.removeEventListener('canplaythrough', _canplaythrough);
47
- if (disposed || !valid()) return;
48
- output.muted = false;
49
- void output.play().catch(function (error) {
50
- if (valid() && !disposed) {
51
- stop();
52
- controller.playback.cancel();
53
- console.error(error);
54
- }
55
- });
56
- };
57
- video.addEventListener('canplaythrough', _canplaythrough);
58
- output.load();
59
- // output.play()
60
-
61
- return function () {
62
- var _videoWrapperRef$curr;
63
- stop();
64
- remove();
65
- if ((_videoWrapperRef$curr = videoWrapperRef.current) !== null && _videoWrapperRef$curr !== void 0 && _videoWrapperRef$curr.contains(video)) {
66
- videoWrapperRef.current.removeChild(video);
67
- }
68
- };
69
- }, [controller, url]);
70
- return /*#__PURE__*/React.createElement("div", {
71
- className: "vreo-infoPanel-container"
72
- }, /*#__PURE__*/React.createElement("div", {
73
- className: "vreo-infoPanel"
74
- }, children, /*#__PURE__*/React.createElement("div", {
75
- className: "vreo-infoPanel-inner",
76
- ref: videoWrapperRef
77
- })));
78
- }
79
- var Title = function Title(props) {
80
- if (!props.title && !props.subTitle) {
81
- return null;
82
- }
83
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
84
- className: "vreo-infoPanel-title"
85
- }, /*#__PURE__*/React.createElement("div", {
86
- className: "vreo-infoPanel-t1"
87
- }, props.title), /*#__PURE__*/React.createElement("div", {
88
- className: "vreo-infoPanel-t2"
89
- }, props.subTitle)));
90
- };
91
- export function InfoPanel() {
92
- var timeoutRef = React.useRef();
93
- var controller = useController();
94
- React.useEffect(function () {
95
- var _controller$configs2;
96
- if (((_controller$configs2 = controller.configs) === null || _controller$configs2 === void 0 ? void 0 : _controller$configs2.keyframeMap.InfoPanel) === false) {
97
- return;
98
- }
99
- var callback = function callback(keyframe) {
100
- var start = keyframe.start,
101
- end = keyframe.end,
102
- data = keyframe.data;
103
- var infoPanelData = data;
104
- var title = infoPanelData.title,
105
- subTitle = infoPanelData.subTitle,
106
- style = infoPanelData.style;
107
- do {
108
- if (style === InfoPanelStyleEnum.PopUp) {
109
- if (infoPanelData.type === InfoPanelTypeEnum.Image) {
110
- controller.openPopUp(/*#__PURE__*/React.createElement(InfoPanelImg, {
111
- url: infoPanelData.url
112
- }, /*#__PURE__*/React.createElement(Title, {
113
- title: title,
114
- subTitle: subTitle
115
- })));
116
- } else if (infoPanelData.type === InfoPanelTypeEnum.Video) {
117
- controller.openPopUp(/*#__PURE__*/React.createElement(InfoPanelVideo, {
118
- url: infoPanelData.url
119
- }, /*#__PURE__*/React.createElement(Title, {
120
- title: title,
121
- subTitle: subTitle
122
- })));
123
- }
124
- break;
125
- }
126
- if (infoPanelData.type === InfoPanelTypeEnum.Image) {
127
- controller.openDrawer({
128
- content: /*#__PURE__*/React.createElement(InfoPanelImg, {
129
- url: infoPanelData.url
130
- }, /*#__PURE__*/React.createElement(Title, {
131
- title: title,
132
- subTitle: subTitle
133
- })),
134
- height: '60vh'
135
- });
136
- } else if (infoPanelData.type === InfoPanelTypeEnum.Video) {
137
- controller.openDrawer({
138
- content: /*#__PURE__*/React.createElement(InfoPanelVideo, {
139
- url: infoPanelData.url
140
- }, /*#__PURE__*/React.createElement(Title, {
141
- title: title,
142
- subTitle: subTitle
143
- })),
144
- height: '60vh'
145
- });
146
- }
147
- } while (false);
148
- timeoutRef.current = setTimeout(function () {
149
- controller.openDrawer(false);
150
- controller.openPopUp(false);
151
- }, end - start);
152
- };
153
- controller.on(VreoKeyframeEnum.InfoPanel, callback);
154
- var close = function close() {
155
- if (timeoutRef.current) clearTimeout(timeoutRef.current);
156
- controller.openDrawer(false);
157
- controller.openPopUp(false);
158
- };
159
- var remove = controller.playback.add(close);
160
- return function () {
161
- remove();
162
- close();
163
- controller.off(VreoKeyframeEnum.InfoPanel, callback);
164
- if (timeoutRef.current) {
165
- clearTimeout(timeoutRef.current);
166
- }
167
- };
168
- }, [controller]);
169
- return /*#__PURE__*/React.createElement(React.Fragment, null);
170
- }
@@ -1,126 +0,0 @@
1
- import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
2
- function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
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); }
4
- import * as React from 'react';
5
- import * as THREE from 'three';
6
- import { useController, useFiveInstance } from "../../../hooks.js";
7
- import { ModelTVVideoPlugin } from "../../../../fivePlugins/ModelTVVideoPlugin/index.js";
8
- import { createTransMatrix } from "../../../../shared-utils/createTransMatrix.js";
9
- import { VreoKeyframeEnum } from "../../../../typings/VreoUnit.js";
10
- export function ModelVideo() {
11
- var controller = useController();
12
- var five = useFiveInstance();
13
- var ref = React.useRef();
14
- var timeoutRef = React.useRef();
15
- React.useEffect(function () {
16
- var generation = 0;
17
- var stop = function stop() {
18
- var _ref$current;
19
- ++generation;
20
- if (timeoutRef.current) clearTimeout(timeoutRef.current);
21
- (_ref$current = ref.current) === null || _ref$current === void 0 || _ref$current.dispose();
22
- ref.current = undefined;
23
- };
24
- var remove = controller.playback.add(stop);
25
- var callback = /*#__PURE__*/function () {
26
- var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(keyframe) {
27
- var current, run, valid, plugin, start, end, _ref2, videoSrc, videoPosterSrc, vertexs, matrixWorld, position, points, _controller$configs, _t;
28
- return _regenerator().w(function (_context) {
29
- while (1) switch (_context.p = _context.n) {
30
- case 0:
31
- stop();
32
- current = generation;
33
- run = controller.playback.capture();
34
- valid = function valid() {
35
- return !!(run !== null && run !== void 0 && run.valid());
36
- };
37
- if (valid()) {
38
- _context.n = 1;
39
- break;
40
- }
41
- return _context.a(2);
42
- case 1:
43
- plugin = ref.current = ModelTVVideoPlugin(five, {
44
- mediaManager: run === null || run === void 0 ? void 0 : run.mediaManager
45
- });
46
- start = keyframe.start, end = keyframe.end;
47
- _ref2 = keyframe.data, videoSrc = _ref2.videoSrc, videoPosterSrc = _ref2.videoPosterSrc, vertexs = _ref2.vertexs, matrixWorld = _ref2.matrixWorld;
48
- position = function () {
49
- if (vertexs.length < 4) {
50
- throw new Error('ModelVideo: 顶点数据集合不够,无法组成矩形 ....');
51
- }
52
- if (vertexs.length === 4) {
53
- return vertexs;
54
- }
55
- var box = new THREE.Box3();
56
- vertexs.forEach(function (v) {
57
- return box.expandByPoint(new THREE.Vector3(v.x, v.y, v.z));
58
- });
59
- return [new THREE.Vector3(box.min.x, box.max.y, box.max.z), new THREE.Vector3(box.min.x, box.min.y, box.max.z), new THREE.Vector3(box.max.x, box.min.y, box.max.z), new THREE.Vector3(box.max.x, box.max.y, box.max.z)];
60
- }();
61
- points = function () {
62
- if (matrixWorld) {
63
- var transMatrix = createTransMatrix(matrixWorld);
64
- return [position.map(function (p) {
65
- var res = transMatrix([p.x, p.y, p.z]);
66
- return {
67
- x: res[0],
68
- y: res[1],
69
- z: res[2]
70
- };
71
- })];
72
- }
73
- return [position];
74
- }();
75
- plugin.disable();
76
- _context.p = 2;
77
- _context.n = 3;
78
- return plugin.load({
79
- video_src: videoSrc,
80
- video_poster_src: videoPosterSrc,
81
- points: points
82
- }, (_controller$configs = controller.configs) === null || _controller$configs === void 0 || (_controller$configs = _controller$configs.videos) === null || _controller$configs === void 0 ? void 0 : _controller$configs.modelTVVideo);
83
- case 3:
84
- _context.n = 5;
85
- break;
86
- case 4:
87
- _context.p = 4;
88
- _t = _context.v;
89
- if (current === generation && valid()) {
90
- controller.playback.cancel();
91
- console.error(_t);
92
- }
93
- return _context.a(2);
94
- case 5:
95
- if (!(current !== generation || !valid())) {
96
- _context.n = 6;
97
- break;
98
- }
99
- return _context.a(2);
100
- case 6:
101
- plugin.enable();
102
- timeoutRef.current = setTimeout(stop, end - start);
103
- case 7:
104
- return _context.a(2);
105
- }
106
- }, _callee, null, [[2, 4]]);
107
- }));
108
- return function callback(_x) {
109
- return _ref.apply(this, arguments);
110
- };
111
- }();
112
- controller.on(VreoKeyframeEnum.ModelVideo, callback);
113
- return function () {
114
- var _ref$current2;
115
- stop();
116
- remove();
117
- (_ref$current2 = ref.current) === null || _ref$current2 === void 0 || _ref$current2.dispose();
118
- ref.current = undefined;
119
- controller.off(VreoKeyframeEnum.ModelVideo, callback);
120
- if (timeoutRef.current) {
121
- clearTimeout(timeoutRef.current);
122
- }
123
- };
124
- }, [controller]);
125
- return /*#__PURE__*/React.createElement(React.Fragment, null);
126
- }