@genome-spy/core 0.24.2 → 0.25.1

package/package.json

@@ -7,7 +7,7 @@
   },
   "contributors": [],
   "license": "BSD-2-Clause",
-  "version": "0.24.2",
+  "version": "0.25.1",
   "main": "dist/index.js",
   "module": "src/index.js",
   "exports": {
@@ -53,5 +53,5 @@
     "vega-scale": "^7.1.1",
     "vega-util": "^1.16.0"
   },
-  "gitHead": "587ef91161457b17a039f82111d15df339e1e9f5"
+  "gitHead": "e9c4acf0c725ce1ef46303a01a05d7ccf6dcc9c3"
 }

package/src/data/dataFlow.js

@@ -4,6 +4,8 @@
  * @typedef {import("./collector").default} Collector
  */
 
+import NamedSource from "./sources/namedSource";
+
 /**
  * @template H A key (string, object, whatever) that is used to retrieve
  *      data sources and collectors.
@@ -76,6 +78,43 @@ export default class DataFlow {
         return this._dataSourcesByHost.get(key);
     }
 
+    /**
+     *
+     * @param {string} name
+     */
+    findNamedDataSource(name) {
+        /** @type {NamedSource} */
+        let namedSource;
+        /** @type {H[]} */
+        let hosts = [];
+
+        // Note: If a named sources with the same name are present at multiple locations in the
+        // view hierarchy, the should actually be exactly the same instance. It's arranged that
+        // way in the data flow optimization phase.
+
+        for (const [host, dataSource] of this._dataSourcesByHost.entries()) {
+            if (dataSource instanceof NamedSource) {
+                if (name == dataSource.identifier) {
+                    if (namedSource && namedSource !== dataSource) {
+                        // TODO: Write a test case for this and remove the runtime check.
+                        throw new Error(
+                            `Found multiple instances of named data: ${name}. Data flow optimization is broken (it's a bug).`
+                        );
+                    }
+                    namedSource = dataSource;
+                    hosts.push(host);
+                }
+            }
+        }
+
+        if (namedSource) {
+            return {
+                dataSource: namedSource,
+                hosts,
+            };
+        }
+    }
+
     /**
      *
      * @param {Collector} collector

package/src/data/sources/namedSource.js

@@ -10,14 +10,20 @@ export function isNamedData(data) {
 }
 
 export default class NamedSource extends DataSource {
+    /**
+     * Data that has been provided explicitly using the updateDynamicData method
+     * @type {any[]}
+     */
+    #explicitData;
+
     /**
      * @param {import("../../spec/data").NamedData} params
-     * @param {function(string):any[]} getNamedData
+     * @param {function(string):any[]} provider Function that retrieves a dataset using a name
      */
