molstar 4.2.0 → 4.3.0

package/lib/mol-plugin-ui/skin/base/variables.scss

@@ -1,89 +1,89 @@
-
-// measures
-
-$control-label-width:   110px;
-$control-label-short-width:   70px;
-$row-height:            32px;
-$control-spacing:       10px;
-$entity-subtree-offset: 8px;
-$info-vertical-padding: 3px;
-$slider-border-radius-base: 6px;
-
-// layout
-$expanded-top-height:    100px;
-$expanded-bottom-height: 70px; // 3 * $row-height + 2;
-$expanded-right-width:   300px;
-$expanded-left-width:    330px;
-
-$collapsed-left-width:   $row-height;
-
-$expanded-portrait-bottom-height: 10 * ($row-height + 1) + 3 * $control-spacing + 1;
-$expanded-portrait-top-height:    3 * $row-height + 1;
-
-$standard-bottom-height: 8 * ($row-height + 1) + 3 * $control-spacing + 1;
-$standard-top-height:    3 * $row-height + 1;
-
-
-$color-accent-cyan:      color-lower-contrast(#95a5a6, 15%);
-$color-accent-red:       color-lower-contrast(#e74c3c, 15%);
-$color-accent-gray:      color-lower-contrast(#34495e, 10%);
-$color-accent-green:     color-lower-contrast(#2ecc71, 10%);
-$color-accent-purple:    color-lower-contrast(#9b59b6, 10%);
-$color-accent-blue:      color-lower-contrast(#3498db, 5%);
-$color-accent-orange:    color-lower-contrast(#e67e22, 5%);
-
-// TypeClass = 'Root' | 'Group' | 'Data' | 'Object' | 'Representation3D' | 'Behavior'
-
-$type-class-Root:             $default-background;
-$type-class-Data:             color-lower-contrast(#95a5a6, 15%);
-$type-class-Object:           color-lower-contrast(#2ecc71, 10%);
-$type-class-Behavior:         color-lower-contrast(#9b59b6, 10%);
-$type-class-Representation3D: color-lower-contrast(#3498db, 5%);
-$type-class-Group:            color-lower-contrast(#e67e22, 5%);
-
-//////////////////////////////////////////////////
-// COLORS and COMPUTED COLORS
-
-$slider-disabledColor: #ccc;
-
-$control-background: color-increase-contrast($default-background, 6.5%);
-$border-color: color-increase-contrast($default-background, 15%);
-$msp-form-control-background: color-lower-contrast($default-background, 2.5%);
-
-// buttons
-$msp-btn-link-font-color: $font-color;
-$msp-btn-link-toggle-on-font-color: $font-color;
-$msp-btn-link-toggle-off-font-color: color-lower-contrast($font-color, 33%);
-
-// used for "actions" -- i.e. + in selection
-$msp-btn-remove-font-color: $font-color;
-
-$msp-btn-action-background: $msp-form-control-background;
-
-// update selection etc
-//!! $msp-btn-commit-on-font-color: $entity-current-font-color;
-$msp-btn-commit-on-hover-font-color: color-lower-contrast($msp-btn-commit-on-font-color, 20%); //!!Change
-$msp-btn-commit-on-background: color-lower-contrast($default-background, 2%);
-$msp-btn-commit-off-background:  color-lower-contrast($default-background, 4%); //$control-background;
-$msp-btn-commit-off-font-color: $font-color;
-
-// log
-$log-font-color: color-lower-contrast($font-color, 5%);
-$log-timestamp-font-color: color-lower-contrast($font-color, 20%);
-
-// highlight
-$highlight-info-font-color: $hover-font-color;
-$highlight-info-additional-font-color: color-lower-contrast($hover-font-color, 20%);
-
-// entity state
-$entity-color-fully-visible: $font-color;
-$entity-color-not-visible: color-lower-contrast($font-color, 66%);
-$entity-color-partialy-visible: color-lower-contrast($font-color, 33%);
-$entity-tag-color: color-lower-contrast($font-color, 20%);
-
-// sequence
-$sequence-background: $default-background;
-$sequence-number-color: $hover-font-color;
-
-// state
+
+// measures
+
+$control-label-width:   110px;
+$control-label-short-width:   70px;
+$row-height:            32px;
+$control-spacing:       10px;
+$entity-subtree-offset: 8px;
+$info-vertical-padding: 3px;
+$slider-border-radius-base: 6px;
+
+// layout
+$expanded-top-height:    100px;
+$expanded-bottom-height: 70px; // 3 * $row-height + 2;
+$expanded-right-width:   300px;
+$expanded-left-width:    330px;
+
+$collapsed-left-width:   $row-height;
+
+$expanded-portrait-bottom-height: 10 * ($row-height + 1) + 3 * $control-spacing + 1;
+$expanded-portrait-top-height:    3 * $row-height + 1;
+
+$standard-bottom-height: 8 * ($row-height + 1) + 3 * $control-spacing + 1;
+$standard-top-height:    3 * $row-height + 1;
+
+
+$color-accent-cyan:      color-lower-contrast(#95a5a6, 15%);
+$color-accent-red:       color-lower-contrast(#e74c3c, 15%);
+$color-accent-gray:      color-lower-contrast(#34495e, 10%);
+$color-accent-green:     color-lower-contrast(#2ecc71, 10%);
+$color-accent-purple:    color-lower-contrast(#9b59b6, 10%);
+$color-accent-blue:      color-lower-contrast(#3498db, 5%);
+$color-accent-orange:    color-lower-contrast(#e67e22, 5%);
+
+// TypeClass = 'Root' | 'Group' | 'Data' | 'Object' | 'Representation3D' | 'Behavior'
+
+$type-class-Root:             $default-background;
+$type-class-Data:             color-lower-contrast(#95a5a6, 15%);
+$type-class-Object:           color-lower-contrast(#2ecc71, 10%);
+$type-class-Behavior:         color-lower-contrast(#9b59b6, 10%);
+$type-class-Representation3D: color-lower-contrast(#3498db, 5%);
+$type-class-Group:            color-lower-contrast(#e67e22, 5%);
+
+//////////////////////////////////////////////////
+// COLORS and COMPUTED COLORS
+
+$slider-disabledColor: #ccc;
+
+$control-background: color-increase-contrast($default-background, 6.5%);
+$border-color: color-increase-contrast($default-background, 15%);
+$msp-form-control-background: color-lower-contrast($default-background, 2.5%);
+
+// buttons
+$msp-btn-link-font-color: $font-color;
+$msp-btn-link-toggle-on-font-color: $font-color;
+$msp-btn-link-toggle-off-font-color: color-lower-contrast($font-color, 33%);
+
+// used for "actions" -- i.e. + in selection
+$msp-btn-remove-font-color: $font-color;
+
+$msp-btn-action-background: $msp-form-control-background;
+
+// update selection etc
+//!! $msp-btn-commit-on-font-color: $entity-current-font-color;
+$msp-btn-commit-on-hover-font-color: color-lower-contrast($msp-btn-commit-on-font-color, 20%); //!!Change
+$msp-btn-commit-on-background: color-lower-contrast($default-background, 2%);
+$msp-btn-commit-off-background:  color-lower-contrast($default-background, 4%); //$control-background;
+$msp-btn-commit-off-font-color: $font-color;
+
+// log
+$log-font-color: color-lower-contrast($font-color, 5%);
+$log-timestamp-font-color: color-lower-contrast($font-color, 20%);
+
+// highlight
+$highlight-info-font-color: $hover-font-color;
+$highlight-info-additional-font-color: color-lower-contrast($hover-font-color, 20%);
+
+// entity state
+$entity-color-fully-visible: $font-color;
+$entity-color-not-visible: color-lower-contrast($font-color, 66%);
+$entity-color-partialy-visible: color-lower-contrast($font-color, 33%);
+$entity-tag-color: color-lower-contrast($font-color, 20%);
+
+// sequence
+$sequence-background: $default-background;
+$sequence-number-color: $hover-font-color;
+
+// state
 $state-image-height: 96px;

package/lib/mol-plugin-ui/skin/blue.scss

@@ -1,2 +1,2 @@
-@import 'colors/blue';
+@import 'colors/blue';
 @import 'base/base';

package/lib/mol-plugin-ui/skin/colors/blue.scss

@@ -1,24 +1,24 @@
-$default-background:         #2D3E50;
-$font-color:                 #EDF1F2; 
-$hover-font-color:           #3B9AD9;
-$entity-current-font-color:  #FFFFFF;
-$msp-btn-remove-background:      #BF3A31;
-$msp-btn-remove-hover-font-color:#ffffff;
-$msp-btn-commit-on-font-color:   #ffffff; 
-$entity-badge-font-color:    #ccd4e0;
-
-// used in LOG
-$log-message:          #0CCA5D;
-$log-info:             #5E3673;
-$log-warning:          #FCC937;
-$log-error:            #FD354B;
-
-$logo-background: rgba(0,0,0,0.75);
-
-@function color-lower-contrast($color, $amount) {
-    @return darken($color, $amount);
-}
-
-@function color-increase-contrast($color, $amount) {
-    @return lighten($color, $amount);
+$default-background:         #2D3E50;
+$font-color:                 #EDF1F2; 
+$hover-font-color:           #3B9AD9;
+$entity-current-font-color:  #FFFFFF;
+$msp-btn-remove-background:      #BF3A31;
+$msp-btn-remove-hover-font-color:#ffffff;
+$msp-btn-commit-on-font-color:   #ffffff; 
+$entity-badge-font-color:    #ccd4e0;
+
+// used in LOG
+$log-message:          #0CCA5D;
+$log-info:             #5E3673;
+$log-warning:          #FCC937;
+$log-error:            #FD354B;
+
+$logo-background: rgba(0,0,0,0.75);
+
+@function color-lower-contrast($color, $amount) {
+    @return darken($color, $amount);
+}
+
+@function color-increase-contrast($color, $amount) {
+    @return lighten($color, $amount);
 }

package/lib/mol-plugin-ui/skin/colors/dark.scss

@@ -1,24 +1,24 @@
-$default-background:         #111318;
-$font-color:                 #ccd4e0;
-$hover-font-color:           #51A2FB;
-$entity-current-font-color:  #68BEFD;
-$msp-btn-remove-background:      #DE0A28;
-$msp-btn-remove-hover-font-color:#F2F4F7;
-$msp-btn-commit-on-font-color:   #68BEFD;
-$entity-badge-font-color:    #ccd4e0;
-
-// used in LOG
-$log-message:          #0CCA5D;
-$log-info:             #5E3673;
-$log-warning:          #FCC937;
-$log-error:            #FD354B;
-
-$logo-background: rgba(0,0,0,0.75);
-
-@function color-lower-contrast($color, $amount) {
-    @return darken($color, $amount);
-}
-
-@function color-increase-contrast($color, $amount) {
-    @return lighten($color, $amount);
+$default-background:         #111318;
+$font-color:                 #ccd4e0;
+$hover-font-color:           #51A2FB;
+$entity-current-font-color:  #68BEFD;
+$msp-btn-remove-background:      #DE0A28;
+$msp-btn-remove-hover-font-color:#F2F4F7;
+$msp-btn-commit-on-font-color:   #68BEFD;
+$entity-badge-font-color:    #ccd4e0;
+
+// used in LOG
+$log-message:          #0CCA5D;
+$log-info:             #5E3673;
+$log-warning:          #FCC937;
+$log-error:            #FD354B;
+
+$logo-background: rgba(0,0,0,0.75);
+
+@function color-lower-contrast($color, $amount) {
+    @return darken($color, $amount);
+}
+
+@function color-increase-contrast($color, $amount) {
+    @return lighten($color, $amount);
 }

package/lib/mol-plugin-ui/skin/colors/light.scss

@@ -1,30 +1,30 @@
-// this is complement of the dark theme
-
-@function compl($color) {
-    @return rgb(255 - red($color), 255 - green($color), 255 - blue($color));
-}
-
-$default-background:         compl(#111318);
-$font-color:                 compl(#ccd4e0);
-$hover-font-color:           compl(#51A2FB);
-$entity-current-font-color:  compl(#68BEFD);
-$msp-btn-commit-on-font-color:   compl(#68BEFD);
-$entity-badge-font-color:    lighten(#ccd4e0,10%);
-$msp-btn-remove-background:      #DE0A28;
-$msp-btn-remove-hover-font-color:#F2F4F7;
-
-// used in LOG
-$log-message:          #0CCA5D;
-$log-info:             #5E3673;
-$log-warning:          #FCC937;
-$log-error:            #FD354B;
-
-$logo-background: compl(#111318);
-
-@function color-lower-contrast($color, $amount) {
-    @return lighten($color, $amount);
-}
-
-@function color-increase-contrast($color, $amount) {
-    @return darken($color, $amount);
+// this is complement of the dark theme
+
+@function compl($color) {
+    @return rgb(255 - red($color), 255 - green($color), 255 - blue($color));
+}
+
+$default-background:         compl(#111318);
+$font-color:                 compl(#ccd4e0);
+$hover-font-color:           compl(#51A2FB);
+$entity-current-font-color:  compl(#68BEFD);
+$msp-btn-commit-on-font-color:   compl(#68BEFD);
+$entity-badge-font-color:    lighten(#ccd4e0,10%);
+$msp-btn-remove-background:      #DE0A28;
+$msp-btn-remove-hover-font-color:#F2F4F7;
+
+// used in LOG
+$log-message:          #0CCA5D;
+$log-info:             #5E3673;
+$log-warning:          #FCC937;
+$log-error:            #FD354B;
+
+$logo-background: compl(#111318);
+
+@function color-lower-contrast($color, $amount) {
+    @return lighten($color, $amount);
+}
+
+@function color-increase-contrast($color, $amount) {
+    @return darken($color, $amount);
 }

package/lib/mol-plugin-ui/skin/dark.scss

@@ -1,2 +1,2 @@
-@import 'colors/dark';
+@import 'colors/dark';
 @import 'base/base';

package/lib/mol-plugin-ui/skin/light.scss

@@ -1,2 +1,2 @@
-@import 'colors/light';
+@import 'colors/light';
 @import 'base/base';

package/lib/mol-plugin-ui/viewport/simple-settings.js

@@ -53,6 +53,7 @@ const SimpleSettingsParams = {
         occlusion: Canvas3DParams.postprocessing.params.occlusion,
         shadow: Canvas3DParams.postprocessing.params.shadow,
         outline: Canvas3DParams.postprocessing.params.outline,
+        dof: Canvas3DParams.postprocessing.params.dof,
         fog: Canvas3DParams.cameraFog,
     }, { isFlat: true }),
     clipping: PD.Group({
@@ -126,6 +127,7 @@ const SimpleSettingsMapping = ParamMapping({
                 occlusion: canvas.postprocessing.occlusion,
                 shadow: canvas.postprocessing.shadow,
                 outline: canvas.postprocessing.outline,
+                dof: canvas.postprocessing.dof,
                 fog: canvas.cameraFog,
             },
             clipping: {
@@ -159,6 +161,7 @@ const SimpleSettingsMapping = ParamMapping({
         canvas.multiSample = s.advanced.multiSample;
         canvas.hiZ = s.advanced.hiZ;
         canvas.postprocessing.sharpening = s.advanced.sharpening;
+        canvas.postprocessing.dof = s.lighting.dof;
         props.layout = s.layout;
         props.pixelScale = s.advanced.pixelScale;
         props.transparency = s.advanced.transparency;

package/lib/servers/common/swagger-ui/indexTemplate.js

@@ -1,67 +1,67 @@
-export const indexTemplate = `<!DOCTYPE html>
-<html lang="en">
-    <head>
-        <meta charset="UTF-8">
-        <title>\${title}</title>
-        <link rel="stylesheet" type="text/css" href="\${apiPrefix}/swagger-ui.css" >
-        \${shortcutIconLink}
-
-        <style>
-            html
-            {
-                box-sizing: border-box;
-                overflow: -moz-scrollbars-vertical;
-                overflow-y: scroll;
-            }
-            *,
-            *:before,
-            *:after
-            {
-                box-sizing: inherit;
-            }
-            body
-            {
-                margin:0;
-                background: #fafafa;
-            }
-        </style>
-    </head>
-
-    <body>
-        <div id="swagger-ui"></div>
-
-        <script src="\${apiPrefix}/swagger-ui-bundle.js"> </script>
-        <script src="\${apiPrefix}/swagger-ui-standalone-preset.js"> </script>
-        <script>
-            function HidePlugin() {
-                // this plugin overrides some components to return nothing
-                return {
-                    components: {
-                        Topbar: function () { return null },
-                        Models: function () { return null },
-                    }
-                }
-            }
-            window.onload = function () {
-                var ui = SwaggerUIBundle({
-                    url: '\${openapiJsonUrl}',
-                    validatorUrl: null,
-                    docExpansion: 'list',
-                    dom_id: '#swagger-ui',
-                    deepLinking: true,
-                    presets: [
-                        SwaggerUIBundle.presets.apis,
-                        SwaggerUIStandalonePreset
-                    ],
-                    syntaxHighlight: { activated: false, theme: 'agate' },
-                    plugins: [
-                        SwaggerUIBundle.plugins.DownloadUrl,
-                        HidePlugin
-                    ],
-                    layout: 'StandaloneLayout'
-                })
-                window.ui = ui
-            }
-        </script>
-    </body>
+export const indexTemplate = `<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <title>\${title}</title>
+        <link rel="stylesheet" type="text/css" href="\${apiPrefix}/swagger-ui.css" >
+        \${shortcutIconLink}
+
+        <style>
+            html
+            {
+                box-sizing: border-box;
+                overflow: -moz-scrollbars-vertical;
+                overflow-y: scroll;
+            }
+            *,
+            *:before,
+            *:after
+            {
+                box-sizing: inherit;
+            }
+            body
+            {
+                margin:0;
+                background: #fafafa;
+            }
+        </style>
+    </head>
+
+    <body>
+        <div id="swagger-ui"></div>
+
+        <script src="\${apiPrefix}/swagger-ui-bundle.js"> </script>
+        <script src="\${apiPrefix}/swagger-ui-standalone-preset.js"> </script>
+        <script>
+            function HidePlugin() {
+                // this plugin overrides some components to return nothing
+                return {
+                    components: {
+                        Topbar: function () { return null },
+                        Models: function () { return null },
+                    }
+                }
+            }
+            window.onload = function () {
+                var ui = SwaggerUIBundle({
+                    url: '\${openapiJsonUrl}',
+                    validatorUrl: null,
+                    docExpansion: 'list',
+                    dom_id: '#swagger-ui',
+                    deepLinking: true,
+                    presets: [
+                        SwaggerUIBundle.presets.apis,
+                        SwaggerUIStandalonePreset
+                    ],
+                    syntaxHighlight: { activated: false, theme: 'agate' },
+                    plugins: [
+                        SwaggerUIBundle.plugins.DownloadUrl,
+                        HidePlugin
+                    ],
+                    layout: 'StandaloneLayout'
+                })
+                window.ui = ui
+            }
+        </script>
+    </body>
 </html>`;

package/lib/servers/volume/config.js

@@ -19,9 +19,9 @@ function addLimitsArgs(parser) {
     parser.add_argument('--maxRequestBlockCount', {
         default: DefaultLimitsConfig.maxRequestBlockCount,
         metavar: 'COUNT',
-        help: `Maximum number of blocks that could be read in 1 query.
-This is somewhat tied to the maxOutputSizeInVoxelCountByPrecisionLevel
-in that the <maximum number of voxel> = maxRequestBlockCount * <block size>^3.
+        help: `Maximum number of blocks that could be read in 1 query.
+This is somewhat tied to the maxOutputSizeInVoxelCountByPrecisionLevel
+in that the <maximum number of voxel> = maxRequestBlockCount * <block size>^3.
 The default block size is 96 which corresponds to 28,311,552 voxels with 32 max blocks.`
     });
     parser.add_argument('--maxFractionalBoxVolume', {
@@ -33,8 +33,8 @@ The default block size is 96 which corresponds to 28,311,552 voxels with 32 max
         nargs: '+',
         default: DefaultLimitsConfig.maxOutputSizeInVoxelCountByPrecisionLevel,
         metavar: 'LEVEL',
-        help: `What is the (approximate) maximum desired size in voxel count by precision level
-Rule of thumb: <response gzipped size> in [<voxel count> / 8, <voxel count> / 4].
+        help: `What is the (approximate) maximum desired size in voxel count by precision level
+Rule of thumb: <response gzipped size> in [<voxel count> / 8, <voxel count> / 4].
 The maximum number of voxels is tied to maxRequestBlockCount.`
     });
 }