Use angular for the front-end

4 files changed, 18 insertions, 53 deletions

diff --git a/public/angular.js b/public/angular.js
new file mode 120000
index 0000000..c0f0720
--- /dev/null
+++ b/public/angular.js
@@ -0,0 +1 @@
+../node_modules/angular/angular.js
\ No newline at end of file
diff --git a/public/angular.min.js b/public/angular.min.js
new file mode 120000
index 0000000..fce2e99
--- /dev/null
+++ b/public/angular.min.js
@@ -0,0 +1 @@
+../node_modules/angular/angular.min.js
\ No newline at end of file
diff --git a/public/client.js b/public/client.js
new file mode 100644
index 0000000..193683d
--- /dev/null
+++ b/public/client.js
@@ -0,0 +1,16 @@
+var statusapp = angular.module('status-app', []);
+
+statusapp.controller('status-controller', ['$scope', '$http', function status_controller($scope, $http) {
+    $scope.systems = [];
+
+    setInterval(function() {
+        $http({
+            method: "GET",
+            url: "/status"
+        }).then(function successCallback(response) {
+            $scope.systems = response.data;
+        }, function errorCallback(response) {
+
+        });
+    }, 5000);
+}]);
diff --git a/public/graph.js b/public/graph.js
deleted file mode 100644
index 11ed599..0000000
--- a/public/graph.js
+++ /dev/null
@@ -1,53 +0,0 @@
-var n = 40,
-    random = d3.randomNormal(0, .2),
-    data = d3.range(n).map(random);
-var svg = d3.select("svg"),
-    margin = {top: 20, right: 20, bottom: 20, left: 40},
-    width = +svg.attr("width") - margin.left - margin.right,
-    height = +svg.attr("height") - margin.top - margin.bottom,
-    g = svg.append("g").attr("transform", "translate(" + margin.left + "," + margin.top + ")");
-var x = d3.scaleLinear()
-    .domain([0, n - 1])
-    .range([0, width]);
-var y = d3.scaleLinear()
-    .domain([-1, 1])
-    .range([height, 0]);
-var line = d3.line()
-    .x(function(d, i) { return x(i); })
-    .y(function(d, i) { return y(d); });
-g.append("defs").append("clipPath")
-    .attr("id", "clip")
-  .append("rect")
-    .attr("width", width)
-    .attr("height", height);
-g.append("g")
-    .attr("class", "axis axis--x")
-    .attr("transform", "translate(0," + y(0) + ")")
-    .call(d3.axisBottom(x));
-g.append("g")
-    .attr("class", "axis axis--y")
-    .call(d3.axisLeft(y));
-g.append("g")
-    .attr("clip-path", "url(#clip)")
-  .append("path")
-    .datum(data)
-    .attr("class", "line")
-  .transition()
-    .duration(500)
-    .ease(d3.easeLinear)
-    .on("start", tick);
-function tick() {
-  // Push a new data point onto the back.
-  data.push(random());
-  // Redraw the line.
-  d3.select(this)
-      .attr("d", line)
-      .attr("transform", null);
-  // Slide it to the left.
-  d3.active(this)
-      .attr("transform", "translate(" + x(-1) + ",0)")
-    .transition()
-      .on("start", tick);
-  // Pop the old data point off the front.
-  data.shift();
-}