single click highlight

src/components/human-interface.vue

@@ -82,7 +82,9 @@ export default {
     var nodes = draw.group()
 
     var index = 0
-    var colours = ['red', 'green', 'blue', 'yellow', 'cyan']
+    //Instance colour
+    var colour = '#F9B821'
+    var colourtwo = 'red'
     var objectsProcessed = 0
 
     // when fired loops through applying all the positions if id matches
@@ -108,23 +110,23 @@ export default {
       var y = pos[0].ypos || 0
 
       if (object.type == 'projecttxt') {
-        knowledgeObj.rect(60, 40).attr({
-          fill: colours[Math.floor(Math.random() * colours.length)],
+        knowledgeObj.rect(40, 40).attr({
+          fill: colour,
           x: x,
           y: y
           //.svg('<g id="doc" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><rect id="Rectangle-2" fill="#000000" x="3" y="0" width="115" height="171"></rect><rect id="Rectangle" stroke="#FFFFFF" stroke-width="7" x="3.5" y="3.5" width="113" height="164"></rect><path d="M23.5,40.5 L95,40.5" id="Line-3" stroke="#979797" stroke-width="4" stroke-linecap="square"></path><path d="M24.5,54.25 L96,54.25" id="Line-3-Copy" stroke="#979797" stroke-width="4" stroke-linecap="square"></path><path d="M24.5,69.25 L96,69.25" id="Line-3-Copy-2" stroke="#979797" stroke-width="4" stroke-linecap="square"></path><path d="M24.5,86.25 L70,86.25" id="Line-3-Copy-3" stroke="#979797" stroke-width="4" stroke-linecap="square"></path></g>')
         })
       } else if (object.type == 'slidedeck') {
-        knowledgeObj.circle(30, 30).attr({
-          fill: colours[Math.floor(Math.random() * colours.length)],
+        knowledgeObj.rect(30, 30).attr({
+          fill: colour,
           cx: x,
           cy: y
         })
       } else {
-        knowledgeObj.ellipse(20, 50).attr({
-          fill: colours[Math.floor(Math.random() * colours.length)],
-          cx: x,
-          cy: y
+        knowledgeObj.polygon('0,0 50,15 15,50').attr({
+          fill: colour,
+          x: x,
+          y: y
         })
       }
 
@@ -153,7 +155,11 @@ export default {
     // mousedown is capturing a single mouse press
     // possibly useful for drawing connections between objects
     nodes.mousedown(node => {
-      console.log('start connect')
+      console.log('mouse down')
+      // change to expand select FACF6C
+      this.id = SVG.adopt(node.target.parentNode).id()
+      var element = SVG.get(this.id)
+      element.attr({ stroke: '#FACF6C', 'stroke-width': 5 })
     })
 
     nodes.mouseup(event => {
@@ -169,9 +175,8 @@ export default {
           this.object = obj
         }
       })
-      console.log('ths object')
-      console.log(this.object)
-
+      // console.log('this object')
+      // console.log(this.object)
       var pos = new Object()
       pos['id'] = this.id
       pos['xpos'] = event.clientX + xOffset

src/views/editor.vue

@@ -18,12 +18,6 @@
 </template>
 
 <script>
-//import pouchdb from 'pouchdb'
-
-//var localdb = new pouchdb('knowledge');
-// server admin has to create DB first and CORS allows specific domains.
-//var db = new pouchdb('https://nn.adamprocter.co.uk/knowledge');
-
 import logo from '@/components/instance-logo.vue'
 
 export default {
@@ -40,59 +34,10 @@ export default {
       metadata: {}
     }
   },
-
-  mounted() {
-    // this.syncData();
-  },
-
   methods: {
     addKnowledgeObject() {
       this.$store.dispatch('addKnowledgeObject', this)
-
-      // var uniqueid = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
-
-      //    localdb.put({
-      //      _id:uniqueid,
-      //      type:this.type,
-      //      author:localStorage.getItem("token"),
-      //      // need to change owner in DB
-      //      title:this.title,
-      //      connections:this.connections,
-      //      metadata:this.metadata,
-
-      //    })
-
-      //     this.syncData()
-      //    },
-
-      // syncData(){
-      //   if (db) {
-      //     localdb.sync(db)
-      //     }
-      //alert ("did thing")
     }
-
-    // checkData(){
-    //    db.info().then(function (info) {
-    //      // console.log(info);
-    //     })
-    //     //  db.get('one').then(function (doc) {
-    //     //   console.log(doc);
-    //     //  });
-
-    // db.allDocs({
-    //         include_docs: true,
-    //         attachments: true
-    //       }).then(function (result) {
-    //         // handle result
-    //       this.$router.push("/editor");
-    //       console.log(result)
-    //       // console.log(result)
-    //       }).catch(function (err) {
-    //       //  console.log(err);
-    //       });
-
-    //}
   }
 }
 </script>