Administrator approval is now required for registering new accounts. If you are registering a new account, and are external to the University, please ask the repository owner to contact ServiceLine to request your account be approved. Repository owners must include the newly registered email address, and specific repository in the request for approval.

Commit a976448d authored by Adam Procter's avatar Adam Procter
Browse files

Merge branch 'futurenogg' into main

parents e25a27b3 026c457b
<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">
<form class="nodes">
<template v-if="nodes.node_readmode == false">
<textarea
v-model="nodes.node_text"
@input="editNode"
:id="nodes.node_id"
ref="textentry"
placeholder="Type your thoughts and ideas here! (auto saved every keystroke)"
rows="5"
></textarea>
<p class="info">*markdown supported &amp; autosaves</p>
<button>Colour</button>
<button>Read</button>
<button>Discard</button>
</template>
<!-- <template v-if="nodes.node_readmode == false"> -->
<textarea
v-model="nodes.node_text"
@input="editNode"
:id="nodes.node_id"
ref="textentry"
placeholder="Type your thoughts and ideas here! (auto saved every keystroke)"
rows="5"
></textarea>
<p class="info">*markdown supported &amp; autosaves</p>
<button>Colour</button>
<button>Read</button>
<button>Discard</button>
<!-- </template>
<template v-else>
<p
class="readmode"
:id="nodes.node_id"
:inner-html.prop="nodes.node_text"
></p>
</template>
</template> -->
</form>
</div>
</template>
......@@ -47,14 +47,14 @@ export default {
computed: {
...mapState({
// TODO: Can you filter here instead ?
myNodes: (state) => state.myNodes,
}),
},
nodesFiltered: function () {
return this.myNodes.myNodes.filter((nodes) => {
return nodes.node_deleted == false
})
watch: {
added: function () {
setTimeout(this.loadData, 500)
},
},
......@@ -73,13 +73,21 @@ export default {
},
methods: {
emptyData() {
if (this.myNodes.myNodes == 0) {
/// that
} else {
// this
}
},
loadData() {
// console.log('loading data')
var nodesFiltered = this.myNodes.myNodes.filter(
(nodes) => nodes.node_deleted == false
)
this.$store.dispatch('getMynodes')
this.myArray = nodesFiltered.reverse()
// console.log(this.myArray.length)
},
editNode(e) {
......
<template>
<div
class="nodes"
v-for="(nodes, index) in otherNodes.otherNodes"
:key="index"
>
<p class="readmode" :id="nodes.id">
{{ nodes.text }}
</p>
</div>
</template>
<script>
// @ is an alias to /src
import { mapState } from 'vuex'
// import marked from 'marked'
export default {
name: 'OtherNodes',
computed: {
...mapState({
otherNodes: (state) => state.otherNodes,
}),
},
mounted() {
this.$store.dispatch('getOthernodes')
setTimeout(this.loadData, 500)
setInterval(this.loadData, 5000)
},
methods: {
loadData() {
this.$store.dispatch('setOthernodes')
},
},
}
</script>
<style scoped>
.nodes {
width: 95%;
background-color: rgb(155, 194, 216);
margin-top: 1em;
margin-left: 0.5em;
}
</style>
......@@ -5,6 +5,7 @@
<button>Make Connections</button>
<UploadMedia />
<button @click="exitMicrocosm()">Exit</button>
<p>{{ microcosm }}</p>
</div>
</template>
......@@ -19,7 +20,13 @@ export default {
UploadMedia,
},
data() {
return {}
return {
microcosm: 'microcosm name',
}
},
mounted() {
this.microcosm = localStorage.getItem('nogg_microcosm')
},
mixins: [
......@@ -39,7 +46,6 @@ export default {
this.$store.dispatch('addNode')
},
exitMicrocosm() {
localStorage.removeItem('nogg_microcosm')
localStorage.removeItem('nogg_name')
......
......@@ -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
......@@ -53,28 +54,45 @@ export const mutations = {
})
})
.catch(function (err) {
// TODO: Does this situation ever hit 404 ?
console.log(err)
// HITS a 404 on very first node being created
if (err.status == 404) {
var uniqueid =
Math.random().toString(36).substring(2, 15) +
Math.random().toString(36).substring(2, 15)
pouchdb.put({
_id: deviceName,
nodes: [
{
node_id: uniqueid,
node_text: '',
node_owner: deviceName,
node_type: 'sheet',
node_shape: 'square',
node_deleted: false,
node_readmode: false,
node_color: '#9bc2d8',
},
],
})
pouchdb
.put({
_id: deviceName,
nodes: [
{
node_id: uniqueid,
node_text: '',
node_owner: deviceName,
node_type: 'sheet',
node_shape: 'square',
node_deleted: false,
node_readmode: false,
node_color: '#9bc2d8',
},
],
})
.then(function () {
return pouchdb.get(deviceName).then(function (doc) {
state.myNodes = doc.nodes
var end = Object.keys(state.myNodes).length - 1
const newNode = {
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
})
})
.catch(function (err) {
console.log(err)
})
}
})
},
......@@ -87,13 +105,11 @@ export const mutations = {
state.myNodes = doc.nodes
}
})
.catch(function (err) {
console.log(err)
.catch(function () {
// console.log(err)
})
},
// TODO: Get other nodes from all other devices
EDIT_NODE(state, e) {
var i
for (i = 0; i < Object.keys(state.myNodes).length; i++) {
......@@ -132,8 +148,8 @@ export const actions = {
commit('ADD_NODE', e)
},
getMynodes: ({ commit }, e) => {
commit('GET_MY_NODES', e)
getMynodes: ({ commit }) => {
commit('GET_MY_NODES')
},
editNode: ({ commit }, { nodeid, nodetext }) => {
......
var pouchdb
var deviceName
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
})
.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++) {
if (state.allNodes[i].id != deviceName) {
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')
commit('SET_OTHER_NODES')
},
setOthernodes: ({ commit }) => {
commit('SET_OTHER_NODES')
},
getMicrocosm(vuexContext) {
deviceName = vuexContext.rootState.setup.deviceName
pouchdb = vuexContext.rootState.setup.pouchdb
},
}
export const getters = {}
......@@ -79,8 +79,7 @@ export const actions = {
retry: true,
})
.on('change', function () {
// console.log('change happened')
// vuexContext.dispatch('getNodes', null, { root: true })
vuexContext.dispatch('getOthernodes', null, { root: true })
})
.on('paused', function () {})
.on('active', function () {
......
......@@ -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" />
<OtherNodes />
<MyNodes :added="added" />
</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>
<template>
<ToolBar @added-node="addedNode" />
<MyNodes :added="added" :key="componentKey" />
<MyNodes :added="added" />
</template>
<script>
......@@ -11,6 +11,8 @@ import MyNodes from '@/components/MyNodes.vue'
export default {
mounted() {
this.$store.dispatch('getMicrocosm')
// register, i.e. in a `beforeDestroy` hook
window.addEventListener('unload', this.someMethod)
},
name: 'Collect',
......@@ -21,20 +23,21 @@ export default {
data() {
return {
componentKey: 0,
added: true,
added: false,
}
},
methods: {
addedNode() {
//console.log('I hear you!')
this.added = !this.added
this.forceRender()
},
forceRender() {
// reloads the data after adding a node
this.componentKey += 1
someMethod() {
localStorage.removeItem('nogg_microcosm')
localStorage.removeItem('nogg_name')
location.assign(
process.env.VUE_APP_HTTP + '://' + process.env.VUE_APP_URL + '/'
)
},
},
}
......
Markdown is supported
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