@openchemistry/molecule-moljs - npm Package Compare versions

Comparing version 0.4.35 to 0.4.36

CHANGELOG.md

@@ -6,2 +6,10 @@ # Change Log
 
+## [0.4.36](https://github.com/OpenChemistry/oc-web-components/compare/@openchemistry/molecule-moljs@0.4.35...@openchemistry/molecule-moljs@0.4.36) (2020-05-15)
+
+**Note:** Version bump only for package @openchemistry/molecule-moljs
+
+
+
+
+
 ## [0.4.35](https://github.com/OpenChemistry/oc-web-components/compare/@openchemistry/molecule-moljs@0.4.34...@openchemistry/molecule-moljs@0.4.35) (2020-03-31)
@@ -8,0 +16,0 @@

dist/cjs/loader.cjs.js

@@ -5,8 +5,11 @@ 'use strict';
 
-const index = require('./index-32085e2c.js');
+const index = require('./index-3e8427d3.js');
 
-const defineCustomElements = (win, options) => index.patchEsm().then(() => {
+const defineCustomElements = (win, options) => {
+  if (typeof window === 'undefined') return Promise.resolve();
+  return index.patchEsm().then(() => {
   return index.bootstrapLazy([["oc-molecule-moljs.cjs",[[0,"oc-molecule-moljs",{"cjson":[1],"options":[16],"rotate":[4]}]]]], options);
-});
+  });
+};
 
 exports.defineCustomElements = defineCustomElements;

dist/cjs/molecule-moljs.cjs.js

 'use strict';
 
-const index = require('./index-32085e2c.js');
+const index = require('./index-3e8427d3.js');
 
