<!DOCTYPE html>
<html>
	<head>
		<title>Ostsee - Verborgene Fracht - Login</title>
	</head>
	<style type="text/css">
		html,body
		{
			width:100%;
			height:100%;
			margin:0px;
			padding:0px;
			overflow:hidden;
		}

		body
		{
			position:absolute;
			background:#474747;
			vertical-align:middle;
		}

		form.login
		{
			position:relative;
			top:50%;
			display:block;
			margin:auto auto;
			width:12em;
			text-align:right;
			font-family:Arial, Helvetica Neue, Helvetica, sans-serif;
			font-weight:bold;
			transform: translateY(-50%);
		}

		form.login label
		{
			color:#fff;
			text-align:center;
			font-size:x-small;
			text-transform:uppercase;
			display:block;
			font-weight:normal;
			line-height:1.75em;
		}

		form.login :active,
		form.login :focus
		{
			outline:0px;
		}

		form.login input
		{
			border:4px solid #fff;
			border-radius:6px;
			background:#fff;
			width:100%;
			margin:0px;
			font-size:inherit;
			text-align:center;
		}

		form.login button
		{
			clear:both;
			display:block;
			float:right;
			background:#fff;
			border:0px;
			position:relative;
			top:-1em;
			margin-top:-5px;
			font-size:inherit;
			background:transparent;
			color:#474747;
			text-align:right;
		}
	</style>
<body onload="document.getElementById('password').focus()">
	<form action="/" class="login">
		<input type="hidden" name="username" id="username" value="login" />
		<label>Passwort <?php echo $_SERVER['PHP_AUTH_USER'].$_SERVER['REMOTE_USER'] ?><br/>
			<input type="password" id="password" /></label>
		<button type="submit" />&gt;</button>
		<br style="clear:both" />
	</form>
</body>
</html>

<script type="text/javascript">
//~ ajax-main-functions --------------------------------------------- ~
function createHTTPObject()
{
  var xmlhttp;
  /*@cc_on
  @if (@_jscript_version >= 5) try {
  xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
  try {
  xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  } catch (E){
  xmlhttp = false;
  }
  } @else xmlhttp = false; @end @*/

  if (!xmlhttp && typeof XMLHttpRequest != 'undefined')
    {
      try { xmlhttp = new XMLHttpRequest(); }
      catch (e) { xmlhttp = false; }
    }
    return xmlhttp;
}

function formSubmit(e)
{
	var form     = e.target;
	var username = document.getElementById("username");
	var password = document.getElementById("password");
	var http     = createHTTPObject();
  /* console.log("username: " + username.value + " password: " + password.value); */
	http.open("get", "index.html", false, username.value, password.value);
	http.send("");
	if (http.status == 200) /* content got delivered, we are clear to pass (password was right) */
	{ window.location = "http://ostsee.halbtotal.de/index.html"; return false; }
	else if (http.status == 401) /* 401=authorization required when password was wrong */
	{ password.value = ''; return false; }
	else /* other errors lead to the default login page */
	{ return false; }
}

for(var i in document.forms)
{ document.forms[i].onsubmit=formSubmit; }
</script>
<!-- vim: set ts=2 sw=2 :smartindent -->