@teselagen/ove 0.7.26 → 0.7.28

package/editorUtils.js

@@ -0,0 +1,205 @@
+import { getRangeLength, getSequenceWithinRange } from "@teselagen/range-utils";
+import React from "react";
+import { divideBy3 } from "./proteinUtils";
+import {
+  getInsertBetweenVals,
+  calculatePercentGC,
+  aliasedEnzymesByName
+} from "@teselagen/sequence-utils";
+import { get, sortBy } from "lodash-es";
+import VeWarning from "../helperComponents/VeWarning";
+import { normalizePositionByRangeLength } from "@teselagen/range-utils";
+import { filter } from "lodash-es";
+
+export function getSelectionMessage({
+  caretPosition = -1,
+  selectionLayer = { start: -1, end: -1 },
+  customTitle,
+  sequenceLength,
+  sequenceData,
+  showGCContent, //these are only passed in for the status bar
+  GCDecimalDigits, //these are only passed in for the status bar
+  isProtein
+}) {
+  let _selectionLayer = selectionLayer;
+  const isSelecting = selectionLayer.start > -1;
+  if (isSelecting) {
+    _selectionLayer = getSelFromWrappedAddon(selectionLayer, sequenceLength);
+    const length = getRangeLength(_selectionLayer, sequenceLength);
+    const GCContent = (numDecimalDigits = 0) =>
+      calculatePercentGC(
+        getSequenceWithinRange(_selectionLayer, sequenceData.sequence)
+      ).toFixed(numDecimalDigits);
+    const seqLen = divideBy3(length, isProtein);
+    return `${customTitle || "Selecting"} ${seqLen} ${
+      (isProtein ? "AA" : "bp") + (seqLen === 1 ? "" : "s")
+    } from ${divideBy3(_selectionLayer.start, isProtein) + 1} to ${divideBy3(
+      _selectionLayer.end + 1,
+      isProtein
+    )}${
+      showGCContent && !isProtein ? ` (${GCContent(GCDecimalDigits)}% GC)` : ""
+    }`;
+  } else if (caretPosition > -1) {
+    const insertBetween = getInsertBetweenVals(
+      caretPosition,
+      _selectionLayer,
+      sequenceLength
+    );
+    return (
+      `Caret Between ` +
+      (isProtein
+        ? `AAs ${divideBy3(insertBetween[0], true)} and ${divideBy3(
+            insertBetween[1] + 2,
+            true
+          )}`
+        : `Bases ${insertBetween[0]} and ${insertBetween[1]}`)
+    );
+  } else {
+    return "No Selection";
+  }
+}
+
+export function preventDefaultStopPropagation(e) {
+  if (e) {
+    e.stopPropagation();
+    e.preventDefault();
+  }
+}
+
+export function getNodeToRefocus(caretEl) {
+  let nodeToReFocus;
+  if (
+    caretEl &&
+    caretEl.closest &&
+    caretEl.closest(".veVectorInteractionWrapper")
+  ) {
+    nodeToReFocus = caretEl.closest(".veVectorInteractionWrapper");
+  }
+  return nodeToReFocus;
+}
+
+export function getEmptyText({ sequenceData, caretPosition }) {
+  return sequenceData.sequence.length === 0 && caretPosition === -1 ? (
+    <div className="veEmptySeqText">Insert Sequence Here</div>
+  ) : null;
+}
+
+export function tryToRefocusEditor() {
+  const ed = document.querySelector(".veVectorInteractionWrapper");
+  ed && ed.focus();
+}
+export function getCustomEnzymes() {
+  try {
+    const customEnzymes = JSON.parse(
+      window.localStorage.getItem("customEnzymes") || "{}"
+    );
+    return customEnzymes;
+  } catch (error) {
+    return {};
+  }
+}
+export function addCustomEnzyme(newEnz) {
+  const customEnzymes = getCustomEnzymes();
+  window.localStorage.setItem(
+    "customEnzymes",
+    JSON.stringify({
+      ...customEnzymes,
+      [newEnz.name.toLowerCase()]: newEnz
+    })
+  );
+}
+
+export function pareDownAnnotations(annotations, max) {
+  let annotationsToPass = annotations;
+  let paredDown = false;
+  if (Object.keys(annotations).length > max) {
+    paredDown = true;
+    const sortedAnnotations = sortBy(annotations, function (annotation) {
+      return -getRangeLength(annotation);
+    });
+    annotationsToPass = sortedAnnotations.slice(0, max).reduce(function (
+      obj,
+      item
+    ) {
+      obj[item.id] = item;
+      return obj;
+    }, {});
+  }
+  return [annotationsToPass, paredDown];
+}
+export function getParedDownWarning({ nameUpper, maxToShow, isAdjustable }) {
+  return (
+    <VeWarning
+      key={`ve-warning-max${nameUpper}ToDisplay`}
+      data-test={`ve-warning-max${nameUpper}ToDisplay`}
+      tooltip={`Warning: More than ${maxToShow} ${
+        nameUpper === "Cutsites" ? "Cut Sites" : nameUpper
+      }. Only displaying ${maxToShow} ${
+        isAdjustable ? "(Configure this under View > Limits)" : ""
+      } `}
+    />
+  );
+}
+
+export function getClientX(event) {
+  return event.clientX || get(event, "touches[0].clientX");
+}
+export function getClientY(event) {
+  return event.clientY || get(event, "touches[0].clientY");
+}
+
+export function hideAnnByLengthFilter(hideOpts, ann, seqLen) {
+  const featLength = getRangeLength(ann, seqLen);
+  return (
+    hideOpts.enabled && (featLength < hideOpts.min || featLength > hideOpts.max)
+  );
+}
+
+export function getSelFromWrappedAddon(selectionLayer, sequenceLength) {
+  const selToUse = {
+    ...selectionLayer
+  };
+  if (selectionLayer.isWrappedAddon) {
+    const oldEnd = selToUse.end;
+    selToUse.end = normalizePositionByRangeLength(
+      selToUse.start - 1,
+      sequenceLength
+    );
+    selToUse.start = normalizePositionByRangeLength(oldEnd + 1, sequenceLength);
+    delete selToUse.isWrappedAddon;
+  }
+  return selToUse;
+}
+
+export function getStripedPattern({ color, id }) {
+  return (
+    <pattern
+      id={`diagonalHatch-${id}`}
+      patternUnits="userSpaceOnUse"
+      width="4"
+      height="4"
+    >
+      <path
+        d="M-1,1 l2,-2
+           M0,4 l4,-4
+           M3,5 l2,-2"
+        style={{
+          stroke: color,
+          strokeWidth: 2,
+          fill: "blue",
+          opacity: 0.4
+        }}
+      />
+    </pattern>
+  );
+}
+export const getEnzymeAliases = enzyme => {
+  let lowerName = (enzyme.name && enzyme.name.toLowerCase()) || "";
+  if (typeof enzyme === "string") {
+    lowerName = enzyme.toLowerCase();
+  }
+  return filter(
+    (aliasedEnzymesByName[lowerName] || {}).aliases,
+    n => n.toLowerCase() !== lowerName //filter out current enzyme
+  );
+};

