refactor Infobox (own module)

lib/infobox/link.js

@@ -0,0 +1,26 @@
+define(function () {
+  return function (config, el, gotoAnything, d) {
+    var h2 = document.createElement("h2")
+    a1 = document.createElement("a")
+    a1.href = "#"
+    a1.onclick = gotoAnything.node(d.source.node)
+    a1.textContent = d.source.node.nodeinfo.hostname
+    h2.appendChild(a1)
+    h2.appendChild(document.createTextNode(" – "))
+    a2 = document.createElement("a")
+    a2.href = "#"
+    a2.onclick = gotoAnything.node(d.target.node)
+    a2.textContent = d.target.node.nodeinfo.hostname
+    h2.appendChild(a2)
+    el.appendChild(h2)
+
+    var attributes = document.createElement("table")
+    attributes.classList.add("attributes")
+
+    attributeEntry(attributes, "TQ", showTq(d))
+    attributeEntry(attributes, "Entfernung", showDistance(d))
+    attributeEntry(attributes, "VPN", d.vpn ? "ja" : "nein")
+
+    el.appendChild(attributes)
+  }
+})

lib/infobox/main.js

@@ -0,0 +1,43 @@
+define(["infobox/link", "infobox/node"], function (Link, Node) {
+  return function (config, sidebar, gotoAnything) {
+    var self = this
+    el = undefined
+
+    function destroy() {
+      if (el && el.parentNode) {
+        el.parentNode.removeChild(el)
+        el = undefined
+      }
+    }
+
+    function create() {
+      destroy()
+
+      el = document.createElement("div")
+      sidebar.insertBefore(el, sidebar.firstChild)
+
+      el.scrollIntoView(false)
+      el.classList.add("infobox")
+      el.destroy = destroy
+
+      var closeButton = document.createElement("button")
+      closeButton.classList.add("close")
+      closeButton.onclick = gotoAnything.reset
+      el.appendChild(closeButton)
+    }
+
+    self.resetView = destroy
+
+    self.gotoNode = function (d) {
+      create()
+      new Node(config, el, gotoAnything, d)
+    }
+
+    self.gotoLink = function (d) {
+      create()
+      new Link(config, el, gotoAnything, d)
+    }
+
+    return self
+  }
+})

lib/infobox/node.js

