diff --git a/app/public/index.html b/app/public/index.html
index 730b64f6e74faab644e8e7d99b12233b07378463..41053a248aedda3148795599f366f8c86e365d2b 100644
--- a/app/public/index.html
+++ b/app/public/index.html
@@ -33,6 +33,7 @@
<meta property="twitter:creator" content="@nodenoggin" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
+ <link rel="apple-touch-icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
diff --git a/app/src/components/NodesLayer.vue b/app/src/components/NodesLayer.vue
index 5088fdd19a12da5b82763b1b704cac2ba7c2bd74..ac547ba8011533288c222a86129103bf4eec291d 100644
--- a/app/src/components/NodesLayer.vue
+++ b/app/src/components/NodesLayer.vue
@@ -1,23 +1,21 @@
<template>
<div ref="nodes" class="node">
- <div v-for="(value, index) in configPositions" v-bind:key="index">
+ <div v-for="(posvalue, index) in configPositions" v-bind:key="index">
<div v-if="toolmode == 'move'">
- <!-- make draggable false as we are panning around -->
<vue-draggable-resizable
class="innernode"
- v-if="nodeid == value.node_id"
- :w="value.width"
- :h="value.height"
- :x="value.x_pos"
- :y="value.y_pos"
- :z="value.z_index"
+ v-if="nodeid == posvalue.node_id"
+ :w="posvalue.width"
+ :h="posvalue.height"
+ :x="posvalue.x_pos"
+ :y="posvalue.y_pos"
+ :z="posvalue.z_index"
:draggable="false"
style="background-color: rgb(205, 234, 255);"
>
<form>
- <div v-if="readmode == false">
+ <div v-if="posvalue.read_mode == false">
<div v-for="value in myNodes" v-bind:key="value.node_id">
- <!-- <div v-if="readmode == false"> -->
<textarea
v-if="nodeid == value.node_id"
@focus="editTrue(true)"
@@ -32,11 +30,8 @@
></textarea>
</div>
</div>
- <!-- FIXME: What is this doing below now ? Looks old -->
- <div v-else>
- <p :id="nodeid" :inner-html.prop="nodetext | marked">
- {{ nodeid }}
- </p>
+ <div v-if="posvalue.read_mode == true">
+ <p :id="nodeid" :inner-html.prop="nodetext | marked"></p>
</div>
<h3>Reactions</h3>
@@ -52,26 +47,38 @@
<BaseButton buttonClass="danger" @click="deleteFlag()"
>Delete</BaseButton
>
- <BaseButton
- class="read"
- buttonClass="action"
- @click="readFlag()"
- >{{ mode }}</BaseButton
- >
+ <div v-if="posvalue.read_mode == true">
+ <BaseButton
+ class="read"
+ buttonClass="action"
+ @click="readFlag()"
+ >Edit
+ </BaseButton>
+ </div>
+ <div v-else>
+ <BaseButton
+ class="read"
+ buttonClass="action"
+ @click="readFlag()"
+ >Read</BaseButton
+ >
+ </div>
</div>
</form>
</vue-draggable-resizable>
</div>
+ <!-- Same code as above when in any other mode other than move so you can drag nodes-->
+
<div v-else>
<vue-draggable-resizable
class="innernode"
- v-if="nodeid == value.node_id"
- :w="value.width"
- :h="value.height"
- :x="value.x_pos"
- :y="value.y_pos"
- :z="value.z_index"
+ v-if="nodeid == posvalue.node_id"
+ :w="posvalue.width"
+ :h="posvalue.height"
+ :x="posvalue.x_pos"
+ :y="posvalue.y_pos"
+ :z="posvalue.z_index"
@activated="onActivated"
@dragging="onDrag"
@resizing="onResize"
@@ -81,9 +88,8 @@
style="background-color: rgb(205, 234, 255);"
>
<form>
- <div v-if="readmode == false">
+ <div v-if="posvalue.read_mode == false">
<div v-for="value in myNodes" v-bind:key="value.node_id">
- <!-- <div v-if="readmode == false"> -->
<textarea
v-if="nodeid == value.node_id"
@focus="editTrue(true)"
@@ -98,11 +104,8 @@
></textarea>
</div>
</div>
- <!-- FIXME: What is this doing below now ? Looks old -->
- <div v-else>
- <p :id="nodeid" :inner-html.prop="nodetext | marked">
- {{ nodeid }}
- </p>
+ <div v-if="posvalue.read_mode == true">
+ <p :id="nodeid" :inner-html.prop="nodetext | marked"></p>
</div>
<h3>Reactions</h3>
@@ -118,12 +121,22 @@
<BaseButton buttonClass="danger" @click="deleteFlag()"
>Delete</BaseButton
>
- <BaseButton
- class="read"
- buttonClass="action"
- @click="readFlag()"
- >{{ mode }}</BaseButton
- >
+ <div v-if="posvalue.read_mode == true">
+ <BaseButton
+ class="read"
+ buttonClass="action"
+ @click="readFlag()"
+ >Edit
+ </BaseButton>
+ </div>
+ <div v-else>
+ <BaseButton
+ class="read"
+ buttonClass="action"
+ @click="readFlag()"
+ >Read</BaseButton
+ >
+ </div>
</div>
</form>
</vue-draggable-resizable>
@@ -135,6 +148,7 @@
<script>
import { mapState } from 'vuex'
import marked from 'marked'
+var readmode
export default {
name: 'NodesLayer',
@@ -150,8 +164,8 @@ export default {
data() {
return {
pickupz: 99,
- readmode: false,
- mode: 'Read',
+ localreadmode: false,
+ mode: '',
}
},
@@ -259,12 +273,23 @@ export default {
e = this.nodeid
this.$store.dispatch('deleteFlag', { e })
},
- readFlag() {
- if (this.readmode == true) {
- this.readmode = false
+ readFlag(e) {
+ e = this.nodeid
+
+ var i
+ for (i = 0; i < Object.keys(this.configPositions).length; i++) {
+ if (this.configPositions[i].node_id == this.nodeid) {
+ this.localreadmode = this.configPositions[i].read_mode
+ }
+ }
+
+ if (this.localreadmode == true) {
+ readmode = false
+ this.$store.dispatch('readFlag', { e, readmode })
this.mode = 'Read'
} else {
- this.readmode = true
+ readmode = true
+ this.$store.dispatch('readFlag', { e, readmode })
this.mode = 'Edit'
}
},
@@ -278,7 +303,6 @@ export default {
position: relative;
}
-
.info {
font-size: 0.8em;
}
diff --git a/app/src/store/index.js b/app/src/store/index.js
index 520424df20989a95b87bf92973d524db985cd927..daf70c374cb303be270039a2931a7a8eb61140fa 100644
--- a/app/src/store/index.js
+++ b/app/src/store/index.js
@@ -36,6 +36,8 @@ var remote =
microcosm +
'/'
+//var remotetwo = 'http://127.0.0.1:5984/'
+
console.log(remote)
const store = new Vuex.Store({
state: {
@@ -359,6 +361,7 @@ const store = new Vuex.Store({
width: 200,
height: 275,
z_index: 1,
+ read_mode: false,
})
return pouchdb
.put({
@@ -436,6 +439,41 @@ const store = new Vuex.Store({
}
})
},
+
+ READ_FLAG(state, e) {
+ var i
+ console.log(e.e)
+ for (i = 0; i < Object.keys(state.configPositions).length; i++) {
+ if (e.e == state.configPositions[i].node_id) {
+ state.configPositions[i].read_mode = e.readmode
+ }
+ }
+
+ pouchdb
+ .get(state.global_pos_name)
+ .then(function (doc) {
+ // console.log(doc)
+ // put the store into pouchdb
+ return pouchdb.bulkDocs([
+ {
+ _id: state.global_pos_name,
+ _rev: doc._rev,
+ positions: state.configPositions,
+ },
+ ])
+ })
+ .then(function () {
+ return pouchdb.get(state.global_pos_name).then(function (doc) {
+ state.configPositions = doc.positions
+ })
+ })
+ .catch(function (err) {
+ if (err.status == 404) {
+ // pouchdb.put({ })
+ }
+ })
+ },
+
GET_EMOJI(state) {
console.log
pouchdb
@@ -492,7 +530,12 @@ const store = new Vuex.Store({
store.commit('GET_EMOJI')
// turn on two-way, continuous, retriable sync
pouchdb
- .sync(remote, { live: true, retry: true, attachments: true })
+ .sync(remote, {
+ live: true,
+ since: 'now',
+ retry: true,
+ attachments: true,
+ })
.on('change', function () {
// pop info into function to find out more
store.commit('GET_ALL_NODES')
@@ -514,7 +557,6 @@ const store = new Vuex.Store({
})
.on('complete', function () {
// handle complete
- //console.log('complete')
})
.on('error', function (err) {
console.log(err)
@@ -531,7 +573,10 @@ const store = new Vuex.Store({
movePos: ({ commit }, nodeid, xpos, ypos, width, height, zindex) => {
commit('MOVE_POS', nodeid, xpos, ypos, width, height, zindex)
},
-
+ readFlag: ({ commit }, e) => {
+ // var text = e.target.value
+ commit('READ_FLAG', e)
+ },
addNode: ({ commit }, e) => {
commit('ADD_NODE', e)
},
@@ -561,6 +606,7 @@ const store = new Vuex.Store({
// var text = e.target.value
commit('DELETE_FLAG', e)
},
+
addEmoji: ({ commit }, { nodeid, emojitext }) => {
commit('ADD_EMOJI', {
nodeid,
diff --git a/app/src/views/Sandbox.vue b/app/src/views/Sandbox.vue
index 7b69b747fec615d14d4e2204674e9d2a37c804ea..67c9a5c41f6c193bf2931ac7723ce56573c6bd0d 100644
--- a/app/src/views/Sandbox.vue
+++ b/app/src/views/Sandbox.vue
@@ -24,6 +24,7 @@
v-bind:key="value.node_id"
v-bind:nodeid="value.node_id"
v-bind:nodetext="value.node_text"
+
/>
</PanZoomContainer>
<!-- <SelectionLayer