update version

* frontend for locations

* locations filter backend

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 topology maps'
-    version = '0.5.1'
+    version = '0.5.3'
     author = 'Mattijs Vanhaverbeke'
     author_email = 'author@example.com'
     base_url = 'topology-views'

netbox_topology_views/api/views.py

@@ -78,7 +78,7 @@ class SearchViewSet(ReadOnlyModelViewSet):
     queryset = Device.objects.all()
     serializer_class = TopologyDummySerializer
 
-    def _filter(self, site, role, name, tags, region):
+    def _filter(self, site, role, name, tags, region, location):
         filter_devices = Device.objects.all()
         if name is not None:
             filter_devices = filter_devices.filter(name__contains=name)
@@ -90,6 +90,8 @@ class SearchViewSet(ReadOnlyModelViewSet):
             filter_devices = filter_devices.filter(tags__id__in=tags)
         if region is not None:
             filter_devices = filter_devices.filter(site__region__id__in=region)
+        if location is not None:
+            filter_devices = filter_devices.filter(location__id__in=location)
         return filter_devices
 
 
@@ -115,14 +117,15 @@ class SearchViewSet(ReadOnlyModelViewSet):
         if regions == []:
             regions = None
 
+        locations = request.query_params.getlist('locations[]', None)
+        if locations == []:
+            locations = None
+
         hide_unconnected = request.query_params.get('hide_unconnected', None)
         if hide_unconnected == "":
             hide_unconnected = None
-        print(hide_unconnected)
-        if hide_unconnected == 'false':
-            print("ok")
 
-        devices = self._filter(sites, devicerole, name, tags, regions)
+        devices = self._filter(sites, devicerole, name, tags, regions, locations)
 
         nodes = []
         edges = []

netbox_topology_views/static_dev/js/home.js

@@ -33,6 +33,7 @@ var options = {
     }
 };
 var selected_regions = [];
+var selected_sites = [];
 
 function iniPlotboxIndex() {
     document.addEventListener('DOMContentLoaded', function () {
@@ -113,6 +114,25 @@ function startLoadSearchBar() {
             }
         }
     });
+
+    $('#sites').on('select2:select', function (e) {
+        var data = e.params.data;
+        var index = selected_sites.indexOf(data.id.toString());
+        if (index == -1) {
+            selected_sites.push(data.id.toString());
+        }
+    });
+    $('#sites').on('select2:unselect', function (e) {
+        var data = e.params.data;
+        var index = selected_sites.indexOf(data.id.toString());
+        if (index > -1) {
+            selected_sites.splice(index, 1);
+          }
+    });
+    $('#sites').on('select2:clear', function (e) {
+        selected_sites = [];
+    });
+
     $('#tags').select2({
         allowClear: true,
         placeholder: "---------",
@@ -178,7 +198,6 @@ function startLoadSearchBar() {
     $('#regions').on('select2:unselect', function (e) {
         var data = e.params.data;
         var index = selected_regions.indexOf(data.id.toString());
-        console.log(index);
         if (index > -1) {
             selected_regions.splice(index, 1);
           }
@@ -187,6 +206,47 @@ function startLoadSearchBar() {
          selected_regions = [];
     });
 
+    $('#locations').select2({
+        allowClear: true,
+        placeholder: "---------",
+        theme: "bootstrap",
+        multiple: true,
+        ajax: {
+            url: function (params) { 
+                var base_url = "../../api/dcim/locations/?brief=true";
+                if (selected_sites.length == 0) {
+                    return base_url;
+                }
+                else {
+                    for (var i = 0; i < selected_sites.length; i++) {
+                        var tmp = "&site_id=" + selected_sites[i];
+                        base_url = base_url + tmp;
+                    }
+                    return base_url;
+                }
+
+            },
+            dataType: "json",
+            type: "GET",
+            data: function (params) {
+                var queryParameters = {
+                    q: params.term
+                }
+                return queryParameters;
+            },
+            processResults: function (data) {
+                return {
+                    results: $.map(data.results, function (item) {
+                        return {
+                            text: item.name,
+                            id: item.id
+                        }
+                    })
+                };
+            }
+        }
+    });
+
 
     var deviceRolesSelect = $('#device-roles');
     $.ajax({
@@ -233,6 +293,7 @@ function handleButtonPress() {
         var value4 = $("#tags").val();
         var value5 = $("#regions").val();
         var value6 = $('#checkHideUnconnected').is(":checked");
+        var value7 = $("#locations").val();
         $.ajax({
             type: "GET",
             url: "../../api/plugins/topology-views/search/search/",
@@ -242,7 +303,8 @@ function handleButtonPress() {
                 'sites[]': value3,
                 'tags[]': value4,
                 'regions[]': value5,
-                'hide_unconnected': value6
+                'hide_unconnected': value6,
+                'locations[]': value7
             },
             headers: { "X-CSRFToken": csrftoken },
             contentType: "application/json; charset=utf-8",

netbox_topology_views/templates/netbox_topology_views/index.html

@@ -41,20 +41,24 @@
                     <div class="form-group">
                         <label for="device-roles">Device roles</label>
                         <select class="form-control" multiple="multiple" id="device-roles"></select>
+                    </div>
+					<div class="form-group">
+                        <label for="regions">Regions</label>
+                        <select class="form-control" multiple="multiple" id="regions"></select>
                     </div>
                     <div class="form-group">
                         <label for="sites">Sites</label>
                         <select class="form-control" multiple="multiple" id="sites"></select>
 					</div>
 					<div class="form-group">
+                        <label for="locations">Locations</label>
+                        <select class="form-control" multiple="multiple" id="locations"></select>
+					</div>
+					<div class="form-group">
                         <label for="tags">Tags</label>
                         <select class="form-control" multiple="multiple" id="tags"></select>
 					</div>
 					<div class="form-group">
-                        <label for="regions">Regions</label>
-                        <select class="form-control" multiple="multiple" id="regions"></select>
-                    </div>
-					<div class="form-group">
                         <div class="custom-control custom-checkbox">
 							<input type="checkbox" class="custom-control-input" id="checkHideUnconnected">
 							<label class="custom-control-label" for="checkHideUnconnected">Hide Unconnected</label>

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "netbox_topology_views",
-  "version": "0.5.1",
+  "version": "0.5.3",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,7 +1,7 @@
 {
   "private": true,
   "name": "netbox_topology_views",
-  "version": "0.5.1",
+  "version": "0.5.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.5.1',
+    version='0.5.3',
     description='An NetBox plugin to create Topology maps',
     url='https://github.com/mattieserver/netbox-topology-views',
     author='Mattijs Vanhaverbeke',