$(document).ready(function(){
	activateLoginNavigation();	
	$(".actionboxtrigger").setActionbox();
});

/**
* activated the loginBox
*/
function activateLoginNavigation()
{
	var trigger				= $("#toggle_loginbox");
	var loginBox			= $("#loginbox");
	var loginInputEmail 	= $("#login_email");
	var loginInputPassword 	= $("#login_password");	
	var loginBoxForm		= $("#login");
			
	if(loginBoxForm.length > 0){					
		validateSetup(loginBoxForm, false, true);
		loginBoxFormValidator = loginBoxForm.validate();
				
		/**
		* Add form validation rules for password change
		**/
		loginInputEmail.rules("add", {
			required: true,
	 		emailaddress: true,
	 		messages:
	 		{
	 			required: cbVM_Email
	 		}
		});
		
		loginInputPassword.rules("add", {
			required: true,
			minlength: 6,
	 		messages:
	 		{
	 			required: cbVM_Password
	 		}
		});
									
		loginBoxForm.submit(function(event){
			event.preventDefault();
					
			if(loginBoxFormValidator.valid()){
				ajaxLoader = $(document.createElement("img"))
								.attr("id", "")
								.attr("src", "/images/default/ajax-loader.gif")
								.css("margin", "9px 0px")
				submitButton = $("#loginbox .login_send");
				submitButton.attr("disabled","disabled");
				submitButton.hide();
				
				errorHTML = loginBoxForm.find("ul.errors").hide().empty();//Hide and empty the error container (if present)
				
				submitButton.before(ajaxLoader)
				$.ajax({
				    type: "POST",
				    url: $(this).attr("action"),
				    data: "ajax=true&doLogin=true&" + $(this).serialize(),
				    success: function(responseData){
				        	window.location = "/mijn-coolblue-account/";
				    },
				    error: function (xhr, ajaxOptions, thrownError){
				    	submitButton.show();
		            	submitButton.removeAttr("disabled");
		            	ajaxLoader.remove();
		            	
		            	loginInputPassword.val("");
		            	
		                errorRespons = jQuery.parseJSON(xhr.responseText);
		                	             	                	
	                	$.each(errorRespons, function(index, value){
		                	errorHTML.append($(document.createElement("li")).append(value))
		                });
		                
		                errorHTML.show();
		            }
				});
			}
		});
	}	

	$("#loginbox_close").click(function(event){
		event.preventDefault();
		trigger.trigger("click");
	});
	
	trigger.click(function(event) 
	{
	    event.preventDefault();
	    trigger.toggleClass("active");
	    loginBox.toggleClass("active");
	    loginInputEmail.focus();
	    
	    //unbind all the click events on the loginbox
	    $(document).unbind("click.loginbox");
	    
	    //active hasn't been set. onclick is set on the document, to close the loginbox if the click event is triggert outside the "trigger"
	    $(document).bind("click.loginbox", function(event) {
	    	target = $(event.target);
	    	isParentContainer = false;
	    	
	    	if(target.attr("id") == "toggle_loginbox") {
	    		isParentContainer = true;
	    	}else if(target.hasClass("loginbox_password_forget") == false) {
		    	parentElement = target;

		    	for (var x = 1; x <= 5; x++)
		    	{	
		    		if(parentElement.parent().attr("id") == "loginbox")
		    		{
		    			isParentContainer = true;
		    			break;
		    		}
		    		else
		    		{
		    			parentElement = parentElement.parent();
		    		}
		    	}
	    	}
	    	
			if(isParentContainer == false && loginBox.hasClass("active"))
			{
			    trigger.toggleClass("active");
			    loginBox.toggleClass("active");
			    $(document).unbind("click.loginbox");
			}
		});	
	});
	
	$("#login .loginbox_password_forget").click(function(event){
		event.preventDefault();
		PopupBoxForgetPassword($("#login_email").val());
	});
}

