81 lines
2.5 KiB
HTML
81 lines
2.5 KiB
HTML
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||
|
"http://www.w3.org/TR/html4/loose.dtd">
|
||
|
|
||
|
<html>
|
||
|
<head>
|
||
|
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
|
||
|
<title>Server Timeout</title>
|
||
|
<style type="text/css">
|
||
|
body{ text-align: center; padding-top: 50px; padding-left: 80px; font-family: sans-serif; font-weight: 100; font: 20px Helvetica, sans-serif; color: black; }
|
||
|
h1{ font-size: 50px; font-weight: 100; font-size: 40px; margin: 40px 0px 20px; }
|
||
|
#article{ display: block; text-align: left; margin: auto; }
|
||
|
a{ color: #dc8100; text-decoration: none; }
|
||
|
a:hover{ color: #333; text-decoration: none; }
|
||
|
#clockdiv{ font-family: sans-serif; color: #fff; display: inline-block; font-weight: 100; text-align: center; font-size: 30px; }
|
||
|
#clockdiv > div{ padding: 10px; border-radius: 3px; background: #00BF96; display: inline-block; }
|
||
|
#clockdiv div > span{ padding: 15px; border-radius: 3px; background: #00816A; display: inline-block; }
|
||
|
.smalltext{ padding-top: 5px; font-size: 16px; }
|
||
|
</style>
|
||
|
</head>
|
||
|
|
||
|
<body>
|
||
|
<div id="article">
|
||
|
<h1>The remote server is not responding?</h1>
|
||
|
<img src="/timeout.jpg" />
|
||
|
<div>
|
||
|
<p>Sorry for the inconvenience but the remote server is not responding.</p>
|
||
|
<p>We'll try again in 2 minutes, but if it still isnt responding, please let us know.</p>
|
||
|
<div id="clockdiv">
|
||
|
<div>
|
||
|
<span class="minutes"></span>
|
||
|
<div class="smalltext">Minutes</div>
|
||
|
</div>
|
||
|
<div>
|
||
|
<span class="seconds"></span>
|
||
|
<div class="smalltext">Seconds</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
|
||
|
<script type="text/javascript">
|
||
|
//<![CDATA[
|
||
|
function getTimeRemaining(endtime) {
|
||
|
var t = Date.parse(endtime) - Date.parse(new Date());
|
||
|
var seconds = Math.floor((t / 1000) % 60);
|
||
|
var minutes = Math.floor((t / 1000 / 60) % 60);
|
||
|
return {
|
||
|
'total': t,
|
||
|
'minutes': minutes,
|
||
|
'seconds': seconds
|
||
|
};
|
||
|
}
|
||
|
|
||
|
function initializeClock(id, endtime) {
|
||
|
var clock = document.getElementById(id);
|
||
|
var minutesSpan = clock.querySelector('.minutes');
|
||
|
var secondsSpan = clock.querySelector('.seconds');
|
||
|
|
||
|
function updateClock() {
|
||
|
var t = getTimeRemaining(endtime);
|
||
|
|
||
|
minutesSpan.innerHTML = ('0' + t.minutes).slice(-2);
|
||
|
secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);
|
||
|
|
||
|
if (t.total <= 0) {
|
||
|
clearInterval(timeinterval);
|
||
|
window.location = window.location.href;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
updateClock();
|
||
|
var timeinterval = setInterval(updateClock, 1000);
|
||
|
}
|
||
|
|
||
|
var deadline = new Date(Date.parse(new Date()) + 2 * 60 * 1000);
|
||
|
initializeClock('clockdiv', deadline);
|
||
|
//]]>
|
||
|
</script>
|
||
|
</body>
|
||
|
</html>
|