Upload of mwan3 LuCI package for OpenWrt feeds.

Signed-off-by: Aedan Renner chipdankly@gmail.com

net/mwan3-luci/files/usr/lib/lua/luci/view/admin_status/index/mwan3.htm

@@ -0,0 +1 @@
+<%+mwan3/mwan3_status%>

net/mwan3-luci/files/usr/lib/lua/luci/view/mwan3/mwan3_adv_diagnostics.htm

@@ -0,0 +1,134 @@
+<%+header%>
+
+<ul class="cbi-tabmenu">
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/hotplug")%>"><%:Hotplug Script%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/mwan3")%>"><%:MWAN3 Config%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/network")%>"><%:Network Config%></a></li>
+	<li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/diag")%>"><%:Diagnostics%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/tshoot")%>"><%:Troubleshooting%></a></li>
+</ul>
+
+<%
+	local uci = require "luci.model.uci"
+
+	str = ""
+	uci.cursor():foreach("mwan3", "interface",
+		function (section)
+			str = str .. section[".name"] .. " "
+		end
+	)
+%>
+
+<script type="text/javascript" src="<%=resource%>/cbi.js"></script>
+<script type="text/javascript">//<![CDATA[
+	var stxhr = new XHR();
+
+	function update_status(tool, alt)
+	{
+		var iface = document.getElementById('mwan3iface').value;
+		var output = document.getElementById('diag_output');
+
+		if (tool == "service")
+			{
+				output.innerHTML =
+					'<img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="padding: 20px; vertical-align: middle;" /> ' +
+					"Waiting for MWAN3 to " + alt + "..."
+				;
+			}
+			else
+			{
+				output.innerHTML =
+					'<img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="padding: 20px; vertical-align: middle;" /> ' +
+					"Waiting for diagnostic results..."
+				;
+			}
+
+		output.parentNode.style.display = 'block';
+		output.style.display = 'inline';
+
+		stxhr.get('<%=luci.dispatcher.build_url("admin", "network", "mwan3", "advanced")%>/diag_display' + '/' + iface + '/' + tool + '/' + alt, null,
+			function(x, st)
+			{
+				if (st.diagres)
+				{
+					output.innerHTML = String.format('<pre id="diag_output_css">%h</pre>', st.diagres[0].diagresult);
+				}
+				else
+				{
+					var temp = '';
+					var ncint = 'No diagnostic results returned';
+					temp = String.format(
+						'<pre id="diag_output_css"><strong>%s</strong></pre>',
+							ncint
+					);
+					output.innerHTML = temp;
+				}
+			}
+		);
+	}
+//]]></script>
+
+<div id="mwan3_diagnostics" class="cbi-map">
+	<fieldset id="diag_select" class="cbi-section">
+		<legend><%:MWAN3 Interface Diagnostics%></legend>
+		<select id="mwan3iface">
+			<% for z in str:gmatch("[^ ]+") do -%><option value="<%=z%>"><%=z%></option><%- end %>
+		</select>
+		<div id="buttoncss">
+			<input type="button" value="<%:Ping default gateway%>" class="cbi-button cbi-button-apply" onclick="update_status('ping', 'gateway')" />
+			<input type="button" value="<%:Ping tracking IP%>" class="cbi-button cbi-button-apply" onclick="update_status('ping', 'track_ip')" />
+			<input type="button" value="<%:Check IP rules%>" class="cbi-button cbi-button-apply" onclick="update_status('rulechk', null)" />
+			<input type="button" value="<%:Check routing table%>" class="cbi-button cbi-button-apply" onclick="update_status('routechk', null)" />
+			<input type="button" value="<%:Hotplug ifup%>" class="cbi-button cbi-button-apply" onclick="update_status('hotplug', 'ifup')" />
+			<input type="button" value="<%:Hotplug ifdown%>" class="cbi-button cbi-button-apply" onclick="update_status('hotplug', 'ifdown')" />
+		</div>
+	</fieldset>
+	<fieldset id="diag_select" class="cbi-section">
+		<legend><%:MWAN3 Service Control%></legend>
+		<div id="buttoncss">
+			<input type="button" value="<%:Restart MWAN3%>" class="cbi-button cbi-button-apply" onclick="update_status('service', 'restart')" />
+			<input type="button" value="<%:Stop MWAN3%>" class="cbi-button cbi-button-apply" onclick="update_status('service', 'stop')" />
+			<input type="button" value="<%:Start MWAN3%>" class="cbi-button cbi-button-apply" onclick="update_status('service', 'start')" />
+		</div>
+	</fieldset>
+	<fieldset class="cbi-section" style="display:none">
+		<legend><%:Diagnostic Results%></legend>
+		<div id="diag_output"></div>
+	</fieldset>
+</div>
+
+<style type="text/css">
+  .container {  /*container for entire page. fixes bootstrap theme's ridiculously small page width*/
+	max-width: none;
+	margin-left: 30px;
+	padding-right: 30px;
+	width: auto;
+  }
+  #mwan3_diagnostics {
+	background-color: #FFFFFF;
+	border: 1px dotted #555555;
+	padding: 20px;
+  }
+  #diag_select {
+	padding: 12px 20px 20px 20px;
+  }
+  #mwan3iface {
+	float: left;
+	margin: 8px 20px 0px 0px;
+  }
+  #buttoncss {
+	display: table;
+	float: left;
+	text-align: left;
+  }
+  .cbi-button {
+	margin: 8px 20px 0px 0px;
+	min-width: 153px;
+  }
+  #diag_output_css {
+	padding: 20px;
+	text-align: left;
+  }
+</style>
+
+<%+footer%>

