diff --git a/.DS_Store b/.DS_Store
index 5601acadaccd652acf3c396323ecbf9b53610c3a..fd1a2cf3cdcdac96fd96b4efe3c7b0c9d68769cd 100644
Binary files a/.DS_Store and b/.DS_Store differ
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 65c6397761d0c80b9bd73746901be0e5be2fb404..2ababc27703ba6592c68dd21b881a1f35d078a78 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,22 @@
+# 0.1.15
+
+_17th June 2020_
+
+This version adds some testing components and these are not part of the future direct but allow testing of features that will be folded in when better understand in terms of tech or awaiting proper implementation.
+
+### Added
+
+- test view for IPFS
+- test view for list of your nodes (mobile)
+
+### Changed
+
+- more CSS edits
+
+### Removed
+
+- Hidden previous canvas view from build
+
# 0.1.14
_8th June 2020_
diff --git a/app/package.json b/app/package.json
index a2b2d74d88991db14045a389b53b5642b50baf22..3e4956ce9beadf44c9fa5ab6dfc5a58052c5f98a 100644
--- a/app/package.json
+++ b/app/package.json
@@ -1,6 +1,6 @@
{
"name": "nodenogg.in",
- "version": "0.1.14",
+ "version": "0.1.15",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
diff --git a/app/src/components/IpfsInfo.vue b/app/src/components/IpfsInfo.vue
index ce08e9110897cbd38c3f506d13c97b177b8b1d4b..da274f75f4adaa0438d40e66fd505ef2b725c5fb 100644
--- a/app/src/components/IpfsInfo.vue
+++ b/app/src/components/IpfsInfo.vue
@@ -1,7 +1,7 @@
<template>
<div>
- <h1>IPFS Test</h1>
- <h3>This is very exprimental and should not be used</h3>
+ <h1>IPFS View</h1>
+ <h3>Testing Only</h3>
<h1>{{ status }}</h1>
<h2>ID: {{ id }}</h2>
<h2>Agent version: {{ agentVersion }}</h2>
@@ -84,7 +84,7 @@ export default {
this.agentVersion = agentVersion
this.id = id
// Set successful status text.
- this.status = 'Connected to IPFS =)'
+ this.status = 'Connected to IPFS 😊'
} catch (err) {
// Set error status text.
this.status = `Error: ${err}`
@@ -98,4 +98,12 @@ export default {
.fileInput {
/* display: none; */
}
+
+h1 {
+ font-size: 1em;
+}
+
+h3 {
+ color: red;
+}
</style>
diff --git a/app/src/experimental/ModeToolbar.vue b/app/src/experimental/ModeToolbar.vue
index a669b35505a4df8640ea9df08580f1e0fb2c4303..6b2f4e66c5df87cc0fbaa1306261fb80d1821e20 100644
--- a/app/src/experimental/ModeToolbar.vue
+++ b/app/src/experimental/ModeToolbar.vue
@@ -97,7 +97,7 @@ export default {
<style scoped>
nav {
- position: absolute;
+ position: fixed;
bottom: 1em;
left: 1em;
diff --git a/app/src/router/index.js b/app/src/router/index.js
index 0830c5e73893691059b95d9c41f5faf69cc71cb0..f33b39c28ded2bb2ef87ded7d925a37481922ba3 100644
--- a/app/src/router/index.js
+++ b/app/src/router/index.js
@@ -2,7 +2,7 @@ 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 Oldhome from '../views/Oldhome'
import Test from '../views/Test'
Vue.use(VueRouter)
@@ -13,30 +13,32 @@ export const routes = [
name: 'Home',
component: Home,
},
+ {
+ path: '/about',
+ name: 'About',
+ // route level code-splitting
+ // this generates a separate chunk (about.[hash].js) for this route
+ // which is lazy-loaded when the route is visited.
+ component: () =>
+ import(/* webpackChunkName: "about" */ '../views/About.vue'),
+ },
{
path: '/list',
name: 'List Test',
component: List,
},
- {
- path: '/oldhome',
- name: 'Old Home',
- component: Oldhome,
- },
+
{
path: '/test',
name: 'IPFS Test',
component: Test,
},
- {
- path: '/about',
- name: 'About',
- // route level code-splitting
- // this generates a separate chunk (about.[hash].js) for this route
- // which is lazy-loaded when the route is visited.
- component: () =>
- import(/* webpackChunkName: "about" */ '../views/About.vue'),
- },
+ // {
+ // path: '/oldhome',
+ // name: 'Old Home',
+ // component: Oldhome,
+ // },
+
// dynamic segement `:microcosm` is added to the path
{
path: '/microcosm/:microcosm',
diff --git a/app/src/views/List.vue b/app/src/views/List.vue
index c687213c46ae5d70ba87800cc00f465ac7905eb2..30bb86eb58a1e8d1db58c0056aa69d1627fcce5c 100644
--- a/app/src/views/List.vue
+++ b/app/src/views/List.vue
@@ -1,7 +1,8 @@
<template>
- <div>
+ <div id="listwrapper">
+ <!-- <div v-for="(posvalue, index) in configPositions" v-bind:key="index"> -->
<h1 class="mobile">Your nodes - list mode</h1>
- <h2>For testing</h2>
+ <h2>Testing Only</h2>
<!-- <OffLine
v-for="value in myNodes"
v-bind:key="value.node_id"
@@ -10,38 +11,106 @@
@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>
+ <form>
+ <div>
+ <p id="nodeid" :inner-html.prop="nodetext1 | marked"></p>
+ <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>
+ </form>
+
+ <form>
+ <div>
+ <p id="nodeid" :inner-html.prop="nodetext2 | marked"></p>
+ <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>
+ </form>
+ <div class="btn-row">
+ <BaseButton class="new" buttonClass="action" @click="addNode()"
+ >Create Node</BaseButton
+ >
</div>
- <!-- <OnBoard @clientAdded="clientAdded()" @editTrue="(e) => editTrue(e)" /> -->
+ <form>
+ <!-- <div v-if="posvalue.read_mode == false"> -->
+ <div
+ v-for="value in myNodes.slice().reverse()"
+ 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>
+ <!-- </div> -->
+ <!-- <div v-if="posvalue.read_mode == true">
+ <p class="read" :id="nodeid" :inner-html.prop="nodetext | marked"></p>
+ </div> -->
+ </form>
<ModeToolbar />
</div>
+ <!-- </div> -->
</template>
<script>
// import OffLine from '@/components/OffLine'
// import OnBoard from '@/components/OnBoard.vue'
+import Router from '@/router'
import ModeToolbar from '@/experimental/ModeToolbar'
import { mapState } from 'vuex'
+import marked from 'marked'
+import { shortcutsMixin } from '@/components/mixins/shortcutsMixin.js'
export default {
name: 'List',
-
+ 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:
+ '## Start those engines ! 🎠\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>',
}
},
@@ -53,19 +122,63 @@ 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()
+ }
+ },
+
components: {
// OnBoard,
// OffLine,
ModeToolbar,
},
+ filters: {
+ marked: marked,
+ },
methods: {
clientAdded() {
this.clientset = !this.clientset
},
+ createMicrocosm() {
+ this.$store.dispatch('createMicrocosm', this.localmicrocosm)
+ localStorage.setItem('mylastMicrocosm', this.localmicrocosm)
+ },
+ setClient() {
+ this.$store.dispatch('setClient', this.clientid),
+ localStorage.setItem('myNNClient', this.clientid)
+ },
+
+ letsGo() {
+ this.$emit('clientAdded')
+ },
+
+ addNode() {
+ this.$store.dispatch('addNode')
+ },
+
editTrue(e) {
this.$store.dispatch('shortcutState', e)
},
@@ -80,7 +193,25 @@ export default {
</script>
<style lang="css" scoped>
+h2 {
+ color: red;
+}
.mobile {
font-size: 1em;
}
+
+#listwrapper {
+ margin-left: 1em;
+ margin-bottom: 1em;
+}
+.new {
+ margin-bottom: 1em;
+}
+
+textarea {
+ width: 95%;
+ height: 100px;
+ margin-left: 1em;
+ margin-bottom: 1em;
+}
</style>