Merge pull request #681 from laf/issue-581-web

New maps code

html/css/styles.css

@@ -1609,3 +1609,8 @@ tr.search:nth-child(odd) {
   padding-left: 15px !important;
   padding-top: 8px !important;
 }
+
+#visualization {
+    width: 90%;
+    height: 600px;
+}

html/css/vis.min.css

@@ -0,0 +1 @@
+../../lib/vis/dist/vis.min.css

html/includes/print-map.inc.php

@@ -0,0 +1,116 @@
+<?php
+
+/*
+ * LibreNMS
+ *
+ * Copyright (c) 2014 Neil Lathwood <https://github.com/laf/ http://www.lathwood.co.uk/fa>
+ *
+ * This program is free software: you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the
+ * Free Software Foundation, either version 3 of the License, or (at your
+ * option) any later version.  Please see LICENSE.txt at the top level of
+ * the source code distribution for details.
+ */
+
+$tmp_devices = array();
+if (!empty($device['hostname'])) {
+    $sql = ' WHERE `devices`.`hostname`=?';
+    $sql_array = array($device['hostname']);
+} else {
+    $sql = ' WHERE 1';
+}
+
+$sql .= ' AND `local_device_id` != 0 AND `remote_device_id` != 0';
+
+$tmp_ids = array();
+foreach (dbFetchRows("SELECT DISTINCT least(`devices`.`device_id`, `remote_device_id`) AS `remote_device_id`, GREATEST(`remote_device_id`,`devices`.`device_id`) AS `local_device_id` FROM `links` LEFT JOIN `ports` ON `local_port_id`=`ports`.`port_id` LEFT JOIN `devices` ON `ports`.`device_id`=`devices`.`device_id` $sql", $sql_array) as $link_devices) {
+    if (!in_array($link_devices['local_device_id'], $tmp_ids)) {
+        $link_dev = dbFetchRow("SELECT `hostname`,`location` FROM `devices` WHERE `device_id`=?",array($link_devices['local_device_id']));
+        $tmp_devices[] = array('id'=>$link_devices['local_device_id'],'label'=>$link_dev['hostname'],'title'=>$link_dev['hostname'],'group'=>$link_dev['location']);
+    }
+    if (!in_array($link_devices['remote_device_id'], $tmp_ids)) {
+        $link_dev = dbFetchRow("SELECT `hostname`,`location` FROM `devices` WHERE `device_id`=?",array($link_devices['remote_device_id']));
+        $tmp_devices[] = array('id'=>$link_devices['remote_device_id'],'label'=>$link_dev['hostname'],'title'=>$link_dev['hostname'],'group'=>$link_dev['location']);
+    }
+    array_push($tmp_ids,$link_devices['local_device_id']);
+    array_push($tmp_ids,$link_devices['remote_device_id']);
+}
+
+$tmp_ids = implode(',',$tmp_ids);
+ 
+$nodes = json_encode($tmp_devices);
+ 
+if (is_array($tmp_devices[0])) {
+    $tmp_links = array();
+    foreach (dbFetchRows("SELECT `devices`.`hostname` AS `hostname`, `remote_hostname`,`ports`.`ifName` AS `local_port`, `remote_port`,`ports`.`ifSpeed` AS ifSpeed FROM `links` LEFT JOIN `ports` ON `local_port_id`=`ports`.`port_id` LEFT JOIN `devices` ON `ports`.`device_id`=`devices`.`device_id` WHERE (`local_device_id` IN ($tmp_ids) AND `remote_device_id` IN ($tmp_ids))") as $link_devices) {
+        foreach ($tmp_devices as $k=>$v) {
+            if ($v['label'] == $link_devices['hostname']) {
+                $from = $v['id'];
+                $port = $link_devices['local_port'];
+            }
+            if ($v['label'] == $link_devices['remote_hostname']) {
+                $to = $v['id'];
+                $port .= ' > ' .$link_devices['remote_port'];
+            }
+        }
+        $speed = $link_devices['ifSpeed']/1000/1000;
+        if ($speed == 100) {
+            $width = 3;
+        } elseif ($speed == 1000) {
+            $width = 5;
+        } elseif ($speed == 10000) {
+            $width = 10;
+        } elseif ($speed == 40000) {
+            $width = 15;
+        } elseif ($speed == 100000) {
+            $width = 20;
+        } else {
+            $width = 1;
+        }
+        $tmp_links[] = array('from'=>$from,'to'=>$to,'label'=>$port,'title'=>$port,'width'=>$width);
+    }
+ 
+    $edges = json_encode($tmp_links);
+ 
+?>
+ 
+<div id="visualization"></div>
+<script type="text/javascript">
+
+    // create an array with nodes
+    var nodes =
+<?php
+echo $nodes;
+?>
+    ;
+ 
+    // create an array with edges
+    var edges =
+<?php
+echo $edges;
+?>
+    ;
+ 
+    // create a network
+    var container = document.getElementById('visualization');
+    var data = {
+            nodes: nodes,
+        edges: edges,
+        stabilize: true
+    };
+    var options = {physics: {barnesHut: {gravitationalConstant: -11900, centralGravity: 1.4, springLength: 203, springConstant: 0.05, damping: 0.3}}, smoothCurves: false};
+    var network = new vis.Network(container, data, options);
+    network.on("resize", function(params) {console.log(params.width,params.height)});
+    network.on('click', function (properties) {
+        if (properties.nodes > 0) {
+            window.location.href = "/device/device="+properties.nodes+"/tab=map/"
+        }
+    });
+</script>
+
+<?php
+
+}
+
+$pagetitle[] = "Map";
+?>

