@datagrok/peptides 1.3.4 → 1.3.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datagrok/peptides",
-  "version": "1.3.4",
+  "version": "1.3.6",
   "author": {
     "name": "Volodymyr Dyma",
     "email": "vdyma@datagrok.ai"
@@ -12,17 +12,19 @@
     "directory": "packages/Peptides"
   },
   "dependencies": {
-    "@datagrok-libraries/bio": "^5.1.0",
+    "@datagrok-libraries/bio": "^5.6.0",
     "@datagrok-libraries/ml": "^2.0.1",
     "@datagrok-libraries/statistics": "^0.1.6",
     "@datagrok-libraries/utils": "^1.11.1",
     "cash-dom": "latest",
     "datagrok-api": "^1.6.0",
     "file-loader": "^6.2.0",
-    "rxjs": "^6.5.5"
+    "rxjs": "^6.5.5",
+    "wu": "latest"
   },
   "devDependencies": {
     "@types/jquery": "^3.5.6",
+    "@types/wu": "latest",
     "@typescript-eslint/eslint-plugin": "latest",
     "@typescript-eslint/parser": "latest",
     "css-loader": "^5.2.4",

package/setup-unlink-clean.cmd

@@ -5,6 +5,8 @@ set dirs=^
 \..\..\libraries\utils\ ^
 \..\..\libraries\ml\ ^
 \..\..\libraries\bio\ ^
+\..\..\packages\Bio\ ^
+\..\..\packages\Helm\ ^
 \
 
 call npm uninstall -g ^

package/setup.cmd

@@ -7,6 +7,8 @@ set dirs=^
 \..\..\libraries\utils\ ^
 \..\..\libraries\ml\ ^
 \..\..\libraries\bio\ ^
+\..\..\packages\Bio\ ^
+\..\..\packages\Helm\ ^
 \
 
 for %%p in (%dirs%) do cd %package_dir%\%%p & call npm install

package/setup.sh

@@ -1,15 +1,38 @@
-npm unlink datagrok-api
-npm unlink @datagrok-libraries/utils
-npm unlink @datagrok-libraries/ml
-cd ../../js-api
-npm install
-npm link
-cd ../libraries/utils
-npm install
-npm link
-cd ../../libraries/ml
-npm install
-npm link datagrok-api @datagrok-libraries/utils
-cd ../../packages/Peptides
-npm install
-npm link datagrok-api @datagrok-libraries/utils @datagrok-libraries/ml 
+#!/bin/bash
+
+./setup-unlink-clean.sh
+
+GREEN='\e[0;32m'
+NO_COLOR='\e[0m'
+
+package_dir=$(pwd)
+
+dirs=(
+  "../../js-api/"
+  "../../libraries/utils/"
+  "../../libraries/ml/"
+  "../../libraries/bio/"
+)
+
+for dir in ${dirs[@]}; do
+  cd $package_dir
+  cd $dir 
+  echo -e $GREEN npm install in $(pwd) $NO_COLOR
+  npm install 
+  echo -e $GREEN npm link in $(pwd) $NO_COLOR
+  npm link
+done
+
+for dir in ${dirs[@]}; do
+  cd $package_dir
+  cd $dir 
+  if [ $dir != "../../js-api/" ]; then
+    echo -e $GREEN npm link-all in $(pwd) $NO_COLOR
+    npm run link-all
+  fi
+  echo -e $GREEN npm run build in$(pwd) $NO_COLOR
+  npm run build || exit
+done
+
+cd $package_dir
+npm run link-all

package/src/model.ts

@@ -1,9 +1,11 @@
 import * as ui from 'datagrok-api/ui';
 import * as grok from 'datagrok-api/grok';
 import * as DG from 'datagrok-api/dg';
+import * as bio from '@datagrok-libraries/bio';
 
 import {splitAlignedSequences} from '@datagrok-libraries/bio/src/utils/splitter';
 
+import wu from 'wu';
 import * as rxjs from 'rxjs';
 
 import * as C from './utils/constants';
@@ -49,12 +51,13 @@ export class PeptidesModel {
   mutationCliffsViewer!: MutationCliffsViewer;
   mostPotentResiduesViewer!: MostPotentResiduesViewer;
 
-  _usedProperties: {[propName: string]: string | number | boolean} = {};
-  monomerMap: {[key: string]: {molfile: string, fullName: string}} = {};
+  _usedProperties: { [propName: string]: string | number | boolean } = {};
+  monomerMap: { [key: string]: { molfile: string, fullName: string } } = {};
   barData: type.MonomerDfStats = {};
-  barsBounds: {[position: string]: type.BarCoordinates} = {};
-  cachedBarchartTooltip: {bar: string, tooltip: null | HTMLDivElement} = {bar: '', tooltip: null};
-  monomerLib: any;
+  barsBounds: { [position: string]: type.BarCoordinates } = {};
+  cachedBarchartTooltip: { bar: string, tooltip: null | HTMLDivElement } = {bar: '', tooltip: null};
+  monomerLib: bio.IMonomerLib | null = null; // To get monomers from lib(s)
+  monomerWorks: bio.MonomerWorks | null = null; // To get processed monomers
 
   private constructor(dataFrame: DG.DataFrame) {
     this.df = dataFrame;
@@ -82,6 +85,7 @@ export class PeptidesModel {
     this._mutationCliffsSelection ??= JSON.parse(this.df.tags[C.TAGS.SELECTION] || '{}');
     return this._mutationCliffsSelection;
   }
+
   set mutationCliffsSelection(selection: type.PositionToAARList) {
     this._mutationCliffsSelection = selection;
     this.df.tags[C.TAGS.SELECTION] = JSON.stringify(selection);
@@ -93,6 +97,7 @@ export class PeptidesModel {
     this._invariantMapSelection ??= JSON.parse(this.df.tags[C.TAGS.FILTER] || '{}');
     return this._invariantMapSelection;
   }
+
   set invariantMapSelection(selection: type.PositionToAARList) {
     this._invariantMapSelection = selection;
     this.df.tags[C.TAGS.FILTER] = JSON.stringify(selection);
@@ -104,6 +109,7 @@ export class PeptidesModel {
     this._logoSummarySelection ??= JSON.parse(this.df.tags[C.TAGS.CLUSTER_SELECTION] || '[]');
     return this._logoSummarySelection;
   }
+
   set logoSummarySelection(selection: number[]) {
     this._logoSummarySelection = selection;
     this.df.tags[C.TAGS.CLUSTER_SELECTION] = JSON.stringify(selection);
@@ -111,11 +117,12 @@ export class PeptidesModel {
     this.invalidateGrids();
   }
 
-  get usedProperties(): {[propName: string]: string | number | boolean} {
+  get usedProperties(): { [propName: string]: string | number | boolean } {
     this._usedProperties = JSON.parse(this.df.tags['sarProperties'] ?? '{}');
     return this._usedProperties;
   }
-  set usedProperties(properties: {[propName: string]: string | number | boolean}) {
+
+  set usedProperties(properties: { [propName: string]: string | number | boolean }) {
     this.df.tags['sarProperties'] = JSON.stringify(properties);
     this._usedProperties = properties;
   }
@@ -124,6 +131,7 @@ export class PeptidesModel {
     const splitByPosFlag = (this.df.tags['distributionSplit'] ?? '00')[0];
     return splitByPosFlag == '1' ? true : false;
   }
+
   set splitByPos(flag: boolean) {
     const splitByAARFlag = (this.df.tags['distributionSplit'] ?? '00')[1];
     this.df.tags['distributionSplit'] = `${flag ? 1 : 0}${splitByAARFlag}`;
@@ -133,6 +141,7 @@ export class PeptidesModel {
     const splitByPosFlag = (this.df.tags['distributionSplit'] ?? '00')[1];
     return splitByPosFlag == '1' ? true : false;
   }
+
   set splitByAAR(flag: boolean) {
     const splitByAARFlag = (this.df.tags['distributionSplit'] ?? '00')[0];
     this.df.tags['distributionSplit'] = `${splitByAARFlag}${flag ? 1 : 0}`;
@@ -141,10 +150,22 @@ export class PeptidesModel {
   get isInvariantMap(): boolean {
     return this.df.getTag('isInvariantMap') === '1';
   }
+
   set isInvariantMap(x: boolean) {
     this.df.setTag('isInvariantMap', x ? '1' : '0');
   }
 
+  get isMutationCliffSelectionEmpty(): boolean {
+    for (const aarList of Object.values(this.mutationCliffsSelection))
+      if (aarList.length !== 0)
+        return false;
+    return true;
+  }
+
+  get isLogoSummarySelectionEmpty(): boolean {
+    return this.logoSummarySelection.length === 0;
+  }
+
   createAccordion(): DG.Accordion {
     const acc = ui.accordion();
     acc.root.style.width = '100%';
@@ -295,7 +316,7 @@ export class PeptidesModel {
           continue;
 
         let substCounterFlag = false;
-        const tempData: {pos: string, seq1monomer: string, seq2monomer: string, seq1Idx: number, seq2Idx: number}[] =
+        const tempData: { pos: string, seq1monomer: string, seq2monomer: string, seq1Idx: number, seq2Idx: number }[] =
           [];
         for (const currentPosCol of columnList) {
           const seq1monomer = currentPosCol.get(seq1Idx)!;
@@ -396,7 +417,7 @@ export class PeptidesModel {
     for (let i = 1; i < this.sourceGrid.columns.length; i++)
       colNames.push(this.sourceGrid.columns.byIndex(i)!);
 
-    colNames.sort((a, b)=>{
+    colNames.sort((a, b) => {
       if (a.column!.semType == C.SEM_TYPES.MONOMER) {
         if (b.column!.semType == C.SEM_TYPES.MONOMER)
           return 0;
@@ -426,7 +447,7 @@ export class PeptidesModel {
 
     //calculate p-values based on t-test
     const matrixCols = matrixDf.columns;
-    const mdCol= matrixCols.addNewFloat(C.COLUMNS_NAMES.MEAN_DIFFERENCE);
+    const mdCol = matrixCols.addNewFloat(C.COLUMNS_NAMES.MEAN_DIFFERENCE);
     const pValCol = matrixCols.addNewFloat(C.COLUMNS_NAMES.P_VALUE);
     const countCol = matrixCols.addNewInt(C.COLUMNS_NAMES.COUNT);
     const ratioCol = matrixCols.addNewFloat(C.COLUMNS_NAMES.RATIO);
@@ -457,7 +478,7 @@ export class PeptidesModel {
     const statsDf = this.df.groupBy([C.COLUMNS_NAMES.CLUSTERS]).aggregate();
     const clustersCol = statsDf.getCol(C.COLUMNS_NAMES.CLUSTERS);
     const statsDfCols = statsDf.columns;
-    const mdCol= statsDfCols.addNewFloat(C.COLUMNS_NAMES.MEAN_DIFFERENCE);
+    const mdCol = statsDfCols.addNewFloat(C.COLUMNS_NAMES.MEAN_DIFFERENCE);
     const pValCol = statsDfCols.addNewFloat(C.COLUMNS_NAMES.P_VALUE);
     const countCol = statsDfCols.addNewInt(C.COLUMNS_NAMES.COUNT);
     const ratioCol = statsDfCols.addNewFloat(C.COLUMNS_NAMES.RATIO);
@@ -507,7 +528,7 @@ export class PeptidesModel {
       .aggregate();
 
     let tempStats: DG.Stats;
-    const maxAtPos: {[index: string]: number} = {};
+    const maxAtPos: { [index: string]: number } = {};
     const posColCategories = sequenceDf.getCol(C.COLUMNS_NAMES.POSITION).categories;
     const mdCol = sequenceDf.getCol(C.COLUMNS_NAMES.MEAN_DIFFERENCE);
     const posCol = sequenceDf.getCol(C.COLUMNS_NAMES.POSITION);
@@ -655,7 +676,7 @@ export class PeptidesModel {
       .subscribe((mouseMove: MouseEvent) => eventAction(mouseMove));
   }
 
-  findAARandPosition(cell: DG.GridCell, ev: MouseEvent): {monomer: string, position: string} | null {
+  findAARandPosition(cell: DG.GridCell, ev: MouseEvent): { monomer: string, position: string } | null {
     const barCoords = this.barsBounds[cell.tableColumn!.name];
     for (const [monomer, coords] of Object.entries(barCoords)) {
       const isIntersectingX = ev.offsetX >= coords.x && ev.offsetX <= coords.x + coords.width;
@@ -667,7 +688,7 @@ export class PeptidesModel {
     return null;
   }
 
-  requestBarchartAction(ev: MouseEvent, barPart: {position: string, monomer: string} | null): void {
+  requestBarchartAction(ev: MouseEvent, barPart: { position: string, monomer: string } | null): void {
     if (!barPart)
       return;
     const monomer = barPart.monomer;
@@ -793,7 +814,11 @@ export class PeptidesModel {
 
   showMonomerTooltip(aar: string, x: number, y: number): void {
     const tooltipElements: HTMLDivElement[] = [];
-    const monomer: type.HELMMonomer = this.monomerLib[aar.toLowerCase()];
+    const monomerName = aar.toLowerCase();
+
+    const monomer: bio.Monomer | null = wu(['HELM_AA', 'HELM_CHEM'])
+      .map((monomerType) => this.monomerWorks!.getCappedMonomer(monomerType, monomerName))
+      .find((m) => m != null) ?? null;
 
     if (monomer) {
       tooltipElements.push(ui.div(monomer.n));
@@ -974,14 +999,16 @@ export class PeptidesModel {
     selection.onChanged.subscribe(() => changeSelectionBitset(selection));
     filter.onChanged.subscribe(() => {
       const positionList = Object.keys(this.invariantMapSelection);
-      filter.init((i) => {
+      for (let index = 0; index < this.df.rowCount; ++index) {
         let result = true;
         for (const position of positionList) {
           const aarList = this.invariantMapSelection[position];
-          result &&= aarList.length == 0 || aarList.includes(this.df.get(position, i));
+          result &&= aarList.length === 0 || aarList.includes(this.df.get(position, index));
+          if (!result)
+            break;
         }
-        return result;
-      }, false);
+        filter.set(index, filter.get(index) && result, false);
+      }
     });
     this.isBitsetChangedInitialized = true;
   }
@@ -1044,7 +1071,7 @@ export class PeptidesModel {
       const [sourceViewer, targetViewer] = isSourceSAR ? [this.mutationCliffsViewer, this.mostPotentResiduesViewer] :
         [this.mostPotentResiduesViewer, this.mutationCliffsViewer];
       const properties = sourceViewer.props.getProperties();
-      const newProps: {[propName: string]: string | number | boolean} = {};
+      const newProps: { [propName: string]: string | number | boolean } = {};
       for (const property of properties) {
         const propName = property.name;
         const propVal = property.get(sourceViewer);
@@ -1061,8 +1088,12 @@ export class PeptidesModel {
     if (this.isInitialized)
       return;
 
-    this.monomerLib =
-      JSON.parse(await grok.functions.call('Helm:getMonomerLib', {type: this.df.getTag('monomerType')}) as string);
+    // Get monomer library through bio library
+    this.monomerLib = await bio.getMonomerLib();
+    this.monomerLib.onChanged.subscribe(() => {
+      this.sourceGrid.invalidate();
+    });
+    this.monomerWorks = new bio.MonomerWorks(this.monomerLib);
 
     this.currentView = this.df.tags[C.PEPTIDES_ANALYSIS] == 'true' ? grok.shell.v as DG.TableView :
       grok.shell.addTableView(this.df);

package/src/tests/core.ts

@@ -1,5 +1,6 @@
 import * as grok from 'datagrok-api/grok';
 import * as DG from 'datagrok-api/dg';
+import * as bio from '@datagrok-libraries/bio';
 
 import {category, test, expect, delay} from '@datagrok-libraries/utils/src/test';
 
@@ -32,9 +33,9 @@ category('Core', () => {
     simpleActivityCol = simpleTable.getCol(simpleActivityColName);
     simpleAlignedSeqCol = simpleTable.getCol(alignedSequenceCol);
     simpleAlignedSeqCol.semType = C.SEM_TYPES.MACROMOLECULE;
-    simpleAlignedSeqCol.tags[C.TAGS.ALPHABET] = 'PT';
-    simpleAlignedSeqCol.tags[DG.TAGS.UNITS] = 'fasta';
-    simpleAlignedSeqCol.tags['aligned'] = 'SEQ.MSA';
+    simpleAlignedSeqCol.setTag(C.TAGS.ALPHABET, bio.ALPHABET.PT);
+    simpleAlignedSeqCol.setTag(DG.TAGS.UNITS, bio.NOTATION.FASTA);
+    simpleAlignedSeqCol.setTag(bio.TAGS.aligned, bio.ALIGNMENT.SEQ_MSA);
     simpleScaledCol = scaleActivity('-lg', simpleActivityCol);
 
     model = await startAnalysis(simpleActivityCol, simpleAlignedSeqCol, null, simpleTable, simpleScaledCol, '-lg');
@@ -52,9 +53,9 @@ category('Core', () => {
     complexActivityCol = complexTable.getCol(complexActivityColName);
     complexAlignedSeqCol = complexTable.getCol('MSA');
     complexAlignedSeqCol.semType = C.SEM_TYPES.MACROMOLECULE;
-    complexAlignedSeqCol.tags[C.TAGS.ALPHABET] = 'UN';
-    complexAlignedSeqCol.tags[DG.TAGS.UNITS] = 'separator';
-    complexAlignedSeqCol.tags['aligned'] = 'SEQ.MSA';
+    complexAlignedSeqCol.setTag(C.TAGS.ALPHABET, bio.ALPHABET.UN);
+    complexAlignedSeqCol.setTag(DG.TAGS.UNITS, bio.NOTATION.SEPARATOR);
+    complexAlignedSeqCol.setTag(bio.TAGS.aligned, bio.ALIGNMENT.SEQ_MSA);
     complexAlignedSeqCol.tags[C.TAGS.SEPARATOR] = '/';
     complexScaledCol = scaleActivity('-lg', complexActivityCol);
 
@@ -74,9 +75,9 @@ category('Core', () => {
     simpleActivityCol = simpleTable.getCol(simpleActivityColName);
     simpleAlignedSeqCol = simpleTable.getCol(alignedSequenceCol);
     simpleAlignedSeqCol.semType = C.SEM_TYPES.MACROMOLECULE;
-    simpleAlignedSeqCol.tags[C.TAGS.ALPHABET] = 'PT';
-    simpleAlignedSeqCol.tags[DG.TAGS.UNITS] = 'fasta';
-    simpleAlignedSeqCol.tags['aligned'] = 'SEQ.MSA';
+    simpleAlignedSeqCol.setTag(C.TAGS.ALPHABET, bio.ALPHABET.PT);
+    simpleAlignedSeqCol.setTag(DG.TAGS.UNITS, bio.NOTATION.FASTA);
+    simpleAlignedSeqCol.setTag(bio.TAGS.aligned, bio.ALIGNMENT.SEQ_MSA);
     simpleScaledCol = scaleActivity('-lg', simpleActivityCol);
 
     model = await startAnalysis(simpleActivityCol, simpleAlignedSeqCol, null, simpleTable, simpleScaledCol, '-lg');

package/src/utils/types.ts

@@ -1,4 +1,5 @@
 import * as DG from 'datagrok-api/dg';
+import * as bio from '@datagrok-libraries/bio';
 
 export type DataFrameDict = {[key: string]: DG.DataFrame};
 
@@ -7,7 +8,7 @@ export type UTypedArray = Uint8Array | Uint16Array | Uint32Array;
 export type SubstitutionsInfo = Map<string, Map<string, Map<number, number[] | UTypedArray>>>;
 export type PositionToAARList = {[postiton: string]: string[]};
 
-export type HELMMonomer = {at: {[key: string]: string}, id: string, m: string, na: string, n: string, rs: number};
+export type HELMMonomer = bio.Monomer;
 
 export type MonomerColStats = {[monomer: string]: {count: number, selected: number}};
 export type MonomerDfStats = {[position: string]: MonomerColStats};

package/src/viewers/sar-viewer.ts

@@ -53,10 +53,10 @@ export class SARViewerBase extends DG.JsViewer {
 
   detach(): void {this.subs.forEach((sub) => sub.unsubscribe());}
 
-  get state(): string {
-    return this.dataFrame.getTag(C.TAGS.SAR_MODE) ?? '10';
+  get isMutationCliffsMode(): string {
+    return this.dataFrame.getTag(C.TAGS.SAR_MODE) ?? '1';
   }
-  set state(s: string) {
+  set isMutationCliffsMode(s: string) {
     this.dataFrame.setTag(C.TAGS.SAR_MODE, s);
   }
 
@@ -67,22 +67,24 @@ export class SARViewerBase extends DG.JsViewer {
       $(this.root).empty();
       let switchHost = ui.div();
       if (this.name == 'MC') {
-        const mutationCliffsMode = ui.boolInput('', this.state[0] === '1', () => {
+        const mutationCliffsMode = ui.boolInput('', this.isMutationCliffsMode === '1', () => {
           if (this.isModeChanging)
             return;
           this.isModeChanging = true;
           invariantMapMode.value = !invariantMapMode.value;
+          this.isMutationCliffsMode = '1';
           this.isModeChanging = false;
           this._titleHost.innerText = 'Mutation Cliffs';
           this.model.isInvariantMap = false;
           this.viewerGrid.invalidate();
         });
         mutationCliffsMode.addPostfix('Mutation Cliffs');
-        const invariantMapMode = ui.boolInput('', this.state[1] === '1', () => {
+        const invariantMapMode = ui.boolInput('', this.isMutationCliffsMode === '0', () => {
           if (this.isModeChanging)
             return;
           this.isModeChanging = true;
           mutationCliffsMode.value = !mutationCliffsMode.value;
+          this.isMutationCliffsMode = '0';
           this.isModeChanging = false;
           this._titleHost.innerText = 'Invariant Map';
           this.model.isInvariantMap = true;

package/src/widgets/distribution.ts

@@ -15,9 +15,6 @@ export function getDistributionWidget(table: DG.DataFrame, model: PeptidesModel)
   const activityScaledCol = table.columns.bySemType(C.SEM_TYPES.ACTIVITY_SCALED)!;
   const rowCount = activityScaledCol.length;
   const selectionObject = model.mutationCliffsSelection;
-  let isMutationCliffsSelectionEmpty = true;
-  for (const aarList of Object.values(selectionObject))
-    isMutationCliffsSelectionEmpty &&= aarList.length === 0;
   const clustersObject = model.logoSummarySelection;
   const positions = Object.keys(selectionObject);
   const positionsLen = positions.length;
@@ -145,16 +142,23 @@ export function getDistributionWidget(table: DG.DataFrame, model: PeptidesModel)
   };
 
   const setDefaultProperties = (input: DG.InputBase): void => {
-    input.enabled = !isMutationCliffsSelectionEmpty;
+    input.enabled = !model.isMutationCliffSelectionEmpty;
     $(input.root).find('.ui-input-editor').css('margin', '0px');
     $(input.root).find('.ui-input-description').css('padding', '0px').css('padding-left', '5px');
   };
 
-  const splitByPosition = ui.boolInput('', model.splitByPos, updateDistributionHost);
+  let defaultValuePos = model.splitByPos;
+  let defaultValueAAR = model.splitByAAR;
+  if (!model.isLogoSummarySelectionEmpty && model.isMutationCliffSelectionEmpty) {
+    defaultValuePos = false;
+    defaultValueAAR = false;
+  }    
+
+  const splitByPosition = ui.boolInput('', defaultValuePos, updateDistributionHost);
   splitByPosition.addPostfix('Split by position');
   setDefaultProperties(splitByPosition);
   $(splitByPosition.root).css('margin-right', '10px');
-  const splitByAAR = ui.boolInput('', model.splitByAAR, updateDistributionHost);
+  const splitByAAR = ui.boolInput('', defaultValueAAR, updateDistributionHost);
   splitByAAR.addPostfix('Split by monomer');
   setDefaultProperties(splitByAAR);
 

package/src/widgets/peptides.ts

@@ -74,7 +74,7 @@ export async function analyzePeptidesWidget(df: DG.DataFrame, col: DG.Column): P
   });
   startBtn.style.alignSelf = 'center';
 
-  const viewer = await df.plot.fromType('WebLogo') as bio.WebLogo;
+  const viewer = await df.plot.fromType('WebLogo') as bio.WebLogoViewer;
   viewer.root.style.setProperty('height', '130px');
   const logoHost = ui.div();
   $(logoHost).empty().append(viewer.root);