From 392ad3284d9e686ee49b51565490d665ca7e4284 Mon Sep 17 00:00:00 2001
From: Kristian Lyngstol <kristian@bohemians.org>
Date: Sat, 28 May 2016 03:20:27 +0200
Subject: front: More visual tweaks and tuneups

- Time in oplog is now localtime and properly padded (00:10, not 0:10)
- Health map instead of combo/aggregated
- Tweak the menu slightly
- Rotate and resize the random switch in guess_placement
---
 web/css/nms.css            | 11 ++++-------
 web/index.html             | 17 +++++++++--------
 web/js/nms-info-box.js     |  3 ++-
 web/js/nms-map-handlers.js | 26 +++++++++++++-------------
 web/js/nms-oplog.js        |  7 ++++++-
 web/js/nms.js              |  2 +-
 6 files changed, 35 insertions(+), 31 deletions(-)

(limited to 'web')

diff --git a/web/css/nms.css b/web/css/nms.css
index 0158268..c54dd98 100644
--- a/web/css/nms.css
+++ b/web/css/nms.css
@@ -43,14 +43,11 @@ h1.map-mode-title {
 }
 div.map-mode-legend {
 	position: fixed;
-	bottom: 5%;
-	right: 5%;
+	bottom: 5px;
+	right: 15px;
 	z-index: 999;
 }
