Auto stash before merge of "feature/nodes-and-connections-canvas" and "listView"

app/.eslintrc.js

 module.exports = {
   root: true,
   env: {
-    node: true,
+    node: true
   },
   extends: ['plugin:vue/essential', 'eslint:recommended', '@vue/prettier'],
   parserOptions: {
-    parser: 'babel-eslint',
+    parser: 'babel-eslint'
   },
   rules: {
     'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
-  },
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
+  }
 }

app/.prettierrc.js

 module.exports = {
   singleQuote: true,
-  semi: false,
+  semi: false
 }

app/babel.config.js

 module.exports = {
-  presets: ['@vue/cli-plugin-babel/preset'],
+  presets: ['@vue/cli-plugin-babel/preset']
 }

app/src/components/BaseButton.vue

@@ -11,9 +11,9 @@
 export default {
   props: {
     buttonClass: {
-      type: String,
-    },
-  },
+      type: String
+    }
+  }
 }
 </script>
 

app/src/components/ControlsLayer.vue

@@ -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() {
@@ -105,8 +105,8 @@ export default {
     },
     getServerUrl: function() {
       return serverUrl || window.location.origin
-    },
-  },
+    }
+  }
 }
 </script>
 

app/src/components/ListLayer.vue

@@ -18,17 +18,17 @@ export default {
   name: 'ListLayer',
   props: {
     nodeid: String,
-    nodetext: String,
+    nodetext: String
   },
 
   computed: mapState({
-    myNodes: (state) => state.myNodes,
+    myNodes: state => state.myNodes
   }),
 
   filters: {
     // need to write a reverse data filter I suspect here so new data is at the top of list
-    marked: marked,
-  },
+    marked: marked
+  }
 }
 </script>
 

app/src/components/NodesLayer.vue

@@ -76,19 +76,19 @@ export default {
     nodetext: String,
     nodewidth: Number,
     nodeheight: Number,
-    deleted: Boolean,
+    deleted: Boolean
   },
 
   data() {
     return {
       pickupz: 99,
       readmode: false,
-      mode: 'Read',
+      mode: 'Read'
     }
   },
 
   filters: {
-    marked: marked,
+    marked: marked
   },
 
   // FIXME: how do we know how to focus on the newest node ?
@@ -106,9 +106,9 @@ export default {
   // },
 
   computed: mapState({
-    myNodes: (state) => state.myNodes,
-    configPositions: (state) => state.configPositions,
-    configEmoji: (state) => state.configEmoji,
+    myNodes: state => state.myNodes,
+    configPositions: state => state.configPositions,
+    configEmoji: state => state.configEmoji
   }),
   methods: {
     onActivated() {
@@ -146,7 +146,7 @@ export default {
         y,
         width,
         height,
-        zindex,
+        zindex
       })
     },
     onDrag(x, y) {
@@ -172,7 +172,7 @@ export default {
         y,
         width,
         height,
-        zindex,
+        zindex
       })
     },
 
@@ -198,8 +198,8 @@ export default {
         this.readmode = true
         this.mode = 'Edit'
       }
-    },
-  },
+    }
+  }
 }
 </script>
 

app/src/components/OnBoard.vue

@@ -79,7 +79,7 @@ export default {
       clientid: '',
       parta: true,
       partb: false,
-      partc: false,
+      partc: false
     }
   },
 
@@ -120,8 +120,8 @@ export default {
     },
     readyFocusTwo() {
       this.$refs.objectnametwo.focus()
-    },
-  },
+    }
+  }
 }
 </script>
 

app/src/components/OtherListlayer.vue

@@ -20,17 +20,17 @@ export default {
   name: 'OtherListlayer',
   props: {
     nodeid: String,
-    nodetext: String,
+    nodetext: String
   },
 
   computed: mapState({
-    otherNodes: (state) => state.otherNodes,
+    otherNodes: state => state.otherNodes
   }),
 
   filters: {
     // need to write a reverse data filter I suspect here so new data is at the top of list
-    marked: marked,
-  },
+    marked: marked
+  }
 }
 </script>
 

app/src/components/OtherNodeslayer.vue

