Add update, delete, isWorldSpace properties and updateView, deleteView events in CameraView,

src/core/camera/CameraView.ts

@@ -2,20 +2,25 @@ import {Event, EventDispatcher, Quaternion, Vector3} from 'three'
 import {onChange, serializable, serialize} from 'ts-browser-helpers'
 import {IUiConfigContainer, uiButton, uiInput, uiNumber, UiObjectConfig, uiPanelContainer, uiVector} from 'uiconfig.js'
 import {ICamera} from '../ICamera'
+import {generateUUID} from '../../three'
 
-export interface ICameraView{
+export interface ICameraView extends IUiConfigContainer{
     name: string
     position: Vector3
     target: Vector3
     quaternion: Quaternion
     zoom: number
+    isWorldSpace?: boolean
     animate(camera?: ICamera, duration?: number): void
     set(camera?: ICamera): void
+    update(camera?: ICamera): void
+    delete(camera?: ICamera): void
 }
 
 @serializable('CameraView')
 @uiPanelContainer('Camera View')
-export class CameraView extends EventDispatcher<Event, 'setView'|'animateView'> implements ICameraView, IUiConfigContainer {
+export class CameraView extends EventDispatcher<Event, 'setView'|'animateView'|'updateView'|'deleteView'> implements ICameraView, IUiConfigContainer {
+    uuid = generateUUID()
     @onChange(CameraView.prototype._nameChanged)
     @serialize() @uiInput() name = 'Camera View'
 
@@ -23,8 +28,11 @@ export class CameraView extends EventDispatcher<Event, 'setView'|'animateView'>
     @serialize() @uiVector() target = new Vector3()
     @serialize() @uiVector() quaternion = new Quaternion()
     @serialize() @uiNumber() zoom = 1
+    @serialize() isWorldSpace = true
 
     @uiButton() set = (camera?: ICamera) => this.dispatchEvent({type: 'setView', camera, view: this})
+    @uiButton() update = (camera?: ICamera) => this.dispatchEvent({type: 'updateView', camera, view: this})
+    @uiButton() delete = (camera?: ICamera) => this.dispatchEvent({type: 'deleteView', camera, view: this})
     @uiButton() animate = (camera?: ICamera, duration?: number) => this.dispatchEvent({type: 'animateView', camera, duration, view: this})
 
     constructor(name?: string, position?: Vector3, target?: Vector3, quaternion?: Quaternion, zoom?: number) {
@@ -49,4 +57,5 @@ export class CameraView extends EventDispatcher<Event, 'setView'|'animateView'>
 
     uiConfig?: UiObjectConfig
     // uiConfig = generateUiFolder(this.name, this)
+
 }

src/core/camera/PerspectiveCamera2.ts

@@ -346,6 +346,8 @@ export class PerspectiveCamera2 extends PerspectiveCamera implements ICamera {
                 // target should always be in world space
             }
         }
+        view.isWorldSpace = worldSpace
+        view.uiConfig?.uiRefresh?.(true, 'postFrame')
         return view as T
     }
 

src/plugins/animation/CameraViewPlugin.ts

@@ -153,13 +153,15 @@ export class CameraViewPlugin extends AViewerPluginSync<'viewChange'|'startViewC
 
     addView(view: CameraView) {
         this._cameraViews.push(view)
-        view.addEventListener('setView', this._viewSetView)
-        view.addEventListener('animateView', this._viewAnimateView)
+        view.addEventListener('setView', this._viewSetView as any)
+        view.addEventListener('updateView', this._viewUpdateView as any)
+        view.addEventListener('deleteView', this._viewDeleteView as any)
+        view.addEventListener('animateView', this._viewAnimateView as any)
         this.uiConfig.uiRefresh?.()
         this.dispatchEvent({type: 'viewAdd', view})
     }
 
-    protected _viewSetView = ({view, camera}: {view: CameraView, camera?: ICamera}&any) => {
+    protected _viewSetView = ({view, camera}: {view?: CameraView, camera?: ICamera}) => {
         if (!view) {
             this._viewer?.console.warn('Invalid view', view)
             return
@@ -167,7 +169,25 @@ export class CameraViewPlugin extends AViewerPluginSync<'viewChange'|'startViewC
         this.setView(view, camera)
     }
 
-    protected _viewAnimateView = async({view, camera, duration, easing, throwOnStop}: {view: CameraView, camera?: ICamera, duration?: number, easing?: Easing|EasingFunctionType, throwOnStop?: boolean}&any) => {
+    protected _viewUpdateView = ({view, camera}: {view: CameraView, camera?: ICamera}) => {
+        if (!view) {
+            this._viewer?.console.warn('Invalid view', view)
+            return
+        }
+        const name = view.name
+        this.getView(camera, view.isWorldSpace ?? true, view)
+        view.name = name
+    }
+
+    protected _viewDeleteView = ({view}: {view: CameraView}) => {
+        if (!view) {
+            this._viewer?.console.warn('Invalid view', view)
+            return
+        }
+        this.deleteView(view)
+    }
+
+    protected _viewAnimateView = async({view, camera, duration, easing, throwOnStop}: {view: CameraView, camera?: ICamera, duration?: number, easing?: Easing|EasingFunctionType, throwOnStop?: boolean}) => {
         if (!view) {
             this._viewer?.console.warn('Invalid view', view)
             return
@@ -183,10 +203,10 @@ export class CameraViewPlugin extends AViewerPluginSync<'viewChange'|'startViewC
         this.dispatchEvent({type: 'viewDelete', view})
     }
 
-    getView(camera?: ICamera, worldSpace = true) {
+    getView(camera?: ICamera, worldSpace = true, view?: CameraView) {
         camera = camera || this._viewer?.scene.mainCamera
-        if (!camera) return new CameraView()
-        return camera.getView(worldSpace)
+        if (!camera) return view ?? new CameraView()
+        return camera.getView(worldSpace, view)
     }
 
     setView(view: ICameraView, camera?: ICamera) {