<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<span id='requestButton'>
Make a request
</span>
<a id="link" target="_blank" href="empty.html">Link to empty.html</a>
<p>Successes:
<div id="successes">
</div>
<p>Failures:
<div id="failures">
</div>
<script type="text/javascript">
var eventListener = function(evt) {
if( evt == 'success'){
document.getElementById("successes").innerHTML = ++successes;
} else if( evt == 'failure') {
document.getElementById("failures").innerHTML = ++failures;
}
};
var s = document.getElementById('successes');
var f = document.getElementById('failures');
s.addEventListener('click', function() { eventListener('success') });
f.addEventListener('click', function() { eventListener('failure') });
var httpRequest;
document.getElementById('requestButton').addEventListener('click', repeatLoadPage);
function makeRequest() {
httpRequest = new XMLHttpRequest();
url = window.location.protocol + "//" + window.location.host + "/helloworld";
httpRequest.onreadystatechange = alertContents;
httpRequest.open("GET", url);
httpRequest.send();
}
var successes = 0;
var failures = 0;
function alertContents() {
if (httpRequest.readyState == 4) {
if (httpRequest.status == 200) {
document.getElementById("successes").click();
successes++;
} else {
document.getElementById("failures").click();
failures++;
}
}
}
function repeatLoadPage() {
setInterval(makeRequest, 300);
}
</script>
</body>
</html>