diff --git a/inventory_provider/static/inventoryProvider.js b/inventory_provider/static/inventoryProvider.js
new file mode 100644
index 0000000000000000000000000000000000000000..283b3445058691855a9bac87c35954c31bd9bc21
--- /dev/null
+++ b/inventory_provider/static/inventoryProvider.js
@@ -0,0 +1,48 @@
+var myApp = angular.module('inventoryApp', []);
+
+myApp.controller('inventoryProvider', function($scope, $http) {
+
+ $scope.routers = [];
+ $scope.router = '';
+
+ $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(
+ 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