Skip to content

K
kodex
Commit 43de147f authored by pierre's avatar pierre
Browse files
Options

Merge branch 'master' of https://github.com/padagraph/botapadd

parents 4a68e69e 27041db3
Hide whitespace changes
Inline Side-by-side
Showing with 179 additions and 166 deletions
templates/botapadapp.html
View file @ 43de147f
...@@ -308,40 +308,42 @@ ...@@ -308,40 +308,42 @@
<link rel="import" href="{{static_host}}/static/padagraph-gviz-min.html"> <link rel="import" href="{{static_host}}/static/padagraph-gviz-min.html">
<dom-module id="graph-app"> <dom-module id="graph-app">
<template> <template>
<padagraph-gviz-json sync="{{sync}}" routes="{{routes}}" data="{{data}}"> <div id="boo">
<padagraph-gviz options="{{options}}"> <padagraph-gviz-json sync="{{sync}}" routes="{{routes}}" data="{{data}}">
<div id="viz"></div> <padagraph-gviz options="{{options}}">
<!-- liste and card details --> <div id="viz"></div>
<div id="cardmenu" class="ui compact menu"><a id="listbutton" on-click="togglelist" class="link item"><i class="list alternate outline icon"></i>list</a><a id="cardbutton" on-click="togglecard" class="link item active"><i class="id card outline icon"></i>details</a></div> <!-- liste and card details -->
<padagraph-model-popup id="gvizpopup" hidden$="{{'{{is_hidden(display_card)}}'}}"></padagraph-model-popup> <div id="cardmenu" class="ui compact menu"><a id="listbutton" on-click="togglelist" class="link item"><i class="list alternate outline icon"></i>list</a><a id="cardbutton" on-click="togglecard" class="link item active"><i class="id card outline icon"></i>details</a></div>
<padagraph-collection mode="node" hidden$="{{'{{is_hidden(display_list)}}'}}"></padagraph-collection> <padagraph-model-popup id="gvizpopup" hidden$="{{'{{is_hidden(display_card)}}'}}"></padagraph-model-popup>
<div id="menu" class="ui icon borderless vertical menu"> <padagraph-collection mode="node" hidden$="{{'{{is_hidden(display_list)}}'}}"></padagraph-collection>
<padagraph-collection-filter mode="node" asitem="asitem"></padagraph-collection-filter> <div id="menu" class="ui icon borderless vertical menu">
<padagraph-collection-filter mode="edge" asitem="asitem"></padagraph-collection-filter> <padagraph-collection-filter mode="node" asitem="asitem"></padagraph-collection-filter>
<div class="ui divider"> </div> <padagraph-collection-filter mode="edge" asitem="asitem"></padagraph-collection-filter>
<padagraph-engine-control engine="layout" asitem="asitem"></padagraph-engine-control> <div class="ui divider"> </div>
<!--padagraph-engine-control( engine="clustering" asitem="asitem")--> <padagraph-engine-control engine="layout" asitem="asitem"></padagraph-engine-control>
<!--padagraph-engine-control( engine="explore" asitem="asitem")--> <!--padagraph-engine-control( engine="clustering" asitem="asitem")-->
<div class="ui divider"></div><a id="keb_settings" class="ui item"><i class="settings icon"></i></a> <!--padagraph-engine-control( engine="explore" asitem="asitem")-->
</div> <div class="ui divider"></div><a id="keb_settings" class="ui item"><i class="settings icon"></i></a>
<div id="labels" class="ui grid">
<div class="six wide column">
<padagraph-labels-control></padagraph-labels-control>
</div> </div>
<div class="six wide column"> <div id="labels" class="ui grid">
<padagraph-node-search actions="add,explore"></padagraph-node-search>{% if graphurl %} <a href="{{graphurl}}" class="ui tiny active refresh button">refresh</a>{% endif %} <div class="six wide column">
</div> <padagraph-labels-control></padagraph-labels-control>
<div class="four wide column"> </div>
<div id="loading"> <div class="six wide column">
<p>Loading...</p> <padagraph-node-search actions="add,explore"></padagraph-node-search>{% if graphurl %} <a href="{{graphurl}}" class="ui tiny active refresh button">refresh</a>{% endif %}
</div>
<div class="four wide column">
<div id="loading">
<p>Loading...</p>
</div>
</div> </div>
</div> </div>
</div> </padagraph-gviz>
</padagraph-gviz> </padagraph-gviz-json>
</padagraph-gviz-json> </div>
</template> </template>
<script> <script>
require(['backbone', 'cello', 'gviz', 'materials', 'pdgconst'], function (Backbone, Cello, Gviz, Materials, Const ) { require(['backbone', 'jquery', 'cello', 'gviz', 'materials', 'pdgconst'], function (Backbone, $, Cello, Gviz, Materials, Const ) {
Polymer({ Polymer({
is: "graph-app", is: "graph-app",
...@@ -388,11 +390,18 @@ ...@@ -388,11 +390,18 @@
attached() { attached() {
this.async( this.startapp ); var start = this.startapp.bind(this);
this._observer =
Polymer.dom(this.$.boo).observeNodes(function(info) {
info.addedNodes.filter(function(node) {
if (node.tagName === "PADAGRAPH-GVIZ-JSON")
document.querySelector('padagraph-gviz-json').addEventListener('engines-complete', start );
});
});
}, },
startapp() { startapp(e) {
this.toggle();
document.querySelector('padagraph-model-popup').hidden = true; document.querySelector('padagraph-model-popup').hidden = true;
this.toggle();
var _window_resized = function(){ var _window_resized = function(){
var e = document.getElementById('gviz'); var e = document.getElementById('gviz');
...@@ -413,40 +422,36 @@ ...@@ -413,40 +422,36 @@
element.classList.toggle("show"); element.classList.toggle("show");
}; };
console.log(e.detail.app); // true
var app = e.detail.app;
var engines = [];
var app_engines = {
'explore':app.engines.explore,
//'expand':app.engines.expand_px,
'layout':app.engines.layout,
'clustering':app.engines.clustering,
};
for (var k in app_engines){
var engine = app_engines[k]
engine.name = k;
engines.push(engine);
}
document.querySelector('padagraph-gviz-json').addEventListener('engines-complete', function (e) { $('padagraph-collection')[0].app = app;
$('padagraph-collection')[0].graph = app.models.graph;
console.log(e.detail.app); // true
var app = e.detail.app; var keb = document.createElement("padagraph-keb")
keb.engines = engines;
var engines = []; $("#keb")
var app_engines = { .sidebar('setting', 'dimPage', false)
'explore':app.engines.explore, .sidebar('setting', 'transition', 'overlay')
//'expand':app.engines.expand_px, $("#kebcontent").append(keb)
'layout':app.engines.layout, $("#keb .close i.close.icon").click( ()=>{ $("#keb").sidebar('hide') } )
'clustering':app.engines.clustering, $("#keb_settings").click( ()=>{ $("#keb").sidebar('show') } )
};
for (var k in app_engines){
var engine = app_engines[k]
engine.name = k;
engines.push(engine);
}
$('padagraph-collection')[0].app = app;
$('padagraph-collection')[0].graph = app.models.graph;
var keb = document.createElement("padagraph-keb")
keb.engines = engines;
$("#keb")
.sidebar('setting', 'dimPage', false)
.sidebar('setting', 'transition', 'overlay')
$("#kebcontent").append(keb)
$("#keb .close i.close.icon").click( ()=>{ $("#keb").sidebar('hide') } )
$("#keb_settings").click( ()=>{ $("#keb").sidebar('show') } )
_window_resized(); _window_resized();
})
} }
}) })
}); });
......
templates/graph.html
View file @ 43de147f
...@@ -194,40 +194,42 @@ ...@@ -194,40 +194,42 @@
<link rel="import" href="{{static_host}}/static/padagraph-gviz-min.html"/> <link rel="import" href="{{static_host}}/static/padagraph-gviz-min.html"/>
<dom-module id="graph-app"> <dom-module id="graph-app">
<template> <template>
<padagraph-gviz-json sync="{{sync}}" routes="{{routes}}" data="{{data}}"> <div id="boo">
<padagraph-gviz options="{{options}}"> <padagraph-gviz-json sync="{{sync}}" routes="{{routes}}" data="{{data}}">
<div id="viz"></div> <padagraph-gviz options="{{options}}">
<!-- liste and card details --> <div id="viz"></div>
<div id="cardmenu" class="ui compact menu"><a id="listbutton" on-click="togglelist" class="link item"><i class="list alternate outline icon"></i>list</a><a id="cardbutton" on-click="togglecard" class="link item active"><i class="id card outline icon"></i>details</a></div> <!-- liste and card details -->
<padagraph-model-popup id="gvizpopup" hidden$="{{'{{is_hidden(display_card)}}'}}"></padagraph-model-popup> <div id="cardmenu" class="ui compact menu"><a id="listbutton" on-click="togglelist" class="link item"><i class="list alternate outline icon"></i>list</a><a id="cardbutton" on-click="togglecard" class="link item active"><i class="id card outline icon"></i>details</a></div>
<padagraph-collection mode="node" hidden$="{{'{{is_hidden(display_list)}}'}}"></padagraph-collection> <padagraph-model-popup id="gvizpopup" hidden$="{{'{{is_hidden(display_card)}}'}}"></padagraph-model-popup>
<div id="menu" class="ui icon borderless vertical menu"> <padagraph-collection mode="node" hidden$="{{'{{is_hidden(display_list)}}'}}"></padagraph-collection>
<padagraph-collection-filter mode="node" asitem="asitem"></padagraph-collection-filter> <div id="menu" class="ui icon borderless vertical menu">
<padagraph-collection-filter mode="edge" asitem="asitem"></padagraph-collection-filter> <padagraph-collection-filter mode="node" asitem="asitem"></padagraph-collection-filter>
<div class="ui divider"> </div> <padagraph-collection-filter mode="edge" asitem="asitem"></padagraph-collection-filter>
<padagraph-engine-control engine="layout" asitem="asitem"></padagraph-engine-control> <div class="ui divider"> </div>
<!--padagraph-engine-control( engine="clustering" asitem="asitem")--> <padagraph-engine-control engine="layout" asitem="asitem"></padagraph-engine-control>
<!--padagraph-engine-control( engine="explore" asitem="asitem")--> <!--padagraph-engine-control( engine="clustering" asitem="asitem")-->
<div class="ui divider"></div><a id="keb_settings" class="ui item"><i class="settings icon"></i></a> <!--padagraph-engine-control( engine="explore" asitem="asitem")-->
</div> <div class="ui divider"></div><a id="keb_settings" class="ui item"><i class="settings icon"></i></a>
<div id="labels" class="ui grid">
<div class="six wide column">
<padagraph-labels-control></padagraph-labels-control>
</div> </div>
<div class="six wide column"> <div id="labels" class="ui grid">
<padagraph-node-search actions="add,explore"></padagraph-node-search>{% if graphurl %} <a href="{{graphurl}}" class="ui tiny active refresh button">refresh</a>{% endif %} <div class="six wide column">
</div> <padagraph-labels-control></padagraph-labels-control>
<div class="four wide column"> </div>
<div id="loading"> <div class="six wide column">
<p>Loading...</p> <padagraph-node-search actions="add,explore"></padagraph-node-search>{% if graphurl %} <a href="{{graphurl}}" class="ui tiny active refresh button">refresh</a>{% endif %}
</div>
<div class="four wide column">
<div id="loading">
<p>Loading...</p>
</div>
</div> </div>
</div> </div>
</div> </padagraph-gviz>
</padagraph-gviz> </padagraph-gviz-json>
</padagraph-gviz-json> </div>
</template> </template>
<script> <script>
require(['backbone', 'cello', 'gviz', 'materials', 'pdgconst'], function (Backbone, Cello, Gviz, Materials, Const ) { require(['backbone', 'jquery', 'cello', 'gviz', 'materials', 'pdgconst'], function (Backbone, $, Cello, Gviz, Materials, Const ) {
Polymer({ Polymer({
is: "graph-app", is: "graph-app",
...@@ -274,11 +276,18 @@ ...@@ -274,11 +276,18 @@
attached() { attached() {
this.async( this.startapp ); var start = this.startapp.bind(this);
this._observer =
Polymer.dom(this.$.boo).observeNodes(function(info) {
info.addedNodes.filter(function(node) {
if (node.tagName === "PADAGRAPH-GVIZ-JSON")
document.querySelector('padagraph-gviz-json').addEventListener('engines-complete', start );
});
});
}, },
startapp() { startapp(e) {
this.toggle();
document.querySelector('padagraph-model-popup').hidden = true; document.querySelector('padagraph-model-popup').hidden = true;
this.toggle();
var _window_resized = function(){ var _window_resized = function(){
var e = document.getElementById('gviz'); var e = document.getElementById('gviz');
...@@ -299,40 +308,36 @@ ...@@ -299,40 +308,36 @@
element.classList.toggle("show"); element.classList.toggle("show");
}; };
console.log(e.detail.app); // true
var app = e.detail.app;
var engines = [];
var app_engines = {
'explore':app.engines.explore,
//'expand':app.engines.expand_px,
'layout':app.engines.layout,
'clustering':app.engines.clustering,
};
for (var k in app_engines){
var engine = app_engines[k]
engine.name = k;
engines.push(engine);
}
document.querySelector('padagraph-gviz-json').addEventListener('engines-complete', function (e) { $('padagraph-collection')[0].app = app;
$('padagraph-collection')[0].graph = app.models.graph;
console.log(e.detail.app); // true
var app = e.detail.app; var keb = document.createElement("padagraph-keb")
keb.engines = engines;
var engines = []; $("#keb")
var app_engines = { .sidebar('setting', 'dimPage', false)
'explore':app.engines.explore, .sidebar('setting', 'transition', 'overlay')
//'expand':app.engines.expand_px, $("#kebcontent").append(keb)
'layout':app.engines.layout, $("#keb .close i.close.icon").click( ()=>{ $("#keb").sidebar('hide') } )
'clustering':app.engines.clustering, $("#keb_settings").click( ()=>{ $("#keb").sidebar('show') } )
};
for (var k in app_engines){
var engine = app_engines[k]
engine.name = k;
engines.push(engine);
}
$('padagraph-collection')[0].app = app;
$('padagraph-collection')[0].graph = app.models.graph;
var keb = document.createElement("padagraph-keb")
keb.engines = engines;
$("#keb")
.sidebar('setting', 'dimPage', false)
.sidebar('setting', 'transition', 'overlay')
$("#kebcontent").append(keb)
$("#keb .close i.close.icon").click( ()=>{ $("#keb").sidebar('hide') } )
$("#keb_settings").click( ()=>{ $("#keb").sidebar('show') } )
_window_resized(); _window_resized();
})
} }
}) })
}); });
......
templates/graph.jade
View file @ 43de147f
...@@ -201,7 +201,7 @@ link( rel="import" href="{{static_host}}/static/padagraph-gviz-min.html") ...@@ -201,7 +201,7 @@ link( rel="import" href="{{static_host}}/static/padagraph-gviz-min.html")
dom-module(id='graph-app') dom-module(id='graph-app')
template template
#boo
padagraph-gviz-json( sync="{{sync}}" routes="{{routes}}" data="{{data}}" ) padagraph-gviz-json( sync="{{sync}}" routes="{{routes}}" data="{{data}}" )
padagraph-gviz( options="{{options}}") padagraph-gviz( options="{{options}}")
div#viz() div#viz()
...@@ -248,7 +248,7 @@ dom-module(id='graph-app') ...@@ -248,7 +248,7 @@ dom-module(id='graph-app')
p Loading... p Loading...
script. script.
require(['backbone', 'cello', 'gviz', 'materials', 'pdgconst'], function (Backbone, Cello, Gviz, Materials, Const ) { require(['backbone', 'jquery', 'cello', 'gviz', 'materials', 'pdgconst'], function (Backbone, $, Cello, Gviz, Materials, Const ) {
Polymer({ Polymer({
is: "graph-app", is: "graph-app",
...@@ -295,11 +295,18 @@ dom-module(id='graph-app') ...@@ -295,11 +295,18 @@ dom-module(id='graph-app')
attached() { attached() {
this.async( this.startapp ); var start = this.startapp.bind(this);
this._observer =
Polymer.dom(this.$.boo).observeNodes(function(info) {
info.addedNodes.filter(function(node) {
if (node.tagName === "PADAGRAPH-GVIZ-JSON")
document.querySelector('padagraph-gviz-json').addEventListener('engines-complete', start );
});
});
}, },
startapp() { startapp(e) {
this.toggle();
document.querySelector('padagraph-model-popup').hidden = true; document.querySelector('padagraph-model-popup').hidden = true;
this.toggle();
var _window_resized = function(){ var _window_resized = function(){
var e = document.getElementById('gviz'); var e = document.getElementById('gviz');
...@@ -320,40 +327,36 @@ dom-module(id='graph-app') ...@@ -320,40 +327,36 @@ dom-module(id='graph-app')
element.classList.toggle("show"); element.classList.toggle("show");
}; };
console.log(e.detail.app); // true
var app = e.detail.app;
var engines = [];
var app_engines = {
'explore':app.engines.explore,
//'expand':app.engines.expand_px,
'layout':app.engines.layout,
'clustering':app.engines.clustering,
};
for (var k in app_engines){
var engine = app_engines[k]
engine.name = k;
engines.push(engine);
}
document.querySelector('padagraph-gviz-json').addEventListener('engines-complete', function (e) { $('padagraph-collection')[0].app = app;
$('padagraph-collection')[0].graph = app.models.graph;
console.log(e.detail.app); // true
var app = e.detail.app; var keb = document.createElement("padagraph-keb")
keb.engines = engines;
var engines = []; $("#keb")
var app_engines = { .sidebar('setting', 'dimPage', false)
'explore':app.engines.explore, .sidebar('setting', 'transition', 'overlay')
//'expand':app.engines.expand_px, $("#kebcontent").append(keb)
'layout':app.engines.layout, $("#keb .close i.close.icon").click( ()=>{ $("#keb").sidebar('hide') } )
'clustering':app.engines.clustering, $("#keb_settings").click( ()=>{ $("#keb").sidebar('show') } )
};
_window_resized();
for (var k in app_engines){
var engine = app_engines[k]
engine.name = k;
engines.push(engine);
}
$('padagraph-collection')[0].app = app;
$('padagraph-collection')[0].graph = app.models.graph;
var keb = document.createElement("padagraph-keb")
keb.engines = engines;
$("#keb")
.sidebar('setting', 'dimPage', false)
.sidebar('setting', 'transition', 'overlay')
$("#kebcontent").append(keb)
$("#keb .close i.close.icon").click( ()=>{ $("#keb").sidebar('hide') } )
$("#keb_settings").click( ()=>{ $("#keb").sidebar('show') } )
_window_resized();
})
} }
}) })
}); });
......
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