clean up iterating (no longer requires tab)

seung-lab · Aug 29, 2024 · 1cfa33f · 1cfa33f
1 parent fe7b96d
commit 1cfa33f
Show file tree

Hide file tree

Showing 2 changed files with 57 additions and 48 deletions.
diff --git a/src/ui/annotations.ts b/src/ui/annotations.ts
@@ -476,31 +476,6 @@ export class AnnotationLayerView extends Tab {
     this.virtualList.element.addEventListener("mouseleave", () => {
       this.displayState.hoverState.value = undefined;
     });
-    const changeSelectedIndex = (offset: number) => {
-      const selectedIndex = this.getSelectedAnnotationIndex();
-      if (selectedIndex === undefined) return;
-      const nextAnnotation = this.listElements[selectedIndex + offset];
-      if (nextAnnotation) {
-        const { state, annotation } = nextAnnotation;
-        this.layer.selectAnnotation(state, annotation.id, true);
-        moveToAnnotation(this.layer, annotation, state);
-      }
-    };
-    this.registerDisposer(
-      this.layer.registerLayerEvent("select-previous", () => {
-        // if (this.layer.panels.panels[0].selectedTab.value === "annotations") {
-        if (this.element.checkVisibility()) {
-          changeSelectedIndex(-1);
-        }
-      }),
-    );
-    this.registerDisposer(
-      this.layer.registerLayerEvent("select-next", () => {
-        if (this.element.checkVisibility()) {
-          changeSelectedIndex(1);
-        }
-      }),
-    );
     const bindings = getDefaultAnnotationListBindings();
     this.registerDisposer(
       new MouseEventBinder(this.virtualList.element, bindings),
@@ -531,17 +506,6 @@ export class AnnotationLayerView extends Tab {
     this.updateSelectionView();
   }
 
-  private getSelectedAnnotationIndex() {
-    const { previousSelectedState: state } = this;
-    if (state === undefined) return;
-    const { annotationLayerState, annotationId } = state;
-    const attached = this.attachedAnnotationStates.get(annotationLayerState);
-    if (attached === undefined) return;
-    const index = attached.idToIndex.get(annotationId);
-    if (index === undefined) return;
-    return attached.listOffset + index;
-  }
-
   private getRenderedAnnotationListElement(
     state: AnnotationLayerState,
     id: AnnotationId,
@@ -1601,6 +1565,16 @@ export function UserLayerWithAnnotationsMixin<
           this.annotationDisplayState.hoverState.value = undefined;
         }),
       );
+      this.registerDisposer(
+        this.registerLayerEvent("select-previous", () => {
+          this.changeSelectedIndex(-1);
+        }),
+      );
+      this.registerDisposer(
+        this.registerLayerEvent("select-next", () => {
+          this.changeSelectedIndex(1);
+        }),
+      );
     }
 
     initializeAnnotationLayerViewTab(tab: AnnotationLayerView) {
@@ -2129,6 +2103,50 @@ export function UserLayerWithAnnotationsMixin<
       );
     }
 
+    changeSelectedIndex = (offset: number) => {
+      const selectionState = this.manager.root.selectionState.value;
+      if (selectionState === undefined) return;
+      const layerSelectionState = selectionState.layers.find(
+        (s) => s.layer === this,
+      )?.state;
+      if (layerSelectionState === undefined) return;
+      const { annotationId } = layerSelectionState;
+      if (annotationId === undefined) return;
+      let annotationLayerState = this.annotationStates.states.find(
+        (x) =>
+          x.sourceIndex === layerSelectionState.annotationSourceIndex &&
+          (layerSelectionState.annotationSubsource === undefined ||
+            x.subsourceId === layerSelectionState.annotationSubsource),
+      );
+      if (annotationLayerState === undefined) return;
+      let annotationLayerStateIndex =
+        this.annotationStates.states.indexOf(annotationLayerState);
+      let { source } = annotationLayerState;
+      let annotations = Array.from(source);
+      let index = annotations.findIndex((x) => x.id === annotationId);
+      while (true) {
+        index = index + offset;
+        if (index === -1) {
+          // this only happens if offset is negative
+          annotationLayerStateIndex -= 1;
+        } else if (index === annotations.length) {
+          // this only happens if offset is positive
+          annotationLayerStateIndex += 1;
+        } else {
+          const annotation = annotations[index];
+          this.selectAnnotation(annotationLayerState, annotation.id, true);
+          moveToAnnotation(this, annotation, annotationLayerState);
+          return;
+        }
+        annotationLayerState =
+          this.annotationStates.states[annotationLayerStateIndex];
+        if (annotationLayerState === undefined) return;
+        source = annotationLayerState.source;
+        annotations = Array.from(source);
+        index = index === -1 ? annotations.length : 0;
+      }
+    };
+
     toJSON() {
       const x = super.toJSON();
       x[ANNOTATION_COLOR_JSON_KEY] = this.annotationDisplayState.color.toJSON();

diff --git a/src/viewer.ts b/src/viewer.ts
@@ -1028,28 +1028,19 @@ export class Viewer extends RefCounted implements ViewerState {
       });
     }
 
-    const sendEventToSelectedLayerTab = (type: string) => {
-      const elements = document.querySelectorAll(
-        '[data-neuroglancer-layer-panel-pinned="false"] .neuroglancer-stack-view > .neuroglancer-tab-content:not([style*="display: none"]):not([style*="display: none"]) > *',
-      );
-      for (const element of elements) {
-        const event = new Event(type);
-        console.log("sending", type, "to", element);
-        element.dispatchEvent(event);
-      }
-
+    const sendEventToSelectedLayer = (type: string) => {
       const selectedLayer = this.selectedLayer.layer?.layer;
       if (selectedLayer) {
         selectedLayer.dispatchLayerEvent(type);
       }
     };
 
     this.bindAction("select-previous", () => {
-      sendEventToSelectedLayerTab("select-previous");
+      sendEventToSelectedLayer("select-previous");
     });
 
     this.bindAction("select-next", () => {
-      sendEventToSelectedLayerTab("select-next");
+      sendEventToSelectedLayer("select-next");
     });
 
     for (const action of ["select", "star"]) {