fill tool (WIP), better panel remember

src/Dashboard.vue

@@ -13,7 +13,7 @@
         type="number"
         name="width"
         v-model="forms.createAscii.width"
-        max="3"
+        min="1"
       />
 
       Height
@@ -21,7 +21,7 @@
         type="number"
         name="height"
         v-model="forms.createAscii.height"
-        max="4"
+        min="1"
       />
 
       Title
@@ -279,8 +279,8 @@ export default {
         blockWidth: 8 * this.$store.getters.blockSizeMultiplier,
         blockHeight: 13 * this.$store.getters.blockSizeMultiplier,
         blocks: this.create2DArray(asciiImport.split('\n').length),
-        x: 50, // the dragable ascii canvas x
-        y: 100, // the dragable ascii canvas y
+        x: 247, // the dragable ascii canvas x
+        y: 24, // the dragable ascii canvas y
       };
 
       // Turn the entire ascii string into an array
@@ -548,8 +548,8 @@ export default {
         height: this.forms.createAscii.height,
         blockWidth: 8,
         blockHeight: 13,
-        x: 50, // the dragable ascii canvas x
-        y: 100, // the dragable ascii canvas y
+        x: 247, // the dragable ascii canvas x
+        y: 24, // the dragable ascii canvas y
         blocks: this.create2DArray(this.forms.createAscii.height),
       };
 

src/store/index.js

@@ -111,12 +111,12 @@ export default new Vuex.Store({
       targetingFg: true,
       targetingBg: true,
       targetingChar: true,
-      x: 50, 
-      y: 100,
+      x: 24, 
+      y: 28,
     },
     debugPanelState: {
-      x: 50, 
-      y: 100,
+      x: 26, 
+      y: 344,
     },
     blockSizeMultiplier: 1,
   },

src/views/Editor.vue

@@ -323,12 +323,82 @@ export default {
     },
 
     // TOOLS
-    fillTool(block) {
-      if (this.$store.getters.getTargetingBg) {
-        const fillSameBg = block.bg;
-      }
+    fillTool( x = null, y = null, originalBg = null) {
+        // Cycle through possible blocks top, left, bellow and right
+        let blocks = this.$store.getters.currentAscii.blocks
+        
+        if (!x) {
+          x = this.x
+        }
 
-      console.log(block);
+        if (!y) {
+          y = this.y
+        }
+
+        if (!originalBg) {
+          originalBg = blocks[this.y][this.x].bg
+        }
+
+        let curBlock = this.$store.getters.currentAscii.blocks[y][x]
+        
+
+
+
+        // Top
+        if (blocks[y-1] &&
+            blocks[y-1][x] &&
+            blocks[y-1][x].bg === originalBg) {
+
+            // let topBlock = Object.assign({},blocks[y-1][x])
+            console.log("topBlock", topBlock);
+
+            curBlock.bg = this.$store.getters.getBgColour;
+
+            this.fillTool( x, y-1, originalBg)
+            
+        }
+        
+        // Left
+        if (blocks[y] &&
+            blocks[y][x+1] &&
+            blocks[y][x+1].bg === originalBg) {
+
+            // let leftBlock = Object.assign({},blocks[y][x+1])
+            console.log("leftBlock", leftBlock);
+
+            curBlock.bg = this.$store.getters.getBgColour;
+
+            this.fillTool( x+1, y, originalBg)
+            
+        }
+
+        // Bellow
+        if (blocks[y+1] &&
+            blocks[y+1][x] &&
+            blocks[y+1][x].bg === originalBg) {
+
+            // let bellowBlock = Object.assign({},blocks[y+1][x])
+            console.log("bellowBlock", bellowBlock);
+
+            curBlock.bg = this.$store.getters.getBgColour;
+
+            this.fillTool( x, y+1, originalBg)
+            
+        }
+
+        // Right
+        if (blocks[y] &&
+            blocks[y][x-1] &&
+            blocks[y][x-1].bg === originalBg) {
+
+            // let rightBlock = Object.assign({},blocks[y][x-1])
+            console.log("rightBlock", rightBlock);
+
+            curBlock.bg = this.$store.getters.getBgColour;
+
+            this.fillTool( x-1, y, originalBg)
+            
+        }
     },
   },
 };