@genome-spy/core 0.67.0 → 0.69.0

package/dist/src/genomeSpy.js

@@ -5,6 +5,7 @@ import {
     createMessageBox,
 } from "./genomeSpy/containerUi.js";
 import LoadingIndicatorManager from "./genomeSpy/loadingIndicatorManager.js";
+import LoadingStatusRegistry from "./genomeSpy/loadingStatusRegistry.js";
 import { createViewHighlighter } from "./genomeSpy/viewHighlight.js";
 import KeyboardListenerManager from "./genomeSpy/keyboardListenerManager.js";
 import EventListenerRegistry from "./genomeSpy/eventListenerRegistry.js";
@@ -35,6 +36,7 @@ import {
     configureViewOpacity,
 } from "./genomeSpy/viewHierarchyConfig.js";
 import { exportCanvas } from "./genomeSpy/canvasExport.js";
+import { validateSelectorConstraints } from "./view/viewSelectors.js";
 
 /**
  * Events that are broadcasted to all views.
@@ -50,6 +52,8 @@ export default class GenomeSpy {
     #renderCoordinator;
     /** @type {LoadingIndicatorManager} */
     #loadingIndicatorManager;
+    /** @type {LoadingStatusRegistry} */
+    #loadingStatusRegistry;
     /** @type {InputBindingManager} */
     #inputBindingManager;
     /** @type {InteractionController} */
@@ -192,7 +196,7 @@ export default class GenomeSpy {
     }
 
     #setupDpr() {
-        const dprSetter = this.viewRoot.paramMediator.allocateSetter(
+        const dprSetter = this.viewRoot.paramRuntime.allocateSetter(
             "devicePixelRatio",
             this.dpr
         );
@@ -237,12 +241,8 @@ export default class GenomeSpy {
     }
 
     #prepareContainer() {
-        const {
-            canvasWrapper,
-            loadingMessageElement,
-            loadingIndicatorsElement,
-            tooltip,
-        } = createContainerUi(this.container);
+        const { canvasWrapper, loadingIndicatorsElement, tooltip } =
+            createContainerUi(this.container);
 
         this.#glHelper = new WebGLHelper(
             canvasWrapper,
@@ -253,16 +253,11 @@ export default class GenomeSpy {
             { powerPreference: this.options.powerPreference ?? "default" }
         );
 
-        // The initial loading message that is shown until the first frame is rendered
-        this.loadingMessageElement = loadingMessageElement;
-        // A container for loading indicators (for lazy data sources.)
-        // These could alternatively be included in the view hierarchy,
-        // but it's easier this way – particularly if we want to show
-        // some fancy animated spinners.
-        this.loadingIndicatorsElement = loadingIndicatorsElement;
         this.tooltip = tooltip;
+        this.#loadingStatusRegistry = new LoadingStatusRegistry();
         this.#loadingIndicatorManager = new LoadingIndicatorManager(
-            loadingIndicatorsElement
+            loadingIndicatorsElement,
+            this.#loadingStatusRegistry
         );
     }
 
@@ -285,6 +280,8 @@ export default class GenomeSpy {
 
         this.#inputBindingManager.remove();
 
+        this.#loadingIndicatorManager.destroy();
+
         while (this.container.firstChild) {
             this.container.firstChild.remove();
         }
@@ -311,8 +308,11 @@ export default class GenomeSpy {
     }
 
     #createViewContext() {
+        const dataFlow = new DataFlow();
+        dataFlow.loadingStatusRegistry = this.#loadingStatusRegistry;
+
         return createViewContext({
-            dataFlow: new DataFlow(),
+            dataFlow,
             glHelper: this.#glHelper,
             animator: this.animator,
             genomeStore: this.genomeStore,
@@ -321,12 +321,6 @@ export default class GenomeSpy {
             getNamedDataFromProvider: this.getNamedDataFromProvider.bind(this),
             getCurrentHover: () =>
                 this.#interactionController.getCurrentHover(),
-            setDataLoadingStatus: (view, status, detail) =>
-                this.#loadingIndicatorManager.setDataLoadingStatus(
-                    view,
-                    status,
-                    detail
-                ),
             addKeyboardListener: (type, listener) => {
                 // TODO: Listeners should be called only when the mouse pointer is inside the
                 // container or the app covers the full document.
@@ -378,6 +372,8 @@ export default class GenomeSpy {
             VIEW_ROOT_NAME
         );
 
+        this.#loadingStatusRegistry.set(this.viewRoot, "loading");
+
         this.#canvasWrapper.style.flexGrow =
             this.viewRoot.getSize().height.grow > 0 ? "1" : "0";
 
@@ -385,6 +381,7 @@ export default class GenomeSpy {
 
         configureViewHierarchy(this.viewRoot);
         configureViewOpacity(this.viewRoot);
+        this.#logSelectorConstraintWarnings();
 
         // We should now have a complete view hierarchy. Let's update the canvas size
         // and ensure that the loading message is visible.
@@ -405,6 +402,17 @@ export default class GenomeSpy {
         this.#setupDpr();
     }
 
+    #logSelectorConstraintWarnings() {
+        const issues = validateSelectorConstraints(this.viewRoot);
+        if (!issues.length) {
+            return;
+        }
+
+        for (const issue of issues) {
+            console.warn("Selector constraints warning:", issue.message);
+        }
+    }
+
     /**
      * @param {import("./types/viewContext.js").default} context
      */
@@ -435,6 +443,7 @@ export default class GenomeSpy {
      * @returns {Promise<boolean>} true if the launch was successful
      */
     async launch() {
+        let launched = false;
         try {
             this.#prepareContainer();
 
@@ -445,6 +454,7 @@ export default class GenomeSpy {
             this.computeLayout();
             this.animator.requestRender();
 
+            launched = true;
             return true;
         } catch (reason) {
             const message = `${
@@ -456,13 +466,20 @@ export default class GenomeSpy {
                 createMessageBox(this.container, message);
             }
 
+            if (this.viewRoot) {
+                this.#loadingStatusRegistry.set(
+                    this.viewRoot,
+                    "error",
+                    message
+                );
+            }
+
             return false;
         } finally {
             this.#canvasWrapper.classList.remove("loading");
-            // Transition listener doesn't appear to work on observablehq
-            window.setTimeout(() => {
-                this.loadingMessageElement.style.display = "none";
-            }, 2000);
+            if (launched && this.viewRoot) {
+                this.#loadingStatusRegistry.set(this.viewRoot, "complete");
+            }
         }
     }
 
@@ -552,7 +569,10 @@ export default class GenomeSpy {
         /** @type {UnitView[]} */
         const views = [];
         this.viewRoot.visit((view) => {
-            if (view instanceof UnitView && view.getDataAccessor("search")) {
+            if (
+                view instanceof UnitView &&
+                view.getSearchAccessors().length > 0
+            ) {
                 views.push(view);
             }
         });

package/dist/src/gl/glslScaleGenerator.js

@@ -15,7 +15,7 @@ import {
 } from "../encoder/encoder.js";
 import { asArray, peek } from "../utils/arrayUtils.js";
 import { InternMap } from "internmap";
-import { isExprRef } from "../view/paramMediator.js";
+import { isExprRef } from "../paramRuntime/paramUtils.js";
 import scaleNull from "../utils/scaleNull.js";
 import { cssColorToArray } from "./colorUtils.js";
 

package/dist/src/marks/mark.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mark.d.ts","sourceRoot":"","sources":["../../../src/marks/mark.js"],"names":[],"mappings":"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"}
+{"version":3,"file":"mark.d.ts","sourceRoot":"","sources":["../../../src/marks/mark.js"],"names":[],"mappings":"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"}

package/dist/src/marks/mark.js

@@ -48,7 +48,10 @@ import coalesceProperties from "../utils/propertyCoalescer.js";
 import { isScalar } from "../utils/variableTools.js";
 import { InternMap } from "internmap";
 import ViewError from "../view/viewError.js";
-import { isExprRef, validateParameterName } from "../view/paramMediator.js";
+import {
+    isExprRef,
+    validateParameterName,
+} from "../paramRuntime/paramUtils.js";
 import { UNIQUE_ID_KEY } from "../data/transforms/identifier.js";
 import {
     isIntervalSelection,
@@ -95,11 +98,6 @@ export default class Mark {
      */
     #callAfterShaderCompilation = [];
 
-    /**
-     * @type {{expr: import("../view/paramMediator.js").ExprRefFunction, listener: () => void}[]}
-     */
-    #exprListeners = [];
-
     /**
      * @param {import("../view/unitView.js").default} unitView
      */
@@ -304,13 +302,13 @@ export default class Mark {
         for (const key of props) {
             const prop = this.properties[key];
             if (prop && isExprRef(prop)) {
-                const fn = this.unitView.paramMediator.createExpression(
-                    prop.expr
+                const fn = this.unitView.paramRuntime.watchExpression(
+                    prop.expr,
+                    () => {
+                        this.updateGraphicsData();
+                        this.unitView.context.animator.requestRender();
+                    }
                 );
-                fn.addListener(() => {
-                    this.updateGraphicsData();
-                    this.unitView.context.animator.requestRender();
-                });
                 // @ts-ignore
                 if (!channels.includes(key)) {
                     Object.defineProperty(exprProps, key, {
@@ -487,8 +485,8 @@ export default class Mark {
 
         for (const predicate of paramPredicates) {
             const param = predicate.param;
-            const paramMediator = this.unitView.paramMediator;
-            const selection = paramMediator.findValue(param);
+            const paramRuntime = this.unitView.paramRuntime;
+            const selection = paramRuntime.findValue(param);
 
             // The selection is supposed to have an empty value at this point
             // so that we can figure out the type of the selection.
@@ -546,7 +544,7 @@ export default class Mark {
 
                     this.selectionTextureOps.push(() => {
                         // Texture is set in the prepareRender method
-                        const selection = paramMediator.getValue(param);
+                        const selection = paramRuntime.getValue(param);
                         const texture = selectionTextures.get(selection);
                         if (!texture) {
                             throw new Error(
@@ -569,11 +567,10 @@ export default class Mark {
                     // Create the initial texture
                     glHelper.createSelectionTexture(selection);
 
-                    const fn = paramMediator.createExpression(param);
-                    fn.addListener(() => {
+                    paramRuntime.watchExpression(param, () => {
                         const selection =
                             /** @type {import("../types/selectionTypes.js").MultiPointSelection} */ (
-                                fn(null)
+                                paramRuntime.getValue(param)
                             );
                         glHelper.createSelectionTexture(selection);
                         this.getContext().animator.requestRender();
@@ -940,6 +937,17 @@ export default class Mark {
      * initiated. The idea is to allow for parallel background compilation.
      */
     finalizeGraphicsInitialization() {
+        // Allow duplicate finalization calls when multiple init paths overlap.
+        if (this.programInfo) {
+            return;
+        }
+
+        if (!this.programStatus) {
+            throw new Error(
+                "No program status found! " + this.unitView.getPathString()
+            );
+        }
+
         const error = this.programStatus.getProgramErrors();
         if (error) {
             if (error.detail) {
@@ -1033,15 +1041,14 @@ export default class Mark {
         };
 
         if (isExprRef(propValue)) {
-            const fn = this.unitView.paramMediator.createExpression(
-                propValue.expr
-            );
-
+            /** @type {import("../paramRuntime/types.js").ExprRefFunction} */
+            let fn;
             const set = () => setter(adjuster(fn(null)));
+            fn = this.unitView.paramRuntime.watchExpression(
+                propValue.expr,
+                set
+            );
 
-            // Register a listener ...
-            fn.addListener(set);
-            this.#exprListeners.push({ expr: fn, listener: set });
             // ... and set the initial value
             set();
         } else {
@@ -1086,10 +1093,6 @@ export default class Mark {
     }
 
     dispose() {
-        for (const { expr, listener } of this.#exprListeners) {
-            expr.removeListener(listener);
-        }
-        this.#exprListeners.length = 0;
         this.deleteGraphicsData();
     }
 
@@ -1166,7 +1169,7 @@ export default class Mark {
     isPickingParticipant() {
         if (
             this.properties.tooltip === null &&
-            !this.unitView.paramMediator.hasPointSelections()
+            !this.unitView.paramRuntime.hasPointSelections()
         ) {
             // Disabled
             return false;
@@ -1290,21 +1293,17 @@ export default class Mark {
         const locationSetter = this.programInfo.uniformSetters.uSampleFacet;
 
         if (opts && locationSetter) {
-            const pos = opts.locSize ? opts.locSize.location : 0.0;
-            const height = opts.locSize ? opts.locSize.size : 1.0;
+            const scale = opts.pixelToUnit;
+            const pos = opts.locSize.location * scale;
+            const height = opts.locSize.size * scale;
 
             if (pos > 1.0 || pos + height < 0.0) {
                 // Not visible
                 return false;
             }
 
-            const targetPos = opts.targetLocSize
-                ? opts.targetLocSize.location
-                : pos;
-            const targetHeight = opts.targetLocSize
-                ? opts.targetLocSize.size
-                : height;
-
+            // No target locSize in the current API. Keep a consistent shader path
+            // by repeating the current position/height.
             // Use WebGL directly, because twgl uses gl.uniform4fv, which has an
             // inferior performance. Based on profiling, this optimization gives
             // a significant performance boost.
@@ -1313,8 +1312,8 @@ export default class Mark {
                 locationSetter.location, // TODO: Make a twgl pull request to fix typing
                 pos,
                 height,
-                targetPos,
-                targetHeight
+                pos,
+                height
             );
         }
 

package/dist/src/marks/markUtils.js

@@ -38,7 +38,7 @@ export function fixPositional(encoding, channel) {
         if (!secondary) {
             if (primary.type == "quantitative") {
                 // Bar plot, anchor the other end to zero
-                secondary = { datum: 0, contributesToScaleDomain: false };
+                secondary = { datum: 0, domainInert: true };
             } else {
                 secondary = { ...primary };
 

package/dist/src/marks/point.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"point.d.ts","sourceRoot":"","sources":["../../../src/marks/point.js"],"names":[],"mappings":"AAmBA;;GAEG;AACH;IAGI;;OAEG;IACH,sBAFW,OAAO,qBAAqB,EAAE,OAAO,EAmD/C;IA0EO,iDAMC;IAkET,+BAkBC;;CAgDJ;iBAtRgB,WAAW"}
+{"version":3,"file":"point.d.ts","sourceRoot":"","sources":["../../../src/marks/point.js"],"names":[],"mappings":"AAmBA;;GAEG;AACH;IAGI;;OAEG;IACH,sBAFW,OAAO,qBAAqB,EAAE,OAAO,EAiD/C;IA0EO,iDAMC;IAkET,+BAkBC;;CAgDJ;iBApRgB,WAAW"}

package/dist/src/marks/point.js

@@ -10,7 +10,7 @@ import FRAGMENT_SHADER from "./point.fragment.glsl.js";
 import COMMON_SHADER from "./point.common.glsl.js";
 
 import Mark from "./mark.js";
-import { isExprRef } from "../view/paramMediator.js";
+import { isExprRef } from "../paramRuntime/paramUtils.js";
 import { sampleIterable } from "../data/transforms/sample.js";
 import { fixFill, fixStroke } from "./markUtils.js";
 
@@ -58,11 +58,9 @@ export default class PointMark extends Mark {
         const szf = this.properties.semanticZoomFraction;
         if (szf != null) {
             if (isExprRef(szf)) {
-                const fn = this.unitView.paramMediator.createExpression(
-                    szf.expr
-                );
-                fn.addListener(() =>
-                    this.getContext().animator.requestRender()
+                const fn = this.unitView.paramRuntime.watchExpression(
+                    szf.expr,
+                    () => this.getContext().animator.requestRender()
                 );
                 this.#semanticZoomFraction = fn;
             } else {

package/dist/src/paramRuntime/expressionCompiler.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @param {string} expr
+ * @param {Record<string, any>} [globalObject]
+ * @returns {import("../utils/expression.js").ExpressionFunction}
+ */
+export function compileExpression(expr: string, globalObject?: Record<string, any>): import("../utils/expression.js").ExpressionFunction;
+//# sourceMappingURL=expressionCompiler.d.ts.map

package/dist/src/paramRuntime/expressionCompiler.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"expressionCompiler.d.ts","sourceRoot":"","sources":["../../../src/paramRuntime/expressionCompiler.js"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,wCAJW,MAAM,iBACN,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GACjB,OAAO,wBAAwB,EAAE,kBAAkB,CAI/D"}

package/dist/src/paramRuntime/expressionCompiler.js

@@ -0,0 +1,10 @@
+import createFunction from "../utils/expression.js";
+
+/**
+ * @param {string} expr
+ * @param {Record<string, any>} [globalObject]
+ * @returns {import("../utils/expression.js").ExpressionFunction}
+ */
+export function compileExpression(expr, globalObject = {}) {
+    return createFunction(expr, globalObject);
+}

package/dist/src/paramRuntime/expressionRef.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @typedef {{
+ *   expression: import("./types.js").ExprRefFunction,
+ *   dependencies: import("./types.js").ParamRef<any>[]
+ * }} BoundExpression
+ */
+/**
+ * Binds expression globals to parameter refs in a specific scope and equips the
+ * resulting expression function with listener lifecycle helpers.
+ *
+ * @param {string} expr
+ * @param {(name: string) => import("./types.js").ParamRef<any> | undefined} resolve
+ * @returns {BoundExpression}
+ */
+export function bindExpression(expr: string, resolve: (name: string) => import("./types.js").ParamRef<any> | undefined): BoundExpression;
+export type BoundExpression = {
+    expression: import("./types.js").ExprRefFunction;
+    dependencies: import("./types.js").ParamRef<any>[];
+};
+//# sourceMappingURL=expressionRef.d.ts.map

package/dist/src/paramRuntime/expressionRef.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"expressionRef.d.ts","sourceRoot":"","sources":["../../../src/paramRuntime/expressionRef.js"],"names":[],"mappings":"AAEA;;;;;GAKG;AAEH;;;;;;;GAOG;AACH,qCAJW,MAAM,WACN,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,YAAY,EAAE,QAAQ,CAAC,GAAG,CAAC,GAAG,SAAS,GAC9D,eAAe,CA+E3B;8BA3FY;IACR,UAAU,EAAE,OAAO,YAAY,EAAE,eAAe,CAAC;IACjD,YAAY,EAAE,OAAO,YAAY,EAAE,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAA;CACnD"}

package/dist/src/paramRuntime/expressionRef.js

@@ -0,0 +1,95 @@
+import { compileExpression } from "./expressionCompiler.js";
+
+/**
+ * @typedef {{
+ *   expression: import("./types.js").ExprRefFunction,
+ *   dependencies: import("./types.js").ParamRef<any>[]
+ * }} BoundExpression
+ */
+
+/**
+ * Binds expression globals to parameter refs in a specific scope and equips the
+ * resulting expression function with listener lifecycle helpers.
+ *
+ * @param {string} expr
+ * @param {(name: string) => import("./types.js").ParamRef<any> | undefined} resolve
+ * @returns {BoundExpression}
+ */
+export function bindExpression(expr, resolve) {
+    const globalObject = {};
+
+    /** @type {import("./types.js").ExprRefFunction} */
+    const expression = /** @type {any} */ (
+        compileExpression(expr, globalObject)
+    );
+
+    /** @type {Map<string, import("./types.js").ParamRef<any>>} */
+    const refsForParams = new Map();
+
+    for (const globalName of expression.globals) {
+        if (refsForParams.has(globalName)) {
+            continue;
+        }
+
+        const ref = resolve(globalName);
+        if (!ref) {
+            throw new Error(
+                'Unknown variable "' + globalName + '" in expression: ' + expr
+            );
+        }
+
+        refsForParams.set(globalName, ref);
+
+        Object.defineProperty(globalObject, globalName, {
+            enumerable: true,
+            get() {
+                return ref.get();
+            },
+        });
+    }
+
+    /** @type {Set<() => void>} */
+    const activeSubscriptions = new Set();
+
+    expression.subscribe = (listener) => {
+        /** @type {(() => void)[]} */
+        const disposers = [];
+        for (const ref of refsForParams.values()) {
+            disposers.push(ref.subscribe(listener));
+        }
+
+        let active = true;
+        const unsubscribe = () => {
+            if (!active) {
+                return;
+            }
+            active = false;
+            activeSubscriptions.delete(unsubscribe);
+            disposers.forEach((dispose) => dispose());
+        };
+        activeSubscriptions.add(unsubscribe);
+
+        return unsubscribe;
+    };
+
+    expression.invalidate = () => {
+        for (const unsubscribe of activeSubscriptions) {
+            unsubscribe();
+        }
+        activeSubscriptions.clear();
+    };
+
+    // Include dependency identities to avoid collisions between structurally
+    // identical expressions in different scopes.
+    expression.identifier = () =>
+        expression.code +
+        "|" +
+        Array.from(refsForParams.values())
+            .map((ref) => ref.id)
+            .join(",");
+
+    return {
+        expression,
+        dependencies: Array.from(refsForParams.values()),
+    };
+}

package/dist/src/paramRuntime/expressionRef.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=expressionRef.test.d.ts.map

package/dist/src/paramRuntime/expressionRef.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"expressionRef.test.d.ts","sourceRoot":"","sources":["../../../src/paramRuntime/expressionRef.test.js"],"names":[],"mappings":""}