Skip to content
Snippets Groups Projects
units-visual.ts 16.9 KiB
Newer Older
/**
 * Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
 *
 * @author Alexander Rose <alexander.rose@weirdbyte.de>
 */

Alexander Rose's avatar
Alexander Rose committed
import { Unit, Structure } from 'mol-model/structure';
import { RepresentationProps } from '../representation';
import { Visual, VisualContext } from '../visual';
import { StructureMeshParams, StructurePointsParams, StructureLinesParams, StructureDirectVolumeParams, StructureSpheresParams, StructureTextureMeshParams } from './representation';
import { Loci, isEveryLoci, EmptyLoci } from 'mol-model/loci';
Alexander Rose's avatar
Alexander Rose committed
import { GraphicsRenderObject, createRenderObject } from 'mol-gl/render-object';
import { deepEqual, ValueCell } from 'mol-util';
import { Interval } from 'mol-data/int';
import { ParamDefinition as PD } from 'mol-util/param-definition';
Alexander Rose's avatar
Alexander Rose committed
import { Geometry, GeometryUtils } from 'mol-geo/geometry/geometry';
import { LocationIterator } from 'mol-geo/util/location-iterator';
import { PickingId } from 'mol-geo/geometry/picking';
import { createMarkers, MarkerAction } from 'mol-geo/geometry/marker-data';
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 { Points } from 'mol-geo/geometry/points/points';
import { Lines } from 'mol-geo/geometry/lines/lines';
import { DirectVolume } from 'mol-geo/geometry/direct-volume/direct-volume';
import { VisualUpdateState } from 'mol-repr/util';
import { Theme, createEmptyTheme } from 'mol-theme/theme';
import { ColorTheme } from 'mol-theme/color';
import { SizeTheme } from 'mol-theme/size';
import { UnitsParams } from './units-representation';
Alexander Rose's avatar
Alexander Rose committed
import { Mat4 } from 'mol-math/linear-algebra';
import { Spheres } from 'mol-geo/geometry/spheres/spheres';
Alexander Rose's avatar
Alexander Rose committed
import { createUnitsTransform, includesUnitKind } from './visual/util/common';
Alexander Rose's avatar
Alexander Rose committed
import { Overpaint } from 'mol-theme/overpaint';
import { Transparency } from 'mol-theme/transparency';
import { TextureMesh } from 'mol-geo/geometry/texture-mesh/texture-mesh';
Alexander Rose's avatar
Alexander Rose committed

Alexander Rose's avatar
Alexander Rose committed
export type StructureGroup = { structure: Structure, group: Unit.SymmetryGroup }

