simple list view (for testing)

added

app/src/components/IpfsInfo.vue

 <template>
   <div>
+    <h1>IPFS Test</h1>
+    <h3>This is very exprimental and should not be used</h3>
     <h1>{{ status }}</h1>
     <h2>ID: {{ id }}</h2>
     <h2>Agent version: {{ agentVersion }}</h2>

app/src/components/OnBoard.vue

@@ -36,7 +36,7 @@
     <vue-draggable-resizable
       class="innernode"
       :w="300"
-      :h="345"
+      :h="375"
       :x="1100"
       :y="50"
       :z="0"

app/src/router/index.js

 import Vue from 'vue'
 import VueRouter from 'vue-router'
 import Home from '../views/Home.vue'
+import List from '../views/List.vue'
 import Oldhome from '../views/Oldhome'
 import Test from '../views/Test'
 
@@ -12,6 +13,11 @@ export const routes = [
     name: 'Home',
     component: Home,
   },
+  {
+    path: '/list',
+    name: 'List',
+    component: List,
+  },
   {
     path: '/oldhome',
     name: 'Old Home',
@@ -19,7 +25,7 @@ export const routes = [
   },
   {
     path: '/test',
-    name: 'Test',
+    name: 'IPFS Test',
     component: Test,
   },
   {

app/src/views/List.vue

+<template>
+  <div>
+    <h1 class="mobile">Your Nodes in list mode</h1>
+    <!-- <OffLine
+      v-for="value in myNodes"
+      v-bind:key="value.node_id"
+      v-bind:nodeid="value.node_id"
+      v-bind:nodetext="value.node_text"
+      @editTrue="(e) => editTrue(e)"
+    /> -->
+
+    <div v-for="value in myNodes" 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>
+
+    <!-- <OnBoard @clientAdded="clientAdded()" @editTrue="(e) => editTrue(e)" /> -->
+
+    <ModeToolbar />
+  </div>
+</template>
+
+<script>
+// import OffLine from '@/components/OffLine'
+// import OnBoard from '@/components/OnBoard.vue'
+import ModeToolbar from '@/experimental/ModeToolbar'
+import { mapState } from 'vuex'
+
+export default {
+  name: 'List',
+
+  data: function () {
+    return {
+      clientset: false,
+      offline: false,
+    }
+  },
+
+  props: {
+    nodeid: String,
+    nodetext: String,
+    deleted: Boolean,
+  },
+
+  computed: mapState({
+    myNodes: (state) => state.myNodes,
+  }),
+
+  components: {
+    // OnBoard,
+    // OffLine,
+    ModeToolbar,
+  },
+
+  methods: {
+    clientAdded() {
+      this.clientset = !this.clientset
+    },
+
+    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>
+.mobile {
+  font-size: 1em;
+}
+</style>