diff --git a/src/components/MyNodes.vue b/src/components/MyNodes.vue index 6c2604de7e9daeff954e9a94e4c74dae4304c13f..f2392f46c90aee0c037db427ceb1bf20f9ed7145 100644 --- a/src/components/MyNodes.vue +++ b/src/components/MyNodes.vue @@ -1,7 +1,7 @@ <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) }, }, } diff --git a/src/store/modules/mynodes.js b/src/store/modules/mynodes.js index d27b0d1cba48e34786c0d32085e620b4f047cb93..04ea835486f18ed1a8ca31e322961a803ba30c64 100644 --- a/src/store/modules/mynodes.js +++ b/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