diff --git a/pandora_console/include/javascript/functions_pandora_networkmap.js b/pandora_console/include/javascript/functions_pandora_networkmap.js index 0aec15c35d..a9c36700a8 100644 --- a/pandora_console/include/javascript/functions_pandora_networkmap.js +++ b/pandora_console/include/javascript/functions_pandora_networkmap.js @@ -2,12 +2,12 @@ function draw_minimap() { //Clean the canvas context_minimap.clearRect(0, 0, minimap_w, minimap_h); - + context_minimap.beginPath(); context_minimap.globalAlpha = 0.8; context_minimap.fillStyle = "#ddd"; context_minimap.fillRect(0, 0, minimap_w, minimap_h); - + var relation_min_nodes = minimap_relation; var relation_minimap_w = 2; var relation_minimap_h = 2; @@ -16,11 +16,11 @@ function draw_minimap() { relation_minimap_w = (graph.nodes.length / 100) * 2.5; relation_minimap_h = 1.5; } - + //Draw the items and lines jQuery.each(graph.nodes, function (key, value) { - if (typeof(value) == 'undefined') return; - + if (typeof (value) == 'undefined') return; + context_minimap.beginPath(); //Paint the item if (graph.nodes.length > 100) { @@ -31,7 +31,7 @@ function draw_minimap() { center_orig_x = (value.x + value.image_width / 2) * relation_min_nodes; center_orig_y = (value.y + value.image_height / 2) * relation_min_nodes; } - + context_minimap.arc(center_orig_x, center_orig_y, 2, 0, Math.PI * 2, false); //Check if the pandora point @@ -43,7 +43,7 @@ function draw_minimap() { } context_minimap.fill(); }); - + if (graph.nodes.length > 100) { //Draw the rect of viewport context_minimap.beginPath(); @@ -64,7 +64,7 @@ function draw_minimap() { width_svg * relation_min_nodes / scale, height_svg * relation_min_nodes / scale); } - + context_minimap.beginPath(); context_minimap.strokeStyle = "#82B92E"; context_minimap.strokeRect( @@ -72,7 +72,7 @@ function draw_minimap() { (networkmap_dimensions[1] + node_radius - holding_area_dimensions[1]) * minimap_relation, holding_area_dimensions[0] * minimap_relation, holding_area_dimensions[1] * minimap_relation) - + context_minimap.globalAlpha = 1; } @@ -83,25 +83,25 @@ function inner_minimap_box(param_x, param_y) { && (param_y + translation[1] * minimap_relation <= height_svg * minimap_relation)) { return true; } - + return false; } function set_center(id) { pos_x = (width_svg / 2) - translation[0]; pos_y = (height_svg / 2) - translation[1]; - + var params = []; params.push("set_center=1"); params.push("id=" + id); params.push("x=" + pos_x); params.push("y=" + pos_y); params.push("page=operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (data['correct']) { } @@ -111,7 +111,7 @@ function set_center(id) { function get_relations(node_param) { var return_links = []; - jQuery.each(graph.links, function(i, link_each) { + jQuery.each(graph.links, function (i, link_each) { if (node_param.id == link_each.source.id) { return_links.push(link_each); } @@ -119,7 +119,7 @@ function get_relations(node_param) { return_links.push(link_each); } }); - + return return_links; } @@ -134,15 +134,15 @@ function delete_link(source_id, source_module_id, target_id, target_module_id, i params.push("target_module_id=" + target_module_id); params.push("id_link=" + id_link); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (data['correct']) { var found = -1; - jQuery.each(graph.links, function(i, element) { + jQuery.each(graph.links, function (i, element) { if (element.id_db == id_link) { found = i; } @@ -150,24 +150,24 @@ function delete_link(source_id, source_module_id, target_id, target_module_id, i if (found != -1) { graph.links.splice(found, 1); } - + $("#layer_graph_links_" + networkmap_id).remove(); $("#layer_graph_nodes_" + networkmap_id).remove(); window.layer_graph_links = window.layer_graph .append("g") - .attr("id", "layer_graph_links_" + networkmap_id); + .attr("id", "layer_graph_links_" + networkmap_id); window.layer_graph_nodes = window.layer_graph .append("g") - .attr("id", "layer_graph_nodes_" + networkmap_id); - + .attr("id", "layer_graph_nodes_" + networkmap_id); + force.nodes(graph.nodes) .links(graph.links) .start(); - + window.node = layer_graph_nodes.selectAll(".node"); window.link = layer_graph_links.selectAll(".link"); - + draw_elements_graph(); init_drag_and_drop(); set_positions_graph(); @@ -182,7 +182,7 @@ function update_fictional_node(id_db_node) { if (enterprise_installed) { var name = $("input[name='edit_name_fictional_node']").val(); var networkmap_to_link = $("#edit_networkmap_to_link").val(); - + var params = []; params.push("update_fictional_node=1"); params.push("networkmap_id=" + networkmap_id); @@ -190,26 +190,26 @@ function update_fictional_node(id_db_node) { params.push("name=" + name); params.push("networkmap_to_link=" + networkmap_to_link); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - - jQuery.ajax ({ - data: params.join ("&"), + + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (data['correct']) { $("#dialog_node_edit").dialog("close"); - - jQuery.each(graph.nodes, function(i, element) { + + jQuery.each(graph.nodes, function (i, element) { if (element.id_db == id_db_node) { graph.nodes[i].text = name; graph.nodes[i].networkmap_id = networkmap_to_link; - + $("#id_node_" + i + networkmap_id + " title").html(name); $("#id_node_" + i + networkmap_id + " tspan").html(name); } }); - + draw_elements_graph(); set_positions_graph(); } @@ -218,35 +218,35 @@ function update_fictional_node(id_db_node) { } } -function update_node_name (id_db_node) { +function update_node_name(id_db_node) { if (enterprise_installed) { var name = $("input[name='edit_name_node']").val(); - + var params = []; params.push("update_node_name=1"); params.push("networkmap_id=" + networkmap_id); params.push("node_id=" + id_db_node); params.push("name=" + name); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - - jQuery.ajax ({ - data: params.join ("&"), + + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (data['correct']) { $("#dialog_node_edit").dialog("close"); - - jQuery.each(graph.nodes, function(i, element) { + + jQuery.each(graph.nodes, function (i, element) { if (element.id_db == id_db_node) { graph.nodes[i].text = name; - + $("#id_node_" + i + networkmap_id + " title").html(name); $("#id_node_" + i + networkmap_id + " tspan").html(name); } }); - + draw_elements_graph(); set_positions_graph(); } @@ -258,215 +258,215 @@ function update_node_name (id_db_node) { function change_shape(id_db_node) { if (enterprise_installed) { var shape = $("select[name='shape']").val(); - + var params = []; params.push("change_shape=1"); params.push("networkmap_id=" + networkmap_id); params.push("id=" + id_db_node); params.push("shape=" + shape); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - + $("#shape_icon_correct").css("display", "none"); $("#shape_icon_fail").css("display", "none"); $("#shape_icon_in_progress").css("display", ""); - - jQuery.ajax ({ - data: params.join ("&"), + + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { $("#shape_icon_in_progress").css("display", "none"); if (data['correct']) { $("#shape_icon_correct").css("display", ""); - + count = graph.nodes.length; - - jQuery.each(graph.nodes, function(i, element) { + + jQuery.each(graph.nodes, function (i, element) { if (element.id_db == id_db_node) { graph.nodes[i].shape = shape; - + $("#id_node_" + element.id + networkmap_id + " rect").remove(); $("#id_node_" + element.id + networkmap_id + " circle").remove(); $("#id_node_" + element.id + networkmap_id + " image").remove(); - + if (shape == 'circle') { d3.select("#id_node_" + element.id + networkmap_id) - .insert("circle", "title") + .insert("circle", "title") .attr("r", node_radius) .attr("class", "node_shape node_shape_circle") - .style("fill", function(d) { - return d.color; - }) + .style("fill", function (d) { + return d.color; + }) .classed('dragable_node', true) //own dragable - .on("mouseover", function(d) { + .on("mouseover", function (d) { myMouseoverCircleFunction(d.id) - }) - .on("mouseout", function(d) { + }) + .on("mouseout", function (d) { myMouseoutCircleFunction(d.id) - }) + }) .on("click", selected_node) - .on("dblclick", function(d) { - edit_node(d, true); - }) - .on("contextmenu", function(d) { show_menu("node", d);}); - + .on("dblclick", function (d) { + edit_node(d, true); + }) + .on("contextmenu", function (d) { show_menu("node", d); }); + d3.select("#id_node_" + element.id + networkmap_id) .append("image") .attr("class", "node_image") - .attr("xlink:href", function(d) { - return d.image_url; - }) - .attr("x", function(d) { - return d.x - (d.image_width / 2); - }) - .attr("y", function(d) { - return d.y - (d.image_height / 2); - }) - .attr("width", function(d) { - return (node_radius / 0.8); - }) - .attr("height", function(d) { - return (node_radius / 0.8); - }) - .attr("node_id", function(d) { - return d.id; - }) + .attr("xlink:href", function (d) { + return d.image_url; + }) + .attr("x", function (d) { + return d.x - (d.image_width / 2); + }) + .attr("y", function (d) { + return d.y - (d.image_height / 2); + }) + .attr("width", function (d) { + return (node_radius / 0.8); + }) + .attr("height", function (d) { + return (node_radius / 0.8); + }) + .attr("node_id", function (d) { + return d.id; + }) .attr("id", "image2995") .classed('dragable_node', true) //own dragable - .on("mouseover", function(d) { + .on("mouseover", function (d) { myMouseoverCircleFunction(d.id) - }) - .on("mouseout", function(d) { + }) + .on("mouseout", function (d) { myMouseoutCircleFunction(d.id) - }) + }) .on("click", selected_node) - .on("dblclick", function(d) { - edit_node(d, true); - }) - .on("contextmenu", function(d) { show_menu("node", d);}); - + .on("dblclick", function (d) { + edit_node(d, true); + }) + .on("contextmenu", function (d) { show_menu("node", d); }); + } else if (shape == 'square') { d3.select("#id_node_" + element.id + networkmap_id) .insert("rect", "title") - .attr("width", node_radius * 2) - .attr("height", node_radius * 2) - .attr("class", "node_shape node_shape_square") - .style("fill", function(d) { - return d.color; - }) - .classed('dragable_node', true) //own dragable - .on("mouseover", function(d) { - myMouseoverSquareFunction(d.id) - }) - .on("mouseout", function(d) { - myMouseoutSquareFunction(d.id) - }) - .on("click", selected_node) - .on("dblclick", function(d) { - edit_node(d, true); - }) - .on("contextmenu", function(d) { show_menu("node", d);}); - + .attr("width", node_radius * 2) + .attr("height", node_radius * 2) + .attr("class", "node_shape node_shape_square") + .style("fill", function (d) { + return d.color; + }) + .classed('dragable_node', true) //own dragable + .on("mouseover", function (d) { + myMouseoverSquareFunction(d.id) + }) + .on("mouseout", function (d) { + myMouseoutSquareFunction(d.id) + }) + .on("click", selected_node) + .on("dblclick", function (d) { + edit_node(d, true); + }) + .on("contextmenu", function (d) { show_menu("node", d); }); + d3.select("#id_node_" + element.id + networkmap_id) .append("image") .attr("class", "node_image") - .attr("xlink:href", function(d) { - return d.image_url; - }) - .attr("x", function(d) { - return d.x - (d.image_width / 2); - }) - .attr("y", function(d) { - return d.y - (d.image_height / 2); - }) - .attr("width", function(d) { - return (node_radius / 0.8); - }) - .attr("height", function(d) { - return (node_radius / 0.8); - }) - .attr("node_id", function(d) { - return d.id; - }) + .attr("xlink:href", function (d) { + return d.image_url; + }) + .attr("x", function (d) { + return d.x - (d.image_width / 2); + }) + .attr("y", function (d) { + return d.y - (d.image_height / 2); + }) + .attr("width", function (d) { + return (node_radius / 0.8); + }) + .attr("height", function (d) { + return (node_radius / 0.8); + }) + .attr("node_id", function (d) { + return d.id; + }) .attr("id", "image2995") .classed('dragable_node', true) //own dragable - .on("mouseover", function(d) { + .on("mouseover", function (d) { myMouseoverSquareFunction(d.id) - }) - .on("mouseout", function(d) { + }) + .on("mouseout", function (d) { myMouseoutSquareFunction(d.id) - }) + }) .on("click", selected_node) - .on("dblclick", function(d) { - edit_node(d, true); - }) - .on("contextmenu", function(d) { show_menu("node", d);}); - + .on("dblclick", function (d) { + edit_node(d, true); + }) + .on("contextmenu", function (d) { show_menu("node", d); }); + } else if (shape == 'rhombus') { d3.select("#id_node_" + element.id + networkmap_id) .insert("rect", "title") - .attr("transform", - "") - .attr("width", node_radius * 1.5) - .attr("height", node_radius * 1.5) - .attr("class", "node_shape node_shape_rhombus") - .style("fill", function(d) { - return d.color; - }) - .classed('dragable_node', true) //own dragable - .on("mouseover", function(d) { - myMouseoverRhombusFunction(d.id) - }) - .on("mouseout", function(d) { - myMouseoutRhombusFunction(d.id) - }) - .on("click", selected_node) - .on("dblclick", function(d) { - edit_node(d, true); - }) - .on("contextmenu", function(d) { show_menu("node", d);}); - + .attr("transform", + "") + .attr("width", node_radius * 1.5) + .attr("height", node_radius * 1.5) + .attr("class", "node_shape node_shape_rhombus") + .style("fill", function (d) { + return d.color; + }) + .classed('dragable_node', true) //own dragable + .on("mouseover", function (d) { + myMouseoverRhombusFunction(d.id) + }) + .on("mouseout", function (d) { + myMouseoutRhombusFunction(d.id) + }) + .on("click", selected_node) + .on("dblclick", function (d) { + edit_node(d, true); + }) + .on("contextmenu", function (d) { show_menu("node", d); }); + d3.select("#id_node_" + element.id + networkmap_id) .append("image") .attr("class", "node_image") - .attr("xlink:href", function(d) { - return d.image_url; - }) - .attr("x", function(d) { - return d.x - (d.image_width / 2); - }) - .attr("y", function(d) { - return d.y - (d.image_height / 2); - }) - .attr("width", function(d) { - return (node_radius / 0.8); - }) - .attr("height", function(d) { - return (node_radius / 0.8); - }) - .attr("node_id", function(d) { - return d.id; - }) + .attr("xlink:href", function (d) { + return d.image_url; + }) + .attr("x", function (d) { + return d.x - (d.image_width / 2); + }) + .attr("y", function (d) { + return d.y - (d.image_height / 2); + }) + .attr("width", function (d) { + return (node_radius / 0.8); + }) + .attr("height", function (d) { + return (node_radius / 0.8); + }) + .attr("node_id", function (d) { + return d.id; + }) .attr("id", "image2995") .classed('dragable_node', true) //own dragable - .on("mouseover", function(d) { + .on("mouseover", function (d) { myMouseoverRhombusFunction(d.id) - }) - .on("mouseout", function(d) { + }) + .on("mouseout", function (d) { myMouseoutRhombusFunction(d.id) - }) + }) .on("click", selected_node) - .on("dblclick", function(d) { - edit_node(d, true); - }) - .on("contextmenu", function(d) { show_menu("node", d);}); + .on("dblclick", function (d) { + edit_node(d, true); + }) + .on("contextmenu", function (d) { show_menu("node", d); }); } - + } - + count = count - 1; if (count == 0) { draw_elements_graph(); @@ -486,28 +486,28 @@ function update_link(row_index, id_link) { var interface_source = parseInt( $("select[name='interface_source_" + row_index + "']") .val() - ); - + ); + var text_source_interface = ""; if (interface_source != 0) { text_source_interface = $("select[name='interface_source_" + - row_index +"'] option:selected").text(); + row_index + "'] option:selected").text(); } - + var interface_target = parseInt( $("select[name='interface_target_" + row_index + "']") .val() - ); - + ); + var text_target_interface = ""; if (interface_target != 0) { text_target_interface = $("select[name='interface_target_" + - row_index +"'] option:selected").text(); + row_index + "'] option:selected").text(); } - + $(".edit_icon_progress_" + row_index).css("display", ""); $(".edit_icon_" + row_index).css("display", "none"); - + var params = []; params.push("update_link=1"); params.push("networkmap_id=" + networkmap_id); @@ -518,17 +518,17 @@ function update_link(row_index, id_link) { params.push("target_text=" + text_target_interface); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { $(".edit_icon_progress_" + row_index).css("display", "none"); - + if (data['correct']) { $(".edit_icon_correct_" + row_index).css("display", ""); - + $("select[name='interface_source_" + row_index + "'] option[value='" + interface_source + "']") .prop("selected", true); $("select[name='interface_target_" + row_index + "'] option[value='" + interface_target + "']") @@ -536,7 +536,7 @@ function update_link(row_index, id_link) { var id = ""; var index = -1; - $.each(graph.links, function(j, link) { + $.each(graph.links, function (j, link) { if (link['id_db'] == id_link) { index = j; id = String(id_link); @@ -571,7 +571,7 @@ function update_link(row_index, id_link) { temp_link["text_start"] = data["text_start"]; temp_link["text_end"] = data["text_end"]; - $.each(graph.nodes, function(k, node) { + $.each(graph.nodes, function (k, node) { if (node['id_agent'] == data['id_db_target']) { temp_link["target"] = graph.nodes[k]; } @@ -587,18 +587,18 @@ function update_link(row_index, id_link) { window.layer_graph_links = window.layer_graph .append("g") - .attr("id", "layer_graph_links_" + networkmap_id); + .attr("id", "layer_graph_links_" + networkmap_id); window.layer_graph_nodes = window.layer_graph .append("g") - .attr("id", "layer_graph_nodes_" + networkmap_id); - + .attr("id", "layer_graph_nodes_" + networkmap_id); + force.nodes(graph.nodes) .links(graph.links) .start(); - + window.node = layer_graph_nodes.selectAll(".node"); window.link = layer_graph_links.selectAll(".link"); - + draw_elements_graph(); init_drag_and_drop(); set_positions_graph(); @@ -610,11 +610,11 @@ function update_link(row_index, id_link) { }); } -function delete_link_from_id (index) { +function delete_link_from_id(index) { graph.links.splice(index, 1); } -function add_new_link (new_link) { +function add_new_link(new_link) { graph.links.push(new_link); } @@ -622,38 +622,38 @@ function edit_node(data_node, dblClick) { if (enterprise_installed) { var flag_edit_node = true; var edit_node = null - + //Only select one node var selection = d3.selectAll('.node_selected'); - + if (selection[0].length == 1) { edit_node = selection[0].pop(); } else if (selection[0].length > 1) { edit_node = selection[0].pop(); } - else if (dblClick){ + else if (dblClick) { edit_node = d3.select("#id_node_" + data_node['id'] + networkmap_id); edit_node = edit_node[0][0]; } else { flag_edit_node = false; } - + if (flag_edit_node) { d3.selectAll('.node_selected') .classed("node_selected", false); d3.select(edit_node) .classed("node_selected", true); - + id = d3.select(edit_node).attr("id").replace("id_node_", ""); id_networkmap_lenght = networkmap_id.toString().length; id_node_length = id.length - id_networkmap_lenght; id = id.substring(0, id_node_length); node_selected = graph.nodes[id]; - + selected_links = get_relations(node_selected); - + $("select[name='shape'] option[value='" + node_selected.shape + "']") .prop("selected", true); $("select[name='shape']").attr("onchange", @@ -663,18 +663,18 @@ function edit_node(data_node, dblClick) { $("#node_options-node_name-2 input") .attr("onclick", "update_node_name(" + node_selected.id_db + ");"); - + $("#node_details-0-1").html('' + node_selected["text"] + ''); var params = []; params.push("get_agent_info=1"); params.push("id_agent=" + node_selected["id_agent"]); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - - jQuery.ajax ({ - data: params.join ("&"), + + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { var adressess = ""; for (adress in data['adressess']) { @@ -684,18 +684,18 @@ function edit_node(data_node, dblClick) { $("#node_details-2-1").html(data["os"]); $("#node_details-3-1").html(data["group"]); - $('[aria-describedby=dialog_node_edit]').css({'top':'200px'}); - $('#foot').css({'top':parseInt($("[aria-describedby=dialog_node_edit]").css('height')+$("[aria-describedby=dialog_node_edit]").css('top')),'position':'relative'}); + $('[aria-describedby=dialog_node_edit]').css({ 'top': '200px' }); + $('#foot').css({ 'top': parseInt($("[aria-describedby=dialog_node_edit]").css('height') + $("[aria-describedby=dialog_node_edit]").css('top')), 'position': 'relative' }); get_interface_data_to_table(node_selected, selected_links); } }); - - $("#dialog_node_edit" ) - .dialog( "option", "title", - dialog_node_edit_title.replace("%s", node_selected.text)); + + $("#dialog_node_edit") + .dialog("option", "title", + dialog_node_edit_title.replace("%s", node_selected.text)); $("#dialog_node_edit").dialog("open"); - + if (node_selected.id_agent == undefined || node_selected.id_agent == -2) { //Fictional node $("#node_options-fictional_node_name") @@ -725,7 +725,7 @@ function edit_node(data_node, dblClick) { $("#node_options-node_name") .css("display", ""); } - + //Clean $("#relations_table .relation_link_row").remove(); //Show the no relations @@ -735,25 +735,25 @@ function edit_node(data_node, dblClick) { } } -function get_interface_data_to_table (node_selected, selected_links) { +function get_interface_data_to_table(node_selected, selected_links) { $("#interface_information").find("tr:gt(0)").remove(); var params = []; params.push("get_interface_info=1"); params.push("id_agent=" + node_selected["id_agent"]); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (data.length == 0) { $("#interface_information").find('tbody') .append($('').html("

It has no interface to display

")); } else { - jQuery.each(data, function(j, interface) { + jQuery.each(data, function (j, interface) { $("#interface_information").find('tbody') .append($('') .append($('') @@ -779,23 +779,23 @@ function get_interface_data_to_table (node_selected, selected_links) { }); } -function load_interfaces (selected_links) { +function load_interfaces(selected_links) { //Clean $("#relations_table .relation_link_row").remove(); //Show the no relations $("#relations_table-loading").css('display', 'none'); $("#relations_table-no_relations").css('display', ''); - - jQuery.each(selected_links, function(i, link_each) { + + jQuery.each(selected_links, function (i, link_each) { $("#relations_table-no_relations").css('display', 'none'); $("#relations_table-loading").css('display', ''); - + var template_relation_row = $("#relations_table-template_row") .clone(); - + $(template_relation_row).css('display', ''); $(template_relation_row).attr('class', 'relation_link_row'); - + $("select[name='interface_source']", template_relation_row) .attr('name', "interface_source_" + i) .attr('id', "interface_source_" + i); @@ -812,24 +812,24 @@ function load_interfaces (selected_links) { .attr('class', "edit_icon_fail_" + i); $(".edit_icon_link", template_relation_row) .attr('class', "edit_icon_link_" + i) - .click(function() { + .click(function () { update_link(i, link_each.id_db); } - ); - + ); + var params3 = []; params3.push("get_intefaces=1"); params3.push("id_agent_target=" + link_each.target.id_agent); params3.push("id_agent_source=" + link_each.source.id_agent); params3.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - - jQuery.ajax ({ - data: params3.join ("&"), + + jQuery.ajax({ + data: params3.join("&"), dataType: 'json', type: 'POST', async: true, cache: false, - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (data['correct']) { $("select[name='interface_target_" + i + "']", template_relation_row).empty(); @@ -837,24 +837,24 @@ function load_interfaces (selected_links) { $("select[name='interface_source_" + i + "']", template_relation_row).empty(); $("select[name='interface_source_" + i + "']", template_relation_row).append(''); - jQuery.each(data['target_interfaces'], function(j, interface) { + jQuery.each(data['target_interfaces'], function (j, interface) { $("select[name='interface_target_" + i + "']", template_relation_row) .append($("'); - jQuery.each(data.interfaces_parent, function(i, interface) { - $('#interface_target_select').append(''); - }); + if ((link_item.source_id_db == data_parent.id_db) && + (link_item.target_id_db == child_data.id_db)) { - $("#interface_source_select").empty(); - $('#interface_source_select').append(''); - jQuery.each(data.interfaces_child, function(i, interface) { - $('#interface_source_select').append(''); - }); + repeat = true; + } + }); - $('#dialog_interface_link').dialog("open"); - } - }); + if (repeat) { + count = count - 1; + if (count == 0) { + draw_elements_graph(); + set_positions_graph(); + + cancel_set_parent(); + cancel_set_parent_interface(); + } + + return; //Break + } + + var params = []; + params.push("set_relationship_interface=1"); + params.push("id=" + networkmap_id); + params.push("child=" + child_data.id_db); + params.push("parent=" + data_parent.id_db); + params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); + + jQuery.ajax({ + data: params.join("&"), + dataType: 'json', + type: 'POST', + url: action = "ajax.php", + success: function (data) { + var parent_name = data_parent.text; + var child_name = child_data.text; + $('#label-node_source_interface').text(child_name); + $('#label-node_target_interface').text(parent_name); + + $("#interface_target_select").empty(); + $('#interface_target_select').append(''); + jQuery.each(data.interfaces_parent, function (i, interface) { + $('#interface_target_select').append(''); + }); + + $("#interface_source_select").empty(); + $('#interface_source_select').append(''); + jQuery.each(data.interfaces_child, function (i, interface) { + $('#interface_source_select').append(''); + }); + + $('#dialog_interface_link').dialog("open"); + } + }); }); } -function add_interface_link_js () { +function add_interface_link_js() { cancel_set_parent_interface(); $('#dialog_interface_link').dialog("close"); - + source_value = $('#interface_source_select').val(); source_text = $('#interface_source_select').find('option:selected').text(); target_value = $('#interface_target_select').val(); @@ -1977,11 +1976,11 @@ function add_interface_link_js () { params.push("target_text=" + target_text); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (data['correct']) { var temp_link = {}; @@ -2006,12 +2005,12 @@ function add_interface_link_js () { } temp_link['status_start'] = "0"; temp_link['status_end'] = "0"; - - + + temp_link['text_start'] = data['text_start']; temp_link['text_end'] = data['text_end']; - - jQuery.each(graph.nodes, function(j, node) { + + jQuery.each(graph.nodes, function (j, node) { if (node['id_agent'] == data['id_db_target']) { temp_link['target'] = graph.nodes[j]; } @@ -2019,9 +2018,9 @@ function add_interface_link_js () { temp_link['source'] = graph.nodes[j]; } }); - + graph.links.push(temp_link); - + draw_elements_graph(); init_drag_and_drop(); set_positions_graph(); @@ -2033,7 +2032,7 @@ function add_interface_link_js () { function refresh_holding_area() { holding_pos_x = d3.select("#holding_area_" + networkmap_id).attr("x"); holding_pos_y = d3.select("#holding_area_" + networkmap_id).attr("y"); - + var pos_x = parseInt(holding_pos_x) + parseInt(node_radius); var pos_y = parseInt(holding_pos_y) + parseInt(node_radius); if (enterprise_installed) { @@ -2044,21 +2043,21 @@ function refresh_holding_area() { params.push("x=" + pos_x); params.push("y=" + pos_y); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (data['correct']) { window.holding_area = data['holding_area']; - - jQuery.each(holding_area.nodes, function(i, node) { + + jQuery.each(holding_area.nodes, function (i, node) { var temp_node = {}; - + temp_node['id'] = graph.nodes.length; holding_area.nodes[i]['id'] = temp_node['id']; - + temp_node['id_db'] = node['id_db']; temp_node['id_agent'] = node['id_agent']; temp_node['id_module'] = 0; @@ -2074,21 +2073,21 @@ function refresh_holding_area() { temp_node['image_url'] = node['image_url']; temp_node['image_width'] = node['image_width']; temp_node['image_height'] = node['image_width']; - + graph.nodes.push(temp_node); }); - - jQuery.each(graph.links, function(j, g_link) { - - for(var i = 0; i < holding_area.links.length; i++) { + + jQuery.each(graph.links, function (j, g_link) { + + for (var i = 0; i < holding_area.links.length; i++) { if (g_link['id_db'] == holding_area.links[i]['id_db']) { holding_area.links.splice(i, 1); } } - + }); - - jQuery.each(holding_area.links, function(i, link) { + + jQuery.each(holding_area.links, function (i, link) { var temp_link = {}; temp_link['id_db'] = link['id_db']; temp_link['arrow_start'] = link['arrow_start']; @@ -2099,9 +2098,9 @@ function refresh_holding_area() { temp_link['id_module_end'] = link['id_module_end']; temp_link['text_start'] = link['text_start']; temp_link['text_end'] = link['text_end']; - + //Re-hook the links to nodes - jQuery.each(graph.nodes, function(j, node) { + jQuery.each(graph.nodes, function (j, node) { if (node['id_agent'] == link['id_agent_end']) { temp_link['target'] = graph.nodes[j]; } @@ -2109,27 +2108,27 @@ function refresh_holding_area() { temp_link['source'] = graph.nodes[j]; } }); - + graph.links.push(temp_link); }); - + $("#layer_graph_links_" + networkmap_id).remove(); $("#layer_graph_nodes_" + networkmap_id).remove(); window.layer_graph_links = window.layer_graph .append("g") - .attr("id", "layer_graph_links_" + networkmap_id); + .attr("id", "layer_graph_links_" + networkmap_id); window.layer_graph_nodes = window.layer_graph .append("g") - .attr("id", "layer_graph_nodes_" + networkmap_id); - + .attr("id", "layer_graph_nodes_" + networkmap_id); + force.nodes(graph.nodes) .links(graph.links) .start(); - + window.node = layer_graph_nodes.selectAll(".node"); window.link = layer_graph_links.selectAll(".link"); - + draw_elements_graph(); init_drag_and_drop(); set_positions_graph(); @@ -2137,7 +2136,7 @@ function refresh_holding_area() { $('#holding_spinner_' + networkmap_id).css("display", "none"); } }, - error: function(){ + error: function () { $('#holding_spinner_' + networkmap_id).css("display", "none"); } }); @@ -2147,11 +2146,11 @@ function refresh_holding_area() { function set_parent(parent_data) { if (enterprise_installed) { var selection = d3.selectAll('.node_children'); - + count = selection.size(); - + selection - .each(function(child_data) { + .each(function (child_data) { //Check if exist the link as // repeat: // old link: node1 (parent) - node2 (child) @@ -2160,48 +2159,48 @@ function set_parent(parent_data) { // swapped: // old link: node1 (child) - node2 (parent) // new link: node2 (child) - node1 (parent) - + var repeat = false; - jQuery.each(graph.links, function(i, link_item) { - + jQuery.each(graph.links, function (i, link_item) { + if ((link_item.source_id_db == child_data.id_db) && - (link_item.target_id_db == parent_data.id_db)){ - + (link_item.target_id_db == parent_data.id_db)) { + repeat = true; } - + if ((link_item.source_id_db == parent_data.id_db) && - (link_item.target_id_db == child_data.id_db)){ - + (link_item.target_id_db == child_data.id_db)) { + repeat = true; } - + }); - + if (repeat) { count = count - 1; if (count == 0) { draw_elements_graph(); set_positions_graph(); - + cancel_set_parent(); cancel_set_parent_interface(); } - + return; //Break } - + var params = []; params.push("set_relationship=1"); params.push("id=" + networkmap_id); params.push("child=" + child_data.id_db); params.push("parent=" + parent_data.id_db); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (data['correct']) { //Add the relationship and paint @@ -2221,7 +2220,7 @@ function set_parent(parent_data) { item['id_agent_end'] = graph.nodes[parent_data.id]['id_agent']; item['target'] = graph.nodes[parent_data.id]; item['source'] = graph.nodes[child_data.id]; - + graph.links.push(item); } //update_networkmap(); @@ -2229,42 +2228,42 @@ function set_parent(parent_data) { if (count == 0) { draw_elements_graph(); set_positions_graph(); - + cancel_set_parent(); cancel_set_parent_interface(); } } }); } - ); + ); } } -function cancel_set_parent_interface () { +function cancel_set_parent_interface() { var selection = d3.selectAll('.node_children'); - + selection - .each(function(d) { + .each(function (d) { d3.select("#id_node_" + d.id + networkmap_id) .classed("node_selected", true) .classed("node_children", false); } - ); - + ); + flag_setting_interface_link_running = false; } function cancel_set_parent() { var selection = d3.selectAll('.node_children'); - + selection - .each(function(d) { + .each(function (d) { d3.select("#id_node_" + d.id + networkmap_id) .classed("node_selected", true) .classed("node_children", false); } - ); - + ); + flag_setting_relationship_running = false; } @@ -2273,46 +2272,46 @@ function cancel_set_parent() { //////////////////////////////////////////////////////////////////////// function init_drag_and_drop() { window.dragables = svg.selectAll(".dragable_node"); - + window.drag_start = [0, 0]; window.drag_end = [0, 0]; window.drag = d3.behavior.drag() - .on("dragstart", function() { + .on("dragstart", function () { if (d3.event.sourceEvent.button == 2) return; - + mouse_coords = d3.mouse(this); drag_start[0] = drag_end[0] = mouse_coords[0]; drag_start[1] = drag_end[1] = mouse_coords[1]; - + flag_drag_running = true; - + d3.event.sourceEvent.stopPropagation(); }) - .on("dragend", function(d, i) { + .on("dragend", function (d, i) { if (d3.event.sourceEvent.button == 2) return; - + flag_drag_running = false; - + var selection = d3.selectAll('.node_selected'); - + if (enterprise_installed) { holding_pos_x = d3.select("#holding_area_" + networkmap_id).attr("x"); holding_pos_y = d3.select("#holding_area_" + networkmap_id).attr("y"); selection - .each(function(d) { + .each(function (d) { var params = []; params.push("update_node=1"); params.push("node=" + JSON.stringify(d)); params.push("x=" + holding_pos_x); params.push("y=" + holding_pos_y); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (d.state == 'holding_area') { //It is out the holding area @@ -2337,11 +2336,11 @@ function init_drag_and_drop() { params.push("update_node_alert=1"); params.push("map_id=" + networkmap_id); params.push("page=operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (data['correct']) { $("#open_version_dialog").dialog(); @@ -2349,47 +2348,47 @@ function init_drag_and_drop() { } }); } - + d3.event.sourceEvent.stopPropagation(); }) - .on("drag", function( d, i) { + .on("drag", function (d, i) { if (d3.event.sourceEvent.button == 2) return; - + mouse_coords = d3.mouse(this); - + delta = [0, 0]; delta[0] = mouse_coords[0] - drag_end[0]; delta[1] = mouse_coords[1] - drag_end[1]; - + drag_end[0] = mouse_coords[0]; drag_end[1] = mouse_coords[1]; - + var selection = d3.selectAll('.node_selected'); - + selection - .each(function(d) { + .each(function (d) { graph.nodes[d.id].x = d.x + delta[0]; graph.nodes[d.id].y = d.y + delta[1]; graph.nodes[d.id].px = d.px + delta[0]; graph.nodes[d.id].py = d.py + delta[1]; }); - + draw_elements_graph(); set_positions_graph(); - + d3.event.sourceEvent.stopPropagation(); }); - dragables.call( drag); + dragables.call(drag); } function add_fictional_node() { var name = $("input[name='name_fictional_node']").val(); var networkmap_to_link = $("#networkmap_to_link").val(); - + var x = (click_menu_position_svg[0] - translation[0]) / scale; var y = (click_menu_position_svg[1] - translation[1]) / scale; - + if (enterprise_installed) { var params = []; params.push("create_fictional_point=1"); @@ -2402,15 +2401,15 @@ function add_fictional_node() { params.push("x=" + x); params.push("y=" + y); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (data['correct']) { $("#dialog_node_add").dialog("close"); - + var temp_node = {}; temp_node['id'] = graph.nodes.length; temp_node['id_db'] = data['id_node']; @@ -2428,9 +2427,9 @@ function add_fictional_node() { temp_node['image_width'] = 0; temp_node['image_height'] = 0; temp_node['networkmap_id'] = networkmap_to_link; - + graph.nodes.push(temp_node); - + draw_elements_graph(); init_drag_and_drop(); set_positions_graph(); @@ -2440,7 +2439,7 @@ function add_fictional_node() { } else { $("#dialog_node_add").dialog("close"); - + var temp_node = {}; temp_node['id'] = graph.nodes.length; temp_node['id_db'] = data['id_node']; @@ -2458,9 +2457,9 @@ function add_fictional_node() { temp_node['image_width'] = 0; temp_node['image_height'] = 0; temp_node['networkmap_id'] = networkmap_to_link; - + graph.nodes.push(temp_node); - + draw_elements_graph(); init_drag_and_drop(); set_positions_graph(); @@ -2478,16 +2477,16 @@ function init_graph(parameter_object) { $("#menu_tab_frame_view").height() - 20; // 20 of margin } - + window.refresh_period = 5 * 1000; //milliseconds - if (typeof(parameter_object.refresh_period) != "undefined") { + if (typeof (parameter_object.refresh_period) != "undefined") { window.refresh_period = parameter_object.refresh_period; } window.scale_minimap = 4.2; window.translation = [0, 0]; window.scale = 0.5; window.node_radius = 40; - if (typeof(parameter_object.node_radius) != "undefined") { + if (typeof (parameter_object.node_radius) != "undefined") { window.node_radius = parameter_object.node_radius; } window.interface_radius = 3; @@ -2501,128 +2500,128 @@ function init_graph(parameter_object) { window.enterprise_installed = false; window.flag_setting_relationship_running = false; window.flag_setting_interface_link_running = false; - + window.minimap_w = 0; window.minimap_h = 0; window.show_minimap = false; window.show_labels = true; window.context_minimap; - + window.holding_area_dimensions = [200, 200]; - if (typeof(parameter_object.holding_area_dimensions) != "undefined") { + if (typeof (parameter_object.holding_area_dimensions) != "undefined") { window.holding_area_dimensions = parameter_object.holding_area_dimensions; } - + window.graph = null; - if (typeof(parameter_object.graph) != "undefined") { + if (typeof (parameter_object.graph) != "undefined") { window.graph = parameter_object.graph; } - + window.networkmap_center = []; - if (typeof(parameter_object.networkmap_center) != "undefined") { + if (typeof (parameter_object.networkmap_center) != "undefined") { window.networkmap_center = parameter_object.networkmap_center; } - - if (typeof(networkmap_center[0]) == "undefined") { + + if (typeof (networkmap_center[0]) == "undefined") { networkmap_center = [0, 0]; } - + translation[0] = (width_svg / 2) - networkmap_center[0]; translation[1] = (height_svg / 2) - networkmap_center[1]; - + translation[0] = translation[0] * scale; translation[1] = translation[1] * scale; - + window.enterprise_installed = ''; - if (typeof(parameter_object.enterprise_installed) != "undefined") { + if (typeof (parameter_object.enterprise_installed) != "undefined") { window.enterprise_installed = parameter_object.enterprise_installed; } - + window.networkmap_dimensions = []; - if (typeof(parameter_object.networkmap_dimensions) != "undefined") { + if (typeof (parameter_object.networkmap_dimensions) != "undefined") { window.networkmap_dimensions = parameter_object.networkmap_dimensions; } window.max = Math.max(networkmap_dimensions[0], networkmap_dimensions[1]); window.min = Math.min(width_svg / scale_minimap, height_svg / scale_minimap); - + window.minimap_relation = min / max; minimap_w = networkmap_dimensions[0] * minimap_relation; minimap_h = networkmap_dimensions[1] * minimap_relation; - + $("#minimap_" + networkmap_id).attr('width', minimap_w); $("#minimap_" + networkmap_id).attr('height', minimap_h); - + window.canvas_minimap = $("#minimap_" + networkmap_id); window.context_minimap = canvas_minimap[0].getContext('2d'); window.minimap_drag = false; - + window.url_background_grid = ''; - if (typeof(parameter_object.url_background_grid) != "undefined") { + if (typeof (parameter_object.url_background_grid) != "undefined") { // GRID window.url_background_grid = ""; } - + var rect_center_x = graph.nodes[0].x; var rect_center_y = graph.nodes[0].y; - + //For to catch the keyevent for the ctrl key d3.select(document) - .on("keydown", function() { + .on("keydown", function () { if (d3.event.keyCode == key_multiple_selection) { flag_multiple_selection = true; disabled_drag_zoom = true; } }) - .on("keyup", function() { + .on("keyup", function () { if (d3.event.keyCode == key_multiple_selection) { flag_multiple_selection = false; disabled_drag_zoom = false; flag_multiple_selection_running = false; - + d3.select("#selection_rectangle") .style("display", "none"); } }); - + window.force = d3.layout.force() .charge(10) .linkDistance(0) .size([width_svg, height_svg]); - + if (x_offs != null) { - translation[0] = translation [0] + x_offs; + translation[0] = translation[0] + x_offs; } if (y_offs != null) { - translation[1] = translation [1] + y_offs; + translation[1] = translation[1] + y_offs; } if (z_dash != null) { scale = z_dash; } - + window.zoom_obj = d3.behavior.zoom(); zoom_obj.scaleExtent([0.05, 1]) .on("zoom", zoom) .translate(translation) .scale(scale); - + window.svg = d3.select("#networkconsole_" + networkmap_id) .append("svg") - .attr("id", "dinamic_networkmap_svg_" + networkmap_id) - .attr("width", width_svg) - .attr("height", height_svg) + .attr("id", "dinamic_networkmap_svg_" + networkmap_id) + .attr("width", width_svg) + .attr("height", height_svg) .call(zoom_obj) - .on("mousedown", function() { + .on("mousedown", function () { if (flag_multiple_selection) { flag_multiple_selection_running = true; - + mouse_coords = d3.mouse(this); - + selection_rectangle[0] = mouse_coords[0]; selection_rectangle[1] = mouse_coords[1]; selection_rectangle[2] = mouse_coords[0]; selection_rectangle[3] = mouse_coords[1]; - + d3.select("#selection_rectangle") .style("display", "") .attr("x", selection_rectangle[0]) @@ -2634,106 +2633,106 @@ function init_graph(parameter_object) { clear_selection(); } }) - .on("mouseup", function() { + .on("mouseup", function () { flag_multiple_selection_running = false; d3.select("#selection_rectangle") .style("display", "none"); }) - .on("mousemove", function() { + .on("mousemove", function () { if (flag_multiple_selection_running) { - + mouse_coords = d3.mouse(this); - + selection_rectangle[2] = mouse_coords[0]; selection_rectangle[3] = mouse_coords[1]; - + x = selection_rectangle[0]; width = selection_rectangle[2] - selection_rectangle[0]; if (width < 0) { x = selection_rectangle[2]; width = selection_rectangle[0] - selection_rectangle[2]; } - + y = selection_rectangle[1]; height = selection_rectangle[3] - selection_rectangle[1]; if (height < 0) { y = selection_rectangle[3]; height = selection_rectangle[1] - selection_rectangle[3]; } - + d3.select("#selection_rectangle") .attr("x", x) .attr("y", y) .attr("width", width) .attr("height", height); - + sel_rec_x1 = x; sel_rec_x2 = x + width; sel_rec_y1 = y; sel_rec_y2 = y + height; - - d3.selectAll('.node').each(function(data, i) { - + + d3.selectAll('.node').each(function (data, i) { + item_x1 = ((data.x - (node_radius / 2)) * scale + translation[0]); item_x2 = ((data.x + (node_radius / 2)) * scale + translation[0]); item_y1 = ((data.y - (node_radius / 2)) * scale + translation[1]); item_y2 = ((data.y + (node_radius / 2)) * scale + translation[1]); - + if ( - !d3.select(this).classed("node_selected") && + !d3.select(this).classed("node_selected") && // inner circle inside selection frame item_x1 >= sel_rec_x1 && - item_x2 <= sel_rec_x2 && + item_x2 <= sel_rec_x2 && item_y1 >= sel_rec_y1 && item_y1 <= sel_rec_y2 ) { - + d3.select("#id_node_" + data.id + networkmap_id) .classed("node_selected", true); } }); } }) - .on("contextmenu", function(d) { show_menu("background", d);}); - - + .on("contextmenu", function (d) { show_menu("background", d); }); + + window.defs = svg.append("defs"); defs.selectAll("defs") .data(module_color_status) .enter() .append("marker") - .attr("id", function(d) { return "interface_start_" + d.status_code; }) - .attr("refX", 0) - .attr("refY", interface_radius) - .attr("markerWidth", (node_radius / 2) + interface_radius) - .attr("markerHeight", (node_radius / 2) + interface_radius) - .attr("orient", "auto") - .append("circle") - .attr("cx", (node_radius / 2.3) - (interface_radius / 2.3)) - .attr("cy", interface_radius) - .attr("r", interface_radius) - .attr("style", function(d) { - return "fill: " + d.color + ";"; - }); - + .attr("id", function (d) { return "interface_start_" + d.status_code; }) + .attr("refX", 0) + .attr("refY", interface_radius) + .attr("markerWidth", (node_radius / 2) + interface_radius) + .attr("markerHeight", (node_radius / 2) + interface_radius) + .attr("orient", "auto") + .append("circle") + .attr("cx", (node_radius / 2.3) - (interface_radius / 2.3)) + .attr("cy", interface_radius) + .attr("r", interface_radius) + .attr("style", function (d) { + return "fill: " + d.color + ";"; + }); + defs.selectAll("defs") .data(module_color_status) .enter() .append("marker") - .attr("id", function(d) { return "interface_end_" + d.status_code; }) - .attr("refX", (node_radius / 2.3) + (interface_radius / 2.3)) - .attr("refY", interface_radius) - .attr("markerWidth", (node_radius / 2) + interface_radius) - .attr("markerHeight", (node_radius / 2) + interface_radius) - .attr("orient", "auto") - .append("circle") - .attr("cx", interface_radius) - .attr("cy", interface_radius) - .attr("r", interface_radius) - .attr("style", function(d) { - return "fill: " + d.color + ";"; - }); - + .attr("id", function (d) { return "interface_end_" + d.status_code; }) + .attr("refX", (node_radius / 2.3) + (interface_radius / 2.3)) + .attr("refY", interface_radius) + .attr("markerWidth", (node_radius / 2) + interface_radius) + .attr("markerHeight", (node_radius / 2) + interface_radius) + .attr("orient", "auto") + .append("circle") + .attr("cx", interface_radius) + .attr("cy", interface_radius) + .attr("r", interface_radius) + .attr("style", function (d) { + return "fill: " + d.color + ";"; + }); + defs.append("marker") .attr("id", "interface_start") .attr("refX", 0) @@ -2742,11 +2741,11 @@ function init_graph(parameter_object) { .attr("markerHeight", (node_radius / 2) + interface_radius) .attr("orient", "auto") .append("circle") - .attr("cx", (node_radius / 2) - (interface_radius / 2)) - .attr("cy", interface_radius) - .attr("r", interface_radius) - .attr("style", "fill:" + module_color_status_unknown + ";"); - + .attr("cx", (node_radius / 2) - (interface_radius / 2)) + .attr("cy", interface_radius) + .attr("r", interface_radius) + .attr("style", "fill:" + module_color_status_unknown + ";"); + defs.append("marker") .attr("id", "interface_end") .attr("refX", (node_radius / 2) + (interface_radius / 2)) @@ -2755,11 +2754,11 @@ function init_graph(parameter_object) { .attr("markerHeight", (node_radius / 2) + interface_radius) .attr("orient", "auto") .append("circle") - .attr("cx", interface_radius) - .attr("cy", interface_radius) - .attr("r", interface_radius) - .attr("style", "fill:" + module_color_status_unknown + ";"); - + .attr("cx", interface_radius) + .attr("cy", interface_radius) + .attr("r", interface_radius) + .attr("style", "fill:" + module_color_status_unknown + ";"); + //Added pattern for the background grid svg.append("pattern") .attr("id", "background_grid") @@ -2767,92 +2766,92 @@ function init_graph(parameter_object) { .attr("width", 25) .attr("patternUnits", "userSpaceOnUse") .append("image") - .attr("y", 0) - .attr("x", 0) - .attr("xlink:href", url_background_grid) - .attr("height", 24) - .attr("width", 25); - + .attr("y", 0) + .attr("x", 0) + .attr("xlink:href", url_background_grid) + .attr("height", 24) + .attr("width", 25); + window.layer_graph = svg .append("g") - .attr("id", "layer_graph_" + networkmap_id) - .attr("transform", - "translate(" + translation + ")scale(" + scale + ")"); - + .attr("id", "layer_graph_" + networkmap_id) + .attr("transform", + "translate(" + translation + ")scale(" + scale + ")"); + if (enterprise_installed) { window.layer_graph.append("rect") .attr("id", "holding_area_" + networkmap_id) .attr("width", holding_area_dimensions[0]) .attr("height", holding_area_dimensions[1]) .attr("x", - networkmap_dimensions[0] + node_radius - holding_area_dimensions[0]) + networkmap_dimensions[0] + node_radius - holding_area_dimensions[0]) .attr("y", - networkmap_dimensions[1] + node_radius - holding_area_dimensions[1]) + networkmap_dimensions[1] + node_radius - holding_area_dimensions[1]) .attr("style", "fill: #e6e6e6; " + - "fill-opacity: 0.75; " + - "stroke: #dedede; " + - "stroke-width: 1; " + - "stroke-miterlimit: 4; " + - "stroke-opacity: 0.75; " + - "stroke-dasharray: none; " + - "stroke-dashoffset: 0"); - + "fill-opacity: 0.75; " + + "stroke: #dedede; " + + "stroke-width: 1; " + + "stroke-miterlimit: 4; " + + "stroke-opacity: 0.75; " + + "stroke-dasharray: none; " + + "stroke-dashoffset: 0"); + window.layer_graph.append("text") .append("tspan") - .attr("xml:space", "preserve") - .attr("style", "font-size: 32px; " + - "font-style: normal; " + - "font-weight: normal; " + - "text-align: start; " + - "line-height: 125%; " + - "letter-spacing: 0px; " + - "word-spacing: 0px; " + - "text-anchor: start; " + - "fill: #000000; " + - "fill-opacity: 1; " + - "stroke: none; " + - "font-family: Verdana") - .attr("x", networkmap_dimensions[0] + node_radius - holding_area_dimensions[0]) - .attr("y", networkmap_dimensions[1] + node_radius - holding_area_dimensions[1] - 10) - .text(holding_area_title); + .attr("xml:space", "preserve") + .attr("style", "font-size: 32px; " + + "font-style: normal; " + + "font-weight: normal; " + + "text-align: start; " + + "line-height: 125%; " + + "letter-spacing: 0px; " + + "word-spacing: 0px; " + + "text-anchor: start; " + + "fill: #000000; " + + "fill-opacity: 1; " + + "stroke: none; " + + "font-family: Verdana") + .attr("x", networkmap_dimensions[0] + node_radius - holding_area_dimensions[0]) + .attr("y", networkmap_dimensions[1] + node_radius - holding_area_dimensions[1] - 10) + .text(holding_area_title); } - + window.layer_graph_links = window.layer_graph .append("g") - .attr("id", "layer_graph_links_" + networkmap_id); + .attr("id", "layer_graph_links_" + networkmap_id); window.layer_graph_nodes = window.layer_graph .append("g") - .attr("id", "layer_graph_nodes_" + networkmap_id); - + .attr("id", "layer_graph_nodes_" + networkmap_id); + window.layer_selection_rectangle = svg .append("g") - .attr("id", "layer_selection_rectangle"); - + .attr("id", "layer_selection_rectangle"); + force.nodes(graph.nodes) .links(graph.links) .start(); - + window.node = layer_graph_nodes.selectAll(".node"); window.link = layer_graph_links.selectAll(".link"); - + draw_elements_graph(); set_positions_graph(); - + layer_selection_rectangle .append("rect") - .attr("width", 666) - .attr("height", 666) - .attr("x", 0) - .attr("y", 0) - .attr("id", "selection_rectangle") - .attr("style", "display: none; fill:#e6e6e6; " + - "fill-opacity:0.46153846; " + - "stroke:#e6e6e6; " + - "stroke-width:1; " + - "stroke-miterlimit:4; " + - "stroke-opacity:1; " + - "stroke-dasharray:none;"); - + .attr("width", 666) + .attr("height", 666) + .attr("x", 0) + .attr("y", 0) + .attr("id", "selection_rectangle") + .attr("style", "display: none; fill:#e6e6e6; " + + "fill-opacity:0.46153846; " + + "stroke:#e6e6e6; " + + "stroke-width:1; " + + "stroke-miterlimit:4; " + + "stroke-opacity:1; " + + "stroke-dasharray:none;"); + $("#dialog_node_edit").dialog({ autoOpen: false, width: 650 @@ -2862,7 +2861,7 @@ function init_graph(parameter_object) { autoOpen: false, width: 650 }); - + $("#dialog_node_add").dialog({ autoOpen: false, width: 650 @@ -2873,36 +2872,36 @@ function myMouseoverCircleFunction(node_id) { var circle = d3.select("#id_node_" + node_id + networkmap_id + " circle"); over = circle.classed("node_over"); - + in_a_node = !in_a_node; - + circle.classed("node_over", !over); - + circle.transition().duration(400) .attr("r", node_radius + 10); } function myMouseoutCircleFunction(node_id) { var circle = d3.select("#id_node_" + node_id + networkmap_id + " circle"); - + over = circle.classed("node_over"); - + in_a_node = !in_a_node; - + circle.classed("node_over", !over); - + circle.transition().duration(400) .attr("r", node_radius); } function myMouseoverSquareFunction(node_id) { var square = d3.select("#id_node_" + node_id + networkmap_id + " rect"); - + over = square.classed("node_over"); - + in_a_node = !in_a_node; - + square.classed("node_over", !over); - + square.transition().duration(400) .attr("width", (node_radius * 2) + 10) .attr("height", (node_radius * 2) + 10) @@ -2910,13 +2909,13 @@ function myMouseoverSquareFunction(node_id) { } function myMouseoutSquareFunction(node_id) { var square = d3.select("#id_node_" + node_id + networkmap_id + " rect"); - + over = square.classed("node_over"); - + in_a_node = !in_a_node; - + square.classed("node_over", !over); - + square.transition().duration(400) .attr("width", (node_radius * 2)) .attr("height", (node_radius * 2)) @@ -2925,71 +2924,71 @@ function myMouseoutSquareFunction(node_id) { function myMouseoverRhombusFunction(node_id) { var rhombus = d3.select("#id_node_" + node_id + networkmap_id + " rect"); - + over = rhombus.classed("node_over"); - + in_a_node = !in_a_node; - + rhombus.classed("node_over", !over); - + rhombus.transition().duration(400) .attr("width", (node_radius * 1.5) + 10) .attr("height", (node_radius * 1.5) + 10); } function myMouseoutRhombusFunction(node_id) { var rhombus = d3.select("#id_node_" + node_id + networkmap_id + " rect"); - + over = rhombus.classed("node_over"); - + in_a_node = !in_a_node; - + rhombus.classed("node_over", !over); - + rhombus.transition().duration(400) .attr("width", (node_radius * 1.5)) .attr("height", (node_radius * 1.5)); } function draw_elements_graph() { - link = link.data(force.links(), function(d) { + link = link.data(force.links(), function (d) { return d.source.id + networkmap_id + "-" + d.target.id + networkmap_id + Math.random(); }); - + link_temp = link.enter() .append("g") - .attr("id", function(d) { - return "link_id_" + d.id_db + networkmap_id; - }) - .attr("class", function(d) { - var holding_area_text = ""; - if ((d.source.state == 'holding_area') || - (d.target.state == 'holding_area')) { - - holding_area_text = " holding_area_link "; - } - - return "link " + - "source_" + d.source.id + networkmap_id + " " + - "target_" + d.target.id + networkmap_id + " " + - holding_area_text + - "id_module_start_" + d.id_module_start + " " + - "id_module_end_" + d.id_module_end; - }); - - link.exit().remove(); - - link_temp.append("path") - .attr("id", function(d) { - return "link_id_text_" + d.id_db + networkmap_id; + .attr("id", function (d) { + return "link_id_" + d.id_db + networkmap_id; }) - .attr("class", function(d) { + .attr("class", function (d) { var holding_area_text = ""; if ((d.source.state == 'holding_area') || (d.target.state == 'holding_area')) { - + holding_area_text = " holding_area_link "; } - + + return "link " + + "source_" + d.source.id + networkmap_id + " " + + "target_" + d.target.id + networkmap_id + " " + + holding_area_text + + "id_module_start_" + d.id_module_start + " " + + "id_module_end_" + d.id_module_end; + }); + + link.exit().remove(); + + link_temp.append("path") + .attr("id", function (d) { + return "link_id_text_" + d.id_db + networkmap_id; + }) + .attr("class", function (d) { + var holding_area_text = ""; + if ((d.source.state == 'holding_area') || + (d.target.state == 'holding_area')) { + + holding_area_text = " holding_area_link "; + } + return "link " + "source_" + d.source.id + networkmap_id + " " + "target_" + d.target.id + networkmap_id + " " + @@ -2999,380 +2998,384 @@ function draw_elements_graph() { }) .attr("stroke-width", 3) .attr("d", null) - .attr('marker-start', function(d) { + .attr('marker-start', function (d) { if (d.arrow_start == "") { return ""; } else if (d.arrow_start == "module") { - if (typeof(module_color_status[d.status_start]) == "undefined") + if (typeof (module_color_status[d.status_start]) == "undefined") return "url(#interface_start)"; else return "url(#interface_start_" + d.status_start + ")"; } }) - .attr('marker-end', function(d) { + .attr('marker-end', function (d) { if (d.arrow_end == "") { return ""; } else if (d.arrow_end == "module") { - if (typeof(module_color_status[d.status_end]) == "undefined") + if (typeof (module_color_status[d.status_end]) == "undefined") return "url(#interface_end)"; else return "url(#interface_end_" + d.status_end + ")"; } }) - .on("mouseover", function(d) { + .on("mouseover", function (d) { d3.select(this) .classed("link_over", true); }) - .on("mouseout", function(d) { + .on("mouseout", function (d) { d3.select(this) .classed("link_over", false); }); - + //Add the reverse line for the end marker, it is invisible link_temp.append("path") - .attr("id", function(d) { + .attr("id", function (d) { return "link_reverse_id_" + d.id_db + networkmap_id; }) .attr("stroke-width", 0) .attr("d", null) - .attr("class", function(d) { - return "link_reverse"; + .attr("class", function (d) { + return "link_reverse"; }); - - link_temp.append("text") - .attr("xml:space", "preserve") - .append("textPath") - .attr("xlink:href", function(d) { - if (d.source.x < d.target.x) { - return "#link_id_text_" + d.id_db + networkmap_id; - } - else { - return "#link_reverse_id_" + d.id_db + networkmap_id; - } - }) - .attr("startOffset", function(d) { - if (d.source.x < d.target.x) { - return ""; - } - else { - return "85%"; - }}) - .attr("text-anchor", function(d) { - if (d.source.x < d.target.x) { - return ""; - } - else { - return "end"; - }}) - .append("tspan") - .attr("style", "font-size: 12px; " + - "font-style:normal; " + - "font-weight:normal; " + - "line-height: 100%; " + - "letter-spacing:0px; " + - "word-spacing:0px; " + - "fill:#000000; " + - "fill-opacity:1; " + - "stroke:none; " + - "text-align:start; ") - .text(function(d) { - var text_link = ""; - if (d.text_start) { - text_link = d.text_start; - } - - return (Array(25).join(" ")) + text_link; - }); - - link_temp.append("text") - .attr("xml:space", "preserve") - .append("textPath") - .attr("xlink:href", function(d) { - if (d.source.x < d.target.x) { - return "#link_id_text_" + d.id_db + networkmap_id; - } - else { - return "#link_reverse_id_" + d.id_db + networkmap_id; - } - }) - .attr("startOffset", function(d) { - if (d.source.x < d.target.x) { - return "85%"; - } - else { - return ""; - }}) - .attr("text-anchor", function(d) { - if (d.source.x < d.target.x) { - return "end"; - } - else { - return ""; - }}) - .append("tspan") - .attr("style", "font-size: 12px; " + - "font-style:normal; " + - "font-weight:normal; " + - "line-height: 100%; " + - "letter-spacing:0px; " + - "word-spacing:0px; " + - "fill:#000000; " + - "fill-opacity:1; " + - "stroke:none; " + - "text-align:end; ") - .text(function(d) { - var text_link = ""; - if (d.text_end) { - text_link = d.text_end; - } - - return (Array(25).join(" ")) + text_link; - }); - node = node.data(force.nodes(), function(d) { return d.id;}); - + link_temp.append("text") + .attr("xml:space", "preserve") + .append("textPath") + .attr("xlink:href", function (d) { + if (d.source.x < d.target.x) { + return "#link_id_text_" + d.id_db + networkmap_id; + } + else { + return "#link_reverse_id_" + d.id_db + networkmap_id; + } + }) + .attr("startOffset", function (d) { + if (d.source.x < d.target.x) { + return ""; + } + else { + return "85%"; + } + }) + .attr("text-anchor", function (d) { + if (d.source.x < d.target.x) { + return ""; + } + else { + return "end"; + } + }) + .append("tspan") + .attr("style", "font-size: 12px; " + + "font-style:normal; " + + "font-weight:normal; " + + "line-height: 100%; " + + "letter-spacing:0px; " + + "word-spacing:0px; " + + "fill:#000000; " + + "fill-opacity:1; " + + "stroke:none; " + + "text-align:start; ") + .text(function (d) { + var text_link = ""; + if (d.text_start) { + text_link = d.text_start; + } + + return (Array(25).join(" ")) + text_link; + }); + + link_temp.append("text") + .attr("xml:space", "preserve") + .append("textPath") + .attr("xlink:href", function (d) { + if (d.source.x < d.target.x) { + return "#link_id_text_" + d.id_db + networkmap_id; + } + else { + return "#link_reverse_id_" + d.id_db + networkmap_id; + } + }) + .attr("startOffset", function (d) { + if (d.source.x < d.target.x) { + return "85%"; + } + else { + return ""; + } + }) + .attr("text-anchor", function (d) { + if (d.source.x < d.target.x) { + return "end"; + } + else { + return ""; + } + }) + .append("tspan") + .attr("style", "font-size: 12px; " + + "font-style:normal; " + + "font-weight:normal; " + + "line-height: 100%; " + + "letter-spacing:0px; " + + "word-spacing:0px; " + + "fill:#000000; " + + "fill-opacity:1; " + + "stroke:none; " + + "text-align:end; ") + .text(function (d) { + var text_link = ""; + if (d.text_end) { + text_link = d.text_end; + } + + return (Array(25).join(" ")) + text_link; + }); + + node = node.data(force.nodes(), function (d) { return d.id; }); + node_temp = node.enter() .append("g") - .attr("id", function(d) { - return "id_node_" + d.id + networkmap_id; - }) - .attr("class", function(d) { - if (d.state == 'holding_area') - return "node holding_area"; - else - return "node"; - }); - - node.exit().remove(); - - //Shape circle - node_temp.filter(function(d) { - if (d.shape == 'circle') {return true;} - else return false; + .attr("id", function (d) { + return "id_node_" + d.id + networkmap_id; }) + .attr("class", function (d) { + if (d.state == 'holding_area') + return "node holding_area"; + else + return "node"; + }); + + node.exit().remove(); + + //Shape circle + node_temp.filter(function (d) { + if (d.shape == 'circle') { return true; } + else return false; + }) .append("circle") - .attr("r", node_radius) - .attr("class", "node_shape node_shape_circle") - .attr("node_id", function(d) { - return d.id + networkmap_id; - }) - .style("fill", function(d) { - return d.color; - }) - .classed('dragable_node', true) //own dragable - .on("mouseover", function(d) { - myMouseoverCircleFunction(d.id) - }) - .on("mouseout", function(d) { - myMouseoutCircleFunction(d.id) - }) - .on("click", selected_node) - .on("dblclick", function(d) { - edit_node(d, true); - }) - .on("contextmenu", function(d) { show_menu("node", d);}); - + .attr("r", node_radius) + .attr("class", "node_shape node_shape_circle") + .attr("node_id", function (d) { + return d.id + networkmap_id; + }) + .style("fill", function (d) { + return d.color; + }) + .classed('dragable_node', true) //own dragable + .on("mouseover", function (d) { + myMouseoverCircleFunction(d.id) + }) + .on("mouseout", function (d) { + myMouseoutCircleFunction(d.id) + }) + .on("click", selected_node) + .on("dblclick", function (d) { + edit_node(d, true); + }) + .on("contextmenu", function (d) { show_menu("node", d); }); + node_temp.append("image") .attr("class", "node_image") - .attr("xlink:href", function(d) { - return d.image_url; - }) - .attr("x", function(d) { - return d.x - (d.image_width / 2); - }) - .attr("y", function(d) { - return d.y - (d.image_height / 2); - }) - .attr("width", function(d) { - return (node_radius / 0.8); - }) - .attr("height", function(d) { - return (node_radius / 0.8); - }) - .attr("node_id", function(d) { - return d.id + networkmap_id; - }) + .attr("xlink:href", function (d) { + return d.image_url; + }) + .attr("x", function (d) { + return d.x - (d.image_width / 2); + }) + .attr("y", function (d) { + return d.y - (d.image_height / 2); + }) + .attr("width", function (d) { + return (node_radius / 0.8); + }) + .attr("height", function (d) { + return (node_radius / 0.8); + }) + .attr("node_id", function (d) { + return d.id + networkmap_id; + }) .attr("id", "image2995") .classed('dragable_node', true) //own dragable - .on("mouseover", function(d) { + .on("mouseover", function (d) { myMouseoverCircleFunction(d.id) - }) - .on("mouseout", function(d) { + }) + .on("mouseout", function (d) { myMouseoutCircleFunction(d.id) - }) + }) .on("click", selected_node) - .on("dblclick", function(d) { - edit_node(d, true); - }) - .on("contextmenu", function(d) { show_menu("node", d);}); - + .on("dblclick", function (d) { + edit_node(d, true); + }) + .on("contextmenu", function (d) { show_menu("node", d); }); + //Shape square - node_temp.filter(function(d) { - if (d.shape == 'square') {return true;} - else return false; - }) + node_temp.filter(function (d) { + if (d.shape == 'square') { return true; } + else return false; + }) .append("rect") - .attr("width", node_radius * 2) - .attr("height", node_radius * 2) - .attr("class", "node_shape node_shape_square") - .attr("node_id", function(d) { - return d.id + networkmap_id; - }) - .style("fill", function(d) { - return d.color; - }) - .classed('dragable_node', true) //own dragable - .on("mouseover", function(d) { - myMouseoverSquareFunction(d.id) - }) - .on("mouseout", function(d) { - myMouseoutSquareFunction(d.id) - }) - .on("click", selected_node) - .on("dblclick", function(d) { - edit_node(d, true); - }) - .on("contextmenu", function(d) { show_menu("node", d);}); - - node_temp.filter(function(d) { - if (d.shape == 'square') {return true;} - else return false; + .attr("width", node_radius * 2) + .attr("height", node_radius * 2) + .attr("class", "node_shape node_shape_square") + .attr("node_id", function (d) { + return d.id + networkmap_id; + }) + .style("fill", function (d) { + return d.color; }) - .append("image") - .attr("class", "node_image") - .attr("xlink:href", function(d) { - return d.image_url; - }) - .attr("x", function(d) { - return d.x - (d.image_width / 2); - }) - .attr("y", function(d) { - return d.y - (d.image_height / 2); - }) - .attr("width", function(d) { - return (node_radius / 0.8); - }) - .attr("height", function(d) { - return (node_radius / 0.8); - }) - .attr("node_id", function(d) { - return d.id + networkmap_id; - }) - .attr("id", "image2995") .classed('dragable_node', true) //own dragable - .on("mouseover", function(d) { + .on("mouseover", function (d) { myMouseoverSquareFunction(d.id) - }) - .on("mouseout", function(d) { + }) + .on("mouseout", function (d) { myMouseoutSquareFunction(d.id) - }) + }) .on("click", selected_node) - .on("dblclick", function(d) { - edit_node(d, true); - }) - .on("contextmenu", function(d) { show_menu("node", d);}); - - //Shape rhombus - node_temp.filter(function(d) { - if (d.shape == 'rhombus') {return true;} - else return false; - }) - .append("rect") - .attr("transform", - "") - .attr("width", node_radius * 1.5) - .attr("height", node_radius * 1.5) - .attr("class", "node_shape node_shape_rhombus") - .attr("node_id", function(d) { - return d.id + networkmap_id; - }) - .style("fill", function(d) { - return d.color; - }) - .classed('dragable_node', true) //own dragable - .on("mouseover", function(d) { - myMouseoverRhombusFunction(d.id) - }) - .on("mouseout", function(d) { - myMouseoutRhombusFunction(d.id) - }) - .on("click", selected_node) - .on("dblclick", function(d) { - edit_node(d, true); - }) - .on("contextmenu", function(d) { show_menu("node", d);}); - - node_temp.filter(function(d) { - if (d.shape == 'rhombus') {return true;} - else return false; + .on("dblclick", function (d) { + edit_node(d, true); }) + .on("contextmenu", function (d) { show_menu("node", d); }); + + node_temp.filter(function (d) { + if (d.shape == 'square') { return true; } + else return false; + }) .append("image") .attr("class", "node_image") - .attr("xlink:href", function(d) { - return d.image_url; - }) - .attr("x", function(d) { - return d.x - (d.image_width / 2); - }) - .attr("y", function(d) { - return d.y - (d.image_height / 2); - }) - .attr("width", function(d) { - return (node_radius / 0.8); - }) - .attr("height", function(d) { - return (node_radius / 0.8); - }) - .attr("node_id", function(d) { - return d.id + networkmap_id; - }) + .attr("xlink:href", function (d) { + return d.image_url; + }) + .attr("x", function (d) { + return d.x - (d.image_width / 2); + }) + .attr("y", function (d) { + return d.y - (d.image_height / 2); + }) + .attr("width", function (d) { + return (node_radius / 0.8); + }) + .attr("height", function (d) { + return (node_radius / 0.8); + }) + .attr("node_id", function (d) { + return d.id + networkmap_id; + }) .attr("id", "image2995") .classed('dragable_node', true) //own dragable - .on("mouseover", function(d) { - myMouseoverRhombusFunction(d.id) - }) - .on("mouseout", function(d) { - myMouseoutRhombusFunction(d.id) - }) + .on("mouseover", function (d) { + myMouseoverSquareFunction(d.id) + }) + .on("mouseout", function (d) { + myMouseoutSquareFunction(d.id) + }) .on("click", selected_node) - .on("dblclick", function(d) { - edit_node(d, true); - }) - .on("contextmenu", function(d) { show_menu("node", d);}); - + .on("dblclick", function (d) { + edit_node(d, true); + }) + .on("contextmenu", function (d) { show_menu("node", d); }); + + //Shape rhombus + node_temp.filter(function (d) { + if (d.shape == 'rhombus') { return true; } + else return false; + }) + .append("rect") + .attr("transform", + "") + .attr("width", node_radius * 1.5) + .attr("height", node_radius * 1.5) + .attr("class", "node_shape node_shape_rhombus") + .attr("node_id", function (d) { + return d.id + networkmap_id; + }) + .style("fill", function (d) { + return d.color; + }) + .classed('dragable_node', true) //own dragable + .on("mouseover", function (d) { + myMouseoverRhombusFunction(d.id) + }) + .on("mouseout", function (d) { + myMouseoutRhombusFunction(d.id) + }) + .on("click", selected_node) + .on("dblclick", function (d) { + edit_node(d, true); + }) + .on("contextmenu", function (d) { show_menu("node", d); }); + + node_temp.filter(function (d) { + if (d.shape == 'rhombus') { return true; } + else return false; + }) + .append("image") + .attr("class", "node_image") + .attr("xlink:href", function (d) { + return d.image_url; + }) + .attr("x", function (d) { + return d.x - (d.image_width / 2); + }) + .attr("y", function (d) { + return d.y - (d.image_height / 2); + }) + .attr("width", function (d) { + return (node_radius / 0.8); + }) + .attr("height", function (d) { + return (node_radius / 0.8); + }) + .attr("node_id", function (d) { + return d.id + networkmap_id; + }) + .attr("id", "image2995") + .classed('dragable_node', true) //own dragable + .on("mouseover", function (d) { + myMouseoverRhombusFunction(d.id) + }) + .on("mouseout", function (d) { + myMouseoutRhombusFunction(d.id) + }) + .on("click", selected_node) + .on("dblclick", function (d) { + edit_node(d, true); + }) + .on("contextmenu", function (d) { show_menu("node", d); }); + node_temp.append("title") - .text(function(d) {return d.text; }); - + .text(function (d) { return d.text; }); + var font_size = (node_radius / 1.5); - + node_temp.append("text") .attr("class", "node_text") .attr("id", "node_text_" + networkmap_id) .attr("style", "font-style:normal; font-weight:normal; line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;") - .attr("x", function(d) { - return d.x; - }) - .attr("y", function(d) { - return d.y + node_radius + 12; - }) + .attr("x", function (d) { + return d.x; + }) + .attr("y", function (d) { + return d.y + node_radius + 12; + }) .append("tspan") - .attr("style", "font-size: " + font_size + "px !important; font-family:Verdana; text-align:center; text-anchor:middle; fill:#000000") - .text(function(d) { - return d.text; - }) + .attr("style", "font-size: " + font_size + "px !important; font-family:Verdana; text-align:center; text-anchor:middle; fill:#000000") + .text(function (d) { + return d.text; + }) .classed('dragable_node', true) //own dragable .on("click", selected_node) - .on("contextmenu", function(d) { show_menu("node", d);}); - + .on("contextmenu", function (d) { show_menu("node", d); }); + node.exit().remove(); } function choose_group_for_show_agents() { if (enterprise_installed) { group = $("#group_for_show_agents option:selected").val(); - + $("#agents_filter_group").attr('disabled', true); $("#spinner_group").css('display', ''); if (group == -1) { @@ -3381,26 +3384,26 @@ function choose_group_for_show_agents() { } else { $("#group_for_show_agents").attr('disabled', true); - + var params = []; params.push("get_agents_in_group=1"); params.push("id=" + networkmap_id); params.push("group=" + group); params.push("page=enterprise/operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="ajax.php", + url: action = "ajax.php", success: function (data) { if (data['correct']) { $("#agents_filter_group").html(''); jQuery.each(data['agents'], function (id, name) { - if (typeof(name) == 'undefined') return; - + if (typeof (name) == 'undefined') return; + $("#agents_filter_group").append(''); }); - + $("#agents_filter_group").removeAttr('disabled'); $("#group_for_show_agents").removeAttr('disabled'); $("#spinner_group").css('display', 'none'); @@ -3410,163 +3413,163 @@ function choose_group_for_show_agents() { $("#group_for_show_agents").removeAttr('disabled'); $("#agents_filter_group").html(''); - $("#spinner_group").css('display', 'none');function show_networkmap_node(id_agent_param, refresh_state) { - id_agent = id_agent_param; - - canvas = $("#node_info"); - context_popup = canvas[0].getContext('2d'); - - dirty_popup = true; - self.setInterval("check_popup_modification()", 1000/30); - - $("#node_info").mousemove(function(event) { - var x = event.pageX - $("#node_info").offset().left; - var y = event.pageY - $("#node_info").offset().top; - - module_inner = inner_module(x, y); - - if (module_inner != null) { - document.body.style.cursor = "pointer"; - } - else { - document.body.style.cursor = "default"; - } - }); - - $("#node_info").mousedown(function(event) { - var x = event.pageX - $("#node_info").offset().left; - var y = event.pageY - $("#node_info").offset().top; - - if (module_inner != null) { - show_tooltip(module_inner, x, y); - } - - event.stopPropagation(); - return false; - }); - - $("#node_info").mouseup(function(event) { - var x = event.pageX - $("#node_info").offset().left; - var y = event.pageY - $("#node_info").offset().top; - - drag = false; - drag_x = 0; - drag_y = 0; - dirty_popup = true; - - document.body.style.cursor = "default"; - - module_inner = null; - - event.stopPropagation(); - return false; - }); - - $("#node_info").mouseout(function(event) { - var x = event.pageX - $("#node_info").offset().left; - var y = event.pageY - $("#node_info").offset().top; - - drag = false; - drag_x = 0; - drag_y = 0; - dirty_popup = true; - - document.body.style.cursor = "default"; - - module_inner = null; - - event.stopPropagation(); - return false; - }); - - $(window).resize(function() { - function show_networkmap_node(id_agent_param, refresh_state) { - id_agent = id_agent_param; - - canvas = $("#node_info"); - context_popup = canvas[0].getContext('2d'); - - dirty_popup = true; - self.setInterval("check_popup_modification()", 1000/30); - - $("#node_info").mousemove(function(event) { - var x = event.pageX - $("#node_info").offset().left; - var y = event.pageY - $("#node_info").offset().top; - - module_inner = inner_module(x, y); - - if (module_inner != null) { - document.body.style.cursor = "pointer"; - } - else { - document.body.style.cursor = "default"; - } - }); - - $("#node_info").mousedown(function(event) { - var x = event.pageX - $("#node_info").offset().left; - var y = event.pageY - $("#node_info").offset().top; - - if (module_inner != null) { - show_tooltip(module_inner, x, y); - } - - event.stopPropagation(); - return false; - }); - - $("#node_info").mouseup(function(event) { - var x = event.pageX - $("#node_info").offset().left; - var y = event.pageY - $("#node_info").offset().top; - - drag = false; - drag_x = 0; - drag_y = 0; - dirty_popup = true; - - document.body.style.cursor = "default"; - - module_inner = null; - - event.stopPropagation(); - return false; - }); - - $("#node_info").mouseout(function(event) { - var x = event.pageX - $("#node_info").offset().left; - var y = event.pageY - $("#node_info").offset().top; - - drag = false; - drag_x = 0; - drag_y = 0; - dirty_popup = true; - - document.body.style.cursor = "default"; - - module_inner = null; - - event.stopPropagation(); - return false; - }); - - $(window).resize(function() { - - pos_scroll = Math.floor($("#content_node_info").width() / 2); - - $("#content_node_info").scrollLeft(pos_scroll); - - dirty_popup = true; - check_popup_modification(); - }); - } - pos_scroll = Math.floor($("#content_node_info").width() / 2); - - $("#content_node_info").scrollLeft(pos_scroll); - - dirty_popup = true; - check_popup_modification(); - }); - } + $("#spinner_group").css('display', 'none'); function show_networkmap_node(id_agent_param, refresh_state) { + id_agent = id_agent_param; + + canvas = $("#node_info"); + context_popup = canvas[0].getContext('2d'); + + dirty_popup = true; + self.setInterval("check_popup_modification()", 1000 / 30); + + $("#node_info").mousemove(function (event) { + var x = event.pageX - $("#node_info").offset().left; + var y = event.pageY - $("#node_info").offset().top; + + module_inner = inner_module(x, y); + + if (module_inner != null) { + document.body.style.cursor = "pointer"; + } + else { + document.body.style.cursor = "default"; + } + }); + + $("#node_info").mousedown(function (event) { + var x = event.pageX - $("#node_info").offset().left; + var y = event.pageY - $("#node_info").offset().top; + + if (module_inner != null) { + show_tooltip(module_inner, x, y); + } + + event.stopPropagation(); + return false; + }); + + $("#node_info").mouseup(function (event) { + var x = event.pageX - $("#node_info").offset().left; + var y = event.pageY - $("#node_info").offset().top; + + drag = false; + drag_x = 0; + drag_y = 0; + dirty_popup = true; + + document.body.style.cursor = "default"; + + module_inner = null; + + event.stopPropagation(); + return false; + }); + + $("#node_info").mouseout(function (event) { + var x = event.pageX - $("#node_info").offset().left; + var y = event.pageY - $("#node_info").offset().top; + + drag = false; + drag_x = 0; + drag_y = 0; + dirty_popup = true; + + document.body.style.cursor = "default"; + + module_inner = null; + + event.stopPropagation(); + return false; + }); + + $(window).resize(function () { + function show_networkmap_node(id_agent_param, refresh_state) { + id_agent = id_agent_param; + + canvas = $("#node_info"); + context_popup = canvas[0].getContext('2d'); + + dirty_popup = true; + self.setInterval("check_popup_modification()", 1000 / 30); + + $("#node_info").mousemove(function (event) { + var x = event.pageX - $("#node_info").offset().left; + var y = event.pageY - $("#node_info").offset().top; + + module_inner = inner_module(x, y); + + if (module_inner != null) { + document.body.style.cursor = "pointer"; + } + else { + document.body.style.cursor = "default"; + } + }); + + $("#node_info").mousedown(function (event) { + var x = event.pageX - $("#node_info").offset().left; + var y = event.pageY - $("#node_info").offset().top; + + if (module_inner != null) { + show_tooltip(module_inner, x, y); + } + + event.stopPropagation(); + return false; + }); + + $("#node_info").mouseup(function (event) { + var x = event.pageX - $("#node_info").offset().left; + var y = event.pageY - $("#node_info").offset().top; + + drag = false; + drag_x = 0; + drag_y = 0; + dirty_popup = true; + + document.body.style.cursor = "default"; + + module_inner = null; + + event.stopPropagation(); + return false; + }); + + $("#node_info").mouseout(function (event) { + var x = event.pageX - $("#node_info").offset().left; + var y = event.pageY - $("#node_info").offset().top; + + drag = false; + drag_x = 0; + drag_y = 0; + dirty_popup = true; + + document.body.style.cursor = "default"; + + module_inner = null; + + event.stopPropagation(); + return false; + }); + + $(window).resize(function () { + + pos_scroll = Math.floor($("#content_node_info").width() / 2); + + $("#content_node_info").scrollLeft(pos_scroll); + + dirty_popup = true; + check_popup_modification(); + }); + } + pos_scroll = Math.floor($("#content_node_info").width() / 2); + + $("#content_node_info").scrollLeft(pos_scroll); + + dirty_popup = true; + check_popup_modification(); + }); + } } } }); @@ -3607,11 +3610,11 @@ function get_status_node() { params.push("get_status_node=1"); params.push("id=" + id_agent); params.push("page=operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="../../../ajax.php", + url: action = "../../../ajax.php", success: function (data) { if (data['correct']) { color_status_node = data['status_agent']; @@ -3623,18 +3626,18 @@ function get_status_node() { function get_status_module() { jQuery.each(modules, function (id, module) { - if (typeof(module) == 'undefined') return; - - + if (typeof (module) == 'undefined') return; + + var params = []; params.push("get_status_module=1"); params.push("id=" + id); params.push("page=operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="../../../ajax.php", + url: action = "../../../ajax.php", success: function (data) { if (data['correct']) { modules[data['id']].status_color = data['status_color']; @@ -3642,8 +3645,8 @@ function get_status_module() { } } }); - - + + }); } @@ -3652,11 +3655,11 @@ function check_changes_num_modules() { params.push("check_changes_num_modules=1"); params.push("id=" + id_agent); params.push("page=operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="../../../ajax.php", + url: action = "../../../ajax.php", success: function (data) { if (data['correct']) { if (module_count != data['count']) { @@ -3669,19 +3672,19 @@ function check_changes_num_modules() { function show_networkmap_node(id_agent_param, refresh_state) { id_agent = id_agent_param; - + canvas = $("#node_info"); context_popup = canvas[0].getContext('2d'); - + dirty_popup = true; - self.setInterval("check_popup_modification()", 1000/30); - - $("#node_info").mousemove(function(event) { + self.setInterval("check_popup_modification()", 1000 / 30); + + $("#node_info").mousemove(function (event) { var x = event.pageX - $("#node_info").offset().left; var y = event.pageY - $("#node_info").offset().top; - + module_inner = inner_module(x, y); - + if (module_inner != null) { document.body.style.cursor = "pointer"; } @@ -3689,59 +3692,59 @@ function show_networkmap_node(id_agent_param, refresh_state) { document.body.style.cursor = "default"; } }); - - $("#node_info").mousedown(function(event) { + + $("#node_info").mousedown(function (event) { var x = event.pageX - $("#node_info").offset().left; var y = event.pageY - $("#node_info").offset().top; - + if (module_inner != null) { show_tooltip(module_inner, x, y); } - + event.stopPropagation(); return false; }); - - $("#node_info").mouseup(function(event) { + + $("#node_info").mouseup(function (event) { var x = event.pageX - $("#node_info").offset().left; var y = event.pageY - $("#node_info").offset().top; - + drag = false; drag_x = 0; drag_y = 0; dirty_popup = true; - + document.body.style.cursor = "default"; - + module_inner = null; - + event.stopPropagation(); return false; }); - - $("#node_info").mouseout(function(event) { + + $("#node_info").mouseout(function (event) { var x = event.pageX - $("#node_info").offset().left; var y = event.pageY - $("#node_info").offset().top; - + drag = false; drag_x = 0; drag_y = 0; dirty_popup = true; - + document.body.style.cursor = "default"; - + module_inner = null; - + event.stopPropagation(); return false; }); - - $(window).resize(function() { - + + $(window).resize(function () { + pos_scroll = Math.floor($("#content_node_info").width() / 2); - + $("#content_node_info").scrollLeft(pos_scroll); - + dirty_popup = true; check_popup_modification(); }); @@ -3752,11 +3755,11 @@ function show_tooltip_content(id) { params.push("get_tooltip_content=1"); params.push("id=" + id); params.push("page=operation/agentes/pandora_networkmap.view"); - jQuery.ajax ({ - data: params.join ("&"), + jQuery.ajax({ + data: params.join("&"), dataType: 'json', type: 'POST', - url: action="../../../ajax.php", + url: action = "../../../ajax.php", success: function (data) { if (data['correct']) { $("#tooltip").html(data['content']); @@ -3768,19 +3771,19 @@ function show_tooltip_content(id) { function show_tooltip(id, x, y) { $("#tooltip").css('top', y + 'px'); $("#tooltip").css('left', x + 'px'); - + var params1 = []; params1.push("get_image_path=1"); params1.push("img_src=" + "images/spinner.gif"); params1.push("page=include/ajax/skins.ajax"); - jQuery.ajax ({ - data: params1.join ("&"), + jQuery.ajax({ + data: params1.join("&"), type: 'POST', - url: action="../../../ajax.php", + url: action = "../../../ajax.php", success: function (data) { $("#tooltip").html(data); $("#tooltip").css('display', ''); - + show_tooltip_content(id); } }); @@ -3792,17 +3795,17 @@ function hide_tooltip() { function inner_module(x, y) { var return_var = null; - + jQuery.each(modules, function (key, module) { - if (typeof(module) == 'undefined') return; - + if (typeof (module) == 'undefined') return; + if ((x >= module.pos_x) && (x < (module.pos_x + SIZE_MODULE)) && - (y >= module.pos_y) && (y < (module.pos_y + SIZE_MODULE))) { - - return_var = key; - } + (y >= module.pos_y) && (y < (module.pos_y + SIZE_MODULE))) { + + return_var = key; + } }); - + return return_var; } @@ -3816,7 +3819,7 @@ function check_popup_modification() { function draw_popup() { //Calculate the size count_no_snmp = module_count - count_snmp_modules; - + if (count_no_snmp > count_snmp_modules) { box_height = Math.ceil(count_no_snmp / 2) * VERTICAL_SPACE_MODULES + VERTICAL_SPACING_BETWEEN_MODULES; @@ -3825,43 +3828,43 @@ function draw_popup() { box_height = Math.ceil(count_snmp_modules / 2) * VERTICAL_SPACE_MODULES + VERTICAL_SPACING_BETWEEN_MODULES; } - + //Draw the agent box. // 2 columns of HORIZONTAL_SPACE_MODULES px for each modules // + 15 * 2 half each snmp module box_width = HORIZONTAL_SPACE_MODULES * 2 + SIZE_MODULE; - - + + //Resize the canvas if the box is bigger before of paint. if ((box_height + 50) != $("#node_info").attr("height")) { node_info_height = box_height + 50; $("#node_info").attr("height", node_info_height); //$("#node_info").attr("width", node_info_width); } - + if ((box_width + 400) != $("#node_info").attr("width")) { node_info_width = box_width + 400; $("#node_info").attr("width", node_info_width); } - + //Clean the canvas context_popup.clearRect(0, 0, node_info_width, node_info_height); context_popup.beginPath(); //Erase lines? - - - + + + pos_x = (node_info_width - box_width) / 2 + offset_x; - + context_popup.beginPath(); context_popup.rect(pos_x, VERTICAL_SPACING_BETWEEN_MODULES + offset_y, box_width, box_height); context_popup.fillStyle = "#ccc"; context_popup.fill(); - + //Draw the global status of agent into the box's border color. context_popup.lineWidth = BORDER_SIZE_AGENT_BOX; context_popup.strokeStyle = color_status_node; context_popup.stroke(); - + if (mode_show == 'all') { draw_snmp_modules(); draw_modules(); @@ -3873,15 +3876,15 @@ function draw_popup() { function draw_snmp_modules() { module_pos_y = MARGIN_BETWEEN_AGENT_MODULE; - + count = 0; reset_column = true; - + jQuery.each(modules, function (key, module) { - if (typeof(module) == 'undefined') return; - + if (typeof (module) == 'undefined') return; + if (module.type != 18) return; - + if (count < (count_snmp_modules / 2)) { module_pos_x = pos_x - 15; text_align = 'right'; @@ -3897,7 +3900,7 @@ function draw_snmp_modules() { margin_text = SIZE_MODULE - 5; } count++; - + context_popup.beginPath(); context_popup.rect(module_pos_x, module_pos_y + offset_y, SIZE_MODULE, SIZE_MODULE); @@ -3906,10 +3909,10 @@ function draw_snmp_modules() { context_popup.lineWidth = 1; context_popup.strokeStyle = "#000"; context_popup.stroke(); - + modules[key].pos_x = module_pos_x; modules[key].pos_y = module_pos_y + offset_y; - + context_popup.fillStyle = "rgb(0,0,0)"; context_popup.font = 'bold 10px sans-serif'; context_popup.textBaseline = 'middle'; @@ -3918,22 +3921,22 @@ function draw_snmp_modules() { text_pos_x = module_pos_x + margin_text; text_pos_y = module_pos_y + 40 + offset_y; context_popup.fillText(module.text, text_pos_x, text_pos_y); - + module_pos_y = module_pos_y + VERTICAL_SPACE_MODULES; }); } function draw_modules() { module_pos_y = MARGIN_BETWEEN_AGENT_MODULE; - + count = 0; reset_column = true; - + jQuery.each(modules, function (key, module) { - if (typeof(module) == 'undefined') return; - + if (typeof (module) == 'undefined') return; + if (module.type == 18) return; - + if (count < (count_no_snmp / 2)) { module_pos_x = pos_x + (HORIZONTAL_SPACE_MODULES - SIZE_MODULE) / 2; text_pos_x = pos_x + (HORIZONTAL_SPACE_MODULES / 2); @@ -3943,13 +3946,13 @@ function draw_modules() { module_pos_y = MARGIN_BETWEEN_AGENT_MODULE; reset_column = false; } - module_pos_x = pos_x + (box_width - HORIZONTAL_SPACE_MODULES) + module_pos_x = pos_x + (box_width - HORIZONTAL_SPACE_MODULES) + (HORIZONTAL_SPACE_MODULES - SIZE_MODULE) / 2; - text_pos_x = pos_x + (box_width - HORIZONTAL_SPACE_MODULES) + + text_pos_x = pos_x + (box_width - HORIZONTAL_SPACE_MODULES) + (HORIZONTAL_SPACE_MODULES / 2) } count++; - + context_popup.beginPath(); center_orig_x = module_pos_x + (SIZE_MODULE / 2); center_orig_y = module_pos_y + offset_y + (SIZE_MODULE / 2); @@ -3961,23 +3964,23 @@ function draw_modules() { context_popup.lineWidth = 1; context_popup.strokeStyle = "#000"; context_popup.stroke(); - - + + modules[key].pos_x = module_pos_x; modules[key].pos_y = module_pos_y + offset_y; - + context_popup.fillStyle = "rgb(0,0,0)"; context_popup.font = 'bold 10px sans-serif'; context_popup.textBaseline = 'middle'; context_popup.textAlign = 'center'; dimensions = context_popup.measureText(module.short_text); - + text_pos_y = module_pos_y + 40 + offset_y; context_popup.fillText(module.short_text, text_pos_x, text_pos_y); - + module_pos_y = module_pos_y + VERTICAL_SPACE_MODULES; }); - + paint_tooltip_module_one_time = false; } @@ -3987,8 +3990,8 @@ function update_fictional_node_popup(id) { networmap = $("#networmaps_enterprise option:selected").val(); radious = $("#fictional_radious").val(); color = $("#fictional_color").val(); - + window.close(); - + window.opener.update_fictional_node(id, name, shape, networmap, radious, color); } diff --git a/pandora_console/operation/agentes/pandora_networkmap.php b/pandora_console/operation/agentes/pandora_networkmap.php index 2c1bd6f29c..9e44b92338 100644 --- a/pandora_console/operation/agentes/pandora_networkmap.php +++ b/pandora_console/operation/agentes/pandora_networkmap.php @@ -495,7 +495,12 @@ switch ($tab) { $count = 0; if (($count == 0) && ($network_map['source'] != 'empty')) { - $data['nodes'] = __('Pending to generate'); + if (enterprise_installed() && ($network_map['generated'])) { + $data['nodes'] = __('Empty map'); + } + else { + $data['nodes'] = __('Pending to generate'); + } } else { $data['nodes'] = $count - 1; //PandoraFMS node is not an agent