diff --git a/package-lock.json b/package-lock.json
index 539aec393ef4a81fe88c46bb79781f76eeceaac4..edafd4d1f9c93c4ded380346f45198682ee709a0 100644
Binary files a/package-lock.json and b/package-lock.json differ
diff --git a/src/apps/canvas/structure-view.ts b/src/apps/canvas/structure-view.ts
index 5f80091c05466fc21c26c6140c49d86bcc837ec0..7e24cf4b1ec62fd0c9db9c9340b78d19c4e1382d 100644
--- a/src/apps/canvas/structure-view.ts
+++ b/src/apps/canvas/structure-view.ts
@@ -58,10 +58,10 @@ interface StructureViewProps {
export async function StructureView(app: App, canvas3d: Canvas3D, models: ReadonlyArray<Model>, props: StructureViewProps = {}): Promise<StructureView> {
const active: { [k: string]: boolean } = {
- cartoon: true,
+ 'cartoon': true,
+ 'ball-and-stick': true,
// point: false,
// surface: false,
- // ballAndStick: false,
// carbohydrate: false,
// spacefill: false,
// distanceRestraint: false,
@@ -197,7 +197,7 @@ export async function StructureView(app: App, canvas3d: Canvas3D, models: Readon
if (structureRepresentations[k]) {
repr = structureRepresentations[k]
} else {
- repr = app.structureRepresentationRegistry.create('cartoon', app.reprCtx, structure)
+ repr = app.structureRepresentationRegistry.create(k, app.reprCtx, structure)
structureRepresentations[k] = repr
}
await app.runTask(repr.createOrUpdate(app.reprCtx, {}, {}, structure).run(
diff --git a/src/mol-repr/structure/registry.ts b/src/mol-repr/structure/registry.ts
index 90822d785f74c2f767e613df604f01718231a643..c6fce5ebfb099277525988766ddf8020432eaf5f 100644
--- a/src/mol-repr/structure/registry.ts
+++ b/src/mol-repr/structure/registry.ts
@@ -7,6 +7,7 @@
import { Structure } from 'mol-model/structure';
import { RepresentationProvider, RepresentationRegistry } from '../representation';
import { CartoonRepresentationProvider } from './representation/cartoon';
+import { BallAndStickRepresentationProvider } from './representation/ball-and-stick';
export class StructureRepresentationRegistry extends RepresentationRegistry<Structure> {
constructor() {
@@ -20,6 +21,7 @@ export class StructureRepresentationRegistry extends RepresentationRegistry<Stru
export const BuiltInStructureRepresentations = {
'cartoon': CartoonRepresentationProvider,
+ 'ball-and-stick': BallAndStickRepresentationProvider,
}
export type BuiltInStructureRepresentationsName = keyof typeof BuiltInStructureRepresentations
export const BuiltInStructureRepresentationsNames = Object.keys(BuiltInStructureRepresentations)
diff --git a/src/mol-repr/structure/representation/ball-and-stick.ts b/src/mol-repr/structure/representation/ball-and-stick.ts
index e8efe097138b194a47823d1b92fefa5a1e095fe7..a6e3d51cee9f8b2de5b8aad1f87c664c20b1ecea 100644
--- a/src/mol-repr/structure/representation/ball-and-stick.ts
+++ b/src/mol-repr/structure/representation/ball-and-stick.ts
@@ -1,38 +1,53 @@
-// /**
-// * Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
-// *
-// * @author Alexander Rose <alexander.rose@weirdbyte.de>
-// */
+/**
+ * Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ *
+ * @author Alexander Rose <alexander.rose@weirdbyte.de>
+ */
-// import { ElementSphereVisual, ElementSphereParams } from '../visual/element-sphere';
-// import { IntraUnitLinkVisual, IntraUnitLinkParams } from '../visual/intra-unit-link-cylinder';
-// import { InterUnitLinkVisual, InterUnitLinkParams } from '../visual/inter-unit-link-cylinder';
-// import { ParamDefinition as PD } from 'mol-util/param-definition';
-// import { UnitsRepresentation } from '../units-representation';
-// import { ComplexRepresentation } from '../complex-representation';
-// import { StructureRepresentation } from '../representation';
-// import { Representation } from 'mol-repr/representation';
-// import { ThemeRegistryContext } from 'mol-theme/theme';
-// import { Structure } from 'mol-model/structure';
+import { ElementSphereVisual, ElementSphereParams, ElementSphereProps } from '../visual/element-sphere';
+import { IntraUnitLinkVisual, IntraUnitLinkParams } from '../visual/intra-unit-link-cylinder';
+import { InterUnitLinkVisual, InterUnitLinkParams, InterUnitLinkProps } from '../visual/inter-unit-link-cylinder';
+import { ParamDefinition as PD } from 'mol-util/param-definition';
+import { UnitsRepresentation } from '../units-representation';
+import { ComplexRepresentation } from '../complex-representation';
+import { StructureRepresentation, StructureRepresentationProvider } from '../representation';
+import { Representation } from 'mol-repr/representation';
+import { ThemeRegistryContext } from 'mol-theme/theme';
+import { Structure } from 'mol-model/structure';
+import { IntraUnitLinkProps } from '../visual/polymer-gap-cylinder';
+import { BuiltInSizeThemeName, BuiltInSizeThemeOptions } from 'mol-theme/size';
+import { BuiltInColorThemeName, BuiltInColorThemeOptions } from 'mol-theme/color';
+import { UnitKind, UnitKindOptions } from '../visual/util/common';
-// export const BallAndStickParams = {
-// ...ElementSphereParams,
-// ...IntraUnitLinkParams,
-// ...InterUnitLinkParams,
-// // TODO
-// // unitKinds: PD.MultiSelect<UnitKind>('Unit Kind', '', ['atomic'], UnitKindOptions),
-// }
-// export function getBallAndStickParams(ctx: ThemeRegistryContext, structure: Structure) {
-// return BallAndStickParams // TODO return copy
-// }
-// export type BallAndStickProps = PD.DefaultValues<typeof BallAndStickParams>
+const BallAndStickVisuals = {
+ 'element-sphere': (defaultProps: ElementSphereProps) => UnitsRepresentation('Element sphere mesh', defaultProps, ElementSphereVisual),
+ 'intra-link': (defaultProps: IntraUnitLinkProps) => UnitsRepresentation('Intra-unit link cylinder', defaultProps, IntraUnitLinkVisual),
+ 'inter-link': (defaultProps: InterUnitLinkProps) => ComplexRepresentation('Inter-unit link cylinder', defaultProps, InterUnitLinkVisual),
+}
+type BallAndStickVisualName = keyof typeof BallAndStickVisuals
+const BallAndStickVisualOptions = Object.keys(BallAndStickVisuals).map(name => [name, name] as [BallAndStickVisualName, string])
-// export type BallAndStickRepresentation = StructureRepresentation<BallAndStickProps>
+export const BallAndStickParams = {
+ ...ElementSphereParams,
+ ...IntraUnitLinkParams,
+ ...InterUnitLinkParams,
+ unitKinds: PD.MultiSelect<UnitKind>('Unit Kind', '', ['atomic'], UnitKindOptions),
+ sizeFactor: PD.Numeric('Size Factor', '', 0.2, 0.01, 10, 0.01),
+ sizeTheme: PD.Select<BuiltInSizeThemeName>('Size Theme', '', 'uniform', BuiltInSizeThemeOptions),
+ colorTheme: PD.Select<BuiltInColorThemeName>('Color Theme', '', 'polymer-index', BuiltInColorThemeOptions),
+ visuals: PD.MultiSelect<BallAndStickVisualName>('Visuals', '', ['element-sphere', 'intra-link', 'inter-link'], BallAndStickVisualOptions),
+}
+export function getBallAndStickParams(ctx: ThemeRegistryContext, structure: Structure) {
+ return BallAndStickParams // TODO return copy
+}
+export type BallAndStickProps = PD.DefaultValues<typeof BallAndStickParams>
-// export function BallAndStickRepresentation(defaultProps: BallAndStickProps): BallAndStickRepresentation {
-// return Representation.createMulti('Ball & Stick', defaultProps, [
-// UnitsRepresentation('Element sphere mesh', defaultProps, ElementSphereVisual),
-// UnitsRepresentation('Intra-unit link cylinder', defaultProps, IntraUnitLinkVisual),
-// ComplexRepresentation('Inter-unit link cylinder', defaultProps, InterUnitLinkVisual)
-// ])
-// }
\ No newline at end of file
+export type BallAndStickRepresentation = StructureRepresentation<BallAndStickProps>
+
+export function BallAndStickRepresentation(defaultProps: BallAndStickProps): BallAndStickRepresentation {
+ return Representation.createMulti('Ball & Stick', defaultProps, BallAndStickVisuals as unknown as Representation.Def<BallAndStickProps>)
+}
+
+export const BallAndStickRepresentationProvider: StructureRepresentationProvider<typeof BallAndStickParams> = {
+ factory: BallAndStickRepresentation, params: getBallAndStickParams
+}
\ No newline at end of file
diff --git a/src/mol-repr/structure/visual/element-sphere.ts b/src/mol-repr/structure/visual/element-sphere.ts
index 29feb54d3bd815bfacd188ba59ce029449d3f505..2b4a7c0d1c69956e748537ff2ea69b864128fe90 100644
--- a/src/mol-repr/structure/visual/element-sphere.ts
+++ b/src/mol-repr/structure/visual/element-sphere.ts
@@ -10,13 +10,12 @@ import { VisualUpdateState } from '../../util';
import { createElementSphereMesh, markElement, getElementLoci, StructureElementIterator } from './util/element';
import { UnitsMeshVisual, UnitsMeshParams } from '../units-visual';
import { ParamDefinition as PD } from 'mol-util/param-definition';
+import { BuiltInSizeThemeName, BuiltInSizeThemeOptions } from 'mol-theme/size';
export const ElementSphereParams = {
...UnitsMeshParams,
- // TODO
- // sizeTheme: PD.Select<SizeThemeName>('Size Theme', '', 'physical', SizeThemeOptions),
- // sizeValue: PD.Numeric('Size Value', '', 0.2, 0, 10, 0.1),
- // sizeFactor: PD.Numeric('Size Factor', '', 1, 0, 10, 0.1),
+ sizeTheme: PD.Select<BuiltInSizeThemeName>('Size Theme', '', 'physical', BuiltInSizeThemeOptions),
+ sizeFactor: PD.Numeric('Size Factor', '', 1, 0, 10, 0.1),
detail: PD.Numeric('Sphere Detail', '', 0, 0, 3, 1),
}
export const DefaultElementSphereProps = PD.getDefaultValues(ElementSphereParams)
diff --git a/src/mol-repr/structure/visual/intra-unit-link-cylinder.ts b/src/mol-repr/structure/visual/intra-unit-link-cylinder.ts
index e177c362db55347c887d80df34823ab4f83a3e0f..e305dcf0d8ef93d5c1be77f36c2b8d03d72d965e 100644
--- a/src/mol-repr/structure/visual/intra-unit-link-cylinder.ts
+++ b/src/mol-repr/structure/visual/intra-unit-link-cylinder.ts
@@ -20,7 +20,7 @@ import { PickingId } from 'mol-geo/geometry/picking';
import { VisualContext } from 'mol-repr/representation';
import { Theme } from 'mol-theme/theme';
-async function createIntraUnitLinkCylinderMesh(ctx: VisualContext, unit: Unit, structure: Structure, theme: Theme, props: LinkCylinderProps, mesh?: Mesh) {
+async function createIntraUnitLinkCylinderMesh(ctx: VisualContext, unit: Unit, structure: Structure, theme: Theme, props: IntraUnitLinkProps, mesh?: Mesh) {
if (!Unit.isAtomic(unit)) return Mesh.createEmpty(mesh)
const location = StructureElement.create(unit)
@@ -29,6 +29,7 @@ async function createIntraUnitLinkCylinderMesh(ctx: VisualContext, unit: Unit, s
const links = unit.links
const { edgeCount, a, b, edgeProps, offset } = links
const { order: _order, flags: _flags } = edgeProps
+ const { sizeFactor } = props
if (!edgeCount) return Mesh.createEmpty(mesh)
@@ -56,7 +57,7 @@ async function createIntraUnitLinkCylinderMesh(ctx: VisualContext, unit: Unit, s
flags: (edgeIndex: number) => BitFlags.create(_flags[edgeIndex]),
radius: (edgeIndex: number) => {
location.element = elements[a[edgeIndex]]
- return theme.size.size(location)
+ return theme.size.size(location) * sizeFactor
}
}
@@ -66,10 +67,7 @@ async function createIntraUnitLinkCylinderMesh(ctx: VisualContext, unit: Unit, s
export const IntraUnitLinkParams = {
...UnitsMeshParams,
...LinkCylinderParams,
- // TODO
- // sizeTheme: PD.Select<SizeThemeName>('Size Theme', '', 'physical', SizeThemeOptions),
- // sizeValue: PD.Numeric('Size Value', '', 0.2, 0, 10, 0.1),
- // sizeFactor: PD.Numeric('Size Factor', '', 1, 0, 10, 0.1),
+ sizeFactor: PD.Numeric('Size Factor', '', 0.2, 0, 10, 0.01),
}
export const DefaultIntraUnitLinkProps = PD.getDefaultValues(IntraUnitLinkParams)
export type IntraUnitLinkProps = typeof DefaultIntraUnitLinkProps
diff --git a/src/mol-repr/structure/visual/util/element.ts b/src/mol-repr/structure/visual/util/element.ts
index 9f584171436fadb137e561b26d4553a502f2faae..38188c4380c4094574a36ca89319b2486844503e 100644
--- a/src/mol-repr/structure/visual/util/element.ts
+++ b/src/mol-repr/structure/visual/util/element.ts
@@ -20,10 +20,11 @@ import { StructureGroup } from 'mol-repr/structure/units-visual';
export interface ElementSphereMeshProps {
detail: number,
+ sizeFactor: number
}
export async function createElementSphereMesh(ctx: VisualContext, unit: Unit, structure: Structure, theme: Theme, props: ElementSphereMeshProps, mesh?: Mesh) {
- const { detail } = props
+ const { detail, sizeFactor } = props
const { elements } = unit;
const elementCount = elements.length;
@@ -40,7 +41,7 @@ export async function createElementSphereMesh(ctx: VisualContext, unit: Unit, st
pos(elements[i], v)
meshBuilder.setGroup(i)
- addSphere(meshBuilder, v, theme.size.size(l), detail)
+ addSphere(meshBuilder, v, theme.size.size(l) * sizeFactor, detail)
if (i % 10000 === 0 && ctx.runtime.shouldUpdate) {
await ctx.runtime.update({ message: 'Sphere mesh', current: i, max: elementCount });