function loadImage() {
	$$("img#thephoto").each(function(img) {
	    Event.observe(img, 'load', function(event) {
	      appearEffect('galleryInner', 0.5, 1.0, 0, 1.0);
	    });
	  });
}

// image fade
function appearEffect(e, dur, del, st, end) {
	if (!document.getElementById) return false;
	if (!document.getElementById(e)) return false;
	  new Effect.Appear(e,{ 
		delay: del,  
		duration: dur, 
	    from: st, to: end 
	}
	);
	return false; 
}

// image fade
function fadeEffect(e, dur, del, st, end) {
	if (!document.getElementById) return false;
	if (!document.getElementById(e)) return false;
	  new Effect.Fade(e,{ 
		delay: del,  
		duration: dur, 
	    from: st, to: end 
	}
	);
	return false; 
}

function cleanUp(e , start, del, dur) {
	$$('#'+e).each( function(element){
		fadeEffect(e, dur, del, start, 0);
		if (element.style.display == 'none') {
			element.remove();
		}
	});

}

function closer() {
	$$('.closer').each( function(element){
		Event.observe(element, 'click', function(event) {
			Event.stop(event);
			$('loading').hide();
			cleanUp('galleryInner', 1.0, 0, 1.0);
			cleanUp('galleryMask',  0.9, 0, 1.0);
		
		})

	})
}

function prepareGallery() {
	
	var caption = "";
	
	cleanUp('galleryInner'); 
	
	new Insertion.Before("galleryWrap", 	
					     "<div id=\"galleryMask\"></div>");
					
	new Insertion.Before("galleryMask", 	
					     "<div id=\"loading\"></div>");						
	$('galleryMask').hide();
	$('loading').hide();
		
	$$('#galleryWrap ul li a').each ( function(element) {
		
		Event.observe(element, 'click', function(event) {
			Event.stop(event);
			
			cleanUp('galleryInner');
			
			if(element.title != "") {
				caption = element.title+"&nbsp;&nbsp;";
			}	
				
			new Insertion.Before("galleryMask", 	
								 "<div id=\"galleryInner\"><a href=\"#\" class=\"closer\"><img src=\""+element.href+"\" id=\"thephoto\" /></a><p id=\"caption\">"+caption+"<a href=\"#\" class=\"closer\">Close</a></p></div>");
									
		
									
			$('galleryInner').hide();
			closer();
			appearEffect('galleryMask', 0.5, 0, 0, 0.9);
			$('loading').show();
			loadImage();
			
		})
	})
}


addLoadEvent (prepareGallery);