forked from Kitware/itk-vtk-viewer
-
Notifications
You must be signed in to change notification settings - Fork 0
/
createGeometriesUI.js
67 lines (57 loc) · 2.22 KB
/
createGeometriesUI.js
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
import { reaction, autorun } from 'mobx'
import style from './ItkVtkViewer.module.css'
import createGeometryRepresentationSelector from './Geometries/createGeometryRepresentationSelector'
import createGeometryColorWidget from './Geometries/createGeometryColorWidget'
function createGeometriesUI(store, uiContainer) {
const geometriesUIGroup = document.createElement('div')
geometriesUIGroup.setAttribute('class', style.uiGroup)
const geometryRepresentationRow = document.createElement('div')
geometryRepresentationRow.setAttribute('class', style.uiRow)
geometryRepresentationRow.className += ` ${store.id}-collapsible`
if (store.mainUI.collapsed) {
geometryRepresentationRow.style.display = 'none'
}
const geometrySelector = document.createElement('select')
geometrySelector.setAttribute('class', style.selector)
geometrySelector.id = `${store.id}-geometrySelector`
geometryRepresentationRow.appendChild(geometrySelector)
geometrySelector.addEventListener('change', event => {
event.preventDefault()
event.stopPropagation()
store.geometriesUI.selectedGeometryIndex = geometrySelector.selectedIndex
})
function updateGeometryNames(names) {
geometrySelector.innerHTML = names
.map(name => `<option value="${name}">${name}</option>`)
.join('')
if (names.length > 1) {
geometrySelector.disabled = false
} else {
geometrySelector.disabled = true
}
}
reaction(
() => {
return store.geometriesUI.names.slice()
},
names => {
updateGeometryNames(names)
}
)
if (store.geometriesUI.geometries.length > 0) {
store.geometriesUI.selectedGeometryIndex = 0
}
autorun(() => {
const geometries = store.geometriesUI.geometries
store.geometriesUI.names = geometries.map((geometry, index) => {
const metadata = geometry.getState().metadata
return !!metadata && !!metadata.name ? metadata.name : `Geometry ${index}`
})
})
createGeometryRepresentationSelector(store, geometryRepresentationRow)
geometriesUIGroup.appendChild(geometryRepresentationRow)
createGeometryColorWidget(store, geometriesUIGroup)
uiContainer.appendChild(geometriesUIGroup)
store.geometriesUI.initialized = true
}
export default createGeometriesUI