package/estimateRowHeight.js

@@ -0,0 +1,184 @@
+import { forEach } from "lodash-es";
+
+const debug = 0;
+// const debug = console.log("comment me back out!") || 1;
+
+export const rowHeights = {
+  rowJumpButtons: { height: 30 },
+  spacer: { height: 10 },
+  aminoAcidNumbers: { height: 9 },
+  translations: { spaceBetweenAnnotations: 2, marginTop: 5, height: 17 },
+  chromatogram: { height: 134 },
+  parts: { spaceBetweenAnnotations: 2, marginTop: 5, height: 15 },
+  primers: { spaceBetweenAnnotations: 2, marginTop: 5, height: 18 },
+  features: { spaceBetweenAnnotations: 2, marginTop: 5, height: 15 },
+  warnings: { spaceBetweenAnnotations: 2, marginTop: 5, height: 15 },
+  assemblyPieces: { spaceBetweenAnnotations: 2, marginTop: 5, height: 15 },
+  lineageAnnotations: { spaceBetweenAnnotations: 2, marginTop: 5, height: 15 },
+  orfs: { spaceBetweenAnnotations: 2, marginTop: 5, height: 15 },
+  //tnrtodo -- we should estimate external label height for parts/features/primers
+  cutsiteLabels: { spaceBetweenAnnotations: 0, height: 15 },
+  sequence: { height: 15 },
+  reverseSequence: { height: 15 },
+  axis: { marginTop: 5, height: 15 }
+};
+
+rowHeights.primaryProteinSequence = rowHeights.translations;
+
+Object.keys(rowHeights).forEach(k => {
+  rowHeights[k].type = k;
+  rowHeights[k].marginTop = rowHeights[k].marginTop || 0;
+  rowHeights[k].marginBottom = rowHeights[k].marginBottom || 0;
+  rowHeights[k].spaceBetweenAnnotations =
+    rowHeights[k].spaceBetweenAnnotations || 0;
+});
+const translations = {
+  getHeight: props => {
+    if (props.annotationVisibility.aminoAcidNumbers) {
+      return [rowHeights.aminoAcidNumbers.type, rowHeights.translations.type];
+    }
+    return rowHeights.translations.type;
+  },
+  hasYOffset: true
+};
+
+const annotationsToCompute = {
+  spacer: {
+    alwaysVisible: true,
+    height: rowHeights.spacer.type
+  },
+  primaryProteinSequence: translations,
+  translations,
+  parts: {
+    height: rowHeights.parts.type,
+    hasYOffset: true
+  },
+  primers: {
+    height: rowHeights.primers.type,
+    hasYOffset: true
+  },
+  features: {
+    height: rowHeights.features.type,
+    hasYOffset: true
+  },
+  chromatogram: {
+    height: rowHeights.chromatogram.type
+  },
+  warnings: {
+    height: rowHeights.warnings.type,
+    hasYOffset: true
+  },
+  orfs: {
+    height: rowHeights.orfs.type,
+    hasYOffset: true
+  },
+  sequence: {
+    height: rowHeights.sequence.type
+  },
+  reverseSequence: {
+    height: rowHeights.reverseSequence.type
+  },
+  axis: {
+    height: rowHeights.axis.type
+  },
+  cutsiteLabels: {
+    typeOverride: "cutsites",
+    height: rowHeights.cutsiteLabels.type,
+    hasYOffset: true
+  }
+};
+
+export default props => {
+  let {
+    index,
+    cache,
+    clearCache,
+    chromatogramData,
+    rowCount,
+    row,
+    showJumpButtons,
+    annotationVisibility
+  } = props;
+  if (clearCache) {
+    cache = {};
+  }
+
+  if (cache[index]) {
+    return cache[index];
+  }
+  if (!row) return 0;
+  let totalHeight = 0; //account for spacer
+  if (showJumpButtons && (index === 0 || index === rowCount - 1)) {
+    totalHeight += rowHeights.rowJumpButtons.height;
+  }
+  forEach(
+    annotationsToCompute,
+    (
+      { height: _height, alwaysVisible, getHeight, hasYOffset, typeOverride },
+      key
+    ) => {
+      const shouldShow =
+        alwaysVisible || annotationVisibility[typeOverride || key];
+      if (!shouldShow) return;
+      if (key === "chromatogram" && !chromatogramData) return;
+      const heightKeys = getHeight ? getHeight(props) : _height;
+      const [annotationHeight, marginHeight] = getSummedHeights(
+        heightKeys,
+        props
+      );
+
+      let heightToAdd = annotationHeight;
+      if (hasYOffset) {
+        const annotations = row[typeOverride || key];
+        if (hasYOffset) {
+          let maxYOffset = 0;
+          annotations &&
+            annotations.forEach(a => {
+              if (a.yOffset + 1 > maxYOffset) maxYOffset = a.yOffset + 1;
+            });
+          heightToAdd = maxYOffset * annotationHeight;
+        }
+      }
+      if (heightToAdd > 0) heightToAdd += marginHeight;
+
+      if (debug) {
+        heightToAdd !== 0 &&
+          console.info(`heightToAdd, key:`, heightToAdd, key);
+      }
+      totalHeight += heightToAdd;
+    }
+  );
+  if (debug) {
+    console.info(`totalHeight:`, totalHeight);
+  }
+  if (annotationVisibility.compactNames) {
+    totalHeight = Math.max(totalHeight, 31);
+  }
+  cache[index] = totalHeight;
+  return totalHeight;
+};
+
+function getHeights(heightKey, props) {
+  const annotationHeight = !heightKey
+    ? 0
+    : props[heightKey + "Height"] || (rowHeights[heightKey] || {}).height || 0;
+
+  const marginHeight =
+    (props[heightKey + "MarginTop"] ||
+      (rowHeights[heightKey] || {}).marginTop ||
+      0) +
+    (props[heightKey + "MarginBottom"] ||
+      (rowHeights[heightKey] || {}).marginBottom ||
+      0);
+  return [annotationHeight, marginHeight];
+}
+function getSummedHeights(heightKeys, props) {
+  let height = 0;
+  let marginHeight = 0;
+  (Array.isArray(heightKeys) ? heightKeys : [heightKeys]).forEach(k => {
+    const [h, m] = getHeights(k, props);
+    height += h;
+    marginHeight += m;
+  });
+  return [height, marginHeight];
+}

