diff --git a/__init__.py b/__init__.py
index b66db33..b0158a3 100644
--- a/__init__.py
+++ b/__init__.py
@@ -50,7 +50,7 @@ class Canvas_Tab:
     def image_buffer(self, unique_id, mask, canvas, images=None):
 
         collected_images = list()
-        for image in images:
+        for image in images or []:
             i = 255. * image.cpu().numpy()
             img = Image.fromarray(np.clip(i, 0, 255).astype(np.uint8)) 
             collected_images.append(image_to_data_url(img))
diff --git a/web/page/bspaint.js b/web/page/bspaint.js
index a0685cf..70c8d71 100644
--- a/web/page/bspaint.js
+++ b/web/page/bspaint.js
@@ -51,6 +51,7 @@ function setActivePic(newValue) {
   updateLayerList()
 
 }
+
 var dragging = false;
 
 
@@ -189,6 +190,7 @@ function createDrawArea(canvas = blankCanvas()) {
       canvas.ctx.clearRect(0,0,canvas.width,canvas.height)
       for (const layer of this.layers) {
         if (suppressMask && this.mask==layer) continue;
+        if (!layer.visible) continue;        
         canvas.ctx.globalAlpha = layer.opacity;
         canvas.ctx.globalCompositeOperation=layer.composite;
         if (this.isDrawing && layer===this.activeLayer) {
@@ -225,11 +227,18 @@ function createDrawArea(canvas = blankCanvas()) {
       if (activePic===this) {  
         updateLayerList();  //inefficient to remake all controls on edit,  fix this
       }
-      this.composite();
+      this.updateVisualRepresentation();
 
     },
 
+    updateVisualRepresentation(transmit=false) {
+      this.composite();
+      if (transmit && this===selectedExport) transmitCanvas(canvas);          
+    },
+
     startDraw(x,y) {
+      if (!this.activeLayer.visible) return; //don't draw on hidden layers.
+
       let data = this.activeLayer.ctx.getAllImageData()
       activeOperationCanvas.ctx.putImageData(data,0,0);
       this.isDrawing=true;
@@ -420,7 +429,7 @@ function handleMouseUp(e) {
 }
 function handleMouseMove(e) {
   let pic = e.currentTarget.pic;
-  activePic = pic;
+  if (pic!==activePic) return;
   if (dragging) {
     if (e.buttons!==4) {
       stopDragging();
@@ -697,13 +706,15 @@ function poulateLayerControl() {
   $("input.maskColor").on("change", e=>{
     lastUsedMaskColor = e.currentTarget.value;
     activePic.activeLayer.maskColor=lastUsedMaskColor;
-    activePic.composite();
+    activePic.updateVisualRepresentation();
     updateLayerList();
   });
 
   $("input.opacity").on("input", e=> {
-    activePic.activeLayer.opacity = e.currentTarget.value/100;    
-    activePic.composite();
+    activePic.activeLayer.opacity = e.currentTarget.value/100; 
+    activePic.updateVisualRepresentation(true);
+    //shouldn't need this 
+    updateLayerList();
   });
 
 }
@@ -728,6 +739,7 @@ function updateLayerList() {
     result.querySelector(".visibilitybox").onmousedown = e => {
       e.stopPropagation();
       layer.visible=!layer.visible;
+      pic.updateVisualRepresentation(true);
       updateLayerList();
     }