npm - @realsee/vreo - Versions diffs - 1.0.0-alpha.19 → 1.0.0-alpha.20 - Mend

@realsee/vreo 1.0.0-alpha.19 → 1.0.0-alpha.20

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 (112) hide show

package/lib/Player/modules/keyframes/BgMusic/index.js +2 -4
package/package.json +1 -3
package/docs/.nojekyll +0 -1
package/docs/assets/custom.css +0 -78
package/docs/assets/highlight.css +0 -127
package/docs/assets/icons.css +0 -1043
package/docs/assets/icons.png +0 -0
package/docs/assets/icons@2x.png +0 -0
package/docs/assets/main.js +0 -52
package/docs/assets/search.js +0 -1
package/docs/assets/style.css +0 -1414
package/docs/assets/widgets.png +0 -0
package/docs/assets/widgets@2x.png +0 -0
package/docs/classes/Player.AudioLike.html +0 -52
package/docs/classes/Player.Controller.html +0 -54
package/docs/classes/Player.Player-1.html +0 -50
package/docs/classes/Player.VideoAgentMesh.html +0 -142
package/docs/classes/Player.VideoAgentScene.html +0 -1
package/docs/demo/assets/AppReact.20163f9a.js +0 -1
package/docs/demo/assets/default.17872c62.css +0 -1
package/docs/demo/assets/default.5069891b.js +0 -3988
package/docs/demo/assets/dynamic.c8118cc9.js +0 -1
package/docs/demo/assets/examples.5391fc1f.js +0 -25
package/docs/demo/assets/examples.dac4a6fe.css +0 -1
package/docs/demo/assets/index.2272a9ef.js +0 -1
package/docs/demo/assets/index.9331038f.css +0 -1
package/docs/demo/assets/main.b335b989.js +0 -1
package/docs/demo/assets/react.2ee8565f.css +0 -1
package/docs/demo/assets/react.efea3f3f.js +0 -25
package/docs/demo/assets/znRoyv06SZQeqA7m.0057e8ae.js +0 -1
package/docs/demo/examples.html +0 -17
package/docs/demo/index-react-dynamic.html +0 -20
package/docs/demo/index-react.html +0 -20
package/docs/demo/index.html +0 -19
package/docs/enums/Player.InfoPanelStyleEnum.html +0 -1
package/docs/enums/Player.InfoPanelTypeEnum.html +0 -3
package/docs/enums/Player.PanoEffectEnum.html +0 -5
package/docs/enums/Player.PanoTagEnum.html +0 -3
package/docs/enums/Player.PanoTagStyleEnum.html +0 -7
package/docs/enums/Player.VreoKeyframeEnum.html +0 -25
package/docs/enums/fivePlugins.CameraMovementEffect.html +0 -1
package/docs/enums/fivePlugins.Rotation.html +0 -1
package/docs/index.html +0 -248
package/docs/interfaces/Player.CustomVreoKeyframeProps.html +0 -1
package/docs/interfaces/Player.PlayerConfigs.html +0 -7
package/docs/interfaces/Player.Vertex.html +0 -3
package/docs/interfaces/Player.VideoAgentMeshOptions.html +0 -8
package/docs/interfaces/Player.VreoKeyframe.html +0 -3
package/docs/interfaces/Player.VreoUnit.html +0 -3
package/docs/interfaces/Player.VreoVideo.html +0 -3
package/docs/interfaces/fivePlugins.CSS3DRenderPluginExportType.html +0 -4
package/docs/interfaces/fivePlugins.CameraMovementOptsCallback.html +0 -1
package/docs/interfaces/fivePlugins.CameraMovementPluginExportType.html +0 -7
package/docs/interfaces/fivePlugins.CameraMovementPluginParameterType.html +0 -1
package/docs/interfaces/fivePlugins.ModelTVVideoPluginData.html +0 -1
package/docs/interfaces/fivePlugins.ModelTVVideoPluginExportType.html +0 -1
package/docs/interfaces/fivePlugins.ModelTVVideoPluginParameterType.html +0 -1
package/docs/interfaces/fivePlugins.Vector3Position.html +0 -3
package/docs/interfaces/react.VreoActionCallbacks.html +0 -23
package/docs/interfaces/react.VreoProviderProps.html +0 -1
package/docs/modules/Player.html +0 -37
package/docs/modules/custom.html +0 -3
package/docs/modules/fivePlugins.html +0 -6
package/docs/modules/react.html +0 -1
package/docs/modules.html +0 -1
package/resources/PlayController/createHTMLAudioElement.ts +0 -53
package/resources/PlayController/index.ts +0 -154
package/resources/Player/App.tsx +0 -66
package/resources/Player/Controller.ts +0 -295
package/resources/Player/custom/SpatialScenePanel/index.tsx +0 -264
package/resources/Player/hooks.ts +0 -26
package/resources/Player/index.tsx +0 -227
package/resources/Player/modules/Drawer/index.tsx +0 -40
package/resources/Player/modules/PopUp/index.tsx +0 -26
package/resources/Player/modules/ResizeObserver/index.tsx +0 -23
package/resources/Player/modules/VideoAgent/VideoAgentMesh.ts +0 -302
package/resources/Player/modules/VideoAgent/VideoAgentScene.ts +0 -56
package/resources/Player/modules/VideoAgent/index.tsx +0 -53
package/resources/Player/modules/Wave/index.tsx +0 -150
package/resources/Player/modules/keyframes/BgMusic/index.tsx +0 -75
package/resources/Player/modules/keyframes/CameraMovement/index.tsx +0 -37
package/resources/Player/modules/keyframes/InfoPanel/index.tsx +0 -165
package/resources/Player/modules/keyframes/ModelVideo/index.tsx +0 -77
package/resources/Player/modules/keyframes/PanoEffect/index.tsx +0 -99
package/resources/Player/modules/keyframes/PanoEffect/lineAnime.ts +0 -31
package/resources/Player/modules/keyframes/PanoTag/index.tsx +0 -83
package/resources/Player/modules/keyframes/PanoTextLabel/index.tsx +0 -117
package/resources/Player/modules/keyframes/Prompter/index.tsx +0 -56
package/resources/Player/modules/keyframes/UpdateVRPanorama/index.tsx +0 -99
package/resources/Player/modules/keyframes/VideoEffect/index.tsx +0 -115
package/resources/Player/typings.ts +0 -49
package/resources/fivePlugins/CSS3DRenderPlugin/centerPoint.ts +0 -5
package/resources/fivePlugins/CSS3DRenderPlugin/createResizeObserver.ts +0 -17
package/resources/fivePlugins/CSS3DRenderPlugin/evenNumber.ts +0 -4
package/resources/fivePlugins/CSS3DRenderPlugin/index.ts +0 -254
package/resources/fivePlugins/CSS3DRenderPlugin/transformPositionToVector3.ts +0 -5
package/resources/fivePlugins/CameraMovementPlugin/index.ts +0 -226
package/resources/fivePlugins/CameraMovementPlugin/typings.ts +0 -59
package/resources/fivePlugins/ModelTVVideoPlugin/index.ts +0 -278
package/resources/index.ts +0 -1
package/resources/react/index.tsx +0 -121
package/resources/shared-utils/AudioLike.ts +0 -107
package/resources/shared-utils/Preloader.ts +0 -35
package/resources/shared-utils/addResizeListener.ts +0 -46
package/resources/shared-utils/animationFrame/BetterTween.ts +0 -33
package/resources/shared-utils/animationFrame/index.ts +0 -48
package/resources/shared-utils/animationFrame/tween.ts +0 -51
package/resources/shared-utils/createTransMatrix.ts +0 -12
package/resources/shared-utils/getFileExpandedName.ts +0 -6
package/resources/shared-utils/getMediaInfo.ts +0 -52
package/resources/shared-utils/setElementDataset.ts +0 -18
package/resources/typings/VreoUnit.ts +0 -314

package/docs/modules.html DELETED Viewed

@@ -1 +0,0 @@

- <!DOCTYPE html><html class="default"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>Vreo</title><meta name="description" content="Documentation for Vreo"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="assets/style.css"/><link rel="stylesheet" href="assets/highlight.css"/><link rel="stylesheet" href="assets/custom.css"/><script async src="assets/search.js" id="search-script"></script></head><body><script>document.body.classList.add(localStorage.getItem("tsd-theme") || "os")</script><header><div class="tsd-page-toolbar"><div class="container"><div class="table-wrap"><div class="table-cell" id="tsd-search" data-base="."><div class="field"><label for="tsd-search-field" class="tsd-widget search no-caption">Search</label><input type="text" id="tsd-search-field"/></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="index.html" class="title">Vreo</a></div><div class="table-cell" id="tsd-widgets"><div id="tsd-filter"><a href="#" class="tsd-widget options no-caption" data-toggle="options">Options</a><div class="tsd-filter-group"><div class="tsd-select" id="tsd-filter-visibility"><span class="tsd-select-label">All</span><ul class="tsd-select-list"><li data-value="public">Public</li><li data-value="protected">Public/Protected</li><li data-value="private" class="selected">All</li></ul></div> <input type="checkbox" id="tsd-filter-inherited" checked/><label class="tsd-widget" for="tsd-filter-inherited">Inherited</label><input type="checkbox" id="tsd-filter-externals" checked/><label class="tsd-widget" for="tsd-filter-externals">Externals</label></div></div><a href="#" class="tsd-widget menu no-caption" data-toggle="menu">Menu</a></div></div></div></div><div class="tsd-page-title"><div class="container"><h1> Vreo </h1></div></div></header><div class="container container-main"><div class="row"><div class="col-8 col-content"><section class="tsd-panel-group tsd-index-group"><h2>Index</h2><section class="tsd-panel tsd-index-panel"><div class="tsd-index-content"><section class="tsd-index-section "><h3>Modules</h3><ul class="tsd-index-list"><li class="tsd-kind-module"><a href="modules/Player.html" class="tsd-kind-icon">Player</a></li><li class="tsd-kind-module"><a href="modules/custom.html" class="tsd-kind-icon">custom</a></li><li class="tsd-kind-module"><a href="modules/fivePlugins.html" class="tsd-kind-icon">five<wbr/>Plugins</a></li><li class="tsd-kind-module"><a href="modules/react.html" class="tsd-kind-icon">react</a></li></ul></section></div></section></section></div><div class="col-4 col-menu menu-sticky-wrap menu-highlight"><nav class="tsd-navigation primary"><ul><li class="current"><a href="modules.html">Modules</a></li><li class=" tsd-kind-module"><a href="modules/Player.html">Player</a></li><li class=" tsd-kind-module"><a href="modules/custom.html">custom</a></li><li class=" tsd-kind-module"><a href="modules/fivePlugins.html">five<wbr/>Plugins</a></li><li class=" tsd-kind-module"><a href="modules/react.html">react</a></li></ul></nav></div></div></div><footer class=""><div class="container"><h2>Legend</h2><div class="tsd-legend-group"><ul class="tsd-legend"><li class="tsd-kind-variable"><span class="tsd-kind-icon">Variable</span></li><li class="tsd-kind-function"><span class="tsd-kind-icon">Function</span></li><li class="tsd-kind-function tsd-has-type-parameter"><span class="tsd-kind-icon">Function with type parameter</span></li><li class="tsd-kind-type-alias"><span class="tsd-kind-icon">Type alias</span></li></ul><ul class="tsd-legend"><li class="tsd-kind-enum"><span class="tsd-kind-icon">Enumeration</span></li></ul><ul class="tsd-legend"><li class="tsd-kind-interface"><span class="tsd-kind-icon">Interface</span></li></ul><ul class="tsd-legend"><li class="tsd-kind-class"><span class="tsd-kind-icon">Class</span></li></ul></div><h2>Settings</h2><p>Theme <select id="theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></p></div></footer><div class="overlay"></div><script src="assets/main.js"></script></body></html>

package/resources/PlayController/createHTMLAudioElement.ts DELETED Viewed

@@ -1,53 +0,0 @@
-const BLANK_AUDIO = ''
-+ 'data:audio/mpeg;base64,'
-+ '//uQxAAAAAAAAAAAAAAAAAAAAAAASW5mbwAAAA8AAAADAAAGhgBVVVVVVVVVVVVVVVVVVVVVVVV'
-+ 'VVVVVVVVVVVVVVVVVVVWqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqr///////////'
-+ '////////////////////////////////8AAAA5TEFNRTMuOThyAc0AAAAAAAAAABSAJAiqQgAAg'
-+ 'AAABobxtI73AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA'
-+ 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA'
-+ 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA'
-+ 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA'
-+ 'AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA//uQxAACFEII9ACZ/sJZwWEoEb8w/////N//////Jcxj'
-+ 'Hjf+7/v/H2PzCCFAiDtGeyBCIx7bJJ1mmEEMy6g8mm2c8nrGABB4h2Mkmn//4z/73u773R5qHHu'
-+ '/j/w7Kxkzh5lWRWdsifCkNAnY9Zc1HvDAhjhSHdFkHFzLmabt/AQxSg2wwzLhHIJOBnAWwVY4zr'
-+ 'hIYhhc2kvhYDfQ4hDi2Gmh5KyFn8EcGIrHAngNgIwVIEMf5bzbAiTRoAD///8z/KVhkkWEle6IX'
-+ '+d/z4fvH3BShK1e5kmjkCMoxVmXhd4ROlTKo3iipasvTilY21q19ta30/v/0/idPX1v8PNxJL6r'
-+ 'amnOVsdvMv2akO0iSYIzdJFirtzWXCZicS9vHqvSKyqm5XJBdqBwPxyfJdykhWTZ0G0ZyTZGpLK'
-+ 'xsNwwoRhsx3tZfhwmeOBVISm3impAC/IT/8hP/EKEM1KMdVdVKM2rHV4x7HVXZvbVVKN/qq8CiV'
-+ '9VL9jjH/6l6qf7MBCjZmOqsAibjcP+qqqv0oxqpa/NVW286hPo1nz2L/h8+jXt//uSxCmDU2IK/'
-+ 'ECN98KKtE5IYzNoCfbw+u9i5r8PoadUMFPKqWL4LK3T/LCraMSHGkW4bpLXR/E6LlHOVQxmslKV'
-+ 'J8IULktMN06N0FKCpHCoYsjC4F+Z0NVqdNFoGSTjSiyjzLdnZ2fNqTi2eHKONONKLMPMKLONKLM'
-+ 'PQRJGlFxZRoKcJFAYEeIFiRQkUWUeYfef//Ko04soswso40UJAgMw8wosososy0EalnZyjQUGBR'
-+ 'QGIFggOWUacWUeYmuadrZziQKKEgQsQLAhQkUJAgMQDghltLO1onp0cpkNInSFMqlYeSEJ5AHsq'
-+ 'FdOwy1DA2sRmRJKxdKRfLhfLw5BzUxBTUUzLjk4LjJVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV'
-+ 'VVVVVVVVVVVVVVVVVUxBTUUzLjk4LjJVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV'
-+ 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV'
-+ 'VVVVVVVVVVVVVVVVVVVf/7ksRRA8AAAaQAAAAgAAA0gAAABFVVVVVVVVVVVVVVVVVVVVVVVVVVV'
-+ 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV'
-+ 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV'
-+ 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV'
-+ 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV'
-+ 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV'
-+ 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV'
-+ 'VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVU=';
-export function createHTMLAudioElement(): HTMLAudioElement {
-  const ndAudio = document.querySelector('#vreo-playController-audio')
-  if (ndAudio) {
-    return ndAudio as HTMLAudioElement
-  }
-  const audio = document.createElement('audio')
-  audio.style.display = 'none'
-  audio.setAttribute('id', 'vreo-playController-audio')
-  audio.controls = false
-  document.body.appendChild(audio)
-  audio.src = BLANK_AUDIO
-  // 触发一次播放
-  Promise.resolve(async () => await audio.play())
-  return audio
-}

package/resources/PlayController/index.ts DELETED Viewed

@@ -1,154 +0,0 @@
-import { Subscribe } from '@realsee/five'
-import { requestAnimationFrameInterval } from '../shared-utils/animationFrame'
-import { VreoKeyframe, VreoKeyframeEvent, VreoUnit } from '../typings/VreoUnit'
-import { createHTMLAudioElement } from './createHTMLAudioElement'
-export interface PlayControllerConfig {
-  audio?: HTMLAudioElement
-}
-const closures: Record<string, any> = {}
-export class PlayController extends Subscribe<VreoKeyframeEvent> {
-  vreoUnit?: VreoUnit
-  config: PlayControllerConfig = {}
-  stopInterval: () => void
-  get paused() {
-    return this.audioInstance.paused
-  }
-  get audioInstance() {
-    return this.config.audio!
-  }
-  get currentTime() {
-    return this.audioInstance.currentTime * 1000
-  }
-  get currentKeyframes() {
-    if (!this.vreoUnit) return []
-    const keyframes = this.vreoUnit.keyframes
-    // 没有被解析过且开始时间低于当前时间戳 100ms
-    return keyframes.filter((keyframe: VreoKeyframe) => {
-      if (keyframe.parsed) return false
-      const dur = this.currentTime - keyframe.start
-      return dur <= 100 && dur >= 0
-    })
-  }
-  /**
-   * 音频时长 不一定能获取得到，建议以 VreoUnit 配置的时长为准。
-   */
-  get duration() {
-    return this.audioInstance.duration * 1000
-  }
-  constructor(config: PlayControllerConfig = {}) {
-    super()
-    if (!config.audio) {
-      config.audio = createHTMLAudioElement()
-    }
-    this.config = Object.assign(this.config, config)
-    closures.onPlaying = () => this.emit('playing')
-    closures.onPaused = () => this.emit('paused')
-    closures.onEnded = () => this.emit('paused', true)
-    this.audioInstance.addEventListener('play', closures.onPlaying)
-    this.audioInstance.addEventListener('pause', closures.onPaused)
-    this.audioInstance.addEventListener('ended', closures.onEnded)
-    this.stopInterval = requestAnimationFrameInterval(() => {
-      if (this.audioInstance.paused) {
-        return
-      }
-      if (!this.vreoUnit) {
-        return
-      }
-      const keyframes = this.vreoUnit.keyframes
-      const currentTime = this.currentTime
-      // 没有被解析过且开始时间低于当前时间戳 100ms
-      const currentKeyframes = keyframes.filter((keyframe: VreoKeyframe) => {
-        if (keyframe.parsed) return false
-        const dur = currentTime - keyframe.start
-        return dur <= 60 && dur >= 0
-      })
-      currentKeyframes.forEach((keyframe) => {
-        if (keyframe.parsed) return
-        keyframe.parsed = true
-        this.emit(keyframe.type, keyframe, this.currentTime)
-      })
-    })
-  }
-  /**
-   * 载入数据
-   */
-  async load(vreoUnit: VreoUnit): Promise<boolean> {
-    this.vreoUnit = vreoUnit
-    await this.pause()
-    return await new Promise((resolve, reject) => {
-      if (vreoUnit.video.url === this.audioInstance.src) {
-        return resolve(true)
-      }
-      this.audioInstance.src = vreoUnit.video.url
-      const canplaythrough = () => {
-        resolve(true)
-        this.audioInstance.removeEventListener('canplaythrough', canplaythrough)
-      }
-      const error = (err: any) => {
-        reject(err)
-        this.audioInstance.removeEventListener('error', error)
-      }
-      this.audioInstance.addEventListener('canplaythrough', canplaythrough)
-      this.audioInstance.addEventListener('error', error)
-    })
-  }
-  /**
-   * 播放
-   */
-  async play() {
-    closures.playPromise = this.audioInstance.play()
-  }
-  /**
-   * 暂停
-   */
-  async pause() {
-    if (closures.playPromise) {
-      await closures.playPromise
-    }
-    this.audioInstance.pause()
-  }
-  /**
-   * 销毁资源
-   * @notice 一旦销毁，创建的实例将不可用：需重新创建实例。
-   *
-   * @deprecated **慎重执行**
-   */
-  dispose() {
-    // 清理事件监听
-    this.audioInstance.removeEventListener('play', closures.onPlaying)
-    this.audioInstance.removeEventListener('pasue', closures.onPaused)
-    this.audioInstance.removeEventListener('ended', closures.onEnded)
-    if (this.stopInterval) {
-      this.stopInterval()
-    }
-  }
-}

package/resources/Player/App.tsx DELETED Viewed

@@ -1,66 +0,0 @@
-import * as React from 'react'
-import classNames from 'classnames'
-import { observer } from 'mobx-react'
-import { Controller } from './Controller'
-import { useController } from './hooks'
-import { CameraMovement } from './modules/keyframes/CameraMovement'
-import { ResizeObserver } from './modules/ResizeObserver'
-import { InfoPanel } from './modules/keyframes/InfoPanel'
-import { ModelVideo } from './modules/keyframes/ModelVideo'
-import { PanoEffect } from './modules/keyframes/PanoEffect'
-import { PanoTag } from './modules/keyframes/PanoTag'
-import { PanoTextLabel } from './modules/keyframes/PanoTextLabel'
-import { Prompter } from './modules/keyframes/Prompter'
-import { UpdateVRPanorama } from './modules/keyframes/UpdateVRPanorama'
-import { VideoEffect } from './modules/keyframes/VideoEffect'
-import { VideoAgent } from './modules/VideoAgent'
-import { BgMusic } from './modules/keyframes/BgMusic'
-import { Wave } from './modules/Wave'
-const AppView = observer(({ controller }: { controller: Controller }) => {
-  return (
-    <div
-      className={classNames('vreo-panel', {
-        'vreo-panel--hidden': !controller.visible,
-      })}
-    >
-      <div className="vreo-panel-inner">
-        {controller.waveAppearance && <Wave appearance={controller.waveAppearance}/>}
-        <VideoAgent
-          onClick={() => {
-            if (controller.playing) {
-              controller.setPlaying(false)
-            } else {
-              controller.setPlaying(true)
-            }
-          }}
-          options={controller.configs?.videoAgentMeshOptions || {}}
-        />
-        <Prompter />
-        {controller.configs?.customPanelChildren}
-      </div>
-    </div>
-  )
-})
-export function App() {
-  const controller = useController()
-  return (
-    <>
-      <>
-        <ResizeObserver />
-        <CameraMovement />
-        <ModelVideo />
-        <UpdateVRPanorama />
-        <VideoEffect />
-        <PanoTag />
-        <PanoTextLabel />
-        <InfoPanel />
-        <PanoEffect />
-        <BgMusic />
-      </>
-      <AppView controller={controller} />
-    </>
-  )
-}