net/mwan3-luci/files/usr/lib/lua/luci/view/mwan3/mwan3_adv_hotplug.htm

@@ -0,0 +1,23 @@
+<ul class="cbi-tabmenu">
+	<li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/hotplug")%>"><%:Hotplug Script%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/mwan3")%>"><%:MWAN3 Config%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/network")%>"><%:Network Config%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/diag")%>"><%:Diagnostics%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/tshoot")%>"><%:Troubleshooting%></a></li>
+</ul>
+
+<style type="text/css">
+  .container {  /*container for entire page. fixes bootstrap theme's ridiculously small page width*/
+	max-width: none;
+	margin: 0px 0px 0px 30px;
+	padding-right: 30px;
+	width: auto;
+  }
+  .cbi-section-node {
+	margin-top: 20px;
+  }
+  .cbi-section {
+	border: 1px dotted #555555;
+	padding: 20px;
+  }
+</style>

net/mwan3-luci/files/usr/lib/lua/luci/view/mwan3/mwan3_adv_mwan3.htm

@@ -0,0 +1,23 @@
+<ul class="cbi-tabmenu">
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/hotplug")%>"><%:Hotplug Script%></a></li>
+	<li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/mwan3")%>"><%:MWAN3 Config%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/network")%>"><%:Network Config%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/diag")%>"><%:Diagnostics%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/tshoot")%>"><%:Troubleshooting%></a></li>
+</ul>
+
+<style type="text/css">
+  .container {  /*container for entire page. fixes bootstrap theme's ridiculously small page width*/
+	max-width: none;
+	margin: 0px 0px 0px 30px;
+	padding-right: 30px;
+	width: auto;
+  }
+  .cbi-section-node {
+	margin-top: 20px;
+  }
+  .cbi-section {
+	border: 1px dotted #555555;
+	padding: 20px;
+  }
+</style>

net/mwan3-luci/files/usr/lib/lua/luci/view/mwan3/mwan3_adv_network.htm

@@ -0,0 +1,23 @@
+<ul class="cbi-tabmenu">
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/hotplug")%>"><%:Hotplug Script%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/mwan3")%>"><%:MWAN3 Config%></a></li>
+	<li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/network")%>"><%:Network Config%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/diag")%>"><%:Diagnostics%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/tshoot")%>"><%:Troubleshooting%></a></li>
+</ul>
+
+<style type="text/css">
+  .container {  /*container for entire page. fixes bootstrap theme's ridiculously small page width*/
+	max-width: none;
+	margin: 0px 0px 0px 30px;
+	padding-right: 30px;
+	width: auto;
+  }
+  .cbi-section-node {
+	margin-top: 20px;
+  }
+  .cbi-section {
+	border: 1px dotted #555555;
+	padding: 20px;
+  }
+</style>

net/mwan3-luci/files/usr/lib/lua/luci/view/mwan3/mwan3_adv_troubleshoot.htm

@@ -0,0 +1,77 @@
+<%+header%>
+
+<ul class="cbi-tabmenu">
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/hotplug")%>"><%:Hotplug Script%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/mwan3")%>"><%:MWAN3 Config%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/network")%>"><%:Network Config%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/diag")%>"><%:Diagnostics%></a></li>
+	<li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/advanced/tshoot")%>"><%:Troubleshooting%></a></li>
+</ul>
+
+<script type="text/javascript" src="<%=resource%>/cbi.js"></script>
+<script type="text/javascript">//<![CDATA[
+	XHR.poll(15, '<%=luci.dispatcher.build_url("admin", "network", "mwan3", "advanced", "tshoot_display")%>', null,
+		function(x, st)
+		{
+			var tx = document.getElementById('mwan3_tshoot_text');
+			if (st.mw3ver)
+			{
+				var temp = '';
+				var mwanvers = 'Software versions : <br /><br />';
+				var mwan3cnfg = '<br /><br />Output of &#34;cat /etc/config/mwan3&#34; : <br /><br />';
+				var netcnfg = '<br /><br />Output of &#34;cat /etc/config/network&#34; : <br /><br />';
+				var ifcnfg = '<br /><br />Output of &#34;ifconfig&#34; : <br /><br />';
+				var iproute = '<br /><br />Output of &#34;route -n&#34; : <br /><br />';
+				var iprulesh = '<br /><br />Output of &#34;ip rule show&#34; : <br /><br />';
+				var routelisttbl = '<br /><br />Output of &#34;ip route list table 1-250&#34; : <br /><br />';
+				var firewalldef = '<br /><br />Firewall default output policy (must be ACCEPT) : <br /><br />';
+				var iptable = '<br /><br />Output of &#34;iptables -L -t mangle -v -n&#34; : <br /><br />';
+
+				temp = String.format(
+					'<pre><span class="tsht">%s</span>%s<span class="tsht">%s</span>%s<span class="tsht">%s</span>%s<span class="tsht">%s</span>%s<span class="tsht">%s</span>%s<span class="tsht">%s</span>%s<span class="tsht">%s</span>%s<span class="tsht">%s</span>%s<span class="tsht">%s</span>%s</pre>',
+						mwanvers, st.mw3ver[0].mwan3v, mwan3cnfg, st.mwan3config[0].mwn3cfg, netcnfg, st.netconfig[0].netcfg, ifcnfg, st.ifconfig[0].ifcfg, iproute, st.rtshow[0].iprtshow, iprulesh, st.iprule[0].rule, routelisttbl, st.routelist[0].iprtlist, firewalldef, st.fidef[0].firedef, iptable, st.iptables[0].iptbls
+				);
+				tx.innerHTML = temp;
+			}
+			else
+			{
+				var temp = '';
+				var terror = 'Error collecting troubleshooting information';
+				temp = String.format(
+					'<strong>%s</strong>',
+						terror
+				);
+				tx.innerHTML = temp;
+			}
+		}
+	);
+//]]></script>
+
+<div id="tshoot_div">
+	<fieldset class="cbi-section">
+		<legend><%:Troubleshooting Data%></legend>
+		<div id="mwan3_tshoot_text"><img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" /> Collecting data...</div>
+	</fieldset>
+</div>
+<style type="text/css">
+  .container {  /*container for entire page. fixes bootstrap theme's ridiculously small page width*/
+	max-width: none;
+	margin-left: 30px;
+	padding-right: 30px;
+	width: auto;
+  }
+  #tshoot_div {
+	background-color: #FFFFFF;
+	border: 1px dotted #555555;
+	padding: 20px;
+  }
+  #mwan3_tshoot_text {
+	padding: 20px;
+	text-align: left;
+  }
+  .tsht {
+	background-color: rgb(78, 186, 241);
+  }
+</style>
+
+<%+footer%>

net/mwan3-luci/files/usr/lib/lua/luci/view/mwan3/mwan3_config_css.htm

@@ -0,0 +1,34 @@
+<style type="text/css">
+  .container {  /*container for entire page. fixes bootstrap theme's ridiculously small page width*/
+	max-width: none;
+	margin-left: 30px;
+	padding-right: 30px;
+	width: auto;
+  }
+  table td {  /*cells showing the configuration values*/
+	padding: 0px;
+	text-align: center;
+	vertical-align: middle;
+  }
+  table th {  /*column for configuration section name*/
+	padding: 0px;
+	text-align: center;
+	vertical-align: middle;
+  }
+  table tbody th {  /*column for configuration section name*/
+	padding: 0px;
+	vertical-align: middle;
+  }
+  .cbi-section-node table div {  /*rows*/
+	padding-top: 5px;
+  }
+  table.cbi-section-table td.cbi-section-table-cell {  /*sort buttons column*/
+	text-align: center;
+  }
+  .cbi-section h3 {
+	color: rgb(85, 85, 85);
+	font-family: Trebuchet MS,Verdana,sans-serif;
+	font-style: italic;
+	font-weight: normal;
+  }
+</style>

net/mwan3-luci/files/usr/lib/lua/luci/view/mwan3/mwan3_over_detail.htm

