Skip to content

Commit

Permalink
Merge 046b930 into 374c307
Browse files Browse the repository at this point in the history
  • Loading branch information
@liuzhenyang
liuzhenyang committed Nov 6, 2017
2 parents 374c307 + 046b930 commit 94ebe2f
Showing 1 changed file with 118 additions and 114 deletions.
232 changes: 118 additions & 114 deletions saga-web/web-site/web/detail.jsp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,124 +33,128 @@
<script type="text/javascript" src="assets/dracula_graph.js"></script>
<script type="text/javascript" src="assets/dracula_algorithms.js"></script>
<script type="text/javascript">
var redraw;
var height = 300;
var width = 400;
function getQueryString(name, url) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = url.match(reg);
if (r != null) return unescape(r[2]); return null;
}
var sagaId = "";
if (location.href.split('?').length > 1) {
var par = location.href.split('?')[1];
sagaId= getQueryString("sagaId", par);
}
var url = "http://127.0.0.1:8080/requests/"+sagaId;
var render = function (r, n) {
/* the Raphael set is obligatory, containing all you want to display */
var set = r.set().push(
/* custom objects go here */
r.rect(n.point[0] - 30, n.point[1] - 13, 60, 44).attr(
{"fill": "#5b9bd5", r: "12px", "stroke-width": n.distance == 0 ? "3px" : "1px"})).push(
r.text(n.point[0], n.point[1] + 10, (n.label || n.id)));
return set;
};
var redraw;
var height = 300;
var width = 400;
var render_false = function (r, n) {
/* the Raphael set is obligatory, containing all you want to display */
var set = r.set().push(
/* custom objects go here */
r.rect(n.point[0] - 30, n.point[1] - 13, 60, 44).attr(
{"fill": "#d16d2a", r: "12px", "stroke-width": n.distance == 0 ? "3px" : "1px"})).push(
r.text(n.point[0], n.point[1] + 10, (n.label || n.id)));
return set;
};
var host_url = window.location.host;
var url = "http://"+host_url+":8080/requests/b";
var render = function(r, n) {
/* the Raphael set is obligatory, containing all you want to display */
var set = r.set().push(
/* custom objects go here */
r.rect(n.point[0]-30, n.point[1]-13, 60, 44).attr({"fill": "#5b9bd5", r : "12px", "stroke-width" : n.distance == 0 ? "3px" : "1px" })).push(
r.text(n.point[0], n.point[1] + 10, (n.label || n.id)));
return set;
};
var render_false = function(r, n) {
/* the Raphael set is obligatory, containing all you want to display */
var set = r.set().push(
/* custom objects go here */
r.rect(n.point[0]-30, n.point[1]-13, 60, 44).attr({"fill": "#d16d2a", r : "12px", "stroke-width" : n.distance == 0 ? "3px" : "1px" })).push(
r.text(n.point[0], n.point[1] + 10, (n.label || n.id)));
return set;
};
var render_no = function(r, n) {
/* the Raphael set is obligatory, containing all you want to display */
var set = r.set().push(
/* custom objects go here */
r.rect(n.point[0]-30, n.point[1]-13, 60, 44).attr({"fill": "#f2f2f2", r : "12px", "stroke-width" : n.distance == 0 ? "3px" : "1px" })).push(
r.text(n.point[0], n.point[1] + 10, (n.label || n.id)));
return set;
};
var g = new Graph();
/* modify the edge creation to attach random weights */
g.edgeFactory.build = function(source, target) {
var e = jQuery.extend(true, {}, this.template);
e.source = source;
e.target = target;
e.style.label = e.weight = Math.floor(Math.random() * 10) + 1;
return e;
}
var render_st = function(r, n) {
/* the Raphael set is obligatory, containing all you want to display */
var set = r.set().push(
/* custom objects go here */
r.rect(n.point[0]-30, n.point[1]-13, 60, 44).attr({"fill": "#7b92f1", r : "22px", "stroke-width" : n.distance == 0 ? "3px" : "1px" })).push(
r.text(n.point[0], n.point[1] + 10, (n.label || n.id)));
return set;
};
window.onload = function () {
$.ajax({
type: 'GET',
url: url,
dataType: "json",
success:function(datas){
console.log(datas);
//var datas = {"router":{"request-aaa":["request-bbb"],"saga-start":["request-aaa"],"request-bbb":["saga-end"]},"status":{"request-aaa":"OK","request-bbb":"OK"},"error":{}};
var datas_status = datas.status;
$.each(datas.router,function(key,value){
if(datas_status[key] == 'Failed'){
if(key.indexOf("saga-start") == -1 && value.indexOf("saga-end") == -1){
g.addNode(key, {render:render_no});
g.addNode(value, {render:render_no});
}else{
g.addNode(key, {render:render_st});
g.addNode(value, {render:render_st});
}
g.addEdge(key, value, {
stroke: '#adadad',
//fill: '#f2f2f2',
label: '',
directed : true
});
}else if(datas_status[value] == 'Failed'){
if(key.indexOf("saga-start") == -1 && value.indexOf("saga-end") == -1){
g.addNode(key, {render:render});
g.addNode(value, {render:render_false});
}else{
g.addNode(key, {render:render_st});
g.addNode(value, {render:render_st});
}
g.addEdge(key, value, {
stroke: '#adadad',
//fill: '#f2f2f2',
label: '',
directed : true
});
}else{
if(key.indexOf("saga-start") == -1 && value.indexOf("saga-end") == -1){
g.addNode(key, {render:render});
g.addNode(value, {render:render});
}else{
g.addNode(key, {render:render_st});
g.addNode(value, {render:render_st});
}
g.addEdge(key, value, {
stroke: '#5b9bd5',
//fill: '#5b9bd5',
label: '',
directed : true
});
}
})
var render_no = function (r, n) {
/* the Raphael set is obligatory, containing all you want to display */
var set = r.set().push(
/* custom objects go here */
r.rect(n.point[0] - 30, n.point[1] - 13, 60, 44).attr(
{"fill": "#f2f2f2", r: "12px", "stroke-width": n.distance == 0 ? "3px" : "1px"})).push(
r.text(n.point[0], n.point[1] + 10, (n.label || n.id)));
return set;
};
/* layout the graph using the Spring layout implementation */
var layouter = new Graph.Layout.Spring(g);
layouter.layout();
var g = new Graph();
/* modify the edge creation to attach random weights */
g.edgeFactory.build = function (source, target) {
var e = jQuery.extend(true, {}, this.template);
e.source = source;
e.target = target;
e.style.label = e.weight = Math.floor(Math.random() * 10) + 1;
return e;
}
/* draw the graph using the RaphaelJS draw implementation */
var renderer = new Graph.Renderer.Raphael('canvas', g, width, height);
renderer.draw();
/* modify the edge creation to attach random weights */
g.edgeFactory.build = function (source, target) {
var e = jQuery.extend(true, {}, this.template);
e.source = source;
e.target = target;
e.style.label = e.weight = Math.floor(Math.random() * 10) + 1;
return e;
}
window.onload = function () {
$.ajax({
type: 'GET',
url: url,
dataType: "json",
success: function (datas) {
console.log(datas);
//var datas = {"router":{"request-aaa":["request-bbb"],"saga-start":["request-aaa"],"request-bbb":["saga-end"]},"status":{"request-aaa":"OK","request-bbb":"OK"},"error":{}};
var datas_status = datas.status;
$.each(datas.router, function (key, value) {
if (datas_status[key] == 'Failed') {
g.addNode(key, {render: render_no});
g.addNode(value, {render: render_no});
g.addEdge(key, value, {
stroke: '#adadad',
//fill: '#f2f2f2',
label: '',
directed: true
});
} else if (datas_status[value] == 'Failed') {
g.addNode(key, {render: render});
g.addNode(value, {render: render_false});
g.addEdge(key, value, {
stroke: '#adadad',
//fill: '#f2f2f2',
label: '',
directed: true
});
} else {
g.addNode(key, {render: render});
g.addNode(value, {render: render});
g.addEdge(key, value, {
stroke: '#5b9bd5',
//fill: '#5b9bd5',
label: '',
directed: true
});
}
})
/* layout the graph using the Spring layout implementation */
var layouter = new Graph.Layout.Spring(g);
layouter.layout();
/* draw the graph using the RaphaelJS draw implementation */
var renderer = new Graph.Renderer.Raphael('canvas', g, width, height);
renderer.draw();
redraw = function () {
layouter.layout();
renderer.draw();
};
}
});
};
redraw = function () {
layouter.layout();
renderer.draw();
};
}
});
};
</script>
</head>
<body>
Expand Down

0 comments on commit 94ebe2f

Please sign in to comment.