//PHOTOGALLERY JS
function loadPhotoGallery(type,title){

	$('body').append('<div id="loading" style="height:28px; width:28px; left:50%; top:50%; margin-top:-14px; margin-left:-14px; display:none; position:fixed; z-index:650"><img src="images/photoGallery/loading.png"/></div>')
		
	$("body").ajaxStart(function(){
		$('#loading').css('display','block');
	});
	$.getJSON('process/process.loadPhotoGallery.php',{type:type},function(data){
		
		
		//CREATE BLACKBOX IF IT DOES NOT EXIST
		if($('#blackBox').length == 0){
			$('body').append('<div id="blackBox"></div>')
				.append('<div id="photoGalleryList"></div>')
				.append('<div id="close"><img src="images/photoGallery/close.png"/></div>')
				
		}
		
		
		$('#blackBox').css('display','block')
		
		$('body #close').css('display','block')
		
		if($('#photoGalleryList').css('display') == 'none'){
			$('#photoGalleryList').empty().css('display','block')
		}
		
		
		
		
		
			
			var height = document.documentElement.clientHeight
			
			//DETERMINE HEIGHT OF SCREEN AND THAN MAKE THE IMAGE MATCH
			if(height >= 300 && height < 400){
				height=250
			}else if(height >= 400 && height < 500){
				height=350
			}else if(height >= 500 && height < 700){
				height = 450
			}else if(height >= 700){
				height = 550
			}
			
			
			
			
			for(keyvar in data){
				if(data[keyvar].description > 100){
					height-=100
				}else if(data[keyvar].description > 200){
					height-=200
				}
				
				$('#photoGalleryList').append('<div class="lightBox" title="'+data[keyvar].description+'" href="lib/imageResize.class.php?src=../images/photoGallery/photos/'+data[keyvar].location+'&h='+height+'" style="float:left; margin:2px; width:100px; text-align:center;"><a style="height:100%; width:100%" ><img src="lib/imageResize.class.php?src=../images/photoGallery/photos/'+data[keyvar].location+'&h=75"/></a></div>');
			}
			
		
		
	
		
		//CLOSE PHOTO GALLERY
		$('body #close').click(function(){
			closeGallery()					
		})
		
		$('#photoGalleryList').dblclick(function(){
			closeGallery()
		})
	
		$('.lightBox').lightBox()
	})//END POST
	
	$("body").ajaxComplete(function(){
		$('#loading').css('display','none')
	});
	
	
}


function closeGallery(){
	$('body #close').css('display','none')
	$('#blackBox').css('display','none')
	$('#photoGalleryList').css('display','none')
	$('#jquery-overlay').remove()
	$('#jquery-lightbox').remove()

}