From 1788d72f8f4cd2baef8d0de6a24bf5685e17b6b9 Mon Sep 17 00:00:00 2001 From: J-Lassauw Date: Tue, 11 Dec 2018 22:31:30 +0000 Subject: [PATCH] Updated node details and settings style Fixed nav spacing. Added a header to the storage table. --- static/head.html | 1 + static/index.html | 9 +++++- static/nav.html | 4 +-- static/nodeDetails.css | 59 ++-------------------------------- static/nodeDetails.js | 73 +++++++++++++++++++++++++++++++++--------- static/nodes.html | 9 ++++-- static/settings.js | 12 ++++--- static/style.css | 4 +++ 8 files changed, 88 insertions(+), 83 deletions(-) diff --git a/static/head.html b/static/head.html index dcdb4791..207b3f17 100644 --- a/static/head.html +++ b/static/head.html @@ -9,6 +9,7 @@ + diff --git a/static/index.html b/static/index.html index 69c3cf64..b755490e 100644 --- a/static/index.html +++ b/static/index.html @@ -19,7 +19,14 @@
- +
+ + + + + + +
IconItem IDQuantity
diff --git a/static/nav.html b/static/nav.html index de08906a..537068d6 100644 --- a/static/nav.html +++ b/static/nav.html @@ -5,10 +5,10 @@

Clusterio

-
+
Storage
-
+
Slaves
diff --git a/static/nodeDetails.css b/static/nodeDetails.css index 47d7b191..347274ce 100644 --- a/static/nodeDetails.css +++ b/static/nodeDetails.css @@ -1,58 +1,3 @@ -#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; -} -#hero { - background-color: #444; - height:400px; -} -#hero .subtitle { - margin-left:8px; -} - -#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; -} -.productionGraph { - background-color:black; -} -#leftHeroContainer { - float:left; -} -ul { - width:300px; - list-style:none; - max-height:400px; - min-height:100px; - margin:0; - overflow:auto; - padding:0; - text-indent:10px; -} -li{ - line-height:25px; -} -li:nth-child(even){ - background:#ccc; +#node-stats .breadcrumb-item { + height: auto; } \ No newline at end of file diff --git a/static/nodeDetails.js b/static/nodeDetails.js index 4291525f..3334b562 100644 --- a/static/nodeDetails.js +++ b/static/nodeDetails.js @@ -38,22 +38,46 @@ var chartsByID = {}; // update the online indicator dot setInterval(function(){ getJSON("/api/slaves", function(err, slaveData){ - let indicator = document.querySelector("#onlineIndicator"); + let indicator = document.querySelector("#online-indicator"); + $(indicator).removeClass('fa-signal'); + $(indicator).removeClass('fa-dizzy'); + $(indicator).removeClass('fa-plug'); if(err){ // our request threw an error, most likely master is unavailable so we show yellow indicator - indicator.style.backgroundColor = "yellow"; + indicator.style.color = "yellow"; + $(indicator).addClass('fa-plug'); indicator.title = "Master server unavailable"; // compare with Math.floor(x/100000) allows us to check if they are within 10s of each other } else if(Math.floor(slaveData[getParameterByName("instanceID")].time/100000) === Math.floor(Date.now()/100000)){ - indicator.style.backgroundColor = "green"; + indicator.style.color = "green"; + $(indicator).addClass('fa-signal'); indicator.title = "Slave is online"; } else { - indicator.style.backgroundColor = "red"; + indicator.style.color = "red"; + $(indicator).addClass('fa-dizzy'); indicator.title = "Slave is offline"; } }); }, 1000); +function regexModDetails(modFileName) { + let m; + let results = []; + const regex = /(.+)_(\d+\.\d+\.\d+)\.zip/gm; + while ((m = regex.exec(modFileName)) !== null) { + // This is necessary to avoid infinite loops with zero-width matches + if (m.index === regex.lastIndex) { + regex.lastIndex++; + } + + // The result can be accessed through the `m`-variable. + m.forEach((match, _) => { + results.push(match); + }); + } + return results +} + populateSlaveInfo(); function populateSlaveInfo(){ let instanceID = getParameterByName("instanceID"); @@ -86,18 +110,19 @@ function populateSlaveInfo(){ } */ let slave = slaveData[instanceID]; - let HTML = "