Commit d3c62a20 authored by Adam Procter's avatar Adam Procter 💩

Merge branch 'js_library_import'

parents 4c8c3018 2ab49ba5
Pipeline #81 failed with stages
in 1 minute and 30 seconds
This diff is collapsed.
......@@ -123,7 +123,11 @@ body{
border-right: 30px solid grey;
}
#spatialui{
width:600px;
background-color:#BCDFDA;
margin-bottom:30px;
}
......
......@@ -6,6 +6,7 @@
<input type="text" name="email" v-model="input.email" placeholder="Email" />
<button type="button" v-on:click="signin()">Sign in</button>
<font-awesome-icon icon="sign-in-alt" size="3x"/>
</section>
</template>
......
<template>
<div id="spatialui">
<svg></svg>
<div id="spatialui">
<!-- the SVG.js stuff appears here -->
</div>
</template>
<script>
export default {
name: 'spatialui',
props: {
object: Object
}
}
},
mounted: function() {
// SVG UI needs
//var draw = SVG('spatialui').size(300, 300)
var draw = SVG('spatialui').size(600, 300)
// 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 rect_1 = nodes.group().draggy();
// var rect_2 = nodes.group().translate(200, 200).draggy();
// var rect_3 = nodes.group().translate(100, 200).draggy();
var rect_1 = nodes.group().draggy();
var rect_2 = nodes.group().translate(200, 200).draggy();
var rect_3 = nodes.group().translate(100, 200).draggy();
// var rect_1 = draw.rect(50, 50).attr({ fill: '#f06' })
// rect_2.rect(50, 50).attr({ fill: '#f08' })
// rect_3.rect(50, 50).attr({ fill: '#f12' })
rect_1.rect(50, 50).attr({ fill: '#f06' })
rect_2.rect(50, 50).attr({ fill: '#f08' })
rect_3.rect(50, 50).attr({ fill: '#f12' })
// rect_1.connectable({
// container: links,
// markers: markers
// }, rect_2).setLineColor("#000000");
rect_1.connectable({
container: links,
markers: markers
}, rect_2).setLineColor("#000000");
}
}
</script>
......
......@@ -2,7 +2,6 @@ import Vue from 'vue'
import App from './App.vue'
import router from './router'
// Font awesome import statements
import { library } from '@fortawesome/fontawesome-svg-core'
import { faSignInAlt } from '@fortawesome/free-solid-svg-icons'
......@@ -11,18 +10,16 @@ library.add(faSignInAlt)
Vue.component('font-awesome-icon', FontAwesomeIcon)
// end Font Awesome
//import SVG from 'svg.js'
// import connect from 'svg.connectable.js'
// import draggy from 'svg.draggy.js'
Vue.config.productionTip = false
//Object.defineProperty(Vue.prototype, '$SVG', { value: SVG });
//Object.defineProperty(Vue.prototype, '$connect', { value: connect });
//Object.defineProperty(Vue.prototype, '$draggy', { value: draggy });
import SVG from 'svg.js'
import draggy from 'svg.draggy.js'
import connectable from 'svg.connectable.js'
Vue.config.productionTip = false
new Vue({
router, //SVG,
router,
render: h => h(App)
}).$mount('#app')
......
<template>
<div>
<header>
<h3 class="hello">You are connected to instance : {{instancename}}</h3>
</header>
<div id="start">
<signin :instancename="instancename"></signin>
<register></register>
</div>
</div>
<div>
<header>
<h3 class="hello">You are connected to instance : {{instancename}}</h3>
</header>
<div id="start">
<signin :instancename="instancename"></signin>
<register></register>
</div>
</div>
</template>
<script>
......
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