function forgotPassword(){		
	fogotPasswordForm = $("#passwordresetajax");
	
	if(fogotPasswordForm.length > 0) {
		validateSetup(fogotPasswordForm, true, true);
		fogotPasswordFormValidator = fogotPasswordForm.validate();
		/**
		* Add form validation rules for password change
		**/
		$("#passwordforget_email_ajax").rules("add", {
			required: true,
	 		emailaddress: true,
		 	messages:
		 	{
		 		required: cbVM_EmailRequired
		 	}
		});
		
		$("#passwordforget_email_ajax").setDefaultValidationStatus(fogotPasswordForm);
		
		$("#passwordforget_email_ajax").focus();
		
		fogotPasswordForm.submit(function(event){
			if(fogotPasswordFormValidator.valid()){
				event.preventDefault();
				ajaxLoader = $(document.createElement("img"))
						.attr("id", "")
						.attr("src", "/images/default/ajax-loader.gif")
						.css("margin", "9px 0px")
				submitButton = $(this).find(":submit");
				submitButton.attr("disabled","disabled");
				submitButton.hide();
				
				errorHTML = fogotPasswordForm.find("ul.errors").hide().empty();//Hide and empty the error container (if present)			
						
				submitButton.before(ajaxLoader)
				$.ajax({
					type: "POST",
					url: $(this).attr("action"),
					data: "ajax=true&doPasswordReset=true&" + $(this).serialize(),
					success: function(responseData, status, xmlRespons){
					    fogotPasswordForm.parent().replaceWith("<p>" + jQuery.parseJSON(xmlRespons.responseText) + "</p>");
					},
					error: function (xhr, ajaxOptions, thrownError){
						errorRespons = jQuery.parseJSON(xhr.responseText);
												
		                $.each(errorRespons, function(index, value){
		                	errorHTML.append($(document.createElement("li")).append(value))
		                })
		                
		                errorHTML.show();
			        },
					complete: function(){
			            submitButton.show();
			            submitButton.removeAttr("disabled");
			            ajaxLoader.remove();
			        }
				});
			}
		});
	}
}

/**
* activated "forgot Password" in the loginBox
* var emailaddress => to prefill the email adress in the popup
*/
function PopupBoxForgetPassword(emailaddress) {
	overlayOpen();
	//Appending popup to body
	var popup = $(document.createElement("div"));
	
	popup.addClass("facetedpopup")
		.attr("id", "popupbox_password_forget")
		.append (
			$(document.createElement("div"))
				.addClass("popupbox_title")
				.append(
					$(document.createElement("h2"))
						.text("Wachtwoord vergeten?")
				)
				.append(
					$(document.createElement("a"))
						.text("Sluiten")
						.attr("href", "#")
						.click(function(event){
							event.preventDefault();
							popup.remove();
							overlayClose();
						})
				)
		)
		.append(
				$(document.createElement("div"))
					.addClass("popupbox_content")
					.append(
						$(document.createElement("div"))
							.addClass("popupbox_content_wrapper")
					)
		)
		.append(
				$(document.createElement("div"))
					.addClass("popupbox_footer")
		)
					
		$("body").append(popup);		
		
		$.ajax({
			type: "GET",
			url: "/wachtwoordvergeten?ajax=true&emailaddress="+emailaddress,
			success: function(html){
				$("#popupbox_password_forget .popupbox_content_wrapper").append(html);
				forgotPassword();
				rowHighlighting($("#popupbox_password_forget .popupbox_content_wrapper form"));
			}
		})
};

/**
* activated "forgot email adress" in the loginBox
*/
function PopupBoxForgetEmailadress() {
	overlayOpen();
	//Appending popup to body
	var popup = $(document.createElement("div"));
	
	popup.addClass("facetedpopup")
		.attr("id", "popupbox_emailadress_forget")
		.append (
			$(document.createElement("div"))
				.addClass("popupbox_title")
				.append(
					$(document.createElement("h2"))
						.text("E-mailadres vergeten?")
				)
				.append(
					$(document.createElement("a"))
						.text("Sluiten")
						.attr("href", "#")
						.click(function(event){
							event.preventDefault();
							popup.remove();
							overlayClose();
						})
				)
		)
		.append(
				$(document.createElement("div"))
					.addClass("popupbox_content")
					.append(
						$(document.createElement("div"))
							.addClass("popupbox_content_wrapper")
							.load('/emailvergeten?ajax=true')
				)
		)
		.append(
				$(document.createElement("div"))
					.addClass("popupbox_footer")
		)
					
		$("body").append(popup)
};

function overlayOpen(){
	if($("#fade_overlay").length < 1){
		$("body").append(
			$(document.createElement("div"))
				.attr("id", "fade_overlay")
				.appendTo("body")
		)
	}
}

function overlayClose(){
	$("#fade_overlay").remove();
}