v0.4.6

color the edges

README.md

@@ -42,7 +42,7 @@ PLUGINS_CONFIG = {
 | device_img      | 'access-switch,core-switch,firewall,router,distribution-switch,backup,storage,wan-network,wireless-ap,server,internal-switch,isp-cpe-material,non-racked-devices,power-units' | The slug of the device roles that you have a image for. |
 | preselected_device_roles      | 'Firewall,Router,Distribution Switch,Core Switch,Internal Switch,Access Switch,Server,Storage,Backup,Wireless AP' | The full name of the device roles you want to pre select in the global view.  Note that this is case sensitive|
 | allow_coordinates_saving      | False | (bool) Set to true if you use the custom coordinates fields and want to save the coordinates |
-| ignore_cable_type      | 'poweroutlet,powerport' | The cable types that you want to ignore in the views  |
+| ignore_cable_type      | 'power outlet,power port' | The cable types that you want to ignore in the views  |
 | preselected_tags      | '' | The name of tags you want to preload  |
 
 
@@ -54,4 +54,12 @@ If you add your own image you also need to add the slug to the `device_img` sett
 
 ## Use
 
-Go to the plugins tab in the navbar and click topology or go to NETBOX_URL/plugins/topology-views/ view your topologies
+Go to the plugins tab in the navbar and click topology or go to `$NETBOX_URL/plugins/topology-views/` to view your topologies
+
+### Update
+
+Run `pip install netbox-topology-views --upgrade` in your venv.
+
+Run `python3 manage.py collectstatic --no-input`
+
+Clear you browser cache.

netbox_topology_views/__init__.py

@@ -4,14 +4,14 @@ class TopologyViewsConfig(PluginConfig):
     name = 'netbox_topology_views'
     verbose_name = 'Topology views'
     description = 'An plugin to render toplogoy maps'
-    version = '0.4.0'
+    version = '0.4.6'
     author = 'Mattijs Vanhaverbeke'
     author_email = 'author@example.com'
     base_url = 'topology-views'
     required_settings = []
     default_settings = {
         'preselected_device_roles': 'Firewall,Router,Distribution Switch,Core Switch,Internal Switch,Access Switch,Server,Storage,Backup,Wireless AP',
-        'ignore_cable_type': 'poweroutlet,powerport',
+        'ignore_cable_type': 'power outlet,power port',
         'device_img': 'access-switch,core-switch,firewall,router,distribution-switch,backup,storage,wan-network,wireless-ap,server,internal-switch,isp-cpe-material,non-racked-devices,power-units',
         'allow_coordinates_saving': False,
         'preselected_tags' : ''

netbox_topology_views/api/views.py

@@ -123,20 +123,59 @@ class SearchViewSet(GenericViewSet):
         for device in devices:
             cables = device.get_cables()
             for cable in cables:
-                if cable.id not in cable_ids:
+                if cable.termination_a_type.name != "circuit termination" and cable.termination_b_type.name != "circuit termination":
-                    if cable.termination_a_type.name not in ignore_cable_type:
+                    if cable.id not in cable_ids:
-                        cable_ids.append(cable.id)
+                        if cable.termination_a_type.name not in ignore_cable_type and cable.termination_b_type.name not in ignore_cable_type:
-                        edge_ids += 1
+                            cable_ids.append(cable.id)
-                        edge = {}
+                            edge_ids += 1
-                        edge["id"] = edge_ids
+
-                        edge["from"] = cable.termination_a.device.id
+                            cable_a_dev_name = cable.termination_a.device.name
-                        edge["to"] = cable.termination_b.device.id
+                            if cable_a_dev_name is None:
-                        edge["title"] = "Connection between <br> " + cable.termination_a.device.name + " [" + cable.termination_a.name +  "]<br>" + cable.termination_b.device.name + " [" + cable.termination_b.name + "]"
+                                cable_a_dev_name = "device A name unknown"
-                        edges.append(edge)
+                            cable_a_name = cable.termination_a.name
+                            if cable_a_name is None:
+                                cable_a_name = "cable A name unknown"
+                            cable_b_dev_name = cable.termination_b.device.name
+                            if cable_b_dev_name is None:
+                                cable_b_dev_name = "device B name unknown"
+                            cable_b_name = cable.termination_b.name
+                            if cable_b_name is None:
+                                cable_b_name = "cable B name unknown"
+
+                            edge = {}
+                            edge["id"] = edge_ids
+                            edge["from"] = cable.termination_a.device.id
+                            edge["to"] = cable.termination_b.device.id
+                            edge["title"] = "Connection between <br> " + cable_a_dev_name + " [" + cable_a_name +  "]<br>" + cable_b_dev_name + " [" + cable_b_name + "]"
+                            if cable.color != "":
+                                edge["color"] = "#" + cable.color
+                            edges.append(edge)
+                else:
+                    pass
+                    #circuittermination not supported for now
+            
+            dev_name = device.name
+            if dev_name is None:
+                dev_name = "device name unknown"
+
+            node_content = ""
+
+            if device.device_type.display_name is not None:
+                node_content += "<tr><th>Type: </th><td>" + device.device_type.display_name + "</td></tr>"
+            if device.device_role.name is not None:
+                node_content +=  "<tr><th>Role: </th><td>" + device.device_role.name + "</td></tr>"
+            if device.serial != "":
+                node_content += "<tr><th>Serial: </th><td>" + device.serial + "</td></tr>"
+            if device.primary_ip is not None:
+                node_content += "<tr><th>IP Address: </th><td>" + str(device.primary_ip.address) + "</td></tr>"
+
+            dev_title = "<table> %s </table>" % (node_content)
+
             node = {}
             node["id"] = device.id
-            node["name"] = device.name
+            node["name"] = dev_name
-            node["label"] = device.name + " " + device.device_type.display_name
+            node["label"] = dev_name
+            node["title"] = dev_title
             node["shape"] = 'image'
             if device.device_role.slug in settings.PLUGINS_CONFIG["netbox_topology_views"]["device_img"]:
                 node["image"] = '../../static/netbox_topology_views/img/'  + device.device_role.slug + ".png"

netbox_topology_views/static/netbox_topology_views/js/app.js

@@ -1 +1 @@
-var graph=null,container=null,csrftoken=null,nodes=new vis.DataSet,edges=new vis.DataSet,options={interaction:{hover:!0,hoverConnectedEdges:!0,multiselect:!1},nodes:{shape:"image",brokenImage:"../../static/netbox_topology_views/img/role-unknown.png",size:35,font:{multi:"md",face:"helvetica"}},edges:{length:100,width:2,font:{face:"helvetica"}},physics:{solver:"forceAtlas2Based"}};function iniPlotboxIndex(){document.addEventListener("DOMContentLoaded",function(){container=document.getElementById("visgraph"),csrftoken=jQuery("[name=csrfmiddlewaretoken]").val(),startLoadSearchBar(),handleButtonPress()},!1)}function startLoadSearchBar(){$("#device-roles").select2({allowClear:!0,placeholder:"---------",theme:"bootstrap",multiple:!0,ajax:{url:"../../api/dcim/device-roles/?brief=true",dataType:"json",type:"GET",data:function(e){return{term:e.term}},processResults:function(e){return{results:$.map(e.results,function(e){return{text:e.name,id:e.id}})}}}}),$("#sites").select2({allowClear:!0,placeholder:"---------",theme:"bootstrap",multiple:!0,ajax:{url:"../../api/dcim/sites/?brief=true",dataType:"json",type:"GET",data:function(e){return{term:e.term}},processResults:function(e){return{results:$.map(e.results,function(e){return{text:e.name,id:e.id}})}}}}),$("#tags").select2({allowClear:!0,placeholder:"---------",theme:"bootstrap",multiple:!0,ajax:{url:"../../api/extras/tags/?brief=true",dataType:"json",type:"GET",data:function(e){return{term:e.term}},processResults:function(e){return{results:$.map(e.results,function(e){return{text:e.name,id:e.id}})}}}});var s=$("#device-roles");$.ajax({type:"GET",url:"../../api/plugins/topology-views/preselectdeviceroles/"}).then(function(e){$.each(e.results,function(e,t){var a=new Option(t.name,t.id,!0,!0);s.append(a).trigger("change"),s.trigger({type:"select2:select",params:{data:t}})})});var n=$("#tags");$.ajax({type:"GET",url:"../../api/plugins/topology-views/preselecttags/"}).then(function(e){$.each(e.results,function(e,t){var a=new Option(t.name,t.id,!0,!0);n.append(a).trigger("change"),n.trigger({type:"select2:select",params:{data:t}})})})}function handleButtonPress(){$("#search-form").submit(function(e){$("#status").html('<span class="label  label-info">Loading data</span>'),e.preventDefault();var t=$("#name").val(),a=$("#device-roles").val(),s=$("#sites").val(),n=$("#tags").val();$.ajax({type:"POST",url:"../../api/plugins/topology-views/search/search/",data:JSON.stringify({name:t,devicerole:a,sites:s,tags:n}),headers:{"X-CSRFToken":csrftoken},contentType:"application/json; charset=utf-8",dataType:"json",success:function(e){$("#status").html('<span class="label  label-info">Drawing network</span>'),graph=null,nodes=new vis.DataSet,edges=new vis.DataSet,graph=new vis.Network(container,{nodes:nodes,edges:edges},options),$.each(e.nodes,function(e,t){nodes.add(t)}),$.each(e.edges,function(e,t){edges.add(t)}),graph.fit(),graph.on("afterDrawing",function(){$("#status").html('<span class="label label-success">Ready</span>')}),graph.on("dragEnd",function(e){dragged=this.getPositions(e.nodes),$.each(dragged,function(e,t){$("#coordstatus").html(""),$("#checkSaveCoordinates").is(":checked")&&$.ajax({url:"../../api/plugins/topology-views/save-coords/save_coords/",type:"POST",dataType:"json",headers:{"X-CSRFToken":csrftoken},contentType:"application/json; charset=utf-8",data:JSON.stringify({node_id:e,x:t.x,y:t.y}),error:function(e){$("#coordstatus").html('<span class="label label-warning">Failed to update coordinates</span>')},success:function(e){$("#coordstatus").html('<span class="label label-success">Updated coordinates</span>')}})})})},error:function(e){$("#status").html('<span class="label label-warning">Something went wrong</span>')}})})}
+var graph=null,container=null,csrftoken=null,nodes=new vis.DataSet,edges=new vis.DataSet,options={interaction:{hover:!0,hoverConnectedEdges:!0,multiselect:!1},nodes:{shape:"image",brokenImage:"../../static/netbox_topology_views/img/role-unknown.png",size:35,font:{multi:"md",face:"helvetica"}},edges:{length:100,width:2,font:{face:"helvetica"}},physics:{solver:"forceAtlas2Based"}};function iniPlotboxIndex(){document.addEventListener("DOMContentLoaded",function(){container=document.getElementById("visgraph"),csrftoken=jQuery("[name=csrfmiddlewaretoken]").val(),startLoadSearchBar(),handleButtonPress()},!1)}function startLoadSearchBar(){$("#device-roles").select2({allowClear:!0,placeholder:"---------",theme:"bootstrap",multiple:!0,ajax:{url:"../../api/dcim/device-roles/?brief=true",dataType:"json",type:"GET",data:function(e){return{q:e.term}},processResults:function(e){return{results:$.map(e.results,function(e){return{text:e.name,id:e.id}})}}}}),$("#sites").select2({allowClear:!0,placeholder:"---------",theme:"bootstrap",multiple:!0,ajax:{url:"../../api/dcim/sites/?brief=true",dataType:"json",type:"GET",data:function(e){return{q:e.term}},processResults:function(e){return{results:$.map(e.results,function(e){return{text:e.name,id:e.id}})}}}}),$("#tags").select2({allowClear:!0,placeholder:"---------",theme:"bootstrap",multiple:!0,ajax:{url:"../../api/extras/tags/?brief=true",dataType:"json",type:"GET",data:function(e){return{q:e.term}},processResults:function(e){return{results:$.map(e.results,function(e){return{text:e.name,id:e.id}})}}}});var s=$("#device-roles");$.ajax({type:"GET",url:"../../api/plugins/topology-views/preselectdeviceroles/"}).then(function(e){$.each(e.results,function(e,t){var a=new Option(t.name,t.id,!0,!0);s.append(a).trigger("change"),s.trigger({type:"select2:select",params:{data:t}})})});var n=$("#tags");$.ajax({type:"GET",url:"../../api/plugins/topology-views/preselecttags/"}).then(function(e){$.each(e.results,function(e,t){var a=new Option(t.name,t.id,!0,!0);n.append(a).trigger("change"),n.trigger({type:"select2:select",params:{data:t}})})})}function handleButtonPress(){$("#search-form").submit(function(e){$("#status").html('<span class="label  label-info">Loading data</span>'),e.preventDefault();var t=$("#name").val(),a=$("#device-roles").val(),s=$("#sites").val(),n=$("#tags").val();$.ajax({type:"POST",url:"../../api/plugins/topology-views/search/search/",data:JSON.stringify({name:t,devicerole:a,sites:s,tags:n}),headers:{"X-CSRFToken":csrftoken},contentType:"application/json; charset=utf-8",dataType:"json",success:function(e){$("#status").html('<span class="label  label-info">Drawing network</span>'),graph=null,nodes=new vis.DataSet,edges=new vis.DataSet,graph=new vis.Network(container,{nodes:nodes,edges:edges},options),$.each(e.nodes,function(e,t){nodes.add(t)}),$.each(e.edges,function(e,t){edges.add(t)}),graph.fit(),graph.on("afterDrawing",function(){$("#status").html('<span class="label label-success">Ready</span>')}),graph.on("dragEnd",function(e){dragged=this.getPositions(e.nodes),$.each(dragged,function(e,t){$("#coordstatus").html(""),$("#checkSaveCoordinates").is(":checked")&&$.ajax({url:"../../api/plugins/topology-views/save-coords/save_coords/",type:"POST",dataType:"json",headers:{"X-CSRFToken":csrftoken},contentType:"application/json; charset=utf-8",data:JSON.stringify({node_id:e,x:t.x,y:t.y}),error:function(e){$("#coordstatus").html('<span class="label label-warning">Failed to update coordinates</span>')},success:function(e){$("#coordstatus").html('<span class="label label-success">Updated coordinates</span>')}})})})},error:function(e){$("#status").html('<span class="label label-warning">Something went wrong</span>')}})})}

netbox_topology_views/static_dev/js/home.js

@@ -51,7 +51,7 @@ function startLoadSearchBar() {
             type: "GET",
             data: function (params) {
                 var queryParameters = {
-                    term: params.term
+                    q: params.term
                 }
                 return queryParameters;
             },
@@ -79,7 +79,7 @@ function startLoadSearchBar() {
             data: function (params) {
 
                 var queryParameters = {
-                    term: params.term
+                    q: params.term
                 }
                 return queryParameters;
             },
@@ -106,7 +106,7 @@ function startLoadSearchBar() {
             type: "GET",
             data: function (params) {
                 var queryParameters = {
-                    term: params.term
+                    q: params.term
                 }
                 return queryParameters;
             },

package.json

@@ -1,7 +1,7 @@
 {
   "private": true,
   "name": "netbox_topology_views",
-  "version": "0.4.0",
+  "version": "0.4.6",
   "scripts": {
     "resources": "gulp build",
     "resources_dev": "gulp build_dev"

setup.py

@@ -3,7 +3,7 @@ from setuptools import setup, find_packages
 
 setup(
     name='netbox-topology-views',
-    version='0.4.0',
+    version='0.4.6',
     description='An NetBox plugin to create Topology maps',
     url='https://github.com/mattieserver/netbox-topology-views',
     author='Mattijs Vanhaverbeke',