From 448a5d03da082946c64969ccfd73230dd52870d9 Mon Sep 17 00:00:00 2001
From: Adam Procter <adamprocter@researchnot.es>
Date: Fri, 10 Sep 2021 19:24:41 +0100
Subject: [PATCH] emoji "voting" now working
---
CHANGELOG.md | 9 +++++
package.json | 2 +-
src/components/OtherNodes.vue | 56 +++++++++++++++++++++-----
src/store/modules/allEmoji.js | 70 +++++++++++++++++++++++++++++++--
src/store/modules/otherNodes.js | 7 +++-
5 files changed, 130 insertions(+), 14 deletions(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index b77d969..902d736 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,12 @@
+# 0.2.5
+
+_10th Septemeber 2021_
+
+## Added
+
+- various formatting buttons to format your node text with markdown
+- emojis "voting" is now working on other nodes
+
# 0.2.4
_6th Septemeber 2021_
diff --git a/package.json b/package.json
index 179ef2d..ecabccf 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "nodenogg.in",
- "version": "0.2.4",
+ "version": "0.2.5",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
diff --git a/src/components/OtherNodes.vue b/src/components/OtherNodes.vue
index 2da0de9..bc479b7 100644
--- a/src/components/OtherNodes.vue
+++ b/src/components/OtherNodes.vue
@@ -12,7 +12,18 @@
:id="nodes.node_id"
v-html="marked(nodes.node_text)"
></p>
- <button @click="openEmoji">
+ <div class="allemoji">
+ <div
+ class="eachemoji"
+ v-for="(emojis, index) in allEmoji.allEmoji"
+ :key="index"
+ >
+ <p v-if="nodes.node_id == emojis.node_id">
+ {{ emojis.emoji_unicode }}
+ </p>
+ </div>
+ </div>
+ <button @click="openEmoji(nodes.node_id)">
<svg
height="24"
viewBox="0 0 24 24"
@@ -26,9 +37,9 @@
</svg>
</button>
<VuemojiPicker
- v-show="showEmoji"
+ v-if="showEmoji === nodes.node_id"
class="emojipicker"
- @emojiClick="($event) => handleEmojiClick($event, nodes.node_id)"
+ @emojiClick="($event) => handleEmojiClick(nodes.node_id, $event)"
:pickerStyle="{}"
/>
</div>
@@ -52,7 +63,7 @@ export default {
data: function () {
return {
- showEmoji: false,
+ showEmoji: String,
}
},
@@ -63,13 +74,16 @@ export default {
computed: {
...mapState({
otherNodes: (state) => state.otherNodes,
- configEmoji: (state) => state.configEmoji,
+ allEmoji: (state) => state.allEmoji,
}),
},
mounted() {
this.$store.dispatch('getOthernodes')
setTimeout(this.loadData, 500)
+ // this is to get the last letter typed if no space
+ // this also loads in new Emoji
+ // May need to EDIT
setInterval(this.loadData, 5000)
},
@@ -77,17 +91,34 @@ export default {
getNodeid(nodeid) {
this.nodeid = nodeid
},
- handleEmojiClick(detail, nodeid) {
- console.log(detail)
+ handleEmojiClick(nodeid, detail) {
console.log(nodeid)
+
+ var unicode = detail.emoji.unicode
+ var annotation = detail.emoji.annotation
+ var skinTone = detail.skinTone
+ var emoticon = detail.emoji.emoticon
+
+ this.$store.dispatch('addEmoji', {
+ nodeid,
+ unicode,
+ annotation,
+ skinTone,
+ emoticon,
+ })
},
- openEmoji() {
- this.showEmoji = !this.showEmoji
+ openEmoji(nodeid) {
+ if (this.showEmoji == nodeid) {
+ this.showEmoji = null
+ } else {
+ this.showEmoji = nodeid
+ }
},
loadData() {
this.$store.dispatch('setOthernodes')
+ this.$store.dispatch('getEmoji')
},
marked,
},
@@ -103,4 +134,11 @@ button {
background: none;
border: none;
}
+
+.allemoji {
+ font-size: 1.5em;
+ padding: 0em;
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(0, auto));
+}
</style>
diff --git a/src/store/modules/allEmoji.js b/src/store/modules/allEmoji.js
index 956f09d..c55aa6b 100644
--- a/src/store/modules/allEmoji.js
+++ b/src/store/modules/allEmoji.js
@@ -1,7 +1,71 @@
-export const state = {}
+var pouchdb
-export const mutations = {}
+export const state = {
+ docName: 'emojis',
+ allEmoji: [],
+}
-export const actions = {}
+export const mutations = {
+ GET_EMOJI(state) {
+ pouchdb
+ .get(state.docName)
+ .then(function (doc) {
+ state.allEmoji = doc.emojis
+ })
+ .catch(function (err) {
+ if (err.status == 404) {
+ return pouchdb.put({
+ _id: state.docName,
+ emojis: [],
+ })
+ }
+ })
+ },
+ ADD_EMOJI(state, e) {
+ var uniqueid =
+ Math.random().toString(36).substring(2, 15) +
+ Math.random().toString(36).substring(2, 15)
+ pouchdb.get(state.docName).then(function (doc) {
+ doc.emojis.push({
+ emoji_id: uniqueid,
+ node_id: e.nodeid,
+ emoji_unicode: e.unicode,
+ emoji_annotation: e.annotation,
+ emoji_skintone: e.skinTone,
+ emoji_emoticon: e.emoticon,
+ })
+ return pouchdb
+ .put({
+ _id: state.docName,
+ _rev: doc._rev,
+ emojis: doc.emojis,
+ })
+ .catch(function () {})
+ })
+ },
+}
+
+export const actions = {
+ getEmoji: ({ commit }) => {
+ commit('GET_EMOJI')
+ },
+
+ addEmoji: (
+ { commit },
+ { nodeid, unicode, annotation, skinTone, emoticon }
+ ) => {
+ commit('ADD_EMOJI', {
+ nodeid,
+ unicode,
+ annotation,
+ skinTone,
+ emoticon,
+ })
+ },
+
+ getMicrocosm(vuexContext) {
+ pouchdb = vuexContext.rootState.setup.pouchdb
+ },
+}
export const getters = {}
diff --git a/src/store/modules/otherNodes.js b/src/store/modules/otherNodes.js
index 4982e11..a275d97 100644
--- a/src/store/modules/otherNodes.js
+++ b/src/store/modules/otherNodes.js
@@ -1,5 +1,6 @@
var pouchdb
var deviceName
+var docName
export const state = {
allNodes: [],
@@ -27,7 +28,10 @@ export const mutations = {
var j
for (i = 0; i < Object.keys(state.allNodes).length; i++) {
- if (state.allNodes[i].id != deviceName) {
+ if (
+ state.allNodes[i].id != deviceName &&
+ state.allNodes[i].id != docName
+ ) {
for (j = 0; j < Object.keys(state.allNodes[i].doc.nodes).length; j++) {
const newNode = {
node_id: state.allNodes[i].doc.nodes[j].node_id,
@@ -55,6 +59,7 @@ export const actions = {
getMicrocosm(vuexContext) {
deviceName = vuexContext.rootState.setup.deviceName
pouchdb = vuexContext.rootState.setup.pouchdb
+ docName = vuexContext.rootState.allEmoji.docName
},
}
--
GitLab