yandex-tank/Tank/Plugins/online.html
2014-01-16 15:10:05 +04:00

254 lines
6.8 KiB
HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Yandex.Tank Online Test</title>
<link rel="stylesheet" href="http://loadosophia.org/img/design/styles.css" />
<link rel="stylesheet" href="http://loadosophia.org/img/_hlas.css" />
<script src="http://code.jquery.com/jquery-1.8.3.min.js" type='text/javascript'></script>
<script src='http://loadosophia.org/img/_hlas.js' type='text/javascript'></script>
<script type="text/javascript">
$(document).ready(rresize);
$(window).resize(function() {
clearTimeout(window.timeoutId);
window.timeoutId = setTimeout(rresize, 100);
});
function rresize() {
$(".amchartGraph").hide();
$(".amchartGraph").css("width", "100%");
$(".amchartGraph").find("div").css("width", "100%");
$("svg").css("width", "100%");
$(".amchartGraph").show();
}
function req(url) {
var request;
if (window.XMLHttpRequest) {
// IE7+, Firefox, Chrome, Opera, Safari
request = new XMLHttpRequest();
} else {
// code for IE6, IE5
request = new ActiveXObject('Microsoft.XMLHTTP');
}
// load
request.open('GET', url, false);
request.send();
var data = eval('(' + request.responseText + ')');
return data
}
var redir_to;
function get_redirect() {
try {
redir_to = req('/redirect.json');
return false;
} catch (e) {
if (redir_to[0]) {
window.location = redir_to[0];
} else {
window.document.title = "Test Complete";
}
return true;
}
}
function refresh_numbers() {
data = req('/numbers.json');
$('#instances').text(data['instances']);
$('#planned').text(data['planned']);
$('#actual').text(data['actual']);
$('#avg').text(data['avg']);
$('#net').text(data['net']);
if (data['net']) {
$('#netCell').css('background-color', "#FF9999");
} else {
$('#netCell').css('background-color', "white");
}
if (data['planned'] && data['planned'] != data['actual']) {
$('#actCell').css('background-color', "#FFFF99");
} else {
$('#actCell').css('background-color', "white");
}
}
</script>
<style type="text/css">
body {
padding: 0px;
margin: 0px;
overflow-x: hidden;
}
div.amchartGraph {
margin: 0px;
}
table.bigNumbers {
width: 100%;
}
table.bigNumbers th {
background-color: white;
text-align: center;
font-size: 0.8em;
color: gray;
vertical-align: bottom;
font-weight: normal;
width: 20%;
}
table.bigNumbers th div {
color: black;
font-weight: bold;
font-size: 3em;
}
</style>
</head>
<body>
<table class="bigNumbers">
<tr>
<th>
<div style="color: gray;" id="instances">
N/A
</div>threads/instances</th>
<th>
<div style="color: #990099;" id="planned">
N/A
</div>planned requests</th>
<th id="actCell">
<div style="color: #3333FF;" id="actual">
N/A
</div>actual responses</th>
<th>
<div style="color: #009900;" id="avg">
N/A
</div>avg response time</th>
<th id="netCell">
<div style="color: black;" id="net">
N/A
</div>NET errors</th>
</tr>
<tr>
<td colspan="5"><div id="chartdivQ" class="amchartGraph" style="width:100%; height:400px;"></div></td>
</tr>
<tr>
<td colspan="5">
<table width="100%" cellpadding="0">
<tr>
<td style="width:50%"><div id="chartdivHTTP" class="amchartGraph" style="width:100%; height:250px;"></div></td>
<td style="width:50%"><div id="chartdivAvg" class="amchartGraph" style="width:100%; height:250px;"></div></td>
</tr>
</table></td>
</tr>
</table>
<script type="text/javascript">
var HelperQ = new AmChartsPWEHelper("Q");
HelperQ.setImagesPath("http://loadosophia.org/img/amcharts/javascript/images/");
HelperQ.setUnit1(" ms");
HelperQ.setUnit2(" RPS");
HelperQ.setZoomed(false);
HelperQ.setRowTitles("RPS;100%;99%;98%;95%;90%;80%;75%;50%;25%");
HelperQ.setRowFills("0;1");
HelperQ.setRowAxes("2;1");
HelperQ.setRowColors("#990099;@FF");
HelperQ.setDisableByDefault("100%;99%");
HelperQ.setFirstRowToLast(true);
HelperQ.setDataURL("./Q.json");
var chartQ = HelperQ.createChart();
chartQ.addLabel("0", "1em", "Response Time Quantiles", "center", "black", "", 0, "true");
</script>
<script type="text/javascript">
var HelperHTTP = new AmChartsPWEHelper("HTTP");
HelperHTTP.setImagesPath("http://loadosophia.org/img/amcharts/javascript/images/");
HelperHTTP.setUnit1("");
HelperHTTP.setUnit2("");
HelperHTTP.setZoomed(false);
HelperHTTP.setRowTitles("NET Errors;2xx;3xx;4xx;5xx;Non-HTTP");
HelperHTTP.setRowFills("0;1");
HelperHTTP.setRowAxes("2;1");
HelperHTTP.setStacked("regular");
HelperHTTP.setRowColors("black;green;blue;orange;red;darkred");
HelperHTTP.setDisableByDefault("2xx");
HelperHTTP.setFirstRowToLast(true);
HelperHTTP.setDataURL("./HTTP.json");
var chartHTTP = HelperHTTP.createChart();
chartHTTP.addLabel("0", "1em", "Response Codes", "center", "black", "", 0, "true");
</script>
<script type="text/javascript">
var HelperAvg = new AmChartsPWEHelper("Avg");
HelperAvg.setImagesPath("http://loadosophia.org/img/amcharts/javascript/images/");
HelperAvg.setUnit1(" ms");
HelperAvg.setUnit2("");
HelperAvg.setZoomed(false);
HelperAvg.setRowTitles("connect;send;latency;receive");
HelperAvg.setRowFills("1");
HelperAvg.setRowAxes("1");
HelperAvg.setStacked("regular")
HelperAvg.setRowColors("#6666FF;#66FF66;#FF6666;#FFFF66");
HelperAvg.setDisableByDefault("2xx;");
HelperAvg.setFirstRowToLast(true);
HelperAvg.setDataURL("./Avg.json");
var chartAvg = HelperAvg.createChart();
chartAvg.addLabel("0", "1em", "Average Response Times", "center", "black", "", 0, "true");
function refresh_all(i) {
try {
HelperQ.validateData();
} catch (e) {
// drop
}
try {
HelperHTTP.validateData();
} catch (e) {
// drop
}
try {
HelperAvg.validateData();
} catch (e) {
// drop
}
try {
refresh_numbers();
} catch (e) {
// drop
}
if (!get_redirect()) {
window.setTimeout("refresh_all(1000);", i);
}
}
refresh_all(100);
</script><!-- footer -->
<div style="float: none; clear: both; text-align: center; padding-top: 1em;">
<small><a href="https://github.com/yandex-load/yandex-tank">Yandex.Tank</a> Tool</small>
<big><b title='Mathematical sign, means "For All"'>&forall;</b></big><small> Powered by <a href="http://yandex.ru/"><span style="color:red">Y</span>andex</a>, <a href='http://loadosophia.org/?utm_source=ytank&utm_medium=web&utm_campaign=footer'>Loadosophia.org</a></small>
</div>
</body>
</html>