fix trk js brush functionality

- brush size needs to be rescaled in caliban.py to work correctly
- js brush.draw needs additional arguments
- clip edges of image before drawing brush to prevent edge artifacts

browser/caliban.py

@@ -211,7 +211,9 @@ def action_handle_draw(self, trace, target_value, brush_value, brush_size, erase
             x_loc = loc[1]
             y_loc = loc[0]
 
-            brush_area = circle(y_loc, x_loc, brush_size, (self.height, self.width))
+            brush_area = circle(y_loc, x_loc,
+                                brush_size // self.scale_factor,
+                                (self.height, self.width))
 
             # do not overwrite or erase labels other than the one you're editing
             if not erase:

browser/static/js/main_track.js

@@ -639,8 +639,15 @@ function render_edit_image(ctx) {
   ctx.drawImage(seg_image, padding, padding, dimensions[0], dimensions[1]);
   ctx.restore();
 
+  ctx.save();
+  let region = new Path2D();
+  region.rect(padding, padding, dimensions[0], dimensions[1]);
+  ctx.clip(region);
+  ctx.imageSmoothingEnabled = true;
+
   // draw brushview on top of cells/annotations
-  brush.draw(ctx);
+  brush.draw(ctx, 0, 0, dimensions[0], dimensions[1], 1);
+  ctx.restore();
 }
 
 function render_raw_image(ctx) {