units-visual.ts 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296
  1. /**
  2. * Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
  3. *
  4. * @author Alexander Rose <alexander.rose@weirdbyte.de>
  5. */
  6. import { Unit, Structure } from 'mol-model/structure';
  7. import { RepresentationProps, Visual, VisualContext } from '../representation';
  8. import { StructureMeshParams, StructurePointsParams, StructureLinesParams, StructureDirectVolumeParams } from './representation';
  9. import { Loci, isEveryLoci, EmptyLoci } from 'mol-model/loci';
  10. import { MeshRenderObject, PointsRenderObject, LinesRenderObject, DirectVolumeRenderObject } from 'mol-gl/render-object';
  11. import { createUnitsMeshRenderObject, createUnitsPointsRenderObject, createUnitsTransform, createUnitsLinesRenderObject, createUnitsDirectVolumeRenderObject, includesUnitKind } from './visual/util/common';
  12. import { deepEqual, ValueCell, UUID } from 'mol-util';
  13. import { Interval } from 'mol-data/int';
  14. import { ParamDefinition as PD } from 'mol-util/param-definition';
  15. import { RenderableValues } from 'mol-gl/renderable/schema';
  16. import { Geometry, updateRenderableState } from 'mol-geo/geometry/geometry';
  17. import { LocationIterator } from 'mol-geo/util/location-iterator';
  18. import { PickingId } from 'mol-geo/geometry/picking';
  19. import { createMarkers, MarkerAction, applyMarkerAction } from 'mol-geo/geometry/marker-data';
  20. import { createSizes } from 'mol-geo/geometry/size-data';
  21. import { createColors } from 'mol-geo/geometry/color-data';
  22. import { Mesh } from 'mol-geo/geometry/mesh/mesh';
  23. import { Points } from 'mol-geo/geometry/points/points';
  24. import { Lines } from 'mol-geo/geometry/lines/lines';
  25. import { DirectVolume } from 'mol-geo/geometry/direct-volume/direct-volume';
  26. import { VisualUpdateState } from 'mol-repr/util';
  27. import { Theme } from 'mol-theme/theme';
  28. import { ColorTheme } from 'mol-theme/color';
  29. import { SizeTheme } from 'mol-theme/size';
  30. import { UnitsParams } from './units-representation';
  31. export type StructureGroup = { structure: Structure, group: Unit.SymmetryGroup }
  32. export interface UnitsVisual<P extends RepresentationProps = {}> extends Visual<StructureGroup, P> { }
  33. type UnitsRenderObject = MeshRenderObject | LinesRenderObject | PointsRenderObject | DirectVolumeRenderObject
  34. interface UnitsVisualBuilder<P extends UnitsParams, G extends Geometry> {
  35. defaultProps: PD.Values<P>
  36. createGeometry(ctx: VisualContext, unit: Unit, structure: Structure, theme: Theme, props: PD.Values<P>, geometry?: G): Promise<G>
  37. createLocationIterator(group: Unit.SymmetryGroup): LocationIterator
  38. getLoci(pickingId: PickingId, structureGroup: StructureGroup, id: number): Loci
  39. mark(loci: Loci, structureGroup: StructureGroup, apply: (interval: Interval) => boolean): boolean
  40. setUpdateState(state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme): void
  41. }
  42. interface UnitsVisualGeometryBuilder<P extends UnitsParams, G extends Geometry> extends UnitsVisualBuilder<P, G> {
  43. createEmptyGeometry(geometry?: G): G
  44. createRenderObject(ctx: VisualContext, group: Unit.SymmetryGroup, geometry: Geometry, locationIt: LocationIterator, theme: Theme, currentProps: PD.Values<P>): Promise<UnitsRenderObject>
  45. updateValues(values: RenderableValues, geometry: Geometry, newProps: PD.Values<P>): void
  46. }
  47. export function UnitsVisual<P extends UnitsParams>(builder: UnitsVisualGeometryBuilder<P, Geometry>): UnitsVisual<P> {
  48. const { defaultProps, createGeometry, createLocationIterator, getLoci, mark, setUpdateState } = builder
  49. const { createEmptyGeometry, createRenderObject, updateValues } = builder
  50. const updateState = VisualUpdateState.create()
  51. let renderObject: UnitsRenderObject | undefined
  52. let currentProps: PD.Values<P>
  53. let currentTheme: Theme
  54. let geometry: Geometry
  55. let currentGroup: Unit.SymmetryGroup
  56. let currentStructure: Structure
  57. let locationIt: LocationIterator
  58. let currentConformationId: UUID
  59. async function create(ctx: VisualContext, group: Unit.SymmetryGroup, theme: Theme, props: Partial<PD.Values<P>> = {}) {
  60. currentProps = Object.assign({}, defaultProps, props, { structure: currentStructure })
  61. currentTheme = theme
  62. currentGroup = group
  63. const unit = group.units[0]
  64. currentConformationId = Unit.conformationId(unit)
  65. geometry = includesUnitKind(currentProps.unitKinds, unit)
  66. ? await createGeometry(ctx, unit, currentStructure, theme, currentProps, geometry)
  67. : createEmptyGeometry(geometry)
  68. // TODO create empty location iterator when not in unitKinds
  69. locationIt = createLocationIterator(group)
  70. renderObject = await createRenderObject(ctx, group, geometry, locationIt, theme, currentProps)
  71. }
  72. async function update(ctx: VisualContext, group: Unit.SymmetryGroup, theme: Theme, props: Partial<PD.Values<P>> = {}) {
  73. if (!renderObject) return
  74. const newProps = Object.assign({}, currentProps, props, { structure: currentStructure })
  75. const unit = group.units[0]
  76. locationIt.reset()
  77. VisualUpdateState.reset(updateState)
  78. setUpdateState(updateState, newProps, currentProps, theme, currentTheme)
  79. if (ColorTheme.areEqual(theme.color, currentTheme.color)) updateState.updateColor = true
  80. if (!deepEqual(newProps.unitKinds, currentProps.unitKinds)) updateState.createGeometry = true
  81. if (group.transformHash !== currentGroup.transformHash) {
  82. if (group.units.length !== currentGroup.units.length || updateState.updateColor) {
  83. updateState.updateTransform = true
  84. } else {
  85. updateState.updateMatrix = true
  86. }
  87. }
  88. // check if the conformation of unit.model has changed
  89. const newConformationId = Unit.conformationId(unit)
  90. if (newConformationId !== currentConformationId) {
  91. currentConformationId = newConformationId
  92. updateState.createGeometry = true
  93. }
  94. //
  95. if (updateState.updateTransform) {
  96. locationIt = createLocationIterator(group)
  97. const { instanceCount, groupCount } = locationIt
  98. createMarkers(instanceCount * groupCount, renderObject.values)
  99. updateState.updateColor = true
  100. updateState.updateMatrix = true
  101. }
  102. if (updateState.updateMatrix) {
  103. createUnitsTransform(group, renderObject.values)
  104. }
  105. if (updateState.createGeometry) {
  106. geometry = includesUnitKind(newProps.unitKinds, unit)
  107. ? await createGeometry(ctx, unit, currentStructure, theme, newProps, geometry)
  108. : createEmptyGeometry(geometry)
  109. ValueCell.update(renderObject.values.drawCount, Geometry.getDrawCount(geometry))
  110. updateState.updateColor = true
  111. }
  112. if (updateState.updateSize) {
  113. // not all geometries have size data, so check here
  114. if ('uSize' in renderObject.values) {
  115. await createSizes(ctx.runtime, locationIt, theme.size, renderObject.values)
  116. }
  117. }
  118. if (updateState.updateColor) {
  119. await createColors(ctx.runtime, locationIt, theme.color, renderObject.values)
  120. }
  121. updateValues(renderObject.values, geometry, newProps)
  122. updateRenderableState(renderObject.state, newProps)
  123. currentProps = newProps
  124. currentTheme = theme
  125. currentGroup = group
  126. }
  127. return {
  128. get groupCount() { return locationIt ? locationIt.count : 0 },
  129. get renderObject () { return renderObject },
  130. async createOrUpdate(ctx: VisualContext, theme: Theme, props: Partial<PD.Values<P>> = {}, structureGroup?: StructureGroup) {
  131. if (structureGroup) currentStructure = structureGroup.structure
  132. const group = structureGroup ? structureGroup.group : undefined
  133. if (!group && !currentGroup) {
  134. throw new Error('missing group')
  135. } else if (group && (!currentGroup || !renderObject)) {
  136. // console.log('unit-visual first create')
  137. await create(ctx, group, theme, props)
  138. } else if (group && group.hashCode !== currentGroup.hashCode) {
  139. // console.log('unit-visual group.hashCode !== currentGroup.hashCode')
  140. await create(ctx, group, theme, props)
  141. } else {
  142. // console.log('unit-visual update')
  143. await update(ctx, group || currentGroup, theme, props)
  144. }
  145. },
  146. getLoci(pickingId: PickingId) {
  147. return renderObject ? getLoci(pickingId, { structure: currentStructure, group: currentGroup }, renderObject.id) : EmptyLoci
  148. },
  149. mark(loci: Loci, action: MarkerAction) {
  150. if (!renderObject) return false
  151. const { tMarker } = renderObject.values
  152. const { groupCount, instanceCount } = locationIt
  153. function apply(interval: Interval) {
  154. const start = Interval.start(interval)
  155. const end = Interval.end(interval)
  156. return applyMarkerAction(tMarker.ref.value.array, start, end, action)
  157. }
  158. let changed = false
  159. if (isEveryLoci(loci) || (Structure.isLoci(loci) && loci.structure === currentStructure)) {
  160. changed = apply(Interval.ofBounds(0, groupCount * instanceCount))
  161. } else {
  162. changed = mark(loci, { structure: currentStructure, group: currentGroup }, apply)
  163. }
  164. if (changed) {
  165. ValueCell.update(tMarker, tMarker.ref.value)
  166. }
  167. return changed
  168. },
  169. setVisibility(value: boolean) {
  170. if (renderObject) renderObject.state.visible = value
  171. },
  172. setPickable(value: boolean) {
  173. if (renderObject) renderObject.state.pickable = value
  174. },
  175. destroy() {
  176. // TODO
  177. renderObject = undefined
  178. }
  179. }
  180. }
  181. // mesh
  182. export const UnitsMeshParams = {
  183. ...StructureMeshParams,
  184. ...UnitsParams,
  185. }
  186. export type UnitsMeshParams = typeof UnitsMeshParams
  187. export interface UnitsMeshVisualBuilder<P extends UnitsMeshParams> extends UnitsVisualBuilder<P, Mesh> { }
  188. export function UnitsMeshVisual<P extends UnitsMeshParams>(builder: UnitsMeshVisualBuilder<P>): UnitsVisual<P> {
  189. return UnitsVisual({
  190. ...builder,
  191. setUpdateState: (state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme) => {
  192. builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme)
  193. if (!SizeTheme.areEqual(newTheme.size, currentTheme.size)) state.createGeometry = true
  194. },
  195. createEmptyGeometry: Mesh.createEmpty,
  196. createRenderObject: createUnitsMeshRenderObject,
  197. updateValues: Mesh.updateValues
  198. })
  199. }
  200. // points
  201. export const UnitsPointsParams = {
  202. ...StructurePointsParams,
  203. ...UnitsParams,
  204. }
  205. export type UnitsPointsParams = typeof UnitsPointsParams
  206. export interface UnitsPointVisualBuilder<P extends UnitsPointsParams> extends UnitsVisualBuilder<P, Points> { }
  207. export function UnitsPointsVisual<P extends UnitsPointsParams>(builder: UnitsPointVisualBuilder<P>): UnitsVisual<P> {
  208. return UnitsVisual({
  209. ...builder,
  210. createEmptyGeometry: Points.createEmpty,
  211. createRenderObject: createUnitsPointsRenderObject,
  212. setUpdateState: (state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme) => {
  213. builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme)
  214. if (!SizeTheme.areEqual(newTheme.size, currentTheme.size)) state.updateSize = true
  215. },
  216. updateValues: Points.updateValues
  217. })
  218. }
  219. // lines
  220. export const UnitsLinesParams = {
  221. ...StructureLinesParams,
  222. ...UnitsParams,
  223. }
  224. export type UnitsLinesParams = typeof UnitsLinesParams
  225. export interface UnitsLinesVisualBuilder<P extends UnitsLinesParams> extends UnitsVisualBuilder<P, Lines> { }
  226. export function UnitsLinesVisual<P extends UnitsLinesParams>(builder: UnitsLinesVisualBuilder<P>): UnitsVisual<P> {
  227. return UnitsVisual({
  228. ...builder,
  229. createEmptyGeometry: Lines.createEmpty,
  230. createRenderObject: createUnitsLinesRenderObject,
  231. setUpdateState: (state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme) => {
  232. builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme)
  233. if (!SizeTheme.areEqual(newTheme.size, currentTheme.size)) state.updateSize = true
  234. },
  235. updateValues: Lines.updateValues
  236. })
  237. }
  238. // direct-volume
  239. export const UnitsDirectVolumeParams = {
  240. ...StructureDirectVolumeParams,
  241. ...UnitsParams,
  242. }
  243. export type UnitsDirectVolumeParams = typeof UnitsDirectVolumeParams
  244. export interface UnitsDirectVolumeVisualBuilder<P extends UnitsDirectVolumeParams> extends UnitsVisualBuilder<P, DirectVolume> { }
  245. export function UnitsDirectVolumeVisual<P extends UnitsDirectVolumeParams>(builder: UnitsDirectVolumeVisualBuilder<P>): UnitsVisual<P> {
  246. return UnitsVisual({
  247. ...builder,
  248. createEmptyGeometry: DirectVolume.createEmpty,
  249. createRenderObject: createUnitsDirectVolumeRenderObject,
  250. setUpdateState: (state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme) => {
  251. builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme)
  252. if (!SizeTheme.areEqual(newTheme.size, currentTheme.size)) state.createGeometry = true
  253. },
  254. updateValues: DirectVolume.updateValues
  255. })
  256. }