exit button added

app/src/components/ControlsLayer.vue

@@ -35,7 +35,7 @@
 
 <script>
 // This is for detecting offline issues
-var serverUrl = 'https://nodenogg.in'
+var serverUrl = 'http://127.0.0.1:5984'
 import { mapState } from 'vuex'
 
 export default {
@@ -45,8 +45,8 @@ export default {
   },
 
   computed: mapState({
-    myMicrocosm: state => state.microcosm,
-    myClient: state => state.myclient
+    myMicrocosm: (state) => state.microcosm,
+    myClient: (state) => state.myclient,
   }),
   methods: {
     addNode() {
@@ -56,11 +56,11 @@ export default {
       // FIXME: add action here to toggle visiblity
       this.$emit('listView')
     },
-    exportStorage: function() {
+    exportStorage: function () {
       // Save local indexeddb document-store to JSON file
       // or export state.notes to JSON file
     },
-    removeLocal: function() {
+    removeLocal: function () {
       localStorage.removeItem('myNNClient')
       localStorage.removeItem('mylastMicrocosm')
       // Hardcoded as when I set a URL had parameters the reload fails
@@ -76,10 +76,11 @@ export default {
     deleteClient() {
       this.$store.dispatch('deleteClient')
     },
-    handleConnection: function() {
+    handleConnection: function () {
       var ref = this
+
       if (navigator.onLine) {
-        this.isReachable(this.getServerUrl()).then(function(online) {
+        this.isReachable(this.getServerUrl()).then(function (online) {
           if (online) {
             // handle online status
             console.log('online')
@@ -94,19 +95,19 @@ export default {
         ref.$emit('offlineTriggered')
       }
     },
-    isReachable: function(url) {
+    isReachable: function (url) {
       return fetch(url, { method: 'HEAD', mode: 'no-cors' })
-        .then(function(resp) {
+        .then(function (resp) {
           return resp && (resp.ok || resp.type === 'opaque')
         })
-        .catch(function(err) {
+        .catch(function (err) {
           console.warn('[conn test failure]:', err)
         })
     },
-    getServerUrl: function() {
+    getServerUrl: function () {
       return serverUrl || window.location.origin
-    }
-  }
+    },
+  },
 }
 </script>
 

app/src/components/OffLine.vue

+// FIXME: Everything below is OLD code
+
+<template>
+  <div class="yourdata" name="anchorName">
+    <h2>Offline</h2>
+    <p>
+      nodenogg.in appears to be offline, which means you cant see other data at
+      this stage, as it maybe out of date. Once you reconnect. Your data will
+      sync and the main views will reappear. This maybe down to you or maybe us.
+      If you think it us click Support at the top, and let us know
+    </p>
+    <h3>List - Your Data</h3>
+    <ul class="data">
+      <!-- tips -->
+      <!-- : is short for v-bind -->
+      <!-- v-if="note.content_type != 'device'" -->
+      <li v-for="(note, index) in notes" :key="index">
+        <p v-if="note.content_type != 'device'">{{ note.text }}</p>
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import { shortcuts } from './mixins/shortcuts.js'
+
+export default {
+  name: 'YourData',
+  mixins: [shortcuts],
+  computed: mapState({
+    shortcutsstate: (state) => state.shortcutsstate,
+    notes: (state) => state.notes,
+  }),
+  created() {
+    if (typeof window !== 'undefined') {
+      document.addEventListener('keydown', this.handleKeyPress)
+    }
+  },
+  beforeDestroy() {
+    if (typeof window !== 'undefined') {
+      document.removeEventListener('keydown', this.handleKeyPress)
+    }
+  },
+  methods: {
+    addDoc() {
+      this.$store.dispatch('addDoc')
+      this.$emit('editMode')
+    },
+  },
+}
+</script>
+
+<style lang="css" scoped>
+h3 {
+  margin-top: 1em;
+}
+
+.data p {
+  white-space: pre-wrap;
+  line-height: 1em;
+}
+</style>

app/src/experimental/ModeToolbar.vue

@@ -15,7 +15,7 @@
 </template>
 
 <script>
-var serverUrl = 'https://nodenogg.in'
+var serverUrl = 'http://127.0.0.1:5984'
 import { mapState, mapGetters } from 'vuex'
 
 import * as allModes from '@/experimental/modes'
@@ -36,13 +36,13 @@ export default {
   methods: {
     setMode(mode) {
       this.$store.commit('ui/setMode', mode)
+      if (mode == 'exit') {
+        console.log('YOu')
+        this.removeLocal()
+      }
     },
     isActive(mode) {
       return this.mode === mode.name
-
-      // if (mode.name == 'exit') {
-      //   console.log('exit')
-      // }
     },
 
     removeLocal: function () {

app/src/views/Sandbox.vue

@@ -34,7 +34,10 @@
       v-bind:width="elementWidth"
       v-bind:height="elementHeight"
     /> -->
-    <ModeToolbar />
+    <ModeToolbar
+      @offlineTriggered="offlineTriggered()"
+      @onlineTriggered="onlineTriggered()"
+    />
     <ViewToolbar />
   </div>
 </template>
@@ -118,8 +121,6 @@ export default {
       this.$store.dispatch('shortcutState', e)
     },
 
-    
-
     // This is here to support the shortcuts
     addNode() {
       this.$store.dispatch('addNode')