/*=============================================================================
    GALLERY LIBRARY
==============================================================================*/
function initGallery()
{
	var thumb = document.getElementById("thumbnails");
	if(!thumb)
		return;


	var activeImage = null;
	
	var generate = checkLength();

	// image enlarge and select functions
	var spaceWidth = 3;
	var borderWidth = 3;
	
	var images = thumb.getElementsByTagName("a");
	for(var i = 0; i < images.length; i++ )
	{
		if(images[i].className == "active" )
			makeActive(images[i]);
		images[i].onclick = changeImage;
	}

	function makeActive(element)
	{
		activeImage = element;
		
		var li = element.parentNode;
		var img = li.getElementsByTagName("img").item(0);
		var border = document.createElement("div");

		var ver = navigator.appVersion;
		var fix = ver.indexOf("MSIE 5.") != -1 ? 11 : 0;

		border.id = "active_border";
		border.style.position = "absolute";
		border.style.zIndex = 5;
		border.style.top = "-" + ( li.offsetTop + ( spaceWidth * 2 ) ) + "px";
		border.style.left = ( li.offsetLeft - ( spaceWidth * 2 ) ) + "px";
		border.style.width = ( fix + img.offsetWidth - ( spaceWidth * 2 ) ) + "px";
		border.style.height = ( fix + img.offsetHeight - ( spaceWidth * 2 ) ) + "px";
		border.style.border = borderWidth + "px #ddd solid";
		li.parentNode.appendChild(border);
		
		img.style.padding = "0";
		img.style.border = "none";
		img.style.margin = "0";
		
	}
	
	
	//bigIcons();
	
	var changeImageAnimation = 0;
	var changeImageStatus = false;
	function changeImage()
	{
		activeImage = this;
		
		changeImageStatus = true;
		var bigImage = document.getElementById("big_image");
		clearInterval(changeImageAnimation);
		this.blur();
		var border = document.getElementById("active_border");
		var img = this.parentNode.getElementsByTagName("img").item(0);
		var newLeft = ( this.parentNode.offsetLeft - ( spaceWidth * 2 ) ) + "px";
		
		var direction = parseInt(newLeft) < parseInt(border.style.left) ?
						-1 : 1;
		setOpacity(40);
		changeImageAnimation = setInterval( function() {
			if( ( (parseInt(border.style.left)*direction) + (10*direction) ) >= (parseInt(newLeft) * direction))
			{
				border.style.left = newLeft;
				clearInterval(changeImageAnimation);
				setOpacity(100);
				return false;
			}
			border.style.left = (parseInt(border.style.left) + (5*direction)) + "px";
		}, 15 );
		
		bigImage.style.display = "none";
		var src = bigImage.src;
		//var dimension = src.substring(src.indexOf("550x385"));
//alert(bigImage.src);	
//alert()
// 

		bigImage.src = img.getAttribute("src").replace(thumb_size,big_image);

		bigImage.onload = function()
		{
			this.style.display = "block";
			this.style.position = "relative";
			this.style.top = ((this.parentNode.offsetHeight - this.offsetHeight) / 2) + "px";
			this.style.margin = "0 auto";
			changeImageStatus = false;
		}
		
		return false;
		
		function setOpacity(opacity)
		{
			border.style.opacity = opacity / 100;
			border.style.filter = "alpha(opacity=" + opacity + ")";
		}
	}
	
	
	// big image
	var bigImg = document.getElementById("big_image");
	bigImg.parentNode.onmouseover = function()
	{
		if(changeImageStatus)
			return;
		var a = this.getElementsByTagName("a");
		for(var i = 0; i < a.length; i++)
			a[i].style.display = "block";
	}
	bigImg.parentNode.onmouseout = function()
	{
		if(changeImageStatus)
			return;
		var a = this.getElementsByTagName("a");
		for(var i = 0; i < a.length; i++)
			a[i].style.display = "none";
	}
	
//	if(!generate)
//	{
//		showHideGallery(true);
//		
//		var buttonRight = document.getElementById("pn_next");
//		if(buttonRight) buttonRight.style.display = "none";
//
//		var buttonLeft = document.getElementById("pn_prev");
//		if(buttonLeft) buttonLeft.style.display = "none";
//		
//		return;
//	}
	
	// scroll function
	var layer = document.getElementById("thumbnails");
	var wrapper = document.getElementById("thumbnails_container");
	var button = document.getElementById("button");
	if(!button)
	{
		// create scrollbar
		var sc = document.createElement("div");
		sc.setAttribute("id","scroll");
		document.getElementById("photo_navi").appendChild(sc);
		var scb = document.createElement("div");
		scb.setAttribute("id","button");
		scb.title = "Z\u0142ap i przesu\u0144..."
		sc.appendChild(scb);
		button = scb;
	}
	
	var buttonLeft = document.getElementById("pn_prev");
	if(!buttonLeft)
	{
		var a = document.createElement("a");
		a.className = "n";
		a.innerHTML = "&lt;&lt;";
		a.id = "pn_prev";
		a.setAttribute("href","#");
		document.getElementById("photo_navi").appendChild(a);
		buttonLeft = a;
	}
	buttonLeft.title = "Poprzedni obrazek";
	
	var buttonRight = document.getElementById("pn_next");
	if(!buttonRight)
	{
		var a = document.createElement("a");
		a.className = "n";
		a.innerHTML = "&gt;&gt;";		
		a.id = "pn_next";
		a.title = "Przewiń w prawo";
		a.setAttribute("href","#");
		document.getElementById("photo_navi").appendChild(a);
		buttonRight = a;
	}
	buttonRight.title = "Nast\u0119pny obrazek";

	
	var layerElements = layer.getElementsByTagName("li");
	for(var i = 0; i < layerElements.length; i++ )
		layerElements[i].className = "visible";
	layer.style.width = layerElements.length * (layerElements[0].offsetWidth + 16) + "px";

	buttonRight.onmousedown = nextImage;
	buttonLeft.onmousedown = prevImage;
	buttonRight.onmouseup = moveStop;
	buttonLeft.onmouseup = moveStop;
	buttonRight.onmouseout = moveStop;
	buttonLeft.onmouseout = moveStop;
	buttonRight.onclick = function() { return false; }
	buttonLeft.onclick = function() { return false; }
	
	var interval;
	
	function nextImage()
	{
		var images = thumb.getElementsByTagName("a");
		for(var i = 0; i < images.length; i++ )
		{
			if(images[i] == activeImage )
			{
				if( i < images.length - 1 )
					images[i+1].onclick();
				return false;
			}
		}		
		return false;
	}
	
	function prevImage()
	{
		var images = thumb.getElementsByTagName("a");
		for(var i = 0; i < images.length; i++ )
		{
			if(images[i] == activeImage )
			{
				if( i > 0 )
					images[i-1].onclick();
				return false;
			}

		}		
		return false;
	}
	
	function moveLeft()
	{
		layer.style.left = layer.offsetLeft + "px";
		interval = setInterval(function()
		{
			if(parseInt(layer.style.left) + 3 > 0)
			{
				layer.style.left = "0"; // set to 0
				clearInterval(interval);
				return;
			}
			
			try {
				layer.style.left = (parseInt(layer.style.left) + 3) + "px !important";	
			} catch (e) {
				layer.style.left = (parseInt(layer.style.left) + 3) + "px";
			}
			
			synchronize(false);
		}, 10 );
		return false;
	}
	
	function moveRight() 
	{
		var loffW = layer.offsetWidth;
		var woffW = wrapper.offsetWidth;
		layer.style.left = layer.offsetLeft + "px";
		interval = setInterval(function()
		{
			if( (layer.offsetLeft*(-1)) + 3 > loffW - woffW)
			{
				layer.style.left = (woffW - loffW) + "px";
				clearInterval(interval);
				return;
			}
			
			try {
				layer.style.left = (parseInt(layer.style.left) - 3) + "px !important";	
			} catch (e) {
				layer.style.left = (parseInt(layer.style.left) - 3) + "px";
			}
			
			
			synchronize(false);
		}, 10 );
		return false;
	}
	
	function moveStop()
	{
		clearInterval(interval);
		return false;
	}
	
	
	// scroll button functions
	var scrollStatus = false;
	var startX = 0;
	var buttonX;
	button.onmousedown = function(e)
	{
		e = e||event;
		scrollStatus = true;
		startX = e.clientX;
		buttonX = this.offsetLeft;
	}
	button.onmouseup = function() { scrollStatus = false; }
	document.onmouseup = function() { scrollStatus = false; }
	
	// if mousedown on button scroll button
	document.onmousemove = function(e)
	{
		e = e||event;
		if(scrollStatus)
		{
			if(buttonX + (e.clientX - startX) < 0 )
			{
				button.style.left = 0;
				return;
			}
			if( buttonX + (e.clientX - startX + button.offsetWidth) > button.parentNode.offsetWidth )
			{
				button.style.left = (button.parentNode.offsetWidth-button.offsetWidth) + "px";
				return;
			}
			else
			{
				button.style.left = (buttonX + (e.clientX - startX)) + "px";
				synchronize(true);
			}
		}
	}

	// dont select text while moving
	document.onselectstart = function() { if(scrollStatus); return false; }

	// synchronize layer position with button position and vice versa
	function synchronize(direction)
	{
		var layerScroll = layer.offsetWidth - layer.parentNode.offsetWidth;
		var buttonScroll = button.parentNode.offsetWidth;
		
		var scale = ( layer.parentNode.offsetWidth - layer.offsetWidth ) / (button.parentNode.offsetWidth - button.offsetWidth/2);

		if(direction) // button -> layer
		{
			var adjustment = 1.05;
			// try to fix adjustment
			var tmp = button.offsetLeft * scale * adjustment;
			if(tmp >= 0)
				layer.style.left = "0";
			else if(  button.offsetLeft  >= button.parentNode.offsetWidth - button.offsetWidth )
			{
				try {
					layer.style.left = ( layer.parentNode.offsetWidth - layer.offsetWidth ) + "px !important";					
				} catch (e) {
					layer.style.left = ( layer.parentNode.offsetWidth - layer.offsetWidth ) + "px";
				}
			}
			else
			try {
				if (navigator.userAgent.indexOf('Firefox/3') == -1) layer.style.left = tmp + "px !important";
					else layer.style.left = tmp + "px";

			} catch (e) {
				layer.style.left = tmp + "px";
			}

		}
		else // layer -> button
		{
			var tmp = layer.offsetLeft / scale;
			if(tmp < 0 || layer.offsetLeft > -2 )
				button.style.left = "0";
			else if(tmp + button.offsetWidth  > button.parentNode.offsetWidth)
				button.style.left = (button.parentNode.offsetWidth - button.offsetWidth) + "px";
			else
				button.style.left = tmp + "px";
		}
	}
	
	function checkLength()
	{
		var tmp1 = document.getElementById("thumbnails_container").offsetWidth;
		var tmp2 = 0;
		for(var i = 0; i < document.getElementById("thumbnails").childNodes.length; i++)
		{
			if(document.getElementById("thumbnails").childNodes.item(i).nodeName.toUpperCase()=="LI")
				tmp2 += 86;
		}
		return tmp1 <= tmp2;
	}
	
	if(!generate)
		sc.style.display = "none";
	showHideGallery(true);
}

function showHideGallery(status)
{
	status = status ? "visible" : "hidden";
	var bigImage = document.getElementById("big_image");
	var photoNavi = document.getElementById("thumbnails_container");
	setVisibility(bigImage, status);
	setVisibility(photoNavi, status);
	
	function setVisibility(object, status)
	{
		var objects = object.parentNode.childNodes;
		for(var i = 0; i < objects.length; i++)
		{
			if(objects.item(i).style)
				objects.item(i).style.visibility = status;
		}
	}
}

addEvent(window, 'load', initGallery);