New networkmaps in progress... (Added new level of zoom to hight number of nodes visualization)
This commit is contained in:
Arturo Gonzalez
parent
44f42025d2
commit
b3ffb01b85
|
|
@ -828,155 +828,6 @@ function networkmap_loadfile($id = 0, $file = '',
|
|||
return $networkmap_nodes;
|
||||
}
|
||||
|
||||
function show_node_info($id_node, $refresh_state, $user_readonly, $id_agent) {
|
||||
global $config;
|
||||
|
||||
echo "<script type='text/javascript' src='../../include/javascript/functions_pandora_networkmap.js'></script>";
|
||||
|
||||
if (enterprise_installed()) {
|
||||
$row = get_node_from_db($id_node);
|
||||
}
|
||||
else {
|
||||
$row['source_data'] = $id_agent;
|
||||
}
|
||||
|
||||
$style = json_decode($row['style'], true);
|
||||
|
||||
if (($row['source_data']) == -2 && (enterprise_installed())) {
|
||||
//Show the dialog to edit the fictional point.
|
||||
if ($user_readonly) {
|
||||
require ($config["homedir"]."/general/noaccess.php");
|
||||
return;
|
||||
}
|
||||
else {
|
||||
$networkmaps = get_networkmaps($row['id_map']);
|
||||
|
||||
$selectNetworkmaps = html_print_select($networkmaps,
|
||||
'networmaps_enterprise', $style['networkmap'], '', '', 0, true);
|
||||
|
||||
$shapes = array(
|
||||
'circle' => __('Circle'),
|
||||
'square' => __('Square'),
|
||||
'rhombus' => __('Rhombus'));
|
||||
|
||||
$mini_form_fictional_point = "<table cellpadding='2'>
|
||||
<tr>" .
|
||||
"<td>" . __('Name') ."<td>". html_print_input_text('fictional_name', $style['label'], '', 25, 255, true) .
|
||||
'<td>' .__('Shape') . "<td>". html_print_select($shapes, 'fictional_shape', 0, '', '', 0, true) . "</td></tr><tr><td>".
|
||||
__('Radius') . "<td>". '<input type="text" size="3" maxlength="3" value="' . ($style['width'] / 2) . '" id="fictional_radious" />' . "<td>" .
|
||||
__('Color') . "<td>" .
|
||||
'<input type="text" size="7" value="' . $style['color'] . '" id="fictional_color" class="fictional_color"/> <tr />'
|
||||
."<tr><td>".__("Network map linked"). "<td>".$selectNetworkmaps.
|
||||
"<td align=right>". html_print_button(__('Update'), 'update_fictional', false, 'update_fictional_node_popup(' . $id_node . ');', 'class="sub next"', true) . "</tr></table>";
|
||||
|
||||
echo $mini_form_fictional_point;
|
||||
|
||||
|
||||
echo '
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function () {
|
||||
$(".fictional_color").attachColorPicker();
|
||||
});
|
||||
</script>';
|
||||
|
||||
return;
|
||||
}
|
||||
}
|
||||
else {
|
||||
//Show the view of node.
|
||||
$url_agent = ui_get_full_url(false);
|
||||
$url_agent .= 'index.php?' .
|
||||
'sec=estado&' .
|
||||
'sec2=operation/agentes/ver_agente&' .
|
||||
'id_agente=' . $row['source_data'];
|
||||
|
||||
$modules = agents_get_modules($row['source_data'],
|
||||
array('nombre', 'id_tipo_modulo'), array('disabled' => 0),
|
||||
true, false);
|
||||
if ($modules == false) {
|
||||
$modules = array();
|
||||
}
|
||||
$count_module = count($modules);
|
||||
|
||||
$snmp_modules = agents_get_modules($row['source_data'],
|
||||
array('nombre', 'id_tipo_modulo'),
|
||||
array('id_tipo_modulo' => 18, 'disabled' => 0), true, false);
|
||||
$count_snmp_modules = count($snmp_modules);
|
||||
|
||||
echo "<script type='text/javascript'>";
|
||||
echo "var node_info_height = 0;";
|
||||
echo "var node_info_width = 0;";
|
||||
echo "var count_snmp_modules = " . $count_snmp_modules . ";";
|
||||
echo "var module_count = " . $count_module . ";";
|
||||
echo "var modules = [];";
|
||||
foreach ($modules as $id_agent_module => $module) {
|
||||
$text = io_safe_output($module['nombre']);
|
||||
$sort_text = ui_print_truncate_text($text, 'module_small', false, true, false, '...');
|
||||
//$text = $sort_text;
|
||||
|
||||
$color_status = get_status_color_module_networkmap($id_agent_module);
|
||||
|
||||
echo "modules[" . $id_agent_module . "] = {
|
||||
'pos_x': null,
|
||||
'pos_y': null ,
|
||||
'text': '" . $text . "',
|
||||
'short_text': '" . $sort_text . "',
|
||||
'type': " . $module['id_tipo_modulo'] . ",
|
||||
'status_color': '" . $color_status . "'
|
||||
};";
|
||||
}
|
||||
|
||||
echo "var color_status_node = '" . get_status_color_networkmap($row['source_data']) . "';";
|
||||
echo "</script>";
|
||||
|
||||
$mode_show = get_parameter('mode_show', 'all');
|
||||
echo "<script type='text/javascript'>
|
||||
var mode_show = '$mode_show';
|
||||
</script>";
|
||||
|
||||
echo '<div style="text-align: center;">';
|
||||
echo '<b><a target="_blank" style="text-decoration: none;" href="' . $url_agent . '">' . agents_get_name($row['source_data']) . '</a></b><br />';
|
||||
$modes_show = array('status_module' => 'Only status', 'all' => 'All');
|
||||
echo __('Show modules:');
|
||||
html_print_select($modes_show, 'modes_show', $mode_show, 'refresh_window();');
|
||||
echo " ";
|
||||
html_print_button('Refresh', 'refresh_button', false, 'refresh_window();',
|
||||
'style="padding-left: 10px; padding-right: 10px;"');
|
||||
echo '</div>';
|
||||
echo '<div id="content_node_info" style="width: 100%; height: 90%;
|
||||
overflow: auto; text-align: center;">
|
||||
<canvas id="node_info" style="background: #fff;">
|
||||
Use a browser that support HTML5.
|
||||
</canvas>';
|
||||
|
||||
echo '
|
||||
<script type="text/javascript">
|
||||
function refresh_window() {
|
||||
url = location.href
|
||||
|
||||
mode = $("#modes_show option:selected").val();
|
||||
|
||||
url = url + "&mode_show=" + mode;
|
||||
|
||||
window.location.replace(url);
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
node_info_height = $("#content_node_info").height();
|
||||
node_info_width = $("#content_node_info").width();
|
||||
|
||||
//Set the first size for the canvas
|
||||
//$("#node_info").attr("height", $(window).height());
|
||||
//$("#node_info").attr("width", $(window).width());
|
||||
show_networkmap_node(' . $row['source_data'] . ', ' . $refresh_state . ');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
';
|
||||
echo "<div id='tooltip' style='border: 1px solid black; background: white; position: absolute; display:none;'></div>";
|
||||
}
|
||||
}
|
||||
|
||||
function get_status_color_module_networkmap($id_agente_modulo) {
|
||||
$status = modules_get_agentmodule_status($id_agente_modulo);
|
||||
|
||||
|
|
|
|||
|
|
@ -1962,6 +1962,9 @@ function init_graph(parameter_object) {
|
|||
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() {
|
||||
|
|
@ -1987,7 +1990,7 @@ function init_graph(parameter_object) {
|
|||
.size([width_svg, height_svg]);
|
||||
|
||||
window.zoom_obj = d3.behavior.zoom();
|
||||
zoom_obj.scaleExtent([0.3, 1])
|
||||
zoom_obj.scaleExtent([0.05, 1])
|
||||
.on("zoom", zoom)
|
||||
.translate(translation)
|
||||
.scale(scale);
|
||||
|
|
@ -2171,8 +2174,8 @@ function init_graph(parameter_object) {
|
|||
.attr("id", "background_size_networkmap")
|
||||
.attr("width", networkmap_dimensions[0] + node_radius)
|
||||
.attr("height", networkmap_dimensions[1] + node_radius)
|
||||
.attr("x", 0)
|
||||
.attr("y", 0)
|
||||
.attr("x", rect_center_x - (networkmap_dimensions[0] / 2))
|
||||
.attr("y", rect_center_y - (networkmap_dimensions[1] / 2))
|
||||
.attr("style", "fill: url(#background_grid); " +
|
||||
"stroke: #960000; " +
|
||||
"stroke-width: 2; " +
|
||||
|
|
|
|||
Loading…
Reference in New Issue