Skip to content
Snippets Groups Projects
Commit fbb6a6dc authored by Adam Procter's avatar Adam Procter
Browse files

trying to add the cards view

this will show other nodes as well... maybe jumping the gun as the issues with adding are not resolved yet
parent 197a2347
No related branches found
No related tags found
No related merge requests found
<template>
<div id="nav">
<router-link to="/">Start</router-link> |
<router-link to="/credits">Credits</router-link>
<router-link to="/credits">Credits</router-link> |
<router-link to="/collect">Collect</router-link> |
<router-link to="/cards">Cards</router-link>
</div>
<router-view />
</template>
......
<template>
<div v-for="(nodes, index) in myArray" :key="index">
{{ index }}
<form class="nodes">
<template v-if="nodes.node_readmode == false">
<!-- <template v-if="nodes.node_readmode == false"> -->
<textarea
v-model="nodes.node_text"
@input="editNode"
......@@ -14,14 +15,14 @@
<button>Colour</button>
<button>Read</button>
<button>Discard</button>
</template>
<!-- </template>
<template v-else>
<p
class="readmode"
:id="nodes.node_id"
:inner-html.prop="nodes.node_text"
></p>
</template>
</template> -->
</form>
</div>
</template>
......@@ -78,6 +79,7 @@ export default {
)
this.$store.dispatch('getMynodes')
this.myArray = nodesFiltered.reverse()
console.log(this.myArray.length)
},
editNode(e) {
......
<template>
<div v-for="(nodes, index) in otherArray" :key="index">
<p
class="readmode"
:id="nodes.node_id"
:inner-html.prop="nodes.node_text"
></p>
</div>
</template>
<script>
// @ is an alias to /src
import { mapState } from 'vuex'
// import marked from 'marked'
export default {
name: 'OtherNodes',
data() {
return {
otherArray: [],
}
},
computed: {
...mapState({
otherNodes: (state) => state.otherNodes,
}),
},
// watch: {
// added: function () {
// this.loadData()
// },
// },
mounted() {
//console.log('mounted')
setTimeout(this.loadData, 500)
// if (localStorage.nogg_microcosm) {
// // var devicename = localStorage.nogg_name
// var microcosm = localStorage.nogg_microcosm
// this.$store.dispatch('setMicrocosm', { microcosm })
// } else {
// console.log('no')
// // go home
// }
},
methods: {
loadData() {
var othersFiltered = this.otherNodes.otherNodes.filter(
(nodes) => nodes.node_deleted == false
)
this.$store.dispatch('getOthernodes')
this.otherArray = othersFiltered
},
},
}
</script>
<style scoped></style>
......@@ -23,7 +23,17 @@ const routes = [
// this generates a separate chunk (credits.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () =>
import(/* webpackChunkName: "credits" */ '../views/Collect.vue'),
import(/* webpackChunkName: "collect" */ '../views/Collect.vue'),
},
{
path: '/cards',
name: 'Cards',
// route level code-splitting
// this generates a separate chunk (credits.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () =>
import(/* webpackChunkName: "cards" */ '../views/Cards.vue'),
},
]
......
......@@ -42,6 +42,7 @@ export const mutations = {
nodeid: state.myNodes[end].node_id,
nodetext: state.myNodes[end].node_text,
}
// OLD CODE:
// this was to set quick focus on new nodes
// i think... need to check old code
state.activeNode = newNode
......@@ -92,8 +93,6 @@ export const mutations = {
})
},
// TODO: Get other nodes from all other devices
EDIT_NODE(state, e) {
var i
for (i = 0; i < Object.keys(state.myNodes).length; i++) {
......
var pouchdb
// PRETTY SURE this is wrong
import * as store from '@/store/store.js'
export const state = {
allNodes: [],
otherNodes: [],
}
export const mutations = {
GET_ALL_NODES(state) {
pouchdb
.allDocs({
include_docs: true,
attachments: true,
})
.then(function (doc) {
state.allNodes = doc.rows
// TODO: THIS IS NOT working
store.commit('SET_OTHER_NODES')
})
.catch(function (err) {
console.log(err)
})
},
SET_OTHER_NODES(state) {
state.otherNodes = []
var i
var j
for (i = 0; i < Object.keys(state.allNodes).length; i++) {
for (j = 0; j < Object.keys(state.allNodes[i].doc.nodes).length; j++) {
const newNode = {
id: state.allNodes[i].doc.nodes[j].node_id,
text: state.allNodes[i].doc.nodes[j].node_text,
deleted: state.allNodes[i].doc.nodes[j].node_deleted,
color: state.allNodes[i].doc.nodes[j].node_color,
}
state.otherNodes.push(newNode)
}
}
},
}
export const actions = {
getOthernodes: ({ commit }) => {
commit('GET_ALL_NODES')
},
getMicrocosm(vuexContext) {
pouchdb = vuexContext.rootState.setup.pouchdb
},
}
export const getters = {}
......@@ -2,12 +2,14 @@ import { createStore } from 'vuex'
import * as setup from '@/store/modules/setup.js'
import * as myNodes from '@/store/modules/myNodes.js'
import * as otherNodes from '@/store/modules/otherNodes.js'
export const store = createStore({
//
modules: {
setup,
myNodes,
otherNodes,
},
actions: {},
......
<template>
<ToolBar @added-node="addedNode" />
<MyNodes :added="added" />
<OtherNodes />
</template>
<script>
// @ is an alias to /src
import ToolBar from '@/components/ToolBar.vue'
import MyNodes from '@/components/MyNodes.vue'
import OtherNodes from '@/components/OtherNodes.vue'
export default {
mounted() {
this.$store.dispatch('getMicrocosm')
},
name: 'Collect',
components: {
ToolBar,
MyNodes,
OtherNodes,
},
data() {
return {
added: false,
}
},
methods: {
addedNode() {
this.added = !this.added
},
},
}
</script>
<style scoped></style>
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment