editing

app/src/components/ListLayer.vue

 <template>
   <div>
-    // FIXME : Future loop does not work yet // future loop Code
     <div v-for="(value, index) in nodes" v-bind:key="index">
-      {{ value.node_text }}
+      {{ nodetext }}
     </div>
-    // read mode version
-    <div v-for="(value, index) in readnodes" v-bind:key="index">
+
+    <!-- <div v-for="(value, index) in readnodes" v-bind:key="index">
       {{ value.node_text }}
     </div>
 
     <div v-for="(value, index) in emojis" v-bind:key="index">
       {{ value.emoji_text }}
-    </div>
-
-    // current looper
-    <div v-for="(value, index) in configPositions" v-bind:key="index">
-      <div v-if="nodeid == value.node_id && deleted == false">
-        <form class="nodes">
-          <div v-if="value.read_mode == false">
-            <div v-for="value in $options.myArray" v-bind:key="value.node_id">
-              <textarea
-                v-if="nodeid == value.node_id"
-                @focus="editTrue(true)"
-                @blur="editTrue(false)"
-                autofocus
-                v-model="value.node_text"
-                @input="editNode"
-                :id="nodeid"
-                ref="nodetext"
-                placeholder="Type your thoughts and ideas here! (auto saved every keystroke)"
-              ></textarea>
-            </div>
-            <p class="info">*markdown supported &amp; autosaves</p>
-          </div>
-          <div class="readmode" v-if="value.read_mode && deleted == false">
-            <p :id="nodeid" :inner-html.prop="nodetext | marked"></p>
-          </div>
-
-          <div class="allemoji">
-            <div
-              class="eachemoji"
-              v-for="(emojis, index) in configEmoji"
-              :key="index"
-            >
-              <p v-if="nodeid == emojis.node_id">
-                {{ emojis.emoji_text }}
-              </p>
-            </div>
-          </div>
-
-          <div class="btn-row">
-            <SvgButton buttonClass="nodes" @click.prevent="deleteFlag()" />
-            <div v-if="value.read_mode == true && deleted == false">
-              <SvgButton2 buttonClass="nodes" @click.prevent="readFlag()" />
-            </div>
-            <div v-else>
-              <SvgButton2 buttonClass="nodes" @click.prevent="readFlag()" />
-            </div>
-          </div>
-        </form>
-      </div>
-    </div>
+    </div> -->
   </div>
 </template>
 
 <script>
 import { mapState } from 'vuex'
 import marked from 'marked'
-import SvgButton from '@/components/SvgButton'
-import SvgButton2 from '@/components/SvgButton2'
 
 var readmode
 export default {
@@ -97,11 +45,8 @@ export default {
       configEmoji: (state) => state.configEmoji,
     }),
 
-    // FIXME: these filters dont work yet
-    // ALSO dont forget you did this.$options.myArray = this.myNodes
-    // Otherwise your hit the realtimesync issue again
     nodes() {
-      return this.nodes.filter((node) => {
+      return this.myNodes.filter((node) => {
         return (
           (node == this.myNodes.node_id) == this.configPositions.node_id &&
           this.myNodes.deleted == false &&
@@ -111,7 +56,7 @@ export default {
     },
 
     readnodes() {
-      return this.readnodes.filter((readnode) => {
+      return this.myNodes.filter((readnode) => {
         return (
           (readnode == this.myNodes.node_id) == this.configPositions.node_id &&
           this.myNodes.deleted == false &&
@@ -121,7 +66,7 @@ export default {
     },
 
     emojis() {
-      return this.emojis.filter((emoji) => {
+      return this.configEmoji.filter((emoji) => {
         return (
           (emoji == this.myNodes.node_id) == this.configPositions.node_id &&
           this.myNodes.deleted == false
@@ -178,10 +123,7 @@ export default {
       }
     },
   },
-  components: {
-    SvgButton,
-    SvgButton2,
-  },
+  components: {},
 }
 </script>