@datagrok/sequence-translator 1.2.6 → 1.2.9

package/src/apps/pattern/view/svg-utils/svg-renderer.ts

@@ -0,0 +1,396 @@
+import {SVGElementFactory} from './svg-element-factory';
+import {isOverhangNucleotide} from '../../model/utils';
+import {STRAND, STRANDS, STRAND_END, STRAND_ENDS, TERMINUS, TERMINI} from '../../model/const';
+import {PatternConfiguration, StrandType, TerminalType} from '../../model/types';
+import {SVG_CIRCLE_SIZES, SVG_TEXT_FONT_SIZES, SVG_ELEMENT_COLORS, STRAND_END_LABEL_TEXT} from './const';
+import {StrandToNumberMap, StrandEndToSVGElementsMap, TerminusToSVGElementMap} from '../types';
+import {
+  getNucleobaseLabelForCircle,
+  computeTextColorForNucleobaseLabel,
+  getNucleobaseColorFromStyleMap,
+} from './utils';
+import {PatternSVGDimensionsCalculator} from './dimensions-calculator';
+
+export class NucleotidePatternSVGRenderer {
+  private config: PatternConfiguration;
+  private patternDimensionsCalculator: PatternSVGDimensionsCalculator;
+  private svgFactory: SVGElementFactoryWrapper;
+  private strandElementManager: StrandElementBuilder;
+  private legendBuilder: LegendBuilder;
+
+  constructor(patternConfig: PatternConfiguration) {
+    this.setupPatternConfig(patternConfig);
+
+    // todo: prefer dependency injection for all these properties
+    this.patternDimensionsCalculator = new PatternSVGDimensionsCalculator(this.config);
+
+    this.svgFactory = new SVGElementFactoryWrapper(new SVGElementFactory(), this.config, this.patternDimensionsCalculator);
+
+    this.strandElementManager = new StrandElementBuilder(this.svgFactory, this.config);
+    this.legendBuilder = new LegendBuilder(this.svgFactory, this.config);
+  }
+
+  renderPattern(): SVGElement {
+    const labelElements = this.createLabelElements();
+
+    const countOfNucleotidesExcludingOverhangs = this.countNucleotidesExcludingOverhangs();
+    const strandElements = this.strandElementManager.createStrandElements(countOfNucleotidesExcludingOverhangs);
+    const titleElement = this.svgFactory.createTitleElement(this.config.patternName, countOfNucleotidesExcludingOverhangs, this.config.isAntisenseStrandIncluded);
+
+    const legend = this.legendBuilder.getLegendItems();
+
+    const patternSVGCanvas = this.svgFactory.createCanvas();
+    patternSVGCanvas.append(...labelElements, ...strandElements, titleElement, ...legend);
+
+    return patternSVGCanvas;
+  }
+
+  private countNucleotidesExcludingOverhangs(): StrandToNumberMap {
+    return STRANDS.reduce((acc, strand) => {
+      acc[strand] = this.config.nucleotideSequences[strand].filter((value) => !isOverhangNucleotide(value)).length;
+      return acc;
+    }, {} as StrandToNumberMap);
+  }
+
+  private createLabelElements(): SVGElement[] {
+    const strandEndLabels = this.getStrandEndLabels();
+    const labelsTerminusModification = this.getTerminusModificationLabels();
+
+    const labelElements = [
+      ...STRANDS.flatMap((strand) => [
+        ...Object.values(strandEndLabels[strand]),
+        ...Object.values(labelsTerminusModification[strand])
+      ]),
+    ].filter((element) => element !== null) as SVGElement[];
+
+    return labelElements;
+  }
+
+  private setupPatternConfig(patternConfig: PatternConfiguration): void {
+    // WARNING: to ensure immutability, we need to deep copy the config object
+    this.config = JSON.parse(JSON.stringify(patternConfig)) as PatternConfiguration;
+
+    this.config.nucleotideSequences[STRAND.SENSE].reverse();
+    this.config.phosphorothioateLinkageFlags[STRAND.SENSE].reverse();
+  }
+
+  private getStrandEndLabels() {
+    const strandEndLabels = STRANDS.reduce((acc, strand) => {
+      acc[strand] = STRAND_ENDS.reduce((endAcc, end) => {
+        endAcc[end] = this.svgFactory.createLabelForStrandEnd(strand, end);
+        return endAcc;
+      }, {} as StrandEndToSVGElementsMap);
+      return acc;
+    }, {} as Record<typeof STRANDS[number], StrandEndToSVGElementsMap>);
+
+    return strandEndLabels;
+  }
+
+  private getTerminusModificationLabels() {
+    const labelsTerminusModification = STRANDS.reduce((acc, strand) => {
+      acc[strand] = TERMINI.reduce((terminiAcc, terminus) => {
+        terminiAcc[terminus] = this.svgFactory.createTerminusModificationLabel(strand, terminus);
+        return terminiAcc;
+      }, {} as TerminusToSVGElementMap);
+      return acc;
+    }, {} as Record<typeof STRANDS[number], TerminusToSVGElementMap>);
+
+    return labelsTerminusModification;
+  }
+}
+
+class LegendBuilder {
+  private containsPhosphorothioateLinkages: boolean;
+  constructor(
+    private svgFactory: SVGElementFactoryWrapper,
+    private config: PatternConfiguration
+  ) {
+    this.containsPhosphorothioateLinkages = this.checkAnyPhosphorothioateLinkages();
+  }
+
+  getLegendItems(): SVGElement[] {
+    const commentLabel = this.svgFactory.createCommentLabel();
+    const nucleotideLegendItems = this.createLegendItemsForNucleotideTypes();
+    const phosphorothioateLinkageLegendItem = this.createLegendItemForPhosphorothioateLinkage(this.containsPhosphorothioateLinkages);
+
+    return [commentLabel, ...nucleotideLegendItems, ...phosphorothioateLinkageLegendItem];
+  }
+
+  private createLegendItemsForNucleotideTypes(): SVGElement[] {
+    const distinctNucleobaseTypes = this.extractNucleotideTypes();
+    const svgElements = [] as SVGElement[];
+    distinctNucleobaseTypes.forEach((nucleobaseType, index) => {
+      const legendCircle = this.svgFactory.createLegendCircle(nucleobaseType, index, distinctNucleobaseTypes, this.containsPhosphorothioateLinkages);
+      const legendText = this.svgFactory.createLegendText(nucleobaseType, index, distinctNucleobaseTypes, this.containsPhosphorothioateLinkages);
+      svgElements.push(legendCircle, legendText);
+    });
+    return svgElements;
+  }
+
+  private createLegendItemForPhosphorothioateLinkage(containsPhosphorothioateLinkages: boolean): SVGElement[] {
+    const starLinkageLegendLabel = this.svgFactory.createLinkageStarLegendLabel(containsPhosphorothioateLinkages);
+    const phosphorothioateLinkageLabel = this.svgFactory.createPhosphorothioateLinkageLabel(containsPhosphorothioateLinkages);
+
+    return [starLinkageLegendLabel, phosphorothioateLinkageLabel].filter((element) => element !== null) as SVGElement[];
+  }
+
+  private extractNucleotideTypes(): string[] {
+    const distinctNucleotides = [...new Set(
+      this.config.nucleotideSequences[STRAND.SENSE].concat(
+        this.config.isAntisenseStrandIncluded ? this.config.nucleotideSequences[STRAND.ANTISENSE] : []
+      )
+    )];
+
+    return distinctNucleotides;
+  }
+
+  private checkAnyPhosphorothioateLinkages(): boolean {
+    return [...this.config.phosphorothioateLinkageFlags[STRAND.SENSE],
+      ...(this.config.isAntisenseStrandIncluded ? this.config.phosphorothioateLinkageFlags[STRAND.ANTISENSE] : [])
+    ].some((linkage) => linkage);
+  }
+}
+
+class NucleotideCountTracker {
+  private nucleotideCounts: StrandToNumberMap;
+  constructor(initialNucleotideCounts: StrandToNumberMap) {
+    // WARNING: to ensure immutability, we need to deep copy the object
+    this.nucleotideCounts = JSON.parse(JSON.stringify(initialNucleotideCounts)) as StrandToNumberMap;
+  }
+
+  decrementIfNotOverhang(isOverhang: boolean, strand: STRAND): void {
+    if (!isOverhang)
+      this.nucleotideCounts[strand]--;
+  }
+
+  getCurrentCount(strand: STRAND): number {
+    return this.nucleotideCounts[strand];
+  }
+}
+
+class SVGElementFactoryWrapper {
+  constructor(
+    private svgElementFactory: SVGElementFactory,
+    private config: PatternConfiguration,
+    private dimensionsCalculator: PatternSVGDimensionsCalculator
+  ) { }
+
+  createCanvas(): SVGElement {
+    const canvasWidth = this.dimensionsCalculator.getCanvasWidth();
+    const canvasHeight = this.dimensionsCalculator.getCanvasHeight();
+    const svgCanvas = this.svgElementFactory.createCanvas(canvasWidth, canvasHeight);
+
+    return svgCanvas;
+  }
+
+  createTitleElement(patternName: string,
+    numberOfNucleotides: StrandToNumberMap,
+    isAntisenseStrandActive: boolean
+  ) {
+    const titleText = this.getTitleText(patternName, numberOfNucleotides, isAntisenseStrandActive);
+    const titleTextPosition = this.dimensionsCalculator.getTitleTextPosition();
+    return this.svgElementFactory.createTextElement(
+      titleText,
+      titleTextPosition,
+      SVG_TEXT_FONT_SIZES.NUCLEOBASE,
+      SVG_ELEMENT_COLORS.TITLE_TEXT
+    );
+  }
+
+  private getTitleText(
+    patternName: string,
+    numberOfNucleotides: StrandToNumberMap,
+    isAntisenseStrandActive: boolean
+  ): string {
+    const senseStrandLength = `${numberOfNucleotides[STRAND.SENSE]}`;
+    const antisenseStrandLength = isAntisenseStrandActive ? `/${numberOfNucleotides[STRAND.ANTISENSE]}` : '';
+    const titleText = `${patternName} for ${senseStrandLength}${antisenseStrandLength}-mer`;
+
+    return titleText;
+  }
+
+  createPhosphorothioateLinkageStar(strand: StrandType, index: number): SVGElement | null {
+    const isActive = this.config.phosphorothioateLinkageFlags[strand][index];
+    if (!isActive)
+      return null;
+
+    const centerPosition = this.dimensionsCalculator.getCenterPositionOfLinkageStar(index, strand);
+    const color = SVG_ELEMENT_COLORS.LINKAGE_STAR;
+    const starElement = this.svgElementFactory.createStarElement(centerPosition, color);
+
+    return starElement;
+  }
+
+  createNucleotideNumericLabel(
+    indexOfNucleotide: number,
+    strand: STRAND,
+    displayedNucleotideNumber: number
+  ): SVGElement {
+    const nucleotide = this.config.nucleotideSequences[strand][indexOfNucleotide];
+    const isOverhang = isOverhangNucleotide(nucleotide);
+    const labelPosition = this.dimensionsCalculator.getNumericLabelPosition(indexOfNucleotide, strand, displayedNucleotideNumber);
+
+    const labelText = (!isOverhang && this.config.nucleotidesWithNumericLabels.includes(nucleotide)) ?
+      String(displayedNucleotideNumber) :
+      '';
+
+    const nucleotideNumericLabel = this.svgElementFactory.createTextElement(
+      labelText, labelPosition, SVG_TEXT_FONT_SIZES.COMMENT, SVG_ELEMENT_COLORS.TEXT
+    );
+
+    return nucleotideNumericLabel;
+  }
+
+  createNucleotideCircle(indexOfNucleotide: number, strand: STRAND): SVGCircleElement {
+    const nucleotide = this.config.nucleotideSequences[strand][indexOfNucleotide];
+    const nucleotideCirclePosition = this.dimensionsCalculator.getNucleotideCirclePosition(indexOfNucleotide, strand);
+    const nucleotideCircle = this.svgElementFactory.createCircleElement(
+      nucleotideCirclePosition, SVG_CIRCLE_SIZES.NUCLEOBASE_RADIUS, getNucleobaseColorFromStyleMap(nucleotide)
+    );
+    return nucleotideCircle;
+  }
+
+  createNucleotideNameLabel(indexOfNucleotide: number, strand: STRAND): SVGTextElement {
+    const nucleotide = this.config.nucleotideSequences[strand][indexOfNucleotide];
+    const nucleobaseLabelTextPosition = this.dimensionsCalculator.getNucleotideLabelTextPosition(indexOfNucleotide, strand);
+    const nucleotideLabelText = this.svgElementFactory.createTextElement(
+      getNucleobaseLabelForCircle(nucleotide), nucleobaseLabelTextPosition, SVG_TEXT_FONT_SIZES.NUCLEOBASE, computeTextColorForNucleobaseLabel(nucleotide)
+    );
+    return nucleotideLabelText;
+  }
+
+  createCommentLabel(): SVGElement {
+    const commentLabelPosition = this.dimensionsCalculator.getCommentLabelPosition();
+
+    const commentLabel = this.svgElementFactory.createTextElement(
+      this.config.patternComment,
+      commentLabelPosition,
+      SVG_TEXT_FONT_SIZES.COMMENT,
+      SVG_ELEMENT_COLORS.TEXT
+    );
+
+    return commentLabel;
+  }
+
+  createLinkageStarLegendLabel(isPhosphorothioateLinkageActive: boolean): SVGElement | null {
+    const starLabelPosition = this.dimensionsCalculator.getStarLabelPosition();
+    const starLabel = isPhosphorothioateLinkageActive ?
+      this.svgElementFactory.createStarElement(starLabelPosition, SVG_ELEMENT_COLORS.LINKAGE_STAR) :
+      null;
+
+    return starLabel;
+  }
+
+  createPhosphorothioateLinkageLabel(isPhosphorothioateLinkageActive: boolean): SVGElement | null {
+    const position = this.dimensionsCalculator.getPhosphorothioateLinkageLabelPosition();
+    const phosphorothioateLinkageLabel = isPhosphorothioateLinkageActive ?
+      this.svgElementFactory.createTextElement(
+        'ps linkage',
+        position,
+        SVG_TEXT_FONT_SIZES.COMMENT,
+        SVG_ELEMENT_COLORS.TEXT) :
+      null;
+
+    return phosphorothioateLinkageLabel;
+  };
+
+  createLabelForStrandEnd(strand: StrandType, end: STRAND_END): SVGElement | null {
+    const isLabelActive = (strand === STRAND.SENSE) || (strand === STRAND.ANTISENSE && this.config.isAntisenseStrandIncluded);
+    if (!isLabelActive)
+      return null;
+
+
+    const labelText = STRAND_END_LABEL_TEXT[end][strand];
+    const labelPosition = this.dimensionsCalculator.getStrandEndLabelPosition(strand, end);
+
+    return this.svgElementFactory.createTextElement(labelText, labelPosition, SVG_TEXT_FONT_SIZES.NUCLEOBASE, SVG_ELEMENT_COLORS.TEXT);
+  }
+
+  createTerminusModificationLabel(strand: StrandType, terminus: TerminalType): SVGElement | null {
+    if (strand === STRAND.ANTISENSE && !this.config.isAntisenseStrandIncluded)
+      return null;
+
+
+    const end = (strand === STRAND.SENSE && terminus === TERMINUS.FIVE_PRIME) ||
+      (strand === STRAND.ANTISENSE && terminus === TERMINUS.THREE_PRIME) ? STRAND_END.LEFT : STRAND_END.RIGHT;
+
+    const labelText = this.config.strandTerminusModifications[strand][terminus];
+    const labelPosition = this.dimensionsCalculator.getTerminusLabelPosition(strand, end);
+    return this.svgElementFactory.createTextElement(labelText, labelPosition, SVG_TEXT_FONT_SIZES.NUCLEOBASE, SVG_ELEMENT_COLORS.MODIFICATION_TEXT);
+  }
+
+  createLegendCircle(nucleobaseType: string, index: number, distinctNucleobaseTypes: string[], containsPhosphorothioateLinkages: boolean): SVGCircleElement {
+    const radius = SVG_CIRCLE_SIZES.LEGEND_RADIUS;
+    const color = getNucleobaseColorFromStyleMap(nucleobaseType);
+
+    const centerPosition = this.dimensionsCalculator.getLegendCirclePosition(index, distinctNucleobaseTypes, containsPhosphorothioateLinkages);
+    return this.svgElementFactory.createCircleElement(centerPosition, radius, color);
+  }
+
+  createLegendText(nucleobaseType: string, index: number, distinctNucleobaseTypes: string[], containsPhosphorothioateLinkages: boolean): SVGTextElement {
+    const legendPosition = this.dimensionsCalculator.getLegendTextPosition(index, distinctNucleobaseTypes, containsPhosphorothioateLinkages);
+    return this.svgElementFactory.createTextElement(nucleobaseType, legendPosition, SVG_TEXT_FONT_SIZES.COMMENT, SVG_ELEMENT_COLORS.TEXT);
+  }
+}
+
+class StrandElementBuilder {
+  constructor(
+    private svgFactory: SVGElementFactoryWrapper,
+    private config: PatternConfiguration
+  ) { }
+
+  createStrandElements(countOfNucleotidesExcludingOverhangs: StrandToNumberMap): SVGElement[] {
+    const svgElements = [] as SVGElement[];
+
+    const nucleotideCounter = new NucleotideCountTracker(countOfNucleotidesExcludingOverhangs);
+
+    STRANDS.forEach((strand) => {
+      const criterion = strand === STRAND.SENSE || (strand === STRAND.ANTISENSE && this.config.isAntisenseStrandIncluded);
+      if (!criterion)
+        return;
+
+      this.config.nucleotideSequences[strand].forEach((_, index) => {
+        const elements = this.createElementsForNucleotide(index, strand, nucleotideCounter, countOfNucleotidesExcludingOverhangs);
+        svgElements.push(...elements);
+      });
+    });
+
+    return svgElements;
+  }
+
+  // todo reduce the # of args
+  private createElementsForNucleotide(
+    indexOfNucleotide: number,
+    strand: STRAND,
+    counter: NucleotideCountTracker,
+    countOfNucleotidesExcludingOverhangs: StrandToNumberMap
+  ): SVGElement[] {
+    const nucleotide = this.config.nucleotideSequences[strand][indexOfNucleotide];
+    const isOverhang = isOverhangNucleotide(nucleotide);
+
+    counter.decrementIfNotOverhang(isOverhang, strand);
+    const displayedNucleotideNumber = strand === STRAND.SENSE ?
+      counter.getCurrentCount(strand) + 1 :
+      countOfNucleotidesExcludingOverhangs[strand] - counter.getCurrentCount(strand);
+
+
+    const nucleotideNumericLabel = this.svgFactory.createNucleotideNumericLabel(indexOfNucleotide, strand, displayedNucleotideNumber);
+    const nucleotideCircle = this.svgFactory. createNucleotideCircle(indexOfNucleotide, strand);
+    const nucleotideNameLabel = this.svgFactory. createNucleotideNameLabel(indexOfNucleotide, strand);
+
+    const phosphorothioateLinkageStar = this.svgFactory.createPhosphorothioateLinkageStar(strand, indexOfNucleotide);
+
+    const lastNucleotideIndex = this.config.nucleotideSequences[strand].length;
+    const lastStar = this.svgFactory.createPhosphorothioateLinkageStar(strand, lastNucleotideIndex);
+
+    const nucleotideSvgElements = [
+      nucleotideNumericLabel,
+      nucleotideCircle,
+      nucleotideNameLabel,
+      phosphorothioateLinkageStar,
+      lastStar,
+    ].filter((element) => element !== null) as SVGElement[];
+
+    return nucleotideSvgElements;
+  }
+}

