diff --git a/assets/icons/fonts/icon.ttf b/assets/icons/fonts/icon.ttf
index bf938cc..cd41d4d 100644
Binary files a/assets/icons/fonts/icon.ttf and b/assets/icons/fonts/icon.ttf differ
diff --git a/assets/icons/fonts/icon.woff b/assets/icons/fonts/icon.woff
index ef0bc9e..03e7240 100644
Binary files a/assets/icons/fonts/icon.woff and b/assets/icons/fonts/icon.woff differ
diff --git a/assets/icons/fonts/icon.woff2 b/assets/icons/fonts/icon.woff2
index 6d92253..6237616 100644
Binary files a/assets/icons/fonts/icon.woff2 and b/assets/icons/fonts/icon.woff2 differ
diff --git a/assets/icons/icon.scss b/assets/icons/icon.scss
index af30a52..a3ec26b 100644
--- a/assets/icons/icon.scss
+++ b/assets/icons/icon.scss
@@ -12,8 +12,9 @@ $cache-breaker: unique-id();
url('fonts/icon.ttf?rel=#{$cache-breaker}') format('truetype');
}
-[class^='ion-'], [class*=' ion-'] {
- &:before {
+[class^='ion-'],
+[class*=' ion-'] {
+ &::before {
display: inline-block;
font-family: $font-family-icons;
font-style: normal;
@@ -27,22 +28,24 @@ $cache-breaker: unique-id();
}
}
-@include icon('android-add', '\f2c7');
@include icon('chevron-left', '\f124');
@include icon('chevron-right', '\f125');
@include icon('pin', '\f3a3');
@include icon('wifi', '\f25c');
@include icon('eye', '\f133');
-@include icon('ios-arrow-thin-left', '\f3d5');
-@include icon('ios-arrow-thin-right', '\f3d6');
-@include icon('arrow-up-b', '\f10d');
-@include icon('arrow-down-b', '\f104');
-@include icon('android-locate', '\f2e9');
-@include icon('android-close', '\f2d7');
-@include icon('android-lock', '\f392');
-@include icon('ios-copy', '\f41c');
+@include icon('up-b', '\f10d');
+@include icon('down-b', '\f104');
+@include icon('locate', '\f2e9');
+@include icon('close', '\f2d7');
@include icon('location', '\f456');
-@include icon('android-remove', '\f2f4');
-@include icon('ios-person', '\f47e');
@include icon('layer', '\f229');
@include icon('filter', '\f38B');
+@include icon('connection-bars', '\f274');
+@include icon('share-alt', '\f3ac');
+@include icon('clipboard', '\f376');
+@include icon('people', '\f39e');
+@include icon('person', '\f3a0');
+@include icon('time', '\f3b3');
+@include icon('arrow-resize', '\f264');
+@include icon('arrow-left-c', '\f108');
+@include icon('arrow-right-c', '\f10b');
diff --git a/lib/filters/filtergui.js b/lib/filters/filtergui.js
index ebb5ce3..5dc033e 100644
--- a/lib/filters/filtergui.js
+++ b/lib/filters/filtergui.js
@@ -21,7 +21,7 @@ define(function () {
d.render(li);
var button = document.createElement('button');
- button.classList.add('ion-android-close');
+ button.classList.add('ion-close');
button.onclick = function onclick() {
distributor.removeFilter(d);
};
diff --git a/lib/infobox/link.js b/lib/infobox/link.js
index 9d10c1b..08ac18a 100644
--- a/lib/infobox/link.js
+++ b/lib/infobox/link.js
@@ -27,7 +27,7 @@ define(['helper'], function (helper) {
h2.appendChild(a1);
var arrow = document.createElement('spam');
- arrow.classList.add('ion-ios-arrow-thin-right');
+ arrow.classList.add('ion-arrow-right-c');
h2.appendChild(arrow);
var a2 = document.createElement('a');
diff --git a/lib/infobox/location.js b/lib/infobox/location.js
index 802893b..fbaf544 100644
--- a/lib/infobox/location.js
+++ b/lib/infobox/location.js
@@ -39,7 +39,7 @@ define(['helper'], function (helper) {
heading.textContent = title;
box.appendChild(heading);
var btn = document.createElement('button');
- btn.classList.add('ion-ios-copy');
+ btn.classList.add('ion-clipboard');
btn.title = _.t('location.copy');
btn.onclick = function onclick() {
copy2clip(inputElem.id);
diff --git a/lib/infobox/main.js b/lib/infobox/main.js
index d358fc9..0a0ba39 100644
--- a/lib/infobox/main.js
+++ b/lib/infobox/main.js
@@ -27,7 +27,7 @@ define(['infobox/link', 'infobox/node', 'infobox/location'], function (link, nod
var closeButton = document.createElement('button');
closeButton.classList.add('close');
- closeButton.classList.add('ion-android-close');
+ closeButton.classList.add('ion-close');
closeButton.onclick = router.reset;
el.appendChild(closeButton);
}
diff --git a/lib/infobox/node.js b/lib/infobox/node.js
index c10dff1..b70bfd2 100644
--- a/lib/infobox/node.js
+++ b/lib/infobox/node.js
@@ -83,7 +83,7 @@ define(['sorttable', 'virtual-dom', 'chroma-js', 'moment', 'helper'],
var span = document.createElement('span');
span.classList.add('clients');
- span.innerHTML = ''.repeat(d.statistics.clients);
+ span.innerHTML = ''.repeat(d.statistics.clients);
el.appendChild(span);
};
}
@@ -189,12 +189,13 @@ define(['sorttable', 'virtual-dom', 'chroma-js', 'moment', 'helper'],
return function (config, el, router, d) {
var linkScale = chroma.scale(chroma.bezier(['#04C714', '#FF5500', '#F02311'])).domain([1, 5]);
+
function renderNeighbourRow(n) {
var icons = [];
var name = [];
var unknown = !(n.node);
- icons.push(V.h('span', { className: n.incoming ? 'ion-ios-arrow-thin-left' : 'ion-ios-arrow-thin-right' }));
+ icons.push(V.h('span', { className: n.incoming ? 'ion-arrow-left-c' : 'ion-arrow-right-c' }));
if (!unknown && helper.hasLocation(n.node)) {
icons.push(V.h('span', { className: 'ion-location' }));
}
@@ -207,10 +208,11 @@ define(['sorttable', 'virtual-dom', 'chroma-js', 'moment', 'helper'],
var td1 = V.h('td', icons);
var td2 = V.h('td', name);
- var td3 = V.h('td', { style: { color: linkScale(n.link.tq).hex() } }, helper.showTq(n.link));
- var td4 = V.h('td', helper.showDistance(n.link));
+ var td3 = V.h('td', (n.node.statistics.clients ? n.node.statistics.clients.toString() : '0'));
+ var td4 = V.h('td', { style: { color: linkScale(n.link.tq).hex() } }, helper.showTq(n.link));
+ var td5 = V.h('td', helper.showDistance(n.link));
- return V.h('tr', [td1, td2, td3, td4]);
+ return V.h('tr', [td1, td2, td3, td4, td5]);
}
var h2 = document.createElement('h2');
@@ -268,14 +270,24 @@ define(['sorttable', 'virtual-dom', 'chroma-js', 'moment', 'helper'],
return a.node.nodeinfo.hostname.localeCompare(b.node.nodeinfo.hostname);
},
reverse: false
+ }, {
+ name: 'node.clients',
+ class: 'ion-people',
+ sort: function (a, b) {
+ return ('clients' in a.node.statistics ? a.node.statistics.clients : -1) -
+ ('clients' in b.node.statistics ? b.node.statistics.clients : -1);
+ },
+ reverse: true
}, {
name: 'node.tq',
+ class: 'ion-connection-bars',
sort: function (a, b) {
return a.link.tq - b.link.tq;
},
reverse: true
}, {
name: 'node.distance',
+ class: 'ion-arrow-resize',
sort: function (a, b) {
return (a.link.distance === undefined ? -1 : a.link.distance) -
(b.link.distance === undefined ? -1 : b.link.distance);
diff --git a/lib/linklist.js b/lib/linklist.js
index c1c2e9d..88dfc32 100644
--- a/lib/linklist.js
+++ b/lib/linklist.js
@@ -13,12 +13,14 @@ define(['sorttable', 'virtual-dom', 'helper'], function (SortTable, V, helper) {
reverse: false
}, {
name: 'node.tq',
+ class: 'ion-connection-bars',
sort: function (a, b) {
return a.tq - b.tq;
},
reverse: true
}, {
name: 'node.distance',
+ class: 'ion-arrow-resize',
sort: function (a, b) {
return (a.distance === undefined ? -1 : a.distance) -
(b.distance === undefined ? -1 : b.distance);
diff --git a/lib/map.js b/lib/map.js
index e0e6091..23dcd22 100644
--- a/lib/map.js
+++ b/lib/map.js
@@ -23,7 +23,7 @@ define(['map/clientlayer', 'map/labelslayer',
},
onAdd: function () {
- var button = L.DomUtil.create('button', 'ion-android-locate shadow');
+ var button = L.DomUtil.create('button', 'ion-locate shadow');
button.setAttribute('data-tooltip', _.t('button.tracking'));
L.DomEvent.disableClickPropagation(button);
L.DomEvent.addListener(button, 'click', this.onClick, this);
diff --git a/lib/nodelist.js b/lib/nodelist.js
index 2a141cd..2afc083 100644
--- a/lib/nodelist.js
+++ b/lib/nodelist.js
@@ -35,18 +35,21 @@ define(['sorttable', 'virtual-dom', 'helper'], function (SortTable, V, helper) {
reverse: false
}, {
name: 'node.uptime',
+ class: 'ion-time',
sort: function (a, b) {
return a.uptime - b.uptime;
},
reverse: true
}, {
name: 'node.links',
+ class: 'ion-share-alt',
sort: function (a, b) {
return a.meshlinks - b.meshlinks;
},
reverse: true
}, {
name: 'node.clients',
+ class: 'ion-people',
sort: function (a, b) {
return ('clients' in a.statistics ? a.statistics.clients : -1) -
('clients' in b.statistics ? b.statistics.clients : -1);
diff --git a/lib/sorttable.js b/lib/sorttable.js
index 9665594..61ab8a0 100644
--- a/lib/sorttable.js
+++ b/lib/sorttable.js
@@ -25,16 +25,23 @@ define(['virtual-dom'], function (V) {
if (data.length !== 0) {
var th = headings.map(function (d, i) {
+ var name = _.t(d.name);
var properties = {
onclick: sortTableHandler(i),
className: 'sort-header'
};
+ if (d.class) {
+ properties.className += ' ' + d.class;
+ properties.title = name;
+ name = '';
+ }
+
if (sortIndex === i) {
properties.className += sortReverse ? ' sort-up' : ' sort-down';
}
- return V.h('th', properties, _.t(d.name));
+ return V.h('th', properties, name);
});
var links = data.slice(0).sort(headings[sortIndex].sort);
diff --git a/scss/modules/_table.scss b/scss/modules/_table.scss
index c40fc95..c024d7d 100644
--- a/scss/modules/_table.scss
+++ b/scss/modules/_table.scss
@@ -35,6 +35,10 @@ th {
th {
font-weight: bold;
+ &[class*=' ion-'] {
+ font-size: 1.3em;
+ }
+
&.sort-header {
cursor: pointer;