feat(annotation): add annotation ID and make properties selectable (#530

)
google · Feb 24, 2024 · 4ad2a18 · 4ad2a18
1 parent 96a56a9
commit 4ad2a18
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 0 deletions.
diff --git a/src/ui/annotations.css b/src/ui/annotations.css
@@ -250,6 +250,7 @@ div.neuroglancer-annotation-details-description {
   flex-direction: row;
   font-family: sans-serif;
   font-size: small;
+  user-select: text;
 }
 
 .neuroglancer-annotation-property-label {

diff --git a/src/ui/annotations.ts b/src/ui/annotations.ts
@@ -1851,6 +1851,23 @@ export function UserLayerWithAnnotationsMixin<
                 const { relationships, properties } = annotationLayer.source;
                 const sourceReadonly = annotationLayer.source.readonly;
 
+                // Add the ID to the annotation details.
+                const label = document.createElement("label");
+                label.classList.add("neuroglancer-annotation-property");
+                const idElement = document.createElement("span");
+                idElement.classList.add(
+                  "neuroglancer-annotation-property-label",
+                );
+                idElement.textContent = "ID";
+                label.appendChild(idElement);
+                const valueElement = document.createElement("span");
+                valueElement.classList.add(
+                  "neuroglancer-annotation-property-value",
+                );
+                valueElement.textContent = reference.id;
+                label.appendChild(valueElement);
+                parent.appendChild(label);
+
                 for (let i = 0, count = properties.length; i < count; ++i) {
                   const property = properties[i];
                   const label = document.createElement("label");