<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script src="captiveportal-prototype.js" type="text/javascript"></script>
<script src="captiveportal-scriptaculous.js" type="text/javascript"></script>
<script>
function guest(){
if($('staffLogin').visible()){
new Effect.BlindUp('staffLogin', {queue: {position:'end', scope: 'guestscope', limit:2} });
new Effect.BlindDown('voucherSection', {queue: {position:'end', scope: 'guestscope', limit:2} });
}
}
function staff(){
if($('voucherSection').visible()){
new Effect.BlindUp('voucherSection', {queue: {position:'end', scope: 'staffscope', limit:2} });
new Effect.BlindDown('staffLogin', {queue: {position:'end', scope: 'staffscope', limit:2} });
}
}
updateHelptext = function(){
new Ajax.Updater('helpText', 'captiveportal-helptext.html', {method:'get'});
}
</script>
<style>
.trans{
width:300px;
text-align:center;
background-color:rgb(41,86,178);
border-style:dashed;
border-top:none;
border-left:dashed thin white;
border-right:dashed thin white;
border-bottom:dashed thin white;
color:white;
font-weight:bold;
margin:auto;
}
img.clickimage {
cursor: pointer;
}
</style>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
<title>Guest Internet Services</title>
</head>
<body onload="updateHelptext();" style="background-image: url(captiveportal-bg_main.jpg); color: rgb(0, 0, 0);" alink="#ee0000" link="#0000ee" vlink="#551a8b">
<div style="text-align: center; height: 220px; width: 800px; left: 247px; top: 143px; position: absolute;">
<form method="post" action="$PORTAL_ACTION$">
<div style="height:250px">
<div onClick="guest()">
<img style="" alt="" src="captiveportal-voucher.png" class="clickimage" onclick="guest();" value="">
</div>
<div id="voucherSection" align="center" style=" width:400px;"class="trans">
<p>Please enter your airtime voucher code</p><br/>
<label for="Voucher">Voucher:</label>
<input name="auth_voucher" size="25" type="text">
<p style="text-align: center;"><input name="accept" type="submit" value="Login"></p><br/>
</div>
<div onClick="staff()">
<img alt="" src="captiveportal-staff.png" class="clickimage" onclick="guest();">
</div>
<div id="staffLogin" style="display:none; width:400px;" class="trans">
<table style="">
<tr>
<td colspan="2">
<p>Please enter your username and password</p><br/>
</td>
</tr>
<tr>
<td>
Username:
</td>
<td>
<input id="auth_user" name="auth_user" size="25" type="text">
</td>
</tr>
<tr>
<td>
Password:
</td>
<td>
<input id="auth_pass" name="auth_pass" size="25" type="password">
</td>
</tr>
<tr>
<td colspan="2">
<p style="text-align:center;"><input name="accept" type="submit" value="Login"></p>
</td>
</tr>
</table>
</div>
<input name="redirurl" type="hidden" value="$PORTAL_REDIRURL$">
</div>
</form>
</div>
<div style="text-align: center; background-color: transparent;">
<img src="captiveportal-bg1.gif" alt="" style="width: 800px; height: 101px;" align="middle">
<img style="width: 800px; height: 355px;" alt="" src="captiveportal-bg_bubbles.jpg" align="middle"><br>
<img style="width: 800px; height: 55px;" alt="" src="captiveportal-bg2.gif" align="middle"><br>
<div style="position: absolute; left: 235px; top: 487px; background-color: transparent; width: 806px;">
<span style="color: rgb(255, 255, 255); font-family: Lucida Sans;"><div id="helpText"></div></span><br>
</div>
<img style="width: 800px; height: 50px;" alt="" src="captiveportal-bg_gras.jpg" align="middle"><br>
</div>
</body>
</html>