summaryrefslogtreecommitdiffhomepage
path: root/modules/luci-mod-admin-full/luasrc
diff options
context:
space:
mode:
authorJo-Philipp Wich <jo@mein.io>2018-07-15 15:18:00 +0200
committerJo-Philipp Wich <jo@mein.io>2018-07-15 16:23:19 +0200
commita48a14259976013359c22c27b269786287ab131b (patch)
tree38935774510c6e4646e4785926e97f5ac0f5e0da /modules/luci-mod-admin-full/luasrc
parent2787a52d6dc9cb2027ba1c24d029e08b4ac33b62 (diff)
luci-mod-admin-full: improve interface overview display
Remove the guessing of primary interfaces for now as we cannot yet properly track parent / child interface relations. Instead, add tooltips to the interface icons displaying detailed physical layer information per netdev. For dynamic or true alias interfaces (using "@" notation), skip the reporting of MAC and traffic stats. Signed-off-by: Jo-Philipp Wich <jo@mein.io>
Diffstat (limited to 'modules/luci-mod-admin-full/luasrc')
-rw-r--r--modules/luci-mod-admin-full/luasrc/controller/admin/network.lua2
-rw-r--r--modules/luci-mod-admin-full/luasrc/view/admin_network/iface_overview_status.htm69
2 files changed, 37 insertions, 34 deletions
diff --git a/modules/luci-mod-admin-full/luasrc/controller/admin/network.lua b/modules/luci-mod-admin-full/luasrc/controller/admin/network.lua
index 4680687883..31b9416253 100644
--- a/modules/luci-mod-admin-full/luasrc/controller/admin/network.lua
+++ b/modules/luci-mod-admin-full/luasrc/controller/admin/network.lua
@@ -211,6 +211,7 @@ function iface_status(ifaces)
errors = net:errors(),
name = device:shortname(),
type = device:type(),
+ typename = device:get_type_i18n(),
ifname = device:name(),
macaddr = device:mac(),
is_up = net:is_up() and device:is_up(),
@@ -228,6 +229,7 @@ function iface_status(ifaces)
data.subdevices[#data.subdevices+1] = {
name = device:shortname(),
type = device:type(),
+ typename = device:get_type_i18n(),
ifname = device:name(),
macaddr = device:mac(),
is_up = device:is_up(),
diff --git a/modules/luci-mod-admin-full/luasrc/view/admin_network/iface_overview_status.htm b/modules/luci-mod-admin-full/luasrc/view/admin_network/iface_overview_status.htm
index f56b3e0ade..2c89d10430 100644
--- a/modules/luci-mod-admin-full/luasrc/view/admin_network/iface_overview_status.htm
+++ b/modules/luci-mod-admin-full/luasrc/view/admin_network/iface_overview_status.htm
@@ -30,21 +30,33 @@
networks.push(n.getAttribute('data-network'));
});
+ function render_iface(ifc) {
+ return E('span', { class: 'cbi-tooltip-container' }, [
+ E('img', { 'class' : 'middle', 'src': '<%=resource%>/icons/%s%s.png'.format(
+ ifc.is_alias ? 'alias' : ifc.type,
+ ifc.is_up ? '' : '_disabled') }),
+ E('span', { 'class': 'cbi-tooltip ifacebadge large' }, [
+ E('img', { 'src': '<%=resource%>/icons/%s%s.png'.format(
+ ifc.type, ifc.is_up ? '' : '_disabled') }),
+ E('span', { 'class': 'left' }, [
+ E('strong', '<%:Type%>: '), ifc.typename, E('br'),
+ E('strong', '<%:Device%>: '), ifc.ifname, E('br'),
+ E('strong', '<%:Connected%>: '), ifc.is_up ? '<%:yes%>' : '<%:no%>', E('br'),
+ ifc.macaddr ? E('strong', '<%:MAC%>: ') : '',
+ ifc.macaddr ? ifc.macaddr : '',
+ ifc.macaddr ? E('br') : '',
+ E('strong', '<%:RX%>: '), '%.2mB (%d <%:Pkts.%>)'.format(ifc.rx_bytes, ifc.rx_packets), E('br'),
+ E('strong', '<%:TX%>: '), '%.2mB (%d <%:Pkts.%>)'.format(ifc.tx_bytes, ifc.tx_packets)
+ ])
+ ])
+ ]);
+ }
+
XHR.poll(5, '<%=url('admin/network/iface_status')%>/' + networks.join(','), null,
function(x, ifcs)
{
if (ifcs)
{
- var primary_devices = { };
-
- for (var idx = 0; idx < ifcs.length; idx++)
- {
- var ifc = ifcs[idx];
-
- if (!ifc.is_alias && !ifc.is_dynamic)
- primary_devices[ifc.name] = ifc;
- }
-
for (var idx = 0; idx < ifcs.length; idx++)
{
var ifc = ifcs[idx];
@@ -53,37 +65,25 @@
var s = document.getElementById(ifc.id + '-ifc-devices');
if (s)
{
- var stat = String.format(
- '<img src="<%=resource%>/icons/%s%s.png" style="width:16px; height:16px; vertical-align:middle" />',
- (ifc.is_dynamic || ifc.is_alias) ? 'alias' : ifc.type,
- ifc.is_up ? '' : '_disabled'
- );
+ while (s.firstChild)
+ s.removeChild(s.firstChild);
+
+ s.appendChild(render_iface(ifc));
if (ifc.subdevices && ifc.subdevices.length)
{
- stat += ' <strong>(';
+ var sifs = [ ' (' ];
for (var j = 0; j < ifc.subdevices.length; j++)
- {
- var sif = ifc.subdevices[j];
-
- stat += String.format(
- '<img src="<%=resource%>/icons/%s%s.png" style="width:16px; height:16px; vertical-align:middle" title="%h" />',
- sif.type,
- sif.is_up ? '' : '_disabled',
- sif.name
- );
- }
+ sifs.push(render_iface(ifc.subdevices[j]));
- stat += ')</strong>';
- }
+ sifs.push(')');
- stat += String.format(
- '<br /><small>%h</small>',
- ifc.name
- );
+ s.appendChild(E('span', {}, sifs));
+ }
- s.innerHTML = stat;
+ s.appendChild(E('br'));
+ s.appendChild(E('small', {}, ifc.is_alias ? '<%:Alias of "%s"%>'.format(ifc.is_alias) : ifc.name));
}
var d = document.getElementById(ifc.id + '-ifc-description');
@@ -106,7 +106,8 @@
html += String.format('<strong><%:Uptime%>:</strong> %t<br />', ifc.uptime);
}
- if (!primary_devices[ifc.name] || primary_devices[ifc.name] === ifc)
+
+ if (!ifc.is_dynamic && !ifc.is_alias)
{
if (ifc.macaddr)
html += String.format('<strong><%:MAC-Address%>:</strong> %s<br />', ifc.macaddr);