var galleryThumbnailsPage;
	var galleryThumbnailsLastPage;
	var galleryContents = [];
	var galleryArtistLink;
	
	var galleryMayZoom = true;
	var galleryMayScroll = true;
	
	function galleryInit()
	{
		if(!document.getElementById || !document.getElementsByTagName)
			return;
		
		var container = document.getElementById("gallery-thumbnails-container");
		var thumbnails = document.getElementById("gallery-thumbnails");
		var currentPage = document.getElementById("gallery-current-page");
		var navigation = document.getElementById("page-navigation");
		var pageLinks = document.getElementById("gallery-page-links");
		var prevLink = document.getElementById("gallery-prev-link");
		var nextLink = document.getElementById("gallery-next-link");
		
		if(!container || !thumbnails || !currentPage || !navigation || !pageLinks || !prevLink || !nextLink)
			return;
		
		preloadImages(galleryContents);
		
		prevLink.href = window.location.href.replace(window.location.hash, '') + '#';
		prevLink.onclick = function() {galleryScrollPrev(); return false;}
		
		nextLink.href = window.location.href.replace(window.location.hash, '') + '#';
		nextLink.onclick = function() {galleryScrollNext(); return false;}
			
		var listItems = [];
		var listItemsIndex = 0;
		for(var img, i = 0; img = galleryContents[i]; i++)
		{
			if(img)
			{	
				var caption = pregoCreateElement("SPAN", img.caption, "caption-"+img.captionalign);
				var image = pregoCreateImage(img.file, "");
				image.style.cursor = "pointer";
				image.id = "gallery-image-"+i;
				
				var div = pregoCreateElement("DIV", [image, caption], "image");
				div.style.width = img.width + "px";
				div.style.height = img.height + "px";
				
				var li = pregoCreateElement("LI", div);
				li.style.left = (i * 182) + "px";
				listItems[listItemsIndex++] = li;
				
				// Add the onclick behaviour (zoom in to the bigger image)
				image.large = img.watermark;
				image.targetWidth = img.wmwidth;
				image.targetHeight = img.wmheight;
				image.onclick = function()
				{
					if(!galleryMayZoom)
						return;
				
					var largeImg = document.getElementById(this.id + "-large");
					if(largeImg)
						largeImg.onload();
					else
					{
						var top = container.offsetTop;
						var left = container.parentNode.offsetLeft + this.parentNode.offsetLeft + parseInt(thumbnails.style.marginLeft) + parseInt(this.parentNode.parentNode.style.left);
						
						var loading = pregoCreateElement("DIV");
						loading.style.position = "absolute";
						loading.style.top = top+"px";
						loading.style.left = left+"px";
						loading.style.width = this.offsetWidth + "px";
						loading.style.height = this.offsetHeight + "px";
						loading.style.background = "url('images/loading.gif') 50% 50% no-repeat #000";
						loading.style.opacity = "0.5";
						loading.style.filter = "alpha(opacity=50)";
						document.body.appendChild(loading);
						
						var img = this;
						
						largeImg = document.createElement("IMG");						
						largeImg.onload = function()
						{
							if(loading)
							{
								loading.parentNode.removeChild(loading);
								loading = null;
							}
						
							this.style.display = "block";
							this.style.top = top+"px";
							this.style.left = left+"px";
							this.style.width = img.offsetWidth + "px";
							this.style.height = img.offsetHeight + "px";
							
							var targetWidth = img.targetWidth;
							var targetHeight = img.targetHeight;
							
							var winHeight = window.innerHeight;
							var winWidth = window.innerWidth;
						
							if(targetHeight > winHeight)
							{
								targetHeight = winHeight - 10;
								targetWidth = (img.offsetWidth / img.offsetHeight) * targetHeight;
							}

							if(targetWidth > winWidth)
							{
								targetWidth = winWidth - 10;
								targetHeight = (img.offsetHeight / img.offsetWidth) * targetWidth;
							}
							
							var targetLeft = left - ((targetWidth - img.offsetWidth) / 2);
							if(targetLeft < 5)
								targetLeft = 5;
								
							var targetTop = top - ((targetHeight - img.offsetHeight) / 2);
							if(targetTop < 5)
								targetTop = 5;
							
							var watermarkedImg = this;
							
							var close = pregoCreateElement("A", "x");
							close.style.display = "none";
							close.style.position = "absolute";
							close.style.top = targetTop + "px";
							close.style.left = targetLeft + "px";
							close.style.width = "2em";
							close.style.height = "2em";
							close.style.lineHeight = "2em";
							close.style.textAlign = "center";
							close.style.background = "white";
							close.style.cursor = "pointer";
							close.style.zIndex = "101";
							close.onclick = function()
							{
								this.parentNode.removeChild(this);
							
								try
								{
									var animation =  new YAHOO.util.Anim(watermarkedImg);
									animation.attributes.width = { to: img.offsetWidth }; 
									animation.attributes.height = { to: img.offsetHeight };
									animation.attributes.left = {to: left };
									animation.attributes.top = {to: top };
									animation.duration = 0.75; 
									animation.method = YAHOO.util.Easing.easeOut; 
									animation.onComplete.subscribe(function()
									{
										watermarkedImg.style.display = "none";
										galleryMayZoom = true;
										galleryMayScroll = true;
									});
									animation.animate();
								}
								catch(e)
								{
									watermarkedImg.style.width = img.offsetWidth + "px";
									watermarkedImg.style.height = img.offsetHeight + "px";
									watermarkedImg.style.top = top + "px";
									watermarkedImg.style.left = left + "px";
									watermarkedImg.style.display = "none";
									galleryMayZoom = true;
									galleryMayScroll = true;
								}
							}
							document.body.appendChild(close);
							
							try
							{
								var animation =  new YAHOO.util.Anim(this);
								animation.attributes.width = { to: targetWidth }; 
								animation.attributes.height = { to: targetHeight };
								animation.attributes.left = {to: targetLeft };
								animation.attributes.top = {to: targetTop };
								animation.duration = 0.75; 
								animation.method = YAHOO.util.Easing.easeOut; 
								animation.onComplete.subscribe(function()
								{
									close.style.display = "block";
								});
								animation.animate();
							}
							catch(e)
							{
								this.width = targetWidth + "px";
								this.height = targetHeight + "px";
								this.left = targetLeft + "px";
								this.top = targetTop + "px";
								close.style.display = "block";
							}
							
							galleryMayZoom = false;
							galleryMayScroll = false;
						}
						
						largeImg.src = this.large;
						largeImg.alt = "";
						largeImg.id = this.id + "-large";
						largeImg.style.position = "absolute";
						largeImg.style.left = "-10000px";
						largeImg.style.display = "block";
						largeImg.style.zIndex = "100";
						
						document.body.appendChild(largeImg);
					}
				}
			}
		}
		pregoReplaceChildren(thumbnails, listItems);
	
		galleryThumbnailsLastPage = Math.ceil(listItems.length / 4);
		
		var links = [];
		var linksIndex = 0;
		for(var i = 1; i <= galleryThumbnailsLastPage; i++)
		{
			var l = pregoCreateLink(window.location.href.replace(window.location.hash, '') + '#'+i, i);
			l.stroonPage = i;
			l.onclick = function() {galleryJump(this.stroonPage);}
			links[linksIndex++] = l;
			links[linksIndex++] = ' ';
		}
		pregoReplaceChildren(pageLinks, links);
		
		var page = null;
		
		var regEx = /^#([0-9]+)$/;
		var matches = regEx.exec(window.location.hash);
		if(matches && matches.length == 2)
			page = parseInt(matches[1]);
		
		if(!page)
		{
			regEx = /^\?page=([0-9]+)$/;
			matches = regEx.exec(window.location.search);
			if(matches && matches.length == 2)
				window.location = window.location.href.replace(window.location.search, '') + '#' + matches[1];
		}
		
		if(!page || page > galleryThumbnailsLastPage || page < 1)
			page = 1;
		
		galleryJump(page);
		
		setTimeout('galleryBackCheck()', 500);
	}
	
	function galleryScrollPrev()
	{
		galleryJump(galleryThumbnailsPage - 1);
	}
	
	function galleryScrollNext(pages)
	{
		galleryJump(galleryThumbnailsPage + 1);
	}
	
	function galleryJump(page)
	{
		if(!galleryMayScroll)
			return;
	
		if(page < 1 || page > galleryThumbnailsLastPage)
			return;

		window.location.hash = page;
		//alert(window.location.hash);
		
		galleryThumbnailsPage = page;
	
		var tn = document.getElementById("gallery-thumbnails");
		var prevLink = document.getElementById("gallery-prev-link");
		var nextLink = document.getElementById("gallery-next-link");
		var cp = document.getElementById("gallery-current-page");
		var pageLinks = document.getElementById("gallery-page-links");
		if(!tn || !prevLink || !nextLink || !cp || !pageLinks) 
			return;
		
		prevLink.style.visibility = (page == 1) ? 'hidden' : 'visible';
		nextLink.style.visibility = (page == galleryThumbnailsLastPage) ? 'hidden' : 'visible';
		
		var nextPage = page < galleryThumbnailsLastPage ? (page + 1) : galleryThumbnailsLastPage;
		var link = pregoCreateLink(window.location.href.replace(window.location.hash, '') + '#'+nextPage, page);
		link.onclick = galleryScrollNext;
		pregoReplaceChildren(cp, [link, "/", galleryThumbnailsLastPage]);
			
		var links;
		if(pageLinks && (links = pageLinks.getElementsByTagName("A")))
		{
			for(var l, i = 0; l = links[i]; i++)
			{
				if(i + 1 == galleryThumbnailsPage)
					l.className += ' selected';
				else
					l.className = l.className.replace('selected', '');
			}
		}

		var margin = (page - 1) * -728;
		
		try
		{
			galleryMayZoom = false;
			var myAnim = new YAHOO.util.Anim(tn); 
			myAnim.attributes.marginLeft = { to: margin }; 
			myAnim.duration = 0.5; 
			myAnim.method = YAHOO.util.Easing.easeOut; 
			myAnim.onComplete.subscribe(function() {galleryMayZoom = true;});
			myAnim.animate();
		}
		catch(e)
		{
			tn.style.marginLeft = margin + 'px';
		}
	}
	
	function galleryBackCheck()
	{
		var page = 1;	
		var regEx = /^#([0-9]+)$/;
		var matches = regEx.exec(window.location.hash);
		if(matches && matches.length == 2)
			page = parseInt(matches[1]);
		
		if(galleryThumbnailsPage != page)
			galleryJump(page);
		
		setTimeout('galleryBackCheck()', 500);
	}
	
	
	
	
	// Initialise the gallery when the DOM is loaded (before images are loaded)
	// Uses JQuery
	$(document).ready(galleryInit);