package/src/apps/pattern/view/svg-utils/utils.ts

@@ -0,0 +1,37 @@
+import {NUCLEOTIDES} from '../../../common/model/const';
+import {PATTERN_APP_DATA} from '../../../common/model/data-loader/json-loader';
+import {LUMINANCE_COEFFICIENTS, TEXT_COLOR, SVG_CIRCLE_SIZES} from './const';
+import {isOverhangNucleotide} from '../../model/utils';
+
+export function computeLegendCircleYPosition(isAntisenseStrandActive: boolean): number {
+  return (isAntisenseStrandActive ? 9.5 : 6) * SVG_CIRCLE_SIZES.NUCLEOBASE_RADIUS;
+}
+
+export function getNucleobaseLabelForCircle(nucleobase: string): string {
+  const criterion = !isOverhangNucleotide(nucleobase) && NUCLEOTIDES.includes(nucleobase);
+
+  return criterion ? nucleobase : '';
+}
+
+export function computeTextColorForNucleobaseLabel(nucleobase: string): string {
+  const nucleobaseColor = getNucleobaseColorFromStyleMap(nucleobase);
+
+  const rgbValues = nucleobaseColor.match(/\d+/g)?.map(Number);
+  if (!rgbValues || rgbValues.length < 3)
+    return TEXT_COLOR.LIGHT;
+
+
+  const [r, g, b] = rgbValues;
+  const luminance = r * LUMINANCE_COEFFICIENTS.RED + g * LUMINANCE_COEFFICIENTS.GREEN + b * LUMINANCE_COEFFICIENTS.BLUE;
+  return luminance > LUMINANCE_COEFFICIENTS.THRESHOLD ? TEXT_COLOR.DARK : TEXT_COLOR.LIGHT;
+}
+
+export function getNucleobaseColorFromStyleMap(nucleobase: string): string {
+  // todo: optimize
+  const format = Object.keys(PATTERN_APP_DATA)[0];
+  if (!format)
+    throw new Error('No format found in PATTERN_APP_DATA');
+
+  const styleMap = PATTERN_APP_DATA[format];
+  return styleMap[nucleobase].color || '';
+}

