@genome-spy/core 0.19.0 → 0.21.0

package/src/utils/binnedIndex.test.js

@@ -0,0 +1,73 @@
+import { describe, expect, test } from "vitest";
+import { createBinningRangeIndexer } from "./binnedIndex.js";
+
+describe("Binning Indexer", () => {
+    test("Points are binned correctly", () => {
+        const items = [0, 1, 4, 10, 35, 36, 80];
+        const indexer = createBinningRangeIndexer(10, [0, 100], (x) => x);
+
+        items.forEach((i) => indexer(i, i, i + 1));
+
+        const index = indexer.getIndex();
+
+        expect(index(0, 1)).toEqual([0, 5]);
+        expect(index(1, 2)).toEqual([0, 5]);
+        expect(index(1, 15)).toEqual([0, 11]);
+        expect(index(10, 15)).toEqual([10, 11]);
+        expect(index(11, 38)).toEqual([10, 37]);
+        expect(index(11, 45)).toEqual([10, 37]);
+        expect(index(40, 85)).toEqual([80, 81]);
+        expect(index(90, 100)).toEqual([81, 81]);
+    });
+
+    test("Non-overlapping ranges are binned correctly", () => {
+        const items = [
+            [0, 5],
+            [25, 50],
+            [50, 55],
+        ];
+        const indexer = createBinningRangeIndexer(
+            10,
+            [0, 100],
+            (x) => x[0],
+            (x) => x[1]
+        );
+
+        items.forEach((x) => indexer(x, x[0], x[1]));
+
+        const index = indexer.getIndex();
+
+        // TODO: More tests. Doesn't work 100%
+
+        expect(index(0, 1)).toEqual([0, 5]);
+        expect(index(3, 40)).toEqual([0, 50]);
+        expect(index(6, 40)).toEqual([0, 50]);
+        // fails: expect(index(50, 57)).toEqual([50, 55]);
+    });
+
+    test("Overlapping ranges are binned correctly", () => {
+        const items = [
+            [10, 30],
+            [25, 50],
+        ];
+        const indexer = createBinningRangeIndexer(
+            10,
+            [0, 100],
+            (x) => x[0],
+            (x) => x[1]
+        );
+
+        items.forEach((x) => indexer(x, x[0], x[1]));
+
+        const index = indexer.getIndex();
+
+        // TODO: More tests. Doesn't work 100%
+
+        expect(index(0, 5)).toEqual([10, 10]);
+        expect(index(0, 15)).toEqual([10, 30]);
+        expect(index(27, 40)).toEqual([10, 50]);
+        expect(index(40, 50)).toEqual([25, 50]);
+        expect(index(40, 80)).toEqual([25, 50]);
+        expect(index(10, 29)).toEqual([10, 50]);
+    });
+});

