diff --git a/lib/linklist.js b/lib/linklist.js new file mode 100644 index 0000000..d5fa5f8 --- /dev/null +++ b/lib/linklist.js @@ -0,0 +1,75 @@ +define(function () { + return function(linkScale, gotoAnything) { + var self = this + var el + + self.render = function (d) { + el = document.createElement("div") + d.appendChild(el) + } + + self.setData = function (links) { + if (links.length == 0) + return + + var h2 = document.createElement("h2") + h2.textContent = "Verbindungen" + el.appendChild(h2) + + var table = document.createElement("table") + var thead = document.createElement("thead") + + var tr = document.createElement("tr") + var th1 = document.createElement("th") + th1.textContent = "Knoten" + tr.appendChild(th1) + + var th2 = document.createElement("th") + th2.textContent = "TQ" + tr.appendChild(th2) + + var th3 = document.createElement("th") + th3.textContent = "Entfernung" + th3.classList.add("sort-default") + tr.appendChild(th3) + + thead.appendChild(tr) + + table.appendChild(thead) + + var tbody = document.createElement("tbody") + + links.forEach( function (d) { + var row = document.createElement("tr") + var td1 = document.createElement("td") + var a = document.createElement("a") + a.textContent = d.source.node.nodeinfo.hostname + " – " + d.target.node.nodeinfo.hostname + a.href = "#" + a.onclick = gotoAnything.link(d) + td1.appendChild(a) + row.appendChild(td1) + + if (d.vpn) + td1.appendChild(document.createTextNode(" (VPN)")) + + var td2 = document.createElement("td") + td2.textContent = showTq(d) + td2.style.color = linkScale(d.tq) + row.appendChild(td2) + + var td3 = document.createElement("td") + td3.textContent = showDistance(d) + td3.setAttribute("data-sort", d.distance !== undefined ? -d.distance : 1) + row.appendChild(td3) + + tbody.appendChild(row) + }) + + table.appendChild(tbody) + + new Tablesort(table) + + el.appendChild(table) + } + } +}) diff --git a/lib/main.js b/lib/main.js index a05ee9b..faf76f6 100644 --- a/lib/main.js +++ b/lib/main.js @@ -1,4 +1,5 @@ -require(["map", "sidebar", "meshstats", "infobox/main"], function (Map, Sidebar, Meshstats, Infobox) { +require(["map", "sidebar", "meshstats", "linklist", "infobox/main"], +function (Map, Sidebar, Meshstats, Linklist, Infobox) { main() function main() { @@ -21,16 +22,19 @@ require(["map", "sidebar", "meshstats", "infobox/main"], function (Map, Sidebar, var meshstats = new Meshstats() sidebar.add(meshstats) + var linklist = new Linklist(linkScale, gotoAnything) + sidebar.add(linklist) + var urls = [ config.dataPath + 'nodes.json', config.dataPath + 'graph.json' ] var p = Promise.all(urls.map(getJSON)) - p.then(handle_data(config, linkScale, sidebar, meshstats, infobox, map, gotoAnything)) + p.then(handle_data(config, linkScale, sidebar, meshstats, linklist, infobox, map, gotoAnything)) }) } - function handle_data(config, linkScale, sidebar, meshstats, infobox, map, gotoAnything) { + function handle_data(config, linkScale, sidebar, meshstats, linklist, infobox, map, gotoAnything) { return function (data) { var nodedict = data[0] var nodes = Object.keys(nodedict.nodes).map(function (key) { return nodedict.nodes[key] }) @@ -98,10 +102,10 @@ require(["map", "sidebar", "meshstats", "infobox/main"], function (Map, Sidebar, map.setData(linkScale, now, newnodes, lostnodes, onlinenodes, links) meshstats.setData(nodes) + linklist.setData(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: {} } @@ -123,70 +127,6 @@ require(["map", "sidebar", "meshstats", "infobox/main"], function (Map, Sidebar, } } - function mkLinkList(el, linkScale, gotoProxy, links) { - if (links.length == 0) - return - - var h2 = document.createElement("h2") - h2.textContent = "Verbindungen" - el.appendChild(h2) - - var table = document.createElement("table") - var thead = document.createElement("thead") - - var tr = document.createElement("tr") - var th1 = document.createElement("th") - th1.textContent = "Knoten" - tr.appendChild(th1) - - var th2 = document.createElement("th") - th2.textContent = "TQ" - tr.appendChild(th2) - - var th3 = document.createElement("th") - th3.textContent = "Entfernung" - th3.classList.add("sort-default") - tr.appendChild(th3) - - thead.appendChild(tr) - - table.appendChild(thead) - - var tbody = document.createElement("tbody") - - links.forEach( function (d) { - var row = document.createElement("tr") - var td1 = document.createElement("td") - var a = document.createElement("a") - a.textContent = d.source.node.nodeinfo.hostname + " – " + d.target.node.nodeinfo.hostname - a.href = "#" - a.onclick = gotoProxy(d) - td1.appendChild(a) - row.appendChild(td1) - - if (d.vpn) - td1.appendChild(document.createTextNode(" (VPN)")) - - var td2 = document.createElement("td") - td2.textContent = showTq(d) - td2.style.color = linkScale(d.tq) - row.appendChild(td2) - - var td3 = document.createElement("td") - td3.textContent = showDistance(d) - td3.setAttribute("data-sort", d.distance !== undefined ? -d.distance : 1) - row.appendChild(td3) - - tbody.appendChild(row) - }) - - table.appendChild(tbody) - - new Tablesort(table) - - el.appendChild(table) - } - function mkNodesList(el, showContact, tf, gotoProxy, title, list) { if (list.length == 0) return