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

Merge branch 'schema1'

parents 0e0432f7 fce0022a
Branches
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 141 additions and 111 deletions
CHANGELOG.md
+ 12
− 0
View file @ e89ddedd
# 0.1.4
_11th March 2020_
### Added
- Added a SCHEMA.md document to the repo to outline the way to call to the data in PouchDB/ CouchDB
### Changed
- Changed store/index.js, Home.vue, NodesLayer.vue and OtherNodeslayer.vue to work with new Schema structure
# 0.1.3 # 0.1.3
_4th March 2020_ _4th March 2020_
......
SCHEMA.md
+ 3
− 2
View file @ e89ddedd
...@@ -26,7 +26,7 @@ This is version 1 of the API documents to be created. For now this document outl ...@@ -26,7 +26,7 @@ This is version 1 of the API documents to be created. For now this document outl
"connect_id": "xboi6bducmngjv0yrgdhpf", "connect_id": "xboi6bducmngjv0yrgdhpf",
"start_id": "7nltu5jdotbeb6t9hgm9dd", "start_id": "7nltu5jdotbeb6t9hgm9dd",
"end_id": "z67hbvdxr8nrsixn5nt6b9", "end_id": "z67hbvdxr8nrsixn5nt6b9",
"connected": true "connected": "true"
} }
] ]
...@@ -43,7 +43,8 @@ This is version 1 of the API documents to be created. For now this document outl ...@@ -43,7 +43,8 @@ This is version 1 of the API documents to be created. For now this document outl
"x_pos": 831, "x_pos": 831,
"y_pos": 293, "y_pos": 293,
"width": 386, "width": 386,
"height": 417 "height": 417,
"z_index":1
} }
] ]
......
app/babel.config.js
+ 2
− 2
View file @ e89ddedd
module.exports = { module.exports = {
presets: ["@vue/cli-plugin-babel/preset"] presets: ['@vue/cli-plugin-babel/preset']
}; }
app/package.json
+ 1
− 1
View file @ e89ddedd
{ {
"name": "nodenogg.in", "name": "nodenogg.in",
"version": "0.1.3", "version": "0.1.4",
"private": true, "private": true,
"scripts": { "scripts": {
"serve": "vue-cli-service serve", "serve": "vue-cli-service serve",
......
app/src/components/NodesLayer.vue
+ 37
− 28
View file @ e89ddedd
...@@ -3,11 +3,12 @@ ...@@ -3,11 +3,12 @@
<div v-for="(value, index) in configPositions" v-bind:key="index"> <div v-for="(value, index) in configPositions" v-bind:key="index">
<vue-draggable-resizable <vue-draggable-resizable
class="innernode" class="innernode"
v-if="nodeid == value.nodeid" v-if="nodeid == value.node_id"
:w="value.width" :w="value.width"
:h="value.height" :h="value.height"
:x="value.xpos" :x="value.x_pos"
:y="value.ypos" :y="value.y_pos"
:z="value.z_index"
@activated="onActivated" @activated="onActivated"
@dragging="onDrag" @dragging="onDrag"
@resizing="onResize" @resizing="onResize"
...@@ -17,24 +18,19 @@ ...@@ -17,24 +18,19 @@
style="background-color: rgb(205, 234, 255)" style="background-color: rgb(205, 234, 255)"
> >
<form> <form>
<div v-for="value in myNodes" v-bind:key="value.nodeid"> <div v-for="value in myNodes" v-bind:key="value.node_id">
<textarea <textarea
v-if="nodeid == value.nodeid" v-if="nodeid == value.node_id"
@input="editNode" @input="editNode"
v-model="value.nodetext" v-model="value.node_text"
:id="nodeid" :id="nodeid"
class="drag-cancel" class="drag-cancel"
></textarea> ></textarea>
</div> </div>
<h3>Reactions</h3> <h3>Reactions</h3>
<div v-for="(emojis, index) in configEmoji" :key="index"> <div v-for="(emojis, index) in configEmoji" :key="index">
<p class="allemoji" v-if="nodeid == emojis.docid">{{ emojis.emojitext }}</p> <p class="allemoji" v-if="nodeid == emojis.node_id">{{ emojis.emoji_text }}</p>
</div> </div>
<!-- <div v-for="(value, index) in configPositions" v-bind:key="index">
<p v-if="nodeid == value.nodeid">
{{ localx }}, ({{ value.xpos }}) {{ localy }}
</p>
</div>-->
<p>markdown supported</p> <p>markdown supported</p>
<button class="danger" @click="deleteFlag()">Delete</button> <button class="danger" @click="deleteFlag()">Delete</button>
...@@ -59,12 +55,7 @@ export default { ...@@ -59,12 +55,7 @@ export default {
data() { data() {
return { return {
thistext: this.nodetext, pickupz: 99
width: this.nodewidth,
height: this.nodeheight,
localx: 0,
localy: 0,
globalscale: 0.7
} }
}, },
...@@ -79,8 +70,9 @@ export default { ...@@ -79,8 +70,9 @@ export default {
methods: { methods: {
onActivated() { onActivated() {
var i var i
for (i = 0; i < Object.keys(this.configPositions).length; i++) { for (i = 0; i < Object.keys(this.configPositions).length; i++) {
if (this.configPositions[i].nodeid == this.nodeid) { if (this.configPositions[i].node_id == this.nodeid) {
this.width = this.configPositions[i].width this.width = this.configPositions[i].width
this.height = this.configPositions[i].height this.height = this.configPositions[i].height
} }
...@@ -92,36 +84,53 @@ export default { ...@@ -92,36 +84,53 @@ export default {
this.width = width this.width = width
this.height = height this.height = height
}, },
onResizestop(x, y, width, height) { onResizestop(x, y, width, height, zindex) {
var localnodeid = this.nodeid var localnodeid = this.nodeid
zindex = this.pickupz
var i var i
for (i = 0; i < Object.keys(this.configPositions).length; i++) { for (i = 0; i < Object.keys(this.configPositions).length; i++) {
if (this.configPositions[i].nodeid == this.nodeid) { if (this.configPositions[i].node_id == this.nodeid) {
this.width = this.configPositions[i].width this.width = this.configPositions[i].width
this.height = this.configPositions[i].height this.height = this.configPositions[i].height
this.pickupz = this.configPositions[i].z_index
} }
} }
this.width = width this.width = width
this.height = height this.height = height
this.$store.dispatch('movePos', { localnodeid, x, y, width, height }) this.$store.dispatch('movePos', {
localnodeid,
x,
y,
width,
height,
zindex
})
}, },
onDrag(x, y) { onDrag(x, y) {
this.localx = x this.localx = x
this.localy = y this.localy = y
}, },
onDragstop(x, y, width, height) { onDragstop(x, y, width, height, zindex) {
var localnodeid = this.nodeid var localnodeid = this.nodeid
zindex = this.pickupz
width = this.width width = this.width
height = this.height height = this.height
var i var i
for (i = 0; i < Object.keys(this.configPositions).length; i++) { for (i = 0; i < Object.keys(this.configPositions).length; i++) {
if (this.configPositions[i].nodeid == this.nodeid) { if (this.configPositions[i].node_id == this.nodeid) {
this.localx = this.configPositions[i].xpos this.localx = this.configPositions[i].x_pos
this.localy = this.configPositions[i].ypos this.localy = this.configPositions[i].y_pos
this.pickupz = this.configPositions[i].z_index
} }
} }
this.$store.dispatch('movePos', { localnodeid, x, y, width, height }) this.$store.dispatch('movePos', {
localnodeid,
x,
y,
width,
height,
zindex
})
}, },
setFocus() { setFocus() {
......
app/src/components/OnBoard.vue
+ 1
− 3
View file @ e89ddedd
...@@ -5,9 +5,7 @@ ...@@ -5,9 +5,7 @@
nodenogg.in is a nodenogg.in is a
<span>work in progress</span> collaborative co-creation research and <span>work in progress</span> collaborative co-creation research and
design thinking tool, read more details and links in the design thinking tool, read more details and links in the
<a <a href="/#/about">about</a> section.
href="/#/about"
>about</a> section.
</p> </p>
<form v-show="parta"> <form v-show="parta">
......
app/src/components/OtherNodeslayer.vue
+ 38
− 23
View file @ e89ddedd
...@@ -2,11 +2,12 @@ ...@@ -2,11 +2,12 @@
<div ref="othernodes" class="node"> <div ref="othernodes" class="node">
<div v-for="(value, index) in configPositions" v-bind:key="index"> <div v-for="(value, index) in configPositions" v-bind:key="index">
<vue-draggable-resizable <vue-draggable-resizable
v-if="nodeid == value.nodeid" v-if="nodeid == value.node_id"
:w="value.width" :w="value.width"
:h="value.height" :h="value.height"
:x="value.xpos" :x="value.x_pos"
:y="value.ypos" :y="value.y_pos"
:z="value.z_index"
@activated="onActivated" @activated="onActivated"
@dragging="onDrag" @dragging="onDrag"
@resizing="onResize" @resizing="onResize"
...@@ -17,7 +18,7 @@ ...@@ -17,7 +18,7 @@
<p :id="nodeid" :inner-html.prop="nodetext | marked">{{ nodeid }}</p> <p :id="nodeid" :inner-html.prop="nodetext | marked">{{ nodeid }}</p>
<h3>Reactions</h3> <h3>Reactions</h3>
<div v-for="(emojis, index) in configEmoji" :key="index"> <div v-for="(emojis, index) in configEmoji" :key="index">
<p class="allemoji" v-if="nodeid == emojis.docid">{{ emojis.emojitext }}</p> <p class="allemoji" v-if="nodeid == emojis.node_id">{{ emojis.emoji_text }}</p>
</div> </div>
<div class="react" v-if="nodeid != undefined"> <div class="react" v-if="nodeid != undefined">
<h2>React</h2> <h2>React</h2>
...@@ -91,13 +92,9 @@ export default { ...@@ -91,13 +92,9 @@ export default {
data() { data() {
return { return {
thistext: this.nodetext,
width: this.nodewidth,
height: this.nodeheight,
localx: 0,
localy: 0,
input: '', input: '',
search: '' search: '',
pickupz: 99
} }
}, },
...@@ -115,9 +112,10 @@ export default { ...@@ -115,9 +112,10 @@ export default {
onActivated() { onActivated() {
var i var i
for (i = 0; i < Object.keys(this.configPositions).length; i++) { for (i = 0; i < Object.keys(this.configPositions).length; i++) {
if (this.configPositions[i].nodeid == this.nodeid) { if (this.configPositions[i].node_id == this.nodeid) {
this.width = this.configPositions[i].width this.width = this.configPositions[i].width
this.height = this.configPositions[i].height this.height = this.configPositions[i].height
this.pickupz = this.configPositions[i].z_index
} }
} }
}, },
...@@ -127,44 +125,62 @@ export default { ...@@ -127,44 +125,62 @@ export default {
this.width = width this.width = width
this.height = height this.height = height
}, },
onResizestop(x, y, width, height) { onResizestop(x, y, width, height, zindex) {
var localnodeid = this.nodeid var localnodeid = this.nodeid
zindex = this.pickupz
var i var i
for (i = 0; i < Object.keys(this.configPositions).length; i++) { for (i = 0; i < Object.keys(this.configPositions).length; i++) {
if (this.configPositions[i].nodeid == this.nodeid) { if (this.configPositions[i].node_id == this.nodeid) {
this.width = this.configPositions[i].width this.width = this.configPositions[i].width
this.height = this.configPositions[i].height this.height = this.configPositions[i].height
this.pickupz = this.configPositions[i].z_index
} }
} }
this.width = width this.width = width
this.height = height this.height = height
this.$store.dispatch('movePos', { localnodeid, x, y, width, height }) this.$store.dispatch('movePos', {
localnodeid,
x,
y,
width,
height,
zindex
})
}, },
onDrag(x, y) { onDrag(x, y) {
this.localx = x this.localx = x
this.localy = y this.localy = y
}, },
onDragstop(x, y, width, height) { onDragstop(x, y, width, height, zindex) {
var localnodeid = this.nodeid var localnodeid = this.nodeid
zindex = this.pickupz
width = this.width width = this.width
height = this.height height = this.height
var i var i
for (i = 0; i < Object.keys(this.configPositions).length; i++) { for (i = 0; i < Object.keys(this.configPositions).length; i++) {
if (this.configPositions[i].nodeid == this.nodeid) { if (this.configPositions[i].node_id == this.nodeid) {
this.localx = this.configPositions[i].xpos this.localx = this.configPositions[i].x_pos
this.localy = this.configPositions[i].ypos this.localy = this.configPositions[i].y_pos
this.pickupz = this.configPositions[i].z_index
} }
} }
this.$store.dispatch('movePos', { localnodeid, x, y, width, height }) this.$store.dispatch('movePos', {
localnodeid,
x,
y,
width,
height,
zindex
})
}, },
append(emoji) { append(emoji) {
this.input += emoji this.input += emoji
}, },
sentReact(docid, emojitext) { sentReact(nodeid, emojitext) {
emojitext = this.input emojitext = this.input
docid = this.nodeid nodeid = this.nodeid
this.$store.dispatch('addEmoji', { this.$store.dispatch('addEmoji', {
docid, nodeid,
emojitext emojitext
}) })
...@@ -183,7 +199,6 @@ export default { ...@@ -183,7 +199,6 @@ export default {
<!-- Add "scoped" attribute to limit CSS to this component only --> <!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped> <style scoped>
.node { .node {
background-color: aquamarine; background-color: aquamarine;
position: absolute; position: absolute;
......
app/src/store/index.js
+ 32
− 40
View file @ e89ddedd
...@@ -43,20 +43,8 @@ const store = new Vuex.Store({ ...@@ -43,20 +43,8 @@ const store = new Vuex.Store({
myclient: myclient, myclient: myclient,
activeNode: {}, activeNode: {},
// this will be objects containing arrays of all the handles / connections and nodes // this will be objects containing arrays of all the handles / connections and nodes
configConnect: { configConnect: {},
x: -25, configHandle: {},
y: -25,
height: 50,
width: 50,
fill: 'rgb(200, 0, 0)'
},
configHandle: {
x: 25,
y: 25,
height: 10,
width: 10,
fill: 'black'
},
allNodes: [], allNodes: [],
myNodes: [ myNodes: [
// { nodeid: 1, nodetext: 'node 1' }, // { nodeid: 1, nodetext: 'node 1' },
...@@ -115,7 +103,9 @@ const store = new Vuex.Store({ ...@@ -115,7 +103,9 @@ const store = new Vuex.Store({
for (i = 0; i < Object.keys(state.allNodes).length; i++) { for (i = 0; i < Object.keys(state.allNodes).length; i++) {
if ( if (
state.allNodes[i].id != state.myclient && state.allNodes[i].id != state.myclient &&
state.allNodes[i].id != state.global_pos_name state.allNodes[i].id != state.global_pos_name &&
state.allNodes[i].id != state.global_emoji_name &&
state.allNodes[i].id != state.global_con_name
) { ) {
for ( for (
j = 0; j = 0;
...@@ -123,8 +113,8 @@ const store = new Vuex.Store({ ...@@ -123,8 +113,8 @@ const store = new Vuex.Store({
j++ j++
) { ) {
const newNode = { const newNode = {
nodeid: state.allNodes[i].doc.nodes[j].nodeid, node_id: state.allNodes[i].doc.nodes[j].node_id,
nodetext: state.allNodes[i].doc.nodes[j].nodetext node_text: state.allNodes[i].doc.nodes[j].node_text
} }
state.otherNodes.push(newNode) state.otherNodes.push(newNode)
...@@ -162,9 +152,9 @@ const store = new Vuex.Store({ ...@@ -162,9 +152,9 @@ const store = new Vuex.Store({
// FIXME: these values are here as GET_ALL_NODES cant hunt a blank // FIXME: these values are here as GET_ALL_NODES cant hunt a blank
// this shouldnt need to be here // this shouldnt need to be here
nodeid: uniqueid, node_id: uniqueid,
nodetext: 'Ignore this node' + state.myclient, node_text: 'Ignore this node' + state.myclient,
nodeowner: state.myclient, node_owner: state.myclient,
content_type: 'sheet', content_type: 'sheet',
// TEMP: this hides the first node card as its effectivly auto deleted // TEMP: this hides the first node card as its effectivly auto deleted
deleted: true, deleted: true,
...@@ -196,11 +186,12 @@ const store = new Vuex.Store({ ...@@ -196,11 +186,12 @@ const store = new Vuex.Store({
MOVE_POS(state, e) { MOVE_POS(state, e) {
var i var i
for (i = 0; i < Object.keys(state.configPositions).length; i++) { for (i = 0; i < Object.keys(state.configPositions).length; i++) {
if (e.localnodeid == state.configPositions[i].nodeid) { if (e.localnodeid == state.configPositions[i].node_id) {
state.configPositions[i].xpos = e.x state.configPositions[i].x_pos = e.x
state.configPositions[i].ypos = e.y state.configPositions[i].y_pos = e.y
state.configPositions[i].width = e.width state.configPositions[i].width = e.width
state.configPositions[i].height = e.height state.configPositions[i].height = e.height
state.configPositions[i].z_index = e.zindex
} }
} }
...@@ -242,9 +233,9 @@ const store = new Vuex.Store({ ...@@ -242,9 +233,9 @@ const store = new Vuex.Store({
pouchdb.get(state.myclient).then(function(doc) { pouchdb.get(state.myclient).then(function(doc) {
if (e == undefined) { if (e == undefined) {
doc.nodes.push({ doc.nodes.push({
nodeid: uniqueid, node_id: uniqueid,
nodetext: '', node_text: '',
nodeowner: state.myclient, node_owner: state.myclient,
content_type: 'sheet', content_type: 'sheet',
deleted: false, deleted: false,
attachment_name: e attachment_name: e
...@@ -278,11 +269,12 @@ const store = new Vuex.Store({ ...@@ -278,11 +269,12 @@ const store = new Vuex.Store({
}) })
pouchdb.get(state.global_pos_name).then(function(doc) { pouchdb.get(state.global_pos_name).then(function(doc) {
doc.positions.push({ doc.positions.push({
nodeid: uniqueid, node_id: uniqueid,
xpos: 50, x_pos: 50,
ypos: 50, y_pos: 50,
width: 200, width: 200,
height: 250 height: 250,
z_index: 1
}) })
return pouchdb return pouchdb
.put({ .put({
...@@ -299,8 +291,8 @@ const store = new Vuex.Store({ ...@@ -299,8 +291,8 @@ const store = new Vuex.Store({
EDIT_NODE(state, e) { EDIT_NODE(state, e) {
var i var i
for (i = 0; i < Object.keys(state.myNodes).length; i++) { for (i = 0; i < Object.keys(state.myNodes).length; i++) {
if (e.nodeid == state.myNodes[i].nodeid) { if (e.nodeid == state.myNodes[i].node_id) {
state.myNodes[i].nodetext = e.nodetext state.myNodes[i].node_text = e.nodetext
} }
} }
pouchdb pouchdb
...@@ -332,7 +324,7 @@ const store = new Vuex.Store({ ...@@ -332,7 +324,7 @@ const store = new Vuex.Store({
DELETE_FLAG(state, e) { DELETE_FLAG(state, e) {
var i var i
for (i = 0; i < Object.keys(state.myNodes).length; i++) { for (i = 0; i < Object.keys(state.myNodes).length; i++) {
if (e.e == state.myNodes[i].nodeid) { if (e.e == state.myNodes[i].node_id) {
state.myNodes[i].deleted = true state.myNodes[i].deleted = true
} }
} }
...@@ -387,9 +379,9 @@ const store = new Vuex.Store({ ...@@ -387,9 +379,9 @@ const store = new Vuex.Store({
.substring(2, 15) .substring(2, 15)
pouchdb.get(state.global_emoji_name).then(function(doc) { pouchdb.get(state.global_emoji_name).then(function(doc) {
doc.emojis.push({ doc.emojis.push({
id: uniqueid, emoji_id: uniqueid,
docid: e.docid, node_id: e.nodeid,
emojitext: e.emojitext emoji_text: e.emojitext
}) })
return pouchdb return pouchdb
.put({ .put({
...@@ -448,8 +440,8 @@ const store = new Vuex.Store({ ...@@ -448,8 +440,8 @@ const store = new Vuex.Store({
commit('SET_CLIENT', e) commit('SET_CLIENT', e)
}, },
movePos: ({ commit }, nodeid, xpos, ypos, width, height) => { movePos: ({ commit }, nodeid, xpos, ypos, width, height, zindex) => {
commit('MOVE_POS', nodeid, xpos, ypos, width, height) commit('MOVE_POS', nodeid, xpos, ypos, width, height, zindex)
}, },
addNode: ({ commit }, e) => { addNode: ({ commit }, e) => {
...@@ -462,9 +454,9 @@ const store = new Vuex.Store({ ...@@ -462,9 +454,9 @@ const store = new Vuex.Store({
// var text = e.target.value // var text = e.target.value
commit('DELETE_FLAG', e) commit('DELETE_FLAG', e)
}, },
addEmoji: ({ commit }, { docid, emojitext }) => { addEmoji: ({ commit }, { nodeid, emojitext }) => {
commit('ADD_EMOJI', { commit('ADD_EMOJI', {
docid, nodeid,
emojitext emojitext
}) })
} }
......
app/src/views/About.vue
+ 8
− 5
View file @ e89ddedd
...@@ -23,7 +23,8 @@ ...@@ -23,7 +23,8 @@
version {{ myVersion }} - See full version {{ myVersion }} - See full
<a <a
href="https://gitlab.adamprocter.co.uk/nn/nodenoggin/-/blob/master/CHANGELOG.md" href="https://gitlab.adamprocter.co.uk/nn/nodenoggin/-/blob/master/CHANGELOG.md"
>Changelog</a> >Changelog</a
>
</h3> </h3>
<h3>known issues</h3> <h3>known issues</h3>
...@@ -51,9 +52,9 @@ ...@@ -51,9 +52,9 @@
</li> </li>
<li> <li>
&nbsp; &nbsp;
<a <a href="https://discursive.adamprocter.co.uk/categories/phd/"
href="https://discursive.adamprocter.co.uk/categories/phd/" >discursive (phd catergory link)</a
>discursive (phd catergory link)</a> >
(blog) (blog)
</li> </li>
<li> <li>
...@@ -76,7 +77,9 @@ ...@@ -76,7 +77,9 @@
</li> </li>
<li> <li>
&nbsp; &nbsp;
<a href="https://github.com/adamprocter/couchdoc-mirror/issues">issues</a> <a href="https://github.com/adamprocter/couchdoc-mirror/issues"
>issues</a
>
(raise and review) (raise and review)
</li> </li>
</ul> </ul>
......
app/src/views/Home.vue
+ 6
− 6
View file @ e89ddedd
...@@ -4,16 +4,16 @@ ...@@ -4,16 +4,16 @@
<div v-if="clientset"> <div v-if="clientset">
<OtherNodeslayer <OtherNodeslayer
v-for="value in otherNodes" v-for="value in otherNodes"
v-bind:key="value.nodeid" v-bind:key="value.node_id"
v-bind:nodeid="value.nodeid" v-bind:nodeid="value.node_id"
v-bind:nodetext="value.nodetext" v-bind:nodetext="value.node_text"
/> />
<NodesLayer <NodesLayer
v-for="value in myNodes" v-for="value in myNodes"
v-bind:key="value.nodeid" v-bind:key="value.node_id"
v-bind:nodeid="value.nodeid" v-bind:nodeid="value.node_id"
v-bind:nodetext="value.nodetext" v-bind:nodetext="value.node_text"
/> />
<CanvasLayer /> <CanvasLayer />
......
app/vue.config.js
+ 1
− 1
View file @ e89ddedd
process.env.VUE_APP_VERSION = require('./package.json').version process.env.VUE_APP_VERSION = require('./package.json').version
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment