@sjcrh/proteinpaint-client 2.146.4-1 → 2.147.1

package/dist/frequencyChart-L47GRXL2.js

@@ -1,375 +0,0 @@
-import {
-  Runchart,
-  RunchartModel,
-  RunchartView,
-  RunchartViewModel
-} from "./chunk-PQAXAKOO.js";
-import {
-  CategoryFiltersUI
-} from "./chunk-RWEDZXDS.js";
-import {
-  ScatterInteractivity
-} from "./chunk-TBQB2T2G.js";
-import "./chunk-5L4SYWRX.js";
-import "./chunk-BT6RJQL7.js";
-import "./chunk-C4C3MDZO.js";
-import "./chunk-72PLI3GC.js";
-import "./chunk-L5RO3TWT.js";
-import "./chunk-T6FHPT3J.js";
-import "./chunk-KQKE3HWV.js";
-import "./chunk-FPWU6QAA.js";
-import "./chunk-NQ5YW2DW.js";
-import "./chunk-IGAF3NBU.js";
-import {
-  fillTermWrapper
-} from "./chunk-DXNHQCWO.js";
-import "./chunk-HJ6L54YS.js";
-import "./chunk-PYGUZ75W.js";
-import "./chunk-GDVG55UR.js";
-import {
-  getDateFromNumber,
-  getNumberFromDate,
-  isNumericTerm
-} from "./chunk-L7N5BOMJ.js";
-import "./chunk-RY7CVONT.js";
-import "./chunk-IQIXGTQV.js";
-import "./chunk-QTAXM2J6.js";
-import {
-  getColors,
-  plotColor
-} from "./chunk-MXMPAXMS.js";
-import "./chunk-4W3BORF5.js";
-import {
-  copyMerge,
-  getCompInit
-} from "./chunk-SU6RBYZK.js";
-import "./chunk-2J7NXRQQ.js";
-import "./chunk-IVJWQYGG.js";
-import "./chunk-OPZUIS3Y.js";
-import "./chunk-RA5EXEHB.js";
-import "./chunk-PMZS3SHH.js";
-import "./chunk-LOZEKOES.js";
-import "./chunk-TOU7EVFQ.js";
-import "./chunk-W2IWHXLL.js";
-import "./chunk-5OHXYXLD.js";
-import "./chunk-UJUXE42U.js";
-import "./chunk-OMR2DT66.js";
-import "./chunk-NDWTN4U5.js";
-import "./chunk-HFNDKYVF.js";
-
-// plots/frequencyChart/model/frequencyChartModel.ts
-var FrequencyChartModel = class extends RunchartModel {
-  createChart(id, data) {
-    const samples = data.samples;
-    const groupedSamples = /* @__PURE__ */ new Map();
-    for (const sample of samples) {
-      const date = new Date(getDateFromNumber(sample.x));
-      const year = date.getFullYear();
-      const month = date.getMonth() + 1;
-      const key = `${year}-${month}`;
-      if (!groupedSamples.has(key)) groupedSamples.set(key, { samples: [sample] });
-      else {
-        const value = groupedSamples.get(key);
-        value.samples.push(sample);
-      }
-    }
-    let count = 0;
-    const sortedKeys = Array.from(groupedSamples.keys()).sort((a, b) => {
-      const [yearA, monthA] = a.split("-").map(Number);
-      const [yearB, monthB] = b.split("-").map(Number);
-      if (yearA !== yearB) return yearA - yearB;
-      return monthA - monthB;
-    });
-    const events = [];
-    for (const key of sortedKeys) {
-      const [year, month] = key.split("-");
-      const value = groupedSamples.get(key);
-      count += value.samples.length;
-      for (const sample of value.samples) {
-        sample.x = getNumberFromDate(new Date(year, month, 15));
-        sample.y = this.scatter.settings.showCumulativeFrequency ? count : value.samples.length;
-        events.push(sample.y);
-      }
-    }
-    const colorLegend = new Map(data.colorLegend);
-    const shapeLegend = new Map(data.shapeLegend);
-    this.charts.push({ id, data, cohortSamples: samples, colorLegend, shapeLegend, events });
-  }
-};
-
-// plots/frequencyChart/view/frequencyChartView.ts
-var minShapeSize = 0.2;
-var maxShapeSize = 6;
-var FrequencyChartView = class extends RunchartView {
-  constructor(frequencyChart) {
-    super(frequencyChart);
-    this.frequencyChart = frequencyChart;
-  }
-  async getControlInputs() {
-    const shapeOption = {
-      type: "term",
-      configKey: "shapeTW",
-      chartType: "frequencyChart",
-      usecase: { target: "frequencyChart", detail: "shapeTW" },
-      title: "Categories to assign a shape",
-      label: "Shape",
-      vocabApi: this.frequencyChart.app.vocabApi,
-      numericEditMenuVersion: ["discrete"],
-      processInput: async (tw) => {
-        if (isNumericTerm(tw?.term)) {
-          tw.q = { mode: "discrete" };
-          await fillTermWrapper(tw, this.frequencyChart.app.vocabApi);
-        }
-      }
-    };
-    const shapeSizeOption = {
-      label: "Sample size",
-      type: "number",
-      chartType: "frequencyChart",
-      settingsKey: "size",
-      title: "Sample size, represents the factor used to scale the sample",
-      min: 0,
-      step: 0.1
-    };
-    const step = (maxShapeSize - minShapeSize) / 10;
-    const minShapeSizeOption = {
-      label: "Min size",
-      type: "number",
-      chartType: "frequencyChart",
-      settingsKey: "minShapeSize",
-      title: "Minimum sample size",
-      min: minShapeSize,
-      max: maxShapeSize,
-      step
-    };
-    const maxShapeSizeOption = {
-      label: "Max size",
-      type: "number",
-      chartType: "frequencyChart",
-      settingsKey: "maxShapeSize",
-      title: "Maximum sample size",
-      min: minShapeSize,
-      max: maxShapeSize * 2,
-      step
-    };
-    const inputs = [
-      {
-        type: "term",
-        configKey: "term",
-        chartType: "frequencyChart",
-        usecase: { target: "frequencyChart", detail: "numeric" },
-        title: "X coordinate to plot the samples",
-        label: "X",
-        vocabApi: this.frequencyChart.app.vocabApi,
-        menuOptions: "!remove",
-        numericEditMenuVersion: ["continuous"]
-      },
-      // {
-      // 	type: 'term',
-      // 	configKey: 'term0',
-      // 	chartType: 'frequencyChart',
-      // 	usecase: { target: 'frequencyChart', detail: 'term0' },
-      // 	title: 'Term to to divide by categories',
-      // 	label: 'Divide by',
-      // 	vocabApi: this.frequencyChart.app.vocabApi,
-      // 	numericEditMenuVersion: ['discrete']
-      // },
-      {
-        label: "Show cumulative frecuency",
-        boxLabel: "",
-        type: "checkbox",
-        chartType: "frequencyChart",
-        settingsKey: "showCumulativeFrequency",
-        title: `Option to show the cumulative number of events over time`
-      },
-      {
-        type: "term",
-        configKey: "colorTW",
-        chartType: "frequencyChart",
-        usecase: { target: "frequencyChart", detail: "colorTW" },
-        title: "Categories to color the samples",
-        label: "Color",
-        vocabApi: this.frequencyChart.app.vocabApi,
-        numericEditMenuVersion: ["continuous", "discrete"]
-      },
-      shapeOption,
-      shapeSizeOption,
-      {
-        type: "term",
-        configKey: "scaleDotTW",
-        chartType: "frequencyChart",
-        usecase: { target: "frequencyChart", detail: "numeric" },
-        title: "Scale sample by term value",
-        label: "Scale by",
-        vocabApi: this.frequencyChart.app.vocabApi,
-        numericEditMenuVersion: ["continuous"]
-      },
-      {
-        label: "Opacity",
-        type: "number",
-        chartType: "frequencyChart",
-        settingsKey: "opacity",
-        title: "It represents the opacity of the elements",
-        min: 0,
-        max: 1,
-        step: 0.1
-      },
-      {
-        label: "Chart width",
-        type: "number",
-        chartType: "frequencyChart",
-        settingsKey: "svgw"
-      },
-      {
-        label: "Chart height",
-        type: "number",
-        chartType: "frequencyChart",
-        settingsKey: "svgh"
-      },
-      {
-        label: "Default color",
-        type: "color",
-        chartType: "frequencyChart",
-        settingsKey: "defaultColor"
-      },
-      {
-        label: "Save zoom transform",
-        boxLabel: "",
-        type: "checkbox",
-        chartType: "frequencyChart",
-        settingsKey: "saveZoomTransform",
-        title: `Option to save the zoom transformation in the state. Needed if you want to save a session with the actual zoom and pan applied`,
-        processInput: (value) => this.saveZoomTransform(value)
-      }
-    ];
-    if (this.frequencyChart.config.scaleDotTW)
-      inputs.splice(inputs.length - 5, 0, minShapeSizeOption, maxShapeSizeOption, {
-        label: "Scale order",
-        type: "radio",
-        chartType: "frequencyChart",
-        settingsKey: "scaleDotOrder",
-        options: [
-          { label: "Ascending", value: "Ascending" },
-          { label: "Descending", value: "Descending" }
-        ]
-      });
-    if (!this.frequencyChart.config.term0)
-      inputs.push({
-        label: "Show regression",
-        type: "dropdown",
-        chartType: "frequencyChart",
-        settingsKey: "regression",
-        options: [
-          { label: "None", value: "None" },
-          //{ label: 'Loess', value: 'Loess' },
-          { label: "Lowess", value: "Lowess" },
-          { label: "Polynomial", value: "Polynomial" }
-        ]
-      });
-    return inputs;
-  }
-};
-
-// plots/frequencyChart/frequencyChart.ts
-var FrequencyChart = class _FrequencyChart extends Runchart {
-  static {
-    this.type = "frequencyChart";
-  }
-  constructor(opts, api) {
-    super(opts, api);
-    this.type = _FrequencyChart.type;
-  }
-  async init(appState) {
-    const state = this.getState(appState);
-    this.config = structuredClone(state.config);
-    this.view = new FrequencyChartView(this);
-    this.model = new FrequencyChartModel(this);
-    this.vm = new RunchartViewModel(this);
-    this.interactivity = new ScatterInteractivity(this);
-    if (!this.parentId && this.config.filterTWs)
-      this.selectFilters = new CategoryFiltersUI(this.view.dom.headerDiv, this, this.config);
-  }
-  async main() {
-    this.config = structuredClone(this.state.config);
-    this.settings = this.config.settings[this.type];
-    if (!this.parentId && this.config.filterTWs) this.selectFilters.fillFilters();
-    await this.model.initData();
-    await this.model.processData();
-    this.cat2Color = getColors(this.model.charts.length);
-    await this.setControls();
-    this.vm.render();
-    this.view.dom.loadingDiv.style("display", "none");
-    this.vm.setTools();
-  }
-};
-async function getPlotConfig(opts, app) {
-  const plot = {
-    settings: {
-      controls: {
-        isOpen: false
-        // control panel is hidden by default
-      },
-      frequencyChart: getDefaultFrequencyChartSettings(),
-      startColor: {},
-      //dict to store the start color of the gradient for each chart when using continuous color
-      stopColor: {}
-      //dict to store the stop color of the gradient for each chart when using continuous color
-    }
-  };
-  try {
-    const defaultConfig = app.vocabApi.termdbConfig?.plotConfigByCohort?.default?.[opts.chartType];
-    copyMerge(plot, defaultConfig, opts);
-    if (plot.colorTW) await fillTermWrapper(plot.colorTW, app.vocabApi);
-    if (plot.shapeTW) await fillTermWrapper(plot.shapeTW, app.vocabApi);
-    await fillTermWrapper(plot.term, app.vocabApi);
-    if (plot.term0) await fillTermWrapper(plot.term0, app.vocabApi);
-    if (plot.scaleDotTW) await fillTermWrapper(plot.scaleDotTW, app.vocabApi);
-    if (plot.filterTWs) for (const tw of plot.filterTWs) await fillTermWrapper(tw, app.vocabApi);
-    return plot;
-  } catch (e) {
-    console.log(e);
-    throw `${e} [frequencyChart getPlotConfig()]`;
-  }
-}
-var frequencyChartInit = getCompInit(FrequencyChart);
-var componentInit = frequencyChartInit;
-function getDefaultFrequencyChartSettings() {
-  return {
-    size: 1,
-    minShapeSize: 0.5,
-    maxShapeSize: 4,
-    scaleDotOrder: "Ascending",
-    refSize: 0.8,
-    svgw: 1e3,
-    svgh: 500,
-    axisTitleFontSize: 16,
-    opacity: 0.6,
-    defaultColor: plotColor,
-    regression: "None",
-    // Color scale configuration settings
-    // These settings control how numerical values are mapped to colors
-    colorScaleMode: "auto",
-    // Default to automatic scaling based on data range
-    // Other options: 'fixed' (user-defined range) or
-    // 'percentile' (scale based on data distribution)
-    colorScalePercentile: 95,
-    // Default percentile for percentile mode
-    // This means we'll scale colors based on values
-    // up to the 95th percentile by default
-    colorScaleMinFixed: null,
-    // User-defined minimum value for fixed mode
-    // Null indicates this hasn't been set yet
-    colorScaleMaxFixed: null,
-    // User-defined maximum value for fixed mode
-    saveZoomTransform: false,
-    showCumulativeFrequency: true
-  };
-}
-export {
-  FrequencyChart,
-  componentInit,
-  frequencyChartInit,
-  getDefaultFrequencyChartSettings,
-  getPlotConfig
-};
-//# sourceMappingURL=frequencyChart-L47GRXL2.js.map