export interface UnitsVisual<P extends RepresentationProps = {}> extends Visual<StructureGroup, P> { }
function createUnitsRenderObject<G extends Geometry>(group: Unit.SymmetryGroup, geometry: G, locationIt: LocationIterator, theme: Theme, props: PD.Values<Geometry.Params<G>>, materialId: number) {
    const { createValues, createRenderableState } = Geometry.getUtils(geometry)
Alexander Rose's avatar
Alexander Rose committed
    const transform = createUnitsTransform(group)
    const values = createValues(geometry, transform, locationIt, theme, props)
Alexander Rose's avatar
Alexander Rose committed
    const state = createRenderableState(props)
    return createRenderObject(geometry.kind, values, state, materialId)
Alexander Rose's avatar
Alexander Rose committed
}
interface UnitsVisualBuilder<P extends UnitsParams, G extends Geometry> {
    defaultProps: PD.Values<P>
    createGeometry(ctx: VisualContext, unit: Unit, structure: Structure, theme: Theme, props: PD.Values<P>, geometry?: G): Promise<G> | G
    createLocationIterator(group: Unit.SymmetryGroup): LocationIterator
    getLoci(pickingId: PickingId, structureGroup: StructureGroup, id: number): Loci
Alexander Rose's avatar
Alexander Rose committed
    eachLocation(loci: Loci, structureGroup: StructureGroup, apply: (interval: Interval) => boolean): boolean
    setUpdateState(state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme): void
interface UnitsVisualGeometryBuilder<P extends UnitsParams, G extends Geometry> extends UnitsVisualBuilder<P, G> {
Alexander Rose's avatar
Alexander Rose committed
    geometryUtils: GeometryUtils<G>
export function UnitsVisual<G extends Geometry, P extends UnitsParams & Geometry.Params<G>>(builder: UnitsVisualGeometryBuilder<P, G>, materialId: number): UnitsVisual<P> {
Alexander Rose's avatar
Alexander Rose committed
    const { defaultProps, createGeometry, createLocationIterator, getLoci, eachLocation, setUpdateState } = builder
Alexander Rose's avatar
Alexander Rose committed
    const { createEmpty: createEmptyGeometry, updateValues, updateBoundingSphere, updateRenderableState } = builder.geometryUtils
    const updateState = VisualUpdateState.create()
Alexander Rose's avatar
Alexander Rose committed
    let renderObject: GraphicsRenderObject | undefined

    let newProps: PD.Values<P> = Object.assign({}, defaultProps)
    let newTheme: Theme = createEmptyTheme()
    let newStructureGroup: StructureGroup

    let currentProps: PD.Values<P>
    let currentTheme: Theme
    let currentStructureGroup: StructureGroup

Alexander Rose's avatar
Alexander Rose committed
    let geometry: G
    let locationIt: LocationIterator
    function prepareUpdate(theme: Theme, props: Partial<PD.Values<P>> = {}, structureGroup: StructureGroup) {
        if (!structureGroup && !currentStructureGroup) {
            throw new Error('missing structureGroup')
        }
        newProps = Object.assign({}, currentProps, props)
        newTheme = theme
        newStructureGroup = structureGroup
        VisualUpdateState.reset(updateState)
        if (!renderObject) {
            updateState.createNew = true
        } else if (!currentStructureGroup || !Unit.SymmetryGroup.areInvariantElementsEqual(newStructureGroup.group, currentStructureGroup.group)) {
            updateState.createNew = true
        }
        if (updateState.createNew) {
            updateState.createGeometry = true
            return
        }
        setUpdateState(updateState, newProps, currentProps, theme, currentTheme)
        if (!ColorTheme.areEqual(theme.color, currentTheme.color)) {
            // console.log('new colorTheme')
            updateState.updateColor = 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 conformation of unit.model has changed
        if (Unit.conformationId(newStructureGroup.group.units[0]) !== Unit.conformationId(currentStructureGroup.group.units[0])) {
            // console.log('new conformation')
            updateState.createGeometry = true
Alexander Rose's avatar
Alexander Rose committed

        if (updateState.updateTransform) {
            updateState.updateColor = true
            updateState.updateSize = true
            updateState.updateMatrix = true
        }

        if (updateState.createGeometry) {
            updateState.updateColor = true
            updateState.updateSize = true
Alexander Rose's avatar
Alexander Rose committed
    function update(newGeometry?: G) {
        if (updateState.createNew) {
            locationIt = createLocationIterator(newStructureGroup.group)
            if (newGeometry) {
                renderObject = createUnitsRenderObject(newStructureGroup.group, newGeometry, locationIt, newTheme, newProps, materialId)
            } 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.group)
                const { instanceCount, groupCount } = locationIt
                createMarkers(instanceCount * groupCount, renderObject.values)
            }
            if (updateState.updateMatrix) {
                // console.log('update matrix')
                createUnitsTransform(newStructureGroup.group, renderObject.values)
            }
            if (updateState.createGeometry) {
                // console.log('update geometry')
                if (newGeometry) {
                    ValueCell.update(renderObject.values.drawCount, Geometry.getDrawCount(newGeometry))
                } else {
                    throw new Error('expected geometry to be given')
                }
            }

            if (updateState.updateTransform || updateState.createGeometry) {
Alexander Rose's avatar
Alexander Rose committed
                // console.log('UnitsVisual.updateBoundingSphere')
                updateBoundingSphere(renderObject.values, newGeometry || geometry)
            }

            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, newTheme.color, renderObject.values)
            updateValues(renderObject.values, newProps)
            updateRenderableState(renderObject.state, newProps)
        currentTheme = newTheme
        currentStructureGroup = newStructureGroup
        if (newGeometry) geometry = newGeometry
Alexander Rose's avatar
Alexander Rose committed
    function _createGeometry(ctx: VisualContext, unit: Unit, structure: Structure, theme: Theme, props: PD.Values<P>, geometry?: G) {
        return includesUnitKind(props.unitKinds, unit)
                ? createGeometry(ctx, unit, structure, theme, props, geometry)
                : createEmptyGeometry(geometry)
    }

    function lociApply(loci: Loci, apply: (interval: Interval) => boolean) {
        if (isEveryLoci(loci) || (Structure.isLoci(loci) && Structure.areEquivalent(loci.structure, currentStructureGroup.structure))) {
            return apply(Interval.ofBounds(0, locationIt.groupCount * locationIt.instanceCount))
        } else {
            return eachLocation(loci, currentStructureGroup, apply)
        }
    }

Alexander Rose's avatar
Alexander Rose committed
        get groupCount() { return locationIt ? locationIt.count : 0 },
        get renderObject () { return locationIt && locationIt.count ? renderObject : undefined },
Alexander Rose's avatar
Alexander Rose committed
        createOrUpdate(ctx: VisualContext, theme: Theme, props: Partial<PD.Values<P>> = {}, structureGroup?: StructureGroup) {
            prepareUpdate(theme, props, structureGroup || currentStructureGroup)
            if (updateState.createGeometry) {
                const newGeometry = _createGeometry(ctx, newStructureGroup.group.units[0], newStructureGroup.structure, newTheme, newProps, geometry)
Alexander Rose's avatar
Alexander Rose committed
                return newGeometry instanceof Promise ? newGeometry.then(update) : update(newGeometry as G)
        },
        getLoci(pickingId: PickingId) {
            return renderObject ? getLoci(pickingId, currentStructureGroup, renderObject.id) : EmptyLoci
        },
        mark(loci: Loci, action: MarkerAction) {
            return Visual.mark(renderObject, loci, action, lociApply)
        setVisibility(visible: boolean) {
            Visual.setVisibility(renderObject, visible)
        setAlphaFactor(alphaFactor: number) {
            Visual.setAlphaFactor(renderObject, alphaFactor)
        },
        setPickable(pickable: boolean) {
            Visual.setPickable(renderObject, pickable)
        setTransform(matrix?: Mat4, instanceMatrices?: Float32Array | null) {
            Visual.setTransform(renderObject, matrix, instanceMatrices)
Alexander Rose's avatar
Alexander Rose committed
        },
        setOverpaint(overpaint: Overpaint) {
            return Visual.setOverpaint(renderObject, overpaint, lociApply, true)
Alexander Rose's avatar
Alexander Rose committed
        },
        setTransparency(transparency: Transparency) {
            return Visual.setTransparency(renderObject, transparency, lociApply, true)
        },
            renderObject = undefined
export const UnitsMeshParams = { ...StructureMeshParams, ...UnitsParams }
export type UnitsMeshParams = typeof UnitsMeshParams
export interface UnitsMeshVisualBuilder<P extends UnitsMeshParams> extends UnitsVisualBuilder<P, Mesh> { }
export function UnitsMeshVisual<P extends UnitsMeshParams>(builder: UnitsMeshVisualBuilder<P>, materialId: number): UnitsVisual<P> {
Alexander Rose's avatar
Alexander Rose committed
    return UnitsVisual<Mesh, StructureMeshParams & UnitsParams>({
        ...builder,
        setUpdateState: (state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme) => {
            builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme)
            if (!SizeTheme.areEqual(newTheme.size, currentTheme.size)) state.createGeometry = true
Alexander Rose's avatar
Alexander Rose committed
        geometryUtils: Mesh.Utils
Alexander Rose's avatar
Alexander Rose committed

export const UnitsSpheresParams = { ...StructureSpheresParams, ...UnitsParams }
export type UnitsSpheresParams = typeof UnitsSpheresParams
export interface UnitsSpheresVisualBuilder<P extends UnitsSpheresParams> extends UnitsVisualBuilder<P, Spheres> { }

export function UnitsSpheresVisual<P extends UnitsSpheresParams>(builder: UnitsSpheresVisualBuilder<P>, materialId: number): UnitsVisual<P> {
Alexander Rose's avatar
Alexander Rose committed
    return UnitsVisual<Spheres, StructureSpheresParams & UnitsParams>({
        ...builder,
        setUpdateState: (state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme) => {
            builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme)
            if (!SizeTheme.areEqual(newTheme.size, currentTheme.size)) state.updateSize = true
        },
Alexander Rose's avatar
Alexander Rose committed
        geometryUtils: Spheres.Utils
Alexander Rose's avatar
Alexander Rose committed
}

// points

export const UnitsPointsParams = { ...StructurePointsParams, ...UnitsParams }
export type UnitsPointsParams = typeof UnitsPointsParams
export interface UnitsPointVisualBuilder<P extends UnitsPointsParams> extends UnitsVisualBuilder<P, Points> { }
Alexander Rose's avatar
Alexander Rose committed

export function UnitsPointsVisual<P extends UnitsPointsParams>(builder: UnitsPointVisualBuilder<P>, materialId: number): UnitsVisual<P> {
Alexander Rose's avatar
Alexander Rose committed
    return UnitsVisual<Points, StructurePointsParams & UnitsParams>({
        ...builder,
        setUpdateState: (state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme) => {
            builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme)
            if (!SizeTheme.areEqual(newTheme.size, currentTheme.size)) state.updateSize = true
Alexander Rose's avatar
Alexander Rose committed
        },
Alexander Rose's avatar
Alexander Rose committed
        geometryUtils: Points.Utils
Alexander Rose's avatar
Alexander Rose committed
// lines
export const UnitsLinesParams = { ...StructureLinesParams, ...UnitsParams }
export type UnitsLinesParams = typeof UnitsLinesParams
export interface UnitsLinesVisualBuilder<P extends UnitsLinesParams> extends UnitsVisualBuilder<P, Lines> { }
export function UnitsLinesVisual<P extends UnitsLinesParams>(builder: UnitsLinesVisualBuilder<P>, materialId: number): UnitsVisual<P> {
Alexander Rose's avatar
Alexander Rose committed
    return UnitsVisual<Lines, StructureLinesParams & UnitsParams>({
        ...builder,
        setUpdateState: (state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme) => {
            builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme)
            if (!SizeTheme.areEqual(newTheme.size, currentTheme.size)) state.updateSize = true
Alexander Rose's avatar
Alexander Rose committed
        geometryUtils: Lines.Utils
export const UnitsDirectVolumeParams = { ...StructureDirectVolumeParams, ...UnitsParams }
export type UnitsDirectVolumeParams = typeof UnitsDirectVolumeParams
export interface UnitsDirectVolumeVisualBuilder<P extends UnitsDirectVolumeParams> extends UnitsVisualBuilder<P, DirectVolume> { }
export function UnitsDirectVolumeVisual<P extends UnitsDirectVolumeParams>(builder: UnitsDirectVolumeVisualBuilder<P>, materialId: number): UnitsVisual<P> {
Alexander Rose's avatar
Alexander Rose committed
    return UnitsVisual<DirectVolume, StructureDirectVolumeParams & UnitsParams>({
        ...builder,
        setUpdateState: (state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme) => {
            builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme)
            if (!SizeTheme.areEqual(newTheme.size, currentTheme.size)) state.createGeometry = true
Alexander Rose's avatar
Alexander Rose committed
        geometryUtils: DirectVolume.Utils
}

// texture-mesh

export const UnitsTextureMeshParams = { ...StructureTextureMeshParams, ...UnitsParams }
export type UnitsTextureMeshParams = typeof UnitsTextureMeshParams
export interface UnitsTextureMeshVisualBuilder<P extends UnitsTextureMeshParams> extends UnitsVisualBuilder<P, TextureMesh> { }

export function UnitsTextureMeshVisual<P extends UnitsTextureMeshParams>(builder: UnitsTextureMeshVisualBuilder<P>, materialId: number): UnitsVisual<P> {
    return UnitsVisual<TextureMesh, StructureTextureMeshParams & UnitsParams>({
        ...builder,
        setUpdateState: (state: VisualUpdateState, newProps: PD.Values<P>, currentProps: PD.Values<P>, newTheme: Theme, currentTheme: Theme) => {
            builder.setUpdateState(state, newProps, currentProps, newTheme, currentTheme)
            if (!SizeTheme.areEqual(newTheme.size, currentTheme.size)) state.createGeometry = true
        },
        geometryUtils: TextureMesh.Utils
    }, materialId)