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

Merge branch 'BugConnections' into main

parents c0e57053 6f9c7de2
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
app/src/components/ConnectionsLayer.vue
+ 37
− 13
View file @ 21f8d6bb
......@@ -63,13 +63,14 @@ export default {
fromnode = id
xposstart = xpos
yposstart = ypos
endState = true
//count = 1
// this.$store.dispatch('connectionState', true)
} else if (endState == true) {
tonode = id
xposend = xpos
yposend = ypos
// count = 0
// this.$store.dispatch('connectionState', false)
// console.log(fromnode, tonode, xposstart, yposstart, xposend, yposend)
......@@ -81,6 +82,7 @@ export default {
xposend,
yposend,
})
endState = false
}
},
buttonsDraw() {
......@@ -93,12 +95,16 @@ export default {
this.canvas = this.$refs.pixi
const stage = this.PIXIApp.stage
//const allButtons = new PIXI.Container()
for (i = 0; i < Object.keys(this.myNodes).length; i++) {
buttonMap[i] = new PIXI.Graphics()
// console.log(buttonMap[i])
for (j = 0; j < Object.keys(this.configPositions).length; j++) {
if (this.configPositions[j].node_id == this.myNodes[i].node_id) {
if (
this.configPositions[j].node_id == this.myNodes[i].node_id &&
this.myNodes[i].node_id == false
) {
buttonMap[i].name = this.myNodes[i].node_id
// console.log(button_one.name)
buttonMap[i].lineStyle(1)
......@@ -114,8 +120,9 @@ export default {
buttonMap[i].endFill()
// names it the last one only?
}
// allButtons.addChild(buttonMap[i])
// stage.addChild(allButtons)
stage.addChild(buttonMap[i])
// Opt-in to interactivity
buttonMap[i].interactive = true
// Shows hand cursor
......@@ -135,7 +142,10 @@ export default {
buttonMapOther[i] = new PIXI.Graphics()
// console.log(buttonMap[i])
for (j = 0; j < Object.keys(this.configPositions).length; j++) {
if (this.configPositions[j].node_id == this.otherNodes[i].node_id) {
if (
this.configPositions[j].node_id == this.otherNodes[i].node_id &&
this.myNodes[i].node_id == false
) {
buttonMapOther[i].name = this.otherNodes[i].node_id
// console.log(button_one.name)
buttonMapOther[i].lineStyle(1)
......@@ -169,21 +179,23 @@ export default {
}
let line = new PIXI.Graphics()
var initialMoveTo
let lines = []
function start(event) {
// console.log('start')
// console.log(this.getChildByName)
this.id = this.name
ref.makeConnection(this.id, event.data.global.x, event.data.global.y)
}
function finish(event) {
// console.log('finish')
this.id = this.name
ref.makeConnection(this.id, event.data.global.x, event.data.global.y)
if (this.id != fromnode) {
endState = true
ref.makeConnection(this.id, event.data.global.x, event.data.global.y)
} else {
endState = false
}
}
function onDragStart(event) {
......@@ -204,16 +216,28 @@ export default {
}
function onDragEnd() {
//console.log('end')
//endState = true
this.dragging = false
stage.removeChild(line)
}
function onDragEndOutside() {
// console.log('Outside')
endState = false
this.dragging = false
stage.removeChild(line)
// console.log('outside')
// console.log(this.name)
// console.log(fromnode)
// if (this.name != fromnode) {
// console.log('diff')
// endState = true
// this.dragging = false
// stage.removeChild(line)
// this.finish()
// }
// } else {
// endState = false
// this.dragging = false
// stage.removeChild(line)
// }
}
function onDragMove(event) {
......
app/src/components/NodesLayer.vue
+ 5
− 5
View file @ 21f8d6bb
......@@ -4,7 +4,7 @@
<div v-if="toolmode == 'move'">
<vue-draggable-resizable
class="innernode"
v-if="nodeid == value.node_id"
v-if="nodeid == value.node_id && deleted == false"
:w="value.width"
:h="value.height"
:x="value.x_pos"
......@@ -14,7 +14,7 @@
:resizable="false"
style="border: 2px dashed black; background-color: rgb(155, 194, 216)"
:min-width="200"
:min-height="370"
:min-height="220"
>
<form>
<div v-if="value.read_mode == false">
......@@ -85,7 +85,7 @@
<div v-else>
<vue-draggable-resizable
class="innernode"
v-if="nodeid == value.node_id"
v-if="nodeid == value.node_id && deleted == false"
:w="value.width"
:h="value.height"
:x="value.x_pos"
......@@ -99,7 +99,7 @@
:drag-cancel="'.drag-cancel'"
style="border: 2px dashed black; background-color: rgb(155, 194, 216)"
:min-width="200"
:min-height="370"
:min-height="220"
>
<form>
<div v-if="value.read_mode == false">
......@@ -142,7 +142,7 @@
<p class="info">*markdown supported &amp; autosaves</p>
<div class="btn-row">
<BaseButton buttonClass="danger" @click="deleteFlag()"
>Hide</BaseButton
>Discard</BaseButton
>
<div v-if="value.read_mode == true">
<BaseButton
......
app/src/components/OtherNodeslayer.vue
+ 2
− 2
View file @ 21f8d6bb
......@@ -19,7 +19,7 @@
@resizestop="onResizestop"
style="border: 2px solid black; background-color: rgb(205, 234, 255)"
:min-width="200"
:min-height="370"
:min-height="220"
>
<p class="read" :id="nodeid" :inner-html.prop="nodetext | marked">
{{ nodeid }}
......@@ -121,7 +121,7 @@
@resizestop="onResizestop"
style="border: 2px solid black; background-color: rgb(205, 234, 255)"
:min-width="200"
:min-height="370"
:min-height="220"
>
<p class="read" :id="nodeid" :inner-html.prop="nodetext | marked">
{{ nodeid }}
......
app/src/router/index.js
+ 6
− 0
View file @ 21f8d6bb
......@@ -2,6 +2,7 @@ import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
import List from '../views/List.vue'
import Discarded from '../views/Discarded.vue'
// import Oldhome from '../views/Oldhome'
//import Test from '../views/Test'
......@@ -18,6 +19,11 @@ export const routes = [
name: 'Mobile',
component: List,
},
{
path: '/discarded',
name: 'Discarded',
component: Discarded,
},
{
path: '/about',
name: 'About',
......
app/src/store/index.js
+ 45
− 3
View file @ 21f8d6bb
......@@ -162,9 +162,10 @@ const store = new Vuex.Store({
.then(function (doc) {
var i
for (i = 0; i < Object.keys(doc.nodes).length; i++) {
if (doc.nodes[i].deleted == true) {
doc.nodes.splice(i, 1)
}
// PREVIOUS: approach to removing nodes that are flagged as deleted before
// if (doc.nodes[i].deleted == true) {
// // doc.nodes.splice(i, 1)
// }
state.myNodes = doc.nodes
}
})
......@@ -539,6 +540,39 @@ const store = new Vuex.Store({
})
},
RESTORE_NODE(state, e) {
console.log(e)
var i
for (i = 0; i < Object.keys(state.myNodes).length; i++) {
if (e.e == state.myNodes[i].node_id) {
state.myNodes[i].deleted = false
}
}
pouchdb
.get(state.myclient)
.then(function (doc) {
// put the store into pouchdb
return pouchdb.bulkDocs([
{
_id: state.myclient,
_rev: doc._rev,
_attachments: doc._attachments,
nodes: state.myNodes,
},
])
})
.then(function () {
return pouchdb.get(state.myclient).then(function (doc) {
state.myNodes = doc.nodes
})
})
.catch(function (err) {
if (err.status == 404) {
// pouchdb.put({ })
}
})
},
READ_FLAG(state, e) {
var i
// console.log(e.e)
......@@ -625,6 +659,7 @@ const store = new Vuex.Store({
pouchdb.replicate.from(remote).on('complete', function () {
store.commit('GET_ALL_NODES')
store.commit('GET_MY_NODES')
store.commit('GET_POSITIONS')
store.commit('GET_CONNECTIONS')
store.commit('GET_EMOJI')
......@@ -640,6 +675,7 @@ const store = new Vuex.Store({
// pop info into function to find out more
store.commit('GET_ALL_NODES')
store.commit('GET_MY_NODES')
store.commit('GET_POSITIONS')
store.commit('GET_CONNECTIONS')
store.commit('GET_EMOJI')
......@@ -680,6 +716,7 @@ const store = new Vuex.Store({
updateConnectTwo: ({ commit }, tonode, xposend, yposend) => {
commit('UPDATE_CONNECT_TWO', tonode, xposend, yposend)
},
readFlag: ({ commit }, e) => {
// var text = e.target.value
commit('READ_FLAG', e)
......@@ -716,6 +753,11 @@ const store = new Vuex.Store({
commit('DELETE_FLAG', e)
},
restoreNode: ({ commit }, e) => {
// var text = e.target.value
commit('RESTORE_NODE', e)
},
addEmoji: ({ commit }, { nodeid, emojitext }) => {
commit('ADD_EMOJI', {
nodeid,
......
app/src/views/Discarded.vue 0 → 100644
+ 202
− 0
View file @ 21f8d6bb
<template>
<div id="discardwrapper">
<h1 class="restore">Your discarded nodes</h1>
<div v-if="clientset">
<form>
<div v-for="value in myNodes" v-bind:key="value.node_id">
<div v-if="value.deleted == true">
{{ value.node_text }}
<div class="btn-row">
<BaseButton
class="new"
buttonClass="action"
@click="restoreNode(value.node_id)"
>Restore</BaseButton
>
</div>
</div>
</div>
</form>
</div>
<!-- // onboarding for list view -->
<div v-else>
<form>
<div>
<p id="nodeid" :inner-html.prop="nodetext1 | marked"></p>
<div v-if="name == false">
<input
type="text"
v-model.trim="clientid"
placeholder="device name"
autocorrect="off"
autocapitalize="none"
ref="objectname"
v-on:keyup.enter="setClient()"
@focus="editTrue(true)"
@blur="editTrue(false)"
/>
<div class="btn-row">
<BaseButton buttonClass="special" @click="setClient()"
>Store</BaseButton
>
</div>
</div>
<div v-else>
<h4>Saved</h4>
</div>
</div>
</form>
<form>
<div>
<p id="nodeid" :inner-html.prop="nodetext2 | marked"></p>
<div v-if="microcosm == false">
<input
type="text"
v-model.trim="localmicrocosm"
placeholder="microcosm name"
autocorrect="off"
autocapitalize="none"
autofocus
v-on:keyup.enter="createMicrocosm()"
@focus="editTrue(true)"
@blur="editTrue(false)"
/>
<div class="btn-row">
<BaseButton
buttonClass="special"
@click="createMicrocosm(), letsGo()"
>Create Microcosm</BaseButton
>
</div>
</div>
<div v-else>
<h4>Loading...</h4>
</div>
</div>
</form>
</div>
</div>
<!-- </div> -->
</template>
<script>
// import OffLine from '@/components/OffLine'
// import OnBoard from '@/components/OnBoard.vue'
import Router from '@/router'
import { mapState } from 'vuex'
import marked from 'marked'
import { shortcutsMixin } from '@/components/mixins/shortcutsMixin.js'
export default {
name: 'Discarded',
mixins: [shortcutsMixin],
data: function () {
return {
localmicrocosm: Router.currentRoute.params.microcosm,
clientid: '',
clientset: false,
offline: false,
nodetext1:
'## What shall we call you ? 👩‍🚀 \n First we need to connect this device to your ideas. This name is what allows you to create and edit your nodes and can be anything you like and this name is always anonymous.',
nodetext2:
'## Join/Start a microcosm ! 🚀 \n Now you can create your own microcosm to store your ideas and ask people to join you, either just tell them the name of the microcosm or share the alpha.nodenogg.in URL and add the ending; </br><em><b>/microcosm/nameofyourmicrocosm</b></em>',
name: false,
microcosm: false,
}
},
props: {
nodeid: String,
nodetext: String,
deleted: Boolean,
},
computed: mapState({
myNodes: (state) => state.myNodes,
configPositions: (state) => state.configPositions,
shortcutstate: (state) => state.shortcutstate,
}),
created() {
if (typeof window !== 'undefined') {
document.addEventListener('keydown', this.handleKeyPress)
}
},
beforeDestroy() {
if (typeof window !== 'undefined') {
document.removeEventListener('keydown', this.handleKeyPress)
}
},
mounted() {
if (localStorage.myNNClient && localStorage.mylastMicrocosm) {
this.clientid = localStorage.myNNClient
this.localmicrocosm = localStorage.mylastMicrocosm
this.createMicrocosm()
this.setClient()
this.letsGo()
this.clientset = 'true'
}
},
components: {
// OnBoard,
// OffLine,
//ModeToolbar,
},
filters: {
marked: marked,
},
methods: {
clientAdded() {
this.clientset = !this.clientset
},
createMicrocosm() {
this.$store.dispatch('createMicrocosm', this.localmicrocosm)
localStorage.setItem('mylastMicrocosm', this.localmicrocosm)
this.microcosm = true
},
setClient() {
this.$store.dispatch('setClient', this.clientid),
localStorage.setItem('myNNClient', this.clientid)
this.name = true
},
letsGo() {
this.clientset = !this.clientset
this.$emit('clientAdded')
},
restoreNode(e) {
this.$store.dispatch('restoreNode', { e })
},
editTrue(e) {
this.$store.dispatch('shortcutState', e)
},
editNode(e) {
var nodeid = e.target.id
var nodetext = e.target.value
this.$store.dispatch('editNode', { nodeid, nodetext })
},
},
}
</script>
<style lang="css" scoped>
textarea {
width: 95%;
height: 100px;
margin-left: 1em;
margin-bottom: 1em;
}
</style>
app/src/views/Home.vue
+ 2
− 0
View file @ 21f8d6bb
......@@ -47,6 +47,7 @@
v-bind:key="value.node_id"
v-bind:nodeid="value.node_id"
v-bind:nodetext="value.node_text"
v-bind:deleted="value.deleted"
/>
<TipsLayer />
<ConnectionsLayer />
......@@ -65,6 +66,7 @@
v-bind:key="value.node_id"
v-bind:nodeid="value.node_id"
v-bind:nodetext="value.node_text"
v-bind:deleted="value.deleted"
/>
<OnBoard
@clientAdded="clientAdded()"
......
app/src/views/List.vue
+ 12
− 10
View file @ 21f8d6bb
......@@ -22,16 +22,18 @@
v-for="value in myNodes.slice().reverse()"
v-bind:key="value.node_id"
>
<textarea
@focus="editTrue(true)"
@blur="editTrue(false)"
autofocus
@input="editNode"
v-model="value.node_text"
:id="nodeid"
ref="nodetext"
placeholder="Idea goes here!"
></textarea>
<div v-if="value.deleted == false">
<textarea
@focus="editTrue(true)"
@blur="editTrue(false)"
autofocus
@input="editNode"
v-model="value.node_text"
:id="nodeid"
ref="nodetext"
placeholder="Idea goes here!"
></textarea>
</div>
</div>
</form>
</div>
......
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