@vitessce/neuroglancer 3.9.5 → 4.0.0-test.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{ReactNeuroglancer-BCg93QGV.js → ReactNeuroglancer-Bg6f79hO.js} +193 -200
- package/dist/{index-Wdrc02VW.js → index-DZhbMDug.js} +8585 -5911
- package/dist/index.js +1 -1
- package/dist-tsc/Neuroglancer.d.ts +1 -3
- package/dist-tsc/Neuroglancer.d.ts.map +1 -1
- package/dist-tsc/Neuroglancer.js +4 -26
- package/dist-tsc/NeuroglancerSubscriber.d.ts +1 -1
- package/dist-tsc/NeuroglancerSubscriber.d.ts.map +1 -1
- package/dist-tsc/NeuroglancerSubscriber.js +185 -43
- package/dist-tsc/ReactNeuroglancer.d.ts +1 -1
- package/dist-tsc/ReactNeuroglancer.d.ts.map +1 -1
- package/dist-tsc/data-hook-ng-utils.d.ts +18 -20
- package/dist-tsc/data-hook-ng-utils.d.ts.map +1 -1
- package/dist-tsc/data-hook-ng-utils.js +136 -68
- package/dist-tsc/shader-utils.d.ts +126 -0
- package/dist-tsc/shader-utils.d.ts.map +1 -0
- package/dist-tsc/shader-utils.js +547 -0
- package/dist-tsc/shader-utils.test.d.ts +2 -0
- package/dist-tsc/shader-utils.test.d.ts.map +1 -0
- package/dist-tsc/shader-utils.test.js +364 -0
- package/dist-tsc/use-memo-custom-comparison.d.ts +14 -0
- package/dist-tsc/use-memo-custom-comparison.d.ts.map +1 -0
- package/dist-tsc/use-memo-custom-comparison.js +149 -0
- package/package.json +20 -11
- package/src/Neuroglancer.js +7 -26
- package/src/NeuroglancerSubscriber.js +325 -69
- package/src/README.md +28 -0
- package/src/data-hook-ng-utils.js +178 -78
- package/src/shader-utils.js +653 -0
- package/src/shader-utils.test.js +432 -0
- package/src/use-memo-custom-comparison.js +189 -0
- package/dist-tsc/data-hook-ng-utils.test.d.ts +0 -2
- package/dist-tsc/data-hook-ng-utils.test.d.ts.map +0 -1
- package/dist-tsc/data-hook-ng-utils.test.js +0 -35
- package/src/data-hook-ng-utils.test.js +0 -52
|
@@ -1,8 +1,5 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
|
-
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
4
1
|
import React__default from "react";
|
|
5
|
-
import { g as getDefaultExportFromCjs, c as commonjsGlobal, d as diffCameraState } from "./index-
|
|
2
|
+
import { g as getDefaultExportFromCjs, c as commonjsGlobal, d as diffCameraState } from "./index-DZhbMDug.js";
|
|
6
3
|
var es6_object_assign = {};
|
|
7
4
|
var _global = { exports: {} };
|
|
8
5
|
var hasRequired_global;
|
|
@@ -4867,7 +4864,7 @@ function nextAfterFloat64(x, y) {
|
|
|
4867
4864
|
if (isNaN(x) || isNaN(y)) return NaN;
|
|
4868
4865
|
if (x === y) return y;
|
|
4869
4866
|
if (x === 0) {
|
|
4870
|
-
return y < 0 ? -
|
|
4867
|
+
return y < 0 ? -denormMin : denormMin;
|
|
4871
4868
|
}
|
|
4872
4869
|
float64Buf[0] = x;
|
|
4873
4870
|
const lowIndex = ENDIANNESS === Endianness.LITTLE ? 0 : 1;
|
|
@@ -11307,7 +11304,7 @@ function shaderCodeWithLineDirective(code, sourceStringNumber = 1, line = 0) {
|
|
|
11307
11304
|
* See the License for the specific language governing permissions and
|
|
11308
11305
|
* limitations under the License.
|
|
11309
11306
|
*/
|
|
11310
|
-
class
|
|
11307
|
+
class Buffer {
|
|
11311
11308
|
constructor(gl, bufferType = WebGL2RenderingContext.ARRAY_BUFFER) {
|
|
11312
11309
|
this.gl = gl;
|
|
11313
11310
|
this.bufferType = bufferType;
|
|
@@ -11338,14 +11335,14 @@ class Buffer2 {
|
|
|
11338
11335
|
this.gl = void 0;
|
|
11339
11336
|
}
|
|
11340
11337
|
static fromData(gl, data, bufferType, usage) {
|
|
11341
|
-
let buffer = new
|
|
11338
|
+
let buffer = new Buffer(gl, bufferType);
|
|
11342
11339
|
buffer.setData(data, usage);
|
|
11343
11340
|
return buffer;
|
|
11344
11341
|
}
|
|
11345
11342
|
}
|
|
11346
11343
|
function getMemoizedBuffer(gl, bufferType, getter, ...args) {
|
|
11347
11344
|
return gl.memoize.get(stableStringify({ id: "getMemoizedBuffer", getter: getObjectId(getter), args }), () => {
|
|
11348
|
-
const result = new RefCountedValue(
|
|
11345
|
+
const result = new RefCountedValue(Buffer.fromData(gl, getter(...args), bufferType, WebGL2RenderingContext.STATIC_DRAW));
|
|
11349
11346
|
result.registerDisposer(result.value);
|
|
11350
11347
|
return result;
|
|
11351
11348
|
});
|
|
@@ -22412,9 +22409,9 @@ var __decorate$5 = function(decorators, target, key, desc) {
|
|
|
22412
22409
|
const tempMat4$5 = create$4();
|
|
22413
22410
|
const tempMat3$1 = create$5();
|
|
22414
22411
|
function copyMeshDataToGpu(gl, chunk) {
|
|
22415
|
-
chunk.vertexBuffer =
|
|
22416
|
-
chunk.indexBuffer =
|
|
22417
|
-
chunk.normalBuffer =
|
|
22412
|
+
chunk.vertexBuffer = Buffer.fromData(gl, chunk.meshData.vertexPositions, gl.ARRAY_BUFFER, gl.STATIC_DRAW);
|
|
22413
|
+
chunk.indexBuffer = Buffer.fromData(gl, chunk.meshData.indices, gl.ELEMENT_ARRAY_BUFFER, gl.STATIC_DRAW);
|
|
22414
|
+
chunk.normalBuffer = Buffer.fromData(gl, chunk.meshData.vertexNormals, gl.ARRAY_BUFFER, gl.STATIC_DRAW);
|
|
22418
22415
|
}
|
|
22419
22416
|
function freeGpuMeshData(chunk) {
|
|
22420
22417
|
chunk.vertexBuffer.dispose();
|
|
@@ -23364,7 +23361,7 @@ int getVertexId () {
|
|
|
23364
23361
|
class VertexIdHelper extends RefCounted {
|
|
23365
23362
|
constructor(gl) {
|
|
23366
23363
|
super();
|
|
23367
|
-
this.buffer = new
|
|
23364
|
+
this.buffer = new Buffer(gl);
|
|
23368
23365
|
this.size = 0;
|
|
23369
23366
|
}
|
|
23370
23367
|
disposed() {
|
|
@@ -23841,7 +23838,7 @@ class SkeletonChunk extends Chunk {
|
|
|
23841
23838
|
vertexAttributeTextures[i] = texture;
|
|
23842
23839
|
}
|
|
23843
23840
|
gl.bindTexture(WebGL2RenderingContext.TEXTURE_2D, null);
|
|
23844
|
-
this.indexBuffer =
|
|
23841
|
+
this.indexBuffer = Buffer.fromData(gl, this.indices, WebGL2RenderingContext.ARRAY_BUFFER, WebGL2RenderingContext.STATIC_DRAW);
|
|
23845
23842
|
}
|
|
23846
23843
|
freeGPUMemory(gl) {
|
|
23847
23844
|
super.freeGPUMemory(gl);
|
|
@@ -27535,9 +27532,9 @@ class AxesLineHelper extends RefCounted {
|
|
|
27535
27532
|
constructor(gl) {
|
|
27536
27533
|
super();
|
|
27537
27534
|
this.gl = gl;
|
|
27538
|
-
this.vertexBuffer = this.registerDisposer(
|
|
27535
|
+
this.vertexBuffer = this.registerDisposer(Buffer.fromData(gl, new Float32Array([0, 0, 0, 1, 1, 0, 0, 1, 0, 0, 0, 1, 0, 1, 0, 1, 0, 0, 0, 1, 0, 0, 1, 1]), gl.ARRAY_BUFFER, gl.STATIC_DRAW));
|
|
27539
27536
|
let alpha = 0.5;
|
|
27540
|
-
this.colorBuffer = this.registerDisposer(
|
|
27537
|
+
this.colorBuffer = this.registerDisposer(Buffer.fromData(gl, new Float32Array([1, 0, 0, alpha, 1, 0, 0, alpha, 0, 1, 0, alpha, 0, 1, 0, alpha, 0, 0, 1, alpha, 0, 0, 1, alpha]), gl.ARRAY_BUFFER, gl.STATIC_DRAW));
|
|
27541
27538
|
this.trivialColorShader = this.registerDisposer(trivialColorShader(gl));
|
|
27542
27539
|
}
|
|
27543
27540
|
static get(gl) {
|
|
@@ -51921,7 +51918,7 @@ void setBoundingBoxFillColor(vec4 color) {
|
|
|
51921
51918
|
class PerspectiveViewRenderHelper extends RenderHelper$4 {
|
|
51922
51919
|
constructor() {
|
|
51923
51920
|
super(...arguments);
|
|
51924
|
-
this.edgeBoxCornerOffsetsBuffer = this.registerDisposer(
|
|
51921
|
+
this.edgeBoxCornerOffsetsBuffer = this.registerDisposer(Buffer.fromData(this.gl, tile2dArray(
|
|
51925
51922
|
edgeBoxCornerOffsetData,
|
|
51926
51923
|
/*majorDimension=*/
|
|
51927
51924
|
7,
|
|
@@ -51961,7 +51958,7 @@ ${this.setPartIndex(builder, "uint(aBoxCornerOffset2.w)")};
|
|
|
51961
51958
|
emitAnnotation(vec4(vColor.rgb, getLineAlpha() * vClipCoefficient));
|
|
51962
51959
|
`);
|
|
51963
51960
|
});
|
|
51964
|
-
this.boxCornerOffsetsBuffer = this.registerDisposer(
|
|
51961
|
+
this.boxCornerOffsetsBuffer = this.registerDisposer(Buffer.fromData(this.gl, tile2dArray(
|
|
51965
51962
|
vertexBasePositions,
|
|
51966
51963
|
/*majorDimension=*/
|
|
51967
51964
|
3,
|
|
@@ -53457,7 +53454,7 @@ class AnnotationLayer extends RefCounted {
|
|
|
53457
53454
|
if (this.generation !== generation) {
|
|
53458
53455
|
let buffer = this.buffer;
|
|
53459
53456
|
if (buffer === void 0) {
|
|
53460
|
-
buffer = this.buffer = this.registerDisposer(new
|
|
53457
|
+
buffer = this.buffer = this.registerDisposer(new Buffer(this.chunkManager.gl));
|
|
53461
53458
|
}
|
|
53462
53459
|
this.generation = generation;
|
|
53463
53460
|
const serializedAnnotations = this.serializedAnnotations = serializeAnnotationSet(source, segmentationFilter(this.segmentationStates.value));
|
|
@@ -53584,7 +53581,7 @@ function AnnotationRenderLayer(Base2, renderHelperType) {
|
|
|
53584
53581
|
if (!chunk.bufferValid) {
|
|
53585
53582
|
let buffer = chunk.buffer;
|
|
53586
53583
|
if (buffer === void 0) {
|
|
53587
|
-
buffer = chunk.buffer = new
|
|
53584
|
+
buffer = chunk.buffer = new Buffer(this.gl);
|
|
53588
53585
|
}
|
|
53589
53586
|
const serializedAnnotations = chunk.serializedAnnotations;
|
|
53590
53587
|
buffer.setData(serializedAnnotations.data);
|
|
@@ -66830,173 +66827,21 @@ function getSelectedAnnotationId(key, layerName) {
|
|
|
66830
66827
|
return null;
|
|
66831
66828
|
}
|
|
66832
66829
|
class Neuroglancer extends React__default.Component {
|
|
66830
|
+
static defaultProps = {
|
|
66831
|
+
perspectiveZoom: 20,
|
|
66832
|
+
eventBindingsToUpdate: null,
|
|
66833
|
+
brainMapsClientId: "NOT_A_VALID_ID",
|
|
66834
|
+
viewerState: null,
|
|
66835
|
+
onSelectedChanged: null,
|
|
66836
|
+
onVisibleChanged: null,
|
|
66837
|
+
onSelectionDetailsStateChanged: null,
|
|
66838
|
+
onViewerStateChanged: null,
|
|
66839
|
+
key: null,
|
|
66840
|
+
callbacks: [],
|
|
66841
|
+
ngServer: "https://neuroglancer-demo.appspot.com/"
|
|
66842
|
+
};
|
|
66833
66843
|
constructor(props) {
|
|
66834
66844
|
super(props);
|
|
66835
|
-
__publicField(this, "minimalPoseSnapshot", () => {
|
|
66836
|
-
var _a, _b;
|
|
66837
|
-
const v = this.viewer;
|
|
66838
|
-
const projScale = (_a = v.projectionScale) == null ? void 0 : _a.value;
|
|
66839
|
-
const projQuat = (_b = v.projectionOrientation) == null ? void 0 : _b.orientation;
|
|
66840
|
-
return {
|
|
66841
|
-
position: Array.from(v.position.value || []),
|
|
66842
|
-
projectionScale: projScale,
|
|
66843
|
-
projectionOrientation: Array.from(projQuat || [])
|
|
66844
|
-
};
|
|
66845
|
-
});
|
|
66846
|
-
// Coalesce many NG changes → one upstream update per frame.
|
|
66847
|
-
__publicField(this, "scheduleEmit", () => {
|
|
66848
|
-
let raf = null;
|
|
66849
|
-
return () => {
|
|
66850
|
-
if (this.muteViewerChanged) return;
|
|
66851
|
-
if (raf !== null) return;
|
|
66852
|
-
raf = requestAnimationFrame(() => {
|
|
66853
|
-
var _a, _b;
|
|
66854
|
-
raf = null;
|
|
66855
|
-
(_b = (_a = this.props).onViewerStateChanged) == null ? void 0 : _b.call(_a, this.minimalPoseSnapshot());
|
|
66856
|
-
});
|
|
66857
|
-
};
|
|
66858
|
-
});
|
|
66859
|
-
// Guard to mute outgoing emits we are programmatically making changes
|
|
66860
|
-
__publicField(this, "withoutEmitting", (fn) => {
|
|
66861
|
-
this.muteViewerChanged = true;
|
|
66862
|
-
try {
|
|
66863
|
-
fn();
|
|
66864
|
-
} finally {
|
|
66865
|
-
requestAnimationFrame(() => {
|
|
66866
|
-
this.muteViewerChanged = false;
|
|
66867
|
-
});
|
|
66868
|
-
}
|
|
66869
|
-
});
|
|
66870
|
-
// Only consider actual changes in camera settings, i.e., position/rotation/zoom
|
|
66871
|
-
__publicField(this, "didLayersChange", (prevVS, nextVS) => {
|
|
66872
|
-
const stripColors = (layers) => (layers || []).map((l) => {
|
|
66873
|
-
if (!l) return l;
|
|
66874
|
-
const { segmentColors, ...rest } = l;
|
|
66875
|
-
return rest;
|
|
66876
|
-
});
|
|
66877
|
-
const prevLayers = stripColors(prevVS == null ? void 0 : prevVS.layers);
|
|
66878
|
-
const nextLayers = stripColors(nextVS == null ? void 0 : nextVS.layers);
|
|
66879
|
-
return JSON.stringify(prevLayers) !== JSON.stringify(nextLayers);
|
|
66880
|
-
});
|
|
66881
|
-
/* To add colors to the segments, turning unselected to grey */
|
|
66882
|
-
__publicField(this, "applyColorsAndVisibility", (cellColorMapping) => {
|
|
66883
|
-
var _a, _b, _c, _d;
|
|
66884
|
-
if (!this.viewer) return;
|
|
66885
|
-
const selected = { ...cellColorMapping || {} };
|
|
66886
|
-
for (const id of Object.keys(selected)) this.allKnownIds.add(id);
|
|
66887
|
-
if (this.allKnownIds.size === 0) {
|
|
66888
|
-
const init = ((_c = (_b = (_a = this.props.viewerState) == null ? void 0 : _a.layers) == null ? void 0 : _b[0]) == null ? void 0 : _c.segmentColors) || {};
|
|
66889
|
-
for (const id of Object.keys(init)) this.allKnownIds.add(id);
|
|
66890
|
-
}
|
|
66891
|
-
const fullSegmentColors = {};
|
|
66892
|
-
for (const id of this.allKnownIds) {
|
|
66893
|
-
fullSegmentColors[id] = selected[id] || GREY_HEX;
|
|
66894
|
-
}
|
|
66895
|
-
const baseLayers = ((_d = this.props.viewerState) == null ? void 0 : _d.layers) ?? (this.viewer.state.toJSON().layers || []);
|
|
66896
|
-
const newLayers = baseLayers.map((layer, idx) => {
|
|
66897
|
-
if (idx === 0 || (layer == null ? void 0 : layer.type) === "segmentation") {
|
|
66898
|
-
return { ...layer, segmentColors: fullSegmentColors };
|
|
66899
|
-
}
|
|
66900
|
-
return layer;
|
|
66901
|
-
});
|
|
66902
|
-
this.withoutEmitting(() => {
|
|
66903
|
-
this.viewer.state.restoreState({ layers: newLayers });
|
|
66904
|
-
});
|
|
66905
|
-
});
|
|
66906
|
-
__publicField(this, "updateEventBindings", (eventBindingsToUpdate) => {
|
|
66907
|
-
const root = this.viewer.inputEventBindings;
|
|
66908
|
-
const traverse = (current) => {
|
|
66909
|
-
const replace = (eaMap, event0, event1) => {
|
|
66910
|
-
const action = eaMap.get(event0);
|
|
66911
|
-
if (action) {
|
|
66912
|
-
eaMap.delete(event0);
|
|
66913
|
-
if (event1) {
|
|
66914
|
-
eaMap.set(event1, action);
|
|
66915
|
-
}
|
|
66916
|
-
}
|
|
66917
|
-
};
|
|
66918
|
-
const eventActionMap = current.bindings;
|
|
66919
|
-
eventBindingsToUpdate.forEach((oldNewBinding) => {
|
|
66920
|
-
const eventOldBase = Array.isArray(oldNewBinding) ? oldNewBinding[0] : oldNewBinding;
|
|
66921
|
-
const eventOldA = `at:${eventOldBase}`;
|
|
66922
|
-
const eventNewA = oldNewBinding[1] ? `at:${oldNewBinding[1]}` : void 0;
|
|
66923
|
-
replace(eventActionMap, eventOldA, eventNewA);
|
|
66924
|
-
const eventOldB = `bubble:${eventOldBase}`;
|
|
66925
|
-
const eventNewB = oldNewBinding[1] ? `bubble:${oldNewBinding[1]}` : void 0;
|
|
66926
|
-
replace(eventActionMap, eventOldB, eventNewB);
|
|
66927
|
-
});
|
|
66928
|
-
current.parents.forEach((parent) => {
|
|
66929
|
-
traverse(parent);
|
|
66930
|
-
});
|
|
66931
|
-
};
|
|
66932
|
-
traverse(root.global);
|
|
66933
|
-
traverse(root.perspectiveView);
|
|
66934
|
-
traverse(root.sliceView);
|
|
66935
|
-
});
|
|
66936
|
-
__publicField(this, "selectionDetailsStateChanged", () => {
|
|
66937
|
-
if (this.viewer) {
|
|
66938
|
-
const { onSelectionDetailsStateChanged } = this.props;
|
|
66939
|
-
if (onSelectionDetailsStateChanged) {
|
|
66940
|
-
onSelectionDetailsStateChanged();
|
|
66941
|
-
}
|
|
66942
|
-
}
|
|
66943
|
-
});
|
|
66944
|
-
__publicField(this, "layersChanged", () => {
|
|
66945
|
-
if (this.handlerRemovers) {
|
|
66946
|
-
this.handlerRemovers.forEach((remover) => remover());
|
|
66947
|
-
}
|
|
66948
|
-
if (this.viewer) {
|
|
66949
|
-
const { onSelectedChanged, onVisibleChanged } = this.props;
|
|
66950
|
-
if (onSelectedChanged || onVisibleChanged) {
|
|
66951
|
-
this.handlerRemovers = [];
|
|
66952
|
-
for (const layer of this.viewer.layerManager.managedLayers) {
|
|
66953
|
-
if (layer.layer instanceof SegmentationUserLayer) {
|
|
66954
|
-
const { segmentSelectionState } = layer.layer.displayState;
|
|
66955
|
-
const { visibleSegments } = layer.layer.displayState.segmentationGroupState.value;
|
|
66956
|
-
if (segmentSelectionState && onSelectedChanged) {
|
|
66957
|
-
const selectedChanged = this.selectedChanged.bind(
|
|
66958
|
-
void 0,
|
|
66959
|
-
layer
|
|
66960
|
-
);
|
|
66961
|
-
const remover = segmentSelectionState.changed.add(selectedChanged);
|
|
66962
|
-
this.handlerRemovers.push(remover);
|
|
66963
|
-
layer.registerDisposer(remover);
|
|
66964
|
-
}
|
|
66965
|
-
if (visibleSegments && onVisibleChanged) {
|
|
66966
|
-
const visibleChanged = this.visibleChanged.bind(void 0, layer);
|
|
66967
|
-
const remover = visibleSegments.changed.add(visibleChanged);
|
|
66968
|
-
this.handlerRemovers.push(remover);
|
|
66969
|
-
layer.registerDisposer(remover);
|
|
66970
|
-
}
|
|
66971
|
-
}
|
|
66972
|
-
}
|
|
66973
|
-
}
|
|
66974
|
-
}
|
|
66975
|
-
});
|
|
66976
|
-
/* ** Vitessce Integration update start ** */
|
|
66977
|
-
__publicField(this, "selectedChanged", (layer) => {
|
|
66978
|
-
if (!this.viewer) return;
|
|
66979
|
-
const { onSelectedChanged } = this.props;
|
|
66980
|
-
if (onSelectedChanged) {
|
|
66981
|
-
const { segmentSelectionState } = layer.layer.displayState;
|
|
66982
|
-
if (!segmentSelectionState) return;
|
|
66983
|
-
const selected = segmentSelectionState.selectedSegment;
|
|
66984
|
-
if (selected) {
|
|
66985
|
-
onSelectedChanged(selected, layer);
|
|
66986
|
-
}
|
|
66987
|
-
}
|
|
66988
|
-
});
|
|
66989
|
-
__publicField(this, "visibleChanged", (layer) => {
|
|
66990
|
-
if (this.viewer) {
|
|
66991
|
-
const { onVisibleChanged } = this.props;
|
|
66992
|
-
if (onVisibleChanged) {
|
|
66993
|
-
const { visibleSegments } = layer.layer.displayState.segmentationGroupState.value;
|
|
66994
|
-
if (visibleSegments) {
|
|
66995
|
-
onVisibleChanged(visibleSegments, layer);
|
|
66996
|
-
}
|
|
66997
|
-
}
|
|
66998
|
-
}
|
|
66999
|
-
});
|
|
67000
66845
|
this.ngContainer = React__default.createRef();
|
|
67001
66846
|
this.viewer = null;
|
|
67002
66847
|
this.muteViewerChanged = false;
|
|
@@ -67007,6 +66852,74 @@ class Neuroglancer extends React__default.Component {
|
|
|
67007
66852
|
this.overrideColorsById = /* @__PURE__ */ Object.create(null);
|
|
67008
66853
|
this.allKnownIds = /* @__PURE__ */ new Set();
|
|
67009
66854
|
}
|
|
66855
|
+
minimalPoseSnapshot = () => {
|
|
66856
|
+
const v = this.viewer;
|
|
66857
|
+
const projScale = v.projectionScale?.value;
|
|
66858
|
+
const projQuat = v.projectionOrientation?.orientation;
|
|
66859
|
+
return {
|
|
66860
|
+
position: Array.from(v.position.value || []),
|
|
66861
|
+
projectionScale: projScale,
|
|
66862
|
+
projectionOrientation: Array.from(projQuat || [])
|
|
66863
|
+
};
|
|
66864
|
+
};
|
|
66865
|
+
// Coalesce many NG changes → one upstream update per frame.
|
|
66866
|
+
scheduleEmit = () => {
|
|
66867
|
+
let raf = null;
|
|
66868
|
+
return () => {
|
|
66869
|
+
if (this.muteViewerChanged) return;
|
|
66870
|
+
if (raf !== null) return;
|
|
66871
|
+
raf = requestAnimationFrame(() => {
|
|
66872
|
+
raf = null;
|
|
66873
|
+
this.props.onViewerStateChanged?.(this.minimalPoseSnapshot());
|
|
66874
|
+
});
|
|
66875
|
+
};
|
|
66876
|
+
};
|
|
66877
|
+
// Guard to mute outgoing emits we are programmatically making changes
|
|
66878
|
+
withoutEmitting = (fn) => {
|
|
66879
|
+
this.muteViewerChanged = true;
|
|
66880
|
+
try {
|
|
66881
|
+
fn();
|
|
66882
|
+
} finally {
|
|
66883
|
+
requestAnimationFrame(() => {
|
|
66884
|
+
this.muteViewerChanged = false;
|
|
66885
|
+
});
|
|
66886
|
+
}
|
|
66887
|
+
};
|
|
66888
|
+
// Only consider actual changes in camera settings, i.e., position/rotation/zoom
|
|
66889
|
+
didLayersChange = (prevVS, nextVS) => {
|
|
66890
|
+
const stripColors = (layers) => (layers || []).map((l) => {
|
|
66891
|
+
if (!l) return l;
|
|
66892
|
+
const { segmentColors, ...rest } = l;
|
|
66893
|
+
return rest;
|
|
66894
|
+
});
|
|
66895
|
+
const prevLayers = stripColors(prevVS?.layers);
|
|
66896
|
+
const nextLayers = stripColors(nextVS?.layers);
|
|
66897
|
+
return JSON.stringify(prevLayers) !== JSON.stringify(nextLayers);
|
|
66898
|
+
};
|
|
66899
|
+
/* To add colors to the segments, turning unselected to grey */
|
|
66900
|
+
applyColorsAndVisibility = (cellColorMapping) => {
|
|
66901
|
+
if (!this.viewer) return;
|
|
66902
|
+
const selected = { ...cellColorMapping || {} };
|
|
66903
|
+
for (const id of Object.keys(selected)) this.allKnownIds.add(id);
|
|
66904
|
+
if (this.allKnownIds.size === 0) {
|
|
66905
|
+
const init = this.props.viewerState?.layers?.[0]?.segmentColors || {};
|
|
66906
|
+
for (const id of Object.keys(init)) this.allKnownIds.add(id);
|
|
66907
|
+
}
|
|
66908
|
+
const fullSegmentColors = {};
|
|
66909
|
+
for (const id of this.allKnownIds) {
|
|
66910
|
+
fullSegmentColors[id] = selected[id] || GREY_HEX;
|
|
66911
|
+
}
|
|
66912
|
+
const baseLayers = this.props.viewerState?.layers ?? (this.viewer.state.toJSON().layers || []);
|
|
66913
|
+
const newLayers = baseLayers.map((layer, idx) => {
|
|
66914
|
+
if (idx === 0 || layer?.type === "segmentation") {
|
|
66915
|
+
return { ...layer, segmentColors: fullSegmentColors };
|
|
66916
|
+
}
|
|
66917
|
+
return layer;
|
|
66918
|
+
});
|
|
66919
|
+
this.withoutEmitting(() => {
|
|
66920
|
+
this.viewer.state.restoreState({ layers: newLayers });
|
|
66921
|
+
});
|
|
66922
|
+
};
|
|
67010
66923
|
componentDidMount() {
|
|
67011
66924
|
const {
|
|
67012
66925
|
viewerState,
|
|
@@ -67049,7 +66962,6 @@ class Neuroglancer extends React__default.Component {
|
|
|
67049
66962
|
}
|
|
67050
66963
|
}
|
|
67051
66964
|
componentDidUpdate(prevProps, prevState) {
|
|
67052
|
-
var _a;
|
|
67053
66965
|
const { viewerState, cellColorMapping } = this.props;
|
|
67054
66966
|
const selectedSegments = {};
|
|
67055
66967
|
for (const layer of this.viewer.layerManager.managedLayers) {
|
|
@@ -67100,8 +67012,8 @@ class Neuroglancer extends React__default.Component {
|
|
|
67100
67012
|
const { segments, segmentColors, ...rest } = l;
|
|
67101
67013
|
return rest;
|
|
67102
67014
|
});
|
|
67103
|
-
const prevLayers =
|
|
67104
|
-
const nextLayers = viewerState
|
|
67015
|
+
const prevLayers = prevProps.viewerState?.layers;
|
|
67016
|
+
const nextLayers = viewerState?.layers;
|
|
67105
67017
|
const prevCore = JSON.stringify(stripSegFields(prevLayers));
|
|
67106
67018
|
const nextCore = JSON.stringify(stripSegFields(nextLayers));
|
|
67107
67019
|
const sourcesChanged = prevCore !== nextCore;
|
|
@@ -67150,24 +67062,105 @@ class Neuroglancer extends React__default.Component {
|
|
|
67150
67062
|
);
|
|
67151
67063
|
});
|
|
67152
67064
|
}
|
|
67065
|
+
updateEventBindings = (eventBindingsToUpdate) => {
|
|
67066
|
+
const root = this.viewer.inputEventBindings;
|
|
67067
|
+
const traverse = (current) => {
|
|
67068
|
+
const replace = (eaMap, event0, event1) => {
|
|
67069
|
+
const action = eaMap.get(event0);
|
|
67070
|
+
if (action) {
|
|
67071
|
+
eaMap.delete(event0);
|
|
67072
|
+
if (event1) {
|
|
67073
|
+
eaMap.set(event1, action);
|
|
67074
|
+
}
|
|
67075
|
+
}
|
|
67076
|
+
};
|
|
67077
|
+
const eventActionMap = current.bindings;
|
|
67078
|
+
eventBindingsToUpdate.forEach((oldNewBinding) => {
|
|
67079
|
+
const eventOldBase = Array.isArray(oldNewBinding) ? oldNewBinding[0] : oldNewBinding;
|
|
67080
|
+
const eventOldA = `at:${eventOldBase}`;
|
|
67081
|
+
const eventNewA = oldNewBinding[1] ? `at:${oldNewBinding[1]}` : void 0;
|
|
67082
|
+
replace(eventActionMap, eventOldA, eventNewA);
|
|
67083
|
+
const eventOldB = `bubble:${eventOldBase}`;
|
|
67084
|
+
const eventNewB = oldNewBinding[1] ? `bubble:${oldNewBinding[1]}` : void 0;
|
|
67085
|
+
replace(eventActionMap, eventOldB, eventNewB);
|
|
67086
|
+
});
|
|
67087
|
+
current.parents.forEach((parent) => {
|
|
67088
|
+
traverse(parent);
|
|
67089
|
+
});
|
|
67090
|
+
};
|
|
67091
|
+
traverse(root.global);
|
|
67092
|
+
traverse(root.perspectiveView);
|
|
67093
|
+
traverse(root.sliceView);
|
|
67094
|
+
};
|
|
67095
|
+
selectionDetailsStateChanged = () => {
|
|
67096
|
+
if (this.viewer) {
|
|
67097
|
+
const { onSelectionDetailsStateChanged } = this.props;
|
|
67098
|
+
if (onSelectionDetailsStateChanged) {
|
|
67099
|
+
onSelectionDetailsStateChanged();
|
|
67100
|
+
}
|
|
67101
|
+
}
|
|
67102
|
+
};
|
|
67103
|
+
layersChanged = () => {
|
|
67104
|
+
if (this.handlerRemovers) {
|
|
67105
|
+
this.handlerRemovers.forEach((remover) => remover());
|
|
67106
|
+
}
|
|
67107
|
+
if (this.viewer) {
|
|
67108
|
+
const { onSelectedChanged, onVisibleChanged } = this.props;
|
|
67109
|
+
if (onSelectedChanged || onVisibleChanged) {
|
|
67110
|
+
this.handlerRemovers = [];
|
|
67111
|
+
for (const layer of this.viewer.layerManager.managedLayers) {
|
|
67112
|
+
if (layer.layer instanceof SegmentationUserLayer) {
|
|
67113
|
+
const { segmentSelectionState } = layer.layer.displayState;
|
|
67114
|
+
const { visibleSegments } = layer.layer.displayState.segmentationGroupState.value;
|
|
67115
|
+
if (segmentSelectionState && onSelectedChanged) {
|
|
67116
|
+
const selectedChanged = this.selectedChanged.bind(
|
|
67117
|
+
void 0,
|
|
67118
|
+
layer
|
|
67119
|
+
);
|
|
67120
|
+
const remover = segmentSelectionState.changed.add(selectedChanged);
|
|
67121
|
+
this.handlerRemovers.push(remover);
|
|
67122
|
+
layer.registerDisposer(remover);
|
|
67123
|
+
}
|
|
67124
|
+
if (visibleSegments && onVisibleChanged) {
|
|
67125
|
+
const visibleChanged = this.visibleChanged.bind(void 0, layer);
|
|
67126
|
+
const remover = visibleSegments.changed.add(visibleChanged);
|
|
67127
|
+
this.handlerRemovers.push(remover);
|
|
67128
|
+
layer.registerDisposer(remover);
|
|
67129
|
+
}
|
|
67130
|
+
}
|
|
67131
|
+
}
|
|
67132
|
+
}
|
|
67133
|
+
}
|
|
67134
|
+
};
|
|
67135
|
+
/* ** Vitessce Integration update start ** */
|
|
67136
|
+
selectedChanged = (layer) => {
|
|
67137
|
+
if (!this.viewer) return;
|
|
67138
|
+
const { onSelectedChanged } = this.props;
|
|
67139
|
+
if (onSelectedChanged) {
|
|
67140
|
+
const { segmentSelectionState } = layer.layer.displayState;
|
|
67141
|
+
if (!segmentSelectionState) return;
|
|
67142
|
+
const selected = segmentSelectionState.selectedSegment;
|
|
67143
|
+
if (selected) {
|
|
67144
|
+
onSelectedChanged(selected, layer);
|
|
67145
|
+
}
|
|
67146
|
+
}
|
|
67147
|
+
};
|
|
67148
|
+
visibleChanged = (layer) => {
|
|
67149
|
+
if (this.viewer) {
|
|
67150
|
+
const { onVisibleChanged } = this.props;
|
|
67151
|
+
if (onVisibleChanged) {
|
|
67152
|
+
const { visibleSegments } = layer.layer.displayState.segmentationGroupState.value;
|
|
67153
|
+
if (visibleSegments) {
|
|
67154
|
+
onVisibleChanged(visibleSegments, layer);
|
|
67155
|
+
}
|
|
67156
|
+
}
|
|
67157
|
+
}
|
|
67158
|
+
};
|
|
67153
67159
|
render() {
|
|
67154
67160
|
const { perspectiveZoom } = this.props;
|
|
67155
67161
|
return /* @__PURE__ */ React__default.createElement("div", { className: "neuroglancer-container", ref: this.ngContainer }, /* @__PURE__ */ React__default.createElement("p", null, "Neuroglancer here with zoom ", perspectiveZoom));
|
|
67156
67162
|
}
|
|
67157
67163
|
}
|
|
67158
|
-
__publicField(Neuroglancer, "defaultProps", {
|
|
67159
|
-
perspectiveZoom: 20,
|
|
67160
|
-
eventBindingsToUpdate: null,
|
|
67161
|
-
brainMapsClientId: "NOT_A_VALID_ID",
|
|
67162
|
-
viewerState: null,
|
|
67163
|
-
onSelectedChanged: null,
|
|
67164
|
-
onVisibleChanged: null,
|
|
67165
|
-
onSelectionDetailsStateChanged: null,
|
|
67166
|
-
onViewerStateChanged: null,
|
|
67167
|
-
key: null,
|
|
67168
|
-
callbacks: [],
|
|
67169
|
-
ngServer: "https://neuroglancer-demo.appspot.com/"
|
|
67170
|
-
});
|
|
67171
67164
|
export {
|
|
67172
67165
|
addLayerSignalRemover,
|
|
67173
67166
|
closeSelectionTab,
|