release/src/router/www/ipt-realtime.asp

   1 <!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.0//EN'>
   2 <!--
   3         Tomato GUI
   4         Copyright (C) 2006-2010 Jonathan Zarate
   5         http://www.polarcloud.com/tomato/
   6
   7         For use with Tomato Firmware only.
   8         No part of this file may be used without permission.
   9 -->
  10 <html>
  11 <head>
  12 <meta http-equiv='content-type' content='text/html;charset=utf-8'>
  13 <meta name='robots' content='noindex,nofollow'>
  14 <title>[<% ident(); %>] Bandwidth: Real-Time Client Monitor</title>
  15 <link rel='stylesheet' type='text/css' href='tomato.css'>
  16 <% css(); %>
  17 <script type='text/javascript' src='tomato.js'></script>
  18
  19 <!-- / / / -->
  20
  21 <style type='text/css'>
  22 #txt {
  23         width: 550px;
  24         white-space: nowrap;
  25 }
  26 #bwm-controls {
  27         text-align: right;
  28         margin-right: 5px;
  29         margin-top: 5px;
  30         float: right;
  31         visibility: hidden;
  32 }
  33 ul.tabs a,
  34 #tabs a {
  35         width: 140px;
  36         height: 12px;
  37         font-size: 9px;
  38         font-weight:bold;
  39 }
  40 </style>
  41
  42 <script type='text/javascript' src='debug.js'></script>
  43
  44 <script type='text/javascript' src='wireless.jsx?_http_id=<% nv(http_id); %>'></script>
  45 <script type='text/javascript' src='bwm-common.js'></script>
  46 <script type='text/javascript' src='interfaces.js'></script>
  47
  48 <script type='text/javascript'>
  49 //      <% nvram("wan_ifname,lan_ifname,wl_ifname,wan_proto,wan_iface,web_svg,cstats_enable,cstats_colors,dhcpd_static,lan_ipaddr,lan_netmask,lan1_ipaddr,lan1_netmask,lan2_ipaddr,lan2_netmask,lan3_ipaddr,lan3_netmask,cstats_labels"); %>
  50
  51 //      <% devlist(); %>
  52
  53 var cprefix = 'ipt_';
  54 var updateInt = 2;
  55 var updateDiv = updateInt;
  56 var updateMaxL = 300;
  57 var updateReTotal = 1;
  58 var prev = [];
  59 var debugTime = 0;
  60 var avgMode = 0;
  61 var wdog = null;
  62 var wdogWarn = null;
  63
  64 var ipt_addr_shown = [];
  65 var ipt_addr_hidden = [];
  66
  67 hostnamecache = [];
  68
  69 var ref = new TomatoRefresh('update.cgi', 'exec=iptmon', updateInt);
  70
  71 ref.stop = function() {
  72         this.timer.start(1000);
  73 }
  74
  75 ref.refresh = function(text) {
  76         var c, i, h, n, j, k, l;
  77
  78         watchdogReset();
  79
  80         ++updating;
  81         try {
  82                 iptmon = null;
  83                 eval(text);
  84
  85                 n = (new Date()).getTime();
  86                 if (this.timeExpect) {
  87                         if (debugTime) E('dtime').innerHTML = (this.timeExpect - n) + ' ' + ((this.timeExpect + 1000*updateInt) - n);
  88                         this.timeExpect += 1000*updateInt;
  89                         this.refreshTime = MAX(this.timeExpect - n, 500);
  90                 }
  91                 else {
  92                         this.timeExpect = n + 1000*updateInt;
  93                 }
  94
  95                 for (i in iptmon) {
  96                         c = iptmon[i];
  97                         if ((p = prev[i]) != null) {
  98                                 h = speed_history[i];
  99
 100                                 h.rx.splice(0, 1);
 101                                 h.rx.push((c.rx < p.rx) ? (c.rx + (0xFFFFFFFF - p.rx)) : (c.rx - p.rx));
 102
 103                                 h.tx.splice(0, 1);
 104                                 h.tx.push((c.tx < p.tx) ? (c.tx + (0xFFFFFFFF - p.tx)) : (c.tx - p.tx));
 105                         }
 106                         else if (!speed_history[i]) {
 107                                 speed_history[i] = {};
 108                                 h = speed_history[i];
 109                                 h.rx = [];
 110                                 h.tx = [];
 111                                 for (j = 300; j > 0; --j) {
 112                                         h.rx.push(0);
 113                                         h.tx.push(0);
 114                                 }
 115                                 h.count = 0;
 116                                 h.hide = 0;
 117                         }
 118                         prev[i] = c;
 119
 120                         if ((ipt_addr_hidden.find(i) == -1) && (ipt_addr_shown.find(i) == -1) && (i.trim() != '')) {
 121                                 ipt_addr_shown.push(i);
 122                                 var option=document.createElement("option");
 123                                 option.value=i;
 124                                 if (hostnamecache[i] != null) {
 125                                         option.text = hostnamecache[i] + ' (' + i + ')';
 126                                 } else {
 127                                         option.text=i;
 128                                 }
 129                                 E('_f_ipt_addr_shown').add(option,null);
 130                         }
 131
 132                         if (ipt_addr_hidden.find(i) != -1) {
 133                                 speed_history[i].hide = 1;
 134                         } else {
 135                                 speed_history[i].hide = 0;
 136                         }
 137
 138                         verifyFields(null,1);
 139
 140                 }
 141                 loadData();
 142         }
 143         catch (ex) {
 144 /* REMOVE-BEGIN
 145 //                      alert('ex=' + ex);
 146 REMOVE-END */
 147         }
 148         --updating;
 149 }
 150
 151 function watchdog() {
 152         watchdogReset();
 153         ref.stop();
 154         wdogWarn.style.display = '';
 155 }
 156
 157 function watchdogReset() {
 158         if (wdog) clearTimeout(wdog)
 159         wdog = setTimeout(watchdog, 5000*updateInt);
 160         wdogWarn.style.display = 'none';
 161 }
 162
 163 function init() {
 164         if (nvram.cstats_enable != '1') return;
 165
 166         populateCache();
 167
 168         speed_history = [];
 169
 170         initCommon(2, 1, 1);
 171
 172         wdogWarn = E('warnwd');
 173         watchdogReset();
 174
 175         var c;
 176         if ((c = cookie.get('ipt_addr_hidden')) != null) {
 177                 c = c.split(',');
 178                 for (var i = 0; i < c.length; ++i) {
 179                         if (c[i].trim() != '') {
 180                                 ipt_addr_hidden.push(c[i]);
 181                                 var option=document.createElement("option");
 182                                 option.value=c[i];
 183                                 if (hostnamecache[c[i]] != null) {
 184                                         option.text = hostnamecache[c[i]] + ' (' + c[i] + ')';
 185                                 } else {
 186                                         option.text = c[i];
 187                                 }
 188                                 E('_f_ipt_addr_hidden').add(option,null);
 189                         }
 190                 }
 191         }
 192
 193         verifyFields(null,1);
 194
 195         var theRules = document.styleSheets[document.styleSheets.length-1].cssRules;
 196         switch (nvram['cstats_labels']) {
 197                 case '1':               // show hostnames only
 198                         theRules[theRules.length-1].style.cssText = 'width: 140px; font-weight:bold;';
 199 /* REMOVE-BEGIN */
 200 //                      document.styleSheets[2].deleteRule(theRules.length - 1);
 201 /* REMOVE-END */
 202                         break;
 203                 case '2':               // show IPs only
 204                         theRules[theRules.length-1].style.cssText = 'width: 140px; font-weight:bold;';
 205                         break;
 206                 case '0':               // show hostnames + IPs
 207                 default:
 208 /* REMOVE-BEGIN */
 209 //                      theRules[theRules.length-1].style.cssText = 'width: 140px; height: 12px; font-size: 9px;';
 210 /* REMOVE-END */
 211                         break;
 212         }
 213
 214         ref.start();
 215 }
 216
 217 function verifyFields(focused, quiet) {
 218         var changed_addr_hidden = 0;
 219         if (focused != null) {
 220                 if (focused.id == '_f_ipt_addr_shown') {
 221                         ipt_addr_shown.remove(focused.options[focused.selectedIndex].value);
 222                         ipt_addr_hidden.push(focused.options[focused.selectedIndex].value);
 223                         var option=document.createElement("option");
 224                         option.text=focused.options[focused.selectedIndex].text;
 225                         option.value=focused.options[focused.selectedIndex].value;
 226                         E('_f_ipt_addr_shown').remove(focused.selectedIndex);
 227                         E('_f_ipt_addr_shown').selectedIndex=0;
 228                         E('_f_ipt_addr_hidden').add(option,null);
 229                         changed_addr_hidden = 1;
 230                 }
 231
 232                 if (focused.id == '_f_ipt_addr_hidden') {
 233                         ipt_addr_hidden.remove(focused.options[focused.selectedIndex].value);
 234                         ipt_addr_shown.push(focused.options[focused.selectedIndex].value);
 235                         var option=document.createElement("option");
 236                         option.text=focused.options[focused.selectedIndex].text;
 237                         option.value=focused.options[focused.selectedIndex].value;
 238                         E('_f_ipt_addr_hidden').remove(focused.selectedIndex);
 239                         E('_f_ipt_addr_hidden').selectedIndex=0;
 240                         E('_f_ipt_addr_shown').add(option,null);
 241                         changed_addr_hidden = 1;
 242                 }
 243                 if (changed_addr_hidden == 1) {
 244                         cookie.set('ipt_addr_hidden', ipt_addr_hidden.join(','), 1);
 245                 }
 246         }
 247
 248         if (E('_f_ipt_addr_hidden').length < 2) {
 249                 E('_f_ipt_addr_hidden').disabled = 1;
 250         } else {
 251                 E('_f_ipt_addr_hidden').disabled = 0;
 252         }
 253
 254         if (E('_f_ipt_addr_shown').length < 2) {
 255                 E('_f_ipt_addr_shown').disabled = 1;
 256         } else {
 257                 E('_f_ipt_addr_shown').disabled = 0;
 258         }
 259
 260         return 1;
 261 }
 262 </script>
 263
 264 </head>
 265 <body onload='init()'>
 266 <form>
 267 <table id='container' cellspacing=0>
 268 <tr><td colspan=2 id='header'>
 269         <div class='title'>Tomato</div>
 270         <div class='version'>Version <% version(); %></div>
 271 </td></tr>
 272 <tr id='body'><td id='navi'><script type='text/javascript'>navi()</script></td>
 273 <td id='content'>
 274 <div id='ident'><% ident(); %></div>
 275
 276 <!-- / / / -->
 277 <div id='cstats'>
 278         <div id='tab-area'></div>
 279
 280         <script type='text/javascript'>
 281         if ((nvram.web_svg != '0') && (nvram.cstats_enable == '1')) {
 282                 // without a div, Opera 9 moves svgdoc several pixels outside of <embed> (?)
 283                 W("<div style='border-top:1px solid #f0f0f0;border-bottom:1px solid #f0f0f0;visibility:hidden;padding:0;margin:0' id='graph'><embed src='bwm-graph.svg?<% version(); %>' style='width:760px;height:300px;margin:0;padding:0' type='image/svg+xml' pluginspage='http://www.adobe.com/svg/viewer/install/'></embed></div>");
 284         }
 285         </script>
 286
 287         <div id='bwm-controls'>
 288                 <small>(<script type='text/javascript'>W(5*updateInt);</script> minute window, <script type='text/javascript'>W(updateInt);</script> second interval)</small><br>
 289                 <br>
 290                 Avg:&nbsp;
 291                         <a href='javascript:switchAvg(1)' id='avg1'>Off</a>,
 292                         <a href='javascript:switchAvg(2)' id='avg2'>2x</a>,
 293                         <a href='javascript:switchAvg(4)' id='avg4'>4x</a>,
 294                         <a href='javascript:switchAvg(6)' id='avg6'>6x</a>,
 295                         <a href='javascript:switchAvg(8)' id='avg8'>8x</a><br>
 296                 Max:&nbsp;
 297                         <a href='javascript:switchScale(0)' id='scale0'>Uniform</a>,
 298                         <a href='javascript:switchScale(1)' id='scale1'>Per Address</a><br>
 299                 Display:&nbsp;
 300                         <a href='javascript:switchDraw(0)' id='draw0'>Solid</a>,
 301                         <a href='javascript:switchDraw(1)' id='draw1'>Line</a><br>
 302                 Color:&nbsp; <a href='javascript:switchColor()' id='drawcolor'>-</a><br>
 303                 <small><a href='javascript:switchColor(1)' id='drawrev'>[reverse]</a></small><br>
 304
 305                 <br><br>
 306                 &nbsp; &raquo; <a href="admin-iptraffic.asp">Configure</a>
 307         </div>
 308
 309         <br><br>
 310         <table border=0 cellspacing=2 id='txt'>
 311         <tr>
 312                 <td width='8%' align='right' valign='top'><b style='border-bottom:blue 1px solid' id='rx-name'>RX</b></td>
 313                         <td width='15%' align='right' valign='top'><span id='rx-current'></span></td>
 314                 <td width='8%' align='right' valign='top'><b>Avg</b></td>
 315                         <td width='15%' align='right' valign='top' id='rx-avg'></td>
 316                 <td width='8%' align='right' valign='top'><b>Peak</b></td>
 317                         <td width='15%' align='right' valign='top' id='rx-max'></td>
 318                 <td width='8%' align='right' valign='top'><b>Total</b></td>
 319                         <td width='14%' align='right' valign='top' id='rx-total'></td>
 320                 <td>&nbsp;</td>
 321         </tr>
 322         <tr>
 323                 <td width='8%' align='right' valign='top'><b style='border-bottom:blue 1px solid' id='tx-name'>TX</b></td>
 324                         <td width='15%' align='right' valign='top'><span id='tx-current'></span></td>
 325                 <td width='8%' align='right' valign='top'><b>Avg</b></td>
 326                         <td width='15%' align='right' valign='top' id='tx-avg'></td>
 327                 <td width='8%' align='right' valign='top'><b>Peak</b></td>
 328                         <td width='15%' align='right' valign='top' id='tx-max'></td>
 329                 <td width='8%' align='right' valign='top'><b>Total</b></td>
 330                         <td width='14%' align='right' valign='top' id='tx-total'></td>
 331                 <td>&nbsp;</td>
 332         </tr>
 333         </table>
 334
 335 <!-- / / / -->
 336
 337 <br>
 338
 339 <div>
 340 <script type='text/javascript'>
 341 createFieldTable('', [
 342         { title: 'IPs currently on graphic', name: 'f_ipt_addr_shown', type: 'select', options: [[0,'Select']], suffix: ' <small>(Click/select a device from this list to hide it)</small>' },
 343         { title: 'Hidden addresses', name: 'f_ipt_addr_hidden', type: 'select', options: [[0,'Select']], suffix: ' <small>(Click/select to show it again)</small>' }
 344         ]);
 345 </script>
 346 </div>
 347
 348 </div>
 349 <br>
 350
 351 <!-- / / / -->
 352
 353 <script type='text/javascript'>
 354 if (nvram.cstats_enable != '1') {
 355         W('<div class="note-disabled">IP Traffic monitoring disabled.</b><br><br><a href="admin-iptraffic.asp">Enable &raquo;</a><div>');
 356         E('cstats').style.display = 'none';
 357 }else {
 358         W('<div class="note-warning" style="display:none" id="rbusy">The cstats program is not responding or is busy. Try reloading after a few seconds.</div>');
 359 }
 360 </script>
 361
 362 <!-- / / / -->
 363
 364 </td></tr>
 365 <tr><td id='footer' colspan=2>
 366         <span id='warnwd' style='display:none'>Warning: 10 second timeout, restarting...&nbsp;</span>
 367         <span id='dtime'></span>
 368         <img src='spin.gif' id='refresh-spinner' onclick='javascript:debugTime=1'>
 369
 370 </td></tr>
 371 </table>
 372 </form>
 373 </body>
 374 </html>