@sjcrh/proteinpaint-client 2.224.2 → 2.226.0

package/dist/chunk-Q7GK35TB.js

@@ -0,0 +1,257 @@
+import {
+  make_table_2col
+} from "./chunk-DPWSIN62.js";
+
+// src/block.mds.expressionstat.js
+var color_noinfo = "#858585";
+function init_config(cfg) {
+  if (!cfg.datatype) cfg.datatype = "FPKM";
+  if (!cfg.itemcolor) cfg.itemcolor = "green";
+  if (!cfg.ase) cfg.ase = {};
+  if (cfg.ase.qvalue == void 0) cfg.ase.qvalue = 0.05;
+  if (cfg.ase.meandelta_monoallelic == void 0) cfg.ase.meandelta_monoallelic = 0.3;
+  if (cfg.ase.asemarkernumber_biallelic == void 0) cfg.ase.asemarkernumber_biallelic = 0;
+  if (!cfg.ase.color_noinfo) cfg.ase.color_noinfo = color_noinfo;
+  if (!cfg.ase.color_uncertain) cfg.ase.color_uncertain = "#A8E0B5";
+  if (!cfg.ase.color_biallelic) cfg.ase.color_biallelic = "#40859C";
+  if (!cfg.ase.color_monoallelic) cfg.ase.color_monoallelic = "#d95f02";
+  if (!cfg.outlier) cfg.outlier = {};
+  if (cfg.outlier.pvalue_cutoff == void 0) cfg.outlier.pvalue_cutoff = 0.05;
+  if (cfg.outlier.rank_asehigh_cutoff == void 0) cfg.outlier.rank_asehigh_cutoff = 0.1;
+  if (!cfg.outlier.color_outlier) cfg.outlier.color_outlier = "#FF8875";
+  if (!cfg.outlier.color_outlier_asehigh) cfg.outlier.color_outlier_asehigh = "blue";
+}
+function measure(v, cfg) {
+  if (!cfg) return;
+  v.estat = {};
+  if (v.ase && cfg.ase) {
+    const qvalue = v.ase.qvalue || v.ase.geometricmean;
+    if (qvalue == void 0) {
+      v.estat.ase_noinfo = true;
+    } else if (qvalue <= cfg.ase.qvalue) {
+      if (v.ase.mean_delta >= cfg.ase.meandelta_monoallelic) {
+        v.estat.ase_monoallelic = true;
+      } else {
+        v.estat.ase_uncertain = true;
+      }
+    } else {
+      if (v.ase.ase_markers == cfg.ase.asemarkernumber_biallelic) {
+        v.estat.ase_biallelic = true;
+      } else {
+        v.estat.ase_uncertain = true;
+      }
+    }
+  } else {
+    v.estat.ase_noinfo = true;
+  }
+  if (v.outlier && cfg.outlier) {
+    if (v.outlier.test_whitelist) {
+      if (v.outlier.test_whitelist.pvalue <= cfg.outlier.pvalue_cutoff) {
+        v.estat.outlier = true;
+      } else {
+        if (v.estat.ase_monoallelic) {
+          if (Number.isInteger(v.outlier.test_whitelist.rank) && Number.isInteger(v.outlier.test_whitelist.size) && v.outlier.test_whitelist.rank / v.outlier.test_whitelist.size <= cfg.outlier.rank_asehigh_cutoff) {
+            v.estat.outlier_asehigh = true;
+            v.outlier.test_whitelist.asehigh = true;
+          }
+        }
+      }
+    } else if (v.outlier.test_biallelic) {
+      if (v.outlier.test_biallelic.pvalue <= cfg.outlier.pvalue_cutoff) {
+        v.estat.outlier = true;
+      } else {
+        if (v.estat.ase_monoallelic) {
+          if (Number.isInteger(v.outlier.test_biallelic.rank) && Number.isInteger(v.outlier.test_biallelic.size) && v.outlier.test_biallelic.rank / v.outlier.test_biallelic.size <= cfg.outlier.rank_asehigh_cutoff) {
+            v.estat.outlier_asehigh = true;
+            v.outlier.test_biallelic.asehigh = true;
+          }
+        }
+      }
+    } else if (v.outlier.test_entirecohort) {
+      if (v.outlier.test_entirecohort.pvalue <= cfg.outlier.pvalue_cutoff) {
+        v.estat.outlier = true;
+      } else {
+        if (v.estat.ase_monoallelic) {
+          if (Number.isInteger(v.outlier.test_entirecohort.rank) && Number.isInteger(v.outlier.test_entirecohort.size) && v.outlier.test_entirecohort.rank / v.outlier.test_entirecohort.size <= cfg.outlier.rank_asehigh_cutoff) {
+            v.estat.outlier_asehigh = true;
+            v.outlier.test_entirecohort.asehigh = true;
+          }
+        }
+      }
+    }
+  }
+}
+function showsingleitem_table(v, cfg, table) {
+  if (!v.estat) return;
+  if (cfg.no_ase) return;
+  if (v.ase) {
+    const tr = table.append("tr");
+    tr.append("td").attr("colspan", 2).style("background", ase_color(v, cfg)).style("color", "white").html(
+      (v.estat.ase_monoallelic ? "Mono-allelic" : v.estat.ase_biallelic ? "Bi-allelic" : "ASE uncertain") + "<br>(allele-specific expression)"
+    );
+    const lst = [
+      {
+        k: "#SNPs heterozygous in DNA",
+        v: v.ase.markers
+      },
+      {
+        k: "#SNPs showing ASE in RNA",
+        v: v.ase.ase_markers
+      },
+      {
+        k: "Mean delta of ASE SNPs",
+        v: v.ase.mean_delta
+      }
+    ];
+    if (v.ase.qvalue) {
+      lst.push({
+        k: "Q-value",
+        v: v.ase.qvalue
+      });
+    } else if (v.ase.geometricmean) {
+      lst.push({
+        k: "Geometric mean of binomial P-values of ASE SNPs",
+        v: v.ase.geometricmean
+      });
+    }
+    const td = tr.append("td");
+    make_table_2col(td, lst);
+  } else {
+    const tr = table.append("tr");
+    tr.append("td").attr("colspan", 3).style("background", cfg.ase.color_noinfo).style("color", "white").text("No info on allele-specific expression");
+  }
+  if (v.outlier) {
+    if (v.outlier.test_whitelist) {
+      const tr = table.append("tr");
+      tr.append("td").attr("colspan", 2).text("Outlier (white list)");
+      const lst = [];
+      for (const k in v.outlier.test_whitelist) {
+        lst.push({ k, v: v.outlier.test_whitelist[k] });
+      }
+      const td = tr.append("td");
+      make_table_2col(td, lst);
+      if (v.outlier.test_whitelist.asehigh) {
+        td.append("div").style("background", cfg.outlier.color_outlier_asehigh).style("padding", "2px 10px").style("color", "white").text("ASE high");
+      }
+    }
+    if (v.outlier.test_biallelic) {
+      const tr = table.append("tr");
+      tr.append("td").attr("colspan", 2).text("Outlier (biallelic)");
+      const lst = [];
+      for (const k in v.outlier.test_biallelic) {
+        lst.push({ k, v: v.outlier.test_biallelic[k] });
+      }
+      const td = tr.append("td");
+      make_table_2col(td, lst);
+      if (v.outlier.test_biallelic.asehigh) {
+        td.append("div").style("background", cfg.outlier.color_outlier_asehigh).style("padding", "2px 10px").style("color", "white").text("ASE high");
+      }
+    }
+    if (v.outlier.test_entirecohort) {
+      const tr = table.append("tr");
+      tr.append("td").attr("colspan", 2).text("Outlier (all samples)");
+      const lst = [];
+      for (const k in v.outlier.test_entirecohort) {
+        lst.push({ k, v: v.outlier.test_entirecohort[k] });
+      }
+      const td = tr.append("td");
+      make_table_2col(td, lst);
+      if (v.outlier.test_entirecohort.asehigh) {
+        td.append("div").style("background", cfg.outlier.color_outlier_asehigh).style("padding", "2px 10px").style("color", "white").text("ASE high");
+      }
+    }
+  }
+}
+function ase_color(v, cfg) {
+  if (cfg.no_ase) return color_noinfo;
+  if (!cfg.ase) return color_noinfo;
+  if (!v.estat) return cfg.ase.color_noinfo;
+  if (v.estat.ase_monoallelic) return cfg.ase.color_monoallelic;
+  if (v.estat.ase_biallelic) return cfg.ase.color_biallelic;
+  if (v.estat.ase_uncertain) return cfg.ase.color_uncertain;
+  return cfg.ase.color_noinfo;
+}
+function ui_config(holder, cfg, tk, call) {
+  const indent = 30;
+  {
+    const row = holder.append("div").style("margin-bottom", "5px");
+    row.append("span").html("If Q-VALUE &le;&nbsp;");
+    row.append("input").attr("type", "number").style("width", "50px").property("value", cfg.ase.qvalue).on("keyup", (event) => {
+      if (event.code != "Enter" && event.code != "NumpadEnter") return;
+      let v = Number.parseFloat(event.target.value);
+      if (!v || v <= 0) {
+        return;
+      }
+      if (cfg.ase.qvalue == v) {
+        return;
+      }
+      cfg.ase.qvalue = v;
+      call();
+    });
+    row.append("span").html("&nbsp;:");
+  }
+  {
+    const row = holder.append("div").style("margin", "0px 5px 5px " + indent + "px");
+    row.append("span").html("If MEAN_DELTA &ge;&nbsp;");
+    row.append("input").attr("type", "number").style("width", "50px").property("value", cfg.ase.meandelta_monoallelic).on("keyup", (event) => {
+      if (event.code != "Enter" && event.code != "NumpadEnter") return;
+      let v = Number.parseFloat(event.target.value);
+      if (!v || v <= 0) {
+        return;
+      }
+      if (cfg.ase.meandelta_monoallelic == v) {
+        return;
+      }
+      cfg.ase.meandelta_monoallelic = v;
+      call();
+    });
+    row.append("span").html("&nbsp;:&nbsp;");
+  }
+  holder.append("div").style("margin", "0px 5px 5px " + indent * 2 + "px").html(
+    'Is <span style="background:' + cfg.ase.color_monoallelic + ';padding:1px 5px;color:white;">mono-allelic expression</span>'
+  );
+  holder.append("div").style("margin", "0px 5px 5px " + indent + "px").html("Else:");
+  holder.append("div").style("margin", "0px 5px 5px " + indent * 2 + "px").html(
+    'Is <span style="background:' + cfg.ase.color_uncertain + ';padding:1px 5px;color:white;">ASE uncertain</span>'
+  );
+  holder.append("div").style("margin", "0px 5px 5px 0px").html("Else:");
+  {
+    const row = holder.append("div").style("margin", "0px 5px 5px " + indent + "px");
+    row.append("span").html("If number of ASE markers &le;&nbsp;");
+    row.append("input").attr("type", "number").style("width", "50px").property("value", cfg.ase.asemarkernumber_biallelic).on("keyup", (event) => {
+      if (event.code != "Enter" && event.code != "NumpadEnter") return;
+      let v = Number.parseInt(event.target.value);
+      if (v < 0) {
+        return;
+      }
+      if (cfg.ase.asemarkernumber_biallelic == v) {
+        return;
+      }
+      cfg.ase.asemarkernumber_biallelic = v;
+      call();
+    });
+    row.append("span").html("&nbsp;:&nbsp;");
+  }
+  holder.append("div").style("margin", "0px 5px 5px " + indent * 2 + "px").html(
+    'Is <span style="background:' + cfg.ase.color_biallelic + ';padding:1px 5px;color:white;">bi-allelic expression</span>'
+  );
+  holder.append("div").style("margin", "0px 5px 5px " + indent + "px").html("Else:");
+  holder.append("div").style("margin", "0px 5px 5px " + indent * 2 + "px").html(
+    'Is <span style="background:' + cfg.ase.color_uncertain + ';padding:1px 5px;color:white;">ASE uncertain</span>'
+  );
+  holder.append("div").style("margin", "10px").append("button").text("Default ASE parameters").on("click", () => {
+    cfg.ase.qvalue = 0.05;
+    cfg.ase.meandelta_monoallelic = 0.3;
+    cfg.ase.asemarkernumber_biallelic = 0;
+    call();
+  });
+}
+
+export {
+  init_config,
+  measure,
+  showsingleitem_table,
+  ase_color,
+  ui_config
+};
+//# sourceMappingURL=chunk-Q7GK35TB.js.map

