summaryrefslogtreecommitdiffhomepage
path: root/applications/luci-app-mwan3/luasrc/view/mwan
diff options
context:
space:
mode:
Diffstat (limited to 'applications/luci-app-mwan3/luasrc/view/mwan')
-rw-r--r--applications/luci-app-mwan3/luasrc/view/mwan/advanced_diagnostics.htm129
-rw-r--r--applications/luci-app-mwan3/luasrc/view/mwan/advanced_hotplugscript.htm24
-rw-r--r--applications/luci-app-mwan3/luasrc/view/mwan/advanced_mwanconfig.htm24
-rw-r--r--applications/luci-app-mwan3/luasrc/view/mwan/advanced_networkconfig.htm24
-rw-r--r--applications/luci-app-mwan3/luasrc/view/mwan/advanced_troubleshooting.htm74
-rw-r--r--applications/luci-app-mwan3/luasrc/view/mwan/advanced_wirelessconfig.htm24
-rw-r--r--applications/luci-app-mwan3/luasrc/view/mwan/config_css.htm34
-rw-r--r--applications/luci-app-mwan3/luasrc/view/mwan/openwrt_overview_status.htm83
-rw-r--r--applications/luci-app-mwan3/luasrc/view/mwan/overview_detailed.htm51
-rw-r--r--applications/luci-app-mwan3/luasrc/view/mwan/overview_interface.htm122
10 files changed, 589 insertions, 0 deletions
diff --git a/applications/luci-app-mwan3/luasrc/view/mwan/advanced_diagnostics.htm b/applications/luci-app-mwan3/luasrc/view/mwan/advanced_diagnostics.htm
new file mode 100644
index 0000000000..14d404bc7c
--- /dev/null
+++ b/applications/luci-app-mwan3/luasrc/view/mwan/advanced_diagnostics.htm
@@ -0,0 +1,129 @@
+<%+header%>
+
+<ul class="cbi-tabmenu">
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/hotplugscript")%>"><%:Hotplug Script%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/mwanconfig")%>"><%:MWAN Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/networkconfig")%>"><%:Network Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/wirelessconfig")%>"><%:Wireless Config%></a></li>
+ <li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/diagnostics")%>"><%:Diagnostics%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/troubleshooting")%>"><%:Troubleshooting%></a></li>
+</ul>
+
+<%
+ local uci = require "luci.model.uci"
+
+ interfaceNames = ""
+ uci.cursor():foreach("mwan3", "interface",
+ function (section)
+ interfaceNames = interfaceNames .. 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, task)
+ {
+ var iface = document.getElementById('mwaniface').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 MWAN to " + task + "..."
+ ;
+ }
+ 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", "mwan", "advanced")%>/diagnostics_display' + '/' + iface + '/' + tool + '/' + task, null,
+ function(x, mArray)
+ {
+ if (mArray.diagnostics)
+ {
+ output.innerHTML = String.format('<pre id="diag_output_css">%h</pre>', mArray.diagnostics[0]);
+ }
+ else
+ {
+ output.innerHTML = '<pre id="diag_output_css"><strong>No diagnostic results returned</strong></pre>';
+ }
+ }
+ );
+ }
+//]]></script>
+
+<div id="mwan_diagnostics" class="cbi-map">
+ <fieldset id="diag_select" class="cbi-section">
+ <legend><%:MWAN Interface Diagnostics%></legend>
+ <select id="mwaniface">
+ <% for z in interfaceNames: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><%:MWAN Service Control%></legend>
+ <div id="buttoncss">
+ <input type="button" value="<%:Restart MWAN%>" class="cbi-button cbi-button-apply" onclick="update_status('service', 'restart')" />
+ <input type="button" value="<%:Stop MWAN%>" class="cbi-button cbi-button-apply" onclick="update_status('service', 'stop')" />
+ <input type="button" value="<%:Start MWAN%>" 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;
+ }
+ #mwan_diagnostics {
+ background-color: #FFFFFF;
+ border: 1px dotted #555555;
+ padding: 20px;
+ }
+ #diag_select {
+ padding: 12px 20px 20px 20px;
+ }
+ #mwaniface {
+ 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%>
diff --git a/applications/luci-app-mwan3/luasrc/view/mwan/advanced_hotplugscript.htm b/applications/luci-app-mwan3/luasrc/view/mwan/advanced_hotplugscript.htm
new file mode 100644
index 0000000000..4c2a0dc208
--- /dev/null
+++ b/applications/luci-app-mwan3/luasrc/view/mwan/advanced_hotplugscript.htm
@@ -0,0 +1,24 @@
+<ul class="cbi-tabmenu">
+ <li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/hotplugscript")%>"><%:Hotplug Script%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/mwanconfig")%>"><%:MWAN Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/networkconfig")%>"><%:Network Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/wirelessconfig")%>"><%:Wireless Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/diagnostics")%>"><%:Diagnostics%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/troubleshooting")%>"><%: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>
diff --git a/applications/luci-app-mwan3/luasrc/view/mwan/advanced_mwanconfig.htm b/applications/luci-app-mwan3/luasrc/view/mwan/advanced_mwanconfig.htm
new file mode 100644
index 0000000000..fba3fa6940
--- /dev/null
+++ b/applications/luci-app-mwan3/luasrc/view/mwan/advanced_mwanconfig.htm
@@ -0,0 +1,24 @@
+<ul class="cbi-tabmenu">
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/hotplugscript")%>"><%:Hotplug Script%></a></li>
+ <li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/mwanconfig")%>"><%:MWAN Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/networkconfig")%>"><%:Network Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/wirelessconfig")%>"><%:Wireless Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/diagnostics")%>"><%:Diagnostics%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/troubleshooting")%>"><%: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>
diff --git a/applications/luci-app-mwan3/luasrc/view/mwan/advanced_networkconfig.htm b/applications/luci-app-mwan3/luasrc/view/mwan/advanced_networkconfig.htm
new file mode 100644
index 0000000000..cf90112078
--- /dev/null
+++ b/applications/luci-app-mwan3/luasrc/view/mwan/advanced_networkconfig.htm
@@ -0,0 +1,24 @@
+<ul class="cbi-tabmenu">
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/hotplugscript")%>"><%:Hotplug Script%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/mwanconfig")%>"><%:MWAN Config%></a></li>
+ <li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/networkconfig")%>"><%:Network Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/wirelessconfig")%>"><%:Wireless Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/diagnostics")%>"><%:Diagnostics%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/troubleshooting")%>"><%: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>
diff --git a/applications/luci-app-mwan3/luasrc/view/mwan/advanced_troubleshooting.htm b/applications/luci-app-mwan3/luasrc/view/mwan/advanced_troubleshooting.htm
new file mode 100644
index 0000000000..0a12496899
--- /dev/null
+++ b/applications/luci-app-mwan3/luasrc/view/mwan/advanced_troubleshooting.htm
@@ -0,0 +1,74 @@
+<%+header%>
+
+<ul class="cbi-tabmenu">
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/hotplugscript")%>"><%:Hotplug Script%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/mwanconfig")%>"><%:MWAN Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/networkconfig")%>"><%:Network Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/wirelessconfig")%>"><%:Wireless Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/diagnostics")%>"><%:Diagnostics%></a></li>
+ <li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/troubleshooting")%>"><%: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", "mwan", "advanced", "troubleshooting_display")%>', null,
+ function(x, mArray)
+ {
+ var tshoot = document.getElementById('troubleshoot_text');
+ if (mArray.versions)
+ {
+ var versions = '<span class="description">Software versions : </span><br /><br />';
+ var mwanConfig = '<br /><br /><span class="description">Output of &#34;cat /etc/config/mwan3&#34; : </span><br /><br />';
+ var netConfig = '<br /><br /><span class="description">Output of &#34;cat /etc/config/network&#34; : </span><br /><br />';
+ var wifiConfig = '<br /><br /><span class="description">Output of &#34;cat /etc/config/wireless&#34; : </span><br /><br />';
+ var ifconfig = '<br /><br /><span class="description">Output of &#34;ifconfig&#34; : </span><br /><br />';
+ var ipRoute = '<br /><br /><span class="description">Output of &#34;route -n&#34; : </span><br /><br />';
+ var ipRuleShow = '<br /><br /><span class="description">Output of &#34;ip rule show&#34; : </span><br /><br />';
+ var routeListTable = '<br /><br /><span class="description">Output of &#34;ip route list table 1-250&#34; : </span><br /><br />';
+ var firewallOut = '<br /><br /><span class="description">Firewall default output policy (must be ACCEPT) : </span><br /><br />';
+ var iptables = '<br /><br /><span class="description">Output of &#34;iptables -L -t mangle -v -n&#34; : </span><br /><br />';
+ tshoot.innerHTML = String.format(
+ '<pre>%s%s%s%s%s%s%s%s%s%s%s%s%s%s%s%s%s%s%s%s</pre>',
+ versions, mArray.versions[0], mwanConfig, mArray.mwanconfig[0], netConfig, mArray.netconfig[0],
+ wifiConfig, mArray.wificonfig[0], ifconfig, mArray.ifconfig[0], ipRoute, mArray.routeshow[0],
+ ipRuleShow, mArray.iprule[0], routeListTable, mArray.routelist[0], firewallOut, mArray.firewallout[0],
+ iptables, mArray.iptables[0]
+ );
+ }
+ else
+ {
+ tshoot.innerHTML = '<strong>Error collecting troubleshooting information</strong>';
+ }
+ }
+ );
+//]]></script>
+
+<div id="troubleshoot">
+ <fieldset class="cbi-section">
+ <legend><%:Troubleshooting Data%></legend>
+ <div id="troubleshoot_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;
+ }
+ #troubleshoot {
+ background-color: #FFFFFF;
+ border: 1px dotted #555555;
+ padding: 20px;
+ }
+ #troubleshoot_text {
+ padding: 20px;
+ text-align: left;
+ }
+ .description {
+ background-color: rgb(78, 186, 241);
+ }
+</style>
+
+<%+footer%>
diff --git a/applications/luci-app-mwan3/luasrc/view/mwan/advanced_wirelessconfig.htm b/applications/luci-app-mwan3/luasrc/view/mwan/advanced_wirelessconfig.htm
new file mode 100644
index 0000000000..5077674185
--- /dev/null
+++ b/applications/luci-app-mwan3/luasrc/view/mwan/advanced_wirelessconfig.htm
@@ -0,0 +1,24 @@
+<ul class="cbi-tabmenu">
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/hotplugscript")%>"><%:Hotplug Script%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/mwanconfig")%>"><%:MWAN Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/networkconfig")%>"><%:Network Config%></a></li>
+ <li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/wirelessconfig")%>"><%:Wireless Config%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/diagnostics")%>"><%:Diagnostics%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/advanced/troubleshooting")%>"><%: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>
diff --git a/applications/luci-app-mwan3/luasrc/view/mwan/config_css.htm b/applications/luci-app-mwan3/luasrc/view/mwan/config_css.htm
new file mode 100644
index 0000000000..99da4875b0
--- /dev/null
+++ b/applications/luci-app-mwan3/luasrc/view/mwan/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>
diff --git a/applications/luci-app-mwan3/luasrc/view/mwan/openwrt_overview_status.htm b/applications/luci-app-mwan3/luasrc/view/mwan/openwrt_overview_status.htm
new file mode 100644
index 0000000000..9329b92735
--- /dev/null
+++ b/applications/luci-app-mwan3/luasrc/view/mwan/openwrt_overview_status.htm
@@ -0,0 +1,83 @@
+<script type="text/javascript">//<![CDATA[
+ XHR.poll(5, '<%=luci.dispatcher.build_url("admin", "network", "mwan", "overview", "interface_status")%>', null,
+ function(x, mArray)
+ {
+ var status = document.getElementById('mwan_status_text');
+ if (mArray.wans)
+ {
+ var temp = '';
+ for ( var i = 0; i < mArray.wans.length; i++ )
+ {
+ var stat = '';
+ var cssc = '';
+ switch (mArray.wans[i].status)
+ {
+ case 'online':
+ stat = 'Online (tracking active)';
+ cssc = 'wanon';
+ break;
+ case 'notMonitored':
+ stat = 'Online (tracking off)';
+ cssc = 'wanon';
+ break;
+ case 'offline':
+ stat = 'Offline';
+ cssc = 'wanoff';
+ break;
+ case 'notEnabled':
+ stat = 'Disabled';
+ cssc = 'wanoff';
+ break;
+ }
+ temp += String.format(
+ '<span class="%s"><strong>%s (<a href="%q">%s</a>)</strong><br />%s</span>',
+ cssc, mArray.wans[i].name, mArray.wans[i].link, mArray.wans[i].ifname, stat
+ );
+ }
+ status.innerHTML = temp;
+ }
+ else
+ {
+ status.innerHTML = '<strong>No MWAN interfaces found</strong>';
+ }
+ }
+ );
+//]]></script>
+
+<fieldset id="interface_field" class="cbi-section">
+ <legend><%:MWAN Interface Live Status%></legend>
+ <div id="mwan_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;
+ }
+ #mwan_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>
diff --git a/applications/luci-app-mwan3/luasrc/view/mwan/overview_detailed.htm b/applications/luci-app-mwan3/luasrc/view/mwan/overview_detailed.htm
new file mode 100644
index 0000000000..b80b9f3acf
--- /dev/null
+++ b/applications/luci-app-mwan3/luasrc/view/mwan/overview_detailed.htm
@@ -0,0 +1,51 @@
+<%+header%>
+
+<ul class="cbi-tabmenu">
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/overview")%>"><%:Interface Status%></a></li>
+ <li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/overview/overview_detailed")%>"><%: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", "mwan", "overview", "detailed_status")%>', null,
+ function(x, mArray)
+ {
+ var status = document.getElementById('mwan_detail_text');
+ if (mArray.mwandetail)
+ {
+ status.innerHTML = String.format('<pre>%s</pre>', mArray.mwandetail[0]);
+ }
+ else
+ {
+ status.innerHTML = '<strong>No detailed status information available</strong>';
+ }
+ }
+ );
+//]]></script>
+
+<div id="mwan_detail_status">
+ <fieldset class="cbi-section">
+ <legend><%:MWAN Detailed Status%></legend>
+ <div id="mwan_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;
+ }
+ #mwan_detail_status {
+ border: 1px dotted #555555;
+ background-color: #FFFFFF;
+ padding: 20px;
+ }
+ #mwan_detail_text {
+ padding: 20px;
+ text-align: left;
+ }
+</style>
+
+<%+footer%>
diff --git a/applications/luci-app-mwan3/luasrc/view/mwan/overview_interface.htm b/applications/luci-app-mwan3/luasrc/view/mwan/overview_interface.htm
new file mode 100644
index 0000000000..472c7ce7fc
--- /dev/null
+++ b/applications/luci-app-mwan3/luasrc/view/mwan/overview_interface.htm
@@ -0,0 +1,122 @@
+<%+header%>
+
+<ul class="cbi-tabmenu">
+ <li class="cbi-tab"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/overview")%>"><%:Interface Status%></a></li>
+ <li class="cbi-tab-disabled"><a href="<%=luci.dispatcher.build_url("admin/network/mwan/overview/overview_detailed")%>"><%: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", "mwan", "overview", "interface_status")%>', null,
+ function(x, mArray)
+ {
+ var statusDiv = document.getElementById('mwan_status_text');
+ if (mArray.wans)
+ {
+ var interfaceStatus = '';
+ for ( var i = 0; i < mArray.wans.length; i++ )
+ {
+ var status = '';
+ var css = '';
+ switch (mArray.wans[i].status)
+ {
+ case 'online':
+ status = 'Online (tracking active)';
+ css = 'wanon';
+ break;
+ case 'notMonitored':
+ status = 'Online (tracking off)';
+ css = 'wanon';
+ break;
+ case 'offline':
+ status = 'Offline';
+ css = 'wanoff';
+ break;
+ case 'notEnabled':
+ status = 'Disabled';
+ css = 'wanoff';
+ break;
+ }
+ interfaceStatus += String.format(
+ '<span class="%s"><strong>%s (<a href="%q">%s</a>)</strong><br />%s</span>',
+ css, mArray.wans[i].name, mArray.wans[i].link, mArray.wans[i].ifname, status
+ );
+ }
+ statusDiv.innerHTML = interfaceStatus;
+ }
+ else
+ {
+ statusDiv.innerHTML = '<strong>No MWAN interfaces found</strong>';
+ }
+
+ var logs = document.getElementById('mwan_statuslog_text');
+ if (mArray.mwanlog)
+ {
+ var mwanLog = 'Last 50 MWAN systemlog entries. Newest entries sorted at the top :';
+ logs.innerHTML = String.format('<pre>%s<br /><br />%s</pre>', mwanLog, mArray.mwanlog[0]);
+ }
+ else
+ {
+ logs.innerHTML = '<strong>No MWAN systemlog history found</strong>';
+ }
+ }
+ );
+//]]></script>
+
+<div id="mwan_interface_status">
+ <fieldset id="interface_field" class="cbi-section">
+ <legend><%:MWAN Interface Live Status%></legend>
+ <div id="mwan_status_text"><img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" /> Collecting data...</div>
+ </fieldset>
+ <fieldset class="cbi-section">
+ <legend><%:MWAN Interface Systemlog%></legend>
+ <div id="mwan_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;
+ }
+ #mwan_interface_status {
+ background-color: #FFFFFF;
+ border: 1px dotted #555555;
+ padding: 20px;
+ }
+ #interface_field {
+ padding: 12px 20px 20px 20px;
+ }
+ #mwan_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;
+ }
+ #mwan_statuslog_text {
+ padding: 20px;
+ text-align: left;
+ }
+</style>
+
+<%+footer%>