html/includes/print-menubar.php

@@ -5,6 +5,12 @@
 $service_alerts = dbFetchCell("SELECT COUNT(service_id) FROM services WHERE service_status = '0'");
 $if_alerts      = dbFetchCell("SELECT COUNT(port_id) FROM `ports` WHERE `ifOperStatus` = 'down' AND `ifAdminStatus` = 'up' AND `ignore` = '0'");
 
+if ($_SESSION['userlevel'] >= 5) {
+    $links['count']        = dbFetchCell("SELECT COUNT(*) FROM `links`");
+} else {
+	$links['count']       = dbFetchCell("SELECT COUNT(*) FROM `links` AS `L`, `devices` AS `D`, `devices_perms` AS `P` WHERE `P`.`user_id` = ? AND `P`.`device_id` = `D`.`device_id` AND `L`.`local_device_id` = `D`.`device_id`", array($_SESSION['user_id']));
+}
+
 if (isset($config['enable_bgp']) && $config['enable_bgp'])
 {
   $bgp_alerts = dbFetchCell("SELECT COUNT(bgpPeer_id) FROM bgpPeers AS B where (bgpPeerAdminStatus = 'start' OR bgpPeerAdminStatus = 'running') AND bgpPeerState != 'established'");
@@ -118,6 +124,16 @@ if ($config['show_locations'])
             <li><a href="addhost/"><img src="images/16/server_add.png" border="0" align="absmiddle" /> Add Device</a></li>
             <li><a href="delhost/"><img src="images/16/server_delete.png" border="0" align="absmiddle" /> Delete Device</a></li>');
 }
+
+if ($links['count'] > 0) {
+
+?>
+              <li role="presentation" class="divider"></li>
+              <li><a href="map/"><img src="images/16/chart_organisation.png" border="0" alt="Network Map" width="16" height="16" /> Network Map</a></li>
+<?php
+
+}
+
 ?>
 
           </ul>

html/index.php

@@ -167,6 +167,7 @@ if (empty($config['favicon'])) {
   <link href="css/jquery.bootgrid.min.css" rel="stylesheet" type="text/css" />
   <link href="css/tagmanager.css" rel="stylesheet" type="text/css" />
   <link href="css/mktree.css" rel="stylesheet" type="text/css" />
+  <link href="css/vis.min.css" rel="stylesheet" type="text/css" />
   <link href="<?php echo($config['stylesheet']);  ?>" rel="stylesheet" type="text/css" />
   <script src="js/jquery.min.js"></script>
   <script src="js/bootstrap.min.js"></script>

html/js/vis.min.js

@@ -0,0 +1 @@
+../../lib/vis/dist/vis.min.js

html/map.php

@@ -1,249 +0,0 @@
-<?php
-
-/**
- * Observium
- *
- *   This file is part of Observium.
- *
- * @package    observium
- * @subpackage map
- * @author     Adam Armstrong <adama@memetic.org>
- * @copyright  (C) 2006 - 2012 Adam Armstrong
- *
- */
-
-ini_set('display_errors', 1);
-ini_set('display_startup_errors', 1);
-ini_set('log_errors', 1);
-ini_set('error_reporting', E_ALL);
-
-$links = 1;
-
-include_once("../includes/defaults.inc.php");
-include_once("../config.php");
-include_once("../includes/definitions.inc.php");
-include_once("../includes/functions.php");
-include_once("../includes/dbFacile.php");
-include_once("includes/functions.inc.php");
-include_once("includes/authenticate.inc.php");
-
-if (strpos($_SERVER['REQUEST_URI'], "anon")) { $anon = 1; }
-
-if (is_array($config['branding']))
-{
-  if ($config['branding'][$_SERVER['SERVER_NAME']])
-  {
-    foreach ($config['branding'][$_SERVER['SERVER_NAME']] as $confitem => $confval)
-    {
-      eval("\$config['" . $confitem . "'] = \$confval;");
-    }
-  } else {
-    foreach ($config['branding']['default'] as $confitem => $confval)
-    {
-      eval("\$config['" . $confitem . "'] = \$confval;");
-    }
-  }
-}
-
-if (isset($_GET['device'])) { $where = "WHERE device_id = ".mres($_GET['device']); } else { $where = ""; }
-
-// FIXME this shit probably needs tidied up.
-
-if (isset($_GET['format']) && preg_match("/^[a-z]*$/", $_GET['format']))
-{
-  $map = 'digraph G { bgcolor=transparent; splines=true; overlap=scale; concentrate=0; epsilon=0.001; rankdir=LR;
-     node [ fontname="helvetica", fontstyle=bold, style=filled, color=white, fillcolor=lightgrey, overlap=false];
-     edge [ bgcolor=white, fontname="helvetica", fontstyle=bold, arrowhead=dot, arrowtail=dot];
-     graph [bgcolor=transparent];
-
-';
-
-  if (!$_SESSION['authenticated'])
-  {
-    $map .= "\"Not authenticated\" [fontsize=20 fillcolor=\"lightblue\", URL=\"/\" shape=box3d]\n";
-  }
-  else
-  {
-    $loc_count = 1;
-
-    foreach (dbFetch("SELECT * from devices ".$where) as $device)
-    {
-      if ($device)
-      {
-        $links = dbFetch("SELECT * from ports AS I, links AS L WHERE I.device_id = ? AND L.local_port_id = I.port_id ORDER BY L.remote_hostname", array($device['device_id']));
-        if (count($links))
-        {
-          if ($anon) { $device['hostname'] = md5($device['hostname']); }
-          if (!isset($locations[$device['location']])) { $locations[$device['location']] = $loc_count; $loc_count++; }
-          $loc_id = $locations[$device['location']];
-
-          $map .= "\"".$device['hostname']."\" [fontsize=20, fillcolor=\"lightblue\", group=".$loc_id." URL=\"{$config['base_url']}/device/device=".$device['device_id']."/tab=map/\" shape=box3d]\n";
-        }
-
-        foreach  ($links as $link)
-        {
-          $local_port_id = $link['local_port_id'];
-          $remote_port_id = $link['remote_port_id'];
-
-          $i = 0; $done = 0;
-          if ($linkdone[$remote_port_id][$local_port_id]) { $done = 1; }
-
-          if (!$done)
-          {
-            $linkdone[$local_port_id][$remote_port_id] = TRUE;
-
-            $links++;
-
-            if ($link['ifSpeed'] >= "10000000000")
-            {
-              $info = "color=red3 style=\"setlinewidth(6)\"";
-            } elseif ($link['ifSpeed'] >= "1000000000") {
-              $info = "color=lightblue style=\"setlinewidth(4)\"";
-            } elseif ($link['ifSpeed'] >= "100000000") {
-              $info = "color=lightgrey style=\"setlinewidth(2)\"";
-            } elseif ($link['ifSpeed'] >= "10000000") {
-              $info = "style=\"setlinewidth(1)\"";
-            } else {
-              $info = "style=\"setlinewidth(1)\"";
-            }
-
-            $src = $device['hostname'];
-            if ($anon) { $src = md5($src); }
-            if ($remote_port_id)
-            {
-              $dst = dbFetchCell("SELECT `hostname` FROM `devices` AS D, `ports` AS I WHERE I.port_id = ? AND D.device_id = I.device_id", array($remote_port_id));
-              $dst_host = dbFetchCell("SELECT D.device_id FROM `devices` AS D, `ports` AS I WHERE I.port_id = ?  AND D.device_id = I.device_id", array($remote_port_id));
-            } else {
-              unset($dst_host);
-              $dst = $link['remote_hostname'];
-            }
-
-            if ($anon) { $dst = md5($dst); $src = md5($src);}
-
-            $sif = ifNameDescr(dbFetchRow("SELECT * FROM ports WHERE `port_id` = ?", array($link['local_port_id'])),$device);
-            if ($remote_port_id)
-            {
-              $dif = ifNameDescr(dbFetchRow("SELECT * FROM ports WHERE `port_id` = ?", array($link['remote_port_id'])));
-            } else {
-              $dif['label'] = $link['remote_port'];
-              $dif['port_id'] = $link['remote_hostname'] . '/' . $link['remote_port'];
-            }
-
-            if ($where == "")
-            {
-              if (!$ifdone[$dst][$dif['port_id']] && !$ifdone[$src][$sif['port_id']])
-              {
-                $map .= "\"$src\" -> \"" . $dst . "\" [weight=500000, arrowsize=0, len=0];\n";
-              }
-              $ifdone[$src][$sif['port_id']] = 1;
-            } else {
-              $map .= "\"" . $sif['port_id'] . "\" [label=\"" . $sif['label'] . "\", fontsize=12, fillcolor=lightblue, URL=\"{$config['base_url']}/device/device=".$device['device_id']."/tab=port/port=$local_port_id/\"]\n";
-              if (!$ifdone[$src][$sif['port_id']])
-              {
-                $map .= "\"$src\" -> \"" . $sif['port_id'] . "\" [weight=500000, arrowsize=0, len=0];\n";
-                $ifdone[$src][$sif['port_id']] = 1;
-              }
-
-              if ($dst_host)
-              {
-                $map .= "\"$dst\" [URL=\"{$config['base_url']}/device/device=$dst_host/tab=map/\", fontsize=20, shape=box3d]\n";
-              } else {
-                $map .= "\"$dst\" [ fontsize=20 shape=box3d]\n";
-              }
-
-              if ($dst_host == $device['device_id'] || $where == '')
-              {
-                $map .= "\"" . $dif['port_id'] . "\" [label=\"" . $dif['label'] . "\", fontsize=12, fillcolor=lightblue, URL=\"{$config['base_url']}/device/device=$dst_host/tab=port/port=$remote_port_id/\"]\n";
-              } else {
-                $map .= "\"" . $dif['port_id'] . "\" [label=\"" . $dif['label'] . " \", fontsize=12, fillcolor=lightgray";
-                if ($dst_host)
-                {
-                  $map .= ", URL=\"{$config['base_url']}/device/device=$dst_host/tab=port/port=$remote_port_id/\"";
-                }
-                $map .= "]\n";
-              }
-
-              if (!$ifdone[$dst][$dif['port_id']])
-              {
-                $map .= "\"" . $dif['port_id'] . "\" -> \"$dst\" [weight=500000, arrowsize=0, len=0];\n";
-                $ifdone[$dst][$dif['port_id']] = 1;
-              }
-              $map .= "\"" . $sif['port_id'] . "\" -> \"" . $dif['port_id'] . "\" [weight=1, arrowhead=normal, arrowtail=normal, len=2, $info] \n";
-            }
-          }
-        }
-        $done = 0;
-      }
-    }
-  }
-
-  $map .= "\n};";
-
-  if ($_GET['debug'] == 1)
-  {
-    echo("<pre>$map</pre>");exit();
-  }
-
-  switch ($_GET['format'])
-  {
-    case 'svg':
-      break;
-    case 'png':
-      $_GET['format'] = 'png:gd';
-      break;
-    case 'dot':
-      echo($map);exit();
-    default:
-      $_GET['format'] = 'png:gd';
-  }
-
-  if ($links > 30) // Unflatten if there are more than 10 links. beyond that it gets messy
-  {
-    $maptool = $config['dot'];
-  } else {
-    $maptool = $config['dot'];
-  }
-
-  if ($where == '')
-  {
-#    $maptool = $config['unflatten'] . ' -f -l 5 | ' . $config['sfdp'] . ' -Gpack -Goverlap=prism -Gcharset=latin1 | dot';
-     $maptool = $config['sfdp'] . ' -Gpack -Goverlap=prism -Gcharset=latin1 -Gsize=20,20';
-     $maptool = $config['dot'];
-  }
-
-  $descriptorspec = array(0 => array("pipe", "r"),1 => array("pipe", "w") );
-
-  $mapfile = $config['temp_dir'] . "/"  . strgen() . ".png";
-
-  $process = proc_open($maptool.' -T'.$_GET['format'],$descriptorspec,$pipes);
-
-  if (is_resource($process))
-  {
-    fwrite($pipes[0],  "$map");
-    fclose($pipes[0]);
-    while (! feof($pipes[1])) {$img .= fgets($pipes[1]);}
-    fclose($pipes[1]);
-    $return_value = proc_close($process);
-  }
-
-  if ($_GET['format'] == "png:gd")
-  {
-    header("Content-type: image/png");
-  } elseif ($_GET['format'] == "svg") {
-    header("Content-type: image/svg+xml");
-    $img = str_replace("<a ", '<a target="_parent" ', $img);
-  }
-  echo("$img");
-}
-else
-{
-  if ($_SESSION['authenticated']) // FIXME level 10 only?
-  {
-    echo('<center>
-    <object width=1200 height=1000 data="'. $config['base_url'] . '/map.php?format=svg" type="image/svg+xml">
-    </object>
-</center>');
-  }
-}
-
-?>

html/pages/device/map.inc.php

@@ -1,8 +1,19 @@
-<center style="height:100%">
-    <object data="map.php?device=<?php echo($device['device_id']); ?>&format=svg" type="image/svg+xml" style="width: 100%; height:100%">
-    </object>
-</center>
-
 <?php
+
+/*
+ * LibreNMS
+ *
+ * Copyright (c) 2014 Neil Lathwood <https://github.com/laf/ http://www.lathwood.co.uk/fa>
+ *
+ * This program is free software: you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the
+ * Free Software Foundation, either version 3 of the License, or (at your
+ * option) any later version.  Please see LICENSE.txt at the top level of
+ * the source code distribution for details.
+ */
+
 $pagetitle[] = "Map";
-?>
+
+require_once "includes/print-map.inc.php";
+
+?>

html/pages/map.inc.php

@@ -0,0 +1,15 @@
+<?php
+/*
+ * LibreNMS
+ *
+ * Copyright (c) 2014 Neil Lathwood <https://github.com/laf/ http://www.lathwood.co.uk/fa>
+ *
+ * This program is free software: you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the
+ * Free Software Foundation, either version 3 of the License, or (at your
+ * option) any later version.  Please see LICENSE.txt at the top level of
+ * the source code distribution for details.
+ */
+$pagetitle[] = "Map";
+require_once "includes/print-map.inc.php";
+?>