var popupOpen=0;
image = new Image(); 
image.src = 'http://www.evolutionhairdressing.co.uk/images/ajax-loader.gif';
	
function popup(bgColor, fgColor){
	if(popupOpen==0){
		var windowWidth = document.documentElement.clientWidth;  
		var windowHeight = document.documentElement.clientHeight;  
		var popupHeight = $("#popup").height();  
		var popupWidth = $("#popup").width(); 
		
		if(fgColor!=0){
			$("#popup").css({  
					"position": "absolute",
					"background-color": fgColor,
					"top": $(window).scrollTop()+(windowHeight/2-popupHeight/2),  
					"left": windowWidth/2-popupWidth/2  
			});  
		}
		else{
			$("#popup").css({  
					"position": "absolute",
					"top": $(window).scrollTop()+(windowHeight/2-popupHeight/2),  
					"left": windowWidth/2-popupWidth/2  
			});  	
		}
		
		$("#backgroundPopup").css({  
				"background-color": bgColor,
				"opacity": "0.9"  
		}); 
		$("#backgroundPopup").fadeIn("slow"); 
		$("#popup").fadeIn("slow"); 
		popupOpen=1;
	}
}
function hideImage(){
	if(popupOpen==1){
		$("#popup").fadeOut("slow"); 
		$('#backgroundPopup').fadeOut("slow");
		popupOpen=0;
	}
}
function recenterPopup(){
	var windowWidth = document.documentElement.clientWidth;  
	var windowHeight = document.documentElement.clientHeight;  
	var popupHeight = $("#popup").height();  
	var popupWidth = $("#popup").width(); 
	
	$("#popup").css({  
			"position": "absolute",  
			"top": $(window).scrollTop()+(windowHeight/2-popupHeight/2),  
			"left": windowWidth/2-popupWidth/2  
	}); 
}
function showImage(image,root){
	$('#popup').html('<img src="'+root+'/images/ajax-loader.gif" alt="'+root+'/images/ajax-loader.gif" />');
	popup('#000000',0);
	
	var image1 = $('<img />').attr('src',root+'/pics/'+image).load(function(){
			$('#popup').hide();
			$('#popup').html($(this));
			recenterPopup();
			$('#popup').show();
	});
	
}
$(function(){
	$(window).scroll(function(){
			if(popupOpen==1){
				var windowHeight = document.documentElement.clientHeight;  
				var popupHeight = $("#popup").height();  
				 $("#popup").stop().animate({ "top": $(window).scrollTop()+(windowHeight/2-popupHeight/2)},"fast");
			}
	});
	$('#backgroundPopup').click(function(){
		if(popupOpen==1){
			hideImage();
		}
	});
	$('#popup').click(function(){
		if(popupOpen==1){
			hideImage();
		}
	});
});