package/src/apps/pattern/view/types.ts

@@ -0,0 +1,14 @@
+import * as DG from 'datagrok-api/dg';
+
+import {STRANDS, STRAND_ENDS, TERMINI} from '../model/const';
+
+export type BooleanInput = DG.InputBase<boolean | null>;
+export type StringInput = DG.InputBase<string | null>;
+export type NumberInput = DG.InputBase<number | null>;
+
+export type Position = { x: number, y: number };
+
+export type StrandEndToNumberMap = Record<typeof STRAND_ENDS[number], number>;
+export type StrandToNumberMap = Record<typeof STRANDS[number], number>;
+export type StrandEndToSVGElementsMap = Record<typeof STRAND_ENDS[number], SVGElement | null>;
+export type TerminusToSVGElementMap = Record<typeof TERMINI[number], SVGElement | null>

package/src/apps/pattern/view/ui.ts

@@ -0,0 +1,61 @@
+import * as ui from 'datagrok-api/ui';
+
+import {APP_NAME} from '../../common/view/const';
+import {IsolatedAppUIBase} from '../../common/view/isolated-app-ui';
+import {DataManager} from '../model/data-manager';
+import {EventBus} from '../model/event-bus';
+import {URLRouter} from '../model/router';
+import {PatternAppLeftSection} from './components/left-section';
+import {PatternAppRightSection} from './components/right-section';
+import {PatternConfigRecord} from '../model/types';
+
+
+export class OligoPatternUI extends IsolatedAppUIBase {
+  constructor() {
+    super(APP_NAME.PATTERN);
+  }
+
+  protected getContent(): Promise<HTMLDivElement> {
+    return getContent();
+  }
+}
+
+
+async function getContent(): Promise<HTMLDivElement> {
+  const dataManager = await DataManager.getInstance();
+  const urlRouter = new URLRouter();
+
+  const initialPatternRecord = await getInitialPatternRecord(dataManager, urlRouter);
+  const eventBus = new EventBus(dataManager, initialPatternRecord);
+  urlRouter.subscribeToObservables(eventBus);
+
+  const leftSection = new PatternAppLeftSection(eventBus, dataManager).getLayout();
+  const rightSection = new PatternAppRightSection(eventBus, dataManager).getLayout();
+
+  const isResizeable = true;
+
+  const layout = ui.splitH([
+    leftSection,
+    rightSection,
+  ], {}, isResizeable);
+
+  return layout;
+}
+
+async function getInitialPatternRecord(
+  dataManager: DataManager,
+  urlRouter: URLRouter
+): Promise<PatternConfigRecord> {
+  const patternHash = urlRouter.getPatternHash();
+  if (!patternHash) {
+    urlRouter.clearPatternURL();
+    return dataManager.getDefaultPatternRecord();
+  }
+
+  let initialPatternRecord = await dataManager.getPatternRecord(patternHash);
+  if (!initialPatternRecord) {
+    urlRouter.clearPatternURL();
+    initialPatternRecord = dataManager.getDefaultPatternRecord();
+  }
+  return initialPatternRecord;
+}