@@ -0,0 +1,62 @@
+<%+header%>
+
+<ul class="cbi-tabmenu">
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/overview")%>"><%:Interface Status%></a></li>
+	<li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/overview/over_detail")%>"><%:Detailed Status%></a></li>
+</ul>
+
+<script type="text/javascript" src="<%=resource%>/cbi.js"></script>
+<script type="text/javascript">//<![CDATA[
+	XHR.poll(5, '<%=luci.dispatcher.build_url("admin", "network", "mwan3", "overview", "detail_status")%>', null,
+		function(x, st)
+		{
+			var tx = document.getElementById('mwan3_detail_text');
+			if (st.mwan3dst)
+			{
+				var temp = '';
+				temp = String.format(
+					'<pre>%s</pre>',
+						st.mwan3dst[0].detailstat
+				);
+				tx.innerHTML = temp;
+			}
+			else
+			{
+				var temp = '';
+				var nslg = 'No detailed status information available';
+				temp = String.format(
+					'<strong>%s</strong>',
+						nslg
+				);
+				tx.innerHTML = temp;
+			}
+		}
+	);
+//]]></script>
+
+<div id="mwan3_detail_status">
+	<fieldset class="cbi-section">
+		<legend><%:MWAN3 Multi-WAN Detailed Status%></legend>
+		<div id="mwan3_detail_text"><img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" /> Collecting data...</div>
+	</fieldset>
+</div>
+
+<style type="text/css">
+  .container {  /*container for entire page. fixes bootstrap theme's ridiculously small page width*/
+	max-width: none;
+	margin-left: 30px;
+	padding-right: 30px;
+	width: auto;
+  }
+  #mwan3_detail_status {
+	border: 1px dotted #555555;
+	background-color: #FFFFFF;
+	padding: 20px;
+  }
+  #mwan3_detail_text {
+	padding: 20px;
+	text-align: left;
+  }
+</style>
+
+<%+footer%>

net/mwan3-luci/files/usr/lib/lua/luci/view/mwan3/mwan3_over_interface.htm

@@ -0,0 +1,146 @@
+<%+header%>
+
+<ul class="cbi-tabmenu">
+	<li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/overview")%>"><%:Interface Status%></a></li>
+	<li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan3/overview/over_detail")%>"><%:Detailed Status%></a></li>
+</ul>
+
+<script type="text/javascript" src="<%=resource%>/cbi.js"></script>
+<script type="text/javascript">//<![CDATA[
+	XHR.poll(5, '<%=luci.dispatcher.build_url("admin", "network", "mwan3", "overview", "iface_status")%>', null,
+		function(x, st)
+		{
+			var tx = document.getElementById('mwan3_status_text');
+			if (st.wans)
+			{
+				var temp = '';
+
+				for( var i = 0; i < st.wans.length; i++ )
+				{
+					var stat = '';
+					var cssc = '';
+
+					switch (st.wans[i].status)
+					{
+						case 'on':
+							stat = 'Online (tracking active)';
+							cssc = 'wanon';
+							break;
+
+						case 'nm':
+							stat = 'Online (tracking off)';
+							cssc = 'wanon';
+							break;
+
+						case 'off':
+							stat = 'Offline';
+							cssc = 'wanoff';
+							break;
+
+						case 'ne':
+							stat = 'Disabled';
+							cssc = 'wanoff';
+							break;
+					}
+
+					temp += String.format(
+						'<span class="%s"><strong>%s (<a href="%q">%s</a>)</strong><br />%s</span>',
+							cssc, st.wans[i].name, st.wans[i].link, st.wans[i].ifname, stat
+					);
+				}
+				tx.innerHTML = temp;
+			}
+			else
+			{
+				var temp = '';
+				var ncint = 'No MWAN3 interfaces found';
+				temp = String.format(
+					'<strong>%s</strong>',
+						ncint
+				);
+				tx.innerHTML = temp;
+			}
+
+			var tx = document.getElementById('mwan3_statuslog_text');
+			if (st.mwan3log)
+			{
+				var temp = '';
+				var mwan3lg = 'Last 50 MWAN3 systemlog entries. Newest entries sorted at the top :';
+
+				temp = String.format(
+					'<pre>%s<br /><br />%s</pre>',
+						mwan3lg, st.mwan3log[0].mwanlog
+				);
+				tx.innerHTML = temp;
+			}
+			else
+			{
+				var temp = '';
+				var nslg = 'No MWAN3 systemlog history found';
+				temp = String.format(
+					'<strong>%s</strong>',
+						nslg
+				);
+				tx.innerHTML = temp;
+			}
+		}
+	);
+//]]></script>
+
+<div id="mwan3_interface_status">
+	<fieldset id="interface_field" class="cbi-section">
+		<legend><%:MWAN3 Multi-WAN Interface Live Status%></legend>
+		<div id="mwan3_status_text"><img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" /> Collecting data...</div>
+	</fieldset>
+	<fieldset class="cbi-section">
+		<legend><%:MWAN3 Multi-WAN Interface Systemlog%></legend>
+		<div id="mwan3_statuslog_text"><img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" /> Collecting data...</div>
+	</fieldset>
+</div>
+
+<style type="text/css">
+  .container {  /*container for entire page. fixes bootstrap theme's ridiculously small page width*/
+	max-width: none;
+	margin-left: 30px;
+	padding-right: 30px;
+	width: auto;
+  }
+  #mwan3_interface_status {
+	background-color: #FFFFFF;
+	border: 1px dotted #555555;
+	padding: 20px;
+  }
+  #interface_field {
+	padding: 12px 20px 20px 20px;
+  }
+  #mwan3_status_text {
+	display: table;
+	font-size: 14px;
+	margin: auto;
+	max-width: 1044px;
+	min-width: 246px;
+	width: 100%;
+  }
+  .wanon {
+	background-color: rgb(144, 240, 144);
+  }
+  .wanoff {
+	background-color: rgb(240, 144, 144);
+  }
+  .wanon, .wanoff {
+	border-radius: 60px;
+	box-shadow: 0px 2px 5px -3px;
+	float: left;
+	margin: 8px 3px 0px 3px;
+	min-height: 30px;
+	min-width: 235px;
+	padding: 5px 10px 8px 10px;
+	text-align: center;
+  }
+  #mwan3_statuslog_text {
+	padding: 20px;
+	text-align: left;
+  }
+</style>
+
+<%+footer%>

