Initial commit

static/main.css

@@ -0,0 +1,7 @@
+body {
+    background: #aaaaaa;
+}
+
+table {
+    background: #bbbbbb;
+}

static/main.js

@@ -0,0 +1,112 @@
+var request_status = function (host) {
+    console.log("Update " + host.ip);
+
+    var request = new XMLHttpRequest();
+    request.addEventListener("load", function () {
+        var response;
+        console.log(this.status, this.responseText);
+        if (this.status !== 200) {
+            return;
+        }
+        response = JSON.parse(this.responseText);
+        if (response.status === "up") {
+            host.status_node.innerHTML = "✓";
+        } else if (response.status === "unknown") {
+            setTimeout(function () {
+                request_status(host);
+            }, 1000);
+        } else {
+            host.status_node.innerHTML = "X";
+        }
+    });
+
+    request.open("GET", "status/" + host.ip);
+    request.send();
+}
+var request_refresh = function (host) {
+    console.log("Refresh " + host.ip);
+
+    var request = new XMLHttpRequest();
+    request.addEventListener("load", function () {
+        var response;
+        console.log(this.status, this.responseText);
+        if (this.status !== 200) {
+            return;
+        }
+        response = JSON.parse(this.responseText);
+        if (response.status === "ok") {
+            host.status_node.innerHTML = "✓";
+        } else {
+            host.status_node.innerHTML = "X";
+        }
+    });
+
+    request.open("GET", "refresh/" + host.ip);
+    request.send();
+
+    setTimeout(function () {
+        request_status(host);
+    }, 1000);
+}
+
+var request_wol = function (host) {
+    console.log("Wakeup " + host.mac);
+
+    host.status_node.innerText = "?";
+
+    var request = new XMLHttpRequest();
+    request.addEventListener("load", function () {
+        var response;
+        console.log(this.status, this.responseText);
+        if (this.status !== 200) {
+            return;
+        }
+        response = JSON.parse(this.responseText);
+        if (response.response === "ok") {
+            host.status_node.innerHTML = "?";
+        } else {
+            host.status_node.innerHTML = "X";
+        }
+    });
+
+    request.open("GET", "wol/" + host.mac);
+    request.send();
+
+    setTimeout(function () {
+        request_refresh(host);
+    }, 1000);
+}
+
+window.onload = function () {
+    var host_nodes = document.getElementsByClassName('host');
+    var hosts = [];
+    var i;
+
+    if (host_nodes == undefined) {
+        return;
+    }
+
+    for (i = 0; i < host_nodes.length; i++) {
+        var host = {
+            ip  : host_nodes[i].dataset.ip,
+            mac : host_nodes[i].dataset.mac
+        };
+        var status_node = host_nodes[i].getElementsByClassName('status');
+        var wol_button  = host_nodes[i].getElementsByClassName('wol');
+        if (status_node == undefined || wol_button == undefined ||
+            status_node.length < 1   || wol_button.length < 1) {
+            return;
+        }
+        host.status_node = status_node[0];
+        host.wol_button  = wol_button[0];
+        hosts.push(host);
+
+        (function (host_bound) {
+            host_bound.wol_button.onclick = function (e) {
+                request_wol(host_bound);
+            }
+        }) (host);
+
+        request_refresh(host);
+    }
+}