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
<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>
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment