<%+cbi/valueheader%>

<script type="text/javascript">//<![CDATA[
	XHR.poll(5, '<%=url('admin/network/iface_status', self.network)%>', null,
		function(x, ifc)
		{
			if (ifc && (ifc = ifc[0]))
			{
				var html = '';

				var s = document.getElementById('<%=self.option%>-ifc-signal');
				if (s)
					s.innerHTML = String.format(
						'<img src="<%=resource%>/icons/%s%s.png" style="width:16px; height:16px" />' +
						'<br /><small>%s</small>',
							ifc.type, ifc.is_up ? '' : '_disabled',
							ifc.name
					);

				var d = document.getElementById('<%=self.option%>-ifc-description');
				if (d && ifc.ifname)
				{
					if (ifc.is_up)
					{
						html += String.format('<strong><%:Uptime%>:</strong> %t<br />', ifc.uptime);
					}

					if (ifc.macaddr)
					{
						html += String.format('<strong><%:MAC-Address%>:</strong> %s<br />', ifc.macaddr);
					}

					html += String.format(
						'<strong><%:RX%></strong>: %.2mB (%d <%:Pkts.%>)<br />' +
						'<strong><%:TX%></strong>: %.2mB (%d <%:Pkts.%>)<br />',
							ifc.rx_bytes, ifc.rx_packets,
							ifc.tx_bytes, ifc.tx_packets
					);

					if (ifc.ipaddrs && ifc.ipaddrs.length)
					{
						for (var i = 0; i < ifc.ipaddrs.length; i++)
							html += String.format(
								'<strong><%:IPv4%>:</strong> %s<br />',
								ifc.ipaddrs[i]
							);
					}

					if (ifc.ip6addrs && ifc.ip6addrs.length)
					{
						for (var i = 0; i < ifc.ip6addrs.length; i++)
							html += String.format(
								'<strong><%:IPv6%>:</strong> %s<br />',
								ifc.ip6addrs[i]
							);
					}

					d.innerHTML = html;
				}
				else if (d)
				{
					d.innerHTML = '<em><%:Interface not present or not connected yet.%></em>';
				}
			}
		}
	);
//]]></script>

<table>
	<tr class="cbi-section-table">
		<td></td>
		<td class="cbi-value-field" style="min-width:16px; padding:3px; text-align:center" id="<%=self.option%>-ifc-signal">
			<img src="<%=resource%>/icons/ethernet_disabled.png" style="width:16px; height:16px" /><br />
			<small>?</small>
		</td>
		<td class="cbi-value-field" style="vertical-align:middle; text-align:left; padding:3px" id="<%=self.option%>-ifc-description">
			<em><%:Collecting data...%></em>
		</td>
	</tr>
</table>

<%+cbi/valuefooter%>