molstar
Version:
A comprehensive macromolecular library.
443 lines (442 loc) • 23.8 kB
JavaScript
/**
* Copyright (c) 2018-2022 mol* contributors, licensed under MIT, See LICENSE file for more info.
*
* @author Alexander Rose <alexander.rose@weirdbyte.de>
*/
import { __assign } from "tslib";
import { Structure, Unit, StructureElement, Bond } from '../../mol-model/structure';
import { Visual } from '../visual';
import { Geometry } from '../../mol-geo/geometry/geometry';
import { Theme } from '../../mol-theme/theme';
import { createUnitsTransform, includesUnitKind } from './visual/util/common';
import { createRenderObject } from '../../mol-gl/render-object';
import { isEveryLoci, EmptyLoci } from '../../mol-model/loci';
import { Interval } from '../../mol-data/int';
import { VisualUpdateState } from '../util';
import { ColorTheme } from '../../mol-theme/color';
import { createMarkers } from '../../mol-geo/geometry/marker-data';
import { MarkerAction } from '../../mol-util/marker-action';
import { ValueCell, deepEqual } from '../../mol-util';
import { createSizes } from '../../mol-geo/geometry/size-data';
import { createColors } from '../../mol-geo/geometry/color-data';
import { Mesh } from '../../mol-geo/geometry/mesh/mesh';
import { SizeTheme } from '../../mol-theme/size';
import { Spheres } from '../../mol-geo/geometry/spheres/spheres';
import { Cylinders } from '../../mol-geo/geometry/cylinders/cylinders';
import { Points } from '../../mol-geo/geometry/points/points';
import { Lines } from '../../mol-geo/geometry/lines/lines';
import { Text } from '../../mol-geo/geometry/text/text';
import { DirectVolume } from '../../mol-geo/geometry/direct-volume/direct-volume';
import { TextureMesh } from '../../mol-geo/geometry/texture-mesh/texture-mesh';
import { StructureParams, StructureMeshParams, StructureSpheresParams, StructurePointsParams, StructureLinesParams, StructureTextParams, StructureDirectVolumeParams, StructureTextureMeshParams, StructureCylindersParams } from './params';
import { isPromiseLike } from '../../mol-util/type-helpers';
function createUnitsRenderObject(structureGroup, geometry, locationIt, theme, props, materialId) {
var _a = Geometry.getUtils(geometry), createValues = _a.createValues, createRenderableState = _a.createRenderableState;
var transform = createUnitsTransform(structureGroup, props.includeParent);
var values = createValues(geometry, transform, locationIt, theme, props);
var state = createRenderableState(props);
return createRenderObject(geometry.kind, values, state, materialId);
}
export function UnitsVisual(builder, materialId) {
var defaultProps = builder.defaultProps, createGeometry = builder.createGeometry, createLocationIterator = builder.createLocationIterator, getLoci = builder.getLoci, eachLocation = builder.eachLocation, setUpdateState = builder.setUpdateState, mustRecreate = builder.mustRecreate, processValues = builder.processValues, dispose = builder.dispose;
var _a = builder.geometryUtils, createEmptyGeometry = _a.createEmpty, updateValues = _a.updateValues, updateBoundingSphere = _a.updateBoundingSphere, updateRenderableState = _a.updateRenderableState, createPositionIterator = _a.createPositionIterator;
var updateState = VisualUpdateState.create();
var previousMark = { loci: EmptyLoci, action: MarkerAction.None, status: -1 };
var renderObject;
var newProps = Object.assign({}, defaultProps);
var newTheme = Theme.createEmpty();
var newStructureGroup;
var currentProps;
var currentTheme;
var currentStructureGroup;
var geometry;
var geometryVersion = -1;
var locationIt;
var positionIt;
function prepareUpdate(theme, props, structureGroup) {
if (!structureGroup && !currentStructureGroup) {
throw new Error('missing structureGroup');
}
newProps = props;
newTheme = theme;
newStructureGroup = structureGroup;
VisualUpdateState.reset(updateState);
if (!renderObject || !currentStructureGroup) {
// console.log('create new');
updateState.createNew = true;
updateState.createGeometry = true;
return;
}
setUpdateState(updateState, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup);
if (!Structure.areHierarchiesEqual(currentStructureGroup.structure, newStructureGroup.structure)) {
// console.log('new hierarchy');
updateState.updateTransform = true;
updateState.updateColor = true;
updateState.updateSize = true;
}
if (!ColorTheme.areEqual(newTheme.color, currentTheme.color)) {
// console.log('new colorTheme');
updateState.updateColor = true;
}
if (currentStructureGroup.structure.child !== newStructureGroup.structure.child) {
// console.log('new child');
updateState.createGeometry = true;
}
if (newProps.instanceGranularity !== currentProps.instanceGranularity) {
updateState.updateTransform = true;
}
if (!deepEqual(newProps.unitKinds, currentProps.unitKinds)) {
// console.log('new unitKinds');
updateState.createGeometry = true;
}
if (newStructureGroup.group.transformHash !== currentStructureGroup.group.transformHash) {
// console.log('new transformHash');
if (newStructureGroup.group.units.length !== currentStructureGroup.group.units.length || updateState.updateColor) {
updateState.updateTransform = true;
}
else {
updateState.updateMatrix = true;
}
}
// check if the operator or conformation of unit has changed
var newUnit = newStructureGroup.group.units[0];
var currentUnit = currentStructureGroup.group.units[0];
if (!Unit.areOperatorsEqual(newUnit, currentUnit)) {
// console.log('new operators');
updateState.updateTransform = true;
}
if (!Unit.areConformationsEqual(newUnit, currentUnit)) {
// console.log('new conformation');
updateState.createGeometry = true;
}
if (updateState.updateTransform) {
updateState.updateMatrix = true;
}
if (updateState.updateSize && !('uSize' in renderObject.values)) {
updateState.createGeometry = true;
}
if (updateState.createGeometry || updateState.updateTransform) {
if (currentStructureGroup.structure.hashCode !== newStructureGroup.structure.hashCode) {
// console.log('new hashCode');
updateState.updateColor = true;
updateState.updateSize = true;
}
if (newTheme.color.granularity.startsWith('vertex') ||
renderObject.values.dColorType.ref.value.startsWith('vertex') ||
newTheme.color.granularity.startsWith('volume') ||
renderObject.values.dColorType.ref.value.startsWith('volume')) {
updateState.updateColor = true;
}
}
}
function update(newGeometry) {
if (updateState.createNew) {
locationIt = createLocationIterator(newStructureGroup);
if (newGeometry) {
renderObject = createUnitsRenderObject(newStructureGroup, newGeometry, locationIt, newTheme, newProps, materialId);
positionIt = createPositionIterator(newGeometry, renderObject.values);
}
else {
throw new Error('expected geometry to be given');
}
}
else {
if (!renderObject) {
throw new Error('expected renderObject to be available');
}
if (updateState.updateTransform) {
// console.log('update transform');
locationIt = createLocationIterator(newStructureGroup);
var instanceCount = locationIt.instanceCount, groupCount = locationIt.groupCount;
if (newProps.instanceGranularity) {
createMarkers(instanceCount, 'instance', renderObject.values);
}
else {
createMarkers(instanceCount * groupCount, 'groupInstance', renderObject.values);
}
}
if (updateState.updateMatrix) {
// console.log('update matrix');
createUnitsTransform(newStructureGroup, newProps.includeParent, renderObject.values);
}
if (updateState.createGeometry) {
// console.log('update geometry');
if (newGeometry) {
ValueCell.updateIfChanged(renderObject.values.drawCount, Geometry.getDrawCount(newGeometry));
ValueCell.updateIfChanged(renderObject.values.uVertexCount, Geometry.getVertexCount(newGeometry));
ValueCell.updateIfChanged(renderObject.values.uGroupCount, Geometry.getGroupCount(newGeometry));
}
else {
throw new Error('expected geometry to be given');
}
}
if (updateState.updateTransform || updateState.createGeometry) {
updateBoundingSphere(renderObject.values, newGeometry || geometry);
positionIt = createPositionIterator(newGeometry || geometry, renderObject.values);
}
if (updateState.updateSize) {
// not all geometries have size data, so check here
if ('uSize' in renderObject.values) {
// console.log('update size');
createSizes(locationIt, newTheme.size, renderObject.values);
}
}
if (updateState.updateColor) {
// console.log('update color');
createColors(locationIt, positionIt, newTheme.color, renderObject.values);
}
updateValues(renderObject.values, newProps);
updateRenderableState(renderObject.state, newProps);
}
currentProps = newProps;
currentTheme = newTheme;
currentStructureGroup = newStructureGroup;
if (newGeometry) {
geometry = newGeometry;
geometryVersion += 1;
}
}
function _createGeometry(ctx, unit, structure, theme, props, geometry) {
return includesUnitKind(props.unitKinds, unit)
? createGeometry(ctx, unit, structure, theme, props, geometry)
: createEmptyGeometry(geometry);
}
function lociIsSuperset(loci) {
if (isEveryLoci(loci))
return true;
if (Structure.isLoci(loci) && Structure.areRootsEquivalent(loci.structure, currentStructureGroup.structure))
return true;
if (StructureElement.Loci.is(loci) && Structure.areRootsEquivalent(loci.structure, currentStructureGroup.structure)) {
if (StructureElement.Loci.isWholeStructure(loci))
return true;
}
return false;
}
function eachInstance(loci, structureGroup, apply) {
var changed = false;
if (Bond.isLoci(loci)) {
var structure = structureGroup.structure, group = structureGroup.group;
if (!Structure.areEquivalent(loci.structure, structure))
return false;
for (var _i = 0, _a = loci.bonds; _i < _a.length; _i++) {
var b = _a[_i];
if (b.aUnit !== b.bUnit)
continue;
var unitIdx = group.unitIndexMap.get(b.aUnit.id);
if (unitIdx !== undefined) {
if (apply(Interval.ofSingleton(unitIdx)))
changed = true;
}
}
}
else if (StructureElement.Loci.is(loci)) {
var structure = structureGroup.structure, group = structureGroup.group;
if (!Structure.areEquivalent(loci.structure, structure))
return false;
for (var _b = 0, _c = loci.elements; _b < _c.length; _b++) {
var e = _c[_b];
var unitIdx = group.unitIndexMap.get(e.unit.id);
if (unitIdx !== undefined) {
if (apply(Interval.ofSingleton(unitIdx)))
changed = true;
}
}
}
return changed;
}
function lociApply(loci, apply, isMarking) {
if (lociIsSuperset(loci)) {
if (currentProps.instanceGranularity) {
return apply(Interval.ofBounds(0, locationIt.instanceCount));
}
else {
return apply(Interval.ofBounds(0, locationIt.groupCount * locationIt.instanceCount));
}
}
else {
if (currentProps.instanceGranularity) {
return eachInstance(loci, currentStructureGroup, apply);
}
else {
return eachLocation(loci, currentStructureGroup, apply, isMarking);
}
}
}
function finalize(ctx) {
if (renderObject) {
processValues === null || processValues === void 0 ? void 0 : processValues(renderObject.values, geometry, currentProps, currentTheme, ctx.webgl);
}
}
return {
get groupCount() { return locationIt ? locationIt.count : 0; },
get renderObject() { return locationIt && locationIt.count ? renderObject : undefined; },
get geometryVersion() { return geometryVersion; },
createOrUpdate: function (ctx, theme, props, structureGroup) {
prepareUpdate(theme, props, structureGroup || currentStructureGroup);
if (updateState.createGeometry) {
var newGeometry = _createGeometry(ctx, newStructureGroup.group.units[0], newStructureGroup.structure, newTheme, newProps, geometry);
if (isPromiseLike(newGeometry)) {
return newGeometry.then(function (g) {
update(g);
finalize(ctx);
});
}
update(newGeometry);
}
else {
update();
}
finalize(ctx);
},
getLoci: function (pickingId) {
return renderObject ? getLoci(pickingId, currentStructureGroup, renderObject.id) : EmptyLoci;
},
mark: function (loci, action) {
var hasInvariantId = true;
if (StructureElement.Loci.is(loci)) {
hasInvariantId = false;
var invariantId = currentStructureGroup.group.units[0].invariantId;
for (var _i = 0, _a = loci.elements; _i < _a.length; _i++) {
var e = _a[_i];
if (e.unit.invariantId === invariantId) {
hasInvariantId = true;
break;
}
}
}
return hasInvariantId ? Visual.mark(renderObject, loci, action, lociApply, previousMark) : false;
},
setVisibility: function (visible) {
Visual.setVisibility(renderObject, visible);
},
setAlphaFactor: function (alphaFactor) {
Visual.setAlphaFactor(renderObject, alphaFactor);
},
setPickable: function (pickable) {
Visual.setPickable(renderObject, pickable);
},
setColorOnly: function (colorOnly) {
Visual.setColorOnly(renderObject, colorOnly);
},
setTransform: function (matrix, instanceMatrices) {
Visual.setTransform(renderObject, matrix, instanceMatrices);
},
setOverpaint: function (overpaint, webgl) {
var smoothing = { geometry: geometry, props: currentProps, webgl: webgl };
Visual.setOverpaint(renderObject, overpaint, lociApply, true, smoothing);
},
setTransparency: function (transparency, webgl) {
var smoothing = { geometry: geometry, props: currentProps, webgl: webgl };
Visual.setTransparency(renderObject, transparency, lociApply, true, smoothing);
},
setSubstance: function (substance, webgl) {
var smoothing = { geometry: geometry, props: currentProps, webgl: webgl };
Visual.setSubstance(renderObject, substance, lociApply, true, smoothing);
},
setClipping: function (clipping) {
Visual.setClipping(renderObject, clipping, lociApply, true);
},
destroy: function () {
dispose === null || dispose === void 0 ? void 0 : dispose(geometry);
if (renderObject) {
renderObject.state.disposed = true;
renderObject = undefined;
}
},
mustRecreate: mustRecreate
};
}
// mesh
export var UnitsMeshParams = __assign(__assign({}, StructureMeshParams), StructureParams);
export function UnitsMeshVisual(builder, materialId) {
return UnitsVisual(__assign(__assign({}, builder), { setUpdateState: function (state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup) {
builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup);
if (!SizeTheme.areEqual(newTheme.size, currentTheme.size))
state.createGeometry = true;
}, geometryUtils: Mesh.Utils }), materialId);
}
// spheres
export var UnitsSpheresParams = __assign(__assign({}, StructureSpheresParams), StructureParams);
export function UnitsSpheresVisual(builder, materialId) {
return UnitsVisual(__assign(__assign({}, builder), { setUpdateState: function (state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup) {
builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup);
if (!SizeTheme.areEqual(newTheme.size, currentTheme.size))
state.updateSize = true;
}, geometryUtils: Spheres.Utils }), materialId);
}
// cylinders
export var UnitsCylindersParams = __assign(__assign({}, StructureCylindersParams), StructureParams);
export function UnitsCylindersVisual(builder, materialId) {
return UnitsVisual(__assign(__assign({}, builder), { setUpdateState: function (state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup) {
builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup);
if (!SizeTheme.areEqual(newTheme.size, currentTheme.size))
state.updateSize = true;
}, geometryUtils: Cylinders.Utils }), materialId);
}
// points
export var UnitsPointsParams = __assign(__assign({}, StructurePointsParams), StructureParams);
export function UnitsPointsVisual(builder, materialId) {
return UnitsVisual(__assign(__assign({}, builder), { setUpdateState: function (state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup) {
builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup);
if (!SizeTheme.areEqual(newTheme.size, currentTheme.size))
state.updateSize = true;
}, geometryUtils: Points.Utils }), materialId);
}
// lines
export var UnitsLinesParams = __assign(__assign({}, StructureLinesParams), StructureParams);
export function UnitsLinesVisual(builder, materialId) {
return UnitsVisual(__assign(__assign({}, builder), { setUpdateState: function (state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup) {
builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup);
if (!SizeTheme.areEqual(newTheme.size, currentTheme.size))
state.updateSize = true;
}, geometryUtils: Lines.Utils }), materialId);
}
// text
export var UnitsTextParams = __assign(__assign({}, StructureTextParams), StructureParams);
export function UnitsTextVisual(builder, materialId) {
return UnitsVisual(__assign(__assign({}, builder), { setUpdateState: function (state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup) {
builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup);
if (!SizeTheme.areEqual(newTheme.size, currentTheme.size))
state.updateSize = true;
if (newProps.background !== currentProps.background)
state.createGeometry = true;
if (newProps.backgroundMargin !== currentProps.backgroundMargin)
state.createGeometry = true;
if (newProps.tether !== currentProps.tether)
state.createGeometry = true;
if (newProps.tetherLength !== currentProps.tetherLength)
state.createGeometry = true;
if (newProps.tetherBaseWidth !== currentProps.tetherBaseWidth)
state.createGeometry = true;
if (newProps.attachment !== currentProps.attachment)
state.createGeometry = true;
if (newProps.fontFamily !== currentProps.fontFamily)
state.createGeometry = true;
if (newProps.fontQuality !== currentProps.fontQuality)
state.createGeometry = true;
if (newProps.fontStyle !== currentProps.fontStyle)
state.createGeometry = true;
if (newProps.fontVariant !== currentProps.fontVariant)
state.createGeometry = true;
if (newProps.fontWeight !== currentProps.fontWeight)
state.createGeometry = true;
}, geometryUtils: Text.Utils }), materialId);
}
// direct-volume
export var UnitsDirectVolumeParams = __assign(__assign({}, StructureDirectVolumeParams), StructureParams);
export function UnitsDirectVolumeVisual(builder, materialId) {
return UnitsVisual(__assign(__assign({}, builder), { setUpdateState: function (state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup) {
builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup);
if (!SizeTheme.areEqual(newTheme.size, currentTheme.size))
state.createGeometry = true;
}, geometryUtils: DirectVolume.Utils }), materialId);
}
// texture-mesh
export var UnitsTextureMeshParams = __assign(__assign({}, StructureTextureMeshParams), StructureParams);
export function UnitsTextureMeshVisual(builder, materialId) {
return UnitsVisual(__assign(__assign({}, builder), { setUpdateState: function (state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup) {
builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme, newStructureGroup, currentStructureGroup);
if (!SizeTheme.areEqual(newTheme.size, currentTheme.size))
state.createGeometry = true;
}, geometryUtils: TextureMesh.Utils }), materialId);
}