MOI MOI

<html>
<head>
<title>Anmelde Dialog</title>
<script>
window.onload = function(){
	document.getElementById("bReset").onclick = function(){reset();};
	document.getElementById("bLogin").onclick = function(){login();};
	document.getElementById("bRegister").onclick = function(){register();};

	document.getElementById("box").classList.add("hide");
	var x = document.getElementsByClassName("reg");
	var i;
	for(i=0;i<x.length;i++){
		x[i].classList.add("hide");
	}
}
function login(){
	var fehler="";

	if(document.getElementById("passw").value == "" && document.getElementById("UName").value == ""){
		fehler = "Sie haben keine Daten angegeben!";
	}else if(document.getElementById("UName").value == ""){
		fehler = "Sie haben keinen Username eingegeben!";
	}else if(document.getElementById("passw").value == ""){
		fehler = "Sie haben kein Password eingegeben!";
	}else{
		document.getElementById("box").classList.add("hide");
	}

	if(fehler!=""){
		document.getElementById("box").classList.remove("hide");
		document.getElementById("box").innerHTML = fehler;
	}
}
function register(){
	var fehler="";
	var grossb = false;
	var zahl = false;

	for(var i=0;i<document.getElementById("passw").value.length;i++){
		 if(document.getElementById("passw").value.charAt(i).toUpperCase() == document.getElementById("passw").value.charAt(i)) grossb=true;
		 if(isNaN(document.getElementById("passw").value.charAt(i)) == false) zahl=true;
	}

	if(document.getElementById("UName").value == ""){
		fehler = "Sie haben keinen Username eingegeben!";
	}
	else if(document.getElementById("passw").value == ""){
		fehler = "Sie haben kein Password eingegeben!";
	}else if(document.getElementById("passw").value.length < 8 || grossb == false || zahl == false){
		fehler = "Das Password muss mindestens 8 Zeichen lang sein, eine Zahl und ein Grossbuchstaben enthalten!";
	}
	else if(document.getElementById("Rpassw").value != document.getElementById("passw").value){
		fehler = "Sie muessen das Password widerholen!";
	}
	if(fehler!=""){
		document.getElementById("box").classList.remove("hide");
		document.getElementById("box").innerHTML = fehler;
	}else{
		document.getElementById("box").classList.add("hide");
	}
}
function reset(){
	document.getElementById("UName").value = "";
	document.getElementById("passw").value = "";
	document.getElementById("Rpassw").value = "";
}
function showLogin(){
	var x = document.getElementsByClassName("reg");
	var i;
	for(i=0;i<x.length;i++){
		x[i].classList.add("hide");
	}
	x = document.getElementsByClassName("log");
	for(i=0;i<x.length;i++){
		x[i].classList.remove("hide");
	}
}

function showRegister(){
	var x = document.getElementsByClassName("log");
	var i;
	for(i=0;i<x.length;i++){
		x[i].classList.add("hide");
	}
	x = document.getElementsByClassName("reg");
	for(i=0;i<x.length;i++){
		x[i].classList.remove("hide");
	}
}
</script>
<style>
	.hide{
		display:none;
	}
	input{
		margin-left:10px;
	}
	button{
		margin-right:10px;
	}
	span:hover{
		cursor:pointer;
	}
	span{
		color:blue;
	}
	#box{
		border: 3px solid #F00;
		height: 50px;
		padding: 10px;
		position: absolute;
		left:350px;
		top:10px;
		width: 250px;
	}
	#content{
		border:1px solid gray;
		width:300px;
		padding-left:2px;
	}
</style>
</head>
<body>
<form action="index.php">
<div id="content">
<p>Username<input type="text" id="UName"/></p>
<p>Password<input type="password" id="passw"/></p>
<p class="reg">Repeat Password<input type="password" id="Rpassw"/></p>
<button id="bLogin" class="log">Login</button><button id="bRegister" class="reg">Register</button><button id ="bReset">Reset</button>
<p><a href="javascript:showLogin()" class="reg">Login</a><a href="javascript:showRegister()" class="log">Register</a></p>
</div>
<div id="box"></div>
<input type="hidden" value="" name="usecase"/>
</form>
</body>
</html>