@datagrok/bio 2.13.2 → 2.13.3

package/package.json

@@ -5,7 +5,7 @@
     "name": "Aleksandr Tanas",
     "email": "atanas@datagrok.ai"
   },
-  "version": "2.13.2",
+  "version": "2.13.3",
   "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",
@@ -13,30 +13,23 @@
     "directory": "packages/Bio"
   },
   "properties": [
-    {
-      "name": "MonomerWidthMode",
-      "propertyType": "string",
-      "choices": [
-        "short",
-        "long"
-      ],
-      "defaultValue": "short",
-      "nullable": false
-    },
     {
       "name": "MaxMonomerLength",
-      "propertyType": "int",
-      "defaultValue": 4,
+      "description": "The max length of monomer symbol displayed without shortening, 'long' to no limit",
+      "propertyType": "string",
+      "defaultValue": "4",
       "nullable": false
     },
     {
       "name": "TooltipWebLogo",
+      "description": "Display WebLogo in a Macromolecule column header tooltip",
       "propertyType": "bool",
       "defaultValue": "true",
       "nullable": false
     },
     {
       "name": "DefaultSeparator",
+      "description": "Default separator using to convert sequences into separator notation",
       "propertyType": "string",
       "defaultValue": ".",
       "nullable": false

package/src/package-types.ts

@@ -4,7 +4,7 @@ import * as ui from 'datagrok-api/ui';
 
 import {Observable, Subject} from 'rxjs';
 import {errInfo} from '@datagrok-libraries/bio/src/utils/err-info';
-import {MonomerWidthMode} from './utils/cell-renderer-consts';
+import {Group} from 'datagrok-api/dg';
 
 /** Names of package properties/settings declared in properties section of {@link './package.json'} */
 export const enum BioPackagePropertiesNames {
@@ -19,22 +19,15 @@ export class BioPackageProperties extends Map<string, any> {
   private _onPropertyChanged: Subject<string> = new Subject<string>();
   public get onPropertyChanged(): Observable<string> { return this._onPropertyChanged; }
 
-  public get MonomerWidthMode(): MonomerWidthMode {
-    return super.get(BioPackagePropertiesNames.MonomerWidthMode) as MonomerWidthMode;
+  /** Monomer symbol maximum length displayed, null for unlimited. */
+  public get MaxMonomerLength(): number | null {
+    const vs = super.get(BioPackagePropertiesNames.MaxMonomerLength);
+    return vs === 'long' ? null : parseInt(vs);
   }
 
-  public set MonomerWidthMode(value: MonomerWidthMode) {
-    super.set(BioPackagePropertiesNames.MonomerWidthMode, value);
-    this._onPropertyChanged.next(BioPackagePropertiesNames.MonomerWidthMode);
-  }
-
-  /** Monomer name maximum length displayed in short mode. */
-  public get MaxMonomerLength(): number {
-    return super.get(BioPackagePropertiesNames.MaxMonomerLength) as number;
-  }
-
-  public set MaxMonomerLength(value: number) {
-    super.set(BioPackagePropertiesNames.MaxMonomerLength, value);
+  public set MaxMonomerLength(value: number | null) {
+    const vs = value === null ? 'long' : value.toString();
+    super.set(BioPackagePropertiesNames.MaxMonomerLength, vs);
     this._onPropertyChanged.next(BioPackagePropertiesNames.MaxMonomerLength);
   }
 

package/src/package.ts

@@ -77,6 +77,7 @@ import {generateLongSequence, generateLongSequence2} from '@datagrok-libraries/b
 import {CyclizedNotationProvider} from './utils/cyclized';
 import {getMolColumnFromHelm} from './utils/helm-to-molfile/utils';
 import {PackageSettingsEditorWidget} from './widgets/package-settings-editor-widget';
+import {getUserLibSettings, setUserLibSettings} from '@datagrok-libraries/bio/src/monomer-works/lib-settings';
 
 export const _package = new BioPackage();
 
@@ -115,6 +116,12 @@ export async function initBio() {
   await Promise.all([
     (async () => {
       const monomerLibManager = await MonomerLibManager.getInstance();
+      // Fix user lib settings for explicit stuck from a terminated test
+      const libSettings = await getUserLibSettings();
+      if (libSettings.explicit) {
+        libSettings.explicit = [];
+        await setUserLibSettings(libSettings);
+      }
       await monomerLibManager.loadLibraries();
       monomerLib = monomerLibManager.getBioLib();
     })(),
@@ -291,16 +298,16 @@ export function SeqActivityCliffsEditor(call: DG.FuncCall) {
 
 // -- Package settings editor --
 
-//name: packageSettingsEditor
-//description: The database connection
-//tags: packageSettingsEditor
-//input: object propList
-//output: widget result
-export function packageSettingsEditor(propList: DG.Property[]): DG.Widget {
-  const widget = new PackageSettingsEditorWidget(propList);
-  widget.init().then(); // Ignore promise returned
-  return widget as DG.Widget;
-}
+// //name: packageSettingsEditor
+// //description: The database connection
+// //tags: packageSettingsEditor
+// //input: object propList
+// //output: widget result
+// export function packageSettingsEditor(propList: DG.Property[]): DG.Widget {
+//   const widget = new PackageSettingsEditorWidget(propList);
+//   widget.init().then(); // Ignore promise returned
+//   return widget as DG.Widget;
+// }
 
 // -- Cell renderers --
 

package/src/utils/cell-renderer-consts.ts

@@ -2,33 +2,25 @@ import * as grok from 'datagrok-api/grok';
 import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
 
-export enum MonomerWidthMode {
-  long = 'long',
-  short = 'short',
-}
-
-export const enum Tags {
-  RendererSettingsChanged = '.mm.cellRenderer.settingsChanged',
-}
-
 export const rendererSettingsChangedState = {
   true: '1',
   false: '0',
 };
 
 export const enum Temps {
-  monomerWidth = '.mm.cellRenderer.monomerWidth',
+  maxMonomerLength = '.mm.cellRenderer.maxMonomerLength',
   colorCode = '.mm.cellRenderer.colorCode',
   compareWithCurrent = '.mm.cellRenderer.compareWithCurrent',
   highlightDifference = '.mm.cellRenderer.highlightDifference',
   gapLength = '.mm.cellRenderer.gapLength',
   monomerPlacer = '.mm.cellRenderer.monomerPlacer',
+
+  rendererSettingsChanged = '.mm.cellRenderer.settingsChanged',
 }
 
 export const enum tempTAGS {
   referenceSequence = 'reference-sequence',
   currentWord = 'current-word',
-  monomerWidthMode = 'monomer-width-mode',
 }
 
 // export const MacromoleculeCellRendererDefaults = new class {

package/src/utils/cell-renderer.ts

@@ -25,8 +25,8 @@ import {alphabetPolymerTypes, IMonomerLib} from '@datagrok-libraries/bio/src/typ
 import {getGridCellRendererBack} from '@datagrok-libraries/bio/src/utils/cell-renderer-back-base';
 
 import {
-  Temps as mmcrTemps, Tags as mmcrTags,
-  tempTAGS, rendererSettingsChangedState, MonomerWidthMode
+  Temps as mmcrTemps,
+  tempTAGS, rendererSettingsChangedState, Temps
 } from '../utils/cell-renderer-consts';
 import * as C from './constants';
 
@@ -152,18 +152,16 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
 
     let gapLength = 0;
     const msaGapLength = 8;
-    let maxLengthOfMonomer = 50; // in case of long monomer representation, do not limit max length
 
     // Cell renderer settings
-    const tempMonomerWidth: string | null = tableColTemp[tempTAGS.monomerWidthMode];
-    const monomerWidth: string = (tempMonomerWidth != null) ? tempMonomerWidth :
-      (_package.properties?.MonomerWidthMode ?? MonomerWidthMode.short);
-    if (monomerWidth === 'short') {
-      // Renderer can start to work before Bio package initialized, in that time _package.properties is null.
-      // TODO: Render function is available but package init method is not completed
-      const tagMaxMonomerLength: number = parseInt(tableCol.getTag(mmcrTAGS.maxMonomerLength));
-      maxLengthOfMonomer =
-        (!isNaN(tagMaxMonomerLength) ? tagMaxMonomerLength : _package.properties?.MaxMonomerLength) ?? 4;
+    let maxLengthOfMonomer: number = (_package.properties ? _package.properties.MaxMonomerLength : 4) ?? 50;
+    if (mmcrTAGS.maxMonomerLength in tableCol.tags) {
+      const v = parseInt(tableCol.getTag(mmcrTAGS.maxMonomerLength));
+      maxLengthOfMonomer = !isNaN(v) && v ? v : 50;
+    }
+    if (Temps.maxMonomerLength in tableColTemp) {
+      const v = tableColTemp[Temps.maxMonomerLength];
+      maxLengthOfMonomer = !isNaN(v) && v ? v : 50;
     }
 
     const [_gc, _tc, temp] =
@@ -184,7 +182,7 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
     g.save();
     try {
       if (
-        tableCol.tags[mmcrTags.RendererSettingsChanged] === rendererSettingsChangedState.true ||
+        tableCol.temp[Temps.rendererSettingsChanged] === rendererSettingsChangedState.true ||
         seqColTemp.monomerLengthLimit != maxLengthOfMonomer
       ) {
         gapLength = tableColTemp[mmcrTemps.gapLength] as number ?? gapLength;
@@ -192,7 +190,7 @@ export class MacromoleculeSequenceCellRenderer extends DG.GridCellRenderer {
         // particularly monomer representation and max width.
         seqColTemp.setMonomerLengthLimit(maxLengthOfMonomer);
         seqColTemp.setSeparatorWidth(seqColTemp.isMsa() ? msaGapLength : gapLength);
-        tableCol.setTag(mmcrTags.RendererSettingsChanged, rendererSettingsChangedState.false);
+        tableCol.temp[Temps.rendererSettingsChanged] = rendererSettingsChangedState.false;
       }
 
       const [maxLengthWords, maxLengthWordsSum]: [number[], number[]] =

package/src/widgets/package-settings-editor-widget.ts

@@ -1,10 +1,9 @@
 import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
 
-import {MonomerWidthMode} from '../utils/cell-renderer-consts';
-
 import {_package} from '../package';
 
+
 export class PackageSettingsEditorWidget extends DG.Widget {
   maxMonomerLengthProp: DG.Property;
   tooltipWebLogo: DG.Property;
@@ -22,34 +21,35 @@ export class PackageSettingsEditorWidget extends DG.Widget {
   }
 
   async init(): Promise<void> {
-    const monomerWidthModeInput = ui.choiceInput('Monomer width mode',
-      _package.properties.MonomerWidthMode,
-      [MonomerWidthMode.short, MonomerWidthMode.long],
-      (value: MonomerWidthMode) => {
-        _package.properties.MonomerWidthMode = value;
-      });
-
-    const maxMonomerLengthInput = ui.intInput('Max monomer length',
-      _package.properties.MaxMonomerLength,
-      (value: number) => {
+    const maxMonomerLengthInput = ui.input.int('Max Monomer Length', {
+      value: _package.properties.MaxMonomerLength!,
+      nullable: true, min: 0,
+      onValueChanged: () => {
         // Handle user changed value
-        _package.properties.MaxMonomerLength = value;
-      });
-
-    const tooltipWebLogoInput = ui.boolInput('Tooltip WebLogo',
-      _package.properties.TooltipWebLogo,
-      (value: boolean) => {
-        _package.properties.TooltipWebLogo = value;
-      });
-
-    const defaultSeparatorInput = ui.choiceInput('Default Separator',
-      _package.properties.DefaultSeparator, ['.', '/', '-'],
-      (value: string) => {
-        _package.properties.DefaultSeparator = value;
-      });
+        _package.properties.MaxMonomerLength = maxMonomerLengthInput.value ?? null;
+      },
+      tooltipText: this.maxMonomerLengthProp.description,
+    });
+
+    const tooltipWebLogoInput = ui.input.bool('Tooltip WebLogo', {
+      value: _package.properties.TooltipWebLogo,
+      nullable: false,
+      onValueChanged: () => {
+        _package.properties.TooltipWebLogo = tooltipWebLogoInput.value;
+      },
+      tooltipText: this.tooltipWebLogo.description,
+    });
+
+    const defaultSeparatorInput = ui.input.choice('Default Separator', {
+      value: _package.properties.DefaultSeparator,
+      items: ['.', '/', '-'],
+      onValueChanged: () => {
+        _package.properties.DefaultSeparator = defaultSeparatorInput.value;
+      },
+      tooltipText: this.defaultSeparator.description,
+    });
 
     this.root.appendChild(ui.form([
-      monomerWidthModeInput,
       maxMonomerLengthInput,
       tooltipWebLogoInput,
       defaultSeparatorInput,

package/src/widgets/representations.ts

@@ -6,11 +6,11 @@ import {getMolfilesFromSingleSeq} from '@datagrok-libraries/bio/src/monomer-work
 import {TAGS as mmcrTAGS} from '@datagrok-libraries/bio/src/utils/cell-renderer';
 
 import {
-  Tags as mmcrTags, Temps as mmcrTemps, MonomerWidthMode,
-  tempTAGS, rendererSettingsChangedState
+  Temps as mmcrTemps, rendererSettingsChangedState, Temps
 } from '../utils/cell-renderer-consts';
 
 import {_package} from '../package';
+import {max} from 'rxjs/operators';
 
 
 /**
@@ -25,81 +25,77 @@ export function getMacromoleculeColumnPropertyPanel(col: DG.Column): DG.Widget {
   const columnsSet = new Set(columnsList);
   columnsSet.delete(col.name);
 
-  const monomerWidthModeInput = ui.input.choice('Monomer width', {
-    value: (col?.temp[tempTAGS.monomerWidthMode] != null) ? col.temp[tempTAGS.monomerWidthMode] :
-      (_package.properties?.MonomerWidthMode ?? MonomerWidthMode.short),
-    items: [MonomerWidthMode.short, MonomerWidthMode.long],
+  let maxMonomerLength: number | null = (_package.properties ? _package.properties.MaxMonomerLength : 4);
+  if (mmcrTAGS.maxMonomerLength in col.tags) {
+    const v = parseInt(col.getTag(mmcrTAGS.maxMonomerLength));
+    maxMonomerLength = !isNaN(v) ? v : maxMonomerLength;
+  }
+  if (Temps.maxMonomerLength in col.temp) {
+    const v = parseInt(col.temp[Temps.maxMonomerLength]);
+    maxMonomerLength = !isNaN(v) ? v : maxMonomerLength;
+  }
+  const maxMonomerLengthInput = ui.input.int('Max Monomer Length', {
+    value: maxMonomerLength!,
+    nullable: true, min: 1, max: 50, step: 1,
     onValueChanged: () => {
-      const s = monomerWidthModeInput.value;
-      col.temp[tempTAGS.monomerWidthMode] = s;
-      col.setTag(mmcrTags.RendererSettingsChanged, rendererSettingsChangedState.true);
-      col.dataFrame.fireValuesChanged();
-
-      maxMonomerLengthInput.enabled = monomerWidthModeInput.value === MonomerWidthMode.short;
+      if (maxMonomerLengthInput.value == 0)
+        setTimeout(() => { maxMonomerLengthInput.value = null!; }, 0);
+      else {
+        const value = maxMonomerLengthInput.value ?? '';
+        const tagValue = value == null ? '' : value.toString();
+        col.temp[Temps.maxMonomerLength] = tagValue;
+        col.temp[Temps.rendererSettingsChanged] = rendererSettingsChangedState.true;
+        col.dataFrame.fireValuesChanged();
+      }
     },
+    tooltipText: `The max length of monomer symbol displayed without shortening, empty to no limit`
   });
-  monomerWidthModeInput.setTooltip(
-    `In short mode, only the 'Max monomer length' characters are displayed, followed by .. if there are more`);
-
-  const tagMaxMonomerLength: number = parseInt(col.getTag(mmcrTAGS.maxMonomerLength));
-  const maxMonomerLengthInput = ui.input.slider('Max monomer length', {
-    value: !isNaN(tagMaxMonomerLength) ? tagMaxMonomerLength :
-      (_package.properties?.MaxMonomerLength ?? 4),
-    min: 1, max: 16, step: 1,
+
+  const gapLengthInput = ui.input.int('Monomer Margin', {
+    value: col.temp[mmcrTemps.gapLength] ?? 0,
     onValueChanged: () => {
-      const value = maxMonomerLengthInput.value;
-      maxMonomerLengthValueDiv.innerText = maxMonomerLengthInput.stringValue;
-      col.setTag(mmcrTAGS.maxMonomerLength, value.toString());
-      col.setTag(mmcrTags.RendererSettingsChanged, rendererSettingsChangedState.true);
+      col.temp[mmcrTemps.gapLength] = gapLengthInput.value;
+      col.temp[mmcrTemps.rendererSettingsChanged] = rendererSettingsChangedState.true;
       col.dataFrame.fireValuesChanged();
     },
+    tooltipText: 'The size of margin between monomers (in pixels)'
   });
-  const maxMonomerLengthValueDiv = ui.divText(maxMonomerLengthInput.stringValue, 'ui-input-description');
-  maxMonomerLengthInput.addOptions(maxMonomerLengthValueDiv);
-  maxMonomerLengthInput.setTooltip(
-    `The max length of monomer name displayed without shortening ` +
-    ` in '${MonomerWidthMode.short}' monomer width mode.`);
-  maxMonomerLengthInput.enabled = monomerWidthModeInput.value === MonomerWidthMode.short;
-
-  const gapLengthInput = ui.intInput('Monomer margin', col.temp[mmcrTemps.gapLength] ?? 0,
-    (value: number) => {
-      col.temp[mmcrTemps.gapLength] = value;
-      col.setTag(mmcrTags.RendererSettingsChanged, rendererSettingsChangedState.true);
-      col.dataFrame.fireValuesChanged();
-    });
-  gapLengthInput.setTooltip('The size of margin between monomers (in pixels)');
 
-  const colorCode = ui.boolInput('Color code',
-    (col?.temp['color-code'] != null) ? col.temp['color-code'] : true,
-    (v: boolean) => {
-      col.temp['color-code'] = v;
+  const colorCodeInput = ui.input.bool('Color Code', {
+    value: (col?.temp['color-code'] != null) ? col.temp['color-code'] : true,
+    onValueChanged: () => {
+      col.temp['color-code'] = colorCodeInput.value;
       col.dataFrame.fireValuesChanged();
-    });
-  colorCode.setTooltip('Color code');
+    },
+    tooltipText: 'Color code'
+  });
 
-  const referenceSequence = ui.stringInput('Reference sequence',
-    (col?.temp['reference-sequence'] != null) ? col?.temp['reference-sequence'] : '', (v: string) => {
-      col.temp['reference-sequence'] = v;
+  const referenceSequenceInput = ui.input.string('Reference Sequence', {
+    value: (col?.temp['reference-sequence'] != null) ? col?.temp['reference-sequence'] : '',
+    nullable: true,
+    onValueChanged: () => {
+      col.temp['reference-sequence'] = referenceSequenceInput.value;
       col.dataFrame.fireValuesChanged();
-    });
-  referenceSequence.setTooltip('Reference sequence is not empty, then the sequence will be render ' + '\n' +
-    'as a difference from the reference sequence');
-
-  const compareWithCurrent = ui.boolInput('Compare with current',
-    (col?.temp['compare-with-current'] != null) ? col.temp['compare-with-current'] : true,
-    (v: boolean) => {
-      col.temp['compare-with-current'] = v;
+    },
+    tooltipText: 'Reference sequence is not empty, then the sequence will be render ' + '\n' +
+      'as a difference from the reference sequence'
+  });
+
+  const compareWithCurrentInput = ui.input.bool('Compare with current', {
+    value: (col?.temp['compare-with-current'] != null) ? col.temp['compare-with-current'] : true,
+    onValueChanged: () => {
+      col.temp['compare-with-current'] = compareWithCurrentInput.value;
       col.dataFrame.fireValuesChanged();
-    });
-  compareWithCurrent.setTooltip('When on, all sequences get rendered in the "diff" mode');
+    },
+    tooltipText: 'When on, all sequences get rendered in the "diff" mode'
+  });
 
   const rdKitInputs = ui.inputs([
-    monomerWidthModeInput,
     maxMonomerLengthInput,
     gapLengthInput,
-    referenceSequence,
-    colorCode,
-    compareWithCurrent,
+    referenceSequenceInput,
+    colorCodeInput,
+    compareWithCurrentInput,
   ]);
 
   return new DG.Widget(rdKitInputs);

package/webpack.config.js

@@ -31,7 +31,7 @@ module.exports = {
   plugins: [
     new FuncGeneratorPlugin({outputPath: './src/package.g.ts'}),
   ],
-  devtool: mode !== 'production' ? 'inline-source-map' : 'source-map',
+  devtool: 'source-map',
   externals: {
     'datagrok-api/dg': 'DG',
     'datagrok-api/grok': 'grok',