package/resources/Player/Controller.ts DELETED Viewed

@@ -1,295 +0,0 @@
-import { Five, Subscribe } from '@realsee/five'
-import { action, computed, makeObservable, observable, reaction } from 'mobx'
-import * as React from 'react'
-import { requestAnimationFrameInterval } from '../shared-utils/animationFrame'
-import { VreoKeyframe, VreoKeyframeEnum, VreoKeyframeEvent, VreoUnit, VreoVideo } from '../typings/VreoUnit'
-import { VideoAgentScene } from './modules/VideoAgent/VideoAgentScene'
-import { Appearance, PlayerConfigs, WaveAppearance } from './typings'
-import setElementDataset from '../shared-utils/setElementDataset'
-import { getMediaType } from '../shared-utils/getMediaInfo'
-/**
- * 逻辑控制器：内部状态。
- */
-export class Controller extends Subscribe<VreoKeyframeEvent> {
-    five: Five
-    configs: PlayerConfigs
-    videoAgentScene?: VideoAgentScene
-    vreoUnit?: VreoUnit
-    stopInterval?: () => void
-    playing = false
-    ended = false
-    loading: boolean | null = false // null 表示加载失败
-    containerSize: { width: number, height: number } = { width: 0, height: 0 }
-    appSize?: 'S' | 'M' | 'L' | 'XL'
-    container: Element
-    waveAppearance: WaveAppearance | null = null
-    appearance: Appearance = {
-        waveStyle: 'wave',
-    }
-    avatar: VreoVideo['avatar'] = {}
-    visible = false
-    get agentType() {
-        const type = getMediaType(this.videoAgentScene?.videoAgentMesh.videoUrl)
-        if (this.avatar?.force) return 'avatar'
-        if (type === 'video') return 'video'
-        return 'none'
-    }
-    popUp: string | JSX.Element | null = null
-    openPopUp(popUp: string | JSX.Element | false) {
-        if (!popUp) {
-            this.popUp = null
-            return
-        }
-        this.popUp = popUp
-    }
-    setLoading(loading: boolean | null) {
-        this.loading = loading
-    }
-    drawerConfig: {
-        content: string | JSX.Element
-        height?: number | string
-    } | null = null
-    setAvatar(avatar: VreoVideo['avatar']) {
-        this.avatar = avatar
-    }
-    setContainerSize(width: number, height: number) {
-        this.containerSize = { width, height }
-    }
-    setVisible(v: boolean) {
-        this.visible = v
-    }
-    setPlaying(playing: boolean) {
-        this.playing = playing
-    }
-    setEnded(ended: boolean) {
-        this.ended = ended
-    }
-    setAppearance(appearance: Appearance) {
-        this.appearance = { ...this.appearance, ...appearance }
-    }
-    openDrawer(drawerConfig?: false | { content: string | JSX.Element; height?: number | string }) {
-        if (!drawerConfig) {
-            this.drawerConfig = {
-                content: '',
-                height: this.drawerConfig?.height
-            }
-            return
-        }
-        this.drawerConfig = drawerConfig
-    }
-    constructor({five, container, configs}: { five: Five, container: Element, configs: PlayerConfigs }) {
-        super()
-        this.configs = configs
-        this.container = container
-        this.five = five
-        this.appSize = configs.appSize
-        this.appearance = { ...this.appearance, ...configs.appearance }
-        makeObservable(this, {
-            visible: observable,
-            setVisible: action,
-            playing: observable,
-            setPlaying: action,
-            loading: observable,
-            // videoAgentScene: observable.ref,
-            setLoading: action,
-            popUp: observable.ref,
-            openPopUp: action,
-            drawerConfig: observable.ref,
-            openDrawer: action,
-            ended: observable,
-            waveAppearance: observable,
-            avatar: observable,
-            containerSize: observable,
-            setContainerSize: action,
-            appearance: observable,
-            setAppearance: action,
-            configs: observable.ref,
-            setEnded: action,
-            setAvatar: action,
-        })
-        reaction<[typeof this.appearance.waveStyle, boolean | null], boolean>(
-            () => [this.appearance.waveStyle, this.loading],
-            ([waveStyle, loading]) => {
-                if (loading === null) {
-                    this.waveAppearance = null
-                    return
-                }
-                if (waveStyle === 'wave') {
-                    switch (loading) {
-                        case true:
-                            this.waveAppearance = 'double'
-                            break
-                        case false:
-                            this.waveAppearance = 'solid'
-                            break
-                    }
-                } else if (waveStyle === 'solid') {
-                    switch (loading) {
-                        case true:
-                            this.waveAppearance = 'swap'
-                            break
-                        case false:
-                            this.waveAppearance = 'expand'
-                            break
-                    }
-                }
-            },
-            { fireImmediately: true }
-        )
-        if (!this.appSize) {
-            reaction(
-                () => this.containerSize,
-                (containerSize) => {
-                    if (!containerSize?.width) return
-                    const width = containerSize.width
-                    const height = containerSize.height
-                    const size = (() => {
-                        if (width <= 500) return 'S'
-                        if (width <= 1024) return 'M'
-                        if (width <= 2048) return 'L'
-                        return 'XL'
-                    })()
-                    const orientation = (() => {
-                        if (height > width) return 'portrait'
-                        return 'landscape'
-                    })()
-                    setElementDataset(this.container, { size })
-                    setElementDataset(this.container, { orientation })
-                },
-                { fireImmediately: true }
-            )
-        } else {
-            setElementDataset(this.container, { size: this.appSize })
-        }
-        // 监听播放情况：抛出触发时机
-        reaction(
-            () => this.ended,
-            (ended) => {
-                if (ended) {
-                    this.emit('paused', true)
-                }
-            }
-        )
-        reaction(
-            () => this.playing,
-            (playing) => {
-                if (!this.ended) {
-                    this.emit(playing ? 'playing' : 'paused')
-                }
-            }
-        )
-    }
-    get ready() {
-        return !!this.videoAgentScene
-    }
-    get currentTime() {
-        return this.videoAgentScene?.videoAgentMesh.currentTime || 0
-    }
-    get currentKeyframes() {
-        if (!this.vreoUnit) return []
-        const keyframes = this.vreoUnit.keyframes
-        // 没有被解析过且开始时间低于当前时间戳 100ms
-        return keyframes.filter((keyframe: VreoKeyframe) => {
-            if (keyframe.parsed) return false
-            const dur = this.currentTime - keyframe.start
-            return dur <= 100 && dur >= 0
-        })
-    }
-    get mediaInstance() {
-        return this.videoAgentScene?.videoAgentMesh.mediaInstance
-    }
-    /**
-     * 逐帧任务
-     */
-    requestAnimationFrameLoop(callback: (type: VreoKeyframeEnum, keyframe: VreoKeyframe, currentTime: number) => void) {
-        if (this.mediaInstance?.ended) {
-            this.setEnded(true)
-            this.setPlaying(false)
-            this.mediaInstance.pause()
-            return
-        }
-        if (!this.playing) {
-            if (!this.mediaInstance?.paused) {
-                this.mediaInstance?.pause()
-            }
-            return
-        }
-        if (this.mediaInstance?.paused && this.playing) {
-            this.mediaInstance.play()
-        }
-        const currentKeyframes = this.currentKeyframes
-        currentKeyframes.forEach((keyframe) => {
-            if (keyframe.parsed) return
-            keyframe.parsed = true
-            this.emit(keyframe.type, keyframe, this.currentTime)
-            if (callback) {
-                callback(keyframe.type, keyframe, this.currentTime)
-            }
-        })
-    }
-    run(callback: (type: VreoKeyframeEnum, keyframe: VreoKeyframe) => void) {
-        if (this.stopInterval) return
-        this.stopInterval = requestAnimationFrameInterval(() => this.requestAnimationFrameLoop(callback))
-    }
-    dispose() {
-        this.setPlaying(false)
-        if (this.currentKeyframes) {
-            this.currentKeyframes.forEach((keyframe) => (keyframe.parsed = false))
-        }
-        /**
-         * 清理掉数据
-         */
-        this.vreoUnit = undefined
-        if (this.mediaInstance) {
-            this.mediaInstance.currentTime = 0
-        }
-        if (this.stopInterval) {
-            this.stopInterval()
-            this.stopInterval = undefined
-        }
-    }
-}
-const ControllerContext = React.createContext<Controller | null>(null)
-export { ControllerContext }