diff --git a/inventory_provider/static/demo.html b/inventory_provider/static/demo.html
deleted file mode 100644
index 369df4fc8bb3003605f4107f00b54eb5e0a80d93..0000000000000000000000000000000000000000
--- a/inventory_provider/static/demo.html
+++ /dev/null
@@ -1,16 +0,0 @@
-<!doctype html>
-<html ng-app="inventoryApp">
- <head>
- <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.5/angular.min.js"></script>
- <script src="inventoryProvider.js"></script>
- <link rel="stylesheet" href="todo.css">
- </head>
- <body>
- <h2>Todo</h2>
- <div ng-controller="inventoryProvider">
- <ul name="routers" class="unstyled">
- <li ng-repeat="router in routers">{{router}}</li>
- </ul>
- </div>
- </body>
-</html>
\ No newline at end of file
diff --git a/inventory_provider/static/inventoryProvider.js b/inventory_provider/static/inventoryProvider.js
index b5e2d2a45a7223d2f14eb5c147fa4c76118a497b..283b3445058691855a9bac87c35954c31bd9bc21 100644
--- a/inventory_provider/static/inventoryProvider.js
+++ b/inventory_provider/static/inventoryProvider.js
@@ -2,18 +2,47 @@ var myApp = angular.module('inventoryApp', []);
myApp.controller('inventoryProvider', function($scope, $http) {
- $scope.routers = []
+ $scope.routers = [];
+ $scope.router = '';
- function onSuccess(response) {
- $scope.routers = response.data;
- }
-
- function onError(response) {
- $scope.routers = ['error'];
- }
+ $scope.interfaces = 'not yet loaded';
+ $scope.bgp = 'not yet loaded';
+ $scope.snmp = 'not yet loaded';
$http({
method: 'GET',
url: window.location.origin + "/data/routers"
- }).then(onSuccess, onError);
+ }).then(
+ function(rsp) {$scope.routers = rsp.data;},
+ function(rsp) {$scope.routers = ['error'];}
+ );
+
+ $scope.update_interface = function() {
+
+ $http({
+ method: 'GET',
+ url: window.location.origin + "/data/interfaces/" + $scope.router
+ }).then(
+ function(rsp) {$scope.interfaces = rsp.data;},
+ function(rsp) {$scope.interfaces = 'error';}
+ );
+
+ $http({
+ method: 'GET',
+ url: window.location.origin + "/data/bgp/" + $scope.router
+ }).then(
+ function(rsp) {$scope.bgp = rsp.data;},
+ function(rsp) {$scope.bgp = 'error';}
+ );
+
+ $http({
+ method: 'GET',
+ url: window.location.origin + "/data/snmp/" + $scope.router
+ }).then(
+ function(rsp) {$scope.snmp = rsp.data;},
+ function(rsp) {$scope.snmp = 'error';}
+ );
+
+ }
+
});
\ No newline at end of file
diff --git a/inventory_provider/static/juniper.html b/inventory_provider/static/juniper.html
new file mode 100644
index 0000000000000000000000000000000000000000..5ed7fab8ff687e8d874bd8c9746ad312b848d967
--- /dev/null
+++ b/inventory_provider/static/juniper.html
@@ -0,0 +1,42 @@
+<!doctype html>
+<html ng-app="inventoryApp">
+ <head>
+ <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.5/angular.min.js"></script>
+ <script src="inventoryProvider.js"></script>
+ <link rel="stylesheet" href="style.css">
+ </head>
+ <body>
+
+ <!--
+ <h2>Routers</h2>
+ <div ng-controller="inventoryProvider">
+ <ul name="routers" class="unstyled">
+ <li ng-repeat="r in routers">{{r}}</li>
+ </ul>
+ </div>
+ -->
+
+ <div ng-controller="inventoryProvider">
+ <h2>Interfaces</h2>
+ <div>
+ <select
+ ng-options="r for r in routers"
+ ng-change="update_interface()"
+ ng-model="router"></select>
+ </div>
+
+ <div class="column">
+ <p><b>interfaces</b></p>
+ {{interfaces}}
+ </div>
+ <div class="column">
+ <p><b>bgp</b></p>
+ {{bgp}}
+ </div>
+ <div class="column">
+ <p><b>snmp</b></p>
+ {{snmp}}
+ </div>
+ </div>
+ </body>
+</html>
\ No newline at end of file
diff --git a/inventory_provider/static/style.css b/inventory_provider/static/style.css
new file mode 100644
index 0000000000000000000000000000000000000000..e37a1f87faa0c36404f97a9401171d926c179f29
--- /dev/null
+++ b/inventory_provider/static/style.css
@@ -0,0 +1,11 @@
+.column {
+ float: left;
+ width: 33.33%;
+}
+
+/* Clear floats after the columns */
+.row:after {
+ content: "";
+ display: table;
+ clear: both;
+}
\ No newline at end of file