Commit 54eeed78 authored by Clement Frainay's avatar Clement Frainay

Add directed expansion

Add context menu to choose expansion of predecessor/successor only
parent 82ac2aff
......@@ -259,12 +259,29 @@ Ext.define('metExploreViz.view.panel.viz.VizController', {
metExploreD3.GraphNetwork.expandPathwayNode(theNode.getName(), "viz");
}
}, {
text: 'Expand',
text: 'Expand all',
hidden: false,
iconCls: "neighbours",
handler: function () {
metExploreD3.GraphNode.showNeighbours(theNode);
}
},{
text: 'Expand',
hidden: false,
iconCls: "neighbours",
menu: [{
text: 'Successor',
iconCls: "expandOut",
handler: function () {
metExploreD3.GraphNode.showDirectedNeighbours(theNode,true);
}
},{
text: 'Predecessor',
iconCls: "expandIn",
handler: function () {
metExploreD3.GraphNode.showDirectedNeighbours(theNode,false);
}
}]
}, {
text: 'Collapse',
hidden: false,
......@@ -273,9 +290,16 @@ Ext.define('metExploreViz.view.panel.viz.VizController', {
metExploreD3.GraphNode.showNeighbours(theNode);
}
}, {
text: 'Remove nodes',
text: 'Remove',
hidden: false,
iconCls: "removeNode",
handler : function(){
metExploreD3.GraphNetwork.removeOnlyClickedNode(theNode, "viz");
}
}, {
text: 'Remove nodes',
hidden: true,
iconCls: "removeNode",
menu: viz.removeMenu
}, {
text: 'Duplicate nodes as side compounds',
......
......@@ -540,6 +540,18 @@ p {
background-position: 0% 0%;
background-repeat: no-repeat;
}
.expandIn{
background-image: url(../icons/expandIn.png);
background-size: 100% 100%;
background-position: 0% 0%;
background-repeat: no-repeat;
}
.expandOut{
background-image: url(../icons/expandOut.png);
background-size: 100% 100%;
background-position: 0% 0%;
background-repeat: no-repeat;
}
.neighboursCollapse{
background-image: url(../icons/neighboursCollapse.png);
background-size: 100% 100%;
......
......@@ -88,6 +88,81 @@ metExploreD3.GraphNode = {
});
metExploreD3.GraphNetwork.updateNetwork("viz", _metExploreViz.getSessionById("viz"));
},
showDirectedNeighbours: function(node, outgoing){
//get data from model
var networkData = _metExploreViz.getSessionById("viz").getD3Data();
node.visit();
var allNodes = d3.select("#viz").select("#D3viz").selectAll("g.node");
allNodes.filter(function (d) {
return d.getId()===node.getId();
}).style("fill","green");
node.setLocked(true);
metExploreD3.GraphNode.fixNode(node);
// allNodes.each(function(n){
// n.setLocked(true);
// metExploreD3.GraphNode.fixNode(n);
// });
//extract links, keep thoses involving metabolite arg
networkData.getLinks().filter(function(links) {
return links.getSource() == node || links.getTarget() == node
}).forEach(function(link) {
if(link.getTarget().getBiologicalType()!=="pathway") {
if(link.getSource().getId()===node.getId()){
reactionNeighbour = link.getTarget();
if(!reactionNeighbour.isHidden()){
allNodes.filter(function (d) {
return d.getId()===reactionNeighbour.getId();
}).style("fill","green");
reactionNeighbour.setLocked(true);
metExploreD3.GraphNode.fixNode(reactionNeighbour);
reactionNeighbour.visit();
}else if(outgoing===true){
reactionNeighbour.show();
networkData.getLinks().forEach(function(l){
if(l.getSource().getId()===reactionNeighbour.getId() && l.getTarget().getBiologicalType()!=="pathway") {
l.getTarget().show();
}
if(l.getTarget().getId()===reactionNeighbour.getId() && l.getSource().getBiologicalType()!=="pathway") {
l.getSource().show();
}
});
}
}else if(link.getTarget().getId()===node.getId()){
reactionNeighbour = link.getSource();
if(!reactionNeighbour.isHidden()){
allNodes.filter(function (d) {
return d.getId()===reactionNeighbour.getId();
}).style("fill","green");
reactionNeighbour.setLocked(true);
metExploreD3.GraphNode.fixNode(reactionNeighbour);
reactionNeighbour.visit();
}else if(outgoing===false){
reactionNeighbour.show();
networkData.getLinks().forEach(function(l){
if(l.getSource().getId()===reactionNeighbour.getId() && l.getTarget().getBiologicalType()!=="pathway") {
l.getTarget().show();
}
if(l.getTarget().getId()===reactionNeighbour.getId() && l.getSource().getBiologicalType()!=="pathway") {
l.getSource().show();
}
});
}
}
}
});
metExploreD3.GraphNetwork.updateNetwork("viz", _metExploreViz.getSessionById("viz"));
},
// setNeighboursVisibility: function(node, visibility){
// //get data from model
// var networkData = _metExploreViz.getSessionById("viz").getD3Data();
......
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