From 3f9a8222357bf313a8e17d41ca5e397a7e9df826 Mon Sep 17 00:00:00 2001
From: Alexander Rose <alex.rose@rcsb.org>
Date: Mon, 13 Aug 2018 16:16:40 -0700
Subject: [PATCH] wip, moved themes to mol-view

---
 src/mol-app/ui/transform/backbone.tsx         |  3 +-
 src/mol-app/ui/transform/ball-and-stick.tsx   |  3 +-
 src/mol-app/ui/transform/carbohydrate.tsx     |  3 +-
 src/mol-app/ui/transform/cartoon.tsx          |  3 +-
 .../ui/transform/distance-restraint.tsx       |  3 +-
 src/mol-app/ui/transform/spacefill.tsx        |  3 +-
 src/mol-geo/representation/structure/index.ts |  3 +-
 .../representation/ball-and-stick.ts          |  2 +-
 .../representation/distance-restraint.ts      |  2 +-
 .../visual/carbohydrate-link-cylinder.ts      |  2 +-
 .../visual/carbohydrate-symbol-mesh.ts        |  2 +-
 .../visual/cross-link-restraint-cylinder.ts   |  2 +-
 .../structure/visual/element-point.ts         |  2 +-
 .../visual/inter-unit-link-cylinder.ts        |  2 +-
 .../visual/intra-unit-link-cylinder.ts        |  2 +-
 .../structure/visual/util/common.ts           |  5 +-
 .../structure/visual/util/element.ts          |  3 +-
 src/mol-geo/theme/index.ts                    | 42 ----------------
 src/mol-geo/theme/structure/color/index.ts    | 31 ------------
 src/mol-geo/theme/structure/size/index.ts     | 22 --------
 src/mol-view/theme/color.ts                   | 50 +++++++++++++++++++
 .../theme}/color/carbohydrate-symbol.ts       |  5 +-
 .../theme}/color/chain-id.ts                  |  3 +-
 .../theme}/color/element-index.ts             |  5 +-
 .../theme}/color/element-symbol.ts            |  3 +-
 .../theme}/color/uniform.ts                   |  3 +-
 .../theme}/color/unit-index.ts                |  5 +-
 src/mol-view/theme/size.ts                    | 37 ++++++++++++++
 .../theme}/size/physical.ts                   |  3 +-
 .../theme}/size/uniform.ts                    |  3 +-
 30 files changed, 123 insertions(+), 134 deletions(-)
 delete mode 100644 src/mol-geo/theme/index.ts
 delete mode 100644 src/mol-geo/theme/structure/color/index.ts
 delete mode 100644 src/mol-geo/theme/structure/size/index.ts
 create mode 100644 src/mol-view/theme/color.ts
 rename src/{mol-geo/theme/structure => mol-view/theme}/color/carbohydrate-symbol.ts (93%)
 rename src/{mol-geo/theme/structure => mol-view/theme}/color/chain-id.ts (95%)
 rename src/{mol-geo/theme/structure => mol-view/theme}/color/element-index.ts (93%)
 rename src/{mol-geo/theme/structure => mol-view/theme}/color/element-symbol.ts (97%)
 rename src/{mol-geo/theme/structure => mol-view/theme}/color/uniform.ts (84%)
 rename src/{mol-geo/theme/structure => mol-view/theme}/color/unit-index.ts (89%)
 create mode 100644 src/mol-view/theme/size.ts
 rename src/{mol-geo/theme/structure => mol-view/theme}/size/physical.ts (95%)
 rename src/{mol-geo/theme/structure => mol-view/theme}/size/uniform.ts (86%)

diff --git a/src/mol-app/ui/transform/backbone.tsx b/src/mol-app/ui/transform/backbone.tsx
index 37c8e8607..6af3137f9 100644
--- a/src/mol-app/ui/transform/backbone.tsx
+++ b/src/mol-app/ui/transform/backbone.tsx
@@ -15,7 +15,8 @@ import { Toggle } from '../controls/common';
 import { BackboneEntity } from 'mol-view/state/entity';
 import { BackboneUpdate } from 'mol-view/state/transform'
 import { StateContext } from 'mol-view/state/context';
-import { ColorThemeProps, SizeThemeProps, ColorThemeNames, ColorThemeName } from 'mol-geo/theme';
+import { ColorThemeProps, ColorThemeNames, ColorThemeName } from 'mol-view/theme/color';
+import { SizeThemeProps } from 'mol-view/theme/size';
 import { Color, ColorNames } from 'mol-util/color';
 import { Slider } from '../controls/slider';
 import { VisualQuality } from 'mol-geo/representation/util';
diff --git a/src/mol-app/ui/transform/ball-and-stick.tsx b/src/mol-app/ui/transform/ball-and-stick.tsx
index d75ed5dab..382758903 100644
--- a/src/mol-app/ui/transform/ball-and-stick.tsx
+++ b/src/mol-app/ui/transform/ball-and-stick.tsx
@@ -15,7 +15,8 @@ import { Toggle } from '../controls/common';
 import { DistanceRestraintEntity } from 'mol-view/state/entity';
 import { DistanceRestraintUpdate } from 'mol-view/state/transform'
 import { StateContext } from 'mol-view/state/context';
-import { ColorThemeProps, SizeThemeProps, ColorThemeName, ColorThemeNames } from 'mol-geo/theme';
+import { ColorThemeProps, ColorThemeNames, ColorThemeName } from 'mol-view/theme/color';
+import { SizeThemeProps } from 'mol-view/theme/size';
 import { Color, ColorNames } from 'mol-util/color';
 import { Slider } from '../controls/slider';
 import { VisualQuality } from 'mol-geo/representation/util';
diff --git a/src/mol-app/ui/transform/carbohydrate.tsx b/src/mol-app/ui/transform/carbohydrate.tsx
index 03906a204..d672d4d81 100644
--- a/src/mol-app/ui/transform/carbohydrate.tsx
+++ b/src/mol-app/ui/transform/carbohydrate.tsx
@@ -15,7 +15,8 @@ import { Toggle } from '../controls/common';
 import { CarbohydrateEntity } from 'mol-view/state/entity';
 import { CarbohydrateUpdate } from 'mol-view/state/transform'
 import { StateContext } from 'mol-view/state/context';
-import { ColorThemeProps, SizeThemeProps, ColorThemeName, ColorThemeNames } from 'mol-geo/theme';
+import { ColorThemeProps, ColorThemeNames, ColorThemeName } from 'mol-view/theme/color';
+import { SizeThemeProps } from 'mol-view/theme/size';
 import { Color, ColorNames } from 'mol-util/color';
 import { Slider } from '../controls/slider';
 import { VisualQuality } from 'mol-geo/representation/util';
diff --git a/src/mol-app/ui/transform/cartoon.tsx b/src/mol-app/ui/transform/cartoon.tsx
index 4b6d7da14..32dfeba9a 100644
--- a/src/mol-app/ui/transform/cartoon.tsx
+++ b/src/mol-app/ui/transform/cartoon.tsx
@@ -15,7 +15,8 @@ import { Toggle } from '../controls/common';
 import { CartoonEntity } from 'mol-view/state/entity';
 import { CartoonUpdate } from 'mol-view/state/transform'
 import { StateContext } from 'mol-view/state/context';
-import { ColorThemeProps, SizeThemeProps, ColorThemeName, ColorThemeNames } from 'mol-geo/theme';
+import { ColorThemeProps, ColorThemeNames, ColorThemeName } from 'mol-view/theme/color';
+import { SizeThemeProps } from 'mol-view/theme/size';
 import { Color, ColorNames } from 'mol-util/color';
 import { Slider } from '../controls/slider';
 import { VisualQuality } from 'mol-geo/representation/util';
diff --git a/src/mol-app/ui/transform/distance-restraint.tsx b/src/mol-app/ui/transform/distance-restraint.tsx
index d349db4dc..374cc11b0 100644
--- a/src/mol-app/ui/transform/distance-restraint.tsx
+++ b/src/mol-app/ui/transform/distance-restraint.tsx
@@ -15,7 +15,8 @@ import { Toggle } from '../controls/common';
 import { DistanceRestraintEntity } from 'mol-view/state/entity';
 import { DistanceRestraintUpdate } from 'mol-view/state/transform'
 import { StateContext } from 'mol-view/state/context';
-import { ColorThemeProps, SizeThemeProps, ColorThemeName, ColorThemeNames } from 'mol-geo/theme';
+import { ColorThemeProps, ColorThemeNames, ColorThemeName } from 'mol-view/theme/color';
+import { SizeThemeProps } from 'mol-view/theme/size';
 import { Color, ColorNames } from 'mol-util/color';
 import { Slider } from '../controls/slider';
 import { VisualQuality } from 'mol-geo/representation/util';
diff --git a/src/mol-app/ui/transform/spacefill.tsx b/src/mol-app/ui/transform/spacefill.tsx
index b1df35898..d4a4d9e57 100644
--- a/src/mol-app/ui/transform/spacefill.tsx
+++ b/src/mol-app/ui/transform/spacefill.tsx
@@ -15,7 +15,8 @@ import { Toggle } from '../controls/common';
 import { SpacefillEntity } from 'mol-view/state/entity';
 import { SpacefillUpdate } from 'mol-view/state/transform'
 import { StateContext } from 'mol-view/state/context';