package/src/{model/structure-app → apps/structure/model}/mol-transformations.ts

@@ -36,7 +36,7 @@ export function linkStrandsV3000(
 
   let inverted = false;
   const molBlocks = strands.senseStrands.concat(strands.antiStrands);
-  /** Minimal value of AS and AS2 shift  */
+  /** Minimal value of ANTISENSE_STRAND and AS2 shift  */
   let ssYShift = 0;
 
   for (let i = 0; i < molBlocks.length; i++) {
@@ -47,12 +47,12 @@ export function linkStrandsV3000(
 
     if (i >= strands.senseStrands.length) {
       if (inverted === false) {
-        // AS strand
+        // ANTISENSE_STRAND strand
         inverted = true;
         xShift = 0;
       }
     } else {
-      // SS strands
+      // SENSE_STRAND strands
       ssYShift = Math.min(ssYShift, Math.min(
         ...coordinates.y.filter((item) => item < 0)
       ));

package/src/{model/structure-app → apps/structure/model}/monomer-code-parser.ts

@@ -4,15 +4,15 @@ import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
 
 import {PHOSPHATE_SYMBOL} from './const';
-import {sortByReverseLength} from '../helpers';
-import {MonomerLibWrapper} from '../monomer-lib/lib-wrapper';
-import {monomersWithPhosphateLinkers} from '../data-loading-utils/json-loader';
+import {sortByReverseLength} from '../../common/model/helpers';
+import {MonomerLibWrapper} from '../../common/model/monomer-lib/lib-wrapper';
+import {MONOMERS_WITH_PHOSPHATE} from '../../common/model/data-loader/json-loader';
 
 /** Wrapper for parsing a strand and getting a sequence of monomer IDs (with
  * omitted linkers, if needed)  */
 export class MonomerSequenceParser {
   constructor(
-    private sequence: string, 
+    private sequence: string,
     // todo: remove from the list of parameters
     private codeMap: Map<string, string>
   ) {
@@ -39,9 +39,8 @@ export class MonomerSequenceParser {
       const nextMonomerIsPhosphate = (i + 1 < parsedRawCodes.length && monomerIsPhosphateLinker(this.getSymbolForCode(parsedRawCodes[i + 1])));
 
       // todo: refactor as molfile-specific
-      if (!isPhosphate && !monomerHasRightPhosphateLinker(monomerSymbol) && !nextMonomerIsPhosphate && !lastMonomer) {
+      if (!isPhosphate && !monomerHasRightPhosphateLinker(monomerSymbol) && !nextMonomerIsPhosphate && !lastMonomer)
         monomerSymbolSequence.push(PHOSPHATE_SYMBOL);
-      }
     });
     return monomerSymbolSequence;
   }
@@ -70,20 +69,20 @@ export class MonomerSequenceParser {
 
   // todo: port to monomer handler
   private getAllCodesOfFormat(): string[] {
-    let allCodesInTheFormat = Array.from(this.codeMap.keys());
+    const allCodesInTheFormat = Array.from(this.codeMap.keys());
     return sortByReverseLength(allCodesInTheFormat);
   }
 }
 
 // todo: to be eliminated after full helm support
 function monomerHasLeftPhosphateLinker(monomerSymbol: string): boolean {
-  return monomersWithPhosphateLinkers['left'].includes(monomerSymbol);
+  return MONOMERS_WITH_PHOSPHATE['left'].includes(monomerSymbol);
 }
 
 function monomerHasRightPhosphateLinker(monomerSymbol: string): boolean {
-  return monomersWithPhosphateLinkers['right'].includes(monomerSymbol);
+  return MONOMERS_WITH_PHOSPHATE['right'].includes(monomerSymbol);
 }
 
 function monomerIsPhosphateLinker(monomerSymbol: string): boolean {
-  return monomersWithPhosphateLinkers['phosphate'].includes(monomerSymbol);
+  return MONOMERS_WITH_PHOSPHATE['phosphate'].includes(monomerSymbol);
 }

package/src/{model/structure-app → apps/structure/model}/oligo-structure.ts

@@ -4,11 +4,11 @@ import * as DG from 'datagrok-api/dg';
 
 import {errorToConsole} from '@datagrok-libraries/utils/src/to-console';
 
-import {download} from '../helpers';
+import {download} from '../../common/model/helpers';
 import {SequenceToMolfileConverter} from './sequence-to-molfile';
 import {linkStrandsV3000} from './mol-transformations';
-import {DEFAULT_FORMATS} from '../const';
-import {FormatDetector} from '../parsing-validation/format-detector';
+import {DEFAULT_FORMATS} from '../../common/model/const';
+import {FormatDetector} from '../../common/model/parsing-validation/format-detector';
 
 export type StrandData = {
   strand: string,
@@ -62,7 +62,7 @@ export function saveSdf(
     nonEmptyStrands.length === 0 ||
     nonEmptyStrands.length === 1 && ss.strand === ''
   ) {
-    grok.shell.warning('Enter SS and optionally AS/AS2 to save SDF');
+    grok.shell.warning('Enter SENSE_STRAND and optionally ANTISENSE_STRAND/AS2 to save SDF');
   } else {
     let result: string;
     if (oneEntity) {

package/src/{model/structure-app → apps/structure/model}/sequence-to-molfile.ts

@@ -4,7 +4,7 @@ import * as ui from 'datagrok-api/ui';
 import * as DG from 'datagrok-api/dg';
 
 import {MonomerSequenceParser} from './monomer-code-parser';
-import {MonomerLibWrapper} from '../monomer-lib/lib-wrapper';
+import {MonomerLibWrapper} from '../../common/model/monomer-lib/lib-wrapper';
 
 export class SequenceToMolfileConverter {
   constructor(
@@ -24,7 +24,7 @@ export class SequenceToMolfileConverter {
     parsedSequence.forEach((monomerSymbol, idx) => {
       const monomerMolfile = this.getMonomerMolfile(monomerSymbol, idx);
       monomerMolfiles.push(monomerMolfile);
-    })
+    });
     let molfile = this.getPolymerMolfile(monomerMolfiles);
     if (this.invert) {
       molfile = this.reflect(molfile);