package/dist/chunk-QXRM5NMW.js

@@ -0,0 +1,274 @@
+import {
+  termType2label
+} from "./chunk-T2W4JHWJ.js";
+import {
+  TermTypes
+} from "./chunk-2N345NXD.js";
+import {
+  __export
+} from "./chunk-HS5PO5ZQ.js";
+
+// plots/matrix/hierCluster.renderers.js
+var hierCluster_renderers_exports = {};
+__export(hierCluster_renderers_exports, {
+  maySetSandboxHeader: () => maySetSandboxHeader,
+  plotDendrogramHclust: () => plotDendrogramHclust,
+  renderImage: () => renderImage
+});
+function maySetSandboxHeader(appState) {
+  if (!this.dom.header) return;
+  const dataType = this.config.dataType;
+  const headerText = this.config?.headerText ? `${this.config.headerText} ` : "";
+  let title;
+  if (this.config.preBuiltPlotTitle) {
+    title = this.config.preBuiltPlotTitle;
+  } else if (this.config.appName) {
+    title = `${headerText}${this.config.appName} Clustering`;
+  } else if (dataType == TermTypes.PROTEOME_ABUNDANCE) {
+    title = this.config.assayCohortTitle ? `Protein Abundance Clustering (${this.config.assayCohortTitle})` : "Protein Abundance Clustering";
+  } else {
+    title = `${headerText}${termType2label(dataType)} Clustering`;
+  }
+  this.dom.header.text(title);
+}
+function plotDendrogramHclust(plotOnly) {
+  const d = this.dimensions;
+  const s = this.config.settings.matrix;
+  const xOffset = d.seriesXoffset;
+  const pxr = window.devicePixelRatio <= 1 ? 1 : window.devicePixelRatio;
+  const obj = this.hierClusterData.clustering;
+  const row = obj.row;
+  const col = obj.col;
+  const rowHeight = this.settings.matrix.clusterRowh, { xDendrogramHeight, yDendrogramHeight } = this.settings.hierCluster, colWidth = this.dimensions.dx;
+  if (plotOnly !== "left") {
+    if (!this.settings.hierCluster.clusterSamples) {
+      this.dom.topDendrogram.selectAll("*").remove();
+    } else {
+      const height2px = getHclustHeightScalefactor(col.height, yDendrogramHeight);
+      const height = yDendrogramHeight + 1e-7;
+      const width = Math.min(colWidth * col.inputOrder.length, s.imgWMax);
+      if (width <= 0 || height <= 0) {
+        console.warn(
+          "Skipping top dendrogram render: invalid dimensions.",
+          "This may indicate a zoom feedback loop issue.",
+          {
+            width,
+            height,
+            colWidth,
+            sampleCount: col.inputOrder.length,
+            yDendrogramHeight
+          }
+        );
+        this.dom.topDendrogram.selectAll("*").remove();
+        return;
+      }
+      const canvas = new OffscreenCanvas(width * pxr, height * pxr);
+      const ctx = canvas.getContext("2d");
+      ctx.scale(pxr, pxr);
+      ctx.translate(-d.xMin, 0);
+      ctx.imageSmoothingEnabled = false;
+      ctx.imageSmoothingQuality = "high";
+      ctx.strokeStyle = "black";
+      const mergedClusters = /* @__PURE__ */ new Map();
+      for (const [clusterid0, pair] of col.merge.entries()) {
+        const clusterid = clusterid0 + 1;
+        const children = [];
+        const childrenClusters = [];
+        let x1, x2, y1, y2;
+        if (pair.n1 < 0) {
+          const [name, columnNumber] = getLeafNumber(pair.n1, col.inputOrder, col.order);
+          x1 = colWidth * (columnNumber + 0.5);
+          y1 = yDendrogramHeight;
+          children.push({ name });
+        } else {
+          if (!mergedClusters.has(pair.n1)) throw "pair.n1 is positive but not seen before";
+          const c = mergedClusters.get(pair.n1);
+          x1 = c.x;
+          y1 = c.y;
+          children.push(...c.children);
+          childrenClusters.push(pair.n1);
+        }
+        if (pair.n2 < 0) {
+          const [name, columnNumber] = getLeafNumber(pair.n2, col.inputOrder, col.order);
+          x2 = colWidth * (columnNumber + 0.5);
+          y2 = yDendrogramHeight;
+          children.push({ name });
+        } else {
+          if (!mergedClusters.has(pair.n2)) throw "pair.n1 is positive but not seen before";
+          const c = mergedClusters.get(pair.n2);
+          x2 = c.x;
+          y2 = c.y;
+          children.push(...c.children);
+          childrenClusters.push(pair.n2);
+        }
+        const clusterY = yDendrogramHeight - col.height[clusterid0].height * height2px;
+        const highlight = this.clickedClusterIds?.includes(clusterid);
+        ctx.strokeStyle = highlight ? "red" : "black";
+        ctx.beginPath();
+        ctx.moveTo(x1, y1);
+        ctx.lineTo(x1, clusterY);
+        ctx.lineTo(x2, clusterY);
+        ctx.lineTo(x2, y2);
+        ctx.stroke();
+        ctx.closePath();
+        mergedClusters.set(clusterid, {
+          x: (x1 + x2) / 2,
+          y: clusterY,
+          children,
+          childrenClusters,
+          clusterPosition: {
+            x1,
+            x2,
+            y1,
+            y2,
+            clusterY
+          }
+        });
+      }
+      this.renderImage(
+        this.api,
+        this.dom.topDendrogram,
+        canvas,
+        width,
+        height,
+        xDendrogramHeight + 0.5 * colWidth + d.xMin,
+        s.margin.top + s.scrollHeight
+      );
+      col.mergedClusters = mergedClusters;
+    }
+  }
+  if (plotOnly !== "top") {
+    if (!this.settings.hierCluster.clusterRows) {
+      this.dom.leftDendrogram.selectAll("*").remove();
+    } else {
+      const height2px = getHclustHeightScalefactor(row.height, xDendrogramHeight);
+      const width = xDendrogramHeight + 1e-7;
+      const height = rowHeight * row.inputOrder.length;
+      const canvasWidthPx = Number.isFinite(width) && Number.isFinite(pxr) ? Math.max(0, Math.floor(width * pxr)) : 0;
+      const canvasHeightPx = Number.isFinite(height) && Number.isFinite(pxr) ? Math.max(0, Math.floor(height * pxr)) : 0;
+      if (!Number.isFinite(width) || !Number.isFinite(height) || !Number.isFinite(pxr) || width <= 0 || height <= 0 || pxr <= 0 || canvasWidthPx < 1 || canvasHeightPx < 1) {
+        console.warn(
+          "Skipping left dendrogram render: invalid dimensions.",
+          "This may indicate a zoom feedback loop issue.",
+          {
+            width,
+            height,
+            pxr,
+            canvasWidthPx,
+            canvasHeightPx,
+            rowHeight,
+            termCount: row.inputOrder.length,
+            xDendrogramHeight
+          }
+        );
+        this.dom.leftDendrogram.selectAll("*").remove();
+        return;
+      }
+      const canvas = new OffscreenCanvas(canvasWidthPx, canvasHeightPx);
+      const ctx = canvas.getContext("2d");
+      ctx.scale(pxr, pxr);
+      ctx.imageSmoothingEnabled = false;
+      ctx.imageSmoothingQuality = "high";
+      ctx.strokeStyle = "black";
+      const mergedClusters = /* @__PURE__ */ new Map();
+      for (const [clusterid0, pair] of row.merge.entries()) {
+        const clusterid = clusterid0 + 1;
+        const children = [];
+        const childrenClusters = [];
+        let x1, x2, y1, y2;
+        if (pair.n1 < 0) {
+          const [name, rowNumber] = getLeafNumber(pair.n1, row.inputOrder, row.order);
+          y1 = rowHeight * (rowNumber + 0.5);
+          x1 = xDendrogramHeight;
+          children.push({ name });
+        } else {
+          if (!mergedClusters.has(pair.n1)) throw "pair.n1 is positive but not seen before";
+          const c = mergedClusters.get(pair.n1);
+          x1 = c.x;
+          y1 = c.y;
+          children.push(...c.children);
+          childrenClusters.push(pair.n1);
+        }
+        if (pair.n2 < 0) {
+          const [name, rowNumber] = getLeafNumber(pair.n2, row.inputOrder, row.order);
+          y2 = rowHeight * (rowNumber + 0.5);
+          x2 = xDendrogramHeight;
+          children.push({ name });
+        } else {
+          if (!mergedClusters.has(pair.n2)) throw "pair.n1 is positive but not seen before";
+          const c = mergedClusters.get(pair.n2);
+          x2 = c.x;
+          y2 = c.y;
+          children.push(...c.children);
+          childrenClusters.push(pair.n2);
+        }
+        const clusterX = xDendrogramHeight - row.height[clusterid0].height * height2px;
+        const highlight = this.clickedLeftClusterIds?.includes(clusterid);
+        ctx.strokeStyle = highlight ? "red" : "black";
+        ctx.beginPath();
+        ctx.moveTo(x1, y1);
+        ctx.lineTo(clusterX, y1);
+        ctx.lineTo(clusterX, y2);
+        ctx.lineTo(x2, y2);
+        ctx.stroke();
+        ctx.closePath();
+        mergedClusters.set(clusterid, {
+          x: clusterX,
+          y: (y1 + y2) / 2,
+          children,
+          childrenClusters,
+          clusterPosition: {
+            x1,
+            x2,
+            y1,
+            y2,
+            clusterX
+          }
+        });
+      }
+      const t = this.termOrder.find((t2) => t2.grp.type == "hierCluster" || t2.grp.name == this.hcTermGroup.name);
+      const y = (
+        // t.labelOffset is commented out because it is already handled in adjustSvgDimensions
+        t.grpIndex * s.rowgspace + t.prevGrpTotalIndex * s.rowh + t.totalHtAdjustments + s.margin.top + s.scrollHeight + // left dendrogram image must be lower than the top dendrogram image height
+        yDendrogramHeight
+      );
+      this.renderImage(this.api, this.dom.leftDendrogram, canvas, width, height, 0, y);
+      row.mergedClusters = mergedClusters;
+    }
+  }
+}
+async function renderImage(componentApi, g, canvas, width, height, x, y) {
+  const sequenceId = componentApi.getSequenceId();
+  const reader = new FileReader();
+  reader.addEventListener(
+    "load",
+    () => {
+      if (componentApi.isStaleSequenceId(sequenceId)) return;
+      g.selectAll("*").remove();
+      g.append("image").attr("x", x + 0.033).attr("y", y + 0.033).attr("xlink:href", reader.result).attr("width", width).attr("height", height);
+    },
+    false
+  );
+  const blob = await canvas.convertToBlob({ quality: 1 });
+  reader.readAsDataURL(blob);
+}
+function getHclustHeightScalefactor(lst, ph) {
+  let max = lst[0].height;
+  for (const h of lst) max = Math.max(max, h.height);
+  return ph / max;
+}
+function getLeafNumber(minus, inputOrder, order) {
+  const name = inputOrder[-minus - 1];
+  if (!name) throw "minus not in inputOrder";
+  const i = order.findIndex((j) => j.name == name);
+  if (i == -1) throw "name not found in hc$order";
+  return [name, i];
+}
+
+export {
+  maySetSandboxHeader,
+  plotDendrogramHclust,
+  renderImage,
+  hierCluster_renderers_exports
+};
+//# sourceMappingURL=chunk-QXRM5NMW.js.map