var Login = {
	site: 'The Awl',
	othersites: 'Splitsider or The Hairpin',
	/* Actions for all the links */
	init: function() {
		$(document).bind('afterReveal.facebox', function() {
			$('#facebox_overlay').height($(document).height()); // IE6
			$('.ad-inner object').css('visibility','hidden');
		});
		$(document).bind('afterClose.facebox', function() {
			$('.ad-inner object').css('visibility','visible');
		});
		$(document).bind('login.show_logout', function() {
			Login.show_logout();
		});
		$(document).bind('login.show_login', function() {
			Login.show_login();
		});
		$(document).bind('login.show_register', function() {
			Login.show_register();
		});
		$(document).bind('login.show_recover', function() {
			Login.show_recover();
		});
		$(document).bind('login.show_reset', function() {
			Login.show_reset();
		});
		$('#logout').click(function() {
			$(document).trigger('login.show_logout');
			return false;
		});
		window.Login = Login;
	},
	/* Clear and hide the error message */
	clear: function() {
		$('.login_message').text('').removeClass('active');
	},
	/* Set the error message */
	message: function(msg) {
		$('.login_message').text(msg).addClass('active');
	},
	/* Close the popup after delay */
	dismissAfter: function(msec, evt) {
		setTimeout(function() {
			$(document).trigger('close.facebox');
			$(document).trigger(evt);
		}, msec);
	},
	/* Twitter */
	twitter: {
		window: null,
		/* Button clicked - pop up the twitter login window */
		login: function() {
			Login.clear();
			Login.twitter.window = window.open('/login/twitter',"Twitter_Login","menubar=no,width=780,height=450,toolbar=no");
		},
		/* OAuth error or Twitter is down - close the popup and show error */
		onerror: function() {
			Login.twitter.window.close();
			Login.twitter.window = null;
			Login.message('Something seems wrong with Twitter, please try again!');
		},
		/* Success, close twitter popup, show success message, close login popup */
		onlogin: function() {
			Login.twitter.window.close();
			Login.twitter.window = null;
			Login.message('Great! Logging you in...');
			Login.dismissAfter(1000, 'login.success');
		}
	},
	/* Facebook */
	facebook: {
		/* Button clicked - pop up the facebook login window */
		login: function() {
			Login.clear();
			/* Facebook's javascript login */
			FB.login(function(response) {
				if (response.session || response.authResponse) {
					// Success, set our session cookie via ajax
					$.ajax({
						type: 'GET', cache: false, dataType: 'json', url: '/login/facebook',
						error: function(jqXHR, textStatus, errorThrown) {
							Login.message('Sorry! Something went wrong, please try again! [51]');
						},
						success: function(data, textStatus, jqXHR) {
							Login.message(data.message);
							Login.dismissAfter(1000, 'login.success');
						}});
				} else {
					// Failure - login failed or user declined
					Login.message('Something seems wrong with Facebook, please try again!');
				}
			});
		}
	},
	/* Show the Logout dialog, log the user out, hide the dialog */
	show_logout: function() {
		var box = $('<div>')
					.append($('<div>').addClass('login_message_wrap')
						.append($('<div>').addClass('login_message').text('One moment please..').show()))
					.append($('<div>').addClass('login_wrap')
						.append($('<h3>').addClass('logout').text('You are now being logged out of ')
							.append($('<img>').attr('src', '/assets/login_logo.png')))
					);
		$.facebox(box.html());
		$.ajax({
			type: 'POST', cache: false, dataType: 'json', url: '/login/logout',
			error: function(jqXHR, textStatus, errorThrown) {
				Login.message('Sorry! Something went wrong, please try again! [100]');
			},
			success: function(data, textStatus, jqXHR) {
				//Login.message(data.message);
				Login.dismissAfter(1000, 'logout.success');
			}});
	},
	/* Show the Login dialog, bind the buttons */
	show_login: function() {
		var box = $('<div>')
					.append($('<div>').addClass('login_message_wrap').append($('<div>').addClass('login_message')))
					.append($('<div>').addClass('login_wrap')
						.append($('<h3>').append($('<span>').text('Login to ')).append($('<span>').text(Login.site).addClass('logo')))
						.append($('<div>').attr('id','login_body').addClass('clearfix')
							.append($('<div>').addClass('left')
							.append($('<form>').attr('id','form').attr('autocomplete','off')
								.append($('<label>').text('E-Mail').attr('for','email'))
								.append($('<input type="text" name="email" />').attr('id','email')).attr('autocomplete','off')
								.append($('<label>').text('Password').attr('for','password'))
								.append($('<input type="password" name="password" />').attr('id','password'))
								.append($('<input type="submit" />').val('Submit').attr('id','submit'))
								.append($('<div>').addClass('remember').append($('<input type="checkbox" name="remember" />').attr('id','remember')))
								.append($('<label>').text('Keep me logged in').attr('for','remember').addClass('remember'))
								.append($('<a href="#"></a>').text('Forgot your password?').attr('id','forgot'))
							))
							.append($('<div>').addClass('right')
								.append($('<p>').text('OR use your existing account from..'))
								.append($('<a href="#"></a>').text('Facebook').addClass('facebook'))
								.append($('<a href="#"></a>').text('Twitter').addClass('twitter'))
								.append($('<p>').text('Don\'t have an account? ').append($('<a href="#"></a>').text('Create one!').attr('id','create_one')))
							)));
		$.facebox(box.html());
		$('#submit').hover(function() {$(this).addClass('hover');}, function() {$(this).removeClass('hover')});
		$('#create_one').click(function() { $(document).trigger('login.show_register'); return false; });
		$('#forgot').click(function() { $(document).trigger('login.show_recover'); return false; });
		$('#submit').click(function() {
			Login.clear();
			Login.message('Logging you in..');
			setTimeout(function() {
				$.ajax({
					type: 'POST', cache: false, dataType: 'json', url: '/login/login',
					data: $('#form').serialize(),
					error: function(jqXHR, textStatus, errorThrown) {
						Login.message('Sorry! Something went wrong, please try again! [200]');
					},
					success: function(data, textStatus, jqXHR) {
						if(data && data.result == 'failure') {
							Login.message(data.message);
						} else if(data && data.result == 'success') {
							Login.message(data.message);
							Login.dismissAfter(1000, 'login.success');
						} else {
							Login.message('Sorry! Something went wrong, please try again! [300]');
						}
					}});
				}, 500);
				
			return false;
		});
		$('.twitter').click(function() { Login.twitter.login(); return false; });
		$('.facebook').click(function() { Login.facebook.login(); return false; });
	},
	/* Show the Register dialog, bind the buttons */
	show_register: function() {
		var current_field_values = null;
		var box = $('<div>')
					.append($('<div>').addClass('login_message_wrap').append($('<div>').addClass('login_message')))
					.append($('<div>').addClass('login_wrap')
						.append($('<h3>').append($('<span>').text('Register with ')).append($('<span>').text(Login.site).addClass('logo')))
						.append($('<div>').attr('id','login_body').addClass('clearfix')
							.append($('<div>').addClass('left')
							.append($('<form>').attr('id','form').attr('autocomplete','off')
								.append($('<label>').text('E-Mail').attr('for','email'))
								.append($('<input type="text" name="email" id="email" />')).attr('autocomplete','off')
								.append($('<div>').addClass('indicator'))
								.append($('<label>').text('Commenter Name').attr('for','username'))
								.append($('<input type="text" name="username" id="username" />')).attr('autocomplete','off')
								.append($('<div>').addClass('indicator'))
								.append($('<label>').text('Password').attr('for','password'))
								.append($('<input type="password" name="password" id="password" />'))
								.append($('<div>').addClass('indicator'))
								.append($('<input type="submit" />').val('Submit').attr('id','submit'))
								.append($('<a href="#"></a>').text('Forgot your password?').attr('id','forgot'))
							))
							.append($('<div>').addClass('right')
								.append($('<p>').text('OR use your existing account from..'))
								.append($('<a href="#"></a>').text('Facebook').addClass('facebook'))
								.append($('<a href="#"></a>').text('Twitter').addClass('twitter'))
								.append($('<p>').text('Already registered? ').append($('<a href="#"></a>').text('Log-in here!').addClass('login_here')))
							)));
		$.facebox(box.html());
		$('#submit').hover(function() {$(this).addClass('hover');}, function() {$(this).removeClass('hover')});
		$('.login_here').click(function() { $(document).trigger('login.show_login'); return false;  });
		$('#forgot').click(function() { $(document).trigger('login.show_recover'); return false; });
		$('.twitter').click(function() { Login.twitter.login(); return false; });
		$('.facebook').click(function() { Login.facebook.login(); return false; });
		$('#submit').click(function() {
			Login.clear();
			Login.message('Registering you..');
			setTimeout(function() {
				$.ajax({
					type: 'POST', cache: false, dataType: 'json', url: '/login/register',
					data: $('#form').serialize(),
					error: function(jqXHR, textStatus, errorThrown) {
						Login.message('Sorry! Something went wrong, please try again! [400]');
					},
					success: function(data, textStatus, jqXHR) {
						if(data && data.result == 'failure') {
							Login.message(data.message);
						} else if(data && data.result == 'success') {
							Login.message(data.message);
							Login.dismissAfter(3000, 'login.success');
						} else {
							Login.message('Sorry! Something went wrong, please try again! [500]');
						}
					}});
				}, 500);
			return false;
		});
		/* Live validation for registration form fields */
		current_field_values = $('#form').serialize();
		$('#form input').blur(function() {
			// don't re-validate if nothing changed
			if(current_field_values == $('#form').serialize()) {
				return;
			}
			current_field_values = $('#form').serialize();
			// any Empty field is automatically invalid
			if($(this).val() == '') {
				$(this).next().removeClass('checkmark').addClass('xmark');
				return;
			}
			// email is automatically invalid if it doesn't have an @-sign
			if($(this).attr('id') == 'email' && $(this).val().indexOf('@') == -1) {
				$('#email').next().removeClass('checkmark').addClass('xmark');
				return;
			}
			// hide current image, since POST might take a few moments to complete
			$(this).next().removeClass('checkmark xmark');
			// POST key-value to see if it is valid
			Login.clear();
			$.ajax({
				type: 'POST', cache: false, dataType: 'json', url: '/login/validate',
				data: 'key='+$(this).attr('id')+'&value='+$(this).val(),
				error: function(jqXHR, textStatus, errorThrown) {
					Login.message('Sorry! Something went wrong, please try again! [600]');
				},
				success: function(data, textStatus, jqXHR) {
					if(			data && data.result == 'validate.email.invalid'			) {
						Login.message(data.message);
						$('#email').next().removeClass('checkmark').addClass('xmark');
					} else if(	data && data.result == 'validate.email.nonunique'		) {
						Login.message(data.message);
						$('#email').next().removeClass('checkmark').addClass('xmark');
					} else if(	data && data.result == 'validate.email.valid'			) {
						Login.clear();
						$('#email').next().removeClass('xmark').addClass('checkmark');
					} else if(	data && data.result == 'validate.username.invalid'		) {
						Login.message(data.message);
						$('#username').next().removeClass('checkmark').addClass('xmark');
					} else if(	data && data.result == 'validate.username.nonunique'	) {
						Login.message(data.message);
						$('#username').next().removeClass('checkmark').addClass('xmark');
					} else if(	data && data.result == 'validate.username.valid'		) {
						Login.clear();
						$('#username').next().removeClass('xmark').addClass('checkmark');
					} else if(	data && data.result == 'validate.password.invalid'		) {
						Login.message(data.message);
						$('#password').next().removeClass('checkmark').addClass('xmark');
					} else if(	data && data.result == 'validate.password.valid'		) {
						Login.clear();
						$('#password').next().removeClass('xmark').addClass('checkmark');
					} else {
						Login.message('Sorry! Something went wrong, please try again! [700]');
					}
				}});
			return false;
		});
		return false;
	},
	/* Show the Password Recovery dialog */
	show_recover: function() {
		var box = $('<div>')
					.append($('<div>').addClass('login_message_wrap').append($('<div>').addClass('login_message')))
					.append($('<div>').addClass('login_wrap')
						.append($('<h3>').append($('<span>').text('Recover your password')))
						.append($('<div>').attr('id','login_body').addClass('clearfix')
							.append($('<div>').addClass('left')
							.append($('<form>').attr('id','form').attr('autocomplete','off')
								.append($('<label>').text('E-Mail').attr('for','email'))
								.append($('<input type="text" name="email" />').attr('id','email')).attr('autocomplete','off')
								.append($('<input type="submit" />').val('Recover Password').attr('id','submit').addClass('recover'))
								.append($('<p>').addClass('note').text('Instructions: You will receive an email that contains a link to create a new password.'))
							))
							.append($('<div>').addClass('right')
								.append($('<p>').text('OR use your existing account from..'))
								.append($('<a href="#"></a>').text('Facebook').addClass('facebook'))
								.append($('<a href="#"></a>').text('Twitter').addClass('twitter'))
								.append($('<p>').text('Don\'t have an account? ').append($('<a href="#"></a>').text('Create one!').attr('id','create_one')))
							)));
		$.facebox(box.html());
		$('#submit').hover(function() {$(this).addClass('hover');}, function() {$(this).removeClass('hover')});
		$('#create_one').click(function() { $(document).trigger('login.show_register'); return false; });
		$('.twitter').click(function() { Login.twitter.login(); return false; });
		$('.facebook').click(function() { Login.facebook.login(); return false; });
		$('#submit').click(function() {
			Login.clear();
			Login.message('Recovering your password...');
			setTimeout(function() {
				$.ajax({
					type: 'POST', cache: false, dataType: 'json', url: '/login/recover',
					data: $('#form').serialize(),
					error: function(jqXHR, textStatus, errorThrown) {
						Login.message('Sorry! Something went wrong, please try again! [800]');
					},
					success: function(data, textStatus, jqXHR) {
						if(data && data.result == 'failure') {
							Login.message(data.message);
						} else if(data && data.result == 'success') {
							Login.message(data.message);
						} else {
							Login.message('Sorry! Something went wrong, please try again! [900]');
						}
					}});
				}, 500);
			return false;
		});
	},
	/* Show the Password Reset dialog - only reachable through the email link */
	show_reset: function() {
		var box = $('<div>')
					.append($('<div>').addClass('login_message_wrap').append($('<div>').addClass('login_message')))
					.append($('<div>').addClass('login_wrap')
						.append($('<h3>').append($('<span>').text('Reset your password')))
						.append($('<div>').attr('id','login_body').addClass('clearfix')
							.append($('<div>').addClass('left')
							.append($('<form>').attr('id','form').attr('autocomplete','off')
								.append($('<input type="hidden" name="key" value=""/>').attr('id','key'))
								.append($('<input type="hidden" name="user" value=""/>').attr('id','user'))
								.append($('<label>').text('New Password').attr('for','password1'))
								.append($('<input type="password" name="password1" />').attr('id','password1'))
								.append($('<label>').text('Confirm Password').attr('for','password2'))
								.append($('<input type="password" name="password2" />').attr('id','password2'))
								.append($('<input type="submit" />').val('Reset Password').attr('id','submit').addClass('reset'))
							))
							.append($('<div>').addClass('right')
								.append($('<p>').text('Enter a new password'))
							)));
		$.facebox(box.html());
		$('#submit').hover(function() {$(this).addClass('hover');}, function() {$(this).removeClass('hover')});
		$('#submit').click(function() {
			Login.clear();
			Login.message('Resetting your password...');
			setTimeout(function() {
				$.ajax({
					type: 'POST', cache: false, dataType: 'json', url: '/login/reset',
					data: $('#form').serialize(),
					error: function(jqXHR, textStatus, errorThrown) {
						Login.message('Sorry! Something went wrong, please try again! [901]');
					},
					success: function(data, textStatus, jqXHR) {
						if(data && data.result == 'failure') {
							Login.message(data.message);
						} else if(data && data.result == 'success') {
							Login.message(data.message);
							Login.dismissAfter(3000, 'login.success');
						} else {
							Login.message('Server Error Sorry! Something went wrong, please try again! [902]');
						}
					}});
				}, 500);
			return false;
		});
	}
};
Login.init();