fixed some typos and added shape selection

src/components/MyNodes.vue

 <template>
   <div v-for="(nodes, index) in myArray" :key="index">
     <form class="nodes">
-      <template v-if="nodes.read_mode == false">
+      <template v-if="nodes.node_readmode == false">
         <textarea
           v-model="nodes.node_text"
           @input="editNode"
@@ -25,11 +25,15 @@
             <button @click.prevent>{{ nodes.node_color }}</button>
           </template>
         </VSwatches>
-        <select v-model="nodes.node_shape">
-          <option value="">Square</option>
-          <option value="">Circle</option>
-          <option value="">Triangle</option>
-          <option value="">Hexegon</option>
+        <select
+          v-model="nodes.node_shape"
+          @input="setShape"
+          :id="nodes.node_id"
+        >
+          <option value="square">Square</option>
+          <option value="circle">Circle</option>
+          <option value="triangle">Triangle</option>
+          <option value="hexegon">Hexegon</option>
         </select>
 
         <button @click.prevent="toggleMode(nodes.node_id)">Read</button>
@@ -126,15 +130,19 @@ export default {
     },
 
     chooseColor(nodeid, color) {
-      // TESTING method is even being called
-      if (confirm('Confirm change?')) {
-        this.$store.dispatch('colorNode', { nodeid, color })
-        setTimeout(this.loadData, 500)
-      } else {
-        // nothing happens
-      }
-      // this.$store.dispatch('colorNode', { nodeid, color })
-      // setTimeout(this.loadData, 500)
+      // var nodeid = e.target.id
+      // var color = e.target.value
+
+      this.$store.dispatch('colorNode', { nodeid, color })
+      setTimeout(this.loadData, 500)
+    },
+
+    setShape(e) {
+      var nodeid = e.target.id
+      var shape = e.target.value
+
+      this.$store.dispatch('setShape', { nodeid, shape })
+      setTimeout(this.loadData, 500)
     },
   },
 }

src/store/modules/mynodes.js

@@ -186,7 +186,6 @@ export const mutations = {
           {
             _id: deviceName,
             _rev: doc._rev,
-            _attachments: doc._attachments,
             nodes: state.myNodes,
           },
         ])
@@ -204,14 +203,14 @@ export const mutations = {
     for (i = 0; i < Object.keys(state.myNodes).length; i++) {
       if (
         e.e == state.myNodes[i].node_id &&
-        state.myNodes[i].read_mode == false
+        state.myNodes[i].node_readmode == false
       ) {
-        state.myNodes[i].read_mode = true
+        state.myNodes[i].node_readmode = true
       } else if (
         e.e == state.myNodes[i].node_id &&
-        state.myNodes[i].read_mode == true
+        state.myNodes[i].node_readmode == true
       ) {
-        state.myNodes[i].read_mode = false
+        state.myNodes[i].node_readmode = false
       }
     }
     pouchdb
@@ -259,6 +258,36 @@ export const mutations = {
       })
       .catch(function () {})
   },
+
+  SET_SHAPE(state, e) {
+    var i
+    for (i = 0; i < Object.keys(state.myNodes).length; i++) {
+      if (e.nodeid == state.myNodes[i].node_id) {
+        state.myNodes[i].node_shape = e.shape
+      }
+    }
+    pouchdb
+      .get(deviceName)
+      .then(function (doc) {
+        return pouchdb.bulkDocs([
+          {
+            _id: deviceName,
+            _rev: doc._rev,
+            nodes: state.myNodes,
+          },
+        ])
+      })
+      .then(function () {
+        return pouchdb.get(deviceName).then(function (doc) {
+          state.myNodes = doc.nodes
+        })
+      })
+      .catch(function (err) {
+        if (err.status == 404) {
+          // pouchdb.put({  })
+        }
+      })
+  },
 }
 
 export const actions = {
@@ -290,6 +319,10 @@ export const actions = {
     commit('COLOR_NODE', { nodeid, color })
   },
 
+  setShape: ({ commit }, { nodeid, shape }) => {
+    commit('SET_SHAPE', { nodeid, shape })
+  },
+
   getMicrocosm(vuexContext) {
     deviceName = vuexContext.rootState.setup.deviceName
     // microcosmName = vuexContext.rootState.setup.microcosmName