grid draws on tool canvas instead of main canvas

README.md

@@ -71,7 +71,6 @@ A most latest production build to use is available at https://asciibird.jewbird.
 
 ## Features to Add
 
-* Context menu for layers
 * Layers undo and redo could be implemented, at the moment there isn't any.
 * Warning on mirc export if ascii exceeds IRCs 512 per chat line limit.
 * Review encodings check on file import - UTF8 vs Latin something

src/ascii.js

@@ -530,15 +530,9 @@ export const exportMirc = (blocks = null) => {
 
   // Download to a txt file
   // Check if txt already exists and append it
-  if (isPng) { 
-    var filename = currentAscii.title.slice(currentAscii.title.length - 3) === 'png' ?
-      currentAscii.title :
-      `${currentAscii.title}.png`;
-  } else {
-    var filename = currentAscii.title.slice(currentAscii.title.length - 3) === 'txt' ?
-      currentAscii.title :
-      `${currentAscii.title}.txt`;
-  }
+  var filename = currentAscii.title.slice(currentAscii.title.length - 3) === 'txt' ?
+    currentAscii.title :
+    `${currentAscii.title}.txt`;
 
 
   return {

src/components/parts/BrushCanvas.vue

@@ -200,7 +200,7 @@ export default {
 
         default:
         case "file":
-          downloadFile(ascii.output.join(""), ascii.filename, "text/plain");
+          downloadFile(ascii.output.join(""), `brush-${this.hash}.txt`, "text/plain");
           this.$refs[`block-menu-${this.hash}`].close();
           break;
       }

src/components/parts/MainBrushCanvas.vue

@@ -242,7 +242,7 @@ export default {
 
         default:
         case "file":
-          downloadFile(ascii.output.join(""), ascii.filename, "text/plain");
+          downloadFile(ascii.output.join(""), `brush-${this.hash}.txt`, "text/plain");
           this.$refs[`main-brush-menu`].close();
           break;
       }

src/views/Editor.vue

@@ -434,7 +434,7 @@ export default {
     },
     gridView(val, old) {
       if (val !== old) {
-        this.delayRedrawCanvas();
+        this.clearToolCanvas();
       }
     },
     brushBlocks() {
@@ -866,28 +866,28 @@ export default {
       let w = this.canvas.width;
       let h = this.canvas.height;
 
-      this.ctx.beginPath();
+      this.toolCtx.beginPath();
 
       for (var x = 0; x <= w; x += blockWidth) {
-        this.ctx.moveTo(x, 0);
-        this.ctx.lineTo(x, h);
+        this.toolCtx.moveTo(x, 0);
+        this.toolCtx.lineTo(x, h);
       }
 
-      this.ctx.strokeStyle = "rgba(0, 0, 0, 1)";
-      this.ctx.lineWidth = 1;
-      this.ctx.setLineDash([1]);
+      this.toolCtx.strokeStyle = "rgba(0, 0, 0, 1)";
+      this.toolCtx.lineWidth = 1;
+      this.toolCtx.setLineDash([1]);
 
-      this.ctx.stroke();
+      this.toolCtx.stroke();
 
-      this.ctx.beginPath();
+      this.toolCtx.beginPath();
       for (var y = 0; y <= h; y += blockHeight) {
-        this.ctx.moveTo(0, y);
-        this.ctx.lineTo(w, y);
+        this.toolCtx.moveTo(0, y);
+        this.toolCtx.lineTo(w, y);
       }
 
-      this.ctx.stroke();
+      this.toolCtx.stroke();
     },
-    redrawCanvas() {
+    redrawCanvas(force = false) {
       if (this.currentAsciiLayers.length) {
         // https://stackoverflow.com/questions/28390358/high-cpu-usage-with-canvas-and-requestanimationframe
 
@@ -968,7 +968,7 @@ export default {
           let mergeLayers = this.mergeLayers();
           let tempHash = cyrb53(JSON.stringify(mergeLayers));
 
-          if (tempHash === this.canvasHash) {
+          if (tempHash === this.canvasHash && !force) {
             // Avoid redrawing the entire canvas to same some CPU
             // if we have no new changes
             return;
@@ -1020,9 +1020,6 @@ export default {
           }
         }
 
-        if (this.gridView) {
-          this.drawGrid();
-        }
 
         this.ctx.restore();
       }
@@ -1258,6 +1255,9 @@ export default {
         this.toolCtx.clearRect(0, 0, this.canvas.width, this.canvas.height);
         // this.toolCtx.save();
         this.toolCtx.width = this.toolCtx.width;
+        if (this.gridView) {
+          this.drawGrid();
+        }
       }
     },
     delayRedrawCanvas() {