more toolbar stuff (WIP)

src/components/Toolbar.vue

@@ -74,7 +74,7 @@ export default {
       this.floating.y = y;
     },
     onToolbarChange(item) {
-        this.$store.commit('changeTool', item);
+        this.$store.commit('changeTool', item.name);
     },
     onColorChange(item) {
         this.$store.commit('changeColor', item);

src/store/index.js

@@ -59,16 +59,24 @@ export default new Vuex.Store({
   },
   mutations: {
     changeTab(state, payload) {
-      this.state.asciibirdMeta.tab = payload;
+      state.asciibirdMeta.tab = payload;
     },
     changeColor(state, payload) {
-      this.state.asciibirdMeta.toolbarState = payload;
+      state.asciibirdMeta.toolbarState.currentColor = payload;
     },
     changeTool(state, payload) {
-      this.state.asciibirdMeta.toolbarState = payload;
+      state.asciibirdMeta.toolbarState.currentTool = payload;
     },
     newAsciibirdMeta(state, payload) {
-      this.state.asciibirdMeta.push(payload);
+      state.asciibirdMeta.push(payload);
+    },
+  },
+  getters: {
+    getColor() {
+      return this.state.toolbarState.currentColor ?? null
+    },
+    getTool() {
+      return this.state.toolbarState.currentTool ?? null
     },
   },
   actions: {},

src/views/Editor.vue

@@ -104,13 +104,25 @@ export default {
     generateTitle() {
       return this.currentAsciibirdMeta.title ?? "";
     },
+    watchColorChange() {
+      return this.$store.getters.getColor()
+    },
+    watchToolChange() {
+      return this.$store.getters.getTool()
+    },
   },
   watch: {
-    getFullPath(val, old) {
+    getFullPath(val) {
       this.onChangeTab(val.split("/").join(""));
     },
+    watchColorChange(val) {
+      console.log(JSON.stringify(val))        
+    },
+    watchToolChange(val) {
+      console.log(JSON.stringify(val))          
+    }
     // watchBlocksChange(val, old) {
-    //   if (this.$refs[this.generateCanvasId]) {
+    //   if (this.$refs[this.generate CanvasId]) {
     //     this.ctx = this.$refs.canvas.getContext("2d");
     //     this.gridCtx = this.$refs.grid.getContext("2d");