Merge remote-tracking branch 'upstream/master' into modelserverfixes

package-lock.json

@@ -1,11 +1,11 @@
 {
   "name": "molstar",
-  "version": "1.2.7",
+  "version": "1.2.8",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
-      "version": "1.2.7",
+      "version": "1.2.8",
       "license": "MIT",
       "dependencies": {
         "@types/argparse": "^1.0.38",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "molstar",
-  "version": "1.2.7",
+  "version": "1.2.8",
   "description": "A comprehensive macromolecular library.",
   "homepage": "https://github.com/molstar/molstar#readme",
   "repository": {

src/mol-canvas3d/canvas3d.ts

@@ -47,7 +47,7 @@ export const Canvas3DParams = {
             on: PD.Group(StereoCameraParams),
             off: PD.Group({})
         }, { cycle: true, hideIf: p => p?.mode !== 'perspective' }),
-        manualReset: PD.Boolean(false, { isHidden: true })
+        manualReset: PD.Boolean(false, { isHidden: true }),
     }, { pivot: 'mode' }),
     cameraFog: PD.MappedStatic('on', {
         on: PD.Group({
@@ -117,6 +117,7 @@ interface Canvas3D {
 
     notifyDidDraw: boolean,
     readonly didDraw: BehaviorSubject<now.Timestamp>
+    readonly commited: BehaviorSubject<now.Timestamp>
     readonly reprCount: BehaviorSubject<number>
     readonly resized: BehaviorSubject<any>
 
@@ -218,6 +219,7 @@ namespace Canvas3D {
 
         let startTime = now();
         const didDraw = new BehaviorSubject<now.Timestamp>(0 as now.Timestamp);
+        const commited = new BehaviorSubject<now.Timestamp>(0 as now.Timestamp);
 
         const { gl, contextRestored } = webgl;
 
@@ -391,6 +393,7 @@ namespace Canvas3D {
                     draw(true);
                     forceDrawAfterAllCommited = false;
                 }
+                commited.next(now());
             }
         }
 
@@ -616,6 +619,7 @@ namespace Canvas3D {
             get notifyDidDraw() { return notifyDidDraw; },
             set notifyDidDraw(v: boolean) { notifyDidDraw = v; },
             didDraw,
+            commited,
             reprCount,
             resized,
             setProps: (properties, doNotRequestDraw = false) => {

src/mol-plugin-ui/sequence.tsx

@@ -377,9 +377,16 @@ export class SequenceView extends PluginUIComponent<{ defaultMode?: SequenceView
 
             <NonEmptySequenceWrapper>
                 {sequenceWrappers.map((s, i) => {
-                    return typeof s.wrapper === 'string'
+                    const elem = typeof s.wrapper === 'string'
                         ? <div key={i} className='msp-sequence-wrapper'>{s.wrapper}</div>
-                        : <Sequence key={i} sequenceWrapper={s.wrapper} label={values.mode === 'single' ? void 0 : s.label} />;
+                        : <Sequence key={i} sequenceWrapper={s.wrapper} />;
+
+                    if (values.mode === 'single') return elem;
+
+                    return <>
+                        <div className='msp-sequence-chain-label'>{s.label}</div>
+                        {elem}
+                    </>;
                 })}
             </NonEmptySequenceWrapper>
         </div>;

src/mol-plugin-ui/sequence/sequence.tsx

@@ -20,7 +20,6 @@ type SequenceProps = {
     sequenceWrapper: SequenceWrapper.Any,
     sequenceNumberPeriod?: number,
     hideSequenceNumbers?: boolean,
-    label?: string
 }
 
 /** Note, if this is changed, the CSS for `msp-sequence-number` needs adjustment too */
@@ -301,7 +300,6 @@ export class Sequence<P extends SequenceProps> extends PluginUIComponent<P> {
             onMouseLeave={this.mouseLeave}
             ref={this.parentDiv}
         >
-            {this.props.label && <div className='msp-sequence-label'>{this.props.label}</div>}
             {elems}
         </div>;
     }

src/mol-plugin-ui/skin/base/components/sequence.scss

@@ -61,6 +61,16 @@ $sequence-select-height: 24px;
     right: 0;
 }
 
+.msp-sequence-chain-label {
+    margin-left: $control-spacing;
+    margin-top: $control-spacing;
+    user-select: none;
+    color: $sequence-number-color;
+    font-size: 90%;
+    line-height: 90%;
+    padding-left: 0.2em;
+}
+
 .msp-sequence-wrapper {
     span {
         cursor: pointer;
@@ -81,7 +91,7 @@ $sequence-select-height: 24px;
         padding-bottom: 1em;
         padding-left: 0.2em;
     }
-
+    
     .msp-sequence-number {
         color: $sequence-number-color;
         word-break: keep-all;