Highlight Nodes on Network map (#10943)

* mark nodes on map

* better variable naming

* change variable getter

* change form header

* replace key mark with highlight

* GET Parameter to highlight node

includes/html/print-map.inc.php

@@ -14,6 +14,8 @@
 
 use LibreNMS\Config;
 
+$highlight_node = $vars['highlight_node'] | 0;
+
 //Don't know where this should come from, but it is used later, so I just define it here.
 $row_colour="#ffffff";
 
@@ -168,6 +170,15 @@ $node_down_style = array(
         'background' => Config::get('network_map_legend.dn.node'),
     ),
 );
+$node_highlight_style = array(
+    'color' => array(
+        'highlight' => array(
+            'border' => Config::get('network_map_legend.highlight.border'),
+        ),
+        'border' => Config::get('network_map_legend.highlight.border'),
+    ),
+    'borderWidth' => Config::get('network_map_legend.highlight.borderWidth'),
+);
 $edge_disabled_style = array(
     'dashes' => array(8,12),
     'color' => array(
@@ -229,6 +240,10 @@ foreach ($list as $items) {
         } elseif ($items['local_status'] == '0') {
             $devices_by_id[$local_device_id] = array_merge($devices_by_id[$local_device_id], $node_down_style);
         }
+
+        if ((empty($device['hostname'])) && ($local_device_id == $highlight_node)) {
+            $devices_by_id[$local_device_id] = array_merge($devices_by_id[$local_device_id], $node_highlight_style);
+        }
     }
 
     $remote_device_id = $items['remote_device_id'];
@@ -240,6 +255,10 @@ foreach ($list as $items) {
         } elseif ($items['remote_status'] == '0') {
             $devices_by_id[$remote_device_id] = array_merge($devices_by_id[$remote_device_id], $node_down_style);
         }
+
+        if ((empty($device['hostname'])) && ($remote_device_id == $highlight_node)) {
+            $devices_by_id[$remote_device_id] = array_merge($devices_by_id[$remote_device_id], $node_highlight_style);
+        }
     }
 
     $speed = $items['local_ifspeed']/1000/1000;
@@ -316,10 +335,24 @@ foreach ($list as $items) {
 $nodes = json_encode(array_values($devices_by_id));
 $edges = json_encode($links);
 
+array_multisort(array_column($devices_by_id, 'label'), SORT_ASC, $devices_by_id);
+
 if (count($devices_by_id) > 1 && count($links) > 0) {
 ?>
 
+<form name="printmapform" method="get" action="" class="form-horizontal" role="form">
+<?php if (empty($device['hostname'])) { ?>
+<div class="pull-right">
+<select name="highlight_node" id="highlight_node" class="input-sm" onChange="highlightNode()";>
+<option value="0">None</option>
+<?php foreach ($devices_by_id as $dev) { ?>
+<option value="<?=$dev['id']?>"><?=$dev['label']?></option>
+<?php } ?>
+</select>
+</div>
+<?php } ?>
 <div id="visualization"></div>
+</form>
 <script src="js/vis.min.js"></script>
 <script type="text/javascript">
 var height = $(window).height() - 100;
@@ -352,6 +385,13 @@ var network = new vis.Network(container, data, options);
             window.location.href = "device/device="+properties.nodes+"/tab=neighbours/selection=map/"
         }
     });
+
+function highlightNode(e) {
+    highlight_node = document.getElementById("highlight_node").value;
+    window.location.pathname = 'map/highlight_node=' + highlight_node;
+}
+
+$('#highlight_node option[value="<?=$highlight_node?>"]').prop('selected', true);
 </script>
 
 <?php

misc/config_definitions.json

@@ -3314,6 +3314,10 @@
                     "border": "#ff5555",
                     "edge": "#ff777788",
                     "node": "#ffdddd"
+                },
+                "highlight": {
+                    "border": "#ee4000",
+                    "borderWidth": 3
                 }
             },
             "type": "array"