4
0

proportions.js 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187
  1. define(["chroma-js", "virtual-dom", "numeral-intl"],
  2. function (Chroma, V, numeral) {
  3. return function (config) {
  4. var self = this
  5. var fwTable, hwTable, geoTable, autoTable, gwTable
  6. var scale = Chroma.scale("YlGnBu").mode("lab")
  7. function showStatGlobal(o) {
  8. var content, caption
  9. if (o.thumbnail) {
  10. content = document.createElement("img")
  11. content.src = o.thumbnail
  12. }
  13. if (o.caption) {
  14. caption = o.caption
  15. if (!content)
  16. content = document.createTextNode(caption)
  17. }
  18. var p = document.createElement("p")
  19. if (o.href) {
  20. var link = document.createElement("a")
  21. link.target = "_blank"
  22. link.href = o.href
  23. link.appendChild(content)
  24. if (caption && o.thumbnail)
  25. link.title = caption
  26. p.appendChild(link)
  27. } else
  28. p.appendChild(content)
  29. return p
  30. }
  31. function count(nodes, key, f) {
  32. var dict = {}
  33. nodes.forEach( function (d) {
  34. var v = dictGet(d, key.slice(0))
  35. if (f !== undefined)
  36. v = f(v)
  37. if (v === null)
  38. return
  39. dict[v] = 1 + (v in dict ? dict[v] : 0)
  40. })
  41. return Object.keys(dict).map(function (d) { return [d, dict[d]] })
  42. }
  43. function fillTable(table, data) {
  44. if (!table.last)
  45. table.last = V.h("table")
  46. var max = 0
  47. data.forEach(function (d) {
  48. if (d[1] > max)
  49. max = d[1]
  50. })
  51. var items = data.map(function (d) {
  52. var v = d[1] / max
  53. var c1 = Chroma.contrast(scale(v), "white")
  54. var c2 = Chroma.contrast(scale(v), "black")
  55. var th = V.h("th", d[0])
  56. var td = V.h("td", V.h("span", {style: {
  57. width: Math.round(v * 100) + "%",
  58. backgroundColor: scale(v).hex(),
  59. color: c1 > c2 ? "white" : "black"
  60. }}, numeral(d[1]).format("0,0")))
  61. return V.h("tr", [th, td])
  62. })
  63. var tableNew = V.h("table", items)
  64. table = V.patch(table, V.diff(table.last, tableNew))
  65. table.last = tableNew
  66. }
  67. self.setData = function (data) {
  68. var onlineNodes = data.nodes.all.filter(online)
  69. var nodes = onlineNodes.concat(data.nodes.lost)
  70. var nodeDict = {}
  71. data.nodes.all.forEach(function (d) {
  72. nodeDict[d.nodeinfo.node_id] = d
  73. })
  74. var fwDict = count(nodes, ["nodeinfo", "software", "firmware", "release"])
  75. var hwDict = count(nodes, ["nodeinfo", "hardware", "model"])
  76. var geoDict = count(nodes, ["nodeinfo", "location"], function (d) {
  77. if (d)
  78. return "ja"
  79. else
  80. return "nein"
  81. })
  82. var autoDict = count(nodes, ["nodeinfo", "software", "autoupdater"], function (d) {
  83. if (d === null)
  84. return null
  85. else if (d.enabled)
  86. return d.branch
  87. else
  88. return "(deaktiviert)"
  89. })
  90. var gwDict = count(onlineNodes, ["statistics", "gateway"], function (d) {
  91. if (d === null)
  92. return null
  93. if (d in nodeDict)
  94. return nodeDict[d].nodeinfo.hostname
  95. return d
  96. })
  97. fillTable(fwTable, fwDict.sort(function (a, b) { return b[1] - a[1] }))
  98. fillTable(hwTable, hwDict.sort(function (a, b) { return b[1] - a[1] }))
  99. fillTable(geoTable, geoDict.sort(function (a, b) { return b[1] - a[1] }))
  100. fillTable(autoTable, autoDict.sort(function (a, b) { return b[1] - a[1] }))
  101. fillTable(gwTable, gwDict.sort(function (a, b) { return b[1] - a[1] }))
  102. }
  103. self.render = function (el) {
  104. var h2
  105. h2 = document.createElement("h2")
  106. h2.textContent = "Firmwareversionen"
  107. el.appendChild(h2)
  108. fwTable = document.createElement("table")
  109. fwTable.classList.add("proportion")
  110. el.appendChild(fwTable)
  111. h2 = document.createElement("h2")
  112. h2.textContent = "Hardwaremodelle"
  113. el.appendChild(h2)
  114. hwTable = document.createElement("table")
  115. hwTable.classList.add("proportion")
  116. el.appendChild(hwTable)
  117. h2 = document.createElement("h2")
  118. h2.textContent = "Auf der Karte sichtbar"
  119. el.appendChild(h2)
  120. geoTable = document.createElement("table")
  121. geoTable.classList.add("proportion")
  122. el.appendChild(geoTable)
  123. h2 = document.createElement("h2")
  124. h2.textContent = "Autoupdater"
  125. el.appendChild(h2)
  126. autoTable = document.createElement("table")
  127. autoTable.classList.add("proportion")
  128. el.appendChild(autoTable)
  129. h2 = document.createElement("h2")
  130. h2.textContent = "Gewählter Gateway"
  131. el.appendChild(h2)
  132. gwTable = document.createElement("table")
  133. gwTable.classList.add("proportion")
  134. el.appendChild(gwTable)
  135. if (config.globalInfos)
  136. config.globalInfos.forEach( function (globalInfo) {
  137. h2 = document.createElement("h2")
  138. h2.textContent = globalInfo.name
  139. el.appendChild(h2)
  140. el.appendChild(showStatGlobal(globalInfo))
  141. })
  142. }
  143. return self
  144. }
  145. })