//basics---------------------------------------------------------------------------

// handle multiple loads event

function addLoadEvent(func) 
{  

	var oldonload = window.onload; 

	if (typeof window.onload != 'function') 
	{ 
		window.onload = func;  
	} else {                  
		window.onload = function() 
		{  
			oldonload();    
			func();   
		}
	}
}

//insert after DOM element

function insertAfter(newElement, targetElement)
{
	var parent = targetElement.parentNode;
	if(parent.lastChild == targetElement)
	{
		parent.append(newElement);
	} else {
		parent.insertBefore(newElement, targetElement.nextSibling);
	}
}


//XMLHttp init---------------------------------------------------------------------------

//xmlhttprequest

function getHTTPObject()
{
/* 	return; */
	//set possible XMLHttpObects
	
	var XMLHttpFactories = [
		function() { return new XMLHttpRequest() },
		function() { return new ActiveXObject("Msxml2.XMLHTTP") },
		function() { return new ActiveXObject("Msxml3.XMLHTTP") },
		function() { return new ActiveXObject("Microsoft.XMLHTTP") }
	];
	
	
	function createXMLHttpObject()
	{
		var xmlhttp = false;

		for(var i = 0; i < XMLHttpFactories.length; I++)
		{
			
			try 
			{
				xmlhttp = XMLHttpFactories[i]();
				return xmlhttp;
			}
			
			catch(e)
			{
				continue;
			}
			
			break;
			
		}
	}
	
	return createXMLHttpObject();
}



//galleries functions---------------------------------------------------------------------------

//find galleries

function findGallery()
{
	if(!document.getElementsByTagName("ul")) return false;
	
	var list_ul = document.getElementsByTagName("ul");;
	
	for (i = 0; i < list_ul.length; i++)
	{
		if(list_ul[i].className == "image-gallery")
		{
			preparePlaceholder(list_ul[i]);
		}
	
	}
}

//prepare image gallery container

function preparePlaceholder(gallery)
{
	
	if(!document.createElement) return false;
	if(!document.createTextNode) return false;
	if(!document.getElementById) return false;
	if(!gallery) return false;
		
	var placeholder = document.createElement("img");
	
	placeholder.setAttribute("class", "placeholder");
	placeholder.setAttribute("src", "i/placeholder.gif");
	placeholder.setAttribute("alt", "my image gallery");
	
	var picloader = document.createElement("img");
	
	picloader.setAttribute("class", "picloader");
	picloader.setAttribute("src", "i/loadergraph.gif");
	picloader.style.height = "5px";
	picloader.style.width = "600px";
	picloader.style.margin = "0";
	
	var description = document.createElement("p");
	
	description.setAttribute("class", "description");
	
	var desctext = document.createTextNode("Click on a picture to enlarge.");
	
	description.appendChild(desctext);
	
	var current_gallery = gallery;
	
	insertAfter(placeholder, current_gallery);
	insertAfter(description, placeholder);


	placeholder.style.height = "0";
	
	prepareGallery(gallery);
	
}


//prepare gallery

function prepareGallery(gallery)
{
	
	if ( !document.getElementsByTagName ) return false;
	if ( !document.getElementById ) return false;

	// get all gallery links
   	var links = gallery.getElementsByTagName("a");
   	
	
	for ( var i=0; i < links.length; i++ )
	{
		links[i].onclick = function()
		{
			return showPic(this);
		}
		
		//links[i].onkeypress = links[i].onclick;
	}
	
}

//show image

function showPic(whichPic)
{
	
	
	
	var gallery = whichPic.parentNode.parentNode;
	var placeholder = gallery.nextSibling;
	
	
	if(placeholder.nodeName != "IMG") return true;	
	
	var current_pic = placeholder.getAttribute("src");
	var current_desc = placeholder.nextSibling.firstChild;

	if(whichPic != current_pic)
	{
		
		if(placeholder.nextSibling.tagName == "P" && placeholder.nextSibling.className == "description")
		{
			current_desc.nodeValue = whichPic.getAttribute("title");
		}
		
		if (!getHTTPObject()) 
		{
			//change images no transitions
			placeholder.style.height = "400px";
			placeholder.setAttribute("src", whichPic);
			
		} else {
		
		request = getHTTPObject();
		request.open("GET", whichPic , true);
		
		//change className to loader
		var gallery_class = gallery.className;
		var old_class = gallery_class;
		gallery_class += " loader";
		gallery.className = gallery_class;
		
		request.onreadystatechange = function()
		{
			
			if(request.readyState == 4)
			{
				//change className to loaded
				gallery_class = old_class;
				gallery.className = gallery_class;
				
				//change images with transitions and loading
				animate(placeholder, 400);
				placeholder.setAttribute("src", whichPic);
			}
			
 		} 
		
			request.send(null);
			
		}

		return false;
		
		
		
	} else {
	
		placeholder.setAttribute("src", "i/placeholder.gif");
		animate(placeholder, 0);
		current_desc.nodeValue = "Click on a picture to enlarge.";
		
		return false;
	}
	

}


//animate transitions---------------------------------------------------------------------------

// animate placeholder

function animate(placeholder, max_height)
{
	
	var anim_pic = function()
	{
	var current_height = parseInt(placeholder.style.height); 
	
	if(current_height == max_height) 
	{
	
/* 		gallery.className = "image-gallery"; */
		clearInterval(animate);
		//change className to loaded
/* 				gallery_class = old_class; */
				

		return true;	
	}
	
	if (current_height < max_height)
	{
		var dist = Math.ceil((max_height - current_height) *.5);
		current_height += dist;
		var opacity = current_height / max_height;
	}
	
	if (current_height > max_height)
	{
		var dist = Math.ceil((current_height - max_height) *.5);
		current_height -= dist;
		var opacity =  current_height /  400;
		
	}
	

	placeholder.style.height = current_height + "px";
	placeholder.style.width = "600px";
	placeholder.style.opacity = opacity;
	
	}
	

	var animate = setInterval(anim_pic, 10);
	

}


//init page---------------------------------------------------------------------------

addLoadEvent(findGallery);
/* addLoadEvent(prepareGallery); */