$(document).ready(function () {
	$('#calendarContent').listen('click', 'a.login', function(){
		$.get("login.php", function(data){
			// create a modal dialog with the data
			$(data).modal({
				overlayId: 'loginModalOverlay',
				containerId: 'loginModalContainer',
				onOpen: login.open,
				onShow: login.show,
				onClose: login.close
			});
		});
		return false;
	});
});

var login = {
	message: null,
	open: function (dialog) {
		dialog.overlay.fadeIn(200, function () {
			dialog.container.fadeIn(200, function () {
				dialog.data.fadeIn(200, function () {
					$('#loginModalContainer #username').focus();
				});
				// input field font size
				if ($.browser.safari) {
					$('#loginModalContainer #username, #loginModalContainer #password').css({
						'font-size': '.9em'
					});
				}
			});
		});
	},
	show: function (dialog) {
		$('#loginModalContainer .send').click(function (e) {
			e.preventDefault();
			// validate form
			if ( login.validate() ) {
				$('#loginModalContainer .message').fadeOut(function () {
					$('#loginModalContainer .message').empty();
				});
				$('#loginModalContainer form').fadeOut(200);
				$('#loginModalContainer .content').animate({ height: '80px'
				}, function () {
					$('#loginModalContainer .title').html('Checking...');
					$('#loginModalContainer .loading').fadeIn(200, function () {
						$.ajax({
							url: 'login.php',
							data: $('#loginModalContainer form').serialize() + '&action=login',
							dataType: 'html',
							complete: function (data) {
								$('#loginModalContainer .loading').fadeOut(200, function () {
									// 0-login successfull, 1-no login credentials supplied, 2-login failed, 3-logout successfull, 4-DB Connection error
									if(data.responseText == "0") {
										$.modal.close();
										calendar.display(null);										
									} else if (data.responseText == "3") {
										$.modal.close();
										calendar.display(null);
									} else if (data.responseText == "1") {
										login.message = 'No login credentials supplied!';
										$('#loginModalContainer .title').html('Login to manage calendar');
										$('#loginModalContainer .message').fadeOut(200, function(){
											$('#loginModalContainer form').fadeIn(200);
											login.showError();
										});
									} else if (data.responseText == "2") {
										login.message = 'Invalid login credentials!';
										$('#loginModalContainer .title').html('Login to manage calendar');
										$('#loginModalContainer .message').fadeOut(200, function(){
											$('#loginModalContainer form').fadeIn(200);
											login.showError();
										});
									} else {
										login.message = 'Login error! Please try again later!';
										$('#loginModalContainer .title').html('Login to manage calendar');
										$('#loginModalContainer .message').fadeOut(200, function(){
											$('#loginModalContainer form').fadeIn(200);
											login.showError();
										});
									}
								});
							},
							error: login.error
						});
					});
				});
			} else {
				if ($('#loginModalContainer .message:visible').length > 0) {
					$('#loginModalContainer .message div').fadeOut(200, function () {
						$('#loginModalContainer .message div').empty();
						login.showError();
					});
				} else {
					$('#loginModalContainer .message').animate({
						height: '30px'
					}, login.showError);
				}
			}
		});
	},
	close: function (dialog) {
		dialog.data.fadeOut(200, function () {
			dialog.container.fadeOut(200, function () {
				dialog.overlay.fadeOut(200, function () {
					$.modal.close();
				});
			});
		});
	},
	error: function (xhr) {
		alert(xhr.statusText);
	},
	validate: function () {
		login.message = '';
		
		var username = $('#loginModalContainer #username').val();
		if (!username) {
			login.message += 'Username is required. ';
		}
		var password = $('#loginModalContainer #password').val();
		if (!password) {
			login.message += 'Password is required. ';
		} 
		if (login.message == ""){
			return true;
		} else {
			return false;
		}
	},
	showError: function () {
		$('#loginModalContainer .message').html($('<div class="error">').append(login.message)).fadeIn(200);
	}
};