Add support for nv.draw_bitmap

Author: AnthonyAndroulakis

js/lib.ts

@@ -47,7 +47,7 @@ export function handleBufferMsg(
 	targetObject: any,
 	payload: TypedBufferPayload,
 	buffers: DataView[],
-	callback: () => void,
+	callback: (data: TypedBufferPayload) => void,
 ): boolean {
 	const { type, data } = payload;
 
@@ -61,7 +61,7 @@ export function handleBufferMsg(
 
 			targetObject[attrName] = typedArray;
 
-			callback();
+			callback(payload);
 
 			return true;
 		}
@@ -91,7 +91,7 @@ export function handleBufferMsg(
 
 			applyDifferencesToTypedArray(existingArray, indicesArray, valuesArray);
 
-			callback();
+			callback(payload);
 
 			return true;
 		}

js/mesh.ts

@@ -201,8 +201,10 @@ function setup_mesh_property_listeners(
 		buffers: DataView[],
 	) {
 		const handled = lib.handleBufferMsg(mesh, payload, buffers, () => {
-			mesh.updateMesh(nv.gl);
-			nv.updateGLVolume();
+			if (nv._gl) {
+				mesh.updateMesh(nv.gl);
+				nv.updateGLVolume();
+			}
 		});
 		if (handled) {
 			return;

js/types.ts

@@ -183,6 +183,8 @@ export type Model = AnyModel<{
 	overlay_alpha_shader: number;
 
 	_volume_object_3d_data: NiivueObject3D; // only updated via frontend (1-way comm)
+
+	draw_bitmap: DataView | null;
 }>;
 
 // Custom message datas

js/volume.ts

@@ -146,7 +146,11 @@ function setup_volume_property_listeners(
 			volume,
 			payload as TypedBufferPayload,
 			buffers,
-			() => nv.updateGLVolume(),
+			() => {
+				if (nv._gl) {
+					nv.updateGLVolume();
+				}
+			},
 		);
 		if (handled) {
 			return;

js/widget.ts

@@ -13,12 +13,41 @@ import type {
 	Model,
 	NiivueObject3D,
 	Scene,
+	TypedBufferPayload,
 	VolumeModel,
 } from "./types.ts";
 
 let nv: niivue.Niivue;
 let syncInterval: number | undefined;
 
+async function sendDrawBitmap(nv: niivue.Niivue, model: Model) {
+	const thisModelId = model.get("this_model_id");
+	if (!thisModelId) {
+		return;
+	}
+	let thisAnyModel: AnyModel;
+	try {
+		thisAnyModel = (await model.widget_manager.get_model(
+			thisModelId,
+		)) as AnyModel;
+	} catch (err) {
+		return;
+	}
+
+	if (nv.drawBitmap) {
+		const dataType = lib.getArrayType(nv.drawBitmap);
+		lib.sendChunkedData(
+			thisAnyModel,
+			"draw_bitmap",
+			nv.drawBitmap.buffer as ArrayBuffer,
+			dataType,
+		);
+	} else {
+		model.set("draw_bitmap", null);
+		model.save_changes();
+	}
+}
+
 // Attach model event handlers
 function attachModelEventHandlers(
 	nv: niivue.Niivue,
@@ -129,7 +158,24 @@ function attachModelEventHandlers(
 	// Handle any message directions from the nv object.
 	model.on(
 		"msg:custom",
-		async (payload: CustomMessagePayload, buffers: DataView[]) => {
+		async (
+			payload: TypedBufferPayload | CustomMessagePayload,
+			buffers: DataView[],
+		) => {
+			const handled = lib.handleBufferMsg(
+				nv,
+				payload as TypedBufferPayload,
+				buffers,
+				(pyData) => {
+					if (pyData.data.attr === "drawBitmap") {
+						nv.refreshDrawing();
+					}
+				},
+			);
+			if (handled) {
+				return;
+			}
+
 			const { type, data } = payload;
 			switch (type) {
 				case "save_document": {
@@ -203,15 +249,18 @@ function attachModelEventHandlers(
 				case "set_drawing_enabled": {
 					const [drawingEnabled] = data;
 					nv.setDrawingEnabled(drawingEnabled);
+					await sendDrawBitmap(nv, model);
 					break;
 				}
 				case "draw_otsu": {
 					const [levels] = data;
 					nv.drawOtsu(levels);
+					await sendDrawBitmap(nv, model);
 					break;
 				}
 				case "draw_grow_cut": {
 					nv.drawGrowCut();
+					await sendDrawBitmap(nv, model);
 					break;
 				}
 				case "move_crosshair_in_vox": {
@@ -226,10 +275,12 @@ function attachModelEventHandlers(
 				}
 				case "draw_undo": {
 					nv.drawUndo();
+					await sendDrawBitmap(nv, model);
 					break;
 				}
 				case "close_drawing": {
 					nv.closeDrawing();
+					await sendDrawBitmap(nv, model);
 					break;
 				}
 				case "load_drawing_from_url": {
@@ -255,6 +306,9 @@ function attachModelEventHandlers(
 					} else {
 						nv.loadDrawingFromUrl(url, isBinarize);
 					}
+
+					await sendDrawBitmap(nv, model);
+
 					break;
 				}
 				case "load_document_from_url": {
@@ -279,6 +333,9 @@ function attachModelEventHandlers(
 					} catch (err) {
 						console.error(`loadDocument() failed to load: ${err}`);
 					}
+
+					await sendDrawBitmap(nv, model);
+
 					break;
 				}
 			}

src/ipyniivue/widget.py

@@ -69,6 +69,8 @@ class BaseAnyWidget(anywidget.AnyWidget):
     _data_handlers: typing.ClassVar[dict] = {}
     _event_handlers: typing.ClassVar[dict] = {}
 
+    _binary_trait_to_js_names: typing.ClassVar[dict] = {}
+
     def __init__(self, *args, **kwargs):
         super().__init__(*args, **kwargs)
         self._setup_binary_change_handlers()
@@ -80,7 +82,8 @@ def set_state(self, state):
 
         for attr_name, attr_value in state.items():
             if attr_name.startswith("chunk_"):
-                _, data_property, chunk_index = attr_name.split("_")
+                base, chunk_index = attr_name.rsplit("_", 1)
+                data_property = base[6:]
                 chunk_index = int(chunk_index)
                 chunk_info = attr_value
                 chunk_index_received = chunk_info["chunk_index"]
@@ -122,8 +125,12 @@ def _setup_binary_change_handlers(self):
     def _get_binary_traits(self):
         return []
 
+    def _get_js_name(self, trait_name):
+        """Get the JavaScript attribute name for a trait."""
+        return self._binary_trait_to_js_names.get(trait_name, trait_name)
+
     def _handle_binary_trait_change(self, change):
-        trait_name = change["name"]
+        trait_name = self._get_js_name(change["name"])
         old_value = change["old"]
         new_value = change["new"]
         if old_value is not None:
@@ -802,6 +809,8 @@ class NiiVue(BaseAnyWidget):
 
     _esm = pathlib.Path(__file__).parent / "static" / "widget.js"
 
+    _binary_trait_to_js_names: typing.ClassVar[dict] = {"draw_bitmap": "drawBitmap"}
+
     height = t.Int().tag(sync=True)
     opts = t.Instance(ConfigOptions).tag(
         sync=True, to_json=serialize_options, from_json=deserialize_options
@@ -847,6 +856,10 @@ class NiiVue(BaseAnyWidget):
         sync=False
     )
 
+    draw_bitmap = t.Instance(np.ndarray, allow_none=True).tag(
+        sync=True, to_json=serialize_ndarray
+    )
+
     @t.validate("other_nv")
     def _validate_other_nv(self, proposal):
         value = proposal["value"]
@@ -904,6 +917,9 @@ def __init__(self, height: int = 300, **options):  # noqa: D417
         self._event_handlers = {}
         self.on_msg(self._handle_custom_msg)
 
+    def _get_binary_traits(self):
+        return ["draw_bitmap"]
+
     def set_state(self, state):
         """Override set_state to silence notifications for certain updates."""
         if "scene" in state: