// JavaScript Document

// gallery code

// globals
var IDs = []
var thumbs = [];
var links = [];

var fixedLinks=[];

var numItems=0;
var numLoaded=0;
var jumpCount=0;
var progressOffset=0;
var jump=0;
var bProgressBarFading=false;

imgObject = [];

var bLightBoxVisible=false;

var loadingImage;
var curDisplayIdx=0;

// image dimensions to avoid caching problem
var imgW = [];
var imgH = [];
var loadingIdx=-1;


// preload loading image
var pi = new Image;
pi.src = "images/layout/loading.gif";


$(document).ready(function(){	
	
	if (numItems>0)
	{
		var h = ($("div#contentContent").width() / 156);
		h = (numItems / h)*156;
		$("div#mainContainer").css("height", (h+270)+"px");
		$("div#sideMainBar").css("height", h+100+"px");
	}
	
	// set lightbox divs
	$("div#lightbox").css( { opacity: "0.0" });
	$("img#LightImg").css( { opacity: "0.0" });
	
	$("div[id^='LB']").mouseenter(function(){
		$(this).css("opacity", "1.0");
	}).mouseleave(function(){
		$(this).css("opacity", "0.5");
	}).css("opacity", "0.35");
	
	// check for url vars
	var urlVars = getURLVars();
	if (urlVars['showpic']!=undefined)
	{
		ShowURLPic(urlVars['showpic']);
	}
	
	// prepare the progress bar
	jump = parseInt(numItems/5.0);
});


function DisplayNextThumb()
{	
	// starts the next randomly seelcted thumb thumb scaling/fading in
	
	// 1) select thumb randomly
		// if not ready, set short timeout
	var idx = parseInt(Math.random() * numItems);
	if (!imgObject[idx].complete)
	{
		setTimeout("DisplayNextThumb();", 50);
		return;
	}
	
	
	// 2) copy vars from arrays
	var obj = $("img[id='"+IDs[idx]+"']");
	obj.attr("src", thumbs[idx]);
	
	// 3) remove elements from arrays by last-element swapping
	numItems--;
	thumbs[idx] = thumbs[numItems];
	links[idx] = links[numItems];
	IDs[idx] = IDs[numItems];
	imgObject[idx] = imgObject[numItems];
	
	// 4) set size and opacity of thumb divs/images, plus start animation/fading
	FadeNextThumb(obj);
	
	// set timer for next thumb
	if (numItems>0)
		setTimeout("DisplayNextThumb();", 200);
}

function FadeNextThumb(obj)
{
	if (/MSIE 6/.test(navigator.userAgent)) // test for IE6
	{
		// IE6 can't handle the scaling divs downwards (layout issue), so just fade in
		UpdateProgress();
		obj.css( { cursor: "pointer", opacity: "1.0", width: "150px", height: "150px" } ).mouseenter(function(){
					if ($(this).css("opacity")>0.975)
						$(this).css("opacity", "0.5");
				}).mouseleave(function(){
					if ($(this).css("opacity")==0.5)
						$(this).css("opacity", "1.0");							
				});
	}
	else
	{
		setTimeout("UpdateProgress();", 400);
		obj.parent().parent().css("background-image", "none");
		obj.css( { width: "250px", height: "250px", opacity: "0.0", } ).
				animate( { width: "150px", height: "150px", left: "0px", top: "0px", opacity: "1.0" }, 400).
				css( { cursor: "pointer", backgroundImage: "none" } ).mouseenter(function(){
					if ($(this).css("opacity")>0.975)
						$(this).css("opacity", "0.5");
				}).mouseleave(function(){
					if ($(this).css("opacity")==0.5)
						$(this).css("opacity", "1.0");
				});
	}
}

function SetGalleryImages()
{		
	for (var i=0; i!=numItems; i++)
	{
		imgObject[i] = new Image();
		imgObject[i].src = thumbs[i];
	}
	
	setTimeout("DisplayNextThumb();", 1000);
}

function OpenLightBox()
{
	
	$("div#lightbox").stop().css("left", "-110px").animate({ opacity: "1.0", height: "150px", width: "300px" }, 500);
	bLightBoxVisible=true;
	
}

function PreloadImage(img)
{
	var idx = loadingIdx;

	loadingImage = new Image();
	loadingImage.src = img;
	if (loadingImage.complete)
		ImageLoaded();
	else
	{
		$(loadingImage).load(function(){
			ImageLoaded();
		});
	}
}

function ImageLoaded()
{
	var idx = loadingIdx;
	if (imgH[idx] == undefined)
	{
		imgH[idx] = loadingImage.height;
		imgW[idx] = loadingImage.width;
	}
	$("div#lightbox").css("background-position", "50% 50%").stop().css("background-image", "url("+loadingImage.src+")").
					animate( { opacity: "1.0", width: imgW[idx]+40+"px", height: imgH[idx]+40+"px",
						left: "-"+parseInt(imgW[idx]/2)-40+"px"}, 250 );
	delete loadingImage;
}


function ActivateThumb(idx)
{
	//open the lightbox, display the appropriate image stored in links[]
	if (!bLightBoxVisible)
	{
		OpenLightBox();
	}
	$("div#lightbox").css("background-image", "url(images/layout/loading.gif)").css("background-position", "50% 5%");
	loadingIdx = idx;
	PreloadImage(fixedLinks[idx]);
	curDisplayIdx = idx;
	window.location = "#";
	return false;
}

function LightBoxClose()
{
	bLightBoxVisible=false;
	$("div#lightbox").stop().animate({ opacity: "0.0", height: "0px"}, 500);
}

function LightBoxNext()
{
	curDisplayIdx++;
	if (curDisplayIdx >= totalItems)
		curDisplayIdx = 0;
	ActivateThumb(curDisplayIdx);
}


function LightBoxPrev()
{
	curDisplayIdx--;
	if (curDisplayIdx < 0)
		curDisplayIdx = totalItems-1;
	ActivateThumb(curDisplayIdx);
}

// gets vars and returns an array
function getURLVars() {
      var map = {};
      var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
      		map[key] = value;
      });
      return map;
}

function ShowURLPic(src)
{
	var idx = -1;
	var str;
	var name = src.substr(src.lastIndexOf("/")+1).toLowerCase();
	var pos = name.indexOf("#");
	if (pos!=-1)
	{
		name = name.substr(0,pos); // remove bookmarks from url
	}
	for (var i=0; i!=totalItems; i++)
	{
		str = fixedLinks[i];
		str = str.substr(str.lastIndexOf("/")+1).toLowerCase();
		if (str == name)
		{
			idx = i;
			break;
		}
	}
	if (idx>=0)
	{
		ActivateThumb(idx);
	}
}

function UpdateProgress()
{
	numLoaded++;
	jumpCount++;
	if (jumpCount>=jump)
	{
		jumpCount=0;
		if (progressOffset>-450)
		{
			progressOffset-=100;
			$("div#loadingBar").css("background-position", "0px "+progressOffset+"px");
		}
	}
	if (numLoaded>=totalItems && !bProgressBarFading)
	{
		jump=5000;
		bProgressBarFading=true;
		$("div#loadingBar").stop().fadeOut(1000, function(){ $(this).hide(); } );
	}
}