@@ -0,0 +1,196 @@
+define(function () {
+  return function(config, el, gotoAnything, d) {
+    var h2 = document.createElement("h2")
+    h2.textContent = d.nodeinfo.hostname
+    var span = document.createElement("span")
+    span.classList.add(d.flags.online ? "online" : "offline")
+    span.textContent = " (" + (d.flags.online ? "online" : "offline, " + d.lastseen.fromNow(true)) + ")"
+    h2.appendChild(span)
+    el.appendChild(h2)
+
+    var attributes = document.createElement("table")
+    attributes.classList.add("attributes")
+
+    attributeEntry(attributes, "Gateway", d.flags.gateway ? "ja" : null)
+    attributeEntry(attributes, "In der Karte", has_location(d) ? "ja" : "nein")
+
+    if (config.showContact)
+      attributeEntry(attributes, "Kontakt", dictGet(d.nodeinfo, ["owner", "contact"]))
+
+    attributeEntry(attributes, "Hardware",  dictGet(d.nodeinfo, ["hardware", "model"]))
+    attributeEntry(attributes, "Primäre MAC", dictGet(d.nodeinfo, ["network", "mac"]))
+    attributeEntry(attributes, "Firmware", showFirmware(d))
+    attributeEntry(attributes, "Uptime", showUptime(d))
+    attributeEntry(attributes, "Teil des Netzes", showFirstseen(d))
+    attributeEntry(attributes, "Arbeitsspeicher", showRAM(d))
+    attributeEntry(attributes, "IP Adressen", showIPs(d))
+    attributeEntry(attributes, "Clients", showClients(d))
+    el.appendChild(attributes)
+
+    if (d.neighbours.length > 0) {
+      var h3 = document.createElement("h3")
+      h3.textContent = "Nachbarknoten (" + d.neighbours.length + ")"
+      el.appendChild(h3)
+
+      var table = document.createElement("table")
+      var thead = document.createElement("thead")
+
+      var tr = document.createElement("tr")
+      var th1 = document.createElement("th")
+      th1.textContent = "Knoten"
+      th1.classList.add("sort-default")
+      tr.appendChild(th1)
+
+      var th2 = document.createElement("th")
+      th2.textContent = "TQ"
+      tr.appendChild(th2)
+
+      var th3 = document.createElement("th")
+      th3.textContent = "Entfernung"
+      tr.appendChild(th3)
+
+      thead.appendChild(tr)
+      table.appendChild(thead)
+
+      var tbody = document.createElement("tbody")
+
+      d.neighbours.forEach( function (d) {
+        var tr = document.createElement("tr")
+
+        var td1 = document.createElement("td")
+        var a1 = document.createElement("a")
+        a1.classList.add("hostname")
+        a1.textContent = d.node.nodeinfo.hostname
+        a1.href = "#"
+        a1.onclick = gotoAnything.node(d.node)
+        td1.appendChild(a1)
+
+        if (d.link.vpn)
+          td1.appendChild(document.createTextNode(" (VPN)"))
+
+        if (has_location(d.node)) {
+          var span = document.createElement("span")
+          span.classList.add("icon")
+          span.classList.add("ion-location")
+          td1.appendChild(span)
+        }
+
+        tr.appendChild(td1)
+
+        var td2 = document.createElement("td")
+        var a2 = document.createElement("a")
+        a2.href = "#"
+        a2.textContent = showTq(d.link)
+        a2.onclick = gotoAnything.link(d.link)
+        td2.appendChild(a2)
+        tr.appendChild(td2)
+
+        var td3 = document.createElement("td")
+        var a3 = document.createElement("a")
+        a3.href = "#"
+        a3.textContent = showDistance(d.link)
+        a3.onclick = gotoAnything.link(d.link)
+        td3.appendChild(a3)
+        td3.setAttribute("data-sort", d.link.distance !== undefined ? -d.link.distance : 1)
+        tr.appendChild(td3)
+
+        tbody.appendChild(tr)
+      })
+
+      table.appendChild(tbody)
+
+      new Tablesort(table)
+
+      el.appendChild(table)
+    }
+
+    function showFirmware(d) {
+      var release = dictGet(d.nodeinfo, ["software", "firmware", "release"])
+      var base = dictGet(d.nodeinfo, ["software", "firmware", "base"])
+
+      if (release === null || base === null)
+        return
+
+      return release + " / " + base
+    }
+
+    function showUptime(d) {
+      if (!("uptime" in d.statistics))
+        return
+
+      return moment.duration(d.statistics.uptime, "seconds").humanize()
+    }
+
+    function showFirstseen(d) {
+      if (!("firstseen" in d))
+        return
+
+      return d.firstseen.fromNow(true)
+    }
+
+    function showClients(d) {
+      if (!d.flags.online)
+        return
+
+      return function (el) {
+        el.appendChild(document.createTextNode(d.statistics.clients > 0 ? d.statistics.clients : "keine"))
+        el.appendChild(document.createElement("br"))
+
+        var span = document.createElement("span")
+        span.classList.add("clients")
+        span.textContent = " ".repeat(d.statistics.clients)
+        el.appendChild(span)
+      }
+    }
+
+    function showIPs(d) {
+      var ips = dictGet(d.nodeinfo, ["network", "addresses"])
+      if (ips === null)
+        return
+
+      ips.sort()
+
+      return function (el) {
+        ips.forEach( function (ip, i) {
+          var link = !ip.startsWith("fe80:")
+
+          if (i > 0)
+            el.appendChild(document.createElement("br"))
+
+          if (link) {
+            var a = document.createElement("a")
+            a.href = "http://[" + ip + "]/"
+            a.textContent = ip
+            el.appendChild(a)
+          } else
+            el.appendChild(document.createTextNode(ip))
+        })
+      }
+    }
+
+    function showRAM(d) {
+      if (!("memory_usage" in d.statistics))
+        return
+
+      return function (el) {
+        el.appendChild(showBar("memory-usage", d.statistics.memory_usage))
+      }
+    }
+
+    function showBar(className, v) {
+      var span = document.createElement("span")
+      span.classList.add("bar")
+      span.classList.add(className)
+
+      var bar = document.createElement("span")
+      bar.style.width = (v * 100) + "%"
+      span.appendChild(bar)
+
+      var label = document.createElement("label")
+      label.textContent = (Math.round(v * 100)) + " %"
+      span.appendChild(label)
+
+      return span
+    }
+  }
+})