Skip to content

Commit

Permalink
fixed formatting for ui/annotations
Browse files Browse the repository at this point in the history
  • Loading branch information
@chrisj
chrisj committed Nov 22, 2023
1 parent 582cb06 commit 6d31e16
Showing 1 changed file with 112 additions and 109 deletions.
221 changes: 112 additions & 109 deletions src/neuroglancer/ui/annotations.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -433,7 +433,7 @@ export class AnnotationLayerView extends Tab {
if (selectionState === undefined) return;
const element = this.getRenderedAnnotationListElement(
selectionState.annotationLayerState, selectionState.annotationId,
/*scrollIntoView=*/selectionState.pin);
/*scrollIntoView=*/ selectionState.pin);
if (element !== undefined) {
element.classList.add('neuroglancer-annotation-selected');
}
Expand Down Expand Up @@ -464,7 +464,8 @@ export class AnnotationLayerView extends Tab {
private render(index: number) {
const {annotation, state} = this.listElements[index];
const {layer, gridTemplate, globalDimensionIndices, localDimensionIndices} = this;
const [element, elementColumnWidths] = makeAnnotationListElement(layer, annotation, state, gridTemplate, globalDimensionIndices, localDimensionIndices);
const [element, elementColumnWidths] = makeAnnotationListElement(
layer, annotation, state, gridTemplate, globalDimensionIndices, localDimensionIndices);
for (const [column, width] of elementColumnWidths.entries()) {
this.setColumnWidth(column, width);
}
Expand Down Expand Up @@ -691,7 +692,8 @@ function getSelectedAssociatedSegments(annotationLayer: AnnotationLayerState, ge
if (segmentationState.segmentSelectionState.hasSelectedSegment) {
segments[i] = [segmentationState.segmentSelectionState.selectedSegment.clone()];
if (getBase) {
segments[i] = [...segments[i], segmentationState.segmentSelectionState.baseSelectedSegment.clone()];
segments[i] =
[...segments[i], segmentationState.segmentSelectionState.baseSelectedSegment.clone()];
}
continue;
}
Expand Down Expand Up @@ -739,7 +741,7 @@ export class PlacePointTool extends PlaceAnnotationTool {
type: AnnotationType.POINT,
properties: annotationLayer.source.properties.map(x => x.default),
};
const reference = annotationLayer.source.add(annotation, /*commit=*/true);
const reference = annotationLayer.source.add(annotation, /*commit=*/ true);
this.layer.selectAnnotation(annotationLayer, reference.id, true);
reference.dispose();
}
Expand Down Expand Up @@ -801,7 +803,7 @@ abstract class TwoStepAnnotationTool extends PlaceAnnotationTool {

if (inProgressAnnotation.value === undefined) {
const reference = annotationLayer.source.add(
this.getInitialAnnotation(mouseState, annotationLayer), /*commit=*/false);
this.getInitialAnnotation(mouseState, annotationLayer), /*commit=*/ false);
this.layer.selectAnnotation(annotationLayer, reference.id, true);
const mouseDisposer = mouseState.changed.add(updatePointB);
const disposer = () => {
Expand Down Expand Up @@ -1233,7 +1235,7 @@ export function UserLayerWithAnnotationsMixin<TBase extends {new (...args: any[]
state.annotationId = mouseState.pickedAnnotationId;
state.annotationType = mouseState.pickedAnnotationType;
state.annotationBuffer = new Uint8Array(
mouseState.pickedAnnotationBuffer!, mouseState.pickedAnnotationBufferBaseOffset!);
mouseState.pickedAnnotationBuffer!, mouseState.pickedAnnotationBufferBaseOffset!);
state.annotationIndex = mouseState.pickedAnnotationIndex!;
state.annotationCount = mouseState.pickedAnnotationCount!;
state.annotationPartIndex = mouseState.pickedOffset;
Expand All @@ -1246,7 +1248,7 @@ export function UserLayerWithAnnotationsMixin<TBase extends {new (...args: any[]
if (state.annotationId === undefined) return false;
const annotationLayer = this.annotationStates.states.find(
x => x.sourceIndex === state.annotationSourceIndex &&
x.subsubsourceId === state.annotationSubsubsourceId &&
x.subsubsourceId === state.annotationSubsubsourceId &&
(state.annotationSubsource === undefined ||
x.subsourceId === state.annotationSubsource));
if (annotationLayer === undefined) return false;
Expand All @@ -1273,7 +1275,7 @@ export function UserLayerWithAnnotationsMixin<TBase extends {new (...args: any[]
const isLittleEndian = Endianness.LITTLE === ENDIANNESS;
const {properties} = annotationLayer.source;
const annotationPropertySerializer =
new AnnotationPropertySerializer(rank, numGeometryBytes, properties);
new AnnotationPropertySerializer(rank, numGeometryBytes, properties);
const annotationIndex = state.annotationIndex!;
const annotationCount = state.annotationCount!;
annotation = handler.deserialize(
Expand Down Expand Up @@ -1576,106 +1578,107 @@ export function UserLayerWithAnnotationsMixin<TBase extends {new (...args: any[]
export type UserLayerWithAnnotations =
InstanceType<ReturnType<typeof UserLayerWithAnnotationsMixin>>;

export function makeAnnotationListElement(layer: UserLayerWithAnnotations, annotation: Annotation, state: AnnotationLayerState, gridTemplate: string, globalDimensionIndices: number[], localDimensionIndices: number[]): [HTMLDivElement, number[]] {
const chunkTransform = state.chunkTransform.value as ChunkTransformParameters;
const element = document.createElement('div');
element.classList.add('neuroglancer-annotation-list-entry');
element.dataset.color = state.displayState.color.toString();
element.style.gridTemplateColumns = gridTemplate;
const icon = document.createElement('div');
icon.className = 'neuroglancer-annotation-icon';
icon.textContent = annotationTypeHandlers[annotation.type].icon;
element.appendChild(icon);

let deleteButton: HTMLElement|undefined;

const maybeAddDeleteButton = () => {
if (state.source.readonly) return;
if (deleteButton !== undefined) return;
deleteButton = makeDeleteButton({
title: 'Delete annotation',
onClick: event => {
event.stopPropagation();
event.preventDefault();
const ref = state.source.getReference(annotation.id);
try {
state.source.delete(ref);
} finally {
ref.dispose();
}
},
});
deleteButton.classList.add('neuroglancer-annotation-list-entry-delete');
element.appendChild(deleteButton);
};

const columnWidths: number[] = [];

let numRows = 0;
visitTransformedAnnotationGeometry(annotation, chunkTransform, (layerPosition, isVector) => {
isVector;
++numRows;
const position = document.createElement('div');
position.className = 'neuroglancer-annotation-position';
element.appendChild(position);
let i = 0;
export function makeAnnotationListElement(
layer: UserLayerWithAnnotations, annotation: Annotation, state: AnnotationLayerState,
gridTemplate: string, globalDimensionIndices: number[],
localDimensionIndices: number[]): [HTMLDivElement, number[]] {
const chunkTransform = state.chunkTransform.value as ChunkTransformParameters;
const element = document.createElement('div');
element.classList.add('neuroglancer-annotation-list-entry');
element.dataset.color = state.displayState.color.toString();
element.style.gridTemplateColumns = gridTemplate;
const icon = document.createElement('div');
icon.className = 'neuroglancer-annotation-icon';
icon.textContent = annotationTypeHandlers[annotation.type].icon;
element.appendChild(icon);

let deleteButton: HTMLElement|undefined;

const maybeAddDeleteButton = () => {
if (state.source.readonly) return;
if (deleteButton !== undefined) return;
deleteButton = makeDeleteButton({
title: 'Delete annotation',
onClick: event => {
event.stopPropagation();
event.preventDefault();
const ref = state.source.getReference(annotation.id);
try {
state.source.delete(ref);
} finally {
ref.dispose();
}
},
});
deleteButton.classList.add('neuroglancer-annotation-list-entry-delete');
element.appendChild(deleteButton);
};

const addDims =
(viewDimensionIndices: readonly number[], layerDimensionIndices: readonly number[]) => {
for (const viewDim of viewDimensionIndices) {
const layerDim = layerDimensionIndices[viewDim];
if (layerDim !== -1) {
const coord = Math.floor(layerPosition[layerDim]);
const coordElement = document.createElement('div');
const text = coord.toString();
coordElement.textContent = text;
coordElement.classList.add('neuroglancer-annotation-coordinate');
coordElement.style.gridColumn = `dim ${i + 1}`;
columnWidths[i] = Math.max(columnWidths[i] || 0, text.length);
position.appendChild(coordElement);
}
++i;
const columnWidths: number[] = [];

let numRows = 0;
visitTransformedAnnotationGeometry(annotation, chunkTransform, (layerPosition, isVector) => {
isVector;
++numRows;
const position = document.createElement('div');
position.className = 'neuroglancer-annotation-position';
element.appendChild(position);
let i = 0;

const addDims =
(viewDimensionIndices: readonly number[], layerDimensionIndices: readonly number[]) => {
for (const viewDim of viewDimensionIndices) {
const layerDim = layerDimensionIndices[viewDim];
if (layerDim !== -1) {
const coord = Math.floor(layerPosition[layerDim]);
const coordElement = document.createElement('div');
const text = coord.toString();
coordElement.textContent = text;
coordElement.classList.add('neuroglancer-annotation-coordinate');
coordElement.style.gridColumn = `dim ${i + 1}`;
columnWidths[i] = Math.max(columnWidths[i] || 0, text.length);
position.appendChild(coordElement);
}
};
addDims(
globalDimensionIndices, chunkTransform.modelTransform.globalToRenderLayerDimensions);
addDims(
localDimensionIndices, chunkTransform.modelTransform.localToRenderLayerDimensions);
maybeAddDeleteButton();
});
if (annotation.description) {
++numRows;
const description = document.createElement('div');
description.classList.add('neuroglancer-annotation-description');
description.textContent = annotation.description;
element.appendChild(description);
}
icon.style.gridRow = `span ${numRows}`;
if (deleteButton !== undefined) {
deleteButton.style.gridRow = `span ${numRows}`;
}
element.addEventListener('mouseenter', () => {
layer.selectAnnotation(state, annotation.id, false);
});
element.addEventListener('action:select-position', event => {
event.stopPropagation();
layer.selectAnnotation(state, annotation.id, 'toggle');
});
element.addEventListener('action:pin-annotation', event => {
event.stopPropagation();
layer.selectAnnotation(state, annotation.id, true);
});
element.addEventListener('action:move-to-annotation', event => {
event.stopPropagation();
event.preventDefault();
const {layerRank} = chunkTransform;
const chunkPosition = new Float32Array(layerRank);
const layerPosition = new Float32Array(layerRank);
getCenterPosition(chunkPosition, annotation);
matrix.transformPoint(
layerPosition, chunkTransform.chunkToLayerTransform, layerRank + 1, chunkPosition,
layerRank);
setLayerPosition(layer, chunkTransform, layerPosition);
});
return [element, columnWidths];
}
++i;
}
};
addDims(globalDimensionIndices, chunkTransform.modelTransform.globalToRenderLayerDimensions);
addDims(localDimensionIndices, chunkTransform.modelTransform.localToRenderLayerDimensions);
maybeAddDeleteButton();
});
if (annotation.description) {
++numRows;
const description = document.createElement('div');
description.classList.add('neuroglancer-annotation-description');
description.textContent = annotation.description;
element.appendChild(description);
}
icon.style.gridRow = `span ${numRows}`;
if (deleteButton !== undefined) {
deleteButton.style.gridRow = `span ${numRows}`;
}
element.addEventListener('mouseenter', () => {
layer.selectAnnotation(state, annotation.id, false);
});
element.addEventListener('action:select-position', event => {
event.stopPropagation();
layer.selectAnnotation(state, annotation.id, 'toggle');
});
element.addEventListener('action:pin-annotation', event => {
event.stopPropagation();
layer.selectAnnotation(state, annotation.id, true);
});
element.addEventListener('action:move-to-annotation', event => {
event.stopPropagation();
event.preventDefault();
const {layerRank} = chunkTransform;
const chunkPosition = new Float32Array(layerRank);
const layerPosition = new Float32Array(layerRank);
getCenterPosition(chunkPosition, annotation);
matrix.transformPoint(
layerPosition, chunkTransform.chunkToLayerTransform, layerRank + 1, chunkPosition,
layerRank);
setLayerPosition(layer, chunkTransform, layerPosition);
});
return [element, columnWidths];
}

0 comments on commit 6d31e16

Please sign in to comment.