Starting with the title of interfaces in the arrows.

This commit is contained in:
mdtrooper 2016-03-23 15:47:05 +01:00
parent 47501c8600
commit ee431b369d
3 changed files with 266 additions and 8 deletions

View File

@ -230,6 +230,19 @@ abstract class Map {
$contants["ITEM_TYPE_AGENT_NETWORKMAP"] = ITEM_TYPE_AGENT_NETWORKMAP;
$contants["ITEM_TYPE_MODULE_NETWORKMAP"] = ITEM_TYPE_MODULE_NETWORKMAP;
$contants["ITEM_TYPE_EDGE_NETWORKMAP"] = ITEM_TYPE_EDGE_NETWORKMAP;
$contants["AGENT_MODULE_STATUS_ALL"] = AGENT_MODULE_STATUS_ALL;
$contants["AGENT_MODULE_STATUS_CRITICAL_BAD"] = AGENT_MODULE_STATUS_CRITICAL_BAD;
$contants["AGENT_MODULE_STATUS_CRITICAL_ALERT"] = AGENT_MODULE_STATUS_CRITICAL_ALERT;
$contants["AGENT_MODULE_STATUS_NO_DATA"] = AGENT_MODULE_STATUS_NO_DATA;
$contants["AGENT_MODULE_STATUS_NORMAL"] = AGENT_MODULE_STATUS_NORMAL;
$contants["AGENT_MODULE_STATUS_NORMAL_ALERT"] = AGENT_MODULE_STATUS_NORMAL_ALERT;
$contants["AGENT_MODULE_STATUS_NOT_NORMAL"] = AGENT_MODULE_STATUS_NOT_NORMAL;
$contants["AGENT_MODULE_STATUS_WARNING"] = AGENT_MODULE_STATUS_WARNING;
$contants["AGENT_MODULE_STATUS_WARNING_ALERT"] = AGENT_MODULE_STATUS_WARNING_ALERT;
$contants["AGENT_MODULE_STATUS_UNKNOWN"] = AGENT_MODULE_STATUS_UNKNOWN;
$contants["AGENT_MODULE_STATUS_NOT_INIT"] = AGENT_MODULE_STATUS_NOT_INIT;
?>
<script type="text/javascript">
<?php

View File

@ -65,8 +65,6 @@ class Networkmap extends Map {
$nodes_and_edges = explode("];", $graph);
$flag_modules = false;
$nodes = array();
$edges = array();
$last_graph_id = 0;
@ -103,21 +101,22 @@ class Networkmap extends Map {
$id_agent = null;
$status = null;
$title = "";
if (strstr($chunks[1], "&id_module=") !== false) {
// MODULE
preg_match("/id_module=([0-9]*)/", $chunks[1], $matches);
$id = $matches[1];
$id_agent = agents_get_module_id($id);
$status = modules_get_agentmodule_status($id);
$title = modules_get_agentmodule_name($id);
$type = ITEM_TYPE_MODULE_NETWORKMAP;
$flag_modules = true;
}
else {
// AGENT
preg_match("/id_agent=([0-9]*)/", $chunks[1], $matches);
$id_agent = $id = $matches[1];
$status = agents_get_status($id);
$title = agents_get_name($id);
$type = ITEM_TYPE_AGENT_NETWORKMAP;
}
@ -125,7 +124,8 @@ class Networkmap extends Map {
'id' => $id,
'id_agent' => $id_agent,
'type' => $type,
'status' => $status);
'status' => $status,
'title' => $title);
if ($last_graph_id < $graphviz_id)
$last_graph_id = $graphviz_id;

View File

@ -116,6 +116,7 @@ NetworkmapController.prototype.get_arrow_AMMA = function(id_to, id_from) {
}
arrow['to_module'] = arrow_MM['nodes']['to']['id'];
arrow['to_status'] = arrow_MM['nodes']['to']['status'];
arrow['to_title'] = arrow_MM['nodes']['to']['title'];
if (arrow_from['nodes']['to'] == arrow_MM['arrow']['from']) {
@ -126,6 +127,7 @@ NetworkmapController.prototype.get_arrow_AMMA = function(id_to, id_from) {
}
arrow['from_module'] = arrow_MM['nodes']['from']['id'];
arrow['from_status'] = arrow_MM['nodes']['from']['status'];
arrow['from_title'] = arrow_MM['nodes']['from']['title'];
return_var = arrow;
}
@ -191,6 +193,7 @@ NetworkmapController.prototype.get_arrows_AMA = function(id_to, id_from) {
temp['to'] = arrow_AM['nodes']['to'];
temp['to_module'] = arrow_AM['nodes']['from']['id'];
temp['to_status'] = arrow_AM['nodes']['from']['status'];
temp['to_title'] = arrow_AM['nodes']['from']['title'];
if (type_to == ITEM_TYPE_AGENT_NETWORKMAP) {
temp['from'] = arrow['nodes']['to'];
@ -200,11 +203,13 @@ NetworkmapController.prototype.get_arrows_AMA = function(id_to, id_from) {
}
temp['from_module'] = null;
temp['from_status'] = null;
temp['from_title'] = null;
break;
case 'from':
temp['from'] = arrow_AM['nodes']['from'];
temp['from_module'] = arrow_AM['nodes']['to']['id'];
temp['from_status'] = arrow_AM['nodes']['to']['status'];
temp['from_title'] = arrow_AM['nodes']['to']['title'];
if (type_to == ITEM_TYPE_AGENT_NETWORKMAP) {
temp['to'] = arrow['nodes']['to'];
@ -214,6 +219,7 @@ NetworkmapController.prototype.get_arrows_AMA = function(id_to, id_from) {
}
temp['to_module'] = null;
temp['to_status'] = null;
temp['to_title'] = null;
break;
}
@ -252,8 +258,12 @@ NetworkmapController.prototype.get_arrow_AA = function(id_to, id_from) {
arrow_AA['graph_id'] = arrow['arrow']['graph_id'];
arrow_AA['to'] = arrow['nodes']['to'];
arrow_AA['to_module'] = null;
arrow_AA['to_status'] = null;
arrow_AA['to_title'] = null;
arrow_AA['from'] = arrow['nodes']['from'];
arrow_AA['from_module'] = null;
arrow_AA['from_status'] = null;
arrow_AA['from_title'] = null;
found = true;
}
@ -361,6 +371,8 @@ NetworkmapController.prototype.paint_arrows = function() {
}
});
console.log(clean_arrows);
var arrow_layouts = self._viewport.selectAll(".arrow")
.data(clean_arrows)
.enter()
@ -507,8 +519,14 @@ NetworkmapController.prototype.arrow_by_pieces_AMMA = function (target, arrow_da
.attr("class", "body");
var arrow_head = arrow_layout.append("g")
.attr("class", "head");
var arrow_head_title = arrow_layout.append("g")
.attr("class", "head_title");
arrow_head_title.append("text").text(arrow_data['to_title']);
var arrow_tail = arrow_layout.append("g")
.attr("class", "tail");
var arrow_tail_title = arrow_layout.append("g")
.attr("class", "tail_title");
arrow_tail_title.append("text").text(arrow_data['from_title']);
$.each(symbols, function (i, s) {
if (is_buggy_firefox) {
@ -599,11 +617,12 @@ NetworkmapController.prototype.arrow_by_pieces_AMMA = function (target, arrow_da
var arrow_tail_b = arrow_tail.node().getBBox();
var arrow_tail_height = (arrow_tail_b['height'] + arrow_tail_b['y']);
var arrow_tail_width = (arrow_tail_b['width'] + arrow_tail_b['x']);
var arrow_body = arrow_layout.select(".body");
/*---------------------------------------------*/
/*--- Position of layer arrow (body + head) ---*/
/*---------------------------------------------*/
var arrow_body = arrow_layout.select(".body");
var arrow_body_b = arrow_body.node().getBBox();
var arrow_body_height = (arrow_body_b['height'] + arrow_body_b['y']);
var arrow_body_width = (arrow_body_b['width'] + arrow_body_b['x']);
@ -659,6 +678,44 @@ NetworkmapController.prototype.arrow_by_pieces_AMMA = function (target, arrow_da
self.update_interfaces_status(arrow_data);
/*---------------------------------------------*/
/*---------- Position the title of head -------*/
/*---------------------------------------------*/
var arrow_head_title = arrow_layout.select(".head_title");
var arrow_head_title_b = arrow_head_title.node().getBBox();
var arrow_head_title_height =
(arrow_head_title_b['height'] + arrow_head_title_b['y']);
transform = d3.transform();
var x = 10;
var y = 0 + (arrow_body_height / 2 - arrow_head_title_height / 2);
transform.translate[0] = x;
transform.translate[1] = y;
arrow_head_title.attr("transform", transform.toString());
/*---------------------------------------------*/
/*---------- Position the title of tail -------*/
/*---------------------------------------------*/
var arrow_tail_title = arrow_layout.select(".tail_title");
var arrow_tail_title_b = arrow_tail_title.node().getBBox();
var arrow_tail_title_height =
(arrow_tail_title_b['height'] + arrow_tail_title_b['y']);
transform = d3.transform();
var x = -10 + (arrow_body_width * scale) - arrow_tail_width - radius_from;
var y = 0 + (arrow_body_height / 2 - arrow_head_title_height / 2);
transform.translate[0] = x;
transform.translate[1] = y;
arrow_tail_title.attr("transform", transform.toString());
/*---------------------------------------------*/
/*------- Show the result in one time ---------*/
/*---------------------------------------------*/
@ -776,5 +833,193 @@ NetworkmapController.prototype.update_interfaces_status = function (arrow_data)
* Return void
* This function print the arrow by pieces (3 steps)
*/
function arrow_by_pieces_AMA(target, arrow_data) {
NetworkmapController.prototype.arrow_by_pieces_AMA = function(target, arrow_data) {
// if (typeof(wait) === "undefined")
// wait = 1;
//
// var symbols = {};
//
// symbols['images/maps/body_arrow.svg'] = {};
// symbols['images/maps/body_arrow.svg']['target'] = "body";
// symbols['images/maps/body_arrow.svg']['id_symbol'] = "#body_arrow";
//
// symbols['images/maps/head_arrow_module_warning.svg'] = {};
// symbols['images/maps/head_arrow_module_warning.svg']
// ['target'] = "tail";
// symbols['images/maps/head_arrow_module_warning.svg']
// ['id_symbol'] = "#head_arrow_module_warning";
//
// symbols['images/maps/head_arrow_module_unknown.svg'] = {};
// symbols['images/maps/head_arrow_module_unknown.svg']
// ['target'] = "tail";
// symbols['images/maps/head_arrow_module_unknown.svg']
// ['id_symbol'] = "#head_arrow_module_unknown";
//
// symbols['images/maps/head_arrow_module_ok.svg'] = {};
// symbols['images/maps/head_arrow_module_ok.svg']
// ['target'] = "tail";
// symbols['images/maps/head_arrow_module_ok.svg']
// ['id_symbol'] = "#head_arrow_module_ok";
//
// symbols['images/maps/head_arrow_module_no_data.svg'] = {};
// symbols['images/maps/head_arrow_module_no_data.svg']
// ['target'] = "tail";
// symbols['images/maps/head_arrow_module_no_data.svg']
// ['id_symbol'] = "#head_arrow_module_no_data";
//
// symbols['images/maps/head_arrow_module_critical.svg'] = {};
// symbols['images/maps/head_arrow_module_critical.svg']
// ['target'] = "tail";
// symbols['images/maps/head_arrow_module_critical.svg']
// ['id_symbol'] = "#head_arrow_module_critical";
//
// symbols['images/maps/head_arrow_module_alertsfired.svg'] = {};
// symbols['images/maps/head_arrow_module_alertsfired.svg']
// ['target'] = "tail";
// symbols['images/maps/head_arrow_module_alertsfired.svg']
// ['id_symbol'] = "#head_arrow_module_alertsfired";
//
// var count_files = Object.keys(symbols).length;
// function wait_load(callback) {
// count_files--;
//
// if (count_files == 0) {
// callback();
// }
// }
//
// var arrow_layout = d3
// .select(target +" #arrow_" + arrow_data['graph_id']);
//
// switch (wait) {
// /*---------------------------------------------*/
// /*-------- Preload head and body arrow --------*/
// /*---------------------------------------------*/
// case 1:
// arrow_layout = arrow_layout.append("g")
// .attr("class", "arrow_position_rotation")
// .append("g")
// .attr("class", "arrow_translation")
// .append("g")
// .attr("class", "arrow_container");
//
// var arrow_body = arrow_layout.append("g")
// .attr("class", "body");
// var arrow_tail = arrow_layout.append("g")
// .attr("class", "tail");
//
// $.each(symbols, function (i, s) {
// if (is_buggy_firefox) {
// switch (s['target']) {
// case 'body':
// arrow_body.append("use")
// .attr("xlink:href", s['id_symbol']);
// break;
// case 'tail':
// arrow_tail.append("use")
// .attr("xlink:href", s['id_symbol']);
// break;
// }
// }
// else {
// switch (s['target']) {
// case 'body':
// arrow_body.append("use")
// .attr("xlink:href", i + s['id_symbol'])
// .on("load", function() {
// wait_load(function() {
// arrow_by_pieces_AMA(
// target, arrow_data, 0);
// });
// });
// break;
// case 'tail':
// arrow_tail.append("use")
// .attr("xlink:href", i + s['id_symbol'])
// .on("load", function() {
// wait_load(function() {
// arrow_by_pieces_AMA(
// target, arrow_data, 0);
// });
// });
// break;
// }
// }
// });
//
// if (is_buggy_firefox) {
// arrow_by_pieces_AMA(target, arrow_data, 0);
// }
// break;
// /*---------------------------------------------*/
// /*---- Print head and body arrow by steps -----*/
// /*---------------------------------------------*/
// case 0:
// var id_node_to = "node_" + arrow_data['to']['graph_id'];
// var id_node_from = "node_" + arrow_data['from']['graph_id'];
//
// var c_elem2 = get_center_element(target +" #" + id_node_to);
// var c_elem1 = get_center_element(target +" #" + id_node_from);
//
// var distance = get_distance_between_point(c_elem1, c_elem2);
//
// var radius_to = parseFloat(get_radius_element("#" + id_node_to));
// var radius_from = parseFloat(get_radius_element("#" + id_node_from));
//
// var transform = d3.transform();
//
// /*---------------------------------------------*/
// /*--- Position of layer arrow (body + head) ---*/
// /*---------------------------------------------*/
// var arrow_body = arrow_layout.select(".body");
// var arrow_body_b = arrow_body.node().getBBox();
// var arrow_body_height = (arrow_body_b['height'] + arrow_body_b['y']);
// var arrow_body_width = (arrow_body_b['width'] + arrow_body_b['x']);
//
// transform.translate[0] = c_elem1[0];
// transform.translate[1] = c_elem1[1];
// transform.rotate = get_angle_of_line(c_elem1, c_elem2);
//
// arrow_layout.select(".arrow_position_rotation")
// .attr("transform", transform.toString());
// transform = d3.transform();
// transform.translate[0] = radius_from;
// transform.translate[1] = - (arrow_body_height / 2);
// arrow_layout.select(".arrow_translation")
// .attr("transform", transform.toString());
//
// /*---------------------------------------------*/
// /*-------- Resize the body arrow width --------*/
// /*---------------------------------------------*/
// arrow_head_width = 0; //WIP
//
// var body_width = distance - arrow_head_width - radius_to - radius_from;
//
// transform = d3.transform();
// transform.scale[0] = body_width / arrow_body_width;
//
// arrow_body.attr("transform", transform.toString());
//
// /*---------------------------------------------*/
// /*---------- Position of head arrow -----------*/
// /*---------------------------------------------*/
// //~ transform = d3.transform();
// //~
// //~ var arrow_body_t = d3.transform(arrow_body.attr("transform"));
// //~
// //~ var scale = arrow_body_t.scale[0];
// //~ var x = 0 + arrow_body_width * scale;
// //~ var y = 0 + (arrow_body_height / 2 - arrow_head_height / 2);
// //~
// //~ transform.translate[0] = x;
// //~ transform.translate[1] = y;
// //~
// //~ arrow_head.attr("transform", transform.toString());
//
// /*---------------------------------------------*/
// /*------- Show the result in one time ---------*/
// /*---------------------------------------------*/
// arrow_layout.attr("style", "opacity: 1");
// break;
// }
}