package/featureLengthsToHide.js

@@ -0,0 +1,27 @@
+import createMergedDefaultStateReducer from "./utils/createMergedDefaultStateReducer";
+import createAction from "./utils/createMetaAction";
+
+// ------------------------------------
+// Actions
+// ------------------------------------
+export const updateFeatureLengthsToHide = createAction(
+  "updateFeatureLengthsToHide"
+);
+export const toggleFeatureLengthsToHide = createAction(
+  "toggleFeatureLengthsToHide"
+);
+
+// ------------------------------------
+// Reducer
+// ------------------------------------
+export default createMergedDefaultStateReducer(
+  {
+    [updateFeatureLengthsToHide]: (state, payload) => {
+      return { ...state, ...payload };
+    },
+    [toggleFeatureLengthsToHide]: state => {
+      return { ...state, enabled: !state["enabled"] };
+    }
+  },
+  { enabled: false, min: 0, max: 800 }
+);

package/featureTool.js

@@ -0,0 +1,34 @@
+import { Icon } from "@blueprintjs/core";
+// import { Checkbox, Button } from "@blueprintjs/core";
+import React from "react";
+// import { connect } from "react-redux";
+// import { convertRangeTo1Based } from "@teselagen/range-utils";
+import { featureIcon } from "@teselagen/ui";
+import ToolbarItem from "./ToolbarItem";
+import { connectToEditor } from "../withEditorProps";
+
+export default connectToEditor(
+  ({ annotationVisibility = {}, toolBar = {} }) => {
+    return {
+      toggled: annotationVisibility.features,
+      isOpen: toolBar.openItem === "featureTool"
+    };
+  }
+)(({ toolbarItemProps, toggled, annotationVisibilityToggle, isOpen }) => {
+  return (
+    <ToolbarItem
+      {...{
+        Icon: <Icon icon={featureIcon} />,
+        onIconClick: function () {
+          annotationVisibilityToggle("features");
+        },
+        toggled,
+        tooltip: "Show features",
+        tooltipToggled: "Hide features",
+        // Dropdown: ConnectedFeatureToolDropdown,
+        dropdowntooltip: (!isOpen ? "Show" : "Hide") + " Feature Options",
+        ...toolbarItemProps
+      }}
+    />
+  );
+});

