@datagrok/bio 2.7.0 → 2.7.1

package/package.json

@@ -5,7 +5,7 @@
     "name": "Leonid Stolbov",
     "email": "lstolbov@datagrok.ai"
   },
-  "version": "2.7.0",
+  "version": "2.7.1",
   "description": "Bioinformatics support (import/export of sequences, conversion, visualization, analysis). [See more](https://github.com/datagrok-ai/public/blob/master/packages/Bio/README.md) for details.",
   "repository": {
     "type": "git",

package/src/tests/monomer-libraries-tests.ts

@@ -5,7 +5,7 @@ import * as ui from 'datagrok-api/ui';
 import {test, after, before, category, expect} from '@datagrok-libraries/utils/src/test';
 
 import {getMonomerLibHelper, IMonomerLibHelper} from '@datagrok-libraries/bio/src/monomer-works/monomer-utils';
-import {LIB_STORAGE_NAME} from '../utils/monomer-lib';
+import {getLibFileNameList, getUserLibSettings, LIB_STORAGE_NAME, setUserLibSetting} from '../utils/monomer-lib';
 
 
 category('monomerLibraries', () => {
@@ -31,4 +31,17 @@ category('monomerLibraries', () => {
     const currentMonomerLib = monomerLibHelper.getBioLib();
     expect(currentMonomerLib.getPolymerTypes().length > 0, true);
   });
+
+  test('empty', async () => {
+    // exclude all monomer libraries for empty set
+    const libSettings = await getUserLibSettings();
+    const libFnList = await getLibFileNameList();
+    libSettings.exclude = libFnList;
+    await setUserLibSetting(libSettings);
+
+    await monomerLibHelper.loadLibraries(true);
+    const currentMonomerLib = monomerLibHelper.getBioLib();
+    expect(currentMonomerLib.getPolymerTypes().length === 0, true);
+    const monomerOfTypesList = currentMonomerLib.getMonomerMolsByPolymerType('PEPTIDE');
+  });
 });

package/src/utils/monomer-lib.ts

@@ -39,18 +39,28 @@ export async function getLibFileNameList(): Promise<string[]> {
   return res;
 }
 
-export async function getUserLibSettings(): Promise<LibSettings> {
-  const resStr: string = await grok.dapi.userDataStorage.getValue(LIB_STORAGE_NAME, 'Settings', true);
-  const res: LibSettings = resStr ? JSON.parse(resStr) : {exclude: []};
-
-  // Fix empty object returned in case there is no settings stored for user
-  res.exclude = res.exclude instanceof Array ? res.exclude : [];
+let userLibSettingsPromise: Promise<void> = Promise.resolve();
 
-  return res;
+export async function getUserLibSettings(): Promise<LibSettings> {
+  let res: LibSettings;
+  userLibSettingsPromise = userLibSettingsPromise.then(async () => {
+    const resStr: string = await grok.dapi.userDataStorage.getValue(LIB_STORAGE_NAME, 'Settings', true);
+    res = resStr ? JSON.parse(resStr) : {exclude: []};
+
+    // Fix empty object returned in case there is no settings stored for user
+    res.exclude = res.exclude instanceof Array ? res.exclude : [];
+    console.debug(`Bio: getUserLibSettings()\n${JSON.stringify(res, undefined, 2)}`);
+  });
+  await userLibSettingsPromise;
+  return res!;
 }
 
 export async function setUserLibSetting(value: LibSettings): Promise<void> {
-  await grok.dapi.userDataStorage.postValue(LIB_STORAGE_NAME, 'Settings', JSON.stringify(value), true);
+  userLibSettingsPromise = userLibSettingsPromise.then(async () => {
+    console.debug(`Bio: setUserLibSettings()\n${JSON.stringify(value, undefined, 2)}`);
+    await grok.dapi.userDataStorage.postValue(LIB_STORAGE_NAME, 'Settings', JSON.stringify(value), true);
+  });
+  await userLibSettingsPromise;
 }
 
 export async function manageFiles() {
@@ -67,20 +77,19 @@ export async function getLibraryPanelUI(): Promise<DG.Widget> {
   const inputsForm: HTMLDivElement = ui.inputs([]);
   const libFileNameList: string[] = await getLibFileNameList();
 
-  let userStoragePromise: Promise<void> = Promise.resolve();
+  const settings = await getUserLibSettings();
+
   for (const libFileName of libFileNameList) {
-    const settings = await getUserLibSettings();
     const libInput: DG.InputBase<boolean | null> = ui.boolInput(libFileName, !settings.exclude.includes(libFileName),
       () => {
-        userStoragePromise = userStoragePromise.then(async () => {
-          if (libInput.value == true) {
-            // Checked library remove from excluded list
-            settings.exclude = settings.exclude.filter((l) => l != libFileName);
-          } else {
-            // Unchecked library add to excluded list
-            if (!settings.exclude.includes(libFileName)) settings.exclude.push(libFileName);
-          }
-          await setUserLibSetting(settings);
+        if (libInput.value == true) {
+          // Checked library remove from excluded list
+          settings.exclude = settings.exclude.filter((l) => l != libFileName);
+        } else {
+          // Unchecked library add to excluded list
+          if (!settings.exclude.includes(libFileName)) settings.exclude.push(libFileName);
+        }
+        setUserLibSetting(settings).then(async () => {
           await MonomerLibHelper.instance.loadLibraries(true); // from libraryPanel()
           grok.shell.info('Monomer library user settings saved.');
         });
@@ -115,7 +124,7 @@ export class MonomerLib implements IMonomerLib {
   getMonomerMolsByPolymerType(polymerType: string): { [monomerSymbol: string]: string } {
     const res: { [monomerSymbol: string]: string } = {};
 
-    Object.keys(this._monomers[polymerType]).forEach((monomerSymbol) => {
+    Object.keys(this._monomers[polymerType] ?? {}).forEach((monomerSymbol) => {
       res[monomerSymbol] = this._monomers[polymerType][monomerSymbol].molfile;
     });
 
@@ -193,8 +202,9 @@ export class MonomerLibHelper implements IMonomerLibHelper {
           getLibFileNameList(),
           getUserLibSettings(),
         ]);
-        const libs: IMonomerLib[] = await Promise.all(libFileNameList
-          .filter((libFileName) => !settings.exclude.includes(libFileName))
+        const filteredLibFnList = libFileNameList
+          .filter((libFileName) => !settings.exclude.includes(libFileName));
+        const libs: IMonomerLib[] = await Promise.all(filteredLibFnList
           .map((libFileName) => {
             //TODO handle whether files are in place
             return this.readLibrary(LIB_PATH, libFileName).catch((err: any) => {

package/src/viewers/vd-regions-viewer.ts

@@ -62,6 +62,7 @@ export class VdRegionsViewer extends DG.JsViewer implements IVdRegionsViewer {
   // public sequenceColumnNamePostfix: string;
 
   public skipEmptyPositions: boolean;
+  /* A value of zero means autofit to the width. */
   public positionWidth: number;
   public positionHeight: PositionHeight;
 
@@ -76,7 +77,10 @@ export class VdRegionsViewer extends DG.JsViewer implements IVdRegionsViewer {
     // this.sequenceColumnNamePostfix = this.string('sequenceColumnNamePostfix', 'chain sequence');
 
     this.skipEmptyPositions = this.bool('skipEmptyPositions', false);
-    this.positionWidth = this.float('positionWidth', 16);
+    this.positionWidth = this.float('positionWidth', 16, {
+      editor: 'slider', min: 0, max: 64,
+      description: 'Internal WebLogo viewers property width of position. A value of zero means autofit to the width.'
+    });
     this.positionHeight = this.string('positionHeight', PositionHeight.Entropy,
       {choices: Object.keys(PositionHeight)}) as PositionHeight;
   }
@@ -105,7 +109,6 @@ export class VdRegionsViewer extends DG.JsViewer implements IVdRegionsViewer {
 
     // this.mlbView.dockManager.dock(this.regionsFg.root, DG.DOCK_TYPE.LEFT, rootNode, 'Filter regions', 0.2);
 
-    this.subs.push(ui.onSizeChanged(this.root).subscribe(this.rootOnSizeChanged.bind(this)));
     this.subs.push(fromEvent<MouseEvent>(this.root, 'mousemove').subscribe(this.rootOnMouseMove.bind(this)));
 
     // await this.buildView('init'); // init
@@ -213,7 +216,7 @@ export class VdRegionsViewer extends DG.JsViewer implements IVdRegionsViewer {
 
   private async destroyView(purpose: string): Promise<void> {
     // TODO: Unsubscribe from and remove all view elements
-    console.debug(`Bio: VdRegionsViewer.destroyView( mainLayout = ${!this.mainLayout ? 'none' : 'value'} ), ` +
+    _package.logger.debug(`Bio: VdRegionsViewer.destroyView( mainLayout = ${!this.mainLayout ? 'none' : 'value'} ), ` +
       `purpose = '${purpose}'`);
     if (this.filterSourceInput) {
       //
@@ -232,7 +235,7 @@ export class VdRegionsViewer extends DG.JsViewer implements IVdRegionsViewer {
   }
 
   private async buildView(purpose: string): Promise<void> {
-    console.debug(`Bio: VdRegionsViewer.buildView() begin, ` + `purpose = '${purpose}'`);
+    _package.logger.debug(`Bio: VdRegionsViewer.buildView() begin, ` + `purpose = '${purpose}'`);
 
     const regionsFiltered: VdRegion[] = this.regions.filter((r: VdRegion) => this.regionTypes.includes(r.type));
     const orderList: number[] = Array.from(new Set(regionsFiltered.map((r) => r.order))).sort();
@@ -252,6 +255,7 @@ export class VdRegionsViewer extends DG.JsViewer implements IVdRegionsViewer {
             positionWidth: this.positionWidth,
             positionHeight: this.positionHeight,
           }) as WebLogoViewer;
+          wl.onSizeChanged.subscribe(() => { this.calcSize(); });
           return [orderI, chain, wl];
         })());
       }
@@ -321,23 +325,59 @@ export class VdRegionsViewer extends DG.JsViewer implements IVdRegionsViewer {
     this.root.style.overflowX = 'auto';
 
     this.calcSize();
+    this.viewSubs.push(ui.onSizeChanged(this.root).subscribe(this.rootOnSizeChanged.bind(this)));
 
-    console.debug('Bio: VdRegionsViewer.buildView() end');
+    _package.logger.debug('Bio: VdRegionsViewer.buildView() end');
   }
 
-  private calcSize() {
-    const logoHeight = (this.root.clientHeight - 54) / this.chains.length;
+  private calcSizeRequested: boolean = false;
 
-    const maxHeight: number = Math.min(logoHeight,
-      Math.max(...this.logos.map((wlDict) =>
-        Math.max(...Object.values(wlDict).map((wl) => wl.maxHeight)))),
-    );
+  private calcSize() {
+    _package.logger.debug(`Bio: VdRegionsViewer.calcSize(), start`);
+    const calcSizeInt = (): void => {
+      const dpr: number = window.devicePixelRatio;
+      const logoHeight = (this.root.clientHeight - 54) / this.chains.length;
+
+      const maxHeight: number = Math.min(logoHeight,
+        Math.max(...this.logos.map((wlDict) =>
+          Math.max(...Object.values(wlDict).map((wl) => wl.maxHeight)))),
+      );
+
+      let totalPos: number = 0;
+      for (let orderI = 0; orderI < this.logos.length; orderI++) {
+        for (const chain of this.chains)
+          this.logos[orderI][chain].root.style.height = `${maxHeight}px`;
+
+        totalPos += Math.max(...this.chains.map((chain) => this.logos[orderI][chain].Length));
+      }
 
-    for (let orderI = 0; orderI < this.logos.length; orderI++) {
-      for (let chainI = 0; chainI < this.chains.length; chainI++) {
-        const chain: string = this.chains[chainI];
-        this.logos[orderI][chain].root.style.height = `${maxHeight}px`;
+      if (this.positionWidth === 0 && this.logos.length > 0 && totalPos > 0) {
+        const leftPad = 22/* Chain label */;
+        const rightPad = 6 + 6 + 1;
+        const logoMargin = 8 + 1;
+        const fitPositionWidth =
+          (this.root.clientWidth - leftPad - (this.logos.length - 1) * logoMargin - rightPad) / totalPos * dpr;
+
+        for (let orderI = 0; orderI < this.logos.length; orderI++) {
+          for (let chainI = 0; chainI < this.chains.length; chainI++) {
+            const chain: string = this.chains[chainI];
+            this.logos[orderI][chain].setOptions({positionWidth: fitPositionWidth});
+          }
+        }
       }
+
+      if (this.positionWidth === 0)
+        this.host!.style.setProperty('overflow-x', 'hidden', 'important');
+      else
+        this.host!.style.removeProperty('overflow-x');
+    };
+
+    if (!this.calcSizeRequested) {
+      this.calcSizeRequested = true;
+      window.setTimeout(() => {
+        calcSizeInt();
+        this.calcSizeRequested = false;
+      }, 0 /* next event cycle */);
     }
   }