package/src/utils/cloner.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import createCloner from "./cloner";
 
 const template = {

package/src/utils/coalesce.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import coalesce from "./coalesce";
 
 test("Coalesce returns first defined value", () => {

package/src/utils/concatIterables.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import concatIterables from "./concatIterables";
 
 test("ConcatIterables yields all elements in the correct order", () => {

package/src/utils/domainArray.test.js

@@ -1,3 +1,4 @@
+import { describe, expect, test } from "vitest";
 import createDomain, {
     toRegularArray as r,
     PiecewiseDomain,

package/src/utils/indexer.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import createIndexer from "./indexer";
 
 test("Index values one by one", () => {

package/src/utils/iterateNestedMaps.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import { group } from "d3-array";
 import iterateNestedMaps from "./iterateNestedMaps";
 

package/src/utils/kWayMerge.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import kWayMerge from "./kWayMerge";
 
 test("k-way merge merges multiple sorted arrays", () => {

package/src/utils/layout/flexLayout.js

@@ -133,7 +133,7 @@ export function mapToPixelCoords(
 /**
  * Returns the minimum size  (the sum of pixels sizes) for the flex items
  *
- * @param {SizeDef[]} items
+ * @param {Iterable<SizeDef>} items
  * @param {FlexOptions} [options]
  */
 export function getMinimumSize(items, { spacing } = { spacing: 0 }) {
@@ -144,6 +144,21 @@ export function getMinimumSize(items, { spacing } = { spacing: 0 }) {
     return Math.max(0, minimumSize - spacing);
 }
 
+/**
+ * @param {Iterable<SizeDef>} items
+ * @returns {SizeDef}
+ */
+export function getLargestSize(items) {
+    let px = 0;
+    let grow = 0;
+    for (const s of items) {
+        px = Math.max(px, s.px ?? 0);
+        grow = Math.max(grow, s.grow ?? 0);
+    }
+
+    return { px, grow };
+}
+
 /**
  * Returns true if relative (stretching) elements are present
  * @param {SizeDef[]} items
@@ -172,13 +187,30 @@ export class FlexDimensions {
      * @param {import("./padding").default} padding
      */
     addPadding(padding) {
+        return this.#addPx(padding.width, padding.height);
+    }
+
+    /**
+     * Subtracts padding from absolute (px) dimensions
+     *
+     * @param {import("./padding").default} padding
+     */
+    subtractPadding(padding) {
+        return this.#addPx(-padding.width, -padding.height);
+    }
+
+    /**
+     * @param {number} width
+     * @param {number} height
+     */
+    #addPx(width, height) {
         return new FlexDimensions(
             {
-                px: (this.width.px || 0) + padding.width,
+                px: (this.width.px ?? 0) + width,
                 grow: this.width.grow,
             },
             {
-                px: (this.height.px || 0) + padding.height,
+                px: (this.height.px ?? 0) + height,
                 grow: this.height.grow,
             }
         );

package/src/utils/layout/flexLayout.test.js

@@ -1,6 +1,8 @@
+import { describe, expect, test } from "vitest";
 import {
     mapToPixelCoords,
     getMinimumSize,
+    getLargestSize,
     isStretching,
     parseSizeDef,
 } from "./flexLayout";
@@ -289,6 +291,19 @@ describe("Utility fuctions", () => {
         expect(getMinimumSize(items, { spacing: 10 })).toEqual(330);
     });
 
+    test("getLargestSize", () => {
+        const items = [
+            { px: 100 },
+            { px: 0, grow: 0 },
+            { grow: 1 },
+            { grow: 9 },
+            { px: 200 },
+            { px: 50 },
+        ];
+
+        expect(getLargestSize(items)).toEqual({ px: 200, grow: 9 });
+    });
+
     test("isStretching", () => {
         expect(isStretching([{ grow: 1 }])).toBeTruthy();
         expect(isStretching([{ px: 1 }])).toBeFalsy();

package/src/utils/layout/grid.js

@@ -0,0 +1,95 @@
+/**
+ * An utility class for indexing cells in a wrapping grid layout
+ */
+export default class Grid {
+    /**
+     *
+     * @param {number} nChildren
+     * @param {number} [maxCols]
+     */
+    constructor(nChildren, maxCols) {
+        this.n = nChildren;
+        this.maxCols = maxCols ?? Infinity;
+    }
+
+    get nRows() {
+        return this.maxCols == Infinity ? 1 : Math.ceil(this.n / this.maxCols);
+    }
+
+    get nCols() {
+        return Math.min(this.n, this.maxCols);
+    }
+
+    get rowIndices() {
+        /** @type {number[][]} */
+        const rows = [];
+
+        const nCols = this.nCols;
+        const nRows = this.nRows;
+
+        for (let row = 0; row < nRows; row++) {
+            /** @type {number[]} */
+            const arr = [];
+            rows.push(arr);
+            for (let col = 0; col < nCols; col++) {
+                const i = row * nCols + col;
+                if (i < this.n) {
+                    arr.push(i);
+                }
+            }
+        }
+        return rows;
+    }
+
+    get colIndices() {
+        /** @type {number[][]} */
+        const cols = [];
+
+        const nCols = this.nCols;
+        const nRows = this.nRows;
+
+        for (let col = 0; col < nCols; col++) {
+            /** @type {number[]} */
+            const arr = [];
+            cols.push(arr);
+            for (let row = 0; row < nRows; row++) {
+                const i = row * nCols + col;
+                if (i < this.n) {
+                    arr.push(i);
+                }
+            }
+        }
+        return cols;
+    }
+
+    /**
+     * @param {number} col
+     * @param {number} row
+     */
+    getCellIndex(col, row) {
+        let i = 0;
+
+        if (this.maxCols == Infinity) {
+            i = row == 0 ? col : undefined;
+        } else if (col >= this.maxCols) {
+            return undefined;
+        } else {
+            i = row * this.nCols + col;
+        }
+
+        return i < this.n ? i : undefined;
+    }
+
+    /**
+     *
+     * @param {number} index
+     * @returns {[number, number]}
+     */
+    getCellCoords(index) {
+        if (index < 0 || index >= this.n) {
+            return undefined;
+        }
+
+        return [index % this.nCols, Math.floor(index / this.nCols)];
+    }
+}

package/src/utils/layout/grid.test.js

@@ -0,0 +1,71 @@
+import { expect, test, describe } from "vitest";
+
+import Grid from "./grid";
+
+describe("Grid indexing", () => {
+    test("Single row", () => {
+        const g = new Grid(3);
+
+        expect(g.maxCols).toEqual(Infinity);
+        expect(g.nCols).toEqual(3);
+        expect(g.nRows).toEqual(1);
+        expect(g.colIndices).toEqual([[0], [1], [2]]);
+        expect(g.rowIndices).toEqual([[0, 1, 2]]);
+        expect(g.getCellIndex(1, 0)).toEqual(1);
+        expect(g.getCellIndex(1, 1)).toBeUndefined();
+        expect(g.getCellCoords(1)).toEqual([1, 0]);
+        expect(g.getCellCoords(-1)).toBeUndefined();
+        expect(g.getCellCoords(3)).toBeUndefined();
+    });
+
+    test("Single column", () => {
+        const g = new Grid(3, 1);
+
+        expect(g.maxCols).toEqual(1);
+        expect(g.nCols).toEqual(1);
+        expect(g.nRows).toEqual(3);
+        expect(g.colIndices).toEqual([[0, 1, 2]]);
+        expect(g.rowIndices).toEqual([[0], [1], [2]]);
+        expect(g.getCellIndex(0, 1)).toEqual(1);
+        expect(g.getCellIndex(1, 1)).toBeUndefined();
+        expect(g.getCellCoords(1)).toEqual([0, 1]);
+    });
+
+    test("Two columns", () => {
+        const g = new Grid(6, 2);
+
+        expect(g.maxCols).toEqual(2);
+        expect(g.nCols).toEqual(2);
+        expect(g.nRows).toEqual(3);
+        expect(g.colIndices).toEqual([
+            [0, 2, 4],
+            [1, 3, 5],
+        ]);
+        expect(g.rowIndices).toEqual([
+            [0, 1],
+            [2, 3],
+            [4, 5],
+        ]);
+        expect(g.getCellIndex(1, 0)).toEqual(1);
+        expect(g.getCellIndex(0, 1)).toEqual(2);
+        expect(g.getCellIndex(1, 1)).toEqual(3);
+        expect(g.getCellCoords(3)).toEqual([1, 1]);
+    });
+
+    test("Two columns, second is partial", () => {
+        const g = new Grid(5, 2);
+
+        expect(g.maxCols).toEqual(2);
+        expect(g.nCols).toEqual(2);
+        expect(g.nRows).toEqual(3);
+        expect(g.colIndices).toEqual([
+            [0, 2, 4],
+            [1, 3],
+        ]);
+        expect(g.rowIndices).toEqual([[0, 1], [2, 3], [4]]);
+        expect(g.getCellIndex(1, 0)).toEqual(1);
+        expect(g.getCellIndex(0, 1)).toEqual(2);
+        expect(g.getCellIndex(1, 2)).toBeUndefined();
+        expect(g.getCellCoords(3)).toEqual([1, 1]);
+    });
+});

package/src/utils/layout/padding.js

@@ -61,6 +61,19 @@ export default class Padding {
         );
     }
 
+    /**
+     *
+     * @param {Padding} padding padding to subtract
+     */
+    subtract(padding) {
+        return new Padding(
+            this.top - padding.top,
+            this.right - padding.right,
+            this.bottom - padding.bottom,
+            this.left - padding.left
+        );
+    }
+
     /**
      *
      * @param {PaddingConfig} config

package/src/utils/layout/rectangle.js

@@ -31,6 +31,8 @@ export default class Rectangle {
         );
     }
 
+    static ZERO = Rectangle.create(0, 0, 0, 0);
+
     /**
      * @param {Prop} prop
      * @param {number | function():number} value
@@ -279,4 +281,8 @@ export default class Rectangle {
             y: (y - this.y) / this.height,
         };
     }
+
+    toString() {
+        return `Rectangle: x: ${this.x}, y: ${this.y}, width: ${this.width}, height: ${this.height}`;
+    }
 }

package/src/utils/layout/rectangle.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import Rectangle from "./rectangle";
 import Padding from "./padding";
 

package/src/utils/mergeObjects.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import mergeObjects from "./mergeObjects";
 
 test("Merges non-conflicting properties", () => {

package/src/utils/numberExtractor.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import numberExtractor from "./numberExtractor";
 
 test("NumberExtractor parses delimited integers", () => {

package/src/utils/propertyCacher.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import { getCachedOrCall, invalidate, invalidateAll } from "./propertyCacher";
 
 class TestClass {

package/src/utils/propertyCoalescer.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import coalesceProperties from "./propertyCoalescer";
 
 test("CoalesceProperties works as expected", () => {

package/src/utils/reservationMap.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import ReservationMap from "./reservationMap";
 
 test("ReservationMap works correctly", () => {

package/src/utils/topK.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import { range } from "d3-array";
 import { topK, topKSlice } from "./topK";
 

package/src/utils/variableTools.test.js

@@ -1,3 +1,4 @@
+import { expect, test } from "vitest";
 import * as vt from "./variableTools";
 
 test("InferNumerality", () => {

package/src/view/axisResolution.test.js

@@ -1,3 +1,4 @@
+import { describe, expect, test } from "vitest";
 import { createAndInitialize } from "./testUtils";
 import UnitView from "./unitView";
 import View from "./view";

package/src/view/axisView.js

@@ -31,7 +31,7 @@ function getPerpendicularChannel(channel) {
 }
 
 /** @type {Record<PositionalChannel, AxisOrient[]>} */
-const CHANNEL_ORIENTS = {
+export const CHANNEL_ORIENTS = {
     x: ["bottom", "top"],
     y: ["left", "right"],
 };
@@ -120,6 +120,8 @@ export default class AxisView extends LayerView {
             this.findChildByName(CHROM_LAYER_NAME).getDynamicDataSource = () =>
                 new DynamicCallbackSource(() => genome.chromosomes);
         }
+
+        this.blockEncodingInheritance = true;
     }
 
     getOrient() {
@@ -427,7 +429,6 @@ function createAxis(axisProps) {
             size: ap.labelFontSize,
             color: ap.labelColor,
             minBufferSize: 1500, // to prevent GPU buffer reallocation when zooming
-            dynamicData: true,
         },
         encoding: {
             [main]: { field: "value", type: "quantitative" },
@@ -448,7 +449,6 @@ function createAxis(axisProps) {
             color: ap.tickColor,
             size: ap.tickWidth,
             minBufferSize: 300,
-            dynamicData: true,
         },
         encoding: {
             [secondary]: { value: anchor },
@@ -574,7 +574,6 @@ export function createGenomeAxis(axisProps) {
                 anchor - (ap.chromTickSize / ap.extent) * (anchor ? 1 : -1),
             color: axisProps.chromTickColor,
             size: ap.chromTickWidth,
-            dynamicData: true,
         },
     });
 
@@ -647,7 +646,6 @@ export function createGenomeAxis(axisProps) {
                 align: axisProps.chromLabelAlign,
                 baseline: "alphabetic",
                 clip: false,
-                dynamicData: true,
                 ...chromLabelMarkProps,
             },
             encoding: {