proportions: allow hiding of statistics and add gateway client statistics

Update proportions.js: enable onclick hiding of Statistics <H2> and add clients per GW <H2>
hiding works by clicking on H2 element, so you can have the overview you like
[need to add some hidden line in scss/main.scss also]
clients per GW is based on nodes.json and the offered clientcount by the nodes directly (so this is only rough idea of reality, for alfred this means extra timedifferences upto 30 minutes)

update main.scss: to allow hiding of statistics element
add this to allow statistics element hiding

use consistent var table and dict Names
change gwTable and gwDict (and gw2 ...) to
gwNodes and gwClients
This commit is contained in:
viisauksena 2016-03-12 16:24:57 +01:00 committed by fuzzle
parent 11a157c58a
commit fc2a1e3872
2 changed files with 72 additions and 60 deletions

View File

@ -23,8 +23,11 @@ define(["chroma-js", "virtual-dom", "numeral-intl", "filters/genericnode", "verc
var uplinkTable = document.createElement("table")
uplinkTable.classList.add("proportion")
var gwTable = document.createElement("table")
gwTable.classList.add("proportion")
var gwNodesTable = document.createElement("table")
gwNodesTable.classList.add("proportion")
var gwClientsTable = document.createElement("table")
gwClientsTable.classList.add("proportion")
var siteTable = document.createElement("table")
siteTable.classList.add("proportion")
@ -80,6 +83,25 @@ define(["chroma-js", "virtual-dom", "numeral-intl", "filters/genericnode", "verc
return Object.keys(dict).map(function (d) { return [d, dict[d], key, f] })
}
function count2(nodes, key, f) {
var dict = {}
nodes.forEach( function (d) {
var v = dictGet(d, key.slice(0))
if (f !== undefined)
v = f(v)
if (v === null)
return
dict[v] = d.statistics.clients + (v in dict ? dict[v] : 0)
})
return Object.keys(dict).map(function (d) { return [d, dict[d], key, f] })
}
function addFilter(filter) {
return function () {
filterManager.addFilter(filter)
@ -139,6 +161,7 @@ define(["chroma-js", "virtual-dom", "numeral-intl", "filters/genericnode", "verc
var geoDict = count(nodes, ["nodeinfo", "location"], function (d) {
return d ? "ja" : "nein"
})
var autoDict = count(nodes, ["nodeinfo", "software", "autoupdater"], function (d) {
if (d === null)
return null
@ -147,11 +170,22 @@ define(["chroma-js", "virtual-dom", "numeral-intl", "filters/genericnode", "verc
else
return "(deaktiviert)"
})
var uplinkDict = count(nodes, ["flags", "uplink"], function (d) {
return d ? "ja" : "nein"
})
var gwDict = count(nodes, ["statistics", "gateway"], function (d) {
var gwNodesDict = count(nodes, ["statistics", "gateway"], function (d) {
if (d === null)
return null
if (d in nodeDict)
return nodeDict[d].nodeinfo.hostname
return d
})
var gwClientsDict = count2(onlineNodes, ["statistics", "gateway"], function (d) {
if (d === null)
return null
@ -175,71 +209,45 @@ define(["chroma-js", "virtual-dom", "numeral-intl", "filters/genericnode", "verc
fillTable("Firmware", fwTable, fwDict.sort(function (a, b) { return vercomp(b[0], a[0]) }))
fillTable("Hardware", hwTable, hwDict.sort(function (a, b) { return b[1] - a[1] }))
fillTable("Koordinaten", geoTable, geoDict.sort(function (a, b) { return b[1] - a[1] }))
fillTable("Autom. Updates", autoTable, autoDict.sort(function (a, b) { return b[1] - a[1] }))
fillTable("Uplink", uplinkTable, uplinkDict.sort(function (a, b) { return b[1] - a[1] }))
fillTable("Gewähltes Gateway", gwTable, gwDict.sort(function (a, b) { return b[1] - a[1] }))
fillTable("Autom. Updates", autoTable, autoDict.sort(function (a, b) { return b[1] - a[1] }))
fillTable("Nodes on Gateway", gwNodesTable, gwNodesDict.sort(function (a, b) { return b[1] - a[1] }))
fillTable("Clients on Gateway", gwClientsTable, gwClientsDict.sort(function (a, b) { return b[1] - a[1] }))
fillTable("Site", siteTable, siteDict.sort(function (a, b) { return b[1] - a[1] }))
}
self.render = function (el) {
var h2
h2 = document.createElement("h2")
h2.textContent = "Status"
el.appendChild(h2)
el.appendChild(statusTable)
h2 = document.createElement("h2")
h2.textContent = "Firmwareversionen"
el.appendChild(h2)
el.appendChild(fwTable)
if(config.siteNames || config.showSites) {
h2 = document.createElement("h2")
h2.textContent = "Orte"
el.appendChild(h2)
el.appendChild(siteTable)
}
h2 = document.createElement("h2")
h2.textContent = "Hardwaremodelle"
el.appendChild(h2)
el.appendChild(hwTable)
h2 = document.createElement("h2")
h2.textContent = "Auf der Karte sichtbar"
el.appendChild(h2)
el.appendChild(geoTable)
h2 = document.createElement("h2")
h2.textContent = "Autoupdater"
el.appendChild(h2)
el.appendChild(autoTable)
h2 = document.createElement("h2")
h2.textContent = "Uplink"
el.appendChild(h2)
el.appendChild(uplinkTable)
h2 = document.createElement("h2")
h2.textContent = "Gewählter Gateway"
el.appendChild(h2)
el.appendChild(gwTable)
h2 = document.createElement("h2")
h2.textContent = "Site"
el.appendChild(h2)
el.appendChild(siteTable)
self.renderSingle(el, "Status", statusTable)
self.renderSingle(el, "Gewählter Gateway", gwNodesTable)
self.renderSingle(el, "Clients on Gateway", gwClientsTable)
self.renderSingle(el, "Firmwareversionen", fwTable)
self.renderSingle(el, "Uplink", uplinkTable)
self.renderSingle(el, "Hardwaremodelle", hwTable)
self.renderSingle(el, "Auf der Karte sichtbar", geoTable)
self.renderSingle(el, "Autoupdater", autoTable)
self.renderSingle(el, "Site", siteTable)
if (config.globalInfos)
config.globalInfos.forEach( function (globalInfo) {
h2 = document.createElement("h2")
h2.textContent = globalInfo.name
el.appendChild(h2)
config.globalInfos.forEach(function (globalInfo) {
h2 = document.createElement("h2")
h2.textContent = globalInfo.name
el.appendChild(h2)
el.appendChild(showStatGlobal(globalInfo))
})
}
el.appendChild(showStatGlobal(globalInfo))
})
}
return self
self.renderSingle = function (el, heading, table) {
var h2
h2 = document.createElement("h2")
h2.textContent = heading
h2.onclick = function () {
table.classList.toggle("hidden")
}
el.appendChild(h2)
el.appendChild(table)
}
return self
}
})

View File

@ -127,6 +127,10 @@ table.attributes td {
display: none;
}
.container table.hidden {
display: none;
}
p {
line-height: 1.67em;
}