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

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