-    constructor(params, getNamedData) {
+    constructor(params, provider) {
         super();
 
-        this.getNamedData = getNamedData;
+        this.provider = provider;
         this.params = params;
     }
 
@@ -28,17 +34,20 @@ export default class NamedSource extends DataSource {
         return this.params.name;
     }
 
-    _getValues() {
-        const data = this.getNamedData(this.params.name);
-        if (data) {
-            return data;
-        } else {
-            throw new Error("Cannot find named data: " + this.params.name);
-        }
+    /**
+     * Update the named data. If data is omitted, a data provider is used instead.
+     *
+     * @param {import("../flowNode").Datum[]} [data]
+     */
+    updateDynamicData(data) {
+        // TODO: Throw is data is undefined and the provider is unable to provide any data
+        this.#explicitData = data;
+        this.loadSynchronously();
     }
 
     loadSynchronously() {
-        const data = this._getValues();
+        const data =
+            this.#explicitData ?? this.provider(this.params.name) ?? [];
 
         /** @type {(x: any) => import("../flowNode").Datum} */
         let wrap = (x) => x;

package/src/embedApi.d.ts

@@ -17,9 +17,9 @@ export type EmbedFunction = (
 
 export interface EmbedOptions {
     /**
-     * A function that allows retrieval of named data sources.
-     *
-     * TODO: Support dynamic updates, i.e., pushing new data.
+     * A function that allows retrieval of named data. There are two ways to provide named data:
+     * 1. A data provider (this)
+     * 2. Explicit updates using the `updateNamedData` method (the other).
      */
     namedDataProvider?: (name: string) => any[];
 
@@ -52,8 +52,16 @@ export interface EmbedResult {
     removeEventListener: (type: string, listener: (event: any) => void) => void;
 
     /**
-     * Returns a named _ScaleResolution_ object that allows for attaching event
+     * Returns a named `ScaleResolution` object that allows for attaching event
      * listeners and controlling the scale domain.
      */
     getScaleResolutionByName: (name: string) => ScaleResolutionApi;
+
+    /**
+     * Updates a named dataset
+     *
+     * @param name data source to update
+     * @param data new data. If left undefined, the data is retrieved from a provider.
+     */
+    updateNamedData: (name: string, data?: any[]) => void;
 }

package/src/genomeSpy.js

@@ -137,10 +137,9 @@ export default class GenomeSpy {
     }
 
     /**
-     *
      * @param {string} name
      */
-    getNamedData(name) {
+    getNamedDataFromProvider(name) {
         for (const provider of this.namedDataProviders) {
             const data = provider(name);
             if (data) {
@@ -149,6 +148,36 @@ export default class GenomeSpy {
         }
     }
 
+    /**
+     *
+     * @param {string} name
+     * @param {any[]} data
+     */
+    updateNamedData(name, data) {
+        const namedSource =
+            this.viewRoot.context.dataFlow.findNamedDataSource(name);
+        if (!namedSource) {
+            throw new Error("No such named data source: " + name);
+        }
+
+        namedSource.dataSource.updateDynamicData(data);
+
+        // Scale domains may need adjustment.
+        // TODO: Refactor so that Collectors handle scale extents etc.
+        for (const host of namedSource.hosts) {
+            host.visit((view) => {
+                for (const resolution of Object.values(
+                    view.resolutions.scale
+                )) {
+                    // TODO: Only update domain
+                    resolution.reconfigure();
+                }
+            });
+        }
+
+        this.animator.requestRender();
+    }
+
     /**
      * Broadcast a message to all views
      *
@@ -243,7 +272,7 @@ export default class GenomeSpy {
                 // placeholder
             },
             updateTooltip: this.updateTooltip.bind(this),
-            getNamedData: this.getNamedData.bind(this),
+            getNamedDataFromProvider: this.getNamedDataFromProvider.bind(this),
             getCurrentHover: () => this._currentHover,
 
             addKeyboardListener: (type, listener) => {

package/src/gl/includes/picking.fragment.glsl

@@ -1 +1 @@
-flat in highp vec4 vPickingColor;
+in highp vec4 vPickingColor;

package/src/gl/includes/picking.vertex.glsl

@@ -4,7 +4,7 @@
  * https://deck.gl/docs/developer-guide/custom-layers/picking
  */
 
-flat out highp vec4 vPickingColor;
+out highp vec4 vPickingColor;
 
 /**
  * Passes the unique id to the fragment shader as a color if picking is enabled.

package/src/gl/point.fragment.glsl

@@ -4,15 +4,15 @@ const lowp vec4 black = vec4(0.0, 0.0, 0.0, 1.0);
 uniform bool uInwardStroke;
 uniform float uGradientStrength;
 
-flat in float vRadius;
-flat in float vRadiusWithPadding;
+in float vRadius;
+in float vRadiusWithPadding;
 
-flat in lowp vec4 vFillColor;
-flat in lowp vec4 vStrokeColor;
-flat in lowp float vShape;
-flat in lowp float vHalfStrokeWidth;
+in lowp vec4 vFillColor;
+in lowp vec4 vStrokeColor;
+in lowp float vShape;
+in lowp float vHalfStrokeWidth;
 
-flat in mat2 vRotationMatrix;
+in mat2 vRotationMatrix;
 
 out lowp vec4 fragColor;
 

package/src/gl/point.vertex.glsl

@@ -17,13 +17,13 @@ uniform float uMaxPointSize;
 uniform float uZoomLevel;
 uniform float uSemanticThreshold;
 
-flat out float vRadius;
-flat out float vRadiusWithPadding;
-flat out lowp vec4 vFillColor;
-flat out lowp vec4 vStrokeColor;
-flat out lowp float vShape;
-flat out lowp float vHalfStrokeWidth;
-flat out mat2 vRotationMatrix;
+out float vRadius;
+out float vRadiusWithPadding;
+out lowp vec4 vFillColor;
+out lowp vec4 vStrokeColor;
+out lowp float vShape;
+out lowp float vHalfStrokeWidth;
+out mat2 vRotationMatrix;
 
 
 float computeSemanticThresholdFactor() {

package/src/gl/rect.fragment.glsl

@@ -2,12 +2,12 @@
 in vec2 vPosInPixels;
 #endif
 
-flat in vec2 vHalfSizeInPixels;
+in vec2 vHalfSizeInPixels;
 
-flat in lowp vec4 vFillColor;
-flat in lowp vec4 vStrokeColor;
-flat in float vHalfStrokeWidth;
-flat in vec4 vCornerRadii;
+in lowp vec4 vFillColor;
+in lowp vec4 vStrokeColor;
+in float vHalfStrokeWidth;
+in vec4 vCornerRadii;
 
 out lowp vec4 fragColor;
 

package/src/gl/rect.vertex.glsl

@@ -15,10 +15,10 @@ uniform float uMinOpacity;
 /** top-right, bottom-right, top-left, bottom-left */
 uniform vec4 uCornerRadii;
 
-flat out lowp vec4 vFillColor;
-flat out lowp vec4 vStrokeColor;
-flat out float vHalfStrokeWidth;
-flat out vec4 vCornerRadii;
+out lowp vec4 vFillColor;
+out lowp vec4 vStrokeColor;
+out float vHalfStrokeWidth;
+out vec4 vCornerRadii;
 
 
 #if defined(ROUNDED_CORNERS) || defined(STROKED)
@@ -27,7 +27,7 @@ out vec2 vPosInPixels;
 #endif
 
 /** Size of the rect in pixels */
-flat out vec2 vHalfSizeInPixels;
+out vec2 vHalfSizeInPixels;
 
 /**
  * Clamps the minimumSize and returns an opacity that reflects the amount of clamping.

package/src/gl/rule.fragment.glsl

@@ -8,8 +8,8 @@ uniform float uDashTextureSize;
 uniform float uStrokeDashOffset;
 uniform lowp int uStrokeCap;
 
-flat in vec4 vColor;
-flat in float vSize;
+in vec4 vColor;
+in float vSize;
 
 /** Position on the rule along its length in pixels */
 in vec2 vPosInPixels;

package/src/gl/rule.vertex.glsl

@@ -15,10 +15,10 @@ uniform float uMinLength;
 uniform mediump float uDashTextureSize;
 uniform lowp int uStrokeCap;
 
-flat out vec4 vColor;
+out vec4 vColor;
 
 /** Stroke width */
-flat out float vSize;
+out float vSize;
 
 /** The distance from the line center to the direction of normal in pixels */
 out float vNormalLengthInPixels;

package/src/gl/text.fragment.glsl

@@ -2,8 +2,8 @@ uniform sampler2D uTexture;
 
 in vec2 vTexCoord;
 in float vEdgeFadeOpacity;
-flat in vec4 vColor;
-flat in float vSlope;
+in vec4 vColor;
+in float vSlope;
 
 out lowp vec4 fragColor;
 

package/src/gl/text.vertex.glsl

@@ -29,8 +29,8 @@ uniform bool uFlushY;
 #endif
 
 out vec2 vTexCoord;
-flat out vec4 vColor;
-flat out float vSlope;
+out vec4 vColor;
+out float vSlope;
 out float vEdgeFadeOpacity;
 
 struct RangeResult {

package/src/index.js

@@ -11,6 +11,7 @@ export { GenomeSpy, html, icon };
  * Embeds GenomeSpy into the DOM
  *
  * @type {import("./embedApi.js").EmbedFunction}
+ * @returns {Promise<import("./embedApi").EmbedResult>}
  */
 export async function embed(el, spec, options = {}) {
     /** @type {HTMLElement} */
@@ -85,6 +86,8 @@ export async function embed(el, spec, options = {}) {
         getScaleResolutionByName(name) {
             return genomeSpy.getNamedScaleResolutions().get(name);
         },
+
+        updateNamedData: genomeSpy.updateNamedData.bind(genomeSpy),
     };
 }
 

package/src/view/flowBuilder.js

@@ -116,7 +116,11 @@ export function buildDataFlow(root, existingFlow) {
             const dataSource = isDynamicCallbackData(view.spec.data)
                 ? view.getDynamicDataSource()
                 : isNamedData(view.spec.data)
-                ? new NamedSource(view.spec.data, view.context.getNamedData)
+                ? // TODO: Only one NamedSource instance per unique name should exists
+                  new NamedSource(
+                      view.spec.data,
+                      view.context.getNamedDataFromProvider
+                  )
                 : createDataSource(view.spec.data, view.getBaseUrl());
 
             currentNode = dataSource;

package/src/view/viewContext.d.ts

@@ -48,7 +48,7 @@ export default interface ViewContext {
         listener: (event: KeyboardEvent) => void
     ) => void;
 
-    getNamedData: (name: string) => any[];
+    getNamedDataFromProvider: (name: string) => any[];
 
     isViewVisible: (view: View) => boolean;