diff --git a/history.html b/history.html
index d5a6228..b41b8f5 100644
--- a/history.html
+++ b/history.html
@@ -58,11 +58,11 @@
}
.hostname.online {
- color: #558020;
+ color: #558020 !important;
}
.hostname.offline {
- color: #D43E2A;
+ color: #D43E2A !important;
}
#map {
@@ -104,6 +104,10 @@
text-align: right;
}
+ #lists a {
+ color: #1566A9;
+ }
+
#container {
display: flex;
flex-direction: row-reverse;
diff --git a/history.js b/history.js
index 48f08b9..5d0e034 100644
--- a/history.js
+++ b/history.js
@@ -115,9 +115,6 @@ function handle_data(config, map) {
var onlinenodes = subtract(nodes.filter(online).filter(has_location), newnodes)
- addToList(document.getElementById("newnodes"), config.showContact, "firstseen", newnodes)
- addToList(document.getElementById("lostnodes"), config.showContact, "lastseen", lostnodes)
-
var graph = data[1].batadv
var nodes = data[0].nodes
@@ -155,9 +152,13 @@ function handle_data(config, map) {
return a.distance - b.distance
}).reverse().slice(0, Math.ceil(config.longLinkPercentile * graph.length))
- addToLongLinksList(document.getElementById("longlinks"), longlinks)
- mkmap(map, newnodes, lostnodes, onlinenodes, graph)
+ var markers = mkmap(map, newnodes, lostnodes, onlinenodes, graph)
+ console.log(markers)
+
+ addToList(document.getElementById("newnodes"), config.showContact, "firstseen", markers, newnodes)
+ addToList(document.getElementById("lostnodes"), config.showContact, "lastseen", markers, lostnodes)
+ addToLongLinksList(document.getElementById("longlinks"), markers, longlinks)
}
}
@@ -173,6 +174,10 @@ function showTq(d) {
return (new Intl.NumberFormat("de-DE", opts).format(d.tq)) + " TQ"
}
+function linkId(d) {
+ return d.source.node.nodeinfo.node_id + "-" + d.target.node.nodeinfo.node_id
+}
+
function mkmap(map, newnodes, lostnodes, onlinenodes, graph) {
L.control.zoom({ position: "topright" }).addTo(map)
@@ -183,7 +188,7 @@ function mkmap(map, newnodes, lostnodes, onlinenodes, graph) {
maxZoom: 18
}).addTo(map)
- addLinksToMap(map, graph)
+ var markersDict = addLinksToMap(map, graph)
var nodes = newnodes.concat(lostnodes).filter( function (d) {
return "location" in d.nodeinfo
@@ -201,6 +206,8 @@ function mkmap(map, newnodes, lostnodes, onlinenodes, graph) {
m.bindPopup(d.nodeinfo.hostname)
+ markersDict[d.nodeinfo.node_id] = m
+
return m
})
@@ -216,6 +223,8 @@ function mkmap(map, newnodes, lostnodes, onlinenodes, graph) {
m.bindPopup(d.nodeinfo.hostname)
+ markersDict[d.nodeinfo.node_id] = m
+
return m
})
@@ -223,9 +232,29 @@ function mkmap(map, newnodes, lostnodes, onlinenodes, graph) {
var group_online = L.featureGroup(onlinemarkers).addTo(map)
map.fitBounds(group.getBounds())
+
+ var funcDict = {}
+
+ Object.keys(markersDict).map( function(k) {
+ funcDict[k] = function (d) {
+ var m = markersDict[k]
+ if ("getBounds" in m) {
+ var bounds = m.getBounds()
+ map.fitBounds(bounds)
+ m.openPopup(bounds.getCenter())
+ } else {
+ map.setView(m.getLatLng(), map.getMaxZoom())
+ m.openPopup()
+ }
+ }
+ });
+
+ return funcDict
}
function addLinksToMap(map, graph) {
+ var markersDict = {}
+
var scale = chroma.scale(['green', 'orange', 'red']).domain([1, 10])
var lines = graph.map( function (d) {
@@ -237,17 +266,25 @@ function addLinksToMap(map, graph) {
line.bindPopup(d.source.node.nodeinfo.hostname + " – " + d.target.node.nodeinfo.hostname + "
" + showDistance(d) + "")
+ markersDict[linkId(d)] = line
+
return line
})
var group = L.featureGroup(lines).addTo(map)
+
+ return markersDict
}
-function addToLongLinksList(el, links) {
+function addToLongLinksList(el, markers, links) {
links.forEach( function (d) {
var row = document.createElement("tr")
var td1 = document.createElement("td")
- td1.textContent = d.source.node.nodeinfo.hostname + " – " + d.target.node.nodeinfo.hostname
+ var a = document.createElement("a")
+ a.textContent = d.source.node.nodeinfo.hostname + " – " + d.target.node.nodeinfo.hostname
+ a.href = "#"
+ a.onclick = markers[linkId(d)]
+ td1.appendChild(a)
row.appendChild(td1)
var td2 = document.createElement("td")
@@ -262,17 +299,19 @@ function addToLongLinksList(el, links) {
})
}
-function addToList(el, showContact, tf, list) {
+function addToList(el, showContact, tf, markers, list) {
list.forEach( function (d) {
var time = moment(d[tf]).fromNow()
var row = document.createElement("tr")
var td1 = document.createElement("td")
- var span = document.createElement("span")
- span.classList.add("hostname")
- span.classList.add(d.flags.online ? "online" : "offline")
- span.textContent = d.nodeinfo.hostname
- td1.appendChild(span)
+ var a = document.createElement("a")
+ a.classList.add("hostname")
+ a.classList.add(d.flags.online ? "online" : "offline")
+ a.textContent = d.nodeinfo.hostname
+ a.href = "#"
+ a.onclick = markers[d.nodeinfo.node_id]
+ td1.appendChild(a)
if ("location" in d.nodeinfo) {
var span = document.createElement("span")