complex-visual.ts 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199
  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 { Structure } from 'mol-model/structure';
  7. import { Visual, VisualContext } from '../representation';
  8. import { MeshRenderObject, LinesRenderObject, PointsRenderObject, DirectVolumeRenderObject } from 'mol-gl/render-object';
  9. import { createComplexMeshRenderObject, UnitKind, UnitKindOptions } from './visual/util/common';
  10. import { StructureMeshParams, StructureParams } from './representation';
  11. import { deepEqual, ValueCell } from 'mol-util';
  12. import { Loci, isEveryLoci, EmptyLoci } from 'mol-model/loci';
  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 { createSizes } from 'mol-geo/geometry/size-data';
  17. import { Geometry, updateRenderableState } from 'mol-geo/geometry/geometry';
  18. import { LocationIterator } from 'mol-geo/util/location-iterator';
  19. import { PickingId } from 'mol-geo/geometry/picking';
  20. import { createColors } from 'mol-geo/geometry/color-data';
  21. import { MarkerAction, applyMarkerAction } from 'mol-geo/geometry/marker-data';
  22. import { Mesh } from 'mol-geo/geometry/mesh/mesh';
  23. import { VisualUpdateState } from 'mol-repr/util';
  24. import { Theme } from 'mol-theme/theme';
  25. import { ColorTheme } from 'mol-theme/color';
  26. import { SizeTheme } from 'mol-theme/size';
  27. export interface ComplexVisual<P extends StructureParams> extends Visual<Structure, P> { }
  28. const ComplexParams = {
  29. ...StructureParams,
  30. unitKinds: PD.MultiSelect<UnitKind>(['atomic', 'spheres'], UnitKindOptions),
  31. }
  32. type ComplexParams = typeof ComplexParams
  33. type ComplexRenderObject = MeshRenderObject | LinesRenderObject | PointsRenderObject | DirectVolumeRenderObject
  34. interface ComplexVisualBuilder<P extends ComplexParams, G extends Geometry> {
  35. defaultProps: PD.Values<P>
  36. createGeometry(ctx: VisualContext, structure: Structure, theme: Theme, props: PD.Values<P>, geometry?: G): Promise<G>
  37. createLocationIterator(structure: Structure): LocationIterator
  38. getLoci(pickingId: PickingId, structure: Structure, id: number): Loci
  39. mark(loci: Loci, structure: Structure, 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 ComplexVisualGeometryBuilder<P extends ComplexParams, G extends Geometry> extends ComplexVisualBuilder<P, G> {
  43. createEmptyGeometry(geometry?: G): G
  44. createRenderObject(ctx: VisualContext, structure: Structure, geometry: Geometry, locationIt: LocationIterator, theme: Theme, currentProps: PD.Values<P>): Promise<ComplexRenderObject>
  45. updateValues(values: RenderableValues, newProps: PD.Values<P>): void
  46. }
  47. export function ComplexVisual<P extends ComplexParams>(builder: ComplexVisualGeometryBuilder<P, Geometry>): ComplexVisual<P> {
  48. const { defaultProps, createGeometry, createLocationIterator, getLoci, mark, setUpdateState } = builder
  49. const { createRenderObject, updateValues } = builder
  50. const updateState = VisualUpdateState.create()
  51. let renderObject: ComplexRenderObject | undefined
  52. let currentProps: PD.Values<P>
  53. let currentTheme: Theme
  54. let geometry: Geometry
  55. let currentStructure: Structure
  56. let locationIt: LocationIterator
  57. let conformationHash: number
  58. async function create(ctx: VisualContext, structure: Structure, theme: Theme, props: Partial<PD.Values<P>> = {}) {
  59. currentProps = Object.assign({}, defaultProps, props)
  60. currentTheme = theme
  61. currentStructure = structure
  62. conformationHash = Structure.conformationHash(currentStructure)
  63. geometry = await createGeometry(ctx, currentStructure, theme, currentProps, geometry)
  64. locationIt = createLocationIterator(structure)
  65. renderObject = await createRenderObject(ctx, structure, geometry, locationIt, theme, currentProps)
  66. }
  67. async function update(ctx: VisualContext, theme: Theme, props: Partial<PD.Values<P>>) {
  68. const newProps = Object.assign({}, currentProps, props, { structure: currentStructure })
  69. if (!renderObject) return false
  70. locationIt.reset()
  71. VisualUpdateState.reset(updateState)
  72. setUpdateState(updateState, newProps, currentProps, theme, currentTheme)
  73. const newConformationHash = Structure.conformationHash(currentStructure)
  74. if (newConformationHash !== conformationHash) {
  75. conformationHash = newConformationHash
  76. updateState.createGeometry = true
  77. }
  78. if (ColorTheme.areEqual(theme.color, currentTheme.color)) updateState.updateColor = true
  79. if (!deepEqual(newProps.unitKinds, currentProps.unitKinds)) updateState.createGeometry = true
  80. //
  81. if (updateState.createGeometry) {
  82. geometry = await createGeometry(ctx, currentStructure, theme, newProps, geometry)
  83. ValueCell.update(renderObject.values.drawCount, Geometry.getDrawCount(geometry))
  84. updateState.updateColor = true
  85. }
  86. if (updateState.updateSize) {
  87. // not all geometries have size data, so check here
  88. if ('uSize' in renderObject.values) {
  89. await createSizes(ctx.runtime, locationIt, theme.size, renderObject.values)
  90. }
  91. }
  92. if (updateState.updateColor) {
  93. await createColors(ctx.runtime, locationIt, theme.color, renderObject.values)
  94. }
  95. updateValues(renderObject.values, newProps)
  96. updateRenderableState(renderObject.state, newProps)
  97. currentProps = newProps
  98. currentTheme = theme
  99. return true
  100. }
  101. return {
  102. get renderObject () { return renderObject },
  103. async createOrUpdate(ctx: VisualContext, theme: Theme, props: Partial<PD.Values<P>> = {}, structure?: Structure) {
  104. if (!structure && !currentStructure) {
  105. throw new Error('missing structure')
  106. } else if (structure && (!currentStructure || !renderObject)) {
  107. await create(ctx, structure, theme, props)
  108. } else if (structure && structure.hashCode !== currentStructure.hashCode) {
  109. await create(ctx, structure, theme, props)
  110. } else {
  111. if (structure && Structure.conformationHash(structure) !== Structure.conformationHash(currentStructure)) {
  112. currentStructure = structure
  113. }
  114. await update(ctx, theme, props)
  115. }
  116. },
  117. getLoci(pickingId: PickingId) {
  118. return renderObject ? getLoci(pickingId, currentStructure, renderObject.id) : EmptyLoci
  119. },
  120. mark(loci: Loci, action: MarkerAction) {
  121. if (!renderObject) return false
  122. const { tMarker } = renderObject.values
  123. const { groupCount, instanceCount } = locationIt
  124. function apply(interval: Interval) {
  125. const start = Interval.start(interval)
  126. const end = Interval.end(interval)
  127. return applyMarkerAction(tMarker.ref.value.array, start, end, action)
  128. }
  129. let changed = false
  130. if (isEveryLoci(loci)) {
  131. changed = apply(Interval.ofBounds(0, groupCount * instanceCount))
  132. } else {
  133. changed = mark(loci, currentStructure, apply)
  134. }
  135. if (changed) {
  136. ValueCell.update(tMarker, tMarker.ref.value)
  137. }
  138. return changed
  139. },
  140. setVisibility(value: boolean) {
  141. if (renderObject) renderObject.state.visible = value
  142. },
  143. setPickable(value: boolean) {
  144. if (renderObject) renderObject.state.pickable = value
  145. },
  146. destroy() {
  147. // TODO
  148. renderObject = undefined
  149. }
  150. }
  151. }
  152. // mesh
  153. export const ComplexMeshParams = {
  154. ...StructureMeshParams,
  155. unitKinds: PD.MultiSelect<UnitKind>([ 'atomic', 'spheres' ], UnitKindOptions),
  156. }
  157. export type ComplexMeshParams = typeof ComplexMeshParams
  158. export interface ComplexMeshVisualBuilder<P extends ComplexMeshParams> extends ComplexVisualBuilder<P, Mesh> { }
  159. export function ComplexMeshVisual<P extends ComplexMeshParams>(builder: ComplexMeshVisualBuilder<P>): ComplexVisual<P> {
  160. return ComplexVisual({
  161. ...builder,
  162. setUpdateState: (state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme) => {
  163. builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme)
  164. if (!SizeTheme.areEqual(newTheme.size, currentTheme.size)) state.createGeometry = true
  165. },
  166. createEmptyGeometry: Mesh.createEmpty,
  167. createRenderObject: createComplexMeshRenderObject,
  168. updateValues: Mesh.updateValues
  169. })
  170. }