applications/luci-app-mwan3/luasrc/view/mwan/overview_status_interface.htm

   1 <%#
   2  Copyright 2014 Aedan Renner <chipdankly@gmail.com>
   3  Copyright 2018 Florian Eckert <fe@dev.tdt.de>
   4  Licensed to the public under the GNU General Public License v2.
   5 -%>
   6
   7 <script type="text/javascript">//<![CDATA[
   8 XHR.poll(5, '<%=luci.dispatcher.build_url("admin", "status", "mwan", "interface_status")%>', null,
   9                 function(x, status)
  10                 {
  11                         var statusDiv = document.getElementById('mwan_status_text');
  12                         if (status.interfaces)
  13                         {
  14                                 var statusview = '';
  15                                 for ( var iface in status.interfaces)
  16                                 {
  17                                         var state = '';
  18                                         var css = '';
  19                                         switch (status.interfaces[iface].status)
  20                                         {
  21                                                 case 'online':
  22                                                         state = '<%:Online (tracking active)%>';
  23                                                         css = 'wanon';
  24                                                         break;
  25                                                 case 'notMonitored':
  26                                                         state = '<%:Online (tracking off)%>';
  27                                                         css = 'wanon';
  28                                                         break;
  29                                                 case 'offline':
  30                                                         state = '<%:Offline%>';
  31                                                         css = 'wanoff';
  32                                                         break;
  33                                                 default:
  34                                                         state = '<%:Disabled%>';
  35                                                         css = 'wanoff';
  36                                                         break;
  37                                         }
  38                                         statusview += String.format(
  39                                                 '<span class="%s"><strong>%s</strong><br />%s</span>',
  40                                                 css,
  41                                                 iface,
  42                                                 state
  43                                         );
  44                                 }
  45                                 statusDiv.innerHTML = statusview;
  46                         }
  47                         else
  48                         {
  49                                 statusDiv.innerHTML = '<strong><%:No MWAN interfaces found%></strong>';
  50                         }
  51                 }
  52         );
  53 //]]></script>
  54
  55 <fieldset id="interface_field" class="cbi-section">
  56         <legend><%:MWAN Interface Live Status%></legend>
  57         <div id="mwan_status_text"><img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" /><%:Collecting data...%></div>
  58 </fieldset>
  59
  60 <style type="text/css">
  61   .container {  /* container for entire page. fixes bootstrap theme's ridiculously small page width */
  62         max-width: 1044px;
  63   }
  64   #mwan_status_text {
  65         display: table;
  66         font-size: 14px;
  67         margin: auto;
  68         max-width: 1044px;
  69         min-width: 246px;
  70         width: 100%;
  71   }
  72   .wanon {
  73         background-color: rgb(144, 240, 144);
  74   }
  75   .wanoff {
  76         background-color: rgb(240, 144, 144);
  77   }
  78   .wanon, .wanoff {
  79         border-radius: 60px;
  80         box-shadow: 0px 2px 5px -3px;
  81         float: left;
  82         margin: 8px 3px 0px 3px;
  83         min-height: 30px;
  84         min-width: 235px;
  85         padding: 5px 10px 8px 10px;
  86         text-align: center;
  87   }
  88 </style>