@datagrok/peptides 1.3.8 → 1.4.0

package/src/model.ts

@@ -1,7 +1,6 @@
 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';
 
@@ -10,15 +9,17 @@ import * as rxjs from 'rxjs';
 
 import * as C from './utils/constants';
 import * as type from './utils/types';
-import {calculateBarsData, getTypedArrayConstructor, isGridCellInvalid, scaleActivity} from './utils/misc';
-import {MutationCliffsViewer, SARViewerBase, MostPotentResiduesViewer} from './viewers/sar-viewer';
+import {calculateSelected, isGridCellInvalid, scaleActivity} from './utils/misc';
+import {MutationCliffsViewer, MostPotentResiduesViewer} from './viewers/sar-viewer';
 import * as CR from './utils/cell-renderer';
 import {mutationCliffsWidget} from './widgets/mutation-cliffs';
 import {getDistributionAndStats, getDistributionWidget} from './widgets/distribution';
 import {getStats, Stats} from './utils/statistics';
 import {LogoSummary} from './viewers/logo-summary';
 import {getSettingsDialog} from './widgets/settings';
-import {getMoomerWorks} from './package';
+import {getMonomerWorks} from './package';
+import * as bio from '@datagrok-libraries/bio';
+import {findMutations} from './utils/algorithms';
 
 export class PeptidesModel {
   static modelName = 'peptidesModel';
@@ -26,6 +27,7 @@ export class PeptidesModel {
   mutationCliffsGridSubject = new rxjs.Subject<DG.Grid>();
   mostPotentResiduesGridSubject = new rxjs.Subject<DG.Grid>();
   logoSummaryGridSubject = new rxjs.Subject<DG.Grid>();
+  settingsSubject = new rxjs.Subject();
 
   _isUpdating: boolean = false;
   isBitsetChangedInitialized = false;
@@ -33,7 +35,7 @@ export class PeptidesModel {
 
   mutationCliffsGrid!: DG.Grid;
   mostPotentResiduesGrid!: DG.Grid;
-  logoSummaryGrid!: DG.Grid;
+  // logoSummaryGrid!: DG.Grid;
   sourceGrid!: DG.Grid;
   df: DG.DataFrame;
   splitCol!: DG.Column<boolean>;
@@ -51,15 +53,23 @@ export class PeptidesModel {
   isChangingEdfBitset = false;
 
   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: bio.IMonomerLib | null = null; // To get monomers from lib(s)
+  monomerWorks: bio.MonomerWorks | null = null; // To get processed monomers
 
   _settings!: type.PeptidesSettings;
   isRibbonSet = false;
 
+  cp: bio.SeqPalette;
+  initBitset: DG.BitSet;
+  isInvariantMapTrigger: boolean = false;
+  headerSelectedMonomers: type.MonomerSelectionStats = {};
+  webLogoBounds: {[positon: string]: {[monomer: string]: DG.Rect}} = {};
+  cachedWebLogoTooltip: {bar: string; tooltip: HTMLDivElement | null;} = {bar: '', tooltip: null};
+
   private constructor(dataFrame: DG.DataFrame) {
     this.df = dataFrame;
+    this.initBitset = this.df.filter.clone();
+    this.cp = bio.pickUpPalette(this.df.getCol(C.COLUMNS_NAMES.MACROMOLECULE));
   }
 
   static async getInstance(dataFrame: DG.DataFrame): Promise<PeptidesModel> {
@@ -80,6 +90,10 @@ export class PeptidesModel {
     return this.logoSummaryGridSubject.asObservable();
   }
 
+  get onSettingsChanged(): rxjs.Observable<unknown> {
+    return this.settingsSubject.asObservable();
+  }
+
   get mutationCliffsSelection(): type.PositionToAARList {
     this._mutationCliffsSelection ??= JSON.parse(this.df.tags[C.TAGS.SELECTION] || '{}');
     return this._mutationCliffsSelection;
@@ -100,7 +114,9 @@ export class PeptidesModel {
   set invariantMapSelection(selection: type.PositionToAARList) {
     this._invariantMapSelection = selection;
     this.df.tags[C.TAGS.FILTER] = JSON.stringify(selection);
+    this.isInvariantMapTrigger = true;
     this.df.filter.fireChanged();
+    this.isInvariantMapTrigger = false;
     this.invalidateGrids();
   }
 
@@ -166,6 +182,7 @@ export class PeptidesModel {
     this.df.setTag('settings', JSON.stringify(this._settings));
     //TODO: update only needed components
     this.updateDefault();
+    this.settingsSubject.next();
   }
 
   createAccordion(): DG.Accordion {
@@ -180,14 +197,14 @@ export class PeptidesModel {
 
   updateDefault(): void {
     if ((this.sourceGrid && !this._isUpdating) || !this.isInitialized) {
-      this.isInitialized = true;
+      // this.isInitialized = true;
       this._isUpdating = true;
       this.initializeViewersComponents();
       //FIXME: modify during the initializeViewersComponents stages
       this.mutationCliffsGridSubject.next(this.mutationCliffsGrid);
       this.mostPotentResiduesGridSubject.next(this.mostPotentResiduesGrid);
-      if (this.df.getTag(C.TAGS.CLUSTERS))
-        this.logoSummaryGridSubject.next(this.logoSummaryGrid);
+      // if (this.df.getTag(C.TAGS.CLUSTERS))
+      //   this.logoSummaryGridSubject.next(this.logoSummaryGrid);
 
       this.fireBitsetChanged();
       this.invalidateGrids();
@@ -203,8 +220,8 @@ export class PeptidesModel {
     const col = this.df.getCol(C.COLUMNS_NAMES.MACROMOLECULE);
     const alphabet = col.tags['alphabet'];
     const splitSeqDf = splitAlignedSequences(col);
-
-    this.barData = calculateBarsData(splitSeqDf.columns.toList(), this.df.selection);
+    for (const col of splitSeqDf.columns)
+      col.name = `p${col.name}`;
 
     const positionColumns = splitSeqDf.columns.names();
 
@@ -227,6 +244,8 @@ export class PeptidesModel {
 
     // SAR matrix table
     //pivot a table to make it matrix-like
+    const monomerCol = matrixDf.getCol(C.COLUMNS_NAMES.MONOMER);
+    matrixDf = matrixDf.clone(DG.BitSet.create(matrixDf.rowCount, (i) => monomerCol.get(i) ? true : false));
     matrixDf = this.monomerPositionStatsDf.groupBy([C.COLUMNS_NAMES.MONOMER])
       .pivot(C.COLUMNS_NAMES.POSITION)
       .add('first', C.COLUMNS_NAMES.MEAN_DIFFERENCE, '')
@@ -234,123 +253,41 @@ export class PeptidesModel {
     matrixDf.name = 'SAR';
 
     // Setting category order
-    this.setCategoryOrder(matrixDf);
+    // this.setCategoryOrder(matrixDf);
 
     // SAR vertical table (naive, choose best Mean difference from pVals <= 0.01)
     const sequenceDf = this.createVerticalTable();
 
-    this.calcSubstitutions();
+    const scaledActivityCol = this.df.getCol(C.COLUMNS_NAMES.ACTIVITY_SCALED);
+    const monomerColumns = this.df.columns.bySemTypeAll(C.SEM_TYPES.MONOMER);
+    this.substitutionsInfo = findMutations(scaledActivityCol, monomerColumns, this.settings);
 
     [this.mutationCliffsGrid, this.mostPotentResiduesGrid] =
       this.createGrids(matrixDf, sequenceDf, positionColumns, alphabet);
 
     if (this.df.getTag(C.TAGS.CLUSTERS)) {
       this.clusterStatsDf = this.calculateClusterStatistics();
-      this.logoSummaryGrid = this.createLogoSummaryGrid();
+      // this.logoSummaryGrid = this.createLogoSummaryGrid();
     }
 
     // init invariant map & mutation cliffs selections
     this.initSelections(positionColumns);
 
-    positionColumns.push(C.COLUMNS_NAMES.MEAN_DIFFERENCE);
+    // positionColumns.push(C.COLUMNS_NAMES.MEAN_DIFFERENCE);
 
-    this.setBarChartInteraction();
+    this.setWebLogoInteraction();
+    this.webLogoBounds = {};
 
-    this.setCellRenderers(positionColumns);
+    this.setCellRenderers([...positionColumns, C.COLUMNS_NAMES.MEAN_DIFFERENCE]);
 
     // show all the statistics in a tooltip over cell
-    this.setTooltips(positionColumns);
+    this.setTooltips([...positionColumns, C.COLUMNS_NAMES.MEAN_DIFFERENCE]);
 
     this.setInteractionCallback();
 
     this.setBitsetCallback();
 
-    this.postProcessGrids();
-  }
-
-  //TODO: move out
-  calcSubstitutions(): void {
-    const activityValues: DG.Column<number> = this.df.columns.bySemType(C.SEM_TYPES.ACTIVITY_SCALED)!;
-    const columnList: DG.Column<string>[] = this.df.columns.bySemTypeAll(C.SEM_TYPES.MONOMER);
-    const nCols = columnList.length;
-    if (nCols == 0)
-      throw new Error(`Couldn't find any column of semType '${C.SEM_TYPES.MONOMER}'`);
-
-    this.substitutionsInfo = new Map();
-    const nRows = this.df.rowCount;
-    for (let seq1Idx = 0; seq1Idx < nRows - 1; seq1Idx++) {
-      for (let seq2Idx = seq1Idx + 1; seq2Idx < nRows; seq2Idx++) {
-        let substCounter = 0;
-        const activityValSeq1 = activityValues.get(seq1Idx)!;
-        const activityValSeq2 = activityValues.get(seq2Idx)!;
-        const delta = activityValSeq1 - activityValSeq2;
-        if (Math.abs(delta) < (this.settings.minActivityDelta ?? 0))
-          continue;
-
-        let substCounterFlag = false;
-        const tempData: { pos: string, seq1monomer: string, seq2monomer: string, seq1Idx: number, seq2Idx: number }[] =
-          [];
-        for (const currentPosCol of columnList) {
-          const seq1monomer = currentPosCol.get(seq1Idx)!;
-          const seq2monomer = currentPosCol.get(seq2Idx)!;
-          if (seq1monomer == seq2monomer)
-            continue;
-
-          substCounter++;
-          substCounterFlag = substCounter > (this.settings.maxMutations ?? 1);
-          if (substCounterFlag)
-            break;
-
-          tempData.push({
-            pos: currentPosCol.name,
-            seq1monomer: seq1monomer,
-            seq2monomer: seq2monomer,
-            seq1Idx: seq1Idx,
-            seq2Idx: seq2Idx,
-          });
-        }
-
-        if (substCounterFlag || substCounter == 0)
-          continue;
-
-        for (const tempDataElement of tempData) {
-          const position = tempDataElement.pos;
-
-          //Working with seq1monomer
-          const seq1monomer = tempDataElement.seq1monomer;
-          if (!this.substitutionsInfo.has(seq1monomer))
-            this.substitutionsInfo.set(seq1monomer, new Map());
-
-          let positionsMap = this.substitutionsInfo.get(seq1monomer)!;
-          if (!positionsMap.has(position))
-            positionsMap.set(position, new Map());
-
-          let indexes = positionsMap.get(position)!;
-
-          !indexes.has(seq1Idx) ? indexes.set(seq1Idx, [seq2Idx]) : (indexes.get(seq1Idx)! as number[]).push(seq2Idx);
-
-          //Working with seq2monomer
-          const seq2monomer = tempDataElement.seq2monomer;
-          if (!this.substitutionsInfo.has(seq2monomer))
-            this.substitutionsInfo.set(seq2monomer, new Map());
-
-          positionsMap = this.substitutionsInfo.get(seq2monomer)!;
-          if (!positionsMap.has(position))
-            positionsMap.set(position, new Map());
-
-          indexes = positionsMap.get(position)!;
-          !indexes.has(seq2Idx) ? indexes.set(seq2Idx, [seq1Idx]) : (indexes.get(seq2Idx)! as number[]).push(seq1Idx);
-        }
-      }
-    }
-
-    const TypedArray = getTypedArrayConstructor(nRows);
-    for (const positionMap of this.substitutionsInfo.values()) {
-      for (const indexMap of positionMap.values()) {
-        for (const [index, indexArray] of indexMap.entries())
-          indexMap.set(index, new TypedArray(indexArray));
-      }
-    }
+    this.postProcessGrids(positionColumns);
   }
 
   initSelections(positionColumns: string[]): void {
@@ -362,7 +299,6 @@ export class PeptidesModel {
     }
     this.invariantMapSelection = tempInvariantMapSelection;
     this.mutationCliffsSelection = mutationCliffsSelection;
-    this.barData = calculateBarsData(this.df.columns.bySemTypeAll(C.SEM_TYPES.MONOMER), this.df.selection);
   }
 
   joinDataFrames(positionColumns: string[], splitSeqDf: DG.DataFrame, alphabet: string): void {
@@ -417,21 +353,23 @@ export class PeptidesModel {
   calculateMonomerPositionStatistics(matrixDf: DG.DataFrame): DG.DataFrame {
     matrixDf = matrixDf.groupBy([C.COLUMNS_NAMES.POSITION, C.COLUMNS_NAMES.MONOMER]).aggregate();
 
+    let monomerCol: DG.Column<string> = matrixDf.getCol(C.COLUMNS_NAMES.MONOMER);
+    // monomerCol = matrixDf.getCol(C.COLUMNS_NAMES.MONOMER);
+
     //calculate p-values based on t-test
     const matrixCols = matrixDf.columns;
     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);
-    const aarCol = matrixDf.getCol(C.COLUMNS_NAMES.MONOMER);
-    const posCol = matrixDf.getCol(C.COLUMNS_NAMES.POSITION);
-    const activityCol: number[] = this.df.getCol(C.COLUMNS_NAMES.ACTIVITY_SCALED).toList();
+    const posCol: DG.Column<string> = matrixDf.getCol(C.COLUMNS_NAMES.POSITION);
+    const activityCol = this.df.getCol(C.COLUMNS_NAMES.ACTIVITY_SCALED).getRawData();
     const sourceDfLen = activityCol.length;
 
     for (let i = 0; i < matrixDf.rowCount; i++) {
-      const position: string = posCol.get(i);
-      const aar: string = aarCol.get(i);
-      const mask = DG.BitSet.create(sourceDfLen, (j) => this.df.get(position, j) === aar);
+      const position = posCol.get(i)!;
+      const monomer = monomerCol.get(i)!;
+      const mask = DG.BitSet.create(sourceDfLen, (j) => this.df.get(position, j) === monomer);
       const stats = getStats(activityCol, mask);
 
       mdCol.set(i, stats.meanDifference);
@@ -440,8 +378,6 @@ export class PeptidesModel {
       ratioCol.set(i, stats.ratio);
     }
 
-    const monomerCol = matrixDf.getCol(C.COLUMNS_NAMES.MONOMER);
-    matrixDf = matrixDf.clone(DG.BitSet.create(matrixDf.rowCount, (i) => monomerCol.get(i) ? true : false));
     return matrixDf as DG.DataFrame;
   }
 
@@ -469,27 +405,27 @@ export class PeptidesModel {
     return statsDf;
   }
 
-  setCategoryOrder(matrixDf: DG.DataFrame): void {
-    let sortArgument: string = C.COLUMNS_NAMES.MEAN_DIFFERENCE;
-    if (this.settings.isBidirectional) {
-      const mdCol = this.monomerPositionStatsDf.getCol(sortArgument);
-      sortArgument = 'Absolute Mean difference';
-      const absMDCol = this.monomerPositionStatsDf.columns.addNewFloat(sortArgument);
-      absMDCol.init((i) => Math.abs(mdCol.get(i)));
-    }
-
-    const aarWeightsDf = this.monomerPositionStatsDf.groupBy([C.COLUMNS_NAMES.MONOMER]).sum(sortArgument, 'weight')
-      .aggregate();
-    const aarList = aarWeightsDf.getCol(C.COLUMNS_NAMES.MONOMER).toList();
-    const getWeight = (aar: string): number => aarWeightsDf
-      .groupBy(['weight'])
-      .where(`${C.COLUMNS_NAMES.MONOMER} = ${aar}`)
-      .aggregate()
-      .get('weight', 0) as number;
-    aarList.sort((first, second) => getWeight(second) - getWeight(first));
-
-    matrixDf.getCol(C.COLUMNS_NAMES.MONOMER).setCategoryOrder(aarList);
-  }
+  // setCategoryOrder(matrixDf: DG.DataFrame): void {
+  //   let sortArgument: string = C.COLUMNS_NAMES.MEAN_DIFFERENCE;
+  //   if (this.settings.isBidirectional) {
+  //     const mdCol = this.monomerPositionStatsDf.getCol(sortArgument);
+  //     sortArgument = 'Absolute Mean difference';
+  //     const absMDCol = this.monomerPositionStatsDf.columns.addNewFloat(sortArgument);
+  //     absMDCol.init((i) => Math.abs(mdCol.get(i)));
+  //   }
+
+  //   const aarWeightsDf = this.monomerPositionStatsDf.groupBy([C.COLUMNS_NAMES.MONOMER]).sum(sortArgument, 'weight')
+  //     .aggregate();
+  //   const aarList = aarWeightsDf.getCol(C.COLUMNS_NAMES.MONOMER).toList();
+  //   const getWeight = (aar: string): number => aarWeightsDf
+  //     .groupBy(['weight'])
+  //     .where(`${C.COLUMNS_NAMES.MONOMER} = ${aar}`)
+  //     .aggregate()
+  //     .get('weight', 0) as number;
+  //   aarList.sort((first, second) => getWeight(second) - getWeight(first));
+
+  //   matrixDf.getCol(C.COLUMNS_NAMES.MONOMER).setCategoryOrder(aarList);
+  // }
 
   createVerticalTable(): DG.DataFrame {
     // TODO: aquire ALL of the positions
@@ -537,86 +473,6 @@ export class PeptidesModel {
     return [mutationCliffsGrid, mostPotentResiduesGrid];
   }
 
-  createLogoSummaryGrid(): DG.Grid {
-    const summaryTable = this.df.groupBy([C.COLUMNS_NAMES.CLUSTERS]).aggregate();
-    const summaryTableLength = summaryTable.rowCount;
-    const clustersCol: DG.Column<number> = summaryTable.getCol(C.COLUMNS_NAMES.CLUSTERS);
-    const membersCol: DG.Column<number> = summaryTable.columns.addNewInt('Members');
-    const webLogoCol: DG.Column<string> = summaryTable.columns.addNew('WebLogo', DG.COLUMN_TYPE.STRING);
-    const tempDfList: DG.DataFrame[] = new Array(summaryTableLength);
-    const originalClustersCol = this.df.getCol(C.COLUMNS_NAMES.CLUSTERS);
-    const peptideCol: DG.Column<string> = this.df.getCol(C.COLUMNS_NAMES.MACROMOLECULE);
-
-    for (let index = 0; index < summaryTableLength; ++index) {
-      const indexes: number[] = [];
-      for (let j = 0; j < originalClustersCol.length; ++j) {
-        if (originalClustersCol.get(j) === clustersCol.get(index))
-          indexes.push(j);
-      }
-      const tCol = DG.Column.string('peptides', indexes.length);
-      tCol.init((i) => peptideCol.get(indexes[i]));
-
-      for (const tag of peptideCol.tags)
-        tCol.setTag(tag[0], tag[1]);
-
-      const dfSlice = DG.DataFrame.fromColumns([tCol]);
-      tempDfList[index] = dfSlice;
-      webLogoCol.set(index, index.toString());
-      membersCol.set(index, dfSlice.rowCount);
-    }
-    webLogoCol.setTag(DG.TAGS.CELL_RENDERER, 'html');
-
-    const grid = summaryTable.plot.grid();
-    const gridClustersCol = grid.col(C.COLUMNS_NAMES.CLUSTERS)!;
-    gridClustersCol.name = 'Clusters';
-    gridClustersCol.visible = true;
-    grid.columns.rowHeader!.visible = false;
-    grid.props.rowHeight = 55;
-    grid.onCellPrepare((cell) => {
-      if (cell.isTableCell && cell.tableColumn?.name === 'WebLogo') {
-        tempDfList[parseInt(cell.cell.value)].plot.fromType('WebLogo', {maxHeight: 50})
-          .then((viewer) => cell.element = viewer.root);
-      }
-    });
-    grid.root.addEventListener('click', (ev) => {
-      const cell = grid.hitTest(ev.offsetX, ev.offsetY);
-      if (!cell || !cell.isTableCell)
-        return;
-
-      const cluster = clustersCol.get(cell.tableRowIndex!)!;
-      summaryTable.currentRowIdx = -1;
-      if (ev.shiftKey)
-        this.modifyClusterSelection(cluster);
-      else
-        this.initClusterSelection(cluster);
-      this.barData = calculateBarsData(this.df.columns.bySemTypeAll(C.SEM_TYPES.MONOMER), this.df.selection);
-    });
-    grid.onCellRender.subscribe((gridCellArgs) => {
-      const gc = gridCellArgs.cell;
-      if (gc.tableColumn?.name !== C.COLUMNS_NAMES.CLUSTERS || gc.isColHeader)
-        return;
-      const canvasContext = gridCellArgs.g;
-      const bound = gridCellArgs.bounds;
-      canvasContext.save();
-      canvasContext.beginPath();
-      canvasContext.rect(bound.x, bound.y, bound.width, bound.height);
-      canvasContext.clip();
-      CR.renderLogoSummaryCell(canvasContext, gc.cell.value, this.logoSummarySelection, bound);
-      gridCellArgs.preventDefault();
-      canvasContext.restore();
-    });
-    grid.onCellTooltip((cell, x, y) => {
-      if (!cell.isColHeader && cell.tableColumn?.name === C.COLUMNS_NAMES.CLUSTERS)
-        this.showTooltipCluster(cell.cell.value, x, y);
-      return true;
-    });
-    const webLogoGridCol = grid.columns.byName('WebLogo')!;
-    webLogoGridCol.cellType = 'html';
-    webLogoGridCol.width = 350;
-
-    return grid;
-  }
-
   modifyClusterSelection(cluster: number): void {
     const tempSelection = this.logoSummarySelection;
     const idx = tempSelection.indexOf(cluster);
@@ -632,7 +488,7 @@ export class PeptidesModel {
     this.logoSummarySelection = [cluster];
   }
 
-  setBarChartInteraction(): void {
+  setWebLogoInteraction(): void {
     const eventAction = (ev: MouseEvent): void => {
       const cell = this.sourceGrid.hitTest(ev.offsetX, ev.offsetY);
       if (cell?.isColHeader && cell.tableColumn?.semType == C.SEM_TYPES.MONOMER) {
@@ -649,7 +505,7 @@ export class PeptidesModel {
   }
 
   findAARandPosition(cell: DG.GridCell, ev: MouseEvent): { monomer: string, position: string } | null {
-    const barCoords = this.barsBounds[cell.tableColumn!.name];
+    const barCoords = this.webLogoBounds[cell.tableColumn!.name];
     for (const [monomer, coords] of Object.entries(barCoords)) {
       const isIntersectingX = ev.offsetX >= coords.x && ev.offsetX <= coords.x + coords.width;
       const isIntersectingY = ev.offsetY >= coords.y && ev.offsetY <= coords.y + coords.height;
@@ -666,15 +522,17 @@ export class PeptidesModel {
     const monomer = barPart.monomer;
     const position = barPart.position;
     if (ev.type === 'click') {
-      ev.shiftKey ? this.modifyMonomerPositionSelection(monomer, position, true) :
-        this.initMonomerPositionSelection(monomer, position, true);
-      this.barData = calculateBarsData(this.df.columns.bySemTypeAll(C.SEM_TYPES.MONOMER), this.df.selection);
+      ev.shiftKey ? this.modifyMonomerPositionSelection(monomer, position, false) :
+        this.initMonomerPositionSelection(monomer, position, false);
     } else {
-      const bar = `${monomer}:${position}`;
-      if (this.cachedBarchartTooltip.bar == bar)
-        ui.tooltip.show(this.cachedBarchartTooltip.tooltip!, ev.clientX, ev.clientY);
+      const bar = `${position} = ${monomer}`;
+      if (this.cachedWebLogoTooltip.bar == bar)
+        ui.tooltip.show(this.cachedWebLogoTooltip.tooltip!, ev.clientX, ev.clientY);
       else
-        this.cachedBarchartTooltip = {bar: bar, tooltip: this.showTooltipAt(monomer, position, ev.clientX, ev.clientY)};
+        this.cachedWebLogoTooltip = {bar: bar, tooltip: this.showTooltipAt(monomer, position, ev.clientX, ev.clientY)};
+
+        //TODO: how to unghighlight?
+      // this.df.rows.match(bar).highlight();
     }
   }
 
@@ -731,22 +589,40 @@ export class PeptidesModel {
 
     this.sourceGrid.setOptions({'colHeaderHeight': 130});
     this.sourceGrid.onCellRender.subscribe((gcArgs) => {
-      const context = gcArgs.g;
+      const ctx = gcArgs.g;
       const bounds = gcArgs.bounds;
       const col = gcArgs.cell.tableColumn;
 
-      context.save();
-      context.beginPath();
-      context.rect(bounds.x, bounds.y, bounds.width, bounds.height);
-      context.clip();
+      ctx.save();
+      ctx.beginPath();
+      ctx.rect(bounds.x, bounds.y, bounds.width, bounds.height);
+      ctx.clip();
 
       if (gcArgs.cell.isColHeader && col?.semType == C.SEM_TYPES.MONOMER) {
-        const barBounds = CR.renderBarchart(context, col, this.barData[col.name], bounds, this.df.filter.trueCount);
-        this.barsBounds[col.name] = barBounds;
+        const monomerStatsCol: DG.Column<string> = this.monomerPositionStatsDf.getCol(C.COLUMNS_NAMES.MONOMER);
+        const positionStatsCol: DG.Column<string> = this.monomerPositionStatsDf.getCol(C.COLUMNS_NAMES.POSITION);
+        const rowMask = DG.BitSet.create(this.monomerPositionStatsDf.rowCount, (i) => positionStatsCol.get(i) === col.name);
+        //TODO: precalc on stats creation
+        const sortedStatsOrder = this.monomerPositionStatsDf.getSortedOrder([C.COLUMNS_NAMES.COUNT], [false], rowMask)
+          .sort((a, b) => {
+            if (monomerStatsCol.get(a) === '-' || monomerStatsCol.get(a) === '')
+              return -1;
+            else if (monomerStatsCol.get(b) === '-' || monomerStatsCol.get(b) === '')
+              return +1;
+            return 0;
+          });
+        const statsInfo: type.StatsInfo = {
+          countCol: this.monomerPositionStatsDf.getCol(C.COLUMNS_NAMES.COUNT),
+          monomerCol: monomerStatsCol,
+          orderedIndexes: sortedStatsOrder,
+        };
+
+        this.webLogoBounds[col.name] =
+          CR.drawLogoInBounds(ctx, bounds, statsInfo, this.df.rowCount, this.cp, this.headerSelectedMonomers[col.name]);
         gcArgs.preventDefault();
       }
 
-      context.restore();
+      ctx.restore();
     });
   }
 
@@ -787,7 +663,7 @@ export class PeptidesModel {
     const tooltipElements: HTMLDivElement[] = [];
     const monomerName = aar.toLowerCase();
 
-    let mw = getMoomerWorks();
+    let mw = getMonomerWorks();
     let mol = mw?.getCappedRotatedMonomer('PEPTIDE', aar);
 
     if (mol) {
@@ -856,7 +732,6 @@ export class PeptidesModel {
       (aar: string, position: string, isShiftPressed: boolean, isInvariantMapSelection: boolean = true): void => {
         isShiftPressed ? this.modifyMonomerPositionSelection(aar, position, isInvariantMapSelection) :
           this.initMonomerPositionSelection(aar, position, isInvariantMapSelection);
-        this.barData = calculateBarsData(this.df.columns.bySemTypeAll(C.SEM_TYPES.MONOMER), this.df.selection);
       };
 
     this.mutationCliffsGrid.root.addEventListener('click', (ev) => {
@@ -921,7 +796,7 @@ export class PeptidesModel {
   invalidateGrids(): void {
     this.mutationCliffsGrid.invalidate();
     this.mostPotentResiduesGrid.invalidate();
-    this.logoSummaryGrid?.invalidate();
+    // this.logoSummaryGrid?.invalidate();
     this.sourceGrid?.invalidate();
   }
 
@@ -967,18 +842,26 @@ export class PeptidesModel {
     };
 
     selection.onChanged.subscribe(() => changeSelectionBitset(selection));
+    
     filter.onChanged.subscribe(() => {
       const positionList = Object.keys(this.invariantMapSelection);
-      for (let index = 0; index < this.df.rowCount; ++index) {
+      const invariantMapBitset = DG.BitSet.create(filter.length, (index) => {
         let result = true;
         for (const position of positionList) {
           const aarList = this.invariantMapSelection[position];
           result &&= aarList.length === 0 || aarList.includes(this.df.get(position, index));
           if (!result)
-            break;
+            return result;
         }
-        filter.set(index, filter.get(index) && result, false);
-      }
+        return result;
+      });
+
+      if (!this.isInvariantMapTrigger)
+        this.initBitset = filter.clone();
+
+      // filter.copyFrom(invariantMapBitset.and(this.initBitset), false);
+      const temp = invariantMapBitset.and(this.initBitset);
+      filter.init((i) => temp.get(i), false);
     });
     this.isBitsetChangedInitialized = true;
   }
@@ -987,11 +870,12 @@ export class PeptidesModel {
     this.isPeptideSpaceChangingBitset = isPeptideSpaceSource;
     this.df.selection.fireChanged();
     this.modifyOrCreateSplitCol();
+    this.headerSelectedMonomers = calculateSelected(this.df);
     grok.shell.o = this.createAccordion().root;
     this.isPeptideSpaceChangingBitset = false;
   }
 
-  postProcessGrids(): void {
+  postProcessGrids(posCols: string[]): void {
     const mdCol: DG.GridColumn = this.mostPotentResiduesGrid.col(C.COLUMNS_NAMES.MEAN_DIFFERENCE)!;
     mdCol.name = 'Diff';
 
@@ -1019,8 +903,22 @@ export class PeptidesModel {
 
     setViewerGridProps(this.mutationCliffsGrid);
     setViewerGridProps(this.mostPotentResiduesGrid);
-    if (this.df.getTag(C.TAGS.CLUSTERS))
-      setViewerGridProps(this.logoSummaryGrid);
+    // if (this.df.getTag(C.TAGS.CLUSTERS))
+    //   setViewerGridProps(this.logoSummaryGrid);
+
+    for (let gcIndex = 0; gcIndex < this.sourceGrid.columns.length; ++gcIndex) {
+      const col = this.sourceGrid.columns.byIndex(gcIndex)!;
+      if (!col.column)
+        continue;
+
+      if (posCols.includes(col.name))
+        col.name = col.name.substring(1);
+
+      col.visible =
+        col.column?.semType === C.SEM_TYPES.MONOMER ||
+        col.column.name === C.COLUMNS_NAMES.ACTIVITY_SCALED ||
+        Object.keys(this.settings.columns ?? {}).includes(col.column.name ?? '');
+    }
   }
 
   getSplitColValueAt(index: number, aar: string, position: string, aarLabel: string): string {
@@ -1040,19 +938,27 @@ export class PeptidesModel {
   async init(): Promise<void> {
     if (this.isInitialized)
       return;
+    this.isInitialized = true;
+
+    // Don't find the dataset if the analysis started from button
+    if (this.df.getTag('newAnalysis') !== '1')
+      this.currentView = wu(grok.shell.tableViews).find(({dataFrame}) => dataFrame.tags[C.PEPTIDES_ANALYSIS] === '1')!;
+
+    this.currentView ??= grok.shell.addTableView(this.df);
 
-    this.currentView = wu(grok.shell.tableViews).find(({dataFrame}) => dataFrame.tags[C.PEPTIDES_ANALYSIS] === 'true') ??
-      grok.shell.addTableView(this.df);
+    this.df.setTag('newAnalysis', '');
     if (!this.isRibbonSet) {
-      this.currentView.setRibbonPanels([[ui.icons.settings(() => getSettingsDialog(this))]], false);
+      //TODO: don't pass model, pass parameters instead
+      const settingsButton = ui.bigButton('Settings', () => getSettingsDialog(this), 'Peptides analysis settings');
+      this.currentView.setRibbonPanels([[settingsButton]], false);
       this.isRibbonSet = true;
     }
     grok.shell.v = this.currentView;
     this.sourceGrid = this.currentView.grid;
-    if (this.df.tags[C.PEPTIDES_ANALYSIS] === 'true')
+    if (this.df.tags[C.PEPTIDES_ANALYSIS] === '1')
       return;
 
-    this.df.tags[C.PEPTIDES_ANALYSIS] = 'true';
+    this.df.tags[C.PEPTIDES_ANALYSIS] = '1';
     const scaledGridCol = this.sourceGrid.col(C.COLUMNS_NAMES.ACTIVITY_SCALED)!;
     scaledGridCol.name = scaledGridCol.column!.getTag('gridName');
     scaledGridCol.format = '#.000';