Skip to content
Commits on Source (7)
......@@ -15,17 +15,16 @@
</head>
<body>
<!-- Add your site or application content here -->
<div id="app">
<div id="instance">
<instance :name="name" :allobjects="allobjects" inline-template>
<div id="knowledgeobject">
<knowledgeobject v-for="knowledgeobject in allobjects" :key="knowledgeobject.id" :knowledgeobject="knowledgeobject" inline-template>
<p>Hey {{knowledgeobject.id}}</p>
</knowledgeobject>
</div>
</instance>
</div>
</div>
<div id="app">
<h1>nodenoggin</h1>
<instance :name="name" :human="human" :allobjects="allobjects">
</instance>
</div>
<script src='js/vue.js'></script>
<script src='js/svg.js'></script>
......
Vue.component(
'instance', {
template:`
<div id="instance">
<h2>instance : {{name}}</h2>
<h3>signed in as : {{human}}</h3>
<knowledgeobject v-for="knowledgeobject in allobjects" :key="knowledgeobject.id" :knowledgeobject="knowledgeobject">
</knowledgeobject>
</div>
`,
props: {
name: String,
email: String,
human: String,
permission: Number,
allobjects: Array
},
template: '#instance'
}
}
)
Vue.component(
'knowledgeobject', {
'knowledgeobject', {
template:`
<ul class="knowledgeobject">
<li>Hey, id = {{knowledgeobject.id}}</li>
<li>Type = {{knowledgeobject.type}}</li>
<ul>
`,
props: {
knowledgeobject: Object
},
template:'#knowledgeobject'
}
}
)
......@@ -22,19 +36,22 @@ new Vue({
el: '#app',
data () {
return {
name:'versionone',
name:'mozfest',
human:'adam procter',
email:'yay@yahoo.com',
permissions: 1,
allobjects: [
{
id:1,
type:'',
owner:'',
type:'sheet',
owner:'adam procter',
connections:[],
metadata:{}
},
{
id:2,
type:'',
owner:'',
type:'slides',
owner:'adam procter',
connections:[],
metadata:{}
}
......@@ -42,3 +59,21 @@ new Vue({
}
}
})
// SVG code starts here
// var draw = SVG('knowledgeobject').size(300, 300)
// 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();
// rect_1.rect(50, 50).attr({ fill: '#f06' })
// rect_2.rect(50, 50).attr({ fill: '#f08' })
// rect_1.connectable({
// container: links,
// markers: markers
// }, rect_2).setLineColor("#000000");