-import { ColorThemeProps, SizeThemeProps, ColorThemeName, ColorThemeNames } from 'mol-geo/theme';
+import { ColorThemeProps, ColorThemeNames, ColorThemeName } from 'mol-view/theme/color';
+import { SizeThemeProps } from 'mol-view/theme/size';
 import { Color, ColorNames } from 'mol-util/color';
 import { Slider } from '../controls/slider';
 import { VisualQuality } from 'mol-geo/representation/util';
diff --git a/src/mol-geo/representation/structure/index.ts b/src/mol-geo/representation/structure/index.ts
index bf782aab9..4433e1ebf 100644
--- a/src/mol-geo/representation/structure/index.ts
+++ b/src/mol-geo/representation/structure/index.ts
@@ -6,8 +6,9 @@
  */
 
 import { Structure } from 'mol-model/structure';
+import { ColorThemeProps } from 'mol-view/theme/color';
+import { SizeThemeProps } from 'mol-view/theme/size';
 import { Representation, RepresentationProps } from '..';
-import { ColorThemeProps, SizeThemeProps } from '../../theme';
 import { DefaultBaseProps, DefaultMeshProps } from '../util';
 
 export interface StructureRepresentation<P extends RepresentationProps = {}> extends Representation<Structure, P> { }
diff --git a/src/mol-geo/representation/structure/representation/ball-and-stick.ts b/src/mol-geo/representation/structure/representation/ball-and-stick.ts
index 0b61537b1..d26ab0968 100644
--- a/src/mol-geo/representation/structure/representation/ball-and-stick.ts
+++ b/src/mol-geo/representation/structure/representation/ball-and-stick.ts
@@ -12,8 +12,8 @@ import { Structure, Unit } from 'mol-model/structure';
 import { Task } from 'mol-task';
 import { Loci, isEmptyLoci } from 'mol-model/loci';
 import { MarkerAction } from '../../../util/marker-data';
-import { SizeThemeProps } from '../../../theme';
 import { InterUnitLinkVisual } from '../visual/inter-unit-link-cylinder';
