Merge remote-tracking branch 'origin/master' into nested_chunks

package.json

@@ -11,6 +11,7 @@
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "recoil": "0.0.13",
+    "reference-spec-reader": "^0.1.1",
     "zarr": "^0.4.0"
   },
   "scripts": {
@@ -46,6 +47,6 @@
     "@types/snowpack-env": "^2.3.2",
     "prettier": "^2.2.0",
     "snowpack": "^3.0.6",
-    "typescript": "^4.1.2"
+    "typescript": "^4.2.3"
   }
 }

src/io.ts

@@ -1,5 +1,5 @@
 import { DTYPE_VALUES, ImageLayer, MultiscaleImageLayer, ZarrPixelSource } from '@hms-dbmi/viv';
-import { Group as ZarrGroup, openGroup, ZarrArray } from 'zarr';
+import { Group as ZarrGroup, HTTPStore, openGroup, ZarrArray } from 'zarr';
 import GridLayer from './gridLayer';
 import { loadOmeroMultiscales, loadPlate, loadWell } from './ome';
 import type {
@@ -24,7 +24,7 @@ import {
   RGB,
 } from './utils';
 
-function getAxisLabels(arr: ZarrArray, axis_labels?: string[], channel_axis?: number): string[] {
+function getAxisLabels(arr: ZarrArray, axis_labels?: string[], channel_axis?: number) {
   if (!axis_labels || axis_labels.length != arr.shape.length) {
     // default axis_labels are e.g. ['0', '1', 'y', 'x']
     const nonXYaxisLabels = arr.shape.slice(0, -2).map((d, i) => '' + i);
@@ -33,7 +33,7 @@ function getAxisLabels(arr: ZarrArray, axis_labels?: string[], channel_axis?: nu
   if (channel_axis) {
     axis_labels[channel_axis] = 'c';
   }
-  return axis_labels;
+  return axis_labels as [...string[], 'y', 'x'];
 }
 
 function loadSingleChannel(config: SingleChannelConfig, data: ZarrPixelSource<string[]>[], max: number): SourceData {
@@ -134,11 +134,11 @@ export async function createSourceData(config: ImageLayerConfig): Promise<Source
       return loadOmeroMultiscales(config, node, attrs);
     }
 
-    if (Object.keys(attrs).length === 0 && node.path !== '') {
+    if (Object.keys(attrs).length === 0 && node.store instanceof HTTPStore) {
       // No rootAttrs in this group.
       // if url is to a plate/acquisition/ check parent dir for 'plate' zattrs
-      const parentPath = node.path.slice(0, node.path.lastIndexOf('/'));
-      const parent = await openGroup(node.store, parentPath);
+      const parentUrl = node.store.url.slice(0, node.store.url.lastIndexOf('/'));
+      const parent = await openGroup(new HTTPStore(parentUrl));
       const parentAttrs = (await parent.attrs.asObject()) as Ome.Attrs;
       if ('plate' in parentAttrs) {
         return loadPlate(config, parent, parentAttrs.plate);

src/ome.ts

@@ -36,7 +36,7 @@ export async function loadWell(
     throw Error('Store must be an HTTPStore to open well.');
   }
 
-  const [row, col] = grp.path.split('/').filter(Boolean).slice(-2);
+  const [row, col] = grp.store.url.split('/').filter(Boolean).slice(-2);
 
   let { images } = wellAttrs;
 
@@ -45,8 +45,8 @@ export async function loadWell(
 
   if (acqIds.length > 1) {
     // Need to get acquisitions metadata from parent Plate
-    const platePath = grp.path.replace(`${row}/${col}`, '');
-    const plate = await openGroup(grp.store, platePath);
+    const plateUrl = grp.store.url.replace(`${row}/${col}`, '');
+    const plate = await openGroup(new HTTPStore(plateUrl));
     const plateAttrs = (await plate.attrs.asObject()) as { plate: Ome.Plate };
     acquisitions = plateAttrs?.plate?.acquisitions ?? [];
 
@@ -107,9 +107,9 @@ export async function loadWell(
     }
     const { row, column } = gridCoord;
     let imgSource = undefined;
-    if (grp.store instanceof HTTPStore && grp.path !== '' && !isNaN(row) && !isNaN(column)) {
+    if (grp.store instanceof HTTPStore && !isNaN(row) && !isNaN(column)) {
       const field = row * cols + column;
-      imgSource = join(grp.store.url, grp.path, imgPaths[field]);
+      imgSource = join(grp.store.url, imgPaths[field]);
     }
     if (config.onClick) {
       delete info.layer;
@@ -201,7 +201,7 @@ export async function loadPlate(
     let imgSource = undefined;
     // TODO: use a regex for the path??
     if (grp.store instanceof HTTPStore && !isNaN(row) && !isNaN(column)) {
-      imgSource = join(grp.store.url, grp.path, rows[row], columns[column]);
+      imgSource = join(grp.store.url, rows[row], columns[column]);
     }
     if (config.onClick) {
       delete info.layer;
@@ -264,6 +264,6 @@ function parseOmeroMeta({ rdefs, channels, name }: Ome.Omero) {
     visibilities,
     channel_axis: 1,
     defaultSelection: [t, 0, z, 0, 0],
-    axis_labels: ['t', 'c', 'z', 'y', 'x'],
+    axis_labels: ['t', 'c', 'z', 'y', 'x'] as [...string[], 'y', 'x'],
   };
 }

src/utils.ts

@@ -2,8 +2,6 @@ import { ContainsArrayError, HTTPStore, openArray, openGroup, ZarrArray } from '
 import type { Group as ZarrGroup } from 'zarr';
 import { Matrix4 } from '@math.gl/core/dist/esm';
 
-import { FileReferenceStore } from './storage';
-
 export const MAX_CHANNELS = 6;
 
 export const COLORS = {
@@ -22,20 +20,20 @@ export const CYMRGB = Object.values(COLORS).slice(0, -2);
 async function normalizeStore(source: string | ZarrArray['store']) {
   if (typeof source === 'string') {
     if (source.endsWith('.json')) {
-      const store = await FileReferenceStore.fromUrl(source);
-      return { store };
+      // import custom store implementation
+      const { ReferenceStore } = await import('reference-spec-reader');
+      return ReferenceStore.fromJSON(await fetch(source).then((res) => res.json()));
     }
-    const [root, path] = source.split('.zarr');
-    return { store: new HTTPStore(root + '.zarr'), path };
+    return new HTTPStore(source);
   }
-  return { store: source };
+  return source;
 }
 
 export async function open(source: string | ZarrArray['store']) {
-  const { store, path } = await normalizeStore(source);
-  return openGroup(store, path).catch((err) => {
+  const store = await normalizeStore(source);
+  return openGroup(store).catch((err) => {
     if (err instanceof ContainsArrayError) {
-      return openArray({ store, path });
+      return openArray({ store });
     }
     throw err;
   });