@@ -5,0 +5,0 @@ index.patchBrowser().then(options => {

dist/collection/collection-manifest.json

@@ -7,3 +7,3 @@ {
     "name": "@stencil/core",
-    "version": "1.11.3",
+    "version": "1.13.0",
     "typescriptVersion": "3.8.3"
@@ -10,0 +10,0 @@ },

dist/collection/components/molecule-moljs/molecule-moljs.js

@@ -7,4 +7,42 @@ import { Component, Prop, Watch, Element, h } from '@stencil/core';
 import $3Dmol from '@openchemistry/moljs-es';
+import { createColorMap, createOpacityMap } from '@colormap/core';
 import { isNil, throttle } from "lodash-es";
 import { v4 as uuidv4 } from 'uuid';
+function uint8(value) {
+    if (value < 0) {
+        return 0;
+    }
+    else if (value > 1) {
+        return 255;
+    }
+    else {
+        return Math.round(value * 255);
+    }
+}
+function hex(value) {
+    let result = uint8(value).toString(16);
+    return result.length < 2 ? '0' + result : result;
+}
+function toHexColor(color) {
+    return parseInt(color.map(v => hex(v)).join(''), 16);
+}
+function makePoints(mapped, scalars) {
+    if (mapped.length !== scalars.length) {
+        return [];
+    }
+    return scalars.map((value, i) => ({ value, mapped: mapped[i] }));
+}
+function makeTransferFn(colors, opacities) {
+    const scale = (v) => v;
+    const colorMap = createColorMap(colors, scale);
+    const opacityMap = createOpacityMap(opacities, scale);
+    const x = colors.map(({ value }) => value)
+        .concat(opacities.map(({ value }) => value))
+        .sort((a, b) => a - b);
+    return x.map(value => ({
+        value,
+        color: toHexColor(colorMap(value)),
+        opacity: opacityMap(value)
+    }));
+}
 $3Dmol.VolumeData.prototype.volume = function (volume) {
@@ -55,7 +93,3 @@ this.size = new $3Dmol.Vector3(volume.dimensions[0], volume.dimensions[1], volume.dimensions[2]);
             let config = {};
-            // 3dmoljs expects the container element to have width and height functions
-            // go figure, I guess they assume jQuery
-            this.molViewer.width = function () { return this.clientWidth; };
-            this.molViewer.height = function () { return this.clientHeight; };
-            this.viewer = $3Dmol.createViewer(this.molViewer, config);
+            this.viewer = $3Dmol.createViewer($(this.molViewer), config);
         }
@@ -215,18 +249,49 @@ this.convertCjson();
         const cjson = this.getCjson();
-        if (isNil(cjson) || isNil(cjson.cube) || !this.getOptions().visibility.isoSurfaces) {
+        if (isNil(cjson) || isNil(cjson.cube)) {
             return;
         }
+        if (!(this.getOptions().visibility.isoSurfaces || this.getOptions().visibility.volume)) {
+            return;
+        }
         const volumeData = new $3Dmol.VolumeData(cjson.cube, 'volume');
-        const isoSurfaces = this.getOptions().isoSurfaces;
-        for (let isoSurface of isoSurfaces) {
-            let iso = {
-                isoval: isoSurface.value,
-                color: isoSurface.color,
-                opacity: isoSurface.opacity,
-            };
-            if ('smoothness' in isoSurface) {
-                iso.smoothness = isoSurface.smoothness;
+        if (this.getOptions().visibility.isoSurfaces) {
+            const isoSurfaces = this.getOptions().isoSurfaces;
+            for (let isoSurface of isoSurfaces) {
+                let iso = {
+                    isoval: isoSurface.value,
+                    color: isoSurface.color,
+                    opacity: isoSurface.opacity,
+                };
+                if ('smoothness' in isoSurface) {
+                    iso.smoothness = isoSurface.smoothness;
+                }
+                this.viewer.addIsosurface(volumeData, iso);
             }
-            this.viewer.addIsosurface(volumeData, iso);
         }
+        if (this.getOptions().visibility.volume) {
+            let low = Infinity;
+            let high = -Infinity;
+            cjson.cube.scalars.forEach((value) => {
+                if (value < low) {
+                    low = value;
+                }
+                ;
+                if (value > high) {
+                    high = value;
+                }
+                ;
+            });
+            const range = [low, high];
+            const delta = high - low;
+            const colorsScalarValue = !isNil(this.getOptions().volume.colorsScalarValue) && this.getOptions().volume.colorsScalarValue.length == this.getOptions().volume.colors.length
+                ? this.getOptions().volume.colorsScalarValue
+                : this.getOptions().volume.colors.map((_, i) => range[0] + i * delta / (this.getOptions().volume.colors.length - 1));
+            const colorNodes = makePoints(this.getOptions().volume.colors, colorsScalarValue);
+            const opacityScalarValue = !isNil(this.getOptions().volume.opacityScalarValue) && this.getOptions().volume.colorsScalarValue.length == this.getOptions().volume.opacity.length
+                ? this.getOptions().volume.opacityScalarValue
+                : this.getOptions().volume.opacity.map((_, i) => range[0] + i * delta / (this.getOptions().volume.opacity.length - 1));
+            const opacityNodes = makePoints(this.getOptions().volume.opacity, opacityScalarValue);
+            const transferfn = makeTransferFn(colorNodes, opacityNodes);
+            this.viewer.addVolumetricRender(volumeData, { transferfn });
+        }
     }
@@ -233,0 +298,0 @@ getCjson() {

dist/esm/polyfills/index.js

@@ -6,4 +6,5 @@ export function applyPolyfills() {
 
-    if (!win.customElements || (win.Element && (!win.Element.prototype.closest || !win.Element.prototype.matches || !win.Element.prototype.remove))) {
-      promises.push(import(/* webpackChunkName: "stencil-polyfills-dom" */ './dom.js'));
+    if (!win.customElements ||
+      (win.Element && (!win.Element.prototype.closest || !win.Element.prototype.matches || !win.Element.prototype.remove || !win.Element.prototype.getRootNode))) {
+      promises.push(import(/* webpackChunkName: "polyfills-dom" */ './dom.js'));
     }
@@ -30,3 +31,3 @@
     ) {
-      promises.push(import(/* webpackChunkName: "stencil-polyfills-core-js" */ './core-js.js'));
+      promises.push(import(/* webpackChunkName: "polyfills-core-js" */ './core-js.js'));
     }
@@ -33,0 +34,0 @@ }

dist/molecule-moljs/molecule-moljs.esm.js

@@ -1,1 +0,1 @@
-import{p as o,b as s}from"./p-c24d5c3f.js";o().then(o=>s([["p-3f66eba4",[[0,"oc-molecule-moljs",{cjson:[1],options:[16],rotate:[4]}]]]],o));
+import{p as o,b as s}from"./p-b64adceb.js";o().then(o=>s([["p-852a8bf5",[[0,"oc-molecule-moljs",{cjson:[1],options:[16],rotate:[4]}]]]],o));

dist/types/stencil-public-runtime.d.ts

@@ -638,2 +638,3 @@ declare type CustomMethodDecorator<T> = (target: Object, propertyKey: string | symbol, descriptor: TypedPropertyDescriptor<T>) => TypedPropertyDescriptor<T> | void;
         slot?: string;
+        onSlotchange?: (event: Event) => void;
     }
@@ -700,2 +701,3 @@ interface AnchorHTMLAttributes<T> extends HTMLAttributes<T> {
         open?: boolean;
+        onToggle?: (event: Event) => void;
     }
@@ -816,3 +818,2 @@ interface DelHTMLAttributes<T> extends HTMLAttributes<T> {
         indeterminate?: boolean;
-        inputmode?: string;
         list?: string;
@@ -867,2 +868,3 @@ max?: number | string;
     interface LinkHTMLAttributes<T> extends HTMLAttributes<T> {
+        as?: string;
         href?: string;
@@ -1089,4 +1091,3 @@ hrefLang?: string;
         lang?: string;
-        spellCheck?: boolean;
-        spellcheck?: boolean | string;
+        spellcheck?: 'true' | 'false';
         style?: {
@@ -1100,6 +1101,7 @@ [key: string]: string | undefined;
         inputmode?: string;
+        enterKeyHint?: string;
+        enterkeyhint?: string;
         is?: string;
         radioGroup?: string;
         radiogroup?: string;
-        part?: string;
         role?: string;
@@ -1239,2 +1241,3 @@ about?: string;
         'horiz-origin-x'?: number | string;
+        'href'?: string;
         'ideographic'?: number | string;
@@ -1400,2 +1403,4 @@ 'image-rendering'?: number | string;
         slot?: string;
+        part?: string;
+        exportparts?: string;
         onCopy?: (event: ClipboardEvent) => void;
@@ -1402,0 +1407,0 @@ onCopyCapture?: (event: ClipboardEvent) => void;

package.json

 {
   "name": "@openchemistry/molecule-moljs",
-  "version": "0.4.35",
+  "version": "0.4.36",
   "description": "Stencil Wrapper for 3Dmoljs with support for cjson chemical data",
@@ -21,5 +21,6 @@ "main": "dist/index.js",
   "dependencies": {
-    "@openchemistry/moljs-es": "^0.1.24",
+    "@colormap/core": "^0.1.0-3",
+    "@openchemistry/moljs-es": "^0.1.25",
     "@openchemistry/types": "^0.8.21",
-    "@openchemistry/utils": "^0.6.22",
+    "@openchemistry/utils": "^0.6.23",
     "@types/lodash-es": "^4.17.1",
@@ -47,3 +48,3 @@ "@types/uuid": "3.4.3",
   },
-  "gitHead": "05cb9fb925e79e838ca05e4f542d6bf485856dd3"
+  "gitHead": "308a6254a111d3a23ebc0ed69d7439a49a9cdf5f"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

4287825

increased by3.34%

Lines of code

54029

increased by2.57%

Number of medium supply chain risk alerts

31

decreased by-18.42%

Worsened metrics

Dependency count

9

increased by12.5%

Dependency changes

• + Added@colormap/core@^0.1.0-3

• + Added@colormap/core@0.1.0-3(transitive)

• Updated@openchemistry/moljs-es@^0.1.25

• Updated@openchemistry/utils@^0.6.23