Merge branch 'master' of https://github.com/molstar/molstar

src/mol-model-formats/structure/mmcif/parser.ts

@@ -23,7 +23,7 @@ import { getSecondaryStructure } from './secondary-structure';
 import { getSequence } from './sequence';
 import { sortAtomSite } from './sort';
 import { StructConn } from './bonds/struct_conn';
-import { getMoleculeType, MoleculeType, getEntityType, getEntitySubtype } from '../../../mol-model/structure/model/types';
+import { getMoleculeType, MoleculeType, getEntityType, getEntitySubtype, getDefaultChemicalComponent } from '../../../mol-model/structure/model/types';
 import { ModelFormat } from '../format';
 import { SaccharideComponentMap, SaccharideComponent, SaccharidesSnfgMap, SaccharideCompIdMap, UnknownSaccharideComponent } from '../../../mol-model/structure/structure/carbohydrates/constants';
 import mmCIF_Format = ModelFormat.mmCIF
@@ -127,9 +127,17 @@ function getMissingResidues(format: mmCIF_Format): Model['properties']['missingR
 function getChemicalComponentMap(format: mmCIF_Format): Model['properties']['chemicalComponentMap'] {
     const map = new Map<string, ChemicalComponent>();
     const { chem_comp } = format.data
-    const { id } = chem_comp
-    for (let i = 0, il = id.rowCount; i < il; ++i) {
-        map.set(id.value(i), Table.getRow(chem_comp, i))
+
+    if (chem_comp._rowCount > 0) {
+        const { id } = chem_comp
+        for (let i = 0, il = id.rowCount; i < il; ++i) {
+            map.set(id.value(i), Table.getRow(chem_comp, i))
+        }
+    } else {
+        const uniqueNames = getUniqueComponentNames(format);
+        uniqueNames.forEach(n => {
+            map.set(n, getDefaultChemicalComponent(n));
+        });
     }
     return map
 }

src/mol-model/structure/model/types.ts

@@ -9,7 +9,7 @@ import BitFlags from '../../../mol-util/bit-flags'
 import { SaccharideCompIdMap } from '../structure/carbohydrates/constants';
 import { mmCIF_Schema } from '../../../mol-io/reader/cif/schema/mmcif';
 import { SetUtils } from '../../../mol-util/set';
-import { EntitySubtype } from './properties/common';
+import { EntitySubtype, ChemicalComponent } from './properties/common';
 
 const _esCache = (function () {
     const cache = Object.create(null);
@@ -245,6 +245,20 @@ export function getComponentType(compId: string): mmCIF_Schema['chem_comp']['typ
     }
 }
 
+export function getDefaultChemicalComponent(compId: string): ChemicalComponent {
+    // TODO: this is to make the chem_comp_type property work if chem_comp category is not present.
+    // should we try to set the formula etc better?
+    return {
+        formula: '',
+        formula_weight: 0,
+        id: compId,
+        name: compId,
+        mon_nstd_flag: 'n',
+        pdbx_synonyms: [],
+        type: getComponentType(compId)
+    };
+}
+
 export function getEntityType(compId: string): mmCIF_Schema['entity']['type']['T'] {
     compId = compId.toUpperCase()
     if (WaterNames.has(compId)) {

src/mol-plugin/behavior/dynamic/volume-streaming/behavior.ts

@@ -213,7 +213,7 @@ export namespace VolumeStreaming {
             });
 
             this.subscribeObservable(this.plugin.behaviors.interaction.click, ({ current, buttons, modifiers }) => {
-                if (!Binding.match(this.params.bindings.clickVolumeAroundOnly || DefaultBindings.clickVolumeAroundOnly, buttons, modifiers)) return;
+                if (!Binding.match((this.params.bindings && this.params.bindings.clickVolumeAroundOnly) || DefaultBindings.clickVolumeAroundOnly, buttons, modifiers)) return;
                 if (this.params.view.name !== 'selection-box') {
                     this.lastLoci = this.getNormalizedLoci(current.loci);
                 } else {

src/mol-plugin/skin/base/components/temp.scss

@@ -225,7 +225,16 @@
         float: left;
         margin-right: $control-spacing;
         position: relative;
-        background: $default-background;
+        // background: $default-background;
+
+        > div:first-child {
+            position: relative;
+            display: inline-block;
+
+            > button {
+                position: relative;
+            }
+        }
 
         .msp-animation-viewport-controls-select {
             width: 290px;

src/mol-plugin/skin/base/components/viewport.scss

@@ -34,16 +34,17 @@
     right: $control-spacing;
     top: $control-spacing;
     width: 32px;
-    background: $default-background;
 }
 
 .msp-viewport-controls-buttons {
     text-align: right;
+    position: relative;
 
     > button {
         padding: 0;
         text-align: center;
         width: $row-height;
+        position: relative;
     }
 
     .msp-btn-link-toggle-off {
@@ -55,6 +56,16 @@
     }
 }
 
+.msp-semi-transparent-background {    
+    background: $default-background;
+    opacity: 0.2;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+}
+
 .msp-viewport-controls-scene-options {
     overflow-y: auto;
     max-height: 400px;

src/mol-plugin/ui/controls.tsx

@@ -223,14 +223,17 @@ export class AnimationViewportControls extends PluginUIComponent<{}, { isEmpty:
     render() {
         // if (!this.state.show) return null;
         const isPlaying = this.plugin.state.snapshots.state.isPlaying;
-        if (isPlaying) return null;
+        if (isPlaying || this.state.isEmpty) return null;
 
         const isAnimating = this.state.isAnimating;
 
         return <div className='msp-animation-viewport-controls'>
-            <IconButton icon={isAnimating || isPlaying ? 'stop' : 'tape'} title={isAnimating ? 'Stop' : 'Select Animation'}
-                onClick={isAnimating || isPlaying ? this.stop : this.toggleExpanded}
-                disabled={isAnimating|| isPlaying ? false : this.state.isUpdating || this.state.isPlaying || this.state.isEmpty} />
+            <div>
+                <div className='msp-semi-transparent-background' />
+                <IconButton icon={isAnimating || isPlaying ? 'stop' : 'tape'} title={isAnimating ? 'Stop' : 'Select Animation'}
+                    onClick={isAnimating || isPlaying ? this.stop : this.toggleExpanded}
+                    disabled={isAnimating|| isPlaying ? false : this.state.isUpdating || this.state.isPlaying || this.state.isEmpty} />
+            </div>
             {(this.state.isExpanded && !this.state.isUpdating) && <div className='msp-animation-viewport-controls-select'>
                 <AnimationControls onStart={this.toggleExpanded} />
             </div>}

src/mol-plugin/ui/viewport.tsx

@@ -76,6 +76,7 @@ export class ViewportControls extends PluginUIComponent<ViewportControlsProps, V
     render() {
         return <div className={'msp-viewport-controls'} onMouseMove={this.onMouseMove}>
             <div className='msp-viewport-controls-buttons'>
+                <div className='msp-semi-transparent-background' />
                 {this.icon('reset-scene', this.resetCamera, 'Reset Camera')}
                 {this.icon('tools', this.toggleControls, 'Toggle Controls', this.plugin.layout.state.showControls)}
                 {this.icon('expand-layout', this.toggleExpanded, 'Toggle Expanded', this.plugin.layout.state.isExpanded)}