// ATI Tank Hire Website Functions

$(function(){
		   
// ********************************************************* CLIENT AREA FUNCTION ********************************************************* 			 

	$('#topNav a:eq(5)').html('Contact');
	
	$('#clientArea').prepend('<p><b>Tel: +44 (0) 1493 441747</b></p>');
	$('#clientArea p:eq(0)').css({marginLeft:'20px',fontSize:'14px',color:'#333'});
	$('#clientArea p:eq(1)').css({marginLeft:'460px',fontSize:'12px'});
		
		var WinH = $(window).height(), WinW = $(window).width();

	
	$('<div id="floatingQuote"><a href="http://www.atitanks.co.uk/online-enquiry.php"><img src="images/quote-button.jpg" /></a></div>').appendTo('body');
	
	$('#floatingQuote').css({
							position:'absolute',
							left:'0',
							top:((WinH/2) - 62),
							position:'fixed'
							});
	
	$('#floatingQuote a,#floatingQuote a img').css({
							textDecoration:'none',
							border:'0',
							outline:'0'														
							});
	
	$('#floatingQuote a img').hover(function(){
										 
										$(this).attr('src','images/quote-button-hover.jpg');
										 
										 },
										 
										 
										 function(){
											 
											$(this).attr('src','images/quote-button.jpg'); 
											 
										});
	
	
	// Client Area Function
	$('button#login').show(10);	
		
		// On login button click	
		$('button#login').click(function(){
									
			var docH = $(document).height(); // Get page height.
			var docW = $(document).width();	 // Get page width.
			
			var winH = $(window).height();	 // Get window height.
			var winW = $(window).width();	 // Get window width.
			
			
			
			
			// Add overlay to the body.
			$('body').append('<div id="overlay"><!-- Overlay --></div>');
			$('#overlay').css({display:'none',width:'0',height:'0'});
			ReposLoad();
			
			function ReposLoad(){
			
			var newH = "";
			
			var winH = $(window).height();	 // Get window height.
			
			var docH = $('body').height(); // Get document height.

			
			if(winH > docH){ newH = winH}
			else{ newH = docH}
			
			
			// Set the overlay styles.
			$('#overlay').css({
							  backgroundColor:'#000',
							  position:'absolute',
							  width:'100%',
							  top:'0',
							  left:'0',
							  margin:'0',
							  padding:'0',
							  height:newH,
							  zIndex:'100'
							  });
			
	
}
			
			
			
			// Re-calculate the overlay position on window resize.
			$(window).resize(function(){ReposLoad();});
			
			// Add Client Area to the body.
			$('body').append('<div id="client_area"><!-- Client Area--></div><div id="shad"><!-- Shadow --></div>');
			
			// Add login form to the client area div.
			$('#client_area').append(
								'<div id="ca_wrapper"><h1>ATI Tank Hire - Client Area</h1>'+
								'<div id="form_container">' +
								'<form action="login.php" method="post" name="login_form" id="loginForm">' +
								'<label for="username">Username:</label><br />' +
								'<input type="text" name="username" id="username" /><br /><br />' +
								'<label for="password">Password:</label><br />' +
								'<input type="password" name="password" id="password" /><br /><br />' +
								'<span id="login_error">&nbsp;</span><br /><br />' +
								'<button class="close" type="button">CLOSE</button><button class="send" type="sumbit">LOG IN</button>' +
								'</form>' +
								
								'<form action="reset.php" method="post" name="reset_form" id="resetForm">' +
								'<p>Please enter your email address below to be sent a username reminder and a password reset link.</p>' +
								'<label for="email">Email:</label><br />' +
								'<input type="text" name="email" id="email" /><br /><br />' +
								'<span id="reset_error">&nbsp;</span><br /><br />' +
								'<button class="close" type="button">CLOSE</button><button class="send" type="sumbit">SEND</button>' +
								'</form>' +								
								'</div>' +
								'<div id="forgotPW"><a href="javascript:void(0)">Forgot your password or username?</a></div></div>'
								);
			
			// Set styles for elements in client area div.
			if($.browser.msie && $.browser.version <= 6 ){$('#client_area').css({position:'absolute'});$('#ca_wrapper form button').css({padding:'3px 0'});}
			
			else{$('#client_area').css({position:'fixed'});$('#ca_wrapper form button').css({padding:'5px'});}
			
			$('#client_area').css({
								 backgroundColor:'#111',
								 width:'300px',
								 top:'0',
								 left:'0',
								 height:'330px',
								 opacity:'0',
								 zIndex:'102',
								 WebkitBoxShadow:'0 0 1em hsla(0, 0%, 0%, 1.0)', // Safari Shadow
								 MozBoxShadow:'0 0 1em hsla(0, 0%, 0%, 1.0)',	// FireFox Shadow
								 boxShadow:'0 0 1em hsla(0, 0%, 0%, 1.0) '		// Google & Opera Shadow
								 });
			$('#ca_wrapper').css({
								 display:'none',
								 width:'272px',
								 margin:'17px 14px'
								 });
			$('#ca_wrapper h1').css({
								 backgroundColor:'#111',
								 fontSize:'16px',
								 fontWeight:'900',
								 color:'#ccc'
								 });
			$('#form_container').css({
								 margin:'15px 0 0 0',
								 width:'240px',
								 padding:'15px',
								 height:'200px',
								 border:'1px solid #333'							
								 });
			$('#ca_wrapper form label').css({
								 fontSize:'13px',
								 color:'#fff'
								 });
			$('#ca_wrapper form input').css({
								 width:'233px',
								 border:'1px solid #999',
								 padding:'5px 3px',
								 margin:'5px 0 0 0'
								 });
			if($.browser.msie && $.browser.version == 7){
			$('#ca_wrapper form button').css({
								 backgroundColor:'#009933',
								 border:'1px solid #000',
								 cursor:'pointer',
								 width:'62px',
								 padding:'3px 0',
								 color:'#fff'
								 });
			}
			else{
							
			$('#ca_wrapper form button').css({
								 backgroundColor:'#009933',
								 border:'1px solid #000',
								 cursor:'pointer',
								 color:'#fff'
								 });
			}
			
			$('#resetForm').css({display:'none'
							   	});
			$('#resetForm p').css({color:'#fff',fontSize:'12px',margin:'0 0 15px 0',textAlign:'justify'});
			
			if($.browser.msie && $.browser.version <= 6 || navigator.platform == 'iPad' || navigator.platform == 'iPhone' || navigator.platform == 'iPod'){
			$('#forgotPW').css({fontSize:'12px',
							   	padding:'8px 0'			
								});
			}
			else{
			$('#forgotPW').css({fontSize:'12px',
							   	padding:'15px 0'
							   	});
			}
			$('#forgotPW a').css({textDecoration:'none',
								 color:'#FF9900'
							   	});
						
			// Hover login \ close button effect for IE6. 
			$('#ca_wrapper form button').hover( 
										   
				function(){$(this).css({border:'1px solid #333', backgroundColor:'#000000'});}, // Mouse over button 
				 
				function(){$(this).css({border:'1px solid #000', backgroundColor:'#009933'});} // Mouse out button
					
  			);	
			// Error div styles
			$('#login_error,#reset_error').css({
								 fontSize:'13px',
								 color:'red',
								 backgroundColor:'#111'
								 });
			$('.close').css({
							float:'right'								 
								 });
			$('#shad').css({
							backgroundColor:'#222',
							zIndex:'101',
							display:'none',
							filter:'progid:DXImageTransform.Microsoft.Blur(pixelradius=8)',  // IE shadow
							MsFilter:'progid:DXImageTransform.Microsoft.Blur(pixelradius=8)' // PRE IE7 shadow
							});
			
			// Set styles for elements in client area div.
			if($.browser.msie && $.browser.version <= 6 ){$('#shad').css({position:'absolute'});}
			
			else{$('#shad').css({position:'fixed'});}
			
			var cliL = $(window).width()/2 - $('#client_area').width()/2;	// Get the pixels to the left of the page.
			var cliH = $(window).height()/2 - $('#client_area').height()/2;	// Get the pixels to the top of the page.		
			
			$('#overlay').fadeTo('500',0.65);	
			
			if($.browser.msie){$('#shad').css({display:'block',left:(winW/2)-9,top:(winH/2)-9,width:'0px',height:'0px'}).animate({left:cliL-10,top:cliH-10,width:'303px',height:'333px', opacity:"1"}, 350);}
			
			$('#client_area').css({left:winW/2,top:winH/2,width:'0px',height:'0px'}).animate({left:cliL,top:cliH,width:'300px',height:'330px', opacity:"1"}, 350,
			function(){$('#ca_wrapper').fadeIn(350);
			});
									
			
			$(window).resize(function(){
						
				var cliL = $(window).width()/2 - $('#client_area').width()/2;	// Get the pixels to the left of the page.
				var cliH = $(window).height()/2 - $('#client_area').height()/2;	// Get the pixels to the top of the page.							
	
				$('#client_area').css({left:cliL,top:cliH});
				$('#shad').css({left:cliL-10,top:cliH-10});
			
			});
			
			$('#overlay,.close').click(function(){
												
				var cliL = $(window).width()/2 - $('#client_area').width()/2;	// Get the pixels to the left of the page.
				var cliH = $(window).height()/2 - $('#client_area').height()/2;	// Get the pixels to the top of the page.									
										 
				$('#overlay').fadeTo('500',0, function(){$('#overlay').remove();});							
				$('#ca_wrapper').fadeOut(250, function(){$('#ca_wrapper,#shad').remove();$('#client_area').animate({left:cliL+150,top:cliH+165,width:'0px',height:'0px', opacity:"0"}, 350,
				function(){$('#client_area').remove();});});	
				
			});
			
			$('#forgotPW').click(function(){
											$('#loginForm,#forgotPW').fadeOut(500, function(){$('#loginForm').hide(0);$('#resetForm').fadeIn(500);});	
	
				
			});
			
		if($.browser.msie && $.browser.version <= 6 ){$(window).scroll(function(){$('#client_area,#shad').css({position:'absolute',"marginTop": ($(window).scrollTop() + 0) + "px"});});}
		
		else{$('#client_area').css({position:'fixed'});}
	
	// Login form check details to see if account exists	
	$('#loginForm button.send').click(function(){
											   
			// If input boxes are not empty the keep the border color the same.
			if($("#username,#password").val()!= ""){$("#username,#password").css({borderColor:'#999'});}
				
					// Check if a username has been entered.
					var username = $("input#username").val();
			
							if( username == ""){
							
									$("#login_error").html("Please enter your name.");
									$("#username").css({borderColor:'red'});
									$("#password").css({borderColor:'#999'});
									$("#username").focus();
									
									return false;
							
							}		
				
					// Check if a password has been entered.
					var password = $("input#password").val();
			
							if( password == ""){
							
									$("#login_error").html("Please enter your password.");
									$("#password").css({borderColor:'red'});
									$("#username").css({borderColor:'#999'});
									$("#password").focus();
									
									return false;
							
							}
					
			$.post('login.php',{ username:$('[name=username]').val(), password:$('[name=password]').val() }, function(data){
			
							if(data.success){location.href=data.redirect;}
									
							else{									
									$('#login_error').html(data.message);
									$("#username,#password").val('');
									$("#username").focus();
									
							}									
											  
			}, 'json');
			
			return false;
	
	});	
	
	// Login form check details to see if account exists	
	$('#resetForm button.send').click(function(){
											   
			// If input boxes are not empty the keep the border color the same.
			if($("#email").val()!= ""){$("#email").css({borderColor:'#999'});}
				
						
					// Check if email address has been entered.
					var email = $("input#email").val();
							
							if( email == ""){
									
									$("#reset_error").html("Please enter your email address.");
									$("#email").css({borderColor:'red'}).focus();
									return false;
									
							}
							
					// Check to see if email address conatins valid information.
					var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
				
							if(reg.test(email) == false){
								
									$("#reset_error").html("Please enter a valid email address.");
									$("#email").css({borderColor:'red'}).focus().val($("#email").val());
									return false;
									
							}	
								
			$.post('reset.php',{ email:$('[name=email]').val()}, function(data){
			
							if(data.success){
								
									$('#reset_error').html(data.success_msg).css({color:'green'});
									$("#email").val('');
									$("#email").focus();
								
								}
									
							else{									
									$('#reset_error').html(data.message);
									$("#email").focus().val($("#email").val());								
									
							}									
											  
			}, 'json');
			
			return false;
	
	});	
			
});	

// ********************************************************* IE6 LOGIN/LOGOUT BUTTON ********************************************************* 	
			
			if($.browser.msie && $.browser.version <= 6 ){
					
				$('#button_wrapper button').hover( 
											   
					function(){$(this).css({border:'1px solid #333', backgroundColor:'#009933'});}, // Mouse over button 
					 
					function(){$(this).css({border:'1px solid #000', backgroundColor:'#000000'});} // Mouse out button
						
				);

			}
			
			

// ********************************************************* COPYRIGHT FUNCTION ********************************************************* 			 
	 
			// Set Copyright year "ATI Tank Hire ©YEAR"
			$('a#copyright').append('ATI Tank Hire Limited &copy;' + new Date().getFullYear());
			$('a#copyright').before('<a href="iso9001.pdf" target="_self" title="We are an ISO 9001:2008 Registered Firm, click here to view our latest certificate.">ISO 9001:2008 Registered Firm</a>');
		   
// ********************************************************* SEARCH FUNCTION ********************************************************* 		   
		   
		   		
			
			// Onload text inside seach box = Search for a product. 			
			
			$('#searchForm input').val('Search ATI...').css({color:'#333' , fontStyle:'italic'});			
			
					   
			// Search Input Box Update Function.
			$('#searchForm input').click(function(){
												   
												   
			// If the search query already entered is not equal to "Search ATI...".								   
			if( $('#searchForm input').val() != 'Search ATI...' ){
				
				// Do nothing
				$('#searchForm input').css({fontStyle:'normal'});
				
				}
				
			// If not clear the input box.
			else{ $('#searchForm input').val('').css({fontStyle:'normal'}); }
			
			});
			
			// Search Input Box Update Function.
			$('#searchForm input').blur(function(){
												  
				// If search box empty								  
				if($(this).val() == ''){
					
					// Set the text inside the input box as "Search ATI..." in italics.
					$('#searchForm input').val('Search ATI...').css({color:'#333' , fontStyle:'italic'});
					
					}
			
			});
			
			// Click search button.
			$('#searchForm button').click(function(){
													
				// If the character length in the search box is less than 4 and is also not equal to "Search ATI...".
				if( $('#searchForm input').val().length < 4 && $('#searchForm input').val() != 'Search ATI...' ){
					
					return false;
					
					}
					
				// If search querry is empty or equal to "Search ATI..."	.								
				if(( $('#searchForm input').val() == '' || $('#searchForm input').val() == 'Search ATI...' )){
					
					return false;
					
					}		
			
			});
			
			/*Amendment made 14.09.11*/
			
			// Hover search button effect for IE6. 
			$('#searchForm button').hover( 
										   
				function(){ 
					$('#searchForm button').css({border:'1px solid #000', backgroundColor:'#000000'}); // Mouse over button 
				}, 
				
				function(){ 
					$('#searchForm button').css({border:'1px solid #666', backgroundColor:'#009933'}); // Mouse out button
					
  			});			
			
			
// ********************************************************* Preload Images Function ********************************************************* 		

			 var cache = [];
  // Arguments are image paths relative to the current page.
  $.preLoadImages = function() {
    var args_len = arguments.length;
    for (var i = args_len; i--;) {
      var cacheImage = document.createElement('img');
      cacheImage.src = arguments[i];
      cache.push(cacheImage);
    }
  }

	jQuery.preLoadImages("images/screen/validCSS-hover-trans.png", "images/screen/validXHTML-hover-trans.png");
			

});