net/mwan3-luci/files/usr/lib/lua/luci/view/mwan3/mwan3_status.htm

@@ -0,0 +1,95 @@
+<script type="text/javascript">//<![CDATA[
+	XHR.poll(5, '<%=luci.dispatcher.build_url("admin", "network", "mwan3", "overview", "iface_status")%>', null,
+		function(x, st)
+		{
+			var tx = document.getElementById('mwan3_status_text');
+			if (st.wans)
+			{
+				var temp = '';
+
+				for( var i = 0; i < st.wans.length; i++ )
+				{
+					var stat = '';
+					var cssc = '';
+
+					switch (st.wans[i].status)
+					{
+						case 'on':
+							stat = 'Online (tracking active)';
+							cssc = 'wanon';
+							break;
+
+						case 'nm':
+							stat = 'Online (tracking off)';
+							cssc = 'wanon';
+							break;
+
+						case 'off':
+							stat = 'Offline';
+							cssc = 'wanoff';
+							break;
+
+						case 'ne':
+							stat = 'Disabled';
+							cssc = 'wanoff';
+							break;
+					}
+
+					temp += String.format(
+						'<span class="%s"><strong>%s (<a href="%q">%s</a>)</strong><br />%s</span>',
+							cssc, st.wans[i].name, st.wans[i].link, st.wans[i].ifname, stat
+					);
+				}
+				tx.innerHTML = temp;
+			}
+			else
+			{
+				var temp = '';
+				var ncint = 'No MWAN3 interfaces found';
+				temp += String.format(
+					'<strong>%s</strong>',
+						ncint
+				);
+				tx.innerHTML = temp;
+			}
+		}
+	);
+//]]></script>
+
+<fieldset id="interface_field" class="cbi-section">
+	<legend><%:MWAN3 Multi-WAN Interface Live Status%></legend>
+	<div id="mwan3_status_text"><img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" /> Collecting data...</div>
+</fieldset>
+
+<style type="text/css">
+  .container {  /*container for entire page. fixes bootstrap theme's ridiculously small page width*/
+	max-width: 1044px;
+  }
+  #interface_field {
+	padding: 12px 20px 20px 20px;
+  }
+  #mwan3_status_text {
+	display: table;
+	font-size: 14px;
+	margin: auto;
+	max-width: 1044px;
+	min-width: 246px;
+	width: 100%;
+  }
+  .wanon {
+	background-color: rgb(144, 240, 144);
+  }
+  .wanoff {
+	background-color: rgb(240, 144, 144);
+  }
+  .wanon, .wanoff {
+	border-radius: 60px;
+	box-shadow: 0px 2px 5px -3px;
+	float: left;
+	margin: 8px 3px 0px 3px;
+	min-height: 30px;
+	min-width: 235px;
+	padding: 5px 10px 8px 10px;
+	text-align: center;
+  }
+</style>