Global alpha

Author: martinRenou

ipycanvas/canvas.py

@@ -23,6 +23,7 @@ class Canvas(DOMWidget):
 
     fill_style = Color('black').tag(sync=True)
     stroke_style = Color('black').tag(sync=True)
+    global_alpha = Float(1.0).tag(sync=True)
 
     # Rectangles methods
     def fill_rect(self, x, y, width, height):

src/widget.ts

@@ -48,11 +48,13 @@ class CanvasView extends DOMWidgetView {
     this.canvas = document.createElement('canvas');
     this.canvas.classList.add('ipycanvas_canvas');
 
-    this.ctx = this.canvas.getContext('2d');
-
     this.el.appendChild(this.canvas);
     this.el.classList.add('ipycanvas');
 
+    this.ctx = this.canvas.getContext('2d');
+
+    this.ctx.globalAlpha = this.model.get('global_alpha');
+
     this.resize_canvas();
 
     this.model_events();
@@ -66,7 +68,8 @@ class CanvasView extends DOMWidgetView {
       this.ctx[event.msg](...event.args);
     });
 
-    this.model.on('change;size', () => { this.resize_canvas(); });
+    this.model.on('change:size', () => { this.resize_canvas(); });
+    this.model.on('change:global_alpha', () => { this.ctx.globalAlpha = this.model.get('global_alpha'); });
   }
 
   resize_canvas() {