From 5c13e3107d7176327de9cde2dc5a0af32fded8fb Mon Sep 17 00:00:00 2001 From: Danielv123 Date: Tue, 23 May 2017 11:56:10 +0200 Subject: [PATCH] /nodeDetails?slaveID=xxx page for detailed info about a single slave and massive UI overhaul which looks like shit. --- routes.js | 3 ++ static/head.html | 1 + static/nodeDetails.css | 59 ++++++++++++++++++++++++++++ static/nodeDetails.ejs | 21 ++++++++++ static/nodeDetails.js | 87 ++++++++++++++++++++++++++++++++++++++++++ static/sidebar.html | 3 ++ static/style.css | 14 ++++++- 7 files changed, 186 insertions(+), 2 deletions(-) create mode 100644 static/nodeDetails.css create mode 100644 static/nodeDetails.ejs create mode 100644 static/nodeDetails.js diff --git a/routes.js b/routes.js index 45f05954..efd330b0 100644 --- a/routes.js +++ b/routes.js @@ -8,4 +8,7 @@ module.exports = function(app) { app.get("/settings", function(req, res) { res.render("settings"); }); + app.get("/nodeDetails", function(req, res) { + res.render("nodeDetails"); + }); }; \ No newline at end of file diff --git a/static/head.html b/static/head.html index 7ce98e7d..7c1c12ae 100644 --- a/static/head.html +++ b/static/head.html @@ -2,3 +2,4 @@ + \ No newline at end of file diff --git a/static/nodeDetails.css b/static/nodeDetails.css new file mode 100644 index 00000000..2916ae75 --- /dev/null +++ b/static/nodeDetails.css @@ -0,0 +1,59 @@ +*{ + color: #FFF; +} + +#header .subbar h6 { + display:inline; + font-weight:normal; + color: #BBB +} +#header { + background-color: #222; + color: #DDD; + font-family: 'Roboto', sans-serif; + padding-left:16px; +} +#displayBody { + margin-left: 16px; +} +a { + color: #FF7200; + text-decoration: none; +} +a:hover { + color: #FFF; +} +#hero { + background-color: #444; + height:400px; +} + +#header h1 { + margin-left: 10px; + display:inline-block; +} +#header .subbar h6 { + margin-right: 16px; +} +#onlineIndicator { + background-color:red; + height:20px; + width:20px; + display:inline-block; + border-radius:16px; +} +ul { + width:300px; + list-style:none; + max-height:100px; + margin:0; + overflow:auto; + padding:0; + text-indent:10px; +} +li{ + line-height:25px; +} +li:nth-child(even){ + background:#ccc; +} \ No newline at end of file diff --git a/static/nodeDetails.ejs b/static/nodeDetails.ejs new file mode 100644 index 00000000..32ce63eb --- /dev/null +++ b/static/nodeDetails.ejs @@ -0,0 +1,21 @@ + + + <%- include("head.html") %> + + + + + + <%- include("sidebar.html") %> +
+
+

Slave details

+
+ +
+
+
+ +
+
+ \ No newline at end of file diff --git a/static/nodeDetails.js b/static/nodeDetails.js new file mode 100644 index 00000000..756ed00d --- /dev/null +++ b/static/nodeDetails.js @@ -0,0 +1,87 @@ +// string, object, function(object) +function post(url, data, callback) { + console.log("POST " + url + JSON.stringify(data)) + var xhr = new XMLHttpRequest(); + xhr.open("POST", url, true); + xhr.setRequestHeader("Content-type", "application/json"); + xhr.onreadystatechange = function () { + if (xhr.readyState == 4 && xhr.status == 200) { + var json = JSON.parse(xhr.responseText); + callback(json); + } + } + xhr.send(JSON.stringify(data)); +} +function getJSON(url, callback) { + var xhr = new XMLHttpRequest(); + xhr.open('GET', url, true); + xhr.responseType = 'json'; + xhr.onload = function() { + var status = xhr.status; + if (status == 200) { + callback(null, xhr.response); + } else { + callback(status); + } + }; + xhr.send(); +}; +function getParameterByName(name, url) { + if (!url) url = window.location.href; + name = name.replace(/[\[\]]/g, "\\$&"); + var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"), + results = regex.exec(url); + if (!results) return null; + if (!results[2]) return ''; + return decodeURIComponent(results[2].replace(/\+/g, " ")); +} + +function populateSlaveInfo(){ + let slaveID = getParameterByName("slaveID"); + if(!slaveID){ + throw "We need slaveID! GIVE US SLAVEID! ALL HAIL OUR NEW OVERLORDS!" + } + getJSON("/api/slaves", function(err, slaveData){ + /* + {"-1530507550":{ + "time":"1495475926375", + "rconPort":"8714", + "rconPassword":"hidden", + "serverPort":"14345", + "unique":"-1530507550", + "publicIP":"localhost", + "mods":[ + { + "modName":"clusterio_1.0.0.zip", + "hash":"341feb6c60918c83f7f3a6a14a4a308aef18dda6" + },{ + "modName":"clusterio_1.0.1.zip", + "hash":"aee7a4b67ece19bddf236312fe408a5d4b67248d" + },{ + "modName":"clusterio_1.1.0.zip", + "hash":"18e2f7e402d716e3dd1c1458b7fab2d0bb29eccf" + }], + "playerCount":"0", + "instanceName":"t", + "mac":"44-85-00-D2-7E-D6"} + } + */ + let slave = slaveData[slaveID]; + let HTML = "" // end of header + HTML += "

Last seen: "+slave.time+"

" + HTML += "
" // end of displayBody + // list mods and other metadata + HTML += "

Mods