@@ -99,32 +99,32 @@ export default {
   name: 'otherNodeslayer',
 
   components: {
-    EmojiPicker,
+    EmojiPicker
   },
   props: {
     nodeid: String,
     nodetext: String,
     nodewidth: Number,
-    nodeheight: Number,
+    nodeheight: Number
   },
 
   data() {
     return {
       input: '',
       search: '',
-      pickupz: 99,
+      pickupz: 99
     }
   },
 
   filters: {
-    marked: marked,
+    marked: marked
   },
 
   mounted() {},
   computed: mapState({
-    otherNodes: (state) => state.otherNodes,
-    configPositions: (state) => state.configPositions,
-    configEmoji: (state) => state.configEmoji,
+    otherNodes: state => state.otherNodes,
+    configPositions: state => state.configPositions,
+    configEmoji: state => state.configEmoji
   }),
   methods: {
     onActivated() {
@@ -162,7 +162,7 @@ export default {
         y,
         width,
         height,
-        zindex,
+        zindex
       })
     },
     onDrag(x, y) {
@@ -188,7 +188,7 @@ export default {
         y,
         width,
         height,
-        zindex,
+        zindex
       })
     },
     append(emoji) {
@@ -199,19 +199,19 @@ export default {
       nodeid = this.nodeid
       this.$store.dispatch('addEmoji', {
         nodeid,
-        emojitext,
+        emojitext
       })
 
       this.input = ''
-    },
+    }
   },
   directives: {
     focus: {
       inserted(el) {
         el.focus()
-      },
-    },
-  },
+      }
+    }
+  }
 }
 </script>
 

app/src/components/mixins/drag.js

@@ -60,6 +60,6 @@ export const drag = {
       function setTranslate(xPos, yPos, el) {
         el.style.transform = 'translate3d(' + xPos + 'px, ' + yPos + 'px, 0)'
       }
-    },
-  },
+    }
+  }
 }

app/src/components/mixins/draw.js

@@ -25,6 +25,6 @@ export const draw = {
 
       ctx.stroke()
       ctx.setTransform(1, 0, 0, 1, 0, 0)
-    },
-  },
+    }
+  }
 }

app/src/components/mixins/shortcutsMixin.js

@@ -11,6 +11,6 @@ export const shortcutsMixin = {
           this.addNode()
         }
       }
-    },
-  },
+    }
+  }
 }

app/src/experimental/ModeToolbar.vue

@@ -6,7 +6,10 @@
       v-bind:key="mode.name"
       v-bind:class="isActive(mode) ? 'active' : 'inactive'"
     >
-      <Icon v-bind:type="mode.icon" v-bind:theme="isActive(mode) ? 'light' : 'dark'" />
+      <Icon
+        v-bind:type="mode.icon"
+        v-bind:theme="isActive(mode) ? 'light' : 'dark'"
+      />
     </button>
   </nav>
 </template>

app/src/experimental/icons/library/addNode.vue

@@ -5,8 +5,16 @@
       clip-rule="evenodd"
       d="M37 15H17.1154V30.8636H37V15ZM15.1154 13V32.8636H39V13H15.1154Z"
     />
-    <path fill-rule="evenodd" clip-rule="evenodd" d="M26 27L26 19L28 19L28 27L26 27Z" />
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M26 27L26 19L28 19L28 27L26 27Z"
+    />
     <path fill-rule="evenodd" clip-rule="evenodd" d="M31 24H23V22H31V24Z" />
-    <path fill-rule="evenodd" clip-rule="evenodd" d="M16 16.1364H12V36H35.8846V32H16V16.1364Z" />
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M16 16.1364H12V36H35.8846V32H16V16.1364Z"
+    />
   </g>
 </template>

app/src/experimental/icons/library/index.js

@@ -9,4 +9,15 @@ import person from './person'
 import plus from './plus'
 import select from './select'
 
-export { addNode, connection, draw, idea, magnify, minus, move, person, plus, select }
+export {
+  addNode,
+  connection,
+  draw,
+  idea,
+  magnify,
+  minus,
+  move,
+  person,
+  plus,
+  select
+}

app/src/experimental/icons/library/magnify.vue

 <template>
   <g>
-    <rect x="11" y="36.4246" width="10.5" height="4" transform="rotate(-45 11 36.4246)" />
+    <rect
+      x="11"
+      y="36.4246"
+      width="10.5"
+      height="4"
+      transform="rotate(-45 11 36.4246)"
+    />
     <path
       fill-rule="evenodd"
       clip-rule="evenodd"