$('#loginButton').click( function() {
	
	$.post("/webServices/login.php", {username: $('#userName').val(), password: $('#password').val()}, function(data) {
		$('#userName').val('');
		$('#password').val('');
		$('.tab').click();
		$('#loggedIn').hide();
		
		var dataString = data.split(':');
		
		if(dataString[0] == 'Error') {
			$('#loggedIn').html(data);
		} else {
			$('#loggedIn').html('Welcome, '+dataString[0]);
			$('#loginChange').html('<img src="/images/logoutButton.png" alt="logout" class="userPanelButton" id="logoutButton" /><a href="?page=/user/edit&id='+dataString[1]+'"><img border="0" src="/images/editButton.png" alt="Edit" class="userPanelButton" /></a><script src="/jscript/login.js"></script>');
			$('.tab').html('<p>User Panel</p>');
		}
		$('#loggedIn').fadeIn('slow');
	});
	
});

$('#logoutButton').click(function() {
	$.post("/webServices/logout.php", {}, function(data) {
		$('.tab').click();
		$('#loggedIn').hide();
		$('#loggedIn').html('You have successfully logged out.');
		$('#loggedIn').fadeIn('slow');
		$('#loginChange').html('<div id="login"><div id="loginChange"><p>Email: <input type="text" maxsize="50" id="userName" /></p><p>Password: &nbsp<input type="password" maxsize="50" id="password" /></p><p id="loginButton">Login</p><p class="registerButton"><a href="?page=/user/createUser">Register</a></p></div><div class="tab"><p>login</p></div></div><script src="/jscript/login.js"></script>');
		$('.tab').html('<p>login</p>');
	});
});

$('#userName').keypress(function(e){
	if(e.which == 13){
		$('#loginButton').click();
	}
});

$('#password').keypress(function(e) {
	if(e.which == 13) {
		$('#loginButton').click();
	}
});