-#admin {
-	display: none;
-}
-#oplog {
+#admin, #oplog {
 	display: none;
 }
 .vertical div.map-mode-legend {
@@ -62,7 +59,7 @@ div.map-mode-legend {
 	height: 40px;
 }
 div.map-mode-legend button {
-	font-size: 20px;
+	font-size: 16px;
 	font-weight: 700;
 }
 .nightmode .panel {
diff --git a/web/index.html b/web/index.html
index 9a18025..974a816 100644
--- a/web/index.html
+++ b/web/index.html
@@ -44,17 +44,18 @@
 		<span class="caret"></span>
 	      </a>
 	      <ul class="dropdown-menu" role="menu">
-		<li><a href="#ping" onclick="setUpdater(handler_ping)">Ping map</a></li>
-		<li><a href="#uplink" onclick="setUpdater(handler_uplinks)">Uplink map</a></li>
-		<li><a href="#dhcp" onclick="setUpdater(handler_dhcp)">DHCP map</a></li>
-		<li class="gondul-is-private"><a href="#combo" onclick="setUpdater(handler_combo)">Aggregated map</a></li>
-		<li><a href="#temp" onclick="setUpdater(handler_temp)">Temperature map</a></li>
-		<li><a href="#traffic" onclick="setUpdater(handler_traffic)">Traffic map</a></li>
+		<li class="gondul-is-private"><a href="#health" onclick="setUpdater(handler_health)">Health</a></li>
+		<li><a href="#ping" onclick="setUpdater(handler_ping)">Ping</a></li>
+		<li><a href="#uplink" onclick="setUpdater(handler_uplinks)">Uplink</a></li>
+		<li><a href="#dhcp" onclick="setUpdater(handler_dhcp)">DHCP</a></li>
+		<li><a href="#temp" onclick="setUpdater(handler_temp)">Temperature</a></li>
+		<li><a href="#traffic" onclick="setUpdater(handler_traffic)">Traffic</a></li>
 		<li><a href="#traffictot" onclick="setUpdater(handler_traffic_tot)">Total switch traffic</a></li>
-		<li class="gondul-is-private"><a href="#snmp" onclick="setUpdater(handler_snmp)">SNMP map</a></li>
-		<li class="gondul-is-private"><a href="#cpu" onclick="setUpdater(handler_cpu)">CPU map</a></li>
+		<li class="gondul-is-private"><a href="#snmp" onclick="setUpdater(handler_snmp)">SNMP</a></li>
+		<li class="gondul-is-private"><a href="#cpu" onclick="setUpdater(handler_cpu)">CPU</a></li>
 		<li><a href="#disco" onclick="setUpdater(handler_disco)">DISCO</a></li>
 		<li class="divider"> </li>
+		<li class="dropdown-header">Time</li>
 		<li><a href="#" onclick="toggleLayer('nowPickerBox');startNowPicker();">Travel in time</a></li>
 		<li><a href="#" onclick="nms.playback.startReplay('2016-03-21T09:00:00','2016-03-27T12:00:00');" title="Replay from opening 120 minutes per second">Replay TG</a></li>
 		<li class="divider"> </li>
diff --git a/web/js/nms-info-box.js b/web/js/nms-info-box.js
index 772f711..cd5594e 100644
--- a/web/js/nms-info-box.js
+++ b/web/js/nms-info-box.js
@@ -837,7 +837,8 @@ var switchCommentsPanel = function () {
 			tr.className = 
 				td1 = tr.insertCell(0);
 			td2 = tr.insertCell(1);
-			td1.textContent = logs[v]['timestamp'];
+			var date = new Date(logs[v]['timestamp']);
+			td1.textContent = date.toString();
 			td2.textContent = "[" + logs[v]['username'] + "] " + logs[v]['log'];
 		}
 		domObj.appendChild(table);
diff --git a/web/js/nms-map-handlers.js b/web/js/nms-map-handlers.js
index dea0b6e..61a5a05 100644
--- a/web/js/nms-map-handlers.js
+++ b/web/js/nms-map-handlers.js
@@ -69,11 +69,11 @@ var handler_cpu = {
 	name:"CPU utilization"
 };
 
-var handler_combo = {
-	init:comboInit,
-	getInfo:comboInfo,
-	tag:"combo",
-	name:"Aggregated health"
+var handler_health = {
+	init:healthInit,
+	getInfo:healthInfo,
+	tag:"health",
+	name:"Health"
 };
 
 var handler_mgmt = {
@@ -112,7 +112,7 @@ var handlerInfo = function(tag,desc) {
  * Order matches what's seen in the infobox
  */
 var handlers = [
-	handler_combo,
+	handler_health,
 	handler_mgmt,
 	handler_uplinks,
 	handler_temp,
@@ -591,12 +591,12 @@ function cpuInit() {
 	setLegend(5,"white","N/A");
 }
 
-function comboInfo(sw) {
-	var worst = new handlerInfo("combo", "Combo");
+function healthInfo(sw) {
+	var worst = new handlerInfo("health", "Health");
 	worst.score = 0;
 	worst.why = "All good";
 	for (var h in handlers) {
-		if (handlers[h].tag== "combo")
+		if (handlers[h].tag== "health")
 			continue;
 		if (handlers[h].getInfo == undefined)
 			continue;
@@ -612,18 +612,18 @@ function comboInfo(sw) {
 	return worst;
 }
 
-function comboUpdater() {
+function healthUpdater() {
 	if (nmsData.switches == undefined || nmsData.switches.switches == undefined)
 		return;
 	for (var sw in nmsData.switches.switches) {
-		var worst = comboInfo(sw);
+		var worst = healthInfo(sw);
 		nmsMap.setSwitchColor(sw, nmsColor.getColorStop(worst.score));
 		nmsMap.setSwitchInfo(sw, worst.tag);
 	}
 }
 
-function comboInit() {
-	nmsData.addHandler("ping", "mapHandler", comboUpdater);
+function healthInit() {
+	nmsData.addHandler("ping", "mapHandler", healthUpdater);
 	nmsColor.drawGradient([nmsColor.green,nmsColor.orange,nmsColor.red]);
 	setLegend(1,nmsColor.getColorStop(0),"All good");
 	setLegend(2,nmsColor.getColorStop(250),"Ok-ish");
diff --git a/web/js/nms-oplog.js b/web/js/nms-oplog.js
index 8fe50a4..83bda69 100644
--- a/web/js/nms-oplog.js
+++ b/web/js/nms-oplog.js
@@ -85,7 +85,12 @@ nmsOplog._updateComments = function(limit,prefix,timefield) {
 		tr = table.insertRow(-1);
 		td1 = tr.insertCell(0);
 		td2 = tr.insertCell(1);
-		td1.textContent = nmsData['oplog']['oplog'][v][timefield];
+		var date = new Date(nmsData.oplog.oplog[v]['timestamp']);
+		if (timefield == "time") {
+			td1.textContent = date.toTimeString().replace(/:\d\d .*$/,"");
+		} else {
+			td1.textContent = date.toString();
+		}
 		td2.textContent = "[" + nmsData['oplog']['oplog'][v]['username'] + "] " + nmsData['oplog']['oplog'][v]['log'];
 		td2.hiddenthing = v;
 		td2.onclick = function(e){ var x = document.getElementById("searchbox"); var v = e.path[0].hiddenthing; x.value = nmsData['oplog']['oplog'][v]['systems']; x.oninput(); }
diff --git a/web/js/nms.js b/web/js/nms.js
index d76fa8f..eb0942a 100644
--- a/web/js/nms.js
+++ b/web/js/nms.js
@@ -650,7 +650,7 @@ function setMapModeFromN(e,key)
 			setUpdater(handler_dhcp);
 			break;
 		case '4':
-			setUpdater(handler_combo);
+			setUpdater(handler_health);
 			break;
 		case '5':
 			setUpdater(handler_temp);
-- 
cgit v1.2.3