aces/brainbrowser — pull request #95 by PaulMougel (2014-08-11 12:47:43+00:00)
Title: Each panel in VolumeViewer emits a "draw" event when drawing.

This pull request is a step towards fixing #94.

This allows for custom code to be executed on panel refresh, allowing the user to draw something else on the canvas.
Here is an example:

```diff
diff --git a/examples/volume-viewer-demo.js b/examples/volume-viewer-demo.js
index ad3fa08..a0d5b40 100644
--- a/examples/volume-viewer-demo.js
+++ b/examples/volume-viewer-demo.js
@@ -530,6 +530,22 @@ $(function() {
}
});

+ BrainBrowser.events.addEventListener("draw", function (volume, panel) {
+ if (panel.axis !== "yspace") return;
+ var context = panel.context;
+ context.save();
+ context.strokeStyle = "#EC2121";
+ context.lineWidth = 10;
+ context.strokeRect(
+ 1 * 100,
+ 1 * 100,
+ 1 * 100,
+ 1 * 100
+ );
+
+ context.restore();
+ });
+
var color_map_config = BrainBrowser.config.get("color_maps")[0];

loading_div.show();
```

which triggers the following display on the example page:
![capture decran 2014-08-11 a 14 39 44](https://cloud.githubusercontent.com/assets/1788596/3875782/674dcc36-2155-11e4-9589-ae8c3de8af90.png)

Please note that inI had to trigger the event handlers synchronously, otherwise the code wasn't executed when it should and the canvas wasn't updated correctly (i.e. the red squares were not displayed because they were drawn too late). Notably, triggering events synchronously is what Node does: https://github.com/joyent/node/blob/master/lib/events.js#L100-L130 .

Any feedback is appreciated!