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

updated

added readmode to state, added icon for iOS home screen.
parent bce6dbaa
No related branches found
No related tags found
No related merge requests found
<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-for="value in myNodes" v-bind:key="value.node_id">
<div v-if="value.readmode == false">
<div v-if="posvalue.read_mode == false">
<div v-for="value in myNodes" v-bind:key="value.node_id">
<textarea
v-if="nodeid == value.node_id"
@focus="editTrue(true)"
......@@ -31,11 +29,11 @@
placeholder="Idea goes here!"
></textarea>
</div>
<!-- FIXME: What is this doing below now ? Looks old -->
<div v-else>
<p :id="nodeid" :inner-html.prop="nodetext | marked"></p>
</div>
</div>
<div v-if="posvalue.read_mode == true">
<p :id="nodeid" :inner-html.prop="nodetext | marked"></p>
</div>
<h3>Reactions</h3>
<div v-for="(emojis, index) in configEmoji" :key="index">
......@@ -49,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"
......@@ -78,8 +88,8 @@
style="background-color: rgb(205, 234, 255);"
>
<form>
<div v-for="value in myNodes" v-bind:key="value.node_id">
<div v-if="value.readmode == false">
<div v-if="posvalue.read_mode == false">
<div v-for="value in myNodes" v-bind:key="value.node_id">
<textarea
v-if="nodeid == value.node_id"
@focus="editTrue(true)"
......@@ -93,15 +103,11 @@
placeholder="Idea goes here!"
></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>
</div>
<div v-if="posvalue.read_mode == true">
<p :id="nodeid" :inner-html.prop="nodetext | marked"></p>
</div>
<h3>Reactions</h3>
<div v-for="(emojis, index) in configEmoji" :key="index">
......@@ -115,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>
......@@ -143,14 +159,13 @@ export default {
nodewidth: Number,
nodeheight: Number,
deleted: Boolean,
readmode: Boolean,
},
data() {
return {
pickupz: 99,
// localreadmode: this.readmode,
mode: 'Read',
localreadmode: false,
mode: '',
}
},
......@@ -261,7 +276,14 @@ export default {
readFlag(e) {
e = this.nodeid
if (readmode == true) {
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'
......
......@@ -185,7 +185,6 @@ const store = new Vuex.Store({
content_type: 'sheet',
// NOTE: first node is hidden due to no position
deleted: true,
readmode: false,
attachment_name: '',
},
],
......@@ -325,7 +324,6 @@ const store = new Vuex.Store({
node_owner: state.myclient,
content_type: 'sheet',
deleted: false,
readmode: false,
attachment_name: e,
})
}
......@@ -363,6 +361,7 @@ const store = new Vuex.Store({
width: 200,
height: 275,
z_index: 1,
read_mode: false,
})
return pouchdb
.put({
......@@ -443,27 +442,29 @@ const store = new Vuex.Store({
READ_FLAG(state, e) {
var i
for (i = 0; i < Object.keys(state.myNodes).length; i++) {
if (e.e == state.myNodes[i].node_id) {
state.myNodes[i].readmode = e.readmode
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.myclient)
.get(state.global_pos_name)
.then(function (doc) {
// console.log(doc)
// put the store into pouchdb
return pouchdb.bulkDocs([
{
_id: state.myclient,
_id: state.global_pos_name,
_rev: doc._rev,
_attachments: doc._attachments,
nodes: state.myNodes,
positions: state.configPositions,
},
])
})
.then(function () {
return pouchdb.get(state.myclient).then(function (doc) {
state.myNodes = doc.nodes
return pouchdb.get(state.global_pos_name).then(function (doc) {
state.configPositions = doc.positions
})
})
.catch(function (err) {
......@@ -472,6 +473,7 @@ const store = new Vuex.Store({
}
})
},
GET_EMOJI(state) {
console.log
pouchdb
......@@ -528,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')
......@@ -550,7 +557,6 @@ const store = new Vuex.Store({
})
.on('complete', function () {
// handle complete
//console.log('complete')
})
.on('error', function (err) {
console.log(err)
......@@ -567,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)
},
......@@ -597,10 +606,7 @@ const store = new Vuex.Store({
// var text = e.target.value
commit('DELETE_FLAG', e)
},
readFlag: ({ commit }, e) => {
// var text = e.target.value
commit('READ_FLAG', e)
},
addEmoji: ({ commit }, { nodeid, emojitext }) => {
commit('ADD_EMOJI', {
nodeid,
......
......@@ -24,7 +24,7 @@
v-bind:key="value.node_id"
v-bind:nodeid="value.node_id"
v-bind:nodetext="value.node_text"
v-bind:readmode="value.readmode"
/>
</PanZoomContainer>
<!-- <SelectionLayer
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment