QoS cosmetics (details/ctrates filters)
[tomato.git] / release / src / router / www / ipt-history.asp
blob79e01d09c0613c4064468ae76920bd396b475776
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/
7 IP Traffic enhancements
8 Copyright (C) 2011 Augusto Bott
9 http://code.google.com/p/tomato-sdhc-vlan/
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: History</title>
19 <link rel='stylesheet' type='text/css' href='tomato.css'>
20 <% css(); %>
21 <script type='text/javascript' src='tomato.js'></script>
23 <!-- / / / -->
25 <style type='text/css'>
26 #daily-grid .co3,
27 #daily-grid .co4,
28 #daily-grid .co5 {
29 text-align: right;
31 </style>
33 <!-- / / / -->
35 <script type='text/javascript' src='debug.js'></script>
36 <script type='text/javascript' src='bwm-hist.js'></script>
37 <script type='text/javascript' src='bwm-common.js'></script>
38 <script type='text/javascript' src='interfaces.js'></script>
40 <script type='text/javascript'>
41 // <% 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"); %>
43 // <% devlist(); %>
45 try {
46 // <% ipt_bandwidth("daily"); %>
48 catch (ex) {
49 daily_history = [];
51 cstats_busy = 0;
52 if (typeof(daily_history) == 'undefined') {
53 daily_history = [];
54 cstats_busy = 1;
58 var filterip = [];
59 var filteripe = [];
60 var dateFormat = -1;
61 var scale = -1;
64 function genData()
66 var w, i, h, t, q;
68 w = window.open('', 'tomato_ipt_data_d');
69 w.document.writeln('<pre>');
70 for (i = 0; i < daily_history.length; ++i) {
71 q = (dateFormat==2) ? '"' : '';
72 h = daily_history[i];
73 t = getYMD(h[0]);
74 w.document.writeln([t[0], t[1] + 1, t[2], h[1], h[2], h[3]].join(','));
76 w.document.writeln('</pre>');
77 w.document.close();
80 function getYMD(n)
82 // [y,m,d]
83 return [(((n >> 16) & 0xFF) + 1900), ((n >>> 8) & 0xFF), (n & 0xFF)];
86 var dg = new TomatoGrid();
88 dg.setup = function() {
89 this.init('daily-grid', 'sort');
90 this.headerSet(['Date', 'Host', 'Download', 'Upload', 'Total']);
93 function redraw() {
94 var i, b, d;
95 var fskip;
96 var tx = 0;
97 var rx = 0;
98 var hostslisted = [];
99 var subnetslisted = [];
101 if (daily_history.length > 0) {
102 dg.removeAllData();
103 for (i = 0; i < daily_history.length; ++i) {
104 fskip=0;
105 b = daily_history[i];
107 if ((b[2] < 1) || (b[3] < 1))
108 continue;
110 if (E('_f_begin_date').value.toString() != '0') {
111 if (b[0] < E('_f_begin_date').value)
112 continue;
115 if (E('_f_end_date').value.toString() != '0') {
116 if (b[0] > E('_f_end_date').value)
117 continue;
120 if (filteripe.length>0) {
121 fskip = 0;
122 for (var x = 0; x < filteripe.length; ++x) {
123 if (b[1] == filteripe[x]){
124 fskip=1;
125 break;
128 if (fskip == 1) continue;
131 if (filterip.length>0) {
132 fskip = 1;
133 for (var x = 0; x < filterip.length; ++x) {
134 if (b[1] == filterip[x]){
135 fskip=0;
136 break;
139 if (fskip == 1) continue;
142 if ((b[1] == getNetworkAddress(nvram.lan_ipaddr,nvram.lan_netmask)) ||
143 (b[1] == getNetworkAddress(nvram.lan1_ipaddr,nvram.lan1_netmask)) ||
144 (b[1] == getNetworkAddress(nvram.lan2_ipaddr,nvram.lan2_netmask)) ||
145 (b[1] == getNetworkAddress(nvram.lan3_ipaddr,nvram.lan3_netmask))) {
146 if(E('_f_subnet').checked == 0) {
147 continue;
148 } else {
149 subnetslisted.push(b[1]);
151 } else {
152 hostslisted.push(b[1]);
153 rx += b[2];
154 tx += b[3];
157 if (hostslisted.length > 0) {
158 hostslisted.sort();
159 for (var j = 1; j < hostslisted.length; j++ ) {
160 if (hostslisted[j] === hostslisted[j - 1]) {
161 hostslisted.splice(j--, 1);
166 if (subnetslisted.length > 0) {
167 subnetslisted.sort();
168 for (var j = 1; j < subnetslisted.length; j++ ) {
169 if (subnetslisted[j] === subnetslisted[j - 1]) {
170 subnetslisted.splice(j--, 1);
175 var h = b[1];
176 if (E('_f_hostnames').checked) {
177 if(hostnamecache[b[1]] != null) {
178 h = hostnamecache[b[1]] + ((b[1].indexOf(':') != -1) ? '<br>' : ' ') + '<small>(' + b[1] + ')</small>';
181 h = h + '<br><small>';
182 h = h + '<a href="javascript:viewQosDetail(' + i + ')" title="View QoS Details">[QoS Details]</a>';
183 h = h + '<a href="javascript:viewQosCTrates(' + i + ')" title="View Transfer Rates per Connection">[QoS CTrates]</a>';
184 h = h + '<a href="javascript:viewIptDetail(' + i + ')" title="View IP Traffic Details">[IPTraffic]</a>';
185 h = h + '</small>';
186 var ymd = getYMD(b[0]);
187 d = [ymdText(ymd[0], ymd[1], ymd[2]), h, rescale(b[2]), rescale(b[3]), rescale(b[2]+b[3])];
188 dg.insertData(-1, d);
191 dg.resort();
192 dg.recolor();
193 dg.footerSet([
194 'Total',
195 ('<small><i>(' +
196 (((hostslisted.length > 0) || (subnetslisted.length > 0)) ?
197 ((hostslisted.length > 0) ? (hostslisted.length + ' hosts') : '') +
198 (((hostslisted.length > 0) && (subnetslisted.length > 0)) ? ', ' : '') +
199 ((subnetslisted.length > 0) ? (subnetslisted.length + ' subnets') : '')
200 : 'no data') +
201 ')</i></small>'),
202 rescale(rx),
203 rescale(tx),
204 rescale(rx+tx)]);
208 function popupWindow(v) {
209 window.open(v, '', 'width=1000,height=600,toolbar=no,menubar=no,scrollbars=yes,resizable=yes');
212 function viewQosDetail(n) {
213 cookie.set('qos_filterip', [daily_history[n][1]], 1);
214 popupWindow('qos-detailed.asp');
217 function viewQosCTrates(n) {
218 cookie.set('qos_filterip', [daily_history[n][1]], 1);
219 popupWindow('qos-ctrate.asp');
222 function viewIptDetail(n) {
223 cookie.set('ipt_filterip', [daily_history[n][1]], 1);
224 popupWindow('ipt-details.asp');
227 dg.dataToView = function(data) {
228 return(data);
231 function init_filter_dates() {
232 var dates = [];
233 if (daily_history.length > 0) {
234 for (var i = 0; i < daily_history.length; ++i) {
235 dates.push('0x' + daily_history[i][0].toString(16));
237 if (dates.length > 0) {
238 dates.sort();
239 for (var j = 1; j < dates.length; j++ ) {
240 if (dates[j] === dates[j - 1]) {
241 dates.splice(j--, 1);
246 var b = E('_f_begin_date');
247 var e = E('_f_end_date');
248 var d = new Date();
249 for (var i = 0; i < dates.length; ++i) {
250 var ymd = getYMD(dates[i]);
251 b.options[i+1] = new Option(ymdText(ymd[0], ymd[1], ymd[2]), dates[i], false, ((ymd[0]==d.getFullYear()) && (ymd[1]==d.getMonth()) && (ymd[2]==d.getDate()) ));
252 e.options[i+1] = new Option(ymdText(ymd[0], ymd[1], ymd[2]), dates[i], false, ((ymd[0]==d.getFullYear()) && (ymd[1]==d.getMonth()) && (ymd[2]==d.getDate()) ));
256 function update_filter_dates(b) {
257 for (var i = 0; i < b.options.length; ++i) {
258 if(b.options[i].value.toString() != '0') {
259 var ymd = getYMD(b.options[i].value);
260 b.options[i].text = ymdText(ymd[0], ymd[1], ymd[2]);
265 function init() {
267 if (nvram.cstats_enable != '1') return;
269 var c;
271 init_filter_dates();
273 populateCache();
275 if ((c = cookie.get('ipt_filterip')) != null) {
276 cookie.set('ipt_filterip', '', 0);
277 if (c.length>6) {
278 E('_f_filter_ip').value = c;
279 filterip = c.split(',');
283 dateFormat = fixInt(cookie.get('ipt_history_dafm'), 0, 3, 0);
284 E('_f_dafm').value = dateFormat;
286 scale = fixInt(cookie.get('ipt_history_scale'), 0, 2, 0);
287 E('_f_scale').value = scale;
289 E('_f_subnet').checked = (((c = cookie.get('ipt_history_subnet')) != null) && (c == '1'));
291 E('_f_hostnames').checked = (((c = cookie.get('ipt_history_hostnames')) != null) && (c == '1'));
293 if (((c = cookie.get('ipt_history_options_vis')) != null) && (c == '1')) {
294 toggleVisibility("options");
297 dg.setup();
299 redraw();
302 function toggleVisibility(whichone) {
303 if(E('sesdiv' + whichone).style.display=='') {
304 E('sesdiv' + whichone).style.display='none';
305 E('sesdiv' + whichone + 'showhide').innerHTML='(Click here to show)';
306 cookie.set('ipt_history_' + whichone + '_vis', 0);
307 } else {
308 E('sesdiv' + whichone).style.display='';
309 E('sesdiv' + whichone + 'showhide').innerHTML='(Click here to hide)';
310 cookie.set('ipt_history_' + whichone + '_vis', 1);
314 function dofilter() {
315 if (E('_f_filter_ip').value.length>6) {
316 filterip = E('_f_filter_ip').value.split(',');
317 } else {
318 filterip = [];
321 if (E('_f_filter_ipe').value.length>6) {
322 filteripe = E('_f_filter_ipe').value.split(',');
323 } else {
324 filteripe = [];
327 redraw();
330 function verifyFields(focused, quiet) {
331 dateFormat = E('_f_dafm').value * 1;
332 cookie.set('ipt_history_dafm', E('_f_dafm').value, 31);
334 scale = E('_f_scale').value * 1;
335 cookie.set('ipt_history_scale', E('_f_scale').value, 2);
337 cookie.set('ipt_history_subnet', (E('_f_subnet').checked ? '1' : '0'), 1);
339 cookie.set('ipt_history_hostnames', (E('_f_hostnames').checked ? '1' : '0'), 1);
341 update_filter_dates(E('_f_begin_date'));
342 update_filter_dates(E('_f_end_date'));
344 dofilter();
345 return 1;
347 </script>
348 </head>
349 <body onload='init()'>
350 <form>
351 <table id='container' cellspacing=0>
352 <tr><td colspan=2 id='header'>
353 <div class='title'>Tomato</div>
354 <div class='version'>Version <% version(); %></div>
355 </td></tr>
356 <tr id='body'><td id='navi'><script type='text/javascript'>navi()</script></td>
357 <td id='content'>
358 <div id='ident'><% ident(); %></div>
360 <!-- / / / -->
362 <div class='section-title'>IP Traffic History</div>
363 <div class='section'>
364 <table id='daily-grid' class='tomato-grid' cellspacing=0 style='height:auto'></table>
365 </div>
367 <div class='section-title'>Options <small><i><a href='javascript:toggleVisibility("options");'><span id='sesdivoptionsshowhide'>(Click here to show)</span></a></i></small></div>
368 <div class='section' id='sesdivoptions' style='display:none'>
369 <script type='text/javascript'>
370 var c;
371 c = [];
372 c.push({ title: 'List only these IPs', name: 'f_filter_ip', size: 50, maxlen: 255, type: 'text', suffix: ' <small>(Comma separated list)</small>' });
373 c.push({ title: 'Exclude these IPs', name: 'f_filter_ipe', size: 50, maxlen: 255, type: 'text', suffix: ' <small>(Comma separated list)</small>' });
374 c.push({ title: 'Show stats by subnet', name: 'f_subnet', type: 'checkbox', suffix: ' <small>(Not considered when calculating total traffic on last the line)</small>' });
375 c.push({ title: 'Show hostnames', name: 'f_hostnames', type: 'checkbox' });
376 c.push({ title: 'Start Date', name: 'f_begin_date', type: 'select', options: [['0', 'Any']] });
377 c.push({ title: 'End Date', name: 'f_end_date', type: 'select', options: [['0', 'Any']] });
378 c.push({ title: 'Date Format', name: 'f_dafm', type: 'select', options: [['0', 'yyyy-mm-dd'], ['1', 'mm-dd-yyyy'], ['2', 'mmm dd, yyyy'], ['3', 'dd.mm.yyyy']] });
379 c.push({ title: 'Scale', name: 'f_scale', type: 'select', options: [['0', 'KB'], ['1', 'MB'], ['2', 'GB']] });
380 createFieldTable('',c);
381 </script>
382 <div style="float:right;text-align:right">
383 &raquo; <a href="javascript:genData()">Data</a>
384 <br>
385 &raquo; <a href="admin-iptraffic.asp">Configure</a>
386 </div>
387 </div>
389 <script type='text/javascript'>checkCstats();</script>
391 <!-- / / / -->
393 </td></tr>
394 <tr><td id='footer' colspan=2>
395 <input type='button' value='Refresh' onclick='reloadPage()'>
396 </td></tr>
397 </table>
398 </form>
399 </body>
400 </html>