more refactoring (sidebar, meshstats)
This commit is contained in:
parent
2c57cff27f
commit
0a90cdb76c
|
@ -14,7 +14,7 @@ define(["infobox/link", "infobox/node"], function (Link, Node) {
|
|||
destroy()
|
||||
|
||||
el = document.createElement("div")
|
||||
sidebar.insertBefore(el, sidebar.firstChild)
|
||||
sidebar.container.insertBefore(el, sidebar.container.firstChild)
|
||||
|
||||
el.scrollIntoView(false)
|
||||
el.classList.add("infobox")
|
||||
|
|
73
lib/main.js
73
lib/main.js
|
@ -1,4 +1,4 @@
|
|||
require(["map", "infobox/main"], function (Map, Infobox) {
|
||||
require(["map", "sidebar", "meshstats", "infobox/main"], function (Map, Sidebar, Meshstats, Infobox) {
|
||||
main()
|
||||
|
||||
function main() {
|
||||
|
@ -7,9 +7,9 @@ require(["map", "infobox/main"], function (Map, Infobox) {
|
|||
|
||||
var linkScale = chroma.scale(chroma.interpolate.bezier(['green', 'yellow', 'red'])).domain([1, 5])
|
||||
|
||||
var sidebar = mkSidebar(document.body)
|
||||
var sidebar = new Sidebar(document.body)
|
||||
|
||||
var gotoAnything = new gotoBuilder(config)
|
||||
var gotoAnything = new Router(config)
|
||||
|
||||
var infobox = new Infobox(config, sidebar, gotoAnything)
|
||||
gotoAnything.addTarget(infobox)
|
||||
|
@ -18,17 +18,19 @@ require(["map", "infobox/main"], function (Map, Infobox) {
|
|||
document.body.insertBefore(map.div, document.body.firstChild)
|
||||
gotoAnything.addTarget(map)
|
||||
|
||||
var meshstats = new Meshstats()
|
||||
sidebar.add(meshstats)
|
||||
|
||||
var urls = [ config.dataPath + 'nodes.json',
|
||||
config.dataPath + 'graph.json'
|
||||
]
|
||||
|
||||
var p = Promise.all(urls.map(getJSON))
|
||||
p.then(handle_data(config, linkScale, sidebar, infobox, map, gotoAnything))
|
||||
p.then(handle_data(config, linkScale, sidebar, meshstats, infobox, map, gotoAnything))
|
||||
})
|
||||
}
|
||||
|
||||
function handle_data(config, linkScale, sidebar, infobox, map, gotoAnything) {
|
||||
function handle_data(config, linkScale, sidebar, meshstats, infobox, map, gotoAnything) {
|
||||
return function (data) {
|
||||
var nodedict = data[0]
|
||||
var nodes = Object.keys(nodedict.nodes).map(function (key) { return nodedict.nodes[key] })
|
||||
|
@ -94,12 +96,12 @@ require(["map", "infobox/main"], function (Map, Infobox) {
|
|||
d.target.node.neighbours.push({ node: d.source.node, link: d })
|
||||
})
|
||||
|
||||
map.setData(linkScale, sidebar, now, newnodes, lostnodes, onlinenodes, links)
|
||||
map.setData(linkScale, now, newnodes, lostnodes, onlinenodes, links)
|
||||
meshstats.setData(nodes)
|
||||
|
||||
showMeshstats(sidebar, nodes)
|
||||
mkNodesList(sidebar, config.showContact, "firstseen", gotoAnything.node, "Neue Knoten", newnodes)
|
||||
mkNodesList(sidebar, config.showContact, "lastseen", gotoAnything.node, "Verschwundene Knoten", lostnodes)
|
||||
mkLinkList(sidebar, linkScale, gotoAnything.link, links)
|
||||
mkNodesList(sidebar.container, config.showContact, "firstseen", gotoAnything.node, "Neue Knoten", newnodes)
|
||||
mkNodesList(sidebar.container, config.showContact, "lastseen", gotoAnything.node, "Verschwundene Knoten", lostnodes)
|
||||
mkLinkList(sidebar.container, linkScale, gotoAnything.link, links)
|
||||
|
||||
var historyDict = { nodes: {}, links: {} }
|
||||
|
||||
|
@ -121,31 +123,6 @@ require(["map", "infobox/main"], function (Map, Infobox) {
|
|||
}
|
||||
}
|
||||
|
||||
function mkSidebar(el) {
|
||||
var sidebar = document.createElement("div")
|
||||
sidebar.classList.add("sidebar")
|
||||
el.appendChild(sidebar)
|
||||
|
||||
var button = document.createElement("button")
|
||||
sidebar.appendChild(button)
|
||||
|
||||
button.classList.add("sidebarhandle")
|
||||
button.onclick = function () {
|
||||
sidebar.classList.toggle("hidden")
|
||||
}
|
||||
|
||||
var container = document.createElement("div")
|
||||
container.classList.add("container")
|
||||
sidebar.appendChild(container)
|
||||
|
||||
container.getWidth = function () {
|
||||
var small = window.matchMedia("(max-width: 60em)");
|
||||
return small.matches ? 0 : sidebar.offsetWidth
|
||||
}
|
||||
|
||||
return container
|
||||
}
|
||||
|
||||
function mkLinkList(el, linkScale, gotoProxy, links) {
|
||||
if (links.length == 0)
|
||||
return
|
||||
|
@ -259,30 +236,6 @@ require(["map", "infobox/main"], function (Map, Infobox) {
|
|||
el.appendChild(table)
|
||||
}
|
||||
|
||||
function showMeshstats(el, nodes) {
|
||||
var h2 = document.createElement("h2")
|
||||
h2.textContent = "Übersicht"
|
||||
el.appendChild(h2)
|
||||
|
||||
var p = document.createElement("p")
|
||||
|
||||
var totalNodes = sum(nodes.filter(online).map(one))
|
||||
var totalClients = sum(nodes.filter(online).map( function (d) {
|
||||
return d.statistics.clients
|
||||
}))
|
||||
var totalGateways = sum(nodes.filter(online).filter( function (d) {
|
||||
return d.flags.gateway
|
||||
}).map(one))
|
||||
|
||||
p.textContent = totalNodes + " Knoten (online), " +
|
||||
totalClients + " Clients, " +
|
||||
totalGateways + " Gateways"
|
||||
|
||||
p.appendChild(document.createElement("br"))
|
||||
p.appendChild(document.createTextNode("Diese Daten sind " + moment.utc(nodes.timestamp).fromNow(true) + " alt."))
|
||||
el.appendChild(p)
|
||||
}
|
||||
|
||||
function pushHistory(d) {
|
||||
var s = "#!"
|
||||
|
||||
|
@ -320,7 +273,7 @@ require(["map", "infobox/main"], function (Map, Infobox) {
|
|||
}
|
||||
}
|
||||
|
||||
function gotoBuilder(config, nodes) {
|
||||
function Router(config, nodes) {
|
||||
var targets = []
|
||||
var self = this
|
||||
|
||||
|
|
|
@ -76,7 +76,7 @@ define(function () {
|
|||
var nodeDict = {}
|
||||
var linkDict = {}
|
||||
|
||||
self.setData = function (linkScale, sidebar, now, newnodes, lostnodes, onlinenodes, links) {
|
||||
self.setData = function (linkScale, now, newnodes, lostnodes, onlinenodes, links) {
|
||||
nodeDict = {}
|
||||
linkDict = {}
|
||||
|
||||
|
|
34
lib/meshstats.js
Normal file
34
lib/meshstats.js
Normal file
|
@ -0,0 +1,34 @@
|
|||
define(function () {
|
||||
return function () {
|
||||
var self = this
|
||||
var p
|
||||
|
||||
self.setData = function (nodes) {
|
||||
var totalNodes = sum(nodes.filter(online).map(one))
|
||||
var totalClients = sum(nodes.filter(online).map( function (d) {
|
||||
return d.statistics.clients
|
||||
}))
|
||||
var totalGateways = sum(nodes.filter(online).filter( function (d) {
|
||||
return d.flags.gateway
|
||||
}).map(one))
|
||||
|
||||
p.textContent = totalNodes + " Knoten (online), " +
|
||||
totalClients + " Clients, " +
|
||||
totalGateways + " Gateways"
|
||||
|
||||
p.appendChild(document.createElement("br"))
|
||||
p.appendChild(document.createTextNode("Diese Daten sind " + moment.utc(nodes.timestamp).fromNow(true) + " alt."))
|
||||
}
|
||||
|
||||
self.render = function (el) {
|
||||
var h2 = document.createElement("h2")
|
||||
h2.textContent = "Übersicht"
|
||||
el.appendChild(h2)
|
||||
|
||||
p = document.createElement("p")
|
||||
el.appendChild(p)
|
||||
}
|
||||
|
||||
return self
|
||||
}
|
||||
})
|
34
lib/sidebar.js
Normal file
34
lib/sidebar.js
Normal file
|
@ -0,0 +1,34 @@
|
|||
define([], function () {
|
||||
return function (el) {
|
||||
var self = this
|
||||
|
||||
var sidebar = document.createElement("div")
|
||||
sidebar.classList.add("sidebar")
|
||||
el.appendChild(sidebar)
|
||||
|
||||
var button = document.createElement("button")
|
||||
sidebar.appendChild(button)
|
||||
|
||||
button.classList.add("sidebarhandle")
|
||||
button.onclick = function () {
|
||||
sidebar.classList.toggle("hidden")
|
||||
}
|
||||
|
||||
var container = document.createElement("div")
|
||||
container.classList.add("container")
|
||||
sidebar.appendChild(container)
|
||||
|
||||
self.getWidth = function () {
|
||||
var small = window.matchMedia("(max-width: 60em)");
|
||||
return small.matches ? 0 : sidebar.offsetWidth
|
||||
}
|
||||
|
||||
self.add = function (d) {
|
||||
d.render(container)
|
||||
}
|
||||
|
||||
self.container = container
|
||||
|
||||
return self
|
||||
}
|
||||
})
|
Loading…
Reference in a new issue