release/src/router/www/ipt-details.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         IP Traffic enhancements
   8         Copyright (C) 2011 Augusto Bott
   9         http://code.google.com/p/tomato-sdhc-vlan/
  10
  11         For use with Tomato Firmware only.
  12         No part of this file may be used without permission.
  13 -->
  14 <html>
  15 <head>
  16 <meta http-equiv='content-type' content='text/html;charset=utf-8'>
  17 <meta name='robots' content='noindex,nofollow'>
  18 <title>[<% ident(); %>] IP Traffic: Details</title>
  19 <link rel='stylesheet' type='text/css' href='tomato.css'>
  20 <% css(); %>
  21 <script type='text/javascript' src='tomato.js'></script>
  22
  23 <!-- / / / -->
  24
  25 <style type='text/css'>
  26 #grid .co2,
  27 #grid .co3,
  28 #grid .co4,
  29 #grid .co5,
  30 #grid .co6,
  31 #grid .co7,
  32 #grid .co8 {
  33         text-align: right;
  34 }
  35 </style>
  36
  37 <script type='text/javascript' src='debug.js'></script>
  38 <script type='text/javascript' src='protocols.js'></script>
  39 <script type='text/javascript' src='bwm-hist.js'></script>
  40 <script type='text/javascript' src='bwm-common.js'></script>
  41 <script type='text/javascript' src='interfaces.js'></script>
  42
  43 <script type='text/javascript'>
  44 //      <% nvram('cstats_enable,lan_ipaddr,lan1_ipaddr,lan2_ipaddr,lan3_ipaddr,lan_netmask,lan1_netmask,lan2_netmask,lan3_netmask,dhcpd_static'); %>
  45
  46 //      <% devlist(); %>
  47
  48 var cstats_busy = 0;
  49
  50 try {
  51 // <% iptraffic(); %>
  52 }
  53 catch (ex) {
  54         iptraffic = [];
  55         cstats_busy = 1;
  56 }
  57
  58 if (typeof(iptraffic) == 'undefined') {
  59         iptraffic = [];
  60         cstats_busy = 1;
  61 }
  62
  63 var grid = new TomatoGrid();
  64
  65 var scale = -1;
  66 var lock = 0;
  67
  68 var filterip = [];
  69 var filteripe = [];
  70
  71 var prevtimestamp = new Date().getTime();
  72 var thistimestamp;
  73 var difftimestamp;
  74 var avgiptraffic = [];
  75 var lastiptraffic = iptraffic;
  76
  77 var ref = new TomatoRefresh('update.cgi', '', 0, 'ipt_details');
  78 ref.refresh = function(text) {
  79
  80         ++lock;
  81
  82         var i, b, j, k, l;
  83
  84         thistimestamp = new Date().getTime();
  85
  86         try {
  87                 eval(text);
  88         }
  89         catch (ex) {
  90                 iptraffic = [];
  91                 cstats_busy = 1;
  92         }
  93
  94         difftimestamp = thistimestamp - prevtimestamp;
  95         prevtimestamp = thistimestamp;
  96
  97         for (i = 0; i < iptraffic.length; ++i) {
  98                 b = iptraffic[i];
  99
 100                 j = getArrayPosByElement(avgiptraffic, b[0], 0);
 101                 if (j == -1) {
 102                         j = avgiptraffic.length;
 103                         avgiptraffic[j] = [ b[0], 0, 0, 0, 0, 0, 0, 0, 0, b[9], b[10] ];
 104                 }
 105
 106                 k = getArrayPosByElement(lastiptraffic, b[0], 0);
 107                 if (k == -1) {
 108                         k = lastiptraffic.length;
 109                         lastiptraffic[k] = b;
 110                 }
 111
 112                 for (l = 1; l <= 8; ++l) {
 113                         avgiptraffic[j][l] = ((b[l] - lastiptraffic[k][l]) / difftimestamp * 1000);
 114                         lastiptraffic[k][l] = b[l];
 115                 }
 116
 117                 avgiptraffic[j][9] = b[9];
 118                 avgiptraffic[j][10] = b[10];
 119                 lastiptraffic[k][9] = b[9];
 120                 lastiptraffic[k][10] = b[10];
 121         }
 122
 123         setTimeout(function() { E('loading').style.visibility = 'hidden'; }, 100);
 124
 125         --lock;
 126
 127         grid.populate();
 128 }
 129
 130 grid.populate = function() {
 131         if ((lock) || (cstats_busy)) return;
 132
 133         var hostslisted = [];
 134
 135         var i, b, x;
 136         var fskip;
 137
 138         var tx = 0;
 139         var rx = 0;
 140         var tcpi = 0;
 141         var tcpo = 0;
 142         var udpi = 0;
 143         var udpo = 0;
 144         var icmpi = 0;
 145         var icmpo = 0;
 146         var tcpconn = 0;
 147         var udpconn = 0;
 148
 149         grid.removeAllData();
 150
 151         for (i = 0; i < avgiptraffic.length; ++i) {
 152                 fskip = 0;
 153                 b = avgiptraffic[i];
 154
 155                 if(E('_f_onlyactive').checked) {
 156                         if ((b[2] < 10) && (b[3] < 10))
 157                                 continue;
 158                 }
 159
 160                 if (filteripe.length>0) {
 161                         fskip = 0;
 162                         for (x = 0; x < filteripe.length; ++x) {
 163                                 if (b[0] == filteripe[x]){
 164                                         fskip=1;
 165                                         break;
 166                                 }
 167                         }
 168                         if (fskip == 1) continue;
 169                 }
 170
 171                 if (filterip.length>0) {
 172                         fskip = 1;
 173                         for (x = 0; x < filterip.length; ++x) {
 174                                 if (b[0] == filterip[x]){
 175                                         fskip=0;
 176                                         break;
 177                                 }
 178                         }
 179                         if (fskip == 1) continue;
 180                 }
 181
 182                 rx += b[1];
 183                 tx += b[2];
 184                 tcpi += b[3];
 185                 tcpo += b[4];
 186                 udpi += b[5];
 187                 udpo += b[6];
 188                 icmpi += b[7];
 189                 icmpo += b[8];
 190                 tcpconn += b[9];
 191                 udpconn += b[10];
 192                 hostslisted.push(b[0]);
 193
 194                 var h = b[0];
 195                 if (E('_f_hostnames').checked) {
 196                         if(hostnamecache[b[0]] != null) {
 197                                 h = hostnamecache[b[0]] + ((b[0].indexOf(':') != -1) ? '<br>' : ' ') + '<small>(' + b[0] + ')</small>';
 198                         }
 199                 }
 200
 201                 if (E('_f_shortcuts').checked) {
 202                         h = h + '<br><small>';
 203                         h = h + '<a href="javascript:viewQosDetail(' + i + ')" title="View QoS Details">[qosdetails]</a>';
 204                         h = h + '<a href="javascript:viewQosCTrates(' + i + ')" title="View transfer rates per connection">[qosrates]</a>';
 205                         h = h + '<a href="javascript:viewIptHistory(' + i + ')" title="View IP Traffic History">[history]</a>';
 206                         h = h + '<a href="javascript:addExcludeList(' + i + ')" title="Filter out this address">[hide]</a>';
 207                         h = h + '</small>';
 208                 }
 209
 210                 d = [h,
 211                         rescale((b[1]/1024).toFixed(2)).toString(),
 212                         rescale((b[2]/1024).toFixed(2)).toString(),
 213                         b[3].toFixed(0).toString(),
 214                         b[4].toFixed(0).toString(),
 215                         b[5].toFixed(0).toString(),
 216                         b[6].toFixed(0).toString(),
 217                         b[7].toFixed(0).toString(),
 218                         b[8].toFixed(0).toString(),
 219                         b[9].toString(),
 220                         b[10].toString()];
 221
 222                 grid.insertData(-1, d);
 223         }
 224
 225         grid.resort();
 226         grid.recolor();
 227         grid.footerSet([ 'Total ' + ('<small><i>(' + ((hostslisted.length > 0) ? (hostslisted.length + ' hosts') : 'no data') + ')</i></small>'),
 228                 rescale((rx/1024).toFixed(2)).toString(),
 229                 rescale((tx/1024).toFixed(2)).toString(),
 230                 tcpi.toFixed(0).toString() + '/' + tcpo.toFixed(0).toString(),
 231                 udpi.toFixed(0).toString() + '/' + udpo.toFixed(0).toString(),
 232                 icmpi.toFixed(0).toString() + '/' + icmpo.toFixed(0).toString(),
 233                 tcpconn.toString(), udpconn.toString() ]);
 234 }
 235
 236 function popupWindow(v) {
 237         window.open(v, '', 'width=1000,height=600,toolbar=no,menubar=no,scrollbars=yes,resizable=yes');
 238 }
 239
 240 function viewQosDetail(n) {
 241         cookie.set('qos_filterip', [avgiptraffic[n][0]], 1);
 242         popupWindow('qos-detailed.asp');
 243 }
 244
 245 function viewQosCTrates(n) {
 246         cookie.set('qos_filterip', [avgiptraffic[n][0]], 1);
 247         popupWindow('qos-ctrate.asp');
 248 }
 249
 250 function viewIptHistory(n) {
 251         cookie.set('ipt_filterip', [avgiptraffic[n][0]], 1);
 252         popupWindow('ipt-daily.asp');
 253 }
 254
 255 function addExcludeList(n) {
 256         if (E('_f_filter_ipe').value.length<6) {
 257                 E('_f_filter_ipe').value = avgiptraffic[n][0];
 258         } else {
 259                 if (E('_f_filter_ipe').value.indexOf(avgiptraffic[n][0]) < 0) {
 260                         E('_f_filter_ipe').value = E('_f_filter_ipe').value + ',' + avgiptraffic[n][0];
 261                 }
 262         }
 263         dofilter();
 264 }
 265
 266 grid.dataToView = function(data) {
 267         return [data[0].toString(),
 268                         data[1].toString(),
 269                         data[2].toString(),
 270                         data[3] + '/' + data[4],
 271                         data[5] + '/' + data[6],
 272                         data[7] + '/' + data[8],
 273                         data[9].toString(),
 274                         data[10].toString() ];
 275 }
 276
 277 grid.setup = function() {
 278         this.init('grid', 'sort');
 279         this.headerSet(['Host', 'Download (bytes/s)', 'Upload (bytes/s)', 'TCP IN/OUT (pkt/s)', 'UDP IN/OUT (pkt/s)', 'ICMP IN/OUT (pkt/s)', 'TCP Connections', 'UDP Connections']);
 280 }
 281
 282 function init() {
 283         if ((c = cookie.get('ipt_filterip')) != null) {
 284                 cookie.set('ipt_filterip', '', 0);
 285                 if (c.length>6) {
 286                         E('_f_filter_ip').value = c;
 287                         filterip = c.split(',');
 288                 }
 289         }
 290
 291         if (((c = cookie.get('ipt_details_options_vis')) != null) && (c == '1')) {
 292                 toggleVisibility("options");
 293         }
 294         scale = fixInt(cookie.get('ipt_details_scale'), 0, 2, 0);
 295
 296         E('_f_scale').value = scale;
 297
 298         E('_f_onlyactive').checked = (((c = cookie.get('ipt_details_onlyactive')) != null) && (c == '1'));
 299
 300         E('_f_hostnames').checked = (((c = cookie.get('ipt_details_hostnames')) != null) && (c == '1'));
 301
 302         E('_f_shortcuts').checked = (((c = cookie.get('ipt_details_shortcuts')) != null) && (c == '1'));
 303
 304         populateCache();
 305         grid.setup();
 306         ref.postData = 'exec=iptraffic';
 307         ref.initPage(250);
 308         if (!ref.running) ref.once = 1;
 309         ref.start();
 310 }
 311
 312 function getArrayPosByElement(haystack, needle, index) {
 313         for (var i = 0; i < haystack.length; ++i) {
 314                 if (haystack[i][index] == needle) {
 315                         return i;
 316                 }
 317         }
 318         return -1;
 319 }
 320
 321 function dofilter() {
 322         if (E('_f_filter_ip').value.length>6) {
 323                 filterip = E('_f_filter_ip').value.split(',');
 324         } else {
 325                 filterip = [];
 326         }
 327
 328         if (E('_f_filter_ipe').value.length>6) {
 329                 filteripe = E('_f_filter_ipe').value.split(',');
 330         } else {
 331                 filteripe = [];
 332         }
 333
 334         grid.populate();
 335 }
 336
 337 function verifyFields(focused, quiet) {
 338         scale = E('_f_scale').value * 1;
 339         cookie.set('ipt_details_scale', E('_f_scale').value, 2);
 340
 341         cookie.set('ipt_details_onlyactive', (E('_f_onlyactive').checked ? '1' : '0'), 1);
 342
 343         cookie.set('ipt_details_hostnames', (E('_f_hostnames').checked ? '1' : '0'), 1);
 344
 345         cookie.set('ipt_details_shortcuts', (E('_f_shortcuts').checked ? '1' : '0'), 1);
 346
 347         dofilter();
 348         return 1;
 349 }
 350
 351 function toggleVisibility(whichone) {
 352         if(E('sesdiv' + whichone).style.display=='') {
 353                 E('sesdiv' + whichone).style.display='none';
 354                 E('sesdiv' + whichone + 'showhide').innerHTML='(Click here to show)';
 355                 cookie.set('ipt_details_' + whichone + '_vis', 0);
 356         } else {
 357                 E('sesdiv' + whichone).style.display='';
 358                 E('sesdiv' + whichone + 'showhide').innerHTML='(Click here to hide)';
 359                 cookie.set('ipt_details_' + whichone + '_vis', 1);
 360         }
 361 }
 362
 363 </script>
 364
 365 </head>
 366 <body onload='init()'>
 367 <form id='_fom' action='javascript:{}'>
 368 <table id='container' cellspacing=0>
 369 <tr><td colspan=2 id='header'>
 370         <div class='title'>Tomato</div>
 371         <div class='version'>Version <% version(); %></div>
 372 </td></tr>
 373 <tr id='body'><td id='navi'><script type='text/javascript'>navi()</script></td>
 374 <td id='content'>
 375 <div id='ident'><% ident(); %></div>
 376
 377 <!-- / / / -->
 378
 379 <div class='section-title'>IP Traffic Details</div>
 380 <div class='section'>
 381 <table id='grid' class='tomato-grid' style="float:left" cellspacing=1></table>
 382
 383 <div id='loading'><br><b>Loading...</b></div>
 384 </div>
 385
 386 <!-- / / / -->
 387
 388 <div class='section-title'>Options <small><i><a href='javascript:toggleVisibility("options");'><span id='sesdivoptionsshowhide'>(Click here to show)</span></a></i></small></div>
 389 <div class='section' id='sesdivoptions' style='display:none'>
 390 <script type='text/javascript'>
 391 var c;
 392 c = [];
 393 c.push({ title: 'Only these IPs', name: 'f_filter_ip', size: 50, maxlen: 255, type: 'text', suffix: ' <small>(Comma separated list)</small>' });
 394 c.push({ title: 'Exclude these IPs', name: 'f_filter_ipe', size: 50, maxlen: 255, type: 'text', suffix: ' <small>(Comma separated list)</small>' });
 395 c.push({ title: 'Scale', name: 'f_scale', type: 'select', options: [['0', 'KB'], ['1', 'MB'], ['2', 'GB']] });
 396 c.push({ title: 'Ignore inactive hosts', name: 'f_onlyactive', type: 'checkbox' });
 397 c.push({ title: 'Show hostnames', name: 'f_hostnames', type: 'checkbox' });
 398 c.push({ title: 'Show shortcuts', name: 'f_shortcuts', type: 'checkbox' });
 399 createFieldTable('',c);
 400 </script>
 401 <div style="float:right;text-align:right">
 402 &raquo; <a href="admin-iptraffic.asp">Configure</a>
 403 </div>
 404 </div>
 405
 406 <script type='text/javascript'>checkCstats();</script>
 407
 408 <!-- / / / -->
 409
 410 </td></tr>
 411 <tr><td id='footer' colspan=2>
 412         <script type='text/javascript'>genStdRefresh(1,1,'ref.toggle()');</script>
 413 </td></tr>
 414 </table>
 415 </form>
 416 </body>
 417 </html>