[TASK] Split clients into 2,4 Ghz, 5 Ghz & others

lib/infobox/main.js

@@ -55,7 +55,7 @@ define(['infobox/link', 'infobox/node', 'infobox/location'], function (Link, Nod
       location(config, el, router, d);
     };
 
-    self.setData =  function setData(d) {
+    self.setData = function setData(d) {
       if (typeof node === 'object') {
         node.setData(d);
       }
@@ -64,7 +64,6 @@ define(['infobox/link', 'infobox/node', 'infobox/location'], function (Link, Nod
       }
     };
 
-
     return self;
   };
 });

lib/infobox/node.js

@@ -69,14 +69,29 @@ define(['sorttable', 'snabbdom', 'd3-interpolate', 'moment', 'helper'],
       }
 
       var clients = [
-        d.clients > 0 ? d.clients : _.t('none'),
+        V.h('span', [
-        V.h('br')
+          d.clients > 0 ? d.clients : _.t('none'),
+          V.h('br'),
+          V.h('i', { props: { className: 'ion-people', title: _.t('node.clients') } })
+        ]),
+        V.h('span', [
+          d.clients_wifi24,
+          V.h('br'),
+          '2,4 Ghz'
+        ]),
+        V.h('span', [
+          d.clients_wifi5,
+          V.h('br'),
+          '5 Ghz'
+        ]),
+        V.h('span', [
+          d.clients_other,
+          V.h('br'),
+          _.t('other')
+        ])
       ];
 
-      for (var i = 0; i < d.clients; i++) {
+      return V.h('td', { props: { className: 'clients' } }, clients);
-        clients.push(V.h('i', { props: { className: 'ion-person' } }));
-      }
-      return V.h('td', clients);
     }
 
     function showIPs(d) {

locale/en.json

@@ -86,5 +86,6 @@
   "yes": "yes",
   "no": "no",
   "unknown": "unknown",
+  "others": "others",
   "none": "none"
 }

scss/modules/_infobox.scss

@@ -1,7 +1,15 @@
 .infobox {
   .clients {
-    color: $color-online;
+    display: flex;
-    font-family: $font-family-icons;
+
+    span {
+      flex-grow: 1;
+      text-align: center;
+    }
+
+    .ion-people {
+      font-size: 1.5em;
+    }
   }
 
   input,