From d0dfaf1b1b69a5ebdc7b5d9db1e87dafff9c8b0f Mon Sep 17 00:00:00 2001
From: Adam Procter <adamprocter@researchnot.es>
Date: Tue, 6 Oct 2020 18:03:46 +0100
Subject: [PATCH] refactored layers for discard and list

better styling and using same onboarding component so less duplication of code / content copy
---
 .DS_Store                              | Bin 10244 -> 10244 bytes
 app/src/components/DiscardLayer.vue    |  63 +++++++++
 app/src/components/ListLayer.vue       |  28 ++--
 app/src/components/NodesLayer.vue      |   4 +-
 app/src/components/OnBoard.vue         | 121 +++++++++++++----
 app/src/components/OtherNodeslayer.vue |  13 +-
 app/src/router/index.js                |   4 +-
 app/src/views/Discarded.vue            | 176 ++++---------------------
 app/src/views/Home.vue                 |   2 +
 app/src/views/List.vue                 | 141 ++++----------------
 10 files changed, 241 insertions(+), 311 deletions(-)
 create mode 100644 app/src/components/DiscardLayer.vue

diff --git a/.DS_Store b/.DS_Store
index 109c2ae889d0ec12ec3cae3d563a2b76b53bdc04..41cd727a466643d1628b7d2eda0dc4e9b59f3225 100644
GIT binary patch
delta 202
zcmZn(XbIThF5vbpsURn_xWvHV1|t(Q3o9Et2PYRN4<{cdXKZjretB?7Vo7PSQ({rP
zfJ|^^N@`MKQFvxbNk&L&o@-8OS!$ktkxybt>f{Om&x~l0hJeJ944@)TWrs8e1`y!n
z;EWfLtgbdRHZ;*uFgG=?)lsN6H#g8xFflf(t>xt8kW_aIiYsmEn>BmM(q+pJ9|3D)
eU}S{Q41!P^MjhQOD0q@@GrPiXmd#g1n3w@KpEafc

delta 160
zcmZn(XbIThE?{^vsURn_xWvHVIwKP^3o9Et2L}f?2QNo#a7KQ4a7kiGX|YpcQ8b7b
zkXVwDlsLIpz%zi8laqrpUO=L{+R)NcN5Rm<v{px<+S1riN5RC{thSbuLtNF+)-xfu
qvZ}hKwr(Z^7%(zIXa;^L4Wnjlwi7(bH?cu?GrPiXmd*O2Ow0gl$|h3)

diff --git a/app/src/components/DiscardLayer.vue b/app/src/components/DiscardLayer.vue
new file mode 100644
index 0000000..bf00f39
--- /dev/null
+++ b/app/src/components/DiscardLayer.vue
@@ -0,0 +1,63 @@
+<template>
+  <div>
+    <form>
+      <div v-for="value in myNodes" v-bind:key="value.node_id">
+        <div
+          class="nodes"
+          v-if="nodeid == value.node_id && value.deleted == true"
+        >
+          <p :inner-html.prop="value.node_text | marked"></p>
+          <div class="btn-row">
+            <BaseButton
+              class="new"
+              buttonClass="action"
+              @click="restoreNode(value.node_id)"
+              >Restore</BaseButton
+            >
+          </div>
+        </div>
+      </div>
+    </form>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import marked from 'marked'
+
+export default {
+  name: 'DiscardLayer',
+
+  props: {
+    nodeid: String,
+    nodetext: String,
+    deleted: Boolean,
+  },
+
+  computed: mapState({
+    myNodes: (state) => state.myNodes,
+  }),
+  filters: {
+    marked: marked,
+  },
+  methods: {
+    restoreNode(e) {
+      this.$store.dispatch('restoreNode', { e })
+    },
+  },
+}
+</script>
+
+<style lang="css" scoped>
+.nodes {
+  width: 95%;
+  border: 2px dashed black;
+  background-color: rgb(155, 194, 216);
+  margin-bottom: 1em;
+  padding: 0 1em 0 1em;
+}
+
+.btn-row {
+  margin-bottom: 1em;
+}
+</style>
diff --git a/app/src/components/ListLayer.vue b/app/src/components/ListLayer.vue
index 6e860be..25b5c4f 100644
--- a/app/src/components/ListLayer.vue
+++ b/app/src/components/ListLayer.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <div v-for="(value, index) in configPositions" v-bind:key="index">
-      <div v-if="nodeid == value.node_id && deleted == false">
+      <div class="nodes" v-if="nodeid == value.node_id && deleted == false">
         <form>
           <!-- <div v-if="posvalue.read_mode == false"> -->
           <div v-for="value in $options.myArray" v-bind:key="value.node_id">
@@ -44,7 +44,6 @@ export default {
   computed: mapState({
     myNodes: (state) => state.myNodes,
     configPositions: (state) => state.configPositions,
-    //  shortcutstate: (state) => state.shortcutstate,
   }),
 
   myArray: null,
@@ -61,8 +60,6 @@ export default {
 
     editTrue(e) {
       this.$emit('editTrue', e)
-      // this.firstload = false
-      //  // console.log(e)
     },
   },
 }
@@ -73,10 +70,25 @@ h2 {
   color: red;
 }
 
-textarea {
+.nodes {
   width: 95%;
-  height: 100px;
-  margin-left: 1em;
-  margin-bottom: 1em;
+  border: 2px dashed black;
+  background-color: rgb(155, 194, 216);
+  margin-top: 1em;
+}
+
+textarea {
+  width: 90%;
+  height: 175px;
+  resize: none;
+  box-sizing: border-box;
+  font-family: 'Inter var', Helvetica, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  margin: 1em;
+  border: none;
+  outline: none;
+  background-color: rgb(187, 227, 255);
+  scrollbar-color: yellow rgb(187, 227, 255);
 }
 </style>
diff --git a/app/src/components/NodesLayer.vue b/app/src/components/NodesLayer.vue
index 4048a9d..abdc425 100644
--- a/app/src/components/NodesLayer.vue
+++ b/app/src/components/NodesLayer.vue
@@ -59,7 +59,7 @@
               <!-- <BaseButton buttonClass="danger" @click="deleteFlag()"
                 >Delete</BaseButton
               > -->
-              <div v-if="value.read_mode == true">
+              <!-- <div v-if="value.read_mode == true">
                 <BaseButton
                   class="read"
                   buttonClass="action"
@@ -74,7 +74,7 @@
                   @click="readFlag()"
                   >Read Mode</BaseButton
                 >
-              </div>
+              </div> -->
             </div>
           </form>
         </vue-draggable-resizable>
diff --git a/app/src/components/OnBoard.vue b/app/src/components/OnBoard.vue
index adc056d..c6184ac 100644
--- a/app/src/components/OnBoard.vue
+++ b/app/src/components/OnBoard.vue
@@ -1,17 +1,86 @@
 <template>
   <div ref="nodes" class="node">
-    <vue-draggable-resizable
-      class="innernode"
-      :w="300"
-      :h="335"
-      :x="5"
-      :y="15"
-      :z="1"
-      :draggable="true"
-      :resizable="false"
-      style="background-color: #6fcf97"
-    >
-      <div>
+    <div v-if="this.currentroute.name == 'Home'">
+      <vue-draggable-resizable
+        class="innernode"
+        :w="300"
+        :h="335"
+        :x="5"
+        :y="15"
+        :z="1"
+        :draggable="true"
+        :resizable="false"
+        style="background-color: #6fcf97"
+      >
+        <div>
+          <p id="nodeid" :inner-html.prop="nodetext | marked"></p>
+          <div v-if="name == false">
+            <input
+              type="text"
+              v-model.trim="clientid"
+              placeholder="name"
+              autocorrect="off"
+              autocapitalize="none"
+              ref="objectname"
+              v-on:keyup.enter="setClient()"
+              autofocus
+              @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>
+      </vue-draggable-resizable>
+
+      <vue-draggable-resizable
+        class="innernode"
+        :w="310"
+        :h="375"
+        :x="600"
+        :y="15"
+        :z="1"
+        :draggable="true"
+        :resizable="false"
+        style="background-color: #6fcf97"
+      >
+        <div class="content">
+          <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"
+              @focus="editTrue(true)"
+              @blur="editTrue(false)"
+              v-on:keyup.enter="createMicrocosm(), letsGo()"
+            />
+
+            <div class="btn-row">
+              <BaseButton
+                buttonClass="special"
+                @click="createMicrocosm(), letsGo()"
+                >Create or Rejoin a Microcosm</BaseButton
+              >
+            </div>
+          </div>
+          <div v-else>
+            <h4>Loading...</h4>
+          </div>
+        </div>
+      </vue-draggable-resizable>
+    </div>
+    <div v-else>
+      <div class="nodes">
         <p id="nodeid" :inner-html.prop="nodetext | marked"></p>
         <div v-if="name == false">
           <input
@@ -37,20 +106,8 @@
           <h4>Saved</h4>
         </div>
       </div>
-    </vue-draggable-resizable>
-
-    <vue-draggable-resizable
-      class="innernode"
-      :w="310"
-      :h="375"
-      :x="850"
-      :y="15"
-      :z="1"
-      :draggable="true"
-      :resizable="false"
-      style="background-color: #6fcf97"
-    >
-      <div class="content">
+
+      <div class="nodes">
         <p id="nodeid" :inner-html.prop="nodetext2 | marked"></p>
         <div v-if="microcosm == false">
           <input
@@ -76,7 +133,7 @@
           <h4>Loading...</h4>
         </div>
       </div>
-    </vue-draggable-resizable>
+    </div>
   </div>
 </template>
 
@@ -87,6 +144,7 @@ import marked from 'marked'
 export default {
   data: function () {
     return {
+      currentroute: Router.currentRoute,
       localmicrocosm: Router.currentRoute.params.microcosm,
       clientid: '',
       nodetext:
@@ -184,4 +242,13 @@ input {
   box-shadow: none;
   border-style: dotted;
 }
+
+.nodes {
+  margin: 1em;
+  padding: 0 1em 0 1em;
+  width: 95%;
+  border: 2px dashed black;
+  background-color: #6fcf97;
+  margin-top: 1em;
+}
 </style>
diff --git a/app/src/components/OtherNodeslayer.vue b/app/src/components/OtherNodeslayer.vue
index 584f84b..abda229 100644
--- a/app/src/components/OtherNodeslayer.vue
+++ b/app/src/components/OtherNodeslayer.vue
@@ -4,7 +4,7 @@
       <div v-if="toolmode == 'move'">
         <!-- make draggable false as we are panning around -->
         <vue-draggable-resizable
-          v-if="nodeid == value.node_id"
+          v-if="nodeid == value.node_id && deleted == false"
           :w="value.width"
           :h="value.height"
           :x="value.x_pos"
@@ -21,9 +21,7 @@
           :min-width="200"
           :min-height="220"
         >
-          <p class="read" :id="nodeid" :inner-html.prop="nodetext | marked">
-            {{ nodeid }}
-          </p>
+          <p class="read" :id="nodeid" :inner-html.prop="nodetext | marked"></p>
           <!-- <h3>Reactions</h3> -->
 
           <div class="react" v-if="nodeid != undefined">
@@ -109,7 +107,7 @@
 
       <div v-else>
         <vue-draggable-resizable
-          v-if="nodeid == value.node_id"
+          v-if="nodeid == value.node_id && deleted == false"
           :w="value.width"
           :h="value.height"
           :x="value.x_pos"
@@ -124,9 +122,7 @@
           :min-width="200"
           :min-height="220"
         >
-          <p class="read" :id="nodeid" :inner-html.prop="nodetext | marked">
-            {{ nodeid }}
-          </p>
+          <p class="read" :id="nodeid" :inner-html.prop="nodetext | marked"></p>
           <!-- <h3>Reactions</h3> -->
           <div class="allemoji">
             <div
@@ -229,6 +225,7 @@ export default {
     nodetext: String,
     nodewidth: Number,
     nodeheight: Number,
+    deleted: Boolean,
   },
 
   data() {
diff --git a/app/src/router/index.js b/app/src/router/index.js
index 35c8aea..d188aec 100644
--- a/app/src/router/index.js
+++ b/app/src/router/index.js
@@ -15,8 +15,8 @@ export const routes = [
     component: Home,
   },
   {
-    path: '/mobile',
-    name: 'Mobile',
+    path: '/list',
+    name: 'List',
     component: List,
   },
   {
diff --git a/app/src/views/Discarded.vue b/app/src/views/Discarded.vue
index 901dfab..4ae754b 100644
--- a/app/src/views/Discarded.vue
+++ b/app/src/views/Discarded.vue
@@ -1,110 +1,39 @@
 <template>
-  <div id="discardwrapper">
-    <h1 class="restore">Your discarded nodes</h1>
-
+  <div>
     <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 id="discardwrapper">
+        <h1 class="mobile">Your discarded nodes - list mode</h1>
+
+        <DiscardLayer
+          v-for="value in myNodes"
+          v-bind:key="value.node_id"
+          v-bind:nodeid="value.node_id"
+          v-bind:nodetext="value.node_text"
+          v-bind:deleted="value.deleted"
+        />
+      </div>
     </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>
+      <OnBoard @clientAdded="clientAdded()" @editTrue="(e) => editTrue(e)" />
     </div>
   </div>
-  <!-- </div> -->
 </template>
 
 <script>
-// import OffLine from '@/components/OffLine'
-// import OnBoard from '@/components/OnBoard.vue'
 import Router from '@/router'
-
+import DiscardLayer from '@/components/DiscardLayer'
+import OnBoard from '@/components/OnBoard'
 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,
     }
@@ -118,85 +47,30 @@ export default {
 
   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,
+    DiscardLayer,
+    OnBoard,
   },
 
-  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;
+#discardwrapper {
   margin-left: 1em;
   margin-bottom: 1em;
 }
+.mobile {
+  font-size: 1em;
+}
+.new {
+  margin-bottom: 1em;
+}
 </style>
diff --git a/app/src/views/Home.vue b/app/src/views/Home.vue
index 1d5d534..f1e58a8 100644
--- a/app/src/views/Home.vue
+++ b/app/src/views/Home.vue
@@ -41,6 +41,7 @@
               v-bind:key="value.node_id"
               v-bind:nodeid="value.node_id"
               v-bind:nodetext="value.node_text"
+              v-bind:deleted="value.deleted"
             />
             <NodesLayer
               @editTrue="(e) => editTrue(e)"
@@ -60,6 +61,7 @@
               v-bind:key="value.node_id"
               v-bind:nodeid="value.node_id"
               v-bind:nodetext="value.node_text"
+              v-bind:deleted="value.deleted"
             />
             <NodesLayer
               @editTrue="(e) => editTrue(e)"
diff --git a/app/src/views/List.vue b/app/src/views/List.vue
index 10d600c..0b40d92 100644
--- a/app/src/views/List.vue
+++ b/app/src/views/List.vue
@@ -1,89 +1,34 @@
 <template>
-  <div id="listwrapper">
+  <div>
     <div v-if="clientset">
-      <h1 class="mobile">Your nodes - list mode</h1>
-
-      <ListLayer
-        @editTrue="(e) => editTrue(e)"
-        v-for="value in myNodes"
-        v-bind:key="value.node_id"
-        v-bind:nodeid="value.node_id"
-        v-bind:nodetext="value.node_text"
-        v-bind:deleted="value.deleted"
-      />
-      <div class="btn-row">
-        <BaseButton class="new" buttonClass="action" @click="addNode()"
-          >Create Node</BaseButton
-        >
+      <div id="listwrapper">
+        <h1 class="mobile">Your nodes - list mode</h1>
+
+        <ListLayer
+          @editTrue="(e) => editTrue(e)"
+          v-for="value in myNodes"
+          v-bind:key="value.node_id"
+          v-bind:nodeid="value.node_id"
+          v-bind:nodetext="value.node_text"
+          v-bind:deleted="value.deleted"
+        />
+        <div class="btn-row">
+          <BaseButton class="new" buttonClass="action" @click="addNode()"
+            >Create Node</BaseButton
+          >
+        </div>
       </div>
     </div>
-
     <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>
+      <OnBoard @clientAdded="clientAdded()" @editTrue="(e) => editTrue(e)" />
     </div>
-    <!-- <ModeToolbar /> -->
   </div>
 </template>
 
 <script>
 import Router from '@/router'
-//import ModeToolbar from '@/experimental/ModeToolbar'
 import ListLayer from '@/components/ListLayer'
+import OnBoard from '@/components/OnBoard'
 import { mapState } from 'vuex'
 import marked from 'marked'
 import { shortcutsMixin } from '@/components/mixins/shortcutsMixin.js'
@@ -98,10 +43,6 @@ export default {
       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,
     }
@@ -116,10 +57,6 @@ export default {
   computed: {
     ...mapState({
       myNodes: (state) => state.myNodes,
-      otherNodes: (state) => state.otherNodes,
-      shortcutstate: (state) => state.shortcutstate,
-      toolmode: (state) => state.ui.mode,
-      connections: (state) => state.configConnections,
     }),
   },
 
@@ -136,14 +73,14 @@ export default {
   },
 
   mounted() {
-    if (localStorage.myNNClient && localStorage.mylastMicrocosm) {
-      this.clientid = localStorage.myNNClient
-      this.localmicrocosm = localStorage.mylastMicrocosm
-      this.createMicrocosm()
-      this.setClient()
-      this.letsGo()
-      this.clientset = 'true'
-    }
+    // if (localStorage.myNNClient && localStorage.mylastMicrocosm) {
+    //   this.clientid = localStorage.myNNClient
+    //   this.localmicrocosm = localStorage.mylastMicrocosm
+    //   this.createMicrocosm()
+    //   this.setClient()
+    //   this.letsGo()
+    //   this.clientset = 'true'
+    // }
   },
 
   methods: {
@@ -158,32 +95,10 @@ export default {
     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 })
-    // },
-
-    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')
-    },
   },
   components: {
     ListLayer,
-    // ModeToolbar,
+    OnBoard,
   },
   filters: {
     marked: marked,
-- 
GitLab