/************************************************/
/* JQuery Register Login Plugin by Visual-Craft */
/* www.visual-craft.com 						*/
/************************************************/
(function(jQuery){
	jQuery.fn.loginForm = function(options) {
		var opts = jQuery.extend(jQuery.fn.loginForm.defaults, options);
		
		var frmMain;
		var frmMainIsOpened = false;
		var frmMainIsAnimated = false;
		var FormWidth = 572;
		var FormHeight = 554;
		
		/************************************************/
		/*  Additional Functions                        */
		/************************************************/
		function getPageSize() {
			var xScroll, yScroll;
			if(window.innerHeight && window.scrollMaxY) {	
				xScroll = window.innerWidth + window.scrollMaxX;
				yScroll = window.innerHeight + window.scrollMaxY;
			} else if (document.body.scrollHeight > document.body.offsetHeight) {
				xScroll = document.body.scrollWidth;
				yScroll = document.body.scrollHeight;
			} else {
				xScroll = document.body.offsetWidth;
				yScroll = document.body.offsetHeight;
			}
			var windowWidth, windowHeight;
			if(self.innerHeight) {
				if(document.documentElement.clientWidth) { windowWidth = document.documentElement.clientWidth;  } else { windowWidth = self.innerWidth; }
				windowHeight = self.innerHeight;
			} else if(document.documentElement && document.documentElement.clientHeight) {
				windowWidth = document.documentElement.clientWidth;
				windowHeight = document.documentElement.clientHeight;
			} else if(document.body) {
				windowWidth = document.body.clientWidth;
				windowHeight = document.body.clientHeight;
			}
			if(yScroll < windowHeight) { pageHeight = windowHeight; } else { pageHeight = yScroll; }
			if(xScroll < windowWidth) { pageWidth = xScroll; } else { pageWidth = windowWidth; }
			return [pageWidth, pageHeight, windowWidth, windowHeight];
		}
		
		function getBodyScrollTop_ff() {
			return self.pageYOffset || (document.documentElement && document.documentElement.scrollTop) || (document.body && document.body.scrollTop);
		}
		
		function getInt(i) {
			i = parseInt(i,10);
			if(isNaN(i)) { i = 0; }
			return i;	
		}
		
		function extraHeight(el) {
			if(!el) return 0;
			//if(el.length == 0) return 0;
			el = el.eq(0);
			var eh = 0;
			eh += getInt(el.css('paddingTop'));
			eh += getInt(el.css('paddingBottom'));
			eh += getInt(el.css('borderTopWidth'));
			eh += getInt(el.css('borderBottomWidth'));
			//eh += getInt(el.offsetHeight);
			return eh;
		}
		
		/************************************************/
		/*	Plugin Methods								*/
		/************************************************/
		function ShowBackground() {
			var TagBody = jQuery('body');
			var BodyTop = parseInt(TagBody.css('margin-top')) + parseInt(TagBody.css('padding-top'));
			//var BodyRight = parseInt(TagBody.css('margin-right')) + parseInt(TagBody.css('padding-right'));
			//var BodyBottom = parseInt(TagBody.css('margin-bottom')) + parseInt(TagBody.css('padding-bottom'));
			var BodyLeft = parseInt(TagBody.css('margin-left')) + parseInt(TagBody.css('padding-left'));
			
			var pageSize = getPageSize();
			var bgDiv = jQuery(opts.FormBackground);
			if(bgDiv) {
				bgDiv.css('display', 'none');
				bgDiv.css('visibility', 'hidden');
				bgDiv.css({
					'position':'absolute',
					'top':(0-(BodyTop+27))+'px',
					'left':(0-(BodyLeft))+'px',
					'width':pageSize[0]+'px',
					'height':(pageSize[1])+'px',
					'background':'black'
				});
				bgDiv.animate({
					opacity: 0.00001
				}, 1, function() {
					bgDiv.css('display', 'block');
					bgDiv.css('visibility', 'visible');
					bgDiv.animate({ opacity: 0.5 }, 50);
				});
			}
		}
		
		function HideBackground() {
			var bgDiv = jQuery(opts.FormBackground);
			if(bgDiv) {
				bgDiv.animate({
					opacity: 0.0
				}, 500, function() {
					bgDiv.css('display', 'none');
				});
			}
		}
		
		function CloseLoginForm() {
			frmMainIsAnimated = true;
			frmMain.animate({
				opacity: 0.0
			}, 500, function() {
				jQuery(this).css('display', 'none');
				frmMainIsOpened = false;
				frmMainIsAnimated = false;
				HideBackground();
			});
		}
		
		function BuildContent_Why() {
			var Content = '';
			Content += '<div class="loginFormLogo"><!--Null--></div><a class="lfBtnClose" href="lfBtnClose"></a><div style="clear: both;"><!--Null--></div>';
			Content += '<div class="loginFormTitle">Why join?</div>';
			Content += '<div class="loginFormJoingText">Registering with EuroSpaClub will allow you to save your details and use the configurator to find the best Wellness travel package to suit your needs. Joining will also mean that we can keep you informed of all the latest hot deals as soon as they are available and receive news on exciting new destinations, treatments, and events. All you need to do to register is fill out a short form with your details and you\'re ready to go!</div>';
			Content += '<div class="loginFormContinueRegister"><a id="lfBtnContinue" href="#">Continue registration »</a></div>';
			Content += '<div class="loginFormPolitics"><!--Null--></div>';
			return Content;
		}
		
		function BuildContent_Why_Rebind() {
			//Continue Href
			frmMain.find('a#lfBtnContinue').click(function() {
				frmMain.css('display', 'none');
				frmMain.find('div#loginRegisterForm').html(BuildContent_Register());
				BuildContent_Register_Rebind();
				ShowForm();
				return false;
			});
			
			//Geting height from table
			var tableMain = frmMain.find('div#loginRegisterForm');
			frmMain.css('visibility', 'hidden');
			frmMain.css('display', 'block');
			FormHeight = frmMain.attr('offsetHeight');
			frmMain.css('display', 'none');
			frmMain.css('visibility', 'visible');
			
			//Close Button
			frmMain.find('a.lfBtnClose').click(function() {
				CloseLoginForm();
				return false;
			});
		}
		
		function BuildContent_Login() {
			var Content = '';
			Content += '<div class="loginFormLogo"><!--Null--></div><a class="lfBtnClose" href="lfBtnClose"></a><div style="clear: both;"><!--Null--></div>';
			Content += '<div class="loginFormTitle">Login</div>';
			Content += '<div class="loginFormJoingText">Not a member? <a id="lfBtnJoin" href="#">Join for free</a></div>';
			Content += '<form action="' + opts.formAction + '" method="post">';
			Content += '<div class="loginFormFields">';
			Content += '	<div class="loginFormContent">';
			Content += '		<div class="loginFormLabels" style="width: 90px;">';
			Content += '			<p><label for="log">Email<span style="color: red;">*</span>:</label></p>';
			Content += '			<p><label for="pwd">Password<span style="color: red;">*</span>:</label></p>';
			Content += '		</div>';
			Content += '		<div class="loginFormInputs">';
			Content += '			<p><input type="text" id="log" name="log" value="" /></p>';
			Content += '			<p><input type="password" id="pwd" name="pwd" value="" /></p>';
			Content += '			<p><a href="' + opts.ForgotYourPass + '">Forgot your password?</a></p>';
			Content += '		</div>';
			Content += '		<div class="loginFormHelp">';
			Content += '			<p style="top: 0px;"><span>Your Email</span></p>';
			Content += '			<p style="top: 24px;"><span>Your Password</span></p>';
			Content += '		</div>';
			Content += '		<div style="clear: both;"><!--Null--></div>';
			Content += '	</div>';
			Content += '</div>';
			Content += '<div style="height: 10px;"><!--Null--></div><div class="loginFormSubmit"><input type="submit" value="" /></div>';
			Content += '</form>';
			Content += '<div class="loginFormPolitics"><!--Null--></div>';
			return Content;
		}
		
		function BuildContent_Login_Rebind() {
			//Join Href
			frmMain.find('a#lfBtnJoin').click(function() {
				frmMain.css('display', 'none');
				frmMain.find('div#loginRegisterForm').html(BuildContent_Register());
				BuildContent_Register_Rebind();
				ShowForm();
				return false;
			});
			
			
			//Geting height from table
			var tableMain = frmMain.find('div#loginRegisterForm');
			frmMain.css('visibility', 'hidden');
			frmMain.css('display', 'block');
			FormHeight = frmMain.attr('offsetHeight');
			frmMain.css('display', 'none');
			frmMain.css('visibility', 'visible');
			
			//Inputs Help
			//jQuery(opts.FormClickActiovationButton).click(function() { if(!frmMainIsOpened) { ShowForm(); } return false; });
			frmMain.find('div.loginFormInputs').find('input').each(function(i) {
				jQuery(this).focus(function() {
					var divHelp = frmMain.find('div.loginFormHelp p');
					divHelp.css('display', 'none');
					divHelp.each(function(j) {
						if(i == j) {
							jQuery(this).animate({
								opacity: 0.00001
							}, 1, function() {
								jQuery(this).css('display', 'block');
								jQuery(this).animate({ opacity: 1.0 }, 300);
							});
						}
					});
				});
				jQuery(this).blur(function() {
					var divHelp = frmMain.find('div.loginFormHelp p');
					divHelp.css('display', 'none');
				});
				
			});
			
			//Close Button
			frmMain.find('a.lfBtnClose').click(function() {
				CloseLoginForm();
				return false;
			});
		}
		
		function BuildContent_Register() {
			var Content = '';
			var FieldIncer = 0;
			Content += '<div class="loginFormLogo"><!--Null--></div><a class="lfBtnClose" href="lfBtnClose"></a><div style="clear: both;"><!--Null--></div>';
			Content += '<div class="loginFormTitle">Join Now</div>';
			Content += '<div class="loginFormJoingText">Register now for EuroSpaClub.com and join our growing community. It\'s free and easy. <a id="lfBtnWhy" href="#">Why join?</a><br /><br />Already registered? <a id="lfBtnLogin" href="#">Click here</a></div>';
			Content += '<form action="' + opts.formAction + '?action=register" method="post">';
			Content += '<div class="loginFormFields">';
			Content += '	<div class="loginFormContent">';
			
			
			/*helpEmail: 'Help text for Email field.',
			helpFirstname: 'Help text for Firstname field.',
			helpLastname: 'Help text for Lastname field.',
			helpCitizenship: 'Help text for Citizenship field.',
			
			helpAddress_1: 'Help text for Address 1 field.',
			helpAddress_2: 'Help text for Address 2 field.',
			helpCity: 'Help text for City field.',
			helpState: 'Help text for State field.',
			helpZipcode: 'Help text for Zipcode field.',
			helpCountry: 'Help text for Country field.',
			
			helpTelephone: 'Help text for Telephone field.'*/
			
			
			Content += '		<div class="loginFormLabels" style="width: 90px;">';
			Content += '			<p><label for="user_email">Email<span style="color: red;">*</span>:</label></p>';
			Content += '			<p><label for="user_firstname">First Name<span style="color: red;">*</span>:</label></p>';
			Content += '			<p><label for="user_lastname">Last Name<span style="color: red;">*</span>:</label></p>';
			Content += '			<p><label for="user_citizenship">Citizenship<span style="color: red;">*</span>:</label></p>';
			Content += '			<p><label for="user_address_1">Address 1<span style="color: red;">*</span>:</label></p>';
			Content += '			<p><label for="user_address_2">Address 2:</label></p>';
			Content += '			<p><label for="user_city">City<span style="color: red;">*</span>:</label></p>';
			Content += '			<p><label for="user_state">State<span style="color: red;">*</span>:</label></p>';
			Content += '			<p><label for="user_zipcode">Zipcode<span style="color: red;">*</span>:</label></p>';
			Content += '			<p><label for="user_country">Country<span style="color: red;">*</span>:</label></p>';
			Content += '			<p><label for="user_telephone">Telephone<span style="color: red;">*</span>:</label></p>';
			Content += '		</div>';
			Content += '		<div class="loginFormInputs">';
			Content += '			<p><input type="text" id="user_email" name="user_email" value="" /></p>';
			Content += '			<p><input type="text" id="user_firstname" name="user_firstname" value="" /></p>';
			Content += '			<p><input type="text" id="user_lastname" name="user_lastname" value="" /></p>';
			Content += '			<p><input type="text" id="user_citizenship" name="user_citizenship" value="" /></p>';
			Content += '			<p><input type="text" id="user_address_1" name="user_address_1" value="" /></p>';
			Content += '			<p><input type="text" id="user_address_2" name="user_address_2" value="" /></p>';
			Content += '			<p><input type="text" id="user_city" name="user_city" value="" /></p>';
			Content += '			<p><input type="text" id="user_state" name="user_state" value="" /></p>';
			Content += '			<p><input type="text" id="user_zipcode" name="user_zipcode" value="" /></p>';
			Content += '			<p><input type="text" id="user_country" name="user_country" value="" /></p>';
			Content += '			<p><input type="text" id="user_telephone" name="user_telephone" value="" /></p>';
			Content += '		</div>';
			Content += '		<div class="loginFormHelp">';
			Content += '			<p style="top: ' + FieldIncer + 'px;"><span>' + opts.helpEmail + '</span></p>'; FieldIncer += 24;
			Content += '			<p style="top: ' + FieldIncer + 'px;"><span>' + opts.helpFirstname + '</span></p>'; FieldIncer += 24;
			Content += '			<p style="top: ' + FieldIncer + 'px;"><span>' + opts.helpLastname + '</span></p>'; FieldIncer += 24;
			Content += '			<p style="top: ' + FieldIncer + 'px;"><span>' + opts.helpCitizenship + '</span></p>'; FieldIncer += 24;
			Content += '			<p style="top: ' + FieldIncer + 'px;"><span>' + opts.helpAddress_1 + '</span></p>'; FieldIncer += 24;
			Content += '			<p style="top: ' + FieldIncer + 'px;"><span>' + opts.helpAddress_2 + '</span></p>'; FieldIncer += 24;
			Content += '			<p style="top: ' + FieldIncer + 'px;"><span>' + opts.helpCity + '</span></p>'; FieldIncer += 24;
			Content += '			<p style="top: ' + FieldIncer + 'px;"><span>' + opts.helpState + '</span></p>'; FieldIncer += 24;
			Content += '			<p style="top: ' + FieldIncer + 'px;"><span>' + opts.helpZipcode + '</span></p>'; FieldIncer += 24;
			Content += '			<p style="top: ' + FieldIncer + 'px;"><span>' + opts.helpCountry + '</span></p>'; FieldIncer += 24;
			Content += '			<p style="top: ' + FieldIncer + 'px;"><span>' + opts.helpTelephone + '</span></p>'; FieldIncer += 24;
			Content += '		</div>';
			Content += '		<div style="clear: both;"><!--Null--></div>';
			Content += '	</div>';
			Content += '</div>';
			Content += '<div style="padding-top: 10px;">';
			Content += '	<span style="color: red;">All fields marked with * are mandatory!</span>';
			Content += '</div>';
			Content += '<div class="loginFormSendMe">';
			Content += '	<input type="hidden" value="user' + opts.NewUserId + '" name="user_login"><input type="checkbox" id="send_me" name="send_me" /> <label for="send_me" style="cursor: pointer;">Send me the FREE EuroSpaClub.com newsletter which includes the best of our site, plus great deals. You can cancel at any time without any obligation.</label>';
			Content += '</div>';
			Content += '<div class="loginFormSubmit"><input type="submit" value="" /></div>';
			Content += '</form>';
			Content += '<div class="loginFormPolitics">Read our <a target="blank" href="' + opts.PoliticsUrl + '">privacy policy</a> here.</div>';
			return Content;
		}
		
		function BuildContent_Register_Rebind() {
			//Login Href
			frmMain.find('a#lfBtnLogin').click(function() {
				frmMain.css('display', 'none');
				frmMain.find('div#loginRegisterForm').html(BuildContent_Login());
				BuildContent_Login_Rebind();
				ShowForm();
				return false;
			});
			
			//Why
			frmMain.find('a#lfBtnWhy').click(function() {
				frmMain.css('display', 'none');
				frmMain.find('div#loginRegisterForm').html(BuildContent_Why());
				BuildContent_Why_Rebind();
				ShowForm();
				return false;
			});
			
			//Geting height from table
			var tableMain = frmMain.find('div#loginRegisterForm');
			frmMain.css('visibility', 'hidden');
			frmMain.css('display', 'block');
			FormHeight = frmMain.attr('offsetHeight');
			frmMain.css('display', 'none');
			frmMain.css('visibility', 'visible');
			
			//Inputs Help
			frmMain.find('div.loginFormInputs').find('input').each(function(i) {
				jQuery(this).focus(function() {
					var divHelp = frmMain.find('div.loginFormHelp p');
					divHelp.css('display', 'none');
					divHelp.each(function(j) {
						if(i == j) {
							jQuery(this).animate({
								opacity: 0.00001
							}, 1, function() {
								jQuery(this).css('display', 'block');
								jQuery(this).animate({ opacity: 1.0 }, 300);
							});
						}
					});
				});
				jQuery(this).blur(function() {
					var divHelp = frmMain.find('div.loginFormHelp p');
					divHelp.css('display', 'none');
				});
				
			});
			
			//Close Button
			frmMain.find('a.lfBtnClose').click(function() {
				CloseLoginForm();
				return false;
			});
		}
		
		function BuildForm() {
			frmMain.css('display', 'none');
			frmMain.append('<table border="0" width="' + FormWidth + '" cellpadding="0" cellspacing="0"><tr><td class="lf-top-left"><!--Null--></td><td class="lf-top-center"><!--Null--></td><td class="lf-top-right"><!--Null--></td></tr><tr valign="top"><td class="lf-center-left"><!--Null--></td><td class="lf-center-center"><div id="loginRegisterForm">' + '' + '</div></td><td class="lf-center-right"><!--Null--></td></tr><tr><td class="lf-bottom-left"><!--Null--></td><td class="lf-bottom-center"><!--Null--></td><td class="lf-bottom-right"><!--Null--></td></tr></table>');
		}
		
		function ShowForm() {
			var pageSize = getPageSize();
			var yScroll = getBodyScrollTop_ff();
			var FormLeft = parseInt((pageSize[2]/2) - ((FormWidth + (34*2)) / 2));
			var FormTop = parseInt((pageSize[3]/2) - (FormHeight / 2) + yScroll - 10);
			
			
			frmMainIsOpened = true;
			frmMain.css('position', 'absolute');
			frmMain.css('left', FormLeft + 'px');
			frmMain.css('top', FormTop + 'px');
			
			frmMainIsAnimated = true;
			frmMain.animate({
				opacity: 0.00001
			}, 1, function() {
				jQuery(this).css('display', 'block');
				frmMain.animate({
					opacity: 1.0
				}, 500, function() {
					frmMainIsAnimated = false;
					frmMain.find('input[name=user_email]').focus();
					frmMain.find('input[name=log]').focus();
				});
			});
		}
		
		/************************************************/
		/*	Main Plugin Code							*/
		/************************************************/
		return this.each(function() {
			frmMain = jQuery(this);
			
			//Register Button
			if(opts.FormClickActiovationRegisterButton != '') {
				jQuery(opts.FormClickActiovationRegisterButton).click(function() {
					if(!frmMainIsOpened) {
						ShowBackground();
						frmMain.css('display', 'none');
						frmMain.find('div#loginRegisterForm').html(BuildContent_Register());
						BuildContent_Register_Rebind();
						ShowForm();
					}
					return false;
				});
			}
			
			//Login button
			if(opts.FormClickActiovationLoginButton != '') {
				jQuery(opts.FormClickActiovationLoginButton).click(function() {
					if(!frmMainIsOpened) {
						ShowBackground();
						frmMain.css('display', 'none');
						frmMain.find('div#loginRegisterForm').html(BuildContent_Login());
						BuildContent_Login_Rebind();
						ShowForm();
					}
					return false;
				});
			}
			
			BuildForm();
		});
	};
	
	jQuery.fn.loginForm.defaults = {
		FormClickActiovationRegisterButton: '',
		FormClickActiovationLoginButton: '',
		FormBackground: '',
		NewUserId: '0',
		formAction: '#',
		PoliticsUrl: '#',
		ForgotYourPass: '#',
		
		helpEmail: 'Help text for Email field.',
		helpFirstname: 'Help text for Firstname field.',
		helpLastname: 'Help text for Lastname field.',
		helpCitizenship: 'Help text for Citizenship field.',
		
		helpAddress_1: 'Help text for Address 1 field.',
		helpAddress_2: 'Help text for Address 2 field.',
		helpCity: 'Help text for City field.',
		helpState: 'Help text for State field.',
		helpZipcode: 'Help text for Zipcode field.',
		helpCountry: 'Help text for Country field.',
		
		helpTelephone: 'Help text for Telephone field.'
	};
})(jQuery);