diff --git a/idr_gallery/static/idr_gallery/categories.js b/idr_gallery/static/idr_gallery/categories.js
index e045573b..f4d89223 100644
--- a/idr_gallery/static/idr_gallery/categories.js
+++ b/idr_gallery/static/idr_gallery/categories.js
@@ -115,19 +115,23 @@ function render() {
let idrIds = [];
let html = "";
+ let zarrHtml = "";
if (!groupByType) {
- // Show all studies...
- html = model.studies
- .map((study) => {
- let idrId = study.Name.split("-")[0];
- // Ignore multiple projects/screens from same study/publication
- if (idrIds.includes(idrId)) {
- return "";
- }
- idrIds.push(idrId);
- return studyHtml(study, studyContainers[idrId]);
- })
- .join("");
+ // Show all studies... with 'zarr' stuides in a different section at the top
+ zarrHtml = `OME-Zarr studies
`;
+ model.studies.forEach((study) => {
+ let idrId = study.Name.split("-")[0];
+ // Ignore multiple projects/screens from same study/publication
+ if (idrIds.includes(idrId)) {
+ return "";
+ }
+ idrIds.push(idrId);
+ if (study.zarr) {
+ zarrHtml += studyHtml(study, studyContainers[idrId]);
+ } else {
+ html += studyHtml(study, studyContainers[idrId]);
+ }
+ });
} else {
// group by Categories
let categories = Object.keys(CATEGORY_QUERIES);
@@ -179,6 +183,7 @@ function render() {
}
document.getElementById("studies").innerHTML = html;
+ document.getElementById("zarrStudies").innerHTML = zarrHtml;
// tooltips - NB: updated when thumbnails loaded
tippy(".studyThumb", {
diff --git a/idr_gallery/static/idr_gallery/model.js b/idr_gallery/static/idr_gallery/model.js
index 9a93c823..5033fc5d 100644
--- a/idr_gallery/static/idr_gallery/model.js
+++ b/idr_gallery/static/idr_gallery/model.js
@@ -302,6 +302,9 @@ class StudiesModel {
// Load Map Annotations
await this.loadStudiesMapAnnotations();
+ // Load OME-NGFF tag and add 'zarr' attribute to studies with this tag
+ await this.loadZarrTag();
+
// Generate StudyDescription (removes 'Publication Title' etc from project.Description)
this.studies.forEach((study) => {
study["StudyTitle"] = this.getStudyTitle(study);
@@ -332,6 +335,34 @@ class StudiesModel {
}
}
+ async loadZarrTag() {
+ // Load OME-NGFF tag and add 'zarr' attribute to studies with this tag.
+ // First load all tags to find the "OME-NGFF" tag and its ID
+ let url = this.base_url + "webclient/api/tags/?orphaned=true&experimenter_id=-1&page=0";
+ let tagJson = await fetch(url).then((response) => response.json());
+ console.log("Found tags", tagJson);
+ let ngffTag = tagJson["tags"].find((tag) => tag.value.includes("OME-NGFF"));
+ if (!ngffTag) {
+ console.warn("No OME-NGFF tag found");
+ return;
+ }
+ let ngffTagId = ngffTag.id;
+ url = this.base_url + `webclient/api/tags/?id=${ngffTagId}`;
+ let zarrStudies = await fetch(url).then((response) => response.json());
+ let zarrStudyIds = new Set(); // set of 'screen-123' or 'project-456' that have the OME-NGFF tag
+ zarrStudies.screens.forEach((screen) => zarrStudyIds.add(`screen-${screen.id}`));
+ zarrStudies.projects.forEach((project) => zarrStudyIds.add(`project-${project.id}`));
+ console.log("zarrStudyIds", zarrStudyIds);
+ // add "zarr" attribute to studies with this tag...
+ this.studies = this.studies.map((study) => {
+ if (zarrStudyIds.has(study.objId)) {
+ console.log("Study with OME-NGFF tag:", study.objId);
+ study.zarr = true;
+ }
+ return study;
+ });
+ }
+
async loadStudiesMapAnnotations() {
let url = this.base_url + "webclient/api/annotations/?type=map";
let data = this.studies
diff --git a/idr_gallery/templates/idr_gallery/image.html b/idr_gallery/templates/idr_gallery/image.html
index 316e9cfd..06faecb8 100644
--- a/idr_gallery/templates/idr_gallery/image.html
+++ b/idr_gallery/templates/idr_gallery/image.html
@@ -16,6 +16,9 @@
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
border: solid 1px lightgrey;
}
+ .download_list li {
+ word-break: break-word;
+ }
a.file_download {
color: #03A9F4;
text-decoration: none;
diff --git a/idr_gallery/templates/idr_gallery/index.html b/idr_gallery/templates/idr_gallery/index.html
index 969e7200..d3fa463a 100644
--- a/idr_gallery/templates/idr_gallery/index.html
+++ b/idr_gallery/templates/idr_gallery/index.html
@@ -464,7 +464,20 @@