package/dist/frequencyChart.integration.spec-3PZID3LQ.js

@@ -1,303 +0,0 @@
-import {
-  detectAttr,
-  detectChildStyle
-} from "./chunk-U36UPJGG.js";
-import {
-  getRunPp,
-  rideInit
-} from "./chunk-UPMVNLJV.js";
-import {
-  require_tape
-} from "./chunk-EFPC6YYT.js";
-import "./chunk-YOSXOFWN.js";
-import "./chunk-BRC6CXQC.js";
-import "./chunk-AKLNRWC2.js";
-import "./chunk-IGAF3NBU.js";
-import "./chunk-Y25WZ3LE.js";
-import "./chunk-BUIX7AXM.js";
-import "./chunk-MKAF2BHB.js";
-import "./chunk-Z3QJUOGM.js";
-import "./chunk-RS3G3HE7.js";
-import "./chunk-A6UVM6Q5.js";
-import "./chunk-DXNHQCWO.js";
-import "./chunk-HJ6L54YS.js";
-import "./chunk-PYGUZ75W.js";
-import "./chunk-GDVG55UR.js";
-import "./chunk-L7N5BOMJ.js";
-import "./chunk-RY7CVONT.js";
-import "./chunk-IQIXGTQV.js";
-import "./chunk-QTAXM2J6.js";
-import "./chunk-MXMPAXMS.js";
-import "./chunk-4W3BORF5.js";
-import "./chunk-SU6RBYZK.js";
-import "./chunk-2J7NXRQQ.js";
-import "./chunk-IVJWQYGG.js";
-import "./chunk-OPZUIS3Y.js";
-import "./chunk-RA5EXEHB.js";
-import "./chunk-PMZS3SHH.js";
-import "./chunk-LOZEKOES.js";
-import "./chunk-TOU7EVFQ.js";
-import "./chunk-W2IWHXLL.js";
-import "./chunk-5OHXYXLD.js";
-import "./chunk-UJUXE42U.js";
-import "./chunk-OMR2DT66.js";
-import {
-  select_default
-} from "./chunk-NDWTN4U5.js";
-import {
-  __toESM
-} from "./chunk-HFNDKYVF.js";
-
-// plots/frequencyChart/test/frequencyChart.integration.spec.js
-var import_tape = __toESM(require_tape(), 1);
-var runpp = getRunPp("mass", {
-  state: {
-    nav: { activeTab: 1 },
-    vocab: {
-      dslabel: "TermdbTest",
-      genome: "hg38-test"
-    }
-  },
-  debug: 1
-});
-var state = {
-  plots: [
-    {
-      chartType: "frequencyChart",
-      term: { id: "date" },
-      colorTW: { id: "sex" }
-    }
-  ]
-};
-function getHolder() {
-  return select_default("body").append("div");
-}
-(0, import_tape.default)("\n", function(test) {
-  test.comment("-***- plots/frequencyChart -***-");
-  test.end();
-});
-(0, import_tape.default)("Render TermdbTest frequencyChart plot", function(test) {
-  test.timeoutAfter(8e3);
-  test.plan(1);
-  const holder = getHolder();
-  runpp({
-    holder,
-    //Fix for test failing because survival & summary sandboxs are not destroyed.
-    state,
-    frequencyChart: {
-      callbacks: {
-        "postRender.test": runTests
-      }
-    }
-  });
-  async function runTests(scatter) {
-    const scatterDiv = scatter.Inner.model.charts[0].chartDiv;
-    testPlot();
-    testLegendTitle();
-    if (test._ok) holder.remove();
-    test.end();
-    function testPlot() {
-      const serieG = scatterDiv.select(".sjpcb-scatter-series");
-      const numSymbols = serieG.selectAll("path").size() - 1;
-      test.equal(
-        numSymbols,
-        scatter.Inner.model.charts[0].data.samples.length,
-        `Should be ${scatter.Inner.model.charts[0].data.samples.length}. Rendered ${numSymbols} symbols.`
-      );
-    }
-    function testLegendTitle() {
-      if (!scatter.Inner.colorTW) return;
-      const legendG = scatterDiv.select(".sjpcb-scatter-legend");
-      test.true(legendG != null, "Should have a legend");
-      test.true(
-        legendG.select("#legendTitle").text().startsWith(scatter.Inner.config.colorTW.id),
-        `Legend title should start with ${scatter.Inner.config.colorTW.id}`
-      );
-    }
-  }
-});
-(0, import_tape.default)("Test scale dot", function(test) {
-  test.timeoutAfter(8e3);
-  test.plan(2);
-  const holder = getHolder();
-  const state2 = {
-    plots: [
-      {
-        chartType: "frequencyChart",
-        term: { id: "date" },
-        scaleDotTW: { id: "agedx", q: { mode: "continuous" } }
-      }
-    ]
-  };
-  runpp({
-    holder,
-    //Fix for test failing because survival & summary sandboxs are not destroyed.
-    state: state2,
-    frequencyChart: {
-      callbacks: {
-        "postRender.test": runTests
-      }
-    }
-  });
-  async function runTests(scatter) {
-    scatter.on("postRender.test", null);
-    const self = scatter.Inner;
-    const chart = scatter.Inner.model.charts[0];
-    const dots = self.view.dom.mainDiv.selectAll(".sjpcb-scatter-series > path").nodes();
-    const minSize = self.settings.minShapeSize * self.zoom / 3;
-    const maxSize = self.settings.maxShapeSize * self.zoom / 3;
-    test.true(
-      dots.find((dot) => dot.getAttribute("transform").includes(`scale(${minSize})`)) != null,
-      `Dots with the minimum size should be found`
-    );
-    test.true(
-      dots.find((dot) => dot.getAttribute("transform").includes(`scale(${maxSize})`)) != null,
-      `Dots with the maximum size should be found`
-    );
-    if (test._ok) holder.remove();
-    test.end();
-  }
-});
-(0, import_tape.default)("Test legend", function(test) {
-  test.timeoutAfter(3e3);
-  runpp({
-    state: structuredClone(state),
-    frequencyChart: {
-      callbacks: {
-        "postRender.test": runTests
-      }
-    }
-  });
-  async function runTests(scatter) {
-    scatter.on("postRender.test", null);
-    const samples = scatter.Inner.model.charts[0].data.samples;
-    const scatterDiv = scatter.Inner.model.charts[0].chartDiv;
-    await testHideCategory(scatter, samples);
-    if (test._ok) scatter.Inner.app.destroy();
-    test.end();
-  }
-  async function testHideCategory(scatter, samples) {
-    const key = "Female";
-    const expectedNum = samples.filter((s) => s.category === key).length;
-    const matched = await detectChildStyle({
-      elem: scatter.Inner.view.dom.mainDiv.node(),
-      selector: ".sjpcb-scatter-series > path",
-      style: {
-        fillOpacity: "0"
-      },
-      count: expectedNum,
-      trigger: () => {
-        const chart = scatter.Inner.model.charts[0];
-        scatter.Inner.vm.legendvm.legendInteractivity.hideCategory(scatter.Inner.config.colorTW, key, true);
-        scatter.Inner.app.dispatch({
-          type: "plot_edit",
-          id: scatter.Inner.id,
-          config: { colorTW: scatter.Inner.config.colorTW }
-        });
-      }
-    });
-    test.equal(
-      matched.filter((t) => t.__data__.category == key).length,
-      expectedNum,
-      `Should remove all samples with category = ${key}`
-    );
-  }
-});
-(0, import_tape.default)("Change symbol size from menu", function(test) {
-  test.timeoutAfter(1e4);
-  runpp({
-    state,
-    frequencyChart: {
-      callbacks: { "postRender.test": runTests }
-    }
-  });
-  const testSymSize = 300;
-  async function runTests(scatter) {
-    rideInit({ arg: scatter, bus: scatter, eventType: "postRender.test" }).use(changeSymbolInput).to(testSymbolSize, { wait: 100 }).done(test);
-  }
-  function changeSymbolInput(scatter) {
-    const sizeInput = scatter.Inner.view.dom.controlsHolder.selectAll("input").nodes().find((e) => e.value == scatter.Inner.settings.size);
-    sizeInput.value = testSymSize;
-    sizeInput.dispatchEvent(new KeyboardEvent("keyup", { key: "Enter" }));
-  }
-  function testSymbolSize(scatter) {
-    test.equal(scatter.Inner.settings.size, testSymSize, `Should change symbol dot size to test value = ${testSymSize}`);
-  }
-});
-(0, import_tape.default)("Show accrual", function(test) {
-  test.timeoutAfter(1e3);
-  runpp({
-    state: {
-      plots: [
-        {
-          chartType: "frequencyChart",
-          term: { id: "date" },
-          settings: { frequencyChart: { showCumulativeFrequency: true } }
-        }
-      ]
-    },
-    frequencyChart: {
-      callbacks: { "postRender.test": runTests }
-    }
-  });
-  async function runTests(scatter) {
-    const chart = scatter.Inner.model.charts[0];
-    const lastEvent = chart.events[chart.events.length - 1];
-    const sum = chart.cohortSamples.length;
-    test.equal(lastEvent, sum, `the last event y value should be equal to the sum of all samples`);
-    if (test._ok) scatter.Inner.app.destroy();
-    test.end();
-  }
-});
-(0, import_tape.default)("Change chart width and height from menu", function(test) {
-  test.timeoutAfter(1e3);
-  runpp({
-    state,
-    frequencyChart: {
-      callbacks: { "postRender.test": runTests }
-    }
-  });
-  const testWidth = 550;
-  const testHeight = 550;
-  async function runTests(scatter) {
-    scatter.on("postRender.test", null);
-    await testChartSizeChange(scatter);
-    if (test._ok) scatter.Inner.app.destroy();
-    test.end();
-  }
-  async function testChartSizeChange(scatter) {
-    const widthInput = scatter.Inner.view.dom.controlsHolder.selectAll("input").nodes().find((e) => e.value == scatter.Inner.settings.svgw);
-    widthInput.value = testWidth;
-    const heightInput = scatter.Inner.view.dom.controlsHolder.selectAll("input").nodes().find((e) => e.value == scatter.Inner.settings.svgh);
-    heightInput.value = testHeight;
-    await detectAttr({
-      target: scatter.Inner.view.dom.mainDiv.select("svg").node(),
-      observe: {
-        attributeFilter: ["height", "width"]
-      },
-      // count: 1,
-      trigger() {
-        widthInput.dispatchEvent(new Event("change"));
-        heightInput.dispatchEvent(new Event("change"));
-      }
-      // matcher(mutations){
-      // 	let foundH, foundW = 0
-      // 	for (const mut of mutations) {
-      // 		if (mut.type == 'width') ++foundW
-      // 		if (mut.type == 'height') ++foundH
-      // 	}
-      // }
-    });
-    test.equal(
-      scatter.Inner.settings.svgw,
-      testWidth,
-      `Chart width = ${scatter.Inner.settings.svgw} should be equal to test width = ${testWidth}`
-    );
-    test.equal(
-      scatter.Inner.settings.svgh,
-      testHeight,
-      `Chart height = ${scatter.Inner.settings.svgh} should be equal to test height = ${testHeight}`
-    );
-  }
-});
-//# sourceMappingURL=frequencyChart.integration.spec-3PZID3LQ.js.map