async colors creation

src/mol-geo/representation/shape/index.ts

@@ -51,7 +51,7 @@ export function ShapeRepresentation<P extends ShapeProps>(): ShapeRepresentation
             const { groupCount, instanceCount } = locationIt
 
             const transform = createIdentityTransform()
-            const color = createColors(locationIt, _props.colorTheme)
+            const color = await createColors(ctx, locationIt, _props.colorTheme)
             const marker = createMarkers(instanceCount * groupCount)
             const counts = { drawCount: mesh.triangleCount * 3, groupCount, instanceCount }
 

src/mol-geo/representation/structure/complex-visual.ts

@@ -54,7 +54,7 @@ export function ComplexMeshVisual<P extends ComplexMeshProps>(builder: ComplexMe
         mesh = await createMesh(ctx, currentStructure, currentProps, mesh)
 
         locationIt = createLocationIterator(structure)
-        renderObject = createComplexMeshRenderObject(structure, mesh, locationIt, currentProps)
+        renderObject = await createComplexMeshRenderObject(ctx, structure, mesh, locationIt, currentProps)
     }
 
     async function update(ctx: RuntimeContext, props: Partial<P>) {
@@ -85,7 +85,7 @@ export function ComplexMeshVisual<P extends ComplexMeshProps>(builder: ComplexMe
         }
 
         if (updateState.updateColor) {
-            createColors(locationIt, newProps.colorTheme, renderObject.values)
+            await createColors(ctx, locationIt, newProps.colorTheme, renderObject.values)
         }
 
         updateMeshValues(renderObject.values, newProps)

src/mol-geo/representation/structure/units-visual.ts

@@ -58,8 +58,10 @@ export function UnitsMeshVisual<P extends UnitsMeshProps>(builder: UnitsMeshVisu
             ? await createMesh(ctx, unit, currentProps, mesh)
             : Mesh.createEmpty(mesh)
 
+        // TODO create empty location iterator when not in unitKinds
         locationIt = createLocationIterator(group)
-        renderObject = createUnitsMeshRenderObject(group, mesh, locationIt, currentProps)
+        renderObject = await createUnitsMeshRenderObject(ctx, group, mesh, locationIt, currentProps)
+        console.log(renderObject.values.uInstanceCount.ref.value, renderObject.values.uGroupCount.ref.value)
     }
 
     async function update(ctx: RuntimeContext, props: Partial<P> = {}) {
@@ -105,7 +107,7 @@ export function UnitsMeshVisual<P extends UnitsMeshProps>(builder: UnitsMeshVisu
         }
 
         if (updateState.updateColor) {
-            createColors(locationIt, newProps.colorTheme, renderObject.values)
+            await createColors(ctx, locationIt, newProps.colorTheme, renderObject.values)
         }
 
         updateMeshValues(renderObject.values, newProps)

src/mol-geo/representation/structure/visual/element-point.ts

@@ -76,7 +76,7 @@ export default function PointVisual(): UnitsVisual<PointProps> {
 
                 const vertices = createPointVertices(_units[0])
                 const transform = createTransforms(group)
-                const color = createColors(locationIt, colorTheme)
+                const color = await createColors(ctx, locationIt, colorTheme)
                 const size = createSizes(locationIt, sizeTheme)
                 const marker = createMarkers(instanceCount * elementCount)
 
@@ -109,7 +109,7 @@ export default function PointVisual(): UnitsVisual<PointProps> {
                 const newProps = { ...currentProps, ...props }
 
                 if (!deepEqual(currentProps.colorTheme, newProps.colorTheme)) {
-                    createColors(locationIt, newProps.colorTheme, renderObject.values)
+                    await createColors(ctx, locationIt, newProps.colorTheme, renderObject.values)
                 }
 
                 if (!deepEqual(currentProps.sizeTheme, newProps.sizeTheme)) {

src/mol-geo/representation/structure/visual/polymer-gap-cylinder.ts

@@ -4,7 +4,7 @@
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
 
-import { Unit, StructureElement } from 'mol-model/structure';
+import { Unit } from 'mol-model/structure';
 import { UnitsVisual } from '..';
 import { RuntimeContext } from 'mol-task'
 import { Mesh } from '../../../mesh/mesh';

src/mol-geo/representation/structure/visual/util/common.ts

@@ -21,6 +21,7 @@ import { createMarkers } from '../../../../util/marker-data';
 import { createMeshRenderObject } from 'mol-gl/render-object';
 import { ColorThemeProps, ColorTheme } from 'mol-view/theme/color';
 import { SizeThemeProps, SizeTheme } from 'mol-view/theme/size';
+import { RuntimeContext } from 'mol-task';
 
 export function createTransforms({ units }: Unit.SymmetryGroup, transformData?: TransformData) {
     const unitCount = units.length
@@ -37,13 +38,13 @@ export function createTransforms({ units }: Unit.SymmetryGroup, transformData?:
     }
 }
 
-export function createColors(locationIt: LocationIterator, props: ColorThemeProps, colorData?: ColorData) {
+export function createColors(ctx: RuntimeContext, locationIt: LocationIterator, props: ColorThemeProps, colorData?: ColorData) {
     const colorTheme = ColorTheme(props)
     switch (colorTheme.kind) {
-        case 'uniform': return createUniformColor(locationIt, colorTheme.color, colorData)
-        case 'group': return createGroupColor(locationIt, colorTheme.color, colorData)
-        case 'groupInstance': return createGroupInstanceColor(locationIt, colorTheme.color, colorData)
-        case 'instance': return createInstanceColor(locationIt, colorTheme.color, colorData)
+        case 'uniform': return createUniformColor(ctx, locationIt, colorTheme.color, colorData)
+        case 'group': return createGroupColor(ctx, locationIt, colorTheme.color, colorData)
+        case 'groupInstance': return createGroupInstanceColor(ctx, locationIt, colorTheme.color, colorData)
+        case 'instance': return createInstanceColor(ctx, locationIt, colorTheme.color, colorData)
     }
 }
 
@@ -59,9 +60,11 @@ export function createSizes(locationIt: LocationIterator, props: SizeThemeProps,
 
 type StructureMeshProps = Required<MeshProps & StructureProps>
 
-function _createMeshValues(transforms: TransformData, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps): MeshValues {
+async function _createMeshValues(ctx: RuntimeContext, transforms: TransformData, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps): Promise<MeshValues> {
     const { instanceCount, groupCount } = locationIt
-    const color = createColors(locationIt, props.colorTheme)
+    console.time('createColors1')
+    const color = await createColors(ctx, locationIt, props.colorTheme)
+    console.timeEnd('createColors1')
     const marker = createMarkers(instanceCount * groupCount)
 
     const counts = { drawCount: mesh.triangleCount * 3, groupCount, instanceCount }
@@ -76,29 +79,29 @@ function _createMeshValues(transforms: TransformData, mesh: Mesh, locationIt: Lo
     }
 }
 
-export function createComplexMeshValues(structure: Structure, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps): MeshValues {
+export async function createComplexMeshValues(ctx: RuntimeContext, structure: Structure, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps): Promise<MeshValues> {
     const transforms = createIdentityTransform()
-    return _createMeshValues(transforms, mesh, locationIt, props)
+    return _createMeshValues(ctx, transforms, mesh, locationIt, props)
 }
 
-export function createUnitsMeshValues(group: Unit.SymmetryGroup, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps): MeshValues {
+export async function createUnitsMeshValues(ctx: RuntimeContext, group: Unit.SymmetryGroup, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps): Promise<MeshValues> {
     const transforms = createTransforms(group)
-    return _createMeshValues(transforms, mesh, locationIt, props)
+    return _createMeshValues(ctx, transforms, mesh, locationIt, props)
 }
 
-export function createComplexMeshRenderObject(structure: Structure, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps) {
-    const values = createComplexMeshValues(structure, mesh, locationIt, props)
+export async function createComplexMeshRenderObject(ctx: RuntimeContext, structure: Structure, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps) {
+    const values = await createComplexMeshValues(ctx, structure, mesh, locationIt, props)
     const state = createRenderableState(props)
     return createMeshRenderObject(values, state)
 }
 
-export function createUnitsMeshRenderObject(group: Unit.SymmetryGroup, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps) {
-    const values = createUnitsMeshValues(group, mesh, locationIt, props)
+export async function createUnitsMeshRenderObject(ctx: RuntimeContext, group: Unit.SymmetryGroup, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps) {
+    const values = await createUnitsMeshValues(ctx, group, mesh, locationIt, props)
     const state = createRenderableState(props)
     return createMeshRenderObject(values, state)
 }
 
-export function updateComplexMeshRenderObject(structure: Structure, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps): MeshValues {
+export async function updateComplexMeshRenderObject(ctx: RuntimeContext, structure: Structure, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps): Promise<MeshValues> {
     const transforms = createIdentityTransform()
-    return _createMeshValues(transforms, mesh, locationIt, props)
+    return _createMeshValues(ctx, transforms, mesh, locationIt, props)
 }

src/mol-geo/util/color-data.ts

@@ -11,6 +11,7 @@ import { Vec2, Vec3 } from 'mol-math/linear-algebra';
 import { LocationIterator } from './location-iterator';
 import { NullLocation } from 'mol-model/location';
 import { LocationColor, ColorType } from 'mol-view/theme/color';
+import { RuntimeContext } from 'mol-task';
 
 export type ColorData = {
     uColor: ValueCell<Vec3>,
@@ -46,7 +47,7 @@ export function createValueColor(value: Color, colorData?: ColorData): ColorData
 }
 
 /** Creates color uniform */
-export function createUniformColor(locationIt: LocationIterator, color: LocationColor, colorData?: ColorData): ColorData {
+export async function createUniformColor(ctx: RuntimeContext, locationIt: LocationIterator, color: LocationColor, colorData?: ColorData): Promise<ColorData> {
     return createValueColor(color(NullLocation, false), colorData)
 }
 
@@ -70,36 +71,51 @@ export function createTextureColor(colors: TextureImage, type: ColorType, colorD
 }
 
 /** Creates color texture with color for each instance/unit */
-export function createInstanceColor(locationIt: LocationIterator, color: LocationColor, colorData?: ColorData): ColorData {
+export async function createInstanceColor(ctx: RuntimeContext, locationIt: LocationIterator, color: LocationColor, colorData?: ColorData): Promise<ColorData> {
     const { instanceCount} = locationIt
     const colors = colorData && colorData.tColor.ref.value.array.length >= instanceCount * 3 ? colorData.tColor.ref.value : createTextureImage(instanceCount, 3)
+    let i = 0
     while (locationIt.hasNext) {
         const { location, isSecondary, instanceIndex } = locationIt.move()
         Color.toArray(color(location, isSecondary), colors.array, instanceIndex * 3)
         locationIt.skipInstance()
+        if (i % 10000 === 0 && ctx.shouldUpdate) {
+            await ctx.update({ message: 'Creating instance colors', current: i, max: instanceCount });
+        }
+        ++i
     }
     return createTextureColor(colors, 'instance', colorData)
 }
 
 /** Creates color texture with color for each group (i.e. shared across instances/units) */
-export function createGroupColor(locationIt: LocationIterator, color: LocationColor, colorData?: ColorData): ColorData {
+export async function createGroupColor(ctx: RuntimeContext, locationIt: LocationIterator, color: LocationColor, colorData?: ColorData): Promise<ColorData> {
     const { groupCount } = locationIt
     const colors = colorData && colorData.tColor.ref.value.array.length >= groupCount * 3 ? colorData.tColor.ref.value : createTextureImage(groupCount, 3)
+    let i = 0
     while (locationIt.hasNext && !locationIt.isNextNewInstance) {
         const { location, isSecondary, groupIndex } = locationIt.move()
         Color.toArray(color(location, isSecondary), colors.array, groupIndex * 3)
+        if (i % 10000 === 0 && ctx.shouldUpdate) {
+            await ctx.update({ message: 'Creating group colors', current: i, max: groupCount });
+        }
+        ++i
     }
     return createTextureColor(colors, 'group', colorData)
 }
 
 /** Creates color texture with color for each group in each instance (i.e. for each unit) */
-export function createGroupInstanceColor(locationIt: LocationIterator, color: LocationColor, colorData?: ColorData): ColorData {
+export async function createGroupInstanceColor(ctx: RuntimeContext, locationIt: LocationIterator, color: LocationColor, colorData?: ColorData): Promise<ColorData> {
     const { groupCount, instanceCount } = locationIt
     const count = instanceCount * groupCount
     const colors = colorData && colorData.tColor.ref.value.array.length >= count * 3 ? colorData.tColor.ref.value : createTextureImage(count, 3)
+    let i = 0
     while (locationIt.hasNext) {
         const { location, isSecondary, index } = locationIt.move()
         Color.toArray(color(location, isSecondary), colors.array, index * 3)
+        if (i % 10000 === 0 && ctx.shouldUpdate) {
+            await ctx.update({ message: 'Creating group instance colors', current: i, max: count });
+        }
+        ++i
     }
     return createTextureColor(colors, 'groupInstance', colorData)
 }