/
EditorViewWidgetPlugin.ts
78 lines (65 loc) · 2.91 KB
/
EditorViewWidgetPlugin.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
import {AViewerPluginSync, type IViewerEvent, ThreeViewer} from '../../viewer'
import {DomPlacement, GizmoOrientation, ViewHelper2} from '../../three'
import {uiFolderContainer, uiToggle} from 'uiconfig.js'
import {onChange} from 'ts-browser-helpers'
@uiFolderContainer('Editor View Widget')
export class EditorViewWidgetPlugin extends AViewerPluginSync<''> {
public static readonly PluginType = 'EditorViewWidgetPlugin'
@uiToggle()
@onChange(EditorViewWidgetPlugin.prototype.setDirty)
enabled = true
setDirty() {
if (!this._viewer || !this.widget) return
this.widget.domContainer.style.display = !this.isDisabled() ? 'block' : 'none'
}
constructor(public readonly placement: DomPlacement = 'top-left', public readonly size = 128) {
super()
}
widget?: ViewHelper2
onAdded(v: ThreeViewer) {
super.onAdded(v)
this.widget = new ViewHelper2(v.scene.mainCamera as any, v.canvas, this.placement, this.size)
this.widget.target = v.scene.mainCamera.target
this.widget.addEventListener('animating-changed', (e)=>{
const val = e.detail.value
v.scene.mainCamera.setInteractions(!val, EditorViewWidgetPlugin.PluginType)
})
this.widget.addEventListener('update', ()=>this._needsRender = true) // when mouse hover and leave.
v.scene.addEventListener('mainCameraChange', this._mainCameraChange)
v.scene.addEventListener('mainCameraUpdate', this._mainCameraUpdate)
}
onRemove(viewer: ThreeViewer) {
this.widget?.dispose()
this.widget = undefined
viewer.scene.removeEventListener('mainCameraChange', this._mainCameraChange)
viewer.scene.removeEventListener('mainCameraUpdate', this._mainCameraUpdate)
super.onRemove(viewer)
}
protected _mainCameraChange() {
if (!this._viewer || !this.widget) return
this.widget.camera = this._viewer.scene.mainCamera as any
}
protected _mainCameraUpdate() {
if (!this._viewer || !this.widget) return
this.widget.target = this._viewer.scene.mainCamera.target
}
// this is required separately so that when we hover on the gizmo we dont need to set dirty for the whole viewer
protected _needsRender = false
protected _viewerListeners = {
postRender: (_: IViewerEvent)=>{
if (!this._viewer || !this.widget || this.isDisabled()) return
this._needsRender = true
},
postFrame: (_: IViewerEvent)=>{
if (!this._viewer || !this.widget || this.isDisabled() || !this._needsRender) return
this.widget.update()
this.widget.render()
if (this.widget.animating) this._viewer.scene.mainCamera.setDirty()
this._needsRender = false
},
}
setOrientation(orientation: GizmoOrientation) {
if (!this.widget) return
this.widget.setOrientation(orientation)
}
}