Commit 0e36c5cd authored by Adam Procter's avatar Adam Procter

clean up

using more ES6 good practice and added suggested lint / prettier config as per vue mastery guides
parent 86bd692e
Pipeline #248 canceled with stages
module.exports = {
root: true,
env: {
node: true
},
extends: [
"plugin:vue/essential",
"plugin:prettier/recommended",
"@vue/prettier"
],
rules: {
"no-console": process.env.NODE_ENV === "production" ? "error" : "off",
"no-debugger": process.env.NODE_ENV === "production" ? "error" : "off"
},
parserOptions: {
parser: "babel-eslint"
}
};
module.exports = {
singleQuote: true,
semi: false
};
......@@ -4,11 +4,11 @@
<script>
export default {
name: "account-settings",
name: 'account-settings',
props: {
name: String
}
};
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
......
......@@ -11,18 +11,18 @@
<script>
//import knowledgeobject from './knowledge-object.vue'
import humaninterface from "./human-interface.vue";
import humaninterface from './human-interface.vue'
// helper to access data from vuex
import { mapState } from "vuex";
import { mapState } from 'vuex'
export default {
name: "current-instance",
name: 'current-instance',
components: {
// knowledgeobject,
humaninterface
},
computed: mapState(["accounts_db", "knowledge_db", "positions_db"])
};
computed: mapState(['accounts_db', 'knowledge_db', 'positions_db'])
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
......
......@@ -9,25 +9,25 @@
<script>
/* eslint-disable */
import SVG from "svg.js";
import SVG from 'svg.js'
// next two libraries used within SVG.js
import draggy from "svg.draggy.js";
import connectable from "svg.connectable.js";
import { mapGetters, mapActions, mapState } from "vuex";
import { state } from "vuex";
import draggy from 'svg.draggy.js'
import connectable from 'svg.connectable.js'
import { mapGetters, mapActions, mapState } from 'vuex'
import { state } from 'vuex'
import styledviewer from "@/components/styled-viewer.vue";
import styledviewer from '@/components/styled-viewer.vue'
var knowledgeObj;
var knowledgeObjid;
var knowledgeObj
var knowledgeObjid
var canvasX = 600;
var canvasY = 300;
var xOffset = 0;
var yOffset = -370;
var canvasX = 600
var canvasY = 300
var xOffset = 0
var yOffset = -370
export default {
name: "human-interface",
name: 'human-interface',
components: {
styledviewer: styledviewer
},
......@@ -40,18 +40,18 @@ export default {
xpos: null,
ypos: null,
isShowing: false
};
}
},
methods: {
...mapGetters(["allObjects", "allPositions"]),
...mapGetters(["accounts_db", "knowledge_db", "positions_db"]),
...mapGetters(['allObjects', 'allPositions']),
...mapGetters(['accounts_db', 'knowledge_db', 'positions_db']),
...mapActions([
"showKnowledgeObjects",
"getKnowledgeObjects",
"getKnowledgePositions"
'showKnowledgeObjects',
'getKnowledgeObjects',
'getKnowledgePositions'
]),
...mapActions(["addKnowledgeObject", "updateKnowledgePosition"])
...mapActions(['addKnowledgeObject', 'updateKnowledgePosition'])
},
props: {
......@@ -59,81 +59,81 @@ export default {
},
mounted: function() {
// SVG UI next
console.log("inside human-interface mounted()");
console.log(this.knowledge_db());
var draw = SVG("human-interface").size(canvasX, canvasY);
var objects = [];
var positions = [];
console.log('inside human-interface mounted()')
console.log(this.knowledge_db())
var draw = SVG('human-interface').size(canvasX, canvasY)
var objects = []
var positions = []
//FIXME Iterate over contents of state.knowlege_db instead
console.log("NEXT OUTPUT IS KNOWLEDGE_DB FROM INSIDE human-interface.vue");
console.log(this.getKnowledgeObjects());
console.log('NEXT OUTPUT IS KNOWLEDGE_DB FROM INSIDE human-interface.vue')
console.log(this.getKnowledgeObjects())
// this.$store.state.knowledge_db.allDocs().forEach(element => {
this.allObjects().forEach(element => {
objects.push(element.__ob__.value.doc);
});
objects.push(element.__ob__.value.doc)
})
this.allPositions().forEach(element => {
positions.push(element.__ob__.value.doc);
});
positions.push(element.__ob__.value.doc)
})
var links = draw.group();
var markers = draw.group();
var nodes = draw.group();
var links = draw.group()
var markers = draw.group()
var nodes = draw.group()
var index = 0;
var colours = ["red", "green", "blue", "yellow", "cyan"];
var objectsProcessed = 0;
var index = 0
var colours = ['red', 'green', 'blue', 'yellow', 'cyan']
var objectsProcessed = 0
// when fired loops through applying all the positions if id matches
// needs to be running this update in Realtime to update moves
// maybe in watch: { } ??? function ???
nodes.on("startyourpositions", event => {
console.log("hit");
});
nodes.on('startyourpositions', event => {
console.log('hit')
})
// loops through all the objects and renders them
objects.forEach(object => {
//index = index + 20
knowledgeObj = nodes.group().draggy();
knowledgeObj = nodes.group().draggy()
//.draggy({ minX: 0, minY: 0, maxX: canvasX, maxY: canvasY });
// assigns group <g id="id" of the unique id in database
knowledgeObj.node.id = object._id;
knowledgeObj.node.id = object._id
var pos = positions.filter(
position => position.id == knowledgeObj.node.id
);
var x = pos[0].xpos || 0;
var y = pos[0].ypos || 0;
)
var x = pos[0].xpos || 0
var y = pos[0].ypos || 0
if (object.type == "projecttxt") {
if (object.type == 'projecttxt') {
knowledgeObj.rect(60, 40).attr({
fill: colours[Math.floor(Math.random() * colours.length)],
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") {
})
} else if (object.type == 'slidedeck') {
knowledgeObj.circle(30, 30).attr({
fill: colours[Math.floor(Math.random() * colours.length)],
cx: x,
cy: y
});
})
} else {
knowledgeObj.ellipse(20, 50).attr({
fill: colours[Math.floor(Math.random() * colours.length)],
cx: x,
cy: y
});
})
}
objectsProcessed++;
objectsProcessed++
if (objectsProcessed === objects.length) {
nodes.fire("startyourpositions");
console.log("fire...");
nodes.fire('startyourpositions')
console.log('fire...')
}
});
})
//console.log(knowledgeObj.node.id);
// parentNode
......@@ -153,8 +153,8 @@ 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('start connect')
})
nodes.mouseup(event => {
// FIX ME : we know the id and the locations to
......@@ -162,36 +162,36 @@ export default {
//console.log(event.clientX, event.clientY);
// the id of the g object of the clicked svg object
//console.log(SVG.adopt(event.target.parentNode).id())
this.id = SVG.adopt(event.target.parentNode).id();
var obj;
this.id = SVG.adopt(event.target.parentNode).id()
var obj
this.allObjects().forEach(obj => {
if (obj.id == this.id) {
this.object = obj;
this.object = obj
}
});
console.log("ths object");
console.log(this.object);
})
console.log('ths object')
console.log(this.object)
var pos = new Object();
pos["id"] = this.id;
pos["xpos"] = event.clientX + xOffset;
pos["ypos"] = event.clientY + yOffset;
var pos = new Object()
pos['id'] = this.id
pos['xpos'] = event.clientX + xOffset
pos['ypos'] = event.clientY + yOffset
this.$store.dispatch("updateKnowledgePosition", pos);
});
this.$store.dispatch('updateKnowledgePosition', pos)
})
nodes.dblclick(node => {
this.id = SVG.adopt(node.target.parentNode).id();
this.id = SVG.adopt(node.target.parentNode).id()
// isShowing = true
// component styled-viewer
if (this.isShowing == false) {
this.isShowing = true;
this.isShowing = true
} else {
this.isShowing = false;
this.isShowing = false
}
});
})
}
};
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
......
<template>
<div class="logo">
<h1>node
<h1>
node
<span>noggin</span>
<!-- <img src="../assets/img/icon.png" alt="Logo for project codename nodenoggin"> -->
</h1>
......@@ -9,9 +10,9 @@
<script>
export default {
name: "instance-logo",
name: 'instance-logo',
props: {}
};
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
......
......@@ -10,11 +10,11 @@
<script>
export default {
name: "knowledge-object",
name: 'knowledge-object',
props: {
// object: Array
}
};
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
......
......@@ -20,15 +20,15 @@
//var db = new pouchdb('https://nn.adamprocter.co.uk/accounts');
export default {
name: "register-account",
name: 'register-account',
data() {
return {
name: "",
email: "",
domain: "",
name: '',
email: '',
domain: '',
permissions: 1,
verified: false
};
}
},
mounted() {
// this.syncData();
......@@ -36,7 +36,7 @@ export default {
methods: {
registeraccount() {
//console.log(this.input)
this.$store.dispatch("registerAccount", this);
this.$store.dispatch('registerAccount', this)
}
}
// var uniqueid = Math.random().toString(36).substring(2, 15)
......@@ -75,7 +75,7 @@ export default {
// //})
// }
// }
};
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
......
<template>
<section class="selector">
<h2>instances</h2>
<div id="instances">
<a class="instanceone" href="/home">
instance one
<div class="in1">
</div>
</a>
<a class="instancetwo" href="/home">
instance two
</a>
<a href="#">
Create instance
</a>
</div>
</section>
<section class="selector">
<h2>instances</h2>
<div id="instances">
<a class="instanceone" href="/home">instance one
<div class="in1"></div>
</a>
<a class="instancetwo" href="/home">instance two</a>
<a href="#">Create instance</a>
</div>
</section>
</template>
<script>
export default {
name: "select-instances",
props: {}
};
name: 'select-instances',
props: {}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
......
......@@ -12,13 +12,13 @@
<script>
export default {
name: "sign-in",
name: 'sign-in',
data() {
return {
input: {
email: ""
email: ''
}
};
}
},
props: {
instancename: String,
......@@ -29,15 +29,15 @@ export default {
//FIXME check this.input.email against pouch valid accounts
//FIXME generate token, save to remote and local session stores
this.$store
.dispatch("login", {
.dispatch('login', {
email: this.input.email
})
.then(() => {
this.$router.push("/home");
});
this.$router.push('/home')
})
}
}
};
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
......
......@@ -7,14 +7,14 @@
<script>
export default {
name: "styled-viewer",
name: 'styled-viewer',
// methods: {
// getobjecttitle: function(object_id) {
// console.log("object id: " + this.object_id);
// }
// },
props: ["object"]
};
props: ['object']
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
......
......@@ -8,12 +8,12 @@
</template>
<script>
import logo from "@/components/instance-logo.vue";
import logo from '@/components/instance-logo.vue'
export default {
name: "about",
name: 'about',
components: {
logo: logo
logo
}
};
}
</script>
\ No newline at end of file
......@@ -24,21 +24,21 @@
// 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";
import logo from '@/components/instance-logo.vue'
export default {
name: "editor",
name: 'editor',
components: {
logo: logo
logo
},
data() {
return {
type: "",
author: "",
title: "",
type: '',
author: '',
title: '',
connections: [],
metadata: {}
};
}
},
mounted() {
......@@ -47,7 +47,7 @@ export default {
methods: {
addKnowledgeObject() {
this.$store.dispatch("addKnowledgeObject", this);
this.$store.dispatch('addKnowledgeObject', this)
// var uniqueid = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
......@@ -94,7 +94,7 @@ export default {
//}
}
};
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
......
......@@ -8,14 +8,14 @@
<script>
// @ is an alias to /src
import logo from "@/components/instance-logo.vue";
import instance from "@/components/current-instance.vue";
import logo from '@/components/instance-logo.vue'
import instance from '@/components/current-instance.vue'
export default {
name: "home",
name: 'home',
components: {
instance: instance,
logo: logo
instance,
logo
},
props: {
......@@ -23,11 +23,11 @@ export default {
},
created() {
this.$store.dispatch("showKnowledgeObjects");
this.$store.dispatch("getKnowledgePositions");
this.$store.dispatch('showKnowledgeObjects')
this.$store.dispatch('getKnowledgePositions')
//this.$store.getters.allObjects
//return this.$store.getters.allObjects
}
};
}
</script>
......@@ -12,20 +12,20 @@
</template>
<script>
import logo from "@/components/instance-logo.vue";
import signin from "@/components/sign-in.vue";
import register from "@/components/register-account.vue";
import selectinstances from "@/components/select-instances.vue";
import logo from '@/components/instance-logo.vue'
import signin from '@/components/sign-in.vue'
import register from '@/components/register-account.vue'
import selectinstances from '@/components/select-instances.vue'
export default {
name: "app",
name: 'app',
components: {
signin: signin,
register: register,
logo: logo,
selectinstances: selectinstances
signin,
register,
logo,
selectinstances
}
};
}
</script>
<style scoped>
......
......@@ -6,12 +6,12 @@
</template>
<script>
import logo from "@/components/instance-logo.vue";
import logo from '@/components/instance-logo.vue'
export default {
name: "stats",
name: 'stats',
components: {
logo: logo
logo
}
};
}
</script>
\ No newline at end of file
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment