diff options
| -rw-r--r-- | modules/admin-full/luasrc/view/admin_network/iface_overview.htm | 218 | ||||
| -rw-r--r-- | modules/admin-full/luasrc/view/admin_network/iface_status.htm | 119 |
2 files changed, 202 insertions, 135 deletions
diff --git a/modules/admin-full/luasrc/view/admin_network/iface_overview.htm b/modules/admin-full/luasrc/view/admin_network/iface_overview.htm index c1a6b8f40c..67d5a377f1 100644 --- a/modules/admin-full/luasrc/view/admin_network/iface_overview.htm +++ b/modules/admin-full/luasrc/view/admin_network/iface_overview.htm @@ -14,6 +14,7 @@ $Id$ <%- local ntm = require "luci.model.network".init() + local fwm = require "luci.model.firewall".init() local net local netlist = { } @@ -30,9 +31,9 @@ $Id$ if (!reconnect && !confirm(String.format('<%_Really shutdown interface "%s" ?\nYou might lose access to this router if you are connected via this interface.%>', id))) return; - var a = document.getElementById(id + '-ifc-addrs'); - if (a) - a.innerHTML = reconnect + var d = document.getElementById(id + '-ifc-description'); + if (d) + d.innerHTML = reconnect ? '<em><%:Interface is reconnecting...%></em>' : '<em><%:Interface is shutting down...%></em>'; @@ -66,7 +67,8 @@ $Id$ var wifidevs = <%=luci.http.write_json(netdevs)%>; var arptable = <%=luci.http.write_json(arpcache)%>; - var update_status = function() { + (function() { + var func = arguments.callee; iwxhr.get('<%=luci.dispatcher.build_url("admin", "network", "iface_status", table.concat(netlist, ","))%>', null, function(x, ifcs) { @@ -75,113 +77,126 @@ $Id$ for (var i = 0; i < ifcs.length; i++) { var ifc = ifcs[i]; - var is_up = (ifc.flags && ifc.flags.up); - var rxb = ifc.stats ? ifc.stats["rx_bytes"] : 0; - var txb = ifc.stats ? ifc.stats["tx_bytes"] : 0; - var rxp = ifc.stats ? ifc.stats["rx_packets"] : 0; - var txp = ifc.stats ? ifc.stats["tx_packets"] : 0; - var mac = ifc.macaddr ? ifc.macaddr : '00:00:00:00:00:00'; - var upt = '-'; + var rxb = ifc.rx_bytes || 0; + var txb = ifc.tx_bytes || 0; + var rxp = ifc.rx_packets || 0; + var txp = ifc.tx_packets || 0; + var mac = ifc.macaddr; + var upt = null; + + var html = ''; var icon; - if (is_up) + if (ifc.is_up) { if (ifc.uptime) upt = String.format('%t', ifc.uptime); - icon = "<%=resource%>/icons/ethernet.png"; + icon = "<%=resource%>/icons/%s.png"; } else { - icon = "<%=resource%>/icons/ethernet_disabled.png"; + icon = "<%=resource%>/icons/%s_disabled.png"; } - var s = document.getElementById(ifc.id + '-ifc-signal'); + var s = document.getElementById(ifc.id + '-ifc-devices'); if (s) { - s.innerHTML = String.format( - '<img src="%s" style="width:16px; height:16px" /><br />' + - '<small>%s</small>', - icon, ifc.ifname ? ifc.ifname : '?' + var stat = String.format( + '<img src="<%=resource%>/icons/%s%s.png" style="width:16px; height:16px; vertical-align:middle" />', + ifc.type, + ifc.is_up ? '' : '_disabled' ); - } - var u = document.getElementById(ifc.id + '-ifc-uptime'); - if (u) - { - u.innerHTML = upt; - } + if (ifc.subdevices && ifc.subdevices.length) + { + stat += ' <strong>('; - var m = document.getElementById(ifc.id + '-ifc-mac'); - if (m) - { - m.innerHTML = mac.toUpperCase(); + 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="%q" />', + sif.type, + sif.is_up ? '' : '_disabled', + sif.name + ); + } + + stat += ')</strong>'; + } + + stat += String.format( + '<br /><small>%s</small>', + ifc.name + ); + + s.innerHTML = stat; } - var a = document.getElementById(ifc.id + '-ifc-addrs'); - if (a) + var d = document.getElementById(ifc.id + '-ifc-description'); + if (d && ifc.ifname) { - if (ifc.ifname) + if (upt) { - a.innerHTML = ''; - - if (ifc.ipaddrs && ifc.ipaddrs.length) - { - a.innerHTML += '<strong><%:IPv4%>: </strong>'; - - for (var j = 0; j < ifc.ipaddrs.length; j++) - a.innerHTML += String.format( - '%s%s/%d', - j ? ', ' : '', - ifc.ipaddrs[j].addr, - ifc.ipaddrs[j].prefix - ); + html += String.format('<strong><%:Uptime%>:</strong> %s<br />', upt); + } - a.innerHTML += '<br />'; - } + if (ifc.type != 'tunnel') + { + html += String.format('<strong><%:MAC Address%>:</strong> %s<br />', mac); + } - if (ifc.ip6addrs && ifc.ip6addrs.length) - { - a.innerHTML += '<strong><%:IPv6%>: </strong>'; + html += String.format( + '<strong><%:RX%></strong>: %.2mB (%d <%:Pkts.%>)<br />' + + '<strong><%:TX%></strong>: %.2mB (%d <%:Pkts.%>)<br />', + rxb, rxp, txb, txp + ); - for (var j = 0; j < ifc.ip6addrs.length; j++) - a.innerHTML += String.format( - '%s%s/%d', - j ? ', ' : '', - ifc.ip6addrs[j].addr.toUpperCase(), - ifc.ip6addrs[j].prefix - ); + if (ifc.ipaddrs && ifc.ipaddrs.length) + { + html += '<strong><%:IPv4%>: </strong>'; - a.innerHTML += '<br />'; - } + for (var i = 0; i < ifc.ipaddrs.length; i++) + html += String.format( + '%s%s/%d', + i ? ', ' : '', + ifc.ipaddrs[i].addr, + ifc.ipaddrs[i].prefix + ); - if (!a.innerHTML) - a.innerHTML = '<em><%:No address configured on this interface.%></em>' + html += '<br />'; } - else + + if (ifc.ip6addrs && ifc.ip6addrs.length) { - a.innerHTML = '<em><%:Interface not present or not connected yet.%></em>'; + html += '<strong><%:IPv6%>: </strong>'; + + for (var i = 0; i < ifc.ip6addrs.length; i++) + html += String.format( + '%s%s/%d', + i ? ', ' : '', + ifc.ip6addrs[i].addr.toUpperCase(), + ifc.ip6addrs[i].prefix + ); + + html += '<br />'; } - } - var t = document.getElementById(ifc.id + '-ifc-transfer'); - if (t) + d.innerHTML = html; + } + else if (d) { - t.innerHTML = String.format( - '<strong><%:RX%></strong>: %1024.2mB (%d <%:Pkts.%>)<br />' + - '<strong><%:TX%></strong>: %1024.2mB (%d <%:Pkts.%>)<br />', - rxb, rxp, txb, txp - ); + d.innerHTML = '<em><%:Interface not present or not connected yet.%></em>'; } } } - window.setTimeout(update_status, 5000); + window.setTimeout(func, 5000); } ) - }; - - update_status(); + })(); //]]></script> <fieldset class="cbi-section" style="display:none"> @@ -196,37 +211,36 @@ $Id$ <table class="cbi-section-table" style="margin:10px; empty-cells:hide"> <tr class="cbi-section-table-titles"> - <th class="cbi-section-table-cell"> </th> - <th class="cbi-section-table-cell"><%:Interface%></th> - <th class="cbi-section-table-cell"><%:Uptime%></th> - <th class="cbi-section-table-cell"><%:MAC%></th> - <th class="cbi-section-table-cell" style="text-align:left"><%:Addresses%></th> - <th class="cbi-section-table-cell" style="text-align:left"><%:Transfer%></th> - <th class="cbi-section-table-cell" colspan="2"><%:Actions%></th> + <th class="cbi-section-table-cell"><%:Network%></th> + <th class="cbi-section-table-cell" style="text-align:left"><%:Status%></th> + <th class="cbi-section-table-cell"><%:Actions%></th> </tr> - <% for i, net in ipairs(netlist) do %> + <% + for i, net in ipairs(netlist) do + local z = fwm:get_zone_by_network(net) + local c = z and z:get_color() or "#EEEEEE" + local t = z and translate("Part of zone %q" % z:name()) or translate("No zone assigned") + %> <tr class="cbi-section-table-row cbi-rowstyle-<%=i % 2 + 1%>"> - <td> - <span style="background-color:#FFFFFF; border:1px solid #CCCCCC; padding:2px"><%=net%></span> - </td> - <td class="cbi-value-field" style="min-width:16px; padding:3px; text-align:center" id="<%=net%>-ifc-signal"> - <img src="<%=resource%>/icons/ethernet_disabled.png" style="width:16px; height:16px" /><br /> - <small>?</small> - </td> - <td class="cbi-value-field" id="<%=net%>-ifc-uptime">?</td> - <td class="cbi-value-field" id="<%=net%>-ifc-mac">?</td> - <td class="cbi-value-field" style="text-align:left; padding:3px" id="<%=net%>-ifc-addrs"><em><%:Collecting data...%></em></td> - <td class="cbi-value-field" style="text-align:left; padding:3px" id="<%=net%>-ifc-transfer"> - <strong><%:RX%></strong>: 0 <%:KB%> (0 <%:Pkts.%>)<br /> - <strong><%:TX%></strong>: 0 <%:KB%> (0 <%:Pkts.%>)<br /> + <td class="cbi-value-field" style="padding:3px"> + <div style="background-color:#FFFFFF; border:1px solid #CCCCCC; margin:0 10px"> + <div style="border-bottom:1px solid #CCCCCC; padding:2px; background-color:<%=c%>" title="<%=pcdata(t)%>"> + <strong><%=net:upper()%></strong> + </div> + <div style="padding:2px" id="<%=net%>-ifc-devices"> + <img src="<%=resource%>/icons/ethernet_disabled.png" style="width:16px; height:16px" /><br /> + <small>?</small> + </div> + </div> </td> - <td> - <a href="#" onclick="iface_shutdown('<%=net%>', true)"><img style="border:none" src="<%=resource%>/cbi/reload.gif" alt="<%:Reconnect this interface%>" title="<%:Reconnect this interface%>" /></a> - <a href="#" onclick="iface_shutdown('<%=net%>', false)"><img style="border:none" src="<%=resource%>/cbi/reset.gif" alt="<%:Shutdown this interface%>" title="<%:Shutdown this interface%>" /></a> + <td class="cbi-value-field" style="vertical-align:middle; text-align:left; padding:3px" id="<%=net%>-ifc-description"> + <em><%:Collecting data...%></em> </td> - <td> - <a href="<%=luci.dispatcher.build_url("admin/network/network", net)%>"><img style="border:none" src="<%=resource%>/cbi/edit.gif" alt="<%:Edit this interface%>" title="<%:Edit this interface%>" /></a> - <a href="<%=luci.dispatcher.build_url("admin/network/iface_delete", net)%>" onclick="return confirm('<%:Really delete this interface? The deletion cannot be undone!\nYou might lose access to this router if you are connected via this interface.%>')"><img style="border:none" src="<%=resource%>/cbi/remove.gif" alt="<%:Delete this interface%>" title="<%:Delete this interface%>" /></a> + <td style="width:340px"> + <input type="button" class="cbi-button cbi-button-add" style="width:80px; background-image:url(<%=resource%>/cbi/reload.gif)" onclick="iface_shutdown('<%=net%>', true)" title="<%:Reconnect this interface%>" value="<%:Connect%>" /> + <input type="button" class="cbi-button cbi-button-add" style="width:80px; background-image:url(<%=resource%>/cbi/reset.gif)" onclick="iface_shutdown('<%=net%>', false)" title="<%:Shutdown this interface%>" value="<%:Stop%>" /> + <input type="button" class="cbi-button cbi-button-add" style="width:80px; background-image:url(<%=resource%>/cbi/edit.gif)" onclick="location.href='<%=luci.dispatcher.build_url("admin/network/network", net)%>'" title="<%:Edit this interface%>" value="<%:Edit%>" /> + <input type="button" class="cbi-button cbi-button-add" style="width:80px; background-image:url(<%=resource%>/cbi/remove.gif)" onclick="if (confirm('<%:Really delete this interface? The deletion cannot be undone!\nYou might lose access to this router if you are connected via this interface.%>')) location.href='<%=luci.dispatcher.build_url("admin/network/iface_delete", net)%>'" title="<%:Delete this interface%>" value="<%:Delete%>" /> </td> </tr> <% end %> diff --git a/modules/admin-full/luasrc/view/admin_network/iface_status.htm b/modules/admin-full/luasrc/view/admin_network/iface_status.htm index ed5002bc6c..c554df88d3 100644 --- a/modules/admin-full/luasrc/view/admin_network/iface_status.htm +++ b/modules/admin-full/luasrc/view/admin_network/iface_status.htm @@ -2,91 +2,144 @@ <script type="text/javascript">//<![CDATA[ var iwxhr = new XHR(); - var update_status = function() { + + function iface_shutdown(id, reconnect) { + if (!reconnect && !confirm(String.format('<%_Really shutdown network ?\nYou might loose access to this router if you are connected via this interface.%>', id))) + return; + + var a = document.getElementById(id + '-ifc-addrs'); + if (a) + { + a.innerHTML = reconnect + ? '<em><%:Interface is reconnecting...%></em>' + : '<em><%:Interface is shutting down...%></em>'; + } + + var s = document.getElementById('ifc-rc-status'); + if (s) + { + s.parentNode.style.display = 'block'; + s.innerHTML = '<%:Waiting for router...%>'; + } + + var rcxhr = new XHR(); + rcxhr.get('<%=luci.dispatcher.build_url("admin", "network")%>/iface_' + (reconnect ? 'reconnect' : 'shutdown') + '/' + id, null, + function(x) + { + if (s) + { + s.innerHTML = reconnect + ? '<%:Interface reconnected%>' + : '<%:Interface shut down%>'; + + window.setTimeout(function() { + s.parentNode.style.display = 'none'; + }, 1000); + } + } + ); + } + + + (function() { + var func = arguments.callee; + iwxhr.get('<%=luci.dispatcher.build_url("admin", "network", "iface_status", self.network)%>', null, function(x, ifc) { if (ifc && (ifc = ifc[0])) { - var is_up = (ifc.flags && ifc.flags.up); - var rxb = ifc.stats ? (ifc.stats["rx_bytes"] / 1024) : 0; - var txb = ifc.stats ? (ifc.stats["tx_bytes"] / 1024) : 0; - var rxp = ifc.stats ? ifc.stats["rx_packets"] : 0; - var txp = ifc.stats ? ifc.stats["tx_packets"] : 0; - var mac = ifc.macaddr ? ifc.macaddr : '00:00:00:00:00:00'; - var upt = '-'; - - var icon; - if (is_up) + var rxb = ifc.rx_bytes || 0; + var txb = ifc.tx_bytes || 0; + var rxp = ifc.rx_packets || 0; + var txp = ifc.tx_packets || 0; + var mac = ifc.macaddr; + + var html = ''; + var upt, icon; + + if (ifc.is_up) { if (ifc.uptime) upt = String.format('%t', ifc.uptime); - icon = "<%=resource%>/icons/ethernet.png"; + icon = "<%=resource%>/icons/%s.png"; } else { - icon = "<%=resource%>/icons/ethernet_disabled.png"; + icon = "<%=resource%>/icons/%s_disabled.png"; } var s = document.getElementById('<%=self.option%>-ifc-signal'); if (s) s.innerHTML = String.format( - '<img src="%s" style="width:16px; height:16px" /><br />' + - '<small>%s</small>', icon, ifc.ifname ? ifc.ifname : '?' + '<img src="%s" style="width:16px; height:16px" />' + + '<br /><small>%s</small>', + String.format(icon, ifc.type), + ifc.ifname ? ifc.ifname : '?' ); var d = document.getElementById('<%=self.option%>-ifc-description'); - if (d && ifc.ifname) + if (d && ifc.ifname && mac != '00:00:00:00:00:00') { - d.innerHTML = String.format( - '<strong><%:Uptime%>:</strong> %s<br />' + - '<strong><%:MAC Address%>:</strong> %s<br />' + - '<strong><%:RX%></strong>: %.2f <%:KB%> (%d <%:Pkts.%>)<br />' + - '<strong><%:TX%></strong>: %.2f <%:KB%> (%d <%:Pkts.%>)<br />', - upt, mac, rxb, rxp, txb, txp + if (upt) + { + html += String.format('<strong><%:Uptime%>:</strong> %s<br />', upt); + } + + if (ifc.type != 'tunnel') + { + html += String.format('<strong><%:MAC Address%>:</strong> %s<br />', mac); + } + + html += String.format( + '<strong><%:RX%></strong>: %.2mB (%d <%:Pkts.%>)<br />' + + '<strong><%:TX%></strong>: %.2mB (%d <%:Pkts.%>)<br />', + rxb, rxp, txb, txp ); if (ifc.ipaddrs && ifc.ipaddrs.length) { - d.innerHTML += '<strong><%:IPv4%>: </strong>'; + html += '<strong><%:IPv4%>: </strong>'; for (var i = 0; i < ifc.ipaddrs.length; i++) - d.innerHTML += String.format( + html += String.format( '%s%s/%d', i ? ', ' : '', ifc.ipaddrs[i].addr, ifc.ipaddrs[i].prefix ); - d.innerHTML += '<br />'; + html += '<br />'; } if (ifc.ip6addrs && ifc.ip6addrs.length) { - d.innerHTML += '<strong><%:IPv6%>: </strong>'; + html += '<strong><%:IPv6%>: </strong>'; for (var i = 0; i < ifc.ip6addrs.length; i++) - d.innerHTML += String.format( + html += String.format( '%s%s/%d', i ? ', ' : '', ifc.ip6addrs[i].addr.toUpperCase(), ifc.ip6addrs[i].prefix ); - d.innerHTML += '<br />'; + html += '<br />'; } + + d.innerHTML = html; } else if (d) - d.innerHTML = '<%:Interface not present or not connected yet.%>'; + { + d.innerHTML = '<em><%:Interface not present or not connected yet.%></em>'; + } } - window.setTimeout(update_status, 5000); + window.setTimeout(func, 5000); } ) - }; - - update_status(); + })(); //]]></script> <table> |