Merge pull request #16 from mattieserver/17052020_dev_2

17052020 dev 2

README.md

@@ -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,7 +4,7 @@ class TopologyViewsConfig(PluginConfig):
     name = 'netbox_topology_views'
     verbose_name = 'Topology views'
     description = 'An plugin to render toplogoy maps'
-    version = '0.4.1'
+    version = '0.4.3'
     author = 'Mattijs Vanhaverbeke'
     author_email = 'author@example.com'
     base_url = 'topology-views'

netbox_topology_views/api/views.py

@@ -128,19 +128,42 @@ class SearchViewSet(GenericViewSet):
                         if cable.termination_a_type.name not in ignore_cable_type and cable.termination_b_type.name not in ignore_cable_type:
                             cable_ids.append(cable.id)
                             edge_ids += 1
+
+                            cable_a_dev_name = cable.termination_a.device.name
+                            if cable_a_dev_name is None:
+                                cable_a_dev_name = "device A name unkown"
+                            cable_a_name = cable.termination_a.name
+                            if cable_a_name is None:
+                                cable_a_name = "cable A name unkown"
+                            cable_b_dev_name = cable.termination_b.device.name
+                            if cable_b_dev_name is None:
+                                cable_b_dev_name = "device B name unkown"
+                            cable_b_name = cable.termination_b.name
+                            if cable_b_name is None:
+                                cable_b_name = "cable B name unkown"
+
                             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.termination_a.device.name + " [" + cable.termination_a.name +  "]<br>" + cable.termination_b.device.name + " [" + cable.termination_b.name + "]"
+                            edge["title"] = "Connection between <br> " + cable_a_dev_name + " [" + cable_a_name +  "]<br>" + cable_b_dev_name + " [" + cable_b_name + "]"
                             edges.append(edge)
                 else:
                     pass
                     #circuittermination not supported for now
+            
+            dev_name = device.name
+            if dev_name is None:
+                dev_name = "device name unkown"
+
+            cable_role_name = device.device_type.display_name
+            if cable_role_name is None:
+                cable_role_name = "device role name unkown"
+
             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 + " {" + cable_role_name + "}"
             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.1",
+  "version": "0.4.3",
   "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.1',
+    version='0.4.3',
     description='An NetBox plugin to create Topology maps',
     url='https://github.com/mattieserver/netbox-topology-views',
     author='Mattijs Vanhaverbeke',