representation.ts 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335
  1. /**
  2. * Copyright (c) 2018-2022 mol* contributors, licensed under MIT, See LICENSE file for more info.
  3. *
  4. * @author Alexander Rose <alexander.rose@weirdbyte.de>
  5. */
  6. import { ParamDefinition as PD } from '../../mol-util/param-definition';
  7. import { Visual, VisualContext } from '../visual';
  8. import { Volume } from '../../mol-model/volume';
  9. import { Geometry, GeometryUtils } from '../../mol-geo/geometry/geometry';
  10. import { LocationIterator } from '../../mol-geo/util/location-iterator';
  11. import { Theme } from '../../mol-theme/theme';
  12. import { createIdentityTransform } from '../../mol-geo/geometry/transform-data';
  13. import { createRenderObject, getNextMaterialId, GraphicsRenderObject } from '../../mol-gl/render-object';
  14. import { PickingId } from '../../mol-geo/geometry/picking';
  15. import { Loci, isEveryLoci, EmptyLoci } from '../../mol-model/loci';
  16. import { Interval } from '../../mol-data/int';
  17. import { getQualityProps, VisualUpdateState } from '../util';
  18. import { ColorTheme } from '../../mol-theme/color';
  19. import { ValueCell } from '../../mol-util';
  20. import { createSizes } from '../../mol-geo/geometry/size-data';
  21. import { createColors } from '../../mol-geo/geometry/color-data';
  22. import { MarkerAction } from '../../mol-util/marker-action';
  23. import { Mat4 } from '../../mol-math/linear-algebra';
  24. import { Overpaint } from '../../mol-theme/overpaint';
  25. import { Transparency } from '../../mol-theme/transparency';
  26. import { Representation, RepresentationProvider, RepresentationContext, RepresentationParamsGetter } from '../representation';
  27. import { BaseGeometry } from '../../mol-geo/geometry/base';
  28. import { Subject } from 'rxjs';
  29. import { Task } from '../../mol-task';
  30. import { SizeValues } from '../../mol-gl/renderable/schema';
  31. import { Clipping } from '../../mol-theme/clipping';
  32. import { WebGLContext } from '../../mol-gl/webgl/context';
  33. import { isPromiseLike } from '../../mol-util/type-helpers';
  34. import { Substance } from '../../mol-theme/substance';
  35. export interface VolumeVisual<P extends VolumeParams> extends Visual<Volume, P> { }
  36. function createVolumeRenderObject<G extends Geometry>(volume: Volume, geometry: G, locationIt: LocationIterator, theme: Theme, props: PD.Values<Geometry.Params<G>>, materialId: number) {
  37. const { createValues, createRenderableState } = Geometry.getUtils(geometry);
  38. const transform = createIdentityTransform();
  39. const values = createValues(geometry, transform, locationIt, theme, props);
  40. const state = createRenderableState(props);
  41. return createRenderObject(geometry.kind, values, state, materialId);
  42. }
  43. interface VolumeVisualBuilder<P extends VolumeParams, G extends Geometry> {
  44. defaultProps: PD.Values<P>
  45. createGeometry(ctx: VisualContext, volume: Volume, theme: Theme, props: PD.Values<P>, geometry?: G): Promise<G> | G
  46. createLocationIterator(volume: Volume): LocationIterator
  47. getLoci(pickingId: PickingId, volume: Volume, props: PD.Values<P>, id: number): Loci
  48. eachLocation(loci: Loci, volume: Volume, props: PD.Values<P>, apply: (interval: Interval) => boolean): boolean
  49. setUpdateState(state: VisualUpdateState, volume: Volume, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme): void
  50. mustRecreate?: (volume: Volume, props: PD.Values<P>) => boolean
  51. dispose?: (geometry: G) => void
  52. }
  53. interface VolumeVisualGeometryBuilder<P extends VolumeParams, G extends Geometry> extends VolumeVisualBuilder<P, G> {
  54. geometryUtils: GeometryUtils<G>
  55. }
  56. export function VolumeVisual<G extends Geometry, P extends VolumeParams & Geometry.Params<G>>(builder: VolumeVisualGeometryBuilder<P, G>, materialId: number): VolumeVisual<P> {
  57. const { defaultProps, createGeometry, createLocationIterator, getLoci, eachLocation, setUpdateState, mustRecreate, dispose } = builder;
  58. const { updateValues, updateBoundingSphere, updateRenderableState, createPositionIterator } = builder.geometryUtils;
  59. const updateState = VisualUpdateState.create();
  60. let renderObject: GraphicsRenderObject<G['kind']> | undefined;
  61. let newProps: PD.Values<P>;
  62. let newTheme: Theme;
  63. let newVolume: Volume;
  64. let currentProps: PD.Values<P> = Object.assign({}, defaultProps);
  65. let currentTheme: Theme = Theme.createEmpty();
  66. let currentVolume: Volume;
  67. let geometry: G;
  68. let geometryVersion = -1;
  69. let locationIt: LocationIterator;
  70. let positionIt: LocationIterator;
  71. function prepareUpdate(theme: Theme, props: Partial<PD.Values<P>>, volume: Volume) {
  72. if (!volume && !currentVolume) {
  73. throw new Error('missing volume');
  74. }
  75. newProps = Object.assign({}, currentProps, props);
  76. newTheme = theme;
  77. newVolume = volume;
  78. VisualUpdateState.reset(updateState);
  79. if (!renderObject) {
  80. updateState.createNew = true;
  81. } else if (!currentVolume || !Volume.areEquivalent(newVolume, currentVolume)) {
  82. updateState.createNew = true;
  83. }
  84. if (updateState.createNew) {
  85. updateState.createGeometry = true;
  86. return;
  87. }
  88. setUpdateState(updateState, volume, newProps, currentProps, newTheme, currentTheme);
  89. if (!ColorTheme.areEqual(theme.color, currentTheme.color)) updateState.updateColor = true;
  90. if (updateState.createGeometry) {
  91. updateState.updateColor = true;
  92. }
  93. }
  94. function update(newGeometry?: G) {
  95. if (updateState.createNew) {
  96. locationIt = createLocationIterator(newVolume);
  97. if (newGeometry) {
  98. renderObject = createVolumeRenderObject(newVolume, newGeometry, locationIt, newTheme, newProps, materialId);
  99. positionIt = createPositionIterator(newGeometry, renderObject.values);
  100. } else {
  101. throw new Error('expected geometry to be given');
  102. }
  103. } else {
  104. if (!renderObject) {
  105. throw new Error('expected renderObject to be available');
  106. }
  107. locationIt.reset();
  108. if (updateState.createGeometry) {
  109. if (newGeometry) {
  110. ValueCell.updateIfChanged(renderObject.values.drawCount, Geometry.getDrawCount(newGeometry));
  111. ValueCell.updateIfChanged(renderObject.values.uVertexCount, Geometry.getVertexCount(newGeometry));
  112. ValueCell.updateIfChanged(renderObject.values.uGroupCount, Geometry.getGroupCount(newGeometry));
  113. } else {
  114. throw new Error('expected geometry to be given');
  115. }
  116. }
  117. if (updateState.updateTransform || updateState.createGeometry) {
  118. updateBoundingSphere(renderObject.values, newGeometry || geometry);
  119. positionIt = createPositionIterator(newGeometry || geometry, renderObject.values);
  120. }
  121. if (updateState.updateSize) {
  122. // not all geometries have size data, so check here
  123. if ('uSize' in renderObject.values) {
  124. createSizes(locationIt, newTheme.size, renderObject.values as SizeValues);
  125. }
  126. }
  127. if (updateState.updateColor) {
  128. createColors(locationIt, positionIt, newTheme.color, renderObject.values);
  129. }
  130. updateValues(renderObject.values, newProps);
  131. updateRenderableState(renderObject.state, newProps);
  132. }
  133. currentProps = newProps;
  134. currentTheme = newTheme;
  135. currentVolume = newVolume;
  136. if (newGeometry) {
  137. geometry = newGeometry;
  138. geometryVersion += 1;
  139. }
  140. }
  141. function lociApply(loci: Loci, apply: (interval: Interval) => boolean) {
  142. if (isEveryLoci(loci)) {
  143. return apply(Interval.ofBounds(0, locationIt.groupCount * locationIt.instanceCount));
  144. } else {
  145. return eachLocation(loci, currentVolume, currentProps, apply);
  146. }
  147. }
  148. return {
  149. get groupCount() { return locationIt ? locationIt.count : 0; },
  150. get renderObject() { return renderObject; },
  151. get geometryVersion() { return geometryVersion; },
  152. async createOrUpdate(ctx: VisualContext, theme: Theme, props: Partial<PD.Values<P>> = {}, volume?: Volume) {
  153. prepareUpdate(theme, props, volume || currentVolume);
  154. if (updateState.createGeometry) {
  155. const newGeometry = createGeometry(ctx, newVolume, newTheme, newProps, geometry);
  156. return isPromiseLike(newGeometry) ? newGeometry.then(update) : update(newGeometry);
  157. } else {
  158. update();
  159. }
  160. },
  161. getLoci(pickingId: PickingId) {
  162. return renderObject ? getLoci(pickingId, currentVolume, currentProps, renderObject.id) : EmptyLoci;
  163. },
  164. mark(loci: Loci, action: MarkerAction) {
  165. return Visual.mark(renderObject, loci, action, lociApply);
  166. },
  167. setVisibility(visible: boolean) {
  168. Visual.setVisibility(renderObject, visible);
  169. },
  170. setAlphaFactor(alphaFactor: number) {
  171. Visual.setAlphaFactor(renderObject, alphaFactor);
  172. },
  173. setPickable(pickable: boolean) {
  174. Visual.setPickable(renderObject, pickable);
  175. },
  176. setColorOnly(colorOnly: boolean) {
  177. Visual.setColorOnly(renderObject, colorOnly);
  178. },
  179. setTransform(matrix?: Mat4, instanceMatrices?: Float32Array | null) {
  180. Visual.setTransform(renderObject, matrix, instanceMatrices);
  181. },
  182. setOverpaint(overpaint: Overpaint) {
  183. return Visual.setOverpaint(renderObject, overpaint, lociApply, true);
  184. },
  185. setTransparency(transparency: Transparency) {
  186. return Visual.setTransparency(renderObject, transparency, lociApply, true);
  187. },
  188. setSubstance(substance: Substance) {
  189. return Visual.setSubstance(renderObject, substance, lociApply, true);
  190. },
  191. setClipping(clipping: Clipping) {
  192. return Visual.setClipping(renderObject, clipping, lociApply, true);
  193. },
  194. destroy() {
  195. dispose?.(geometry);
  196. if (renderObject) {
  197. renderObject.state.disposed = true;
  198. renderObject = undefined;
  199. }
  200. },
  201. mustRecreate
  202. };
  203. }
  204. export interface VolumeRepresentation<P extends VolumeParams> extends Representation<Volume, P> { }
  205. export type VolumeRepresentationProvider<P extends VolumeParams, Id extends string = string> = RepresentationProvider<Volume, P, Representation.State, Id>
  206. export function VolumeRepresentationProvider<P extends VolumeParams, Id extends string>(p: VolumeRepresentationProvider<P, Id>): VolumeRepresentationProvider<P, Id> { return p; }
  207. //
  208. export const VolumeParams = {
  209. ...BaseGeometry.Params,
  210. };
  211. export type VolumeParams = typeof VolumeParams
  212. export function VolumeRepresentation<P extends VolumeParams>(label: string, ctx: RepresentationContext, getParams: RepresentationParamsGetter<Volume, P>, visualCtor: (materialId: number, volume: Volume, props: PD.Values<P>, webgl?: WebGLContext) => VolumeVisual<P>, getLoci: (volume: Volume, props: PD.Values<P>) => Loci): VolumeRepresentation<P> {
  213. let version = 0;
  214. const { webgl } = ctx;
  215. const updated = new Subject<number>();
  216. const geometryState = new Representation.GeometryState();
  217. const materialId = getNextMaterialId();
  218. const renderObjects: GraphicsRenderObject[] = [];
  219. const _state = Representation.createState();
  220. let visual: VolumeVisual<P> | undefined;
  221. let _volume: Volume;
  222. let _params: P;
  223. let _props: PD.Values<P>;
  224. let _theme = Theme.createEmpty();
  225. function createOrUpdate(props: Partial<PD.Values<P>> = {}, volume?: Volume) {
  226. if (volume && volume !== _volume) {
  227. _params = getParams(ctx, volume);
  228. _volume = volume;
  229. if (!_props) _props = PD.getDefaultValues(_params);
  230. }
  231. const qualityProps = getQualityProps(Object.assign({}, _props, props), _volume);
  232. Object.assign(_props, props, qualityProps);
  233. return Task.create('Creating or updating VolumeRepresentation', async runtime => {
  234. if (!visual) {
  235. visual = visualCtor(materialId, _volume, _props, webgl);
  236. } else if (visual.mustRecreate?.(_volume, _props, webgl)) {
  237. visual.destroy();
  238. visual = visualCtor(materialId, _volume, _props, webgl);
  239. }
  240. const promise = visual.createOrUpdate({ webgl, runtime }, _theme, _props, volume);
  241. if (promise) await promise;
  242. // update list of renderObjects
  243. renderObjects.length = 0;
  244. if (visual && visual.renderObject) {
  245. renderObjects.push(visual.renderObject);
  246. geometryState.add(visual.renderObject.id, visual.geometryVersion);
  247. }
  248. geometryState.snapshot();
  249. // increment version
  250. updated.next(version++);
  251. });
  252. }
  253. function mark(loci: Loci, action: MarkerAction) {
  254. return visual ? visual.mark(loci, action) : false;
  255. }
  256. function setState(state: Partial<Representation.State>) {
  257. if (state.visible !== undefined && visual) visual.setVisibility(state.visible);
  258. if (state.alphaFactor !== undefined && visual) visual.setAlphaFactor(state.alphaFactor);
  259. if (state.pickable !== undefined && visual) visual.setPickable(state.pickable);
  260. if (state.overpaint !== undefined && visual) visual.setOverpaint(state.overpaint);
  261. if (state.transparency !== undefined && visual) visual.setTransparency(state.transparency);
  262. if (state.transform !== undefined && visual) visual.setTransform(state.transform);
  263. Representation.updateState(_state, state);
  264. }
  265. function setTheme(theme: Theme) {
  266. _theme = theme;
  267. }
  268. function destroy() {
  269. if (visual) visual.destroy();
  270. }
  271. return {
  272. label,
  273. get groupCount() {
  274. return visual ? visual.groupCount : 0;
  275. },
  276. get props() { return _props; },
  277. get params() { return _params; },
  278. get state() { return _state; },
  279. get theme() { return _theme; },
  280. get geometryVersion() { return geometryState.version; },
  281. renderObjects,
  282. updated,
  283. createOrUpdate,
  284. setState,
  285. setTheme,
  286. getLoci: (pickingId?: PickingId): Loci => {
  287. if (pickingId === undefined) return getLoci(_volume, _props);
  288. return visual ? visual.getLoci(pickingId) : EmptyLoci;
  289. },
  290. mark,
  291. destroy
  292. };
  293. }