Initial version of status page

dccp · Apr 8, 2015 · e0a9c3c · e0a9c3c
1 parent 02e1237
commit e0a9c3c
Show file tree

Hide file tree

Showing 5 changed files with 90 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+config.js
diff --git a/config.js.example b/config.js.example
@@ -0,0 +1,5 @@
+var config = {
+    host: 'http://companyname.website',
+    portStart: 8080,
+    devices: 9
+}
diff --git a/index.html b/index.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset='utf-8'>
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
+    <link rel="stylesheet" href="stylesheet.css">
+    <title>Bob-powered Zepchain status</title>
+</head>
+<body class="Aligner">
+    <script src="//code.jquery.com/jquery-2.1.3.min.js"></script>
+    <script src="config.js"></script>
+    <script src="main.js"></script>
+    <table>
+        <tr>
+            <td id='zep1' class='unknown'>☐</td>
+            <td>Zeppelin 1</td>
+        </tr>
+        <tr>
+            <td id='zep2' class='unknown'>☐</td>
+            <td>Zeppelin 2</td>
+        </tr>
+        <tr>
+            <td id='zep3' class='unknown'>☐</td>
+            <td>Zeppelin 3</td>
+        </tr>
+    </table>
+    <script>
+        updateStatus();
+        setInterval(updateStatus, 5*1000);
+    </script>
+</body>
+</html>
diff --git a/main.js b/main.js
@@ -0,0 +1,25 @@
+function updateStatus() {
+    var list = [];
+    for (var i = 0; i <= config.devices; i++) {
+        list.push(i);
+    }
+    $.each(list, function () {
+        var zep = this;
+        var port = config.portStart + (zep-1);
+        $.ajax({
+            url: config.host + ':' + port,
+            success: function() {
+                console.log('this shouldn\'t happen!');
+            },
+        }).always(function (xhr) {
+            zepp = $('#zep'+zep);
+            zepp.css('color', '#f74b4b');
+            zepp.text('☒');
+            switch(xhr.status){
+                case 405:
+                    zepp.css('color', '#7bcc3a');
+                    zepp.text('☑');
+            }
+        });
+    });
+}
diff --git a/stylesheet.css b/stylesheet.css
@@ -0,0 +1,27 @@
+body,html {
+    font-size: 100px;
+    height: 100%;
+    margin: 0;
+}
+
+.unknown {
+    color: #ff8800;
+}
+
+.Aligner {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.Aligner-item {
+  max-width: 50%;
+}
+
+.Aligner-item--top {
+  align-self: flex-start;
+}
+
+.Aligner-item--bottom {
+  align-self: flex-end;
+}