-
Notifications
You must be signed in to change notification settings - Fork 256
Expand file tree
/
Copy pathindex.html
More file actions
125 lines (109 loc) · 4.97 KB
/
Copy pathindex.html
File metadata and controls
125 lines (109 loc) · 4.97 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
<!DOCTYPE HTML>
<html>
<head>
<title>Packet Capture Test</title>
<script language="javascript" type="text/javascript" src="jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="jquery.flot.js"></script>
<style type="text/css">
.load_status {
border: 1px solid black;
}
table.result_table td {
padding: 2px;
}
</style>
<script type="text/javascript">
function format_rate(bytes, ms) {
return ((bytes * 8 * 1024) / (ms * 1000)).toFixed(2);
}
function parse_stats(str) {
var obj = JSON.parse(str),
ret = "";
console.log(obj);
ret += "Total time: " + obj.total_time + "ms<br />";
ret += '<table class="result_table">';
ret += "<tr><td>Direction</td><td>TCP/IP</td><td>Payload</td><td>Total</td></tr>";
ret += "<tr><td>Send</td><td>" + obj.send_overhead + "B</td><td>" + obj.send_payload + "B</td><td>" + obj.send_total + "B</td>" +
"<td>HTTP " + obj.http_request.method + " " + obj.http_request.url +"</td></tr>";
ret += "<tr><td></td><td>" + format_rate(obj.send_overhead, obj.total_time) +
"kbits/sec</td><td>" + format_rate(obj.send_payload, obj.total_time) +
"kbits/sec</td><td>" + format_rate(obj.send_total, obj.total_time) + "kbits/sec</td></tr>";
ret += "<tr><td>Receive</td><td>" + obj.recv_overhead + "B</td><td>" + obj.recv_payload + "B</td><td>" + obj.recv_total + "B</td></tr>";
ret += "<tr><td></td><td>" + format_rate(obj.recv_overhead, obj.total_time) +
"kbits/sec</td><td>" + format_rate(obj.recv_payload, obj.total_time) +
"kbits/sec</td><td>" + format_rate(obj.recv_total, obj.total_time) + "kbits/sec</td></tr>";
ret += "</table>";
var send_times = Object.keys(obj.recv_times), last, cur, ack_data = [], retrans_data = [];
send_times.sort();
for (cur = 1; cur < send_times.length ; cur += 1) {
ack_data.push([(send_times[cur] - send_times[0]), parseInt(obj.recv_times[send_times[cur]])]);
last = send_times[cur];
}
Object.keys(obj.recv_retrans).forEach(function (v) {
retrans_data.push([v - send_times[0], parseInt(obj.recv_retrans[v])]);
});
console.log(retrans_data);
$.plot($("#graph"), [{
data: ack_data,
label: "Send to ACK time (ms)"
}, {
data: retrans_data,
label: "Retransmissions",
yaxis: 2,
bars: { show: true, fill: true }
}], {
xaxis: { min: 0 },
y2axis: { min: 0 },
legend: { position: 'ne' }
});
return ret;
}
function init() {
document.getElementById('go_button').addEventListener('click', function (event) {
launch_test();
}, false);
$.plot($("#graph"), []);
}
function launch_test() {
var updates_area = document.getElementById('updates_area'),
update = document.createElement('DIV'),
data_xhr = new XMLHttpRequest(),
test_id = Math.round(Math.random() * 100000000000) + "" + Date.now();
console.log("Fetching data with id " + test_id);
update.className = "load_status";
update.id = "load_status_" + test_id;
update.innerText = "Loading...";
updates_area.appendChild(update);
data_xhr.addEventListener('load', function (event) {
if (data_xhr.status === 200) {
console.log("Data loaded.");
var stats_xhr = new XMLHttpRequest();
stats_xhr.addEventListener('load', function (event) {
if (stats_xhr.status === 200) {
update.innerHTML = parse_stats(stats_xhr.responseText);
}
else {
console.log("Couldn't load test image: " + xhr.status);
}
}, false);
stats_xhr.open('GET', '/get_stats?id=' + test_id, true);
stats_xhr.send();
} else {
console.log("Failed to load data: " + data_xhr.status);
}
}, false);
data_xhr.open('GET', '/send_file?id=' + test_id, true);
data_xhr.send();
}
window.addEventListener("load", init, false);
</script>
</head>
<body>
<h1>Load Test</h1>
<button id="go_button">Run Test</button>
<div id="updates_area">
</div>
<div id="graph" style="width:1000px;height:500px;"></div>
<div id="results"></div>
</body>
</html>