+import { SizeThemeProps } from 'mol-view/theme/size';
 
 export const DefaultBallAndStickProps = {
     ...DefaultElementSphereProps,
diff --git a/src/mol-geo/representation/structure/representation/distance-restraint.ts b/src/mol-geo/representation/structure/representation/distance-restraint.ts
index 31c8d5d4e..bf16518eb 100644
--- a/src/mol-geo/representation/structure/representation/distance-restraint.ts
+++ b/src/mol-geo/representation/structure/representation/distance-restraint.ts
@@ -10,8 +10,8 @@ import { Structure } from 'mol-model/structure';
 import { Task } from 'mol-task';
 import { Loci } from 'mol-model/loci';
 import { MarkerAction } from '../../../util/marker-data';
-import { SizeThemeProps } from '../../../theme';
 import { CrossLinkRestraintVisual, DefaultCrossLinkRestraintProps } from '../visual/cross-link-restraint-cylinder';
+import { SizeThemeProps } from 'mol-view/theme/size';
 
 export const DefaultDistanceRestraintProps = {
     ...DefaultCrossLinkRestraintProps,
diff --git a/src/mol-geo/representation/structure/visual/carbohydrate-link-cylinder.ts b/src/mol-geo/representation/structure/visual/carbohydrate-link-cylinder.ts
index dab665622..547763c76 100644
--- a/src/mol-geo/representation/structure/visual/carbohydrate-link-cylinder.ts
+++ b/src/mol-geo/representation/structure/visual/carbohydrate-link-cylinder.ts
@@ -10,13 +10,13 @@ import { RuntimeContext } from 'mol-task'
 import { Mesh } from '../../../shape/mesh';
 import { PickingId } from '../../../util/picking';
 import { Loci, EmptyLoci } from 'mol-model/loci';
-import { SizeThemeProps } from '../../../theme';
 import { DefaultMeshProps } from '../../util';
 import { Vec3 } from 'mol-math/linear-algebra';
 import { LocationIterator } from './util/location-iterator';
 import { createLinkCylinderMesh, DefaultLinkCylinderProps, LinkCylinderProps } from './util/link';
 import { OrderedSet, Interval } from 'mol-data/int';
 import { ComplexMeshVisual } from '../complex-visual';
+import { SizeThemeProps } from 'mol-view/theme/size';
 
 // TODO create seperate visual
 // for (let i = 0, il = carbohydrates.terminalLinks.length; i < il; ++i) {
diff --git a/src/mol-geo/representation/structure/visual/carbohydrate-symbol-mesh.ts b/src/mol-geo/representation/structure/visual/carbohydrate-symbol-mesh.ts
index 7eba34355..f4336e8c6 100644
--- a/src/mol-geo/representation/structure/visual/carbohydrate-symbol-mesh.ts
+++ b/src/mol-geo/representation/structure/visual/carbohydrate-symbol-mesh.ts
@@ -10,7 +10,6 @@ import { RuntimeContext } from 'mol-task'
 import { Mesh } from '../../../shape/mesh';
 import { PickingId } from '../../../util/picking';
 import { Loci, EmptyLoci } from 'mol-model/loci';
-import { SizeThemeProps } from '../../../theme';
 import { DefaultMeshProps } from '../../util';
 import { MeshBuilder } from '../../../shape/mesh-builder';
 import { Vec3, Mat4 } from 'mol-math/linear-algebra';
@@ -18,6 +17,7 @@ import { getSaccharideShape, SaccharideShapes } from 'mol-model/structure/struct
 import { LocationIterator } from './util/location-iterator';
 import { OrderedSet, Interval } from 'mol-data/int';
 import { ComplexMeshVisual } from '../complex-visual';
+import { SizeThemeProps } from 'mol-view/theme/size';
 
 const t = Mat4.identity()
 const sVec = Vec3.zero()
diff --git a/src/mol-geo/representation/structure/visual/cross-link-restraint-cylinder.ts b/src/mol-geo/representation/structure/visual/cross-link-restraint-cylinder.ts
index f93a8bbfe..bfa5997a3 100644
--- a/src/mol-geo/representation/structure/visual/cross-link-restraint-cylinder.ts
+++ b/src/mol-geo/representation/structure/visual/cross-link-restraint-cylinder.ts
@@ -12,10 +12,10 @@ import { Mesh } from '../../../shape/mesh';
 import { PickingId } from '../../../util/picking';
 import { Vec3 } from 'mol-math/linear-algebra';
 import { Loci, EmptyLoci } from 'mol-model/loci';
-import { SizeThemeProps } from '../../../theme';
 import { ComplexMeshVisual } from '../complex-visual';
 import { LocationIterator } from './util/location-iterator';
 import { Interval } from 'mol-data/int';
+import { SizeThemeProps } from 'mol-view/theme/size';
 
 async function createCrossLinkRestraintCylinderMesh(ctx: RuntimeContext, structure: Structure, props: LinkCylinderProps, mesh?: Mesh) {
 
diff --git a/src/mol-geo/representation/structure/visual/element-point.ts b/src/mol-geo/representation/structure/visual/element-point.ts
index 01764652e..57306c4b9 100644
--- a/src/mol-geo/representation/structure/visual/element-point.ts
+++ b/src/mol-geo/representation/structure/visual/element-point.ts
@@ -11,7 +11,6 @@ import { Unit } from 'mol-model/structure';
 import { RuntimeContext } from 'mol-task'
 
 import { UnitsVisual, DefaultStructureProps } from '..';
-import { SizeThemeProps } from '../../../theme';
 import { getElementLoci } from './util/element';
 import { createTransforms, createColors, createSizes } from './util/common';
 import { deepEqual, defaults } from 'mol-util';
@@ -23,6 +22,7 @@ import { MarkerAction, createMarkers } from '../../../util/marker-data';
 import { Vec3 } from 'mol-math/linear-algebra';
 import { fillSerial } from 'mol-util/array';
 import { StructureElementIterator } from './util/location-iterator';
+import { SizeThemeProps } from 'mol-view/theme/size';
 
 export const DefaultPointProps = {
     ...DefaultStructureProps,
diff --git a/src/mol-geo/representation/structure/visual/inter-unit-link-cylinder.ts b/src/mol-geo/representation/structure/visual/inter-unit-link-cylinder.ts
index 2ace15d06..ca09e68c3 100644
--- a/src/mol-geo/representation/structure/visual/inter-unit-link-cylinder.ts
+++ b/src/mol-geo/representation/structure/visual/inter-unit-link-cylinder.ts
@@ -12,10 +12,10 @@ import { Mesh } from '../../../shape/mesh';
 import { PickingId } from '../../../util/picking';
 import { Vec3 } from 'mol-math/linear-algebra';
 import { Loci, EmptyLoci } from 'mol-model/loci';
-import { SizeThemeProps } from '../../../theme';
 import { LinkIterator } from './util/location-iterator';
 import { ComplexMeshVisual } from '../complex-visual';
 import { Interval } from 'mol-data/int';
+import { SizeThemeProps } from 'mol-view/theme/size';
 
 async function createInterUnitLinkCylinderMesh(ctx: RuntimeContext, structure: Structure, props: LinkCylinderProps, mesh?: Mesh) {
     const links = structure.links
diff --git a/src/mol-geo/representation/structure/visual/intra-unit-link-cylinder.ts b/src/mol-geo/representation/structure/visual/intra-unit-link-cylinder.ts
index ec5c170e5..e9a1ccae0 100644
--- a/src/mol-geo/representation/structure/visual/intra-unit-link-cylinder.ts
+++ b/src/mol-geo/representation/structure/visual/intra-unit-link-cylinder.ts
@@ -13,10 +13,10 @@ import { Mesh } from '../../../shape/mesh';
 import { PickingId } from '../../../util/picking';
 import { Vec3 } from 'mol-math/linear-algebra';
 import { Loci, EmptyLoci } from 'mol-model/loci';
-import { SizeThemeProps } from '../../../theme';
 import { LinkIterator } from './util/location-iterator';
 import { UnitsMeshVisual, DefaultUnitsMeshProps } from '../units-visual';
 import { Interval } from 'mol-data/int';
+import { SizeThemeProps } from 'mol-view/theme/size';
 
 async function createIntraUnitLinkCylinderMesh(ctx: RuntimeContext, unit: Unit, props: LinkCylinderProps, mesh?: Mesh) {
     if (!Unit.isAtomic(unit)) return Mesh.createEmpty(mesh)
diff --git a/src/mol-geo/representation/structure/visual/util/common.ts b/src/mol-geo/representation/structure/visual/util/common.ts
index 3a578e16e..fb7f11bf7 100644
--- a/src/mol-geo/representation/structure/visual/util/common.ts
+++ b/src/mol-geo/representation/structure/visual/util/common.ts
@@ -10,8 +10,6 @@ import { Mat4 } from 'mol-math/linear-algebra'
 
 import { createUniformColor, ColorData, createElementColor, createElementInstanceColor, createInstanceColor } from '../../../../util/color-data';
 import { createUniformSize, SizeData, createElementSize, createElementInstanceSize, createInstanceSize } from '../../../../util/size-data';
-import { ColorThemeProps, SizeThemeProps } from '../../../../theme';
-import { ColorTheme } from '../../../../theme/structure/color';
 import { ValueCell } from 'mol-util';
 import { LocationIterator } from './location-iterator';
 import { Mesh } from '../../../../shape/mesh';
@@ -21,7 +19,8 @@ import { MeshProps, createMeshValues, createRenderableState } from '../../../uti
 import { StructureProps } from '../..';
 import { createMarkers } from '../../../../util/marker-data';
 import { createMeshRenderObject } from 'mol-gl/render-object';
-import { SizeTheme } from '../../../../theme/structure/size';
+import { ColorThemeProps, ColorTheme } from 'mol-view/theme/color';
+import { SizeThemeProps, SizeTheme } from 'mol-view/theme/size';
 
 export function createTransforms({ units }: Unit.SymmetryGroup, transforms?: ValueCell<Float32Array>) {
     const unitCount = units.length
diff --git a/src/mol-geo/representation/structure/visual/util/element.ts b/src/mol-geo/representation/structure/visual/util/element.ts
index 4e03cc13a..899347548 100644
--- a/src/mol-geo/representation/structure/visual/util/element.ts
+++ b/src/mol-geo/representation/structure/visual/util/element.ts
@@ -13,8 +13,7 @@ import { MeshBuilder } from '../../../../shape/mesh-builder';
 import { Loci, EmptyLoci } from 'mol-model/loci';
 import { Interval, OrderedSet } from 'mol-data/int';
 import { PickingId } from '../../../../util/picking';
-import { SizeThemeProps } from '../../../../theme';
-import { SizeTheme } from '../../../../theme/structure/size';
+import { SizeTheme, SizeThemeProps } from 'mol-view/theme/size';
 
 export interface ElementSphereMeshProps {
     sizeTheme: SizeThemeProps,
diff --git a/src/mol-geo/theme/index.ts b/src/mol-geo/theme/index.ts
deleted file mode 100644
index 0f08e600d..000000000
--- a/src/mol-geo/theme/index.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-/**
- * Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
- *
- * @author Alexander Rose <alexander.rose@weirdbyte.de>
- */
-
-import { Color } from 'mol-util/color';
-import { Structure } from 'mol-model/structure';
-
-export interface ColorThemeProps {
-    name: 'element-index' | 'chain-id'| 'unit-index' | 'uniform' | 'carbohydrate-symbol' | 'element-symbol'
-    domain?: [number, number]
-    value?: Color
-    structure?: Structure
-}
-
-export const ColorThemeInfo = {
-    'element-index': {},
-    'carbohydrate-symbol': {},
-    'chain-id': {},
-    'element-symbol': {},
-    'unit-index': {},
-    'uniform': {}
-}
-export type ColorThemeName = keyof typeof ColorThemeInfo
-export const ColorThemeNames = Object.keys(ColorThemeInfo)
-
-//
-
-export interface SizeThemeProps {
-    name: 'physical' | 'uniform'
-    value?: number
-    factor?: number
-    structure?: Structure
-}
-
-export const SizeThemeInfo = {
-    'physical': {},
-    'uniform': {}
-}
-export type SizeThemeName = keyof typeof SizeThemeInfo
-export const SizeThemeNames = Object.keys(SizeThemeInfo)
\ No newline at end of file
diff --git a/src/mol-geo/theme/structure/color/index.ts b/src/mol-geo/theme/structure/color/index.ts
deleted file mode 100644
index 70da74a02..000000000
--- a/src/mol-geo/theme/structure/color/index.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-/**
- * Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
- *
- * @author Alexander Rose <alexander.rose@weirdbyte.de>
- */
-
-import { ColorThemeProps } from '../..';
-
-import { ElementIndexColorTheme } from './element-index';
-import { CarbohydrateSymbolColorTheme } from './carbohydrate-symbol';
-import { ChainIdColorTheme } from './chain-id';
-import { ElementSymbolColorTheme } from './element-symbol';
-import { UnitIndexColorTheme } from './unit-index';
-import { UniformColorTheme } from './uniform';
-import { ColorType, LocationColor } from '../../../util/color-data';
-
-export interface ColorTheme {
-    kind: ColorType
-    color: LocationColor
-}
-
-export function ColorTheme(props: ColorThemeProps): ColorTheme {
-    switch (props.name) {
-        case 'element-index': return ElementIndexColorTheme(props)
-        case 'carbohydrate-symbol': return CarbohydrateSymbolColorTheme(props)
-        case 'chain-id': return ChainIdColorTheme(props)
-        case 'element-symbol': return ElementSymbolColorTheme(props)
-        case 'unit-index': return UnitIndexColorTheme(props)
-        case 'uniform': return UniformColorTheme(props)
-    }
-}
\ No newline at end of file
diff --git a/src/mol-geo/theme/structure/size/index.ts b/src/mol-geo/theme/structure/size/index.ts
deleted file mode 100644
index a67c32e8c..000000000
--- a/src/mol-geo/theme/structure/size/index.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-/**
- * Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
- *
- * @author Alexander Rose <alexander.rose@weirdbyte.de>
- */
-
-import { SizeType, LocationSize } from '../../../util/size-data';
-import { SizeThemeProps } from '../..';
-import { PhysicalSizeTheme } from './physical';
-import { UniformSizeTheme } from './uniform';
-
-export interface SizeTheme {
-    kind: SizeType
-    size: LocationSize
-}
-
-export function SizeTheme(props: SizeThemeProps): SizeTheme {
-    switch (props.name) {
-        case 'physical': return PhysicalSizeTheme(props)
-        case 'uniform': return UniformSizeTheme(props)
-    }
-}
\ No newline at end of file
diff --git a/src/mol-view/theme/color.ts b/src/mol-view/theme/color.ts
new file mode 100644
index 000000000..f7ef557a5
--- /dev/null
+++ b/src/mol-view/theme/color.ts
@@ -0,0 +1,50 @@
+/**
+ * Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ *
+ * @author Alexander Rose <alexander.rose@weirdbyte.de>
+ */
+
+import { Color } from 'mol-util/color';
+import { Structure } from 'mol-model/structure';
+import { ColorType, LocationColor } from 'mol-geo/util/color-data';
+
+import { ElementIndexColorTheme } from './color/element-index';
+import { CarbohydrateSymbolColorTheme } from './color/carbohydrate-symbol';
+import { ChainIdColorTheme } from './color/chain-id';
+import { ElementSymbolColorTheme } from './color/element-symbol';
+import { UnitIndexColorTheme } from './color/unit-index';
+import { UniformColorTheme } from './color/uniform';
+
+export interface ColorTheme {
+    kind: ColorType
+    color: LocationColor
+}
+
+export function ColorTheme(props: ColorThemeProps): ColorTheme {
+    switch (props.name) {
+        case 'element-index': return ElementIndexColorTheme(props)
+        case 'carbohydrate-symbol': return CarbohydrateSymbolColorTheme(props)
+        case 'chain-id': return ChainIdColorTheme(props)
+        case 'element-symbol': return ElementSymbolColorTheme(props)
+        case 'unit-index': return UnitIndexColorTheme(props)
+        case 'uniform': return UniformColorTheme(props)
+    }
+}
+
+export interface ColorThemeProps {
+    name: 'element-index' | 'chain-id'| 'unit-index' | 'uniform' | 'carbohydrate-symbol' | 'element-symbol'
+    domain?: [number, number]
+    value?: Color
+    structure?: Structure
+}
+
+export const ColorThemeInfo = {
+    'element-index': {},
+    'carbohydrate-symbol': {},
+    'chain-id': {},
+    'element-symbol': {},
+    'unit-index': {},
+    'uniform': {}
+}
+export type ColorThemeName = keyof typeof ColorThemeInfo
+export const ColorThemeNames = Object.keys(ColorThemeInfo)
\ No newline at end of file
diff --git a/src/mol-geo/theme/structure/color/carbohydrate-symbol.ts b/src/mol-view/theme/color/carbohydrate-symbol.ts
similarity index 93%
rename from src/mol-geo/theme/structure/color/carbohydrate-symbol.ts
rename to src/mol-view/theme/color/carbohydrate-symbol.ts
index d6487d50c..5bdb28204 100644
--- a/src/mol-geo/theme/structure/color/carbohydrate-symbol.ts
+++ b/src/mol-view/theme/color/carbohydrate-symbol.ts
@@ -6,11 +6,10 @@
 
 import { StructureElement, Link, ElementIndex, Unit } from 'mol-model/structure';
 
-import { ColorThemeProps } from '../..';
 import { SaccharideColors } from 'mol-model/structure/structure/carbohydrates/constants';
 import { Location } from 'mol-model/location';
-import { ColorTheme } from '.';
-import { LocationColor } from '../../../util/color-data';
+import { ColorThemeProps, ColorTheme } from '../color';
+import { LocationColor } from 'mol-geo/util/color-data';
 
 const DefaultColor = 0xCCCCCC;
 
diff --git a/src/mol-geo/theme/structure/color/chain-id.ts b/src/mol-view/theme/color/chain-id.ts
similarity index 95%
rename from src/mol-geo/theme/structure/color/chain-id.ts
rename to src/mol-view/theme/color/chain-id.ts
index 32d347a1d..e4f6e0c24 100644
--- a/src/mol-geo/theme/structure/color/chain-id.ts
+++ b/src/mol-view/theme/color/chain-id.ts
@@ -8,8 +8,7 @@ import { Unit, StructureProperties, StructureElement, Link } from 'mol-model/str
 
 import { ColorScale, Color } from 'mol-util/color';
 import { Location } from 'mol-model/location';
-import { ColorThemeProps } from '../..';
-import { ColorTheme } from '.';
+import { ColorThemeProps, ColorTheme } from '../color';
 
 function getAsymId(unit: Unit): StructureElement.Property<string> {
     switch (unit.kind) {
diff --git a/src/mol-geo/theme/structure/color/element-index.ts b/src/mol-view/theme/color/element-index.ts
similarity index 93%
rename from src/mol-geo/theme/structure/color/element-index.ts
rename to src/mol-view/theme/color/element-index.ts
index 388d4ce1c..6f27bb605 100644
--- a/src/mol-geo/theme/structure/color/element-index.ts
+++ b/src/mol-view/theme/color/element-index.ts
@@ -6,11 +6,10 @@
 
 import { ColorScale, Color } from 'mol-util/color';
 import { Location } from 'mol-model/location';
-import { ColorThemeProps } from '../..';
 import { StructureElement, Link, Unit } from 'mol-model/structure';
 import { OrderedSet } from 'mol-data/int';
-import { ColorTheme } from '.';
-import { LocationColor } from '../../../util/color-data';
+import { LocationColor } from 'mol-geo/util/color-data';
+import { ColorThemeProps, ColorTheme } from '../color';
 
 const DefaultColor = 0xCCCCCC;
 
diff --git a/src/mol-geo/theme/structure/color/element-symbol.ts b/src/mol-view/theme/color/element-symbol.ts
similarity index 97%
rename from src/mol-geo/theme/structure/color/element-symbol.ts
rename to src/mol-view/theme/color/element-symbol.ts
index 009aac723..1bc7f95ea 100644
--- a/src/mol-geo/theme/structure/color/element-symbol.ts
+++ b/src/mol-view/theme/color/element-symbol.ts
@@ -8,8 +8,7 @@ import { ElementSymbol } from 'mol-model/structure/model/types';
 import { Color } from 'mol-util/color';
 import { StructureElement, Unit, Link } from 'mol-model/structure';
 import { Location } from 'mol-model/location';
-import { ColorThemeProps } from '../..';
-import { ColorTheme } from '.';
+import { ColorThemeProps, ColorTheme } from '../color';
 
 // from Jmol http://jmol.sourceforge.net/jscolors/ (or 0xFFFFFF)
 export const ElementSymbolColors: { [k: string]: Color } = {
diff --git a/src/mol-geo/theme/structure/color/uniform.ts b/src/mol-view/theme/color/uniform.ts
similarity index 84%
rename from src/mol-geo/theme/structure/color/uniform.ts
rename to src/mol-view/theme/color/uniform.ts
index 2c1e700cf..bfc13f32c 100644
--- a/src/mol-geo/theme/structure/color/uniform.ts
+++ b/src/mol-view/theme/color/uniform.ts
@@ -4,8 +4,7 @@
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
 
-import { ColorThemeProps } from '../..';
-import { ColorTheme } from '.';
+import { ColorTheme, ColorThemeProps } from '../color';
 
 const DefaultColor = 0xCCCCCC;
 
diff --git a/src/mol-geo/theme/structure/color/unit-index.ts b/src/mol-view/theme/color/unit-index.ts
similarity index 89%
rename from src/mol-geo/theme/structure/color/unit-index.ts
rename to src/mol-view/theme/color/unit-index.ts
index d77021e47..91f046526 100644
--- a/src/mol-geo/theme/structure/color/unit-index.ts
+++ b/src/mol-view/theme/color/unit-index.ts
@@ -6,10 +6,9 @@
 
 import { ColorScale, Color } from 'mol-util/color';
 import { Location } from 'mol-model/location';
-import { ColorThemeProps } from '../..';
 import { Unit, StructureElement, Link } from 'mol-model/structure';
-import { ColorTheme } from '.';
-import { LocationColor } from '../../../util/color-data';
+import { LocationColor } from 'mol-geo/util/color-data';
+import { ColorTheme, ColorThemeProps } from '../color';
 
 const DefaultColor = 0xCCCCCC;
 
diff --git a/src/mol-view/theme/size.ts b/src/mol-view/theme/size.ts
new file mode 100644
index 000000000..059c8b04f
--- /dev/null
+++ b/src/mol-view/theme/size.ts
@@ -0,0 +1,37 @@
+/**
+ * Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ *
+ * @author Alexander Rose <alexander.rose@weirdbyte.de>
+ */
+
+import { Structure } from 'mol-model/structure';
+import { SizeType, LocationSize } from 'mol-geo/util/size-data';
+
+import { PhysicalSizeTheme } from './size/physical';
+import { UniformSizeTheme } from './size/uniform';
+
+export interface SizeTheme {
+    kind: SizeType
+    size: LocationSize
+}
+
+export function SizeTheme(props: SizeThemeProps): SizeTheme {
+    switch (props.name) {
+        case 'physical': return PhysicalSizeTheme(props)
+        case 'uniform': return UniformSizeTheme(props)
+    }
+}
+
+export interface SizeThemeProps {
+    name: 'physical' | 'uniform'
+    value?: number
+    factor?: number
+    structure?: Structure
+}
+
+export const SizeThemeInfo = {
+    'physical': {},
+    'uniform': {}
+}
+export type SizeThemeName = keyof typeof SizeThemeInfo
+export const SizeThemeNames = Object.keys(SizeThemeInfo)
\ No newline at end of file
diff --git a/src/mol-geo/theme/structure/size/physical.ts b/src/mol-view/theme/size/physical.ts
similarity index 95%
rename from src/mol-geo/theme/structure/size/physical.ts
rename to src/mol-view/theme/size/physical.ts
index 1e62e4847..9ed52cf06 100644
--- a/src/mol-geo/theme/structure/size/physical.ts
+++ b/src/mol-view/theme/size/physical.ts
@@ -6,8 +6,7 @@
 
 import { StructureElement, Unit, StructureProperties, Link } from 'mol-model/structure';
 import { Location } from 'mol-model/location';
-import { SizeTheme } from '.';
-import { SizeThemeProps } from '../..';
+import { SizeThemeProps, SizeTheme } from '../size';
 
 const DefaultSize = 1
 const DefaultFactor = 1
diff --git a/src/mol-geo/theme/structure/size/uniform.ts b/src/mol-view/theme/size/uniform.ts
similarity index 86%
rename from src/mol-geo/theme/structure/size/uniform.ts
rename to src/mol-view/theme/size/uniform.ts
index e75b2a079..f9810f2e7 100644
--- a/src/mol-geo/theme/structure/size/uniform.ts
+++ b/src/mol-view/theme/size/uniform.ts
@@ -4,8 +4,7 @@
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
 
-import { SizeThemeProps } from '../..';
-import { SizeTheme } from '.';
+import { SizeTheme, SizeThemeProps } from '../size';
 
 const DefaultSize = 1
 const DefaultFactor = 1
-- 
GitLab