renamed ColorThme.kind to .granularity

src/apps/canvas/assembly-symmetry.ts

@@ -66,10 +66,10 @@ export function getClusterColorTheme(featureId: number, assemblySymmetry: Assemb
     const DefaultColor = Color(0xCCCCCC)
     const f = assemblySymmetry.db.rcsb_assembly_symmetry_feature
     const feature = Table.pickRow(f, i => f.id.value(i) === featureId)
-    if (!feature) return { kind: 'uniform', color: () => DefaultColor }
+    if (!feature) return { granularity: 'uniform', color: () => DefaultColor }
 
     const clusters = assemblySymmetry.getClusters(featureId)
-    if (!clusters._rowCount) return { kind: 'uniform', color: () => DefaultColor }
+    if (!clusters._rowCount) return { granularity: 'uniform', color: () => DefaultColor }
 
     const clusterByMember = new Map<string, number>()
     for (let i = 0, il = clusters._rowCount; i < il; ++i) {
@@ -84,7 +84,7 @@ export function getClusterColorTheme(featureId: number, assemblySymmetry: Assemb
     const scale = ColorScale.create({ domain: [ 0, clusters._rowCount - 1 ] })
 
     return {
-        kind: 'instance',
+        granularity: 'instance',
         color: (location: Location): Color => {
             if (StructureElement.isLocation(location)) {
                 const ns = location.unit.conformation.operator.name.split('-')

src/apps/canvas/structure-view.ts

@@ -157,7 +157,7 @@ export async function StructureView(viewer: Viewer, models: ReadonlyArray<Model>
         if (structure) {
             console.log('createStructureRepr')
             await cartoon.createOrUpdate({
-                colorTheme: { name: 'unit-index' },
+                colorTheme: { name: 'chain-id' },
                 sizeTheme: { name: 'uniform', value: 0.2 },
                 useFog: false // TODO fog not working properly
             }, structure).run()
@@ -169,7 +169,7 @@ export async function StructureView(viewer: Viewer, models: ReadonlyArray<Model>
             // }, structure).run()
 
             await ballAndStick.createOrUpdate({
-                colorTheme: { name: 'unit-index' },
+                colorTheme: { name: 'chain-id' },
                 sizeTheme: { name: 'uniform', value: 0.1 },
                 useFog: false // TODO fog not working properly
             }, structure).run()

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

@@ -55,7 +55,6 @@ export function ComplexMeshVisual<P extends ComplexMeshProps>(builder: ComplexMe
 
         locationIt = createLocationIterator(structure)
         renderObject = await createComplexMeshRenderObject(ctx, structure, mesh, locationIt, currentProps)
-        console.log(renderObject.values)
     }
 
     async function update(ctx: RuntimeContext, props: Partial<P>) {

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

@@ -27,7 +27,7 @@ import { TransformData, createIdentityTransform, createTransforms } from '../../
 export function createColors(ctx: RuntimeContext, locationIt: LocationIterator, props: ColorThemeProps, colorData?: ColorData): Promise<ColorData> {
     const colorTheme = ColorTheme(props)
     // Always use 'group' kind for 'complex' location iterators, i.e. an instance may include multiple units
-    const kind = colorTheme.kind === 'instance' && locationIt.isComplex ? 'group' : colorTheme.kind
+    const kind = colorTheme.granularity === 'instance' && locationIt.isComplex ? 'group' : colorTheme.granularity
     switch (kind) {
         case 'uniform': return createUniformColor(ctx, locationIt, colorTheme.color, colorData)
         case 'group': return createGroupColor(ctx, locationIt, colorTheme.color, colorData)
@@ -52,7 +52,10 @@ type StructureMeshProps = Required<MeshProps & StructureProps>
 
 async function _createMeshValues(ctx: RuntimeContext, transforms: TransformData, mesh: Mesh, locationIt: LocationIterator, props: StructureMeshProps): Promise<MeshValues> {
     const { instanceCount, groupCount } = locationIt
+    console.time('createColors')
     const color = await createColors(ctx, locationIt, props.colorTheme)
+    console.timeEnd('createColors')
+    console.log(locationIt.groupCount)
     const marker = createMarkers(instanceCount * groupCount)
 
     const counts = { drawCount: mesh.triangleCount * 3, groupCount, instanceCount }

src/mol-view/theme/color.ts

@@ -22,7 +22,7 @@ export type ColorType = 'uniform' | 'instance' | 'group' | 'groupInstance'
 export type LocationColor = (location: Location, isSecondary: boolean) => Color
 
 export interface ColorTheme {
-    kind: ColorType
+    granularity: ColorType
     color: LocationColor
 }
 

src/mol-view/theme/color/carbohydrate-symbol.ts

@@ -45,5 +45,5 @@ export function CarbohydrateSymbolColorTheme(props: ColorThemeProps): ColorTheme
         color = () => DefaultColor
     }
 
-    return { kind: 'group', color: color }
+    return { granularity: 'group', color: color }
 }

src/mol-view/theme/color/chain-id.ts

@@ -25,15 +25,25 @@ function getAsymId(unit: Unit): StructureElement.Property<string> {
 export function ChainIdColorTheme(props: ColorThemeProps): ColorTheme {
     const l = StructureElement.create()
 
+    const scaleMap = new Map<number, ColorScale>()
+    function getScale(size: number) {
+        let scale = scaleMap.get(size)
+        if (!scale) {
+            scale = ColorScale.create({ domain: [ 0, size - 1 ] })
+            scaleMap.set(size, scale)
+        }
+        return scale
+    }
+
     function color(location: Location): Color {
         if (StructureElement.isLocation(location)) {
             const map = location.unit.model.properties.asymIdSerialMap
-            const scale = ColorScale.create({ domain: [ 0, map.size - 1 ] })
+            const scale = getScale(map.size)
             const asym_id = getAsymId(location.unit)
             return scale.color(map.get(asym_id(location)) || 0)
         } else if (Link.isLocation(location)) {
             const map = location.aUnit.model.properties.asymIdSerialMap
-            const scale = ColorScale.create({ domain: [ 0, map.size - 1 ] })
+            const scale = getScale(map.size)
             const asym_id = getAsymId(location.aUnit)
             l.unit = location.aUnit
             l.element = location.aUnit.elements[location.aIndex]
@@ -42,5 +52,5 @@ export function ChainIdColorTheme(props: ColorThemeProps): ColorTheme {
         return DefaultColor
     }
 
-    return { kind: 'group', color }
+    return { granularity: 'group', color }
 }

src/mol-view/theme/color/cross-link.ts

@@ -40,5 +40,5 @@ export function CrossLinkColorTheme(props: ColorThemeProps): ColorTheme {
         color = () => DefaultColor
     }
 
-    return { kind: 'group', color }
+    return { granularity: 'group', color }
 }

src/mol-view/theme/color/custom.ts

@@ -13,7 +13,7 @@ const DefaultColor = Color(0xCCCCCC)
 export function CustomColorTheme(props: ColorThemeProps): ColorTheme {
     const value = defaults(props.value, DefaultColor)
     return {
-        kind: defaults(props.kind, 'uniform'),
+        granularity: defaults(props.kind, 'uniform'),
         color: defaults(props.color, () => value)
     }
 }

src/mol-view/theme/color/element-index.ts

@@ -42,5 +42,5 @@ export function ElementIndexColorTheme(props: ColorThemeProps): ColorTheme {
         color = () => DefaultColor
     }
 
-    return { kind: 'groupInstance', color }
+    return { granularity: 'groupInstance', color }
 }

src/mol-view/theme/color/element-symbol.ts

@@ -38,5 +38,5 @@ export function ElementSymbolColorTheme(props: ColorThemeProps): ColorTheme {
         return DefaultElementSymbolColor
     }
 
-    return { kind: 'group', color }
+    return { granularity: 'group', color }
 }

src/mol-view/theme/color/shape-group.ts

@@ -13,7 +13,7 @@ const DefaultColor = Color(0xCCCCCC)
 
 export function ShapeGroupColorTheme(props: ColorThemeProps): ColorTheme {
     return {
-        kind: 'group',
+        granularity: 'group',
         color: (location: Location): Color => {
             if (Shape.isLocation(location)) {
                 return location.shape.colors.ref.value[location.group]

src/mol-view/theme/color/uniform.ts

@@ -13,7 +13,7 @@ export function UniformColorTheme(props: ColorThemeProps): ColorTheme {
     const color = props.value || DefaultColor
 
     return {
-        kind: 'uniform',
+        granularity: 'uniform',
         color: () => color
     }
 }

src/mol-view/theme/color/unit-index.ts

@@ -34,5 +34,5 @@ export function UnitIndexColorTheme(props: ColorThemeProps): ColorTheme {
         color = () => DefaultColor
     }
 
-    return { kind: 'instance', color }
+    return { granularity: 'instance', color }
 }