package/features.js

@@ -0,0 +1,19 @@
+import { createReducer } from "redux-act";
+import createAction from "../utils/createMetaAction";
+import upsertDeleteActionGenerator from "./upsertDeleteActionGenerator";
+
+// ------------------------------------
+// Actions
+// ------------------------------------
+export const upsertFeature = createAction("UPSERT_FEATURE");
+export const deleteFeature = createAction("DELETE_FEATURE");
+
+// ------------------------------------
+// Reducer
+// ------------------------------------
+export default createReducer(
+  {
+    ...upsertDeleteActionGenerator(upsertFeature, deleteFeature)
+  },
+  {}
+);

package/featuresSelector.js

@@ -0,0 +1,8 @@
+import { createSelector } from "reselect";
+import sequenceDataSelector from "./sequenceDataSelector";
+
+function featuresRawSelector(sequenceData) {
+  return sequenceData.features;
+}
+
+export default createSelector(sequenceDataSelector, featuresRawSelector);

package/filteredCutsitesSelector.js

@@ -0,0 +1,136 @@
+import flatmap from "lodash/flatMap";
+import { createSelector } from "reselect";
+import cutsitesSelector from "./cutsitesSelector";
+import filteredRestrictionEnzymesSelector from "./filteredRestrictionEnzymesSelector";
+import specialCutsiteFilterOptions from "../constants/specialCutsiteFilterOptions";
+import { flatMap } from "lodash-es";
+import isEnzymeFilterAndSelector from "./isEnzymeFilterAndSelector";
+
+export default createSelector(
+  cutsitesSelector,
+  filteredRestrictionEnzymesSelector,
+  isEnzymeFilterAndSelector,
+  (state, addEnzs, enzymeGroupsOverride) => enzymeGroupsOverride,
+  function (
+    { cutsitesByName },
+    filteredRestrictionEnzymes,
+    isEnzymeFilterAnd,
+    enzymeGroupsOverride
+  ) {
+    const returnVal = {
+      cutsitesByName: {}
+    };
+    // const cutsitesByName = getLowerCaseObj(cutsitesByName);
+    const hiddenEnzymesByName = {};
+    let filteredEnzymes = [];
+    let enzymesFromGroups = [];
+    let hasUserGroup;
+    let groupCount = 0;
+    //handle adding enzymes that are included in user created groups
+    filteredRestrictionEnzymes.forEach(e => {
+      if (e.value.includes("__userCreatedGroup")) {
+        hasUserGroup = true;
+        const existingGroups = {
+          ...window.getExistingEnzymeGroups(),
+          ...enzymeGroupsOverride
+        };
+        const enzymes =
+          existingGroups[e.value.replace("__userCreatedGroup", "")] || [];
+        const zs = flatMap(enzymes, e => (e ? { value: e } : []));
+        filteredEnzymes = filteredEnzymes.concat(zs);
+        enzymesFromGroups = enzymesFromGroups.concat(zs);
+        groupCount += 1;
+      } else if (e.isHidden) {
+        hiddenEnzymesByName[e.value] = e;
+      } else {
+        if (!e) return;
+        groupCount += 1;
+        filteredEnzymes.push(e);
+      }
+    });
+    const cutSiteList = [];
+    if (!filteredEnzymes || (filteredEnzymes.length === 0 && !hasUserGroup)) {
+      returnVal.cutsitesByName = cutsitesByName;
+    } else {
+      //loop through each filter option ('Single Cutters', 'BamHI')
+      filteredEnzymes.forEach(function ({ value, ...rest }) {
+        if (!value) {
+          console.error(`Missing value for filtered enzyme`, rest);
+          return;
+        }
+        const lowerValue = value.toLowerCase();
+        const cutsThisManyTimes =
+          specialCutsiteFilterOptions[value] &&
+          specialCutsiteFilterOptions[value].cutsThisManyTimes;
+        if (value === "type2s") {
+          Object.keys(cutsitesByName).forEach(function (key) {
+            if (hiddenEnzymesByName[key]) return; //don't show that cutsite
+            if (
+              cutsitesByName[key].length &&
+              cutsitesByName[key][0]?.restrictionEnzyme?.isType2S
+            ) {
+              cutSiteList.push(key);
+              returnVal.cutsitesByName[key] = cutsitesByName[key];
+            }
+          });
+        } else if (cutsThisManyTimes > 0) {
+          //the cutter type is either 1,2,3 for single, double or triple cutters
+          Object.keys(cutsitesByName).forEach(function (key) {
+            if (hiddenEnzymesByName[key]) return; //don't show that cutsite
+            if (cutsitesByName[key].length === cutsThisManyTimes) {
+              cutSiteList.push(key);
+              returnVal.cutsitesByName[key] = cutsitesByName[key];
+            }
+          });
+        } else {
+          if (hiddenEnzymesByName[lowerValue]) return; //don't show that cutsite
+          //normal enzyme ('BamHI')
+          if (!cutsitesByName[lowerValue]) return;
+          cutSiteList.push(lowerValue);
+          returnVal.cutsitesByName[lowerValue] = cutsitesByName[lowerValue];
+        }
+      });
+    }
+
+    const enzymeCounts = {};
+    cutSiteList.forEach(
+      enzyme =>
+        (enzymeCounts[enzyme] = enzymeCounts[enzyme]
+          ? enzymeCounts[enzyme] + 1
+          : 1)
+    );
+
+    const intersectionCutSites = [];
+    Object.keys(enzymeCounts).forEach(key => {
+      if (enzymeCounts[key] === groupCount) intersectionCutSites.push(key);
+    });
+
+    returnVal.cutsiteIntersectionCount = intersectionCutSites.length;
+
+    const cutsbyname_AND = {};
+    intersectionCutSites.forEach(value => {
+      cutsbyname_AND[value] = cutsitesByName[value];
+    });
+
+    returnVal.cutsiteTotalCount = Object.keys(returnVal.cutsitesByName).length;
+
+    if (isEnzymeFilterAnd && returnVal.cutsiteIntersectionCount > 0) {
+      returnVal.cutsitesByName = cutsbyname_AND;
+    }
+
+    returnVal.cutsitesArray = flatmap(
+      returnVal.cutsitesByName,
+      cutsitesByNameArray => cutsitesByNameArray
+    );
+    returnVal.cutsitesById = returnVal.cutsitesArray.reduce(function (
+      obj,
+      item
+    ) {
+      if (item && item.id) {
+        obj[item.id] = item;
+      }
+      return obj;
+    }, {});
+    return returnVal;
+  }
+);

package/filteredFeaturesSelector.js

@@ -0,0 +1,32 @@
+import { createSelector } from "reselect";
+import { omitBy } from "lodash-es";
+import featuresSelector from "./featuresSelector";
+import sequenceLengthSelector from "./sequenceLengthSelector";
+import { hideAnnByLengthFilter } from "../utils/editorUtils";
+
+function filteredFeaturesSelector(
+  features,
+  seqLen,
+  featureIndividualToHide,
+  featureTypesToHide,
+  lengthsToHide
+) {
+  return omitBy(features, ann => {
+    const hideIndividually = featureIndividualToHide[ann.id];
+    const hideFeaturesByType = featureTypesToHide[ann.type];
+    return (
+      hideAnnByLengthFilter(lengthsToHide, ann, seqLen) ||
+      hideFeaturesByType ||
+      hideIndividually
+    );
+  });
+}
+
+export default createSelector(
+  featuresSelector,
+  sequenceLengthSelector,
+  state => state.annotationVisibility.featureIndividualToHide,
+  state => state.annotationVisibility.featureTypesToHide,
+  state => state.featureLengthsToHide,
+  filteredFeaturesSelector
+);