Welcome to NMS

Welcome to NMS +

Cool stuff:

Everything is always there (but the frontend is a bit - sluggish atm).
Click a switch for more info
Rewind: You can check out state at a specific time or - replay from the beginning of the event
Rewind: You can check out state at a specific time or replay from the beginning of the event
Night mode, now with blur.
Auto-scaling the viewport/canvas
Total client speed (up right)
An about-page that's full of bullet points!
Generic(-ish) map handlers: provide a name, init-function + and an update-function and the nms lib does the rest as far as + integration goes.
An about-page that's full of bullet-points!

Todo list front end:

Fill out this list and text
Polish time travel UI
Lock scale
Polish time travel UI (Allow playing from a given time at a given speed, play/pause buttons, etc)
Toggle auto-scale on/off
Clean up various global variables
Split blur into separate canvas (canvas is there, it's just not used)
Add DHCP map
Add magic map (combined map of sorts)
Add better control panel stuff
Overhaul general UI for a proper bootstrap-approved look.
Fix legend display
Better dialog-boxes (Both this and various others)
Add switch-box to review state on individual ports
Add better control panel stuff (Review timers, change some, etc)
Adjust updatePorts() frequency based on necessity (1sec + updates is overkill for regular operation, but needed for time + travel)
Fix legend display (There's a legend for all handlers, but + it's currently hidden beneath the canvas)
More info on switches: Port state, possibly link time + trends)
Moving switches around (like ping.html + edit)
More?
Split nms.js into multiple components to unclutter the + code
More.

Todo for backend:

Clean up old interfaces
Review various agents/tools
Improve cache headers
Consider time log of DHCP (right now it just stores the + most recent timestamp, making time travel impossible)
Munin plugin for ports.

@@ -138,25 +210,16 @@

- -

- + diff --git a/web/nms.gathering.org/nms2/js/nms.js b/web/nms.gathering.org/nms2/js/nms.js index 789cae9..bd6f963 100644 --- a/web/nms.gathering.org/nms2/js/nms.js +++ b/web/nms.gathering.org/nms2/js/nms.js @@ -37,7 +37,7 @@ var margin = { text:3 }; -var tgStart = stringToEpoch('2015-03-31T15:00:00'); +var tgStart = stringToEpoch('2015-04-01T09:00:00'); var tgEnd = stringToEpoch('2015-04-05T12:00:00'); var replayTime = 0; var replayIncrement = 30 * 60; @@ -188,12 +188,12 @@ function changeNow() { function hideSwitch() { var swtop = document.getElementById("info-switch-parent"); + var swpanel = document.getElementById("info-switch-panel-body"); var switchele = document.getElementById("info-switch-table"); if (switchele != undefined) - swtop.removeChild(switchele); + swpanel.removeChild(switchele); swtop.style.display = 'none'; nms.switch_showing = ""; - } /* * Display info on switch "x" in the info-box @@ -203,6 +203,8 @@ function switchInfo(x) var switchele = document.getElementById("info-switch-table"); var sw = nms.switches_now["switches"][x]; var swtop = document.getElementById("info-switch-parent"); + var swpanel = document.getElementById("info-switch-panel-body"); + var swtitle = document.getElementById("info-switch-title"); var tr; var td1; var td2; @@ -214,16 +216,13 @@ function switchInfo(x) hideSwitch(); nms.switch_showing = x; } + document.getElementById("aboutBox").style.display = "none"; switchele = document.createElement("table"); switchele.id = "info-switch-table"; switchele.style.zIndex = 100; - switchele.className = "table table-bordered"; - - tr = document.createElement("tr"); td1 = document.createElement("td"); td2 = document.createElement("td"); - td1.innerHTML = "Sysname"; - td2.innerHTML = x + ''; - tr.appendChild(td1); tr.appendChild(td2); switchele.appendChild(tr); - + switchele.className = "table"; + + swtitle.innerHTML = x + ''; var speed = 0; var speed2 = 0; for (port in nms.switches_now["switches"][x]["ports"]) { @@ -249,6 +248,8 @@ function switchInfo(x) tr.appendChild(td1); tr.appendChild(td2); switchele.appendChild(tr); tr = document.createElement("tr"); td1 = document.createElement("td"); td2 = document.createElement("td"); + td1['data-toggle'] = "popover"; + td1.title = "Port 44, 45, 46 and 47 are used as uplinks."; td1.innerHTML = "Uplink speed (in , port 44,45,46,47)"; td2.innerHTML = byteCount(8 * speed2) + "b/s"; tr.appendChild(td1); tr.appendChild(td2); switchele.appendChild(tr); @@ -325,7 +326,7 @@ function switchInfo(x) tr.appendChild(td1); tr.appendChild(td2); switchele.appendChild(tr); - swtop.appendChild(switchele); + swpanel.appendChild(switchele); swtop.style.display = 'block'; } @@ -437,6 +438,9 @@ function uplinkInit() setLegend(5,"white","4 uplinks"); } +/* + * Give us a color from blue (0) to red (100). + */ function rgb_from_max(x) { x = x/100; @@ -446,19 +450,28 @@ function rgb_from_max(x) return 'rgb(' + Math.floor(colorred) + ", 0, " + Math.floor(colorblue) + ')'; } +/* + * Tweaked this to scale from roughly 20C to 35C. Hence the -20 and /15 + * thing (e.g., "0" is 20 and "15" is 35 by the time we pass it to + * rgb_from_max()); + */ function temp_color(t) { if (t == undefined) { console.log("Temp_color, but temp is undefined"); return "blue"; } - t = Math.floor((t / 60) * 100); + t = parseInt(t) - 20; + t = Math.floor((t / 15) * 100); return rgb_from_max(t); } /* * There are 4 legend-bars. This is a helper-function to set the color and * description/name for each one. Used from handler init-functions. + * + * FIXME: Should be smarter, possibly use a canvas-writer so we can get + * proper text (e.g.: not black text on dark blue). */ function setLegend(x,color,name) { @@ -481,11 +494,11 @@ function tempUpdater() function tempInit() { - setLegend(1,temp_color(10),"10 °C"); - setLegend(2,temp_color(20),"20 °C"); - setLegend(3,temp_color(30),"30 °C"); - setLegend(4,temp_color(40),"40 °C"); - setLegend(5,temp_color(50),"50 °C"); + setLegend(1,temp_color(20),"20 °C"); + setLegend(2,temp_color(22),"22 °C"); + setLegend(3,temp_color(27),"27 °C"); + setLegend(4,temp_color(31),"31 °C"); + setLegend(5,temp_color(35),"35 °C"); } function gradient_from_latency(latency_ms, latency_secondary_ms) -- cgit v1.2.3

About + the TG15 data +

Time travel

Welcome to NMS

Welcome to NMS +

Cool stuff:

Todo list front end:

Todo for backend:

About + the TG15 data + ×

Time travel

Welcome to NMS

Welcome to NMS + ×

Cool stuff:

Todo list front end:

Todo for backend:

About + the TG15 data +

Welcome to NMS +