/************************************************************************************************************

	(C) www.dhtmlgoodies.com

	************************************************************************************************************/




	var opacitySpeed = 2;	// Speed of opacity - switching between large images - Lower = faster
	var opacitySteps = 10; 	// Also speed of opacity - Higher = faster
	var slideSpeed = 5;	// Speed of thumbnail slide - Lower = faster
	var slideSteps = 8;	// Also speed of thumbnail slide - Higher = faster
	var columnsOfThumbnails = false;	// Hardcoded number of thumbnail columns, use false if you want the script to figure it out dynamically.

	/* Don't change anything below here */
	var largeImage = false;
	var imageToShow = false;
	var currentOpacity = 100;
	var slideWidth = false;
	var thumbTotalWidth = false;
	var viewableWidth = false;

	var currentUnqiueOpacityId = false;
	var currentActiveImage = false;
	var thumbDiv = false;
	var thumbSlideInProgress = false;

	var browserIsOpera = navigator.userAgent.indexOf('Opera')>=0?true:false;
	var leftArrowObj;
	var rightArrowObj;
	var thumbsColIndex = 1;
	var thumbsLeftPos = false;

	function initGalleryScript()
	{
		leftArrowObj = document.getElementById('leftArrow');
		leftArrowObj.style.visibility='hidden';
		rightArrowObj = document.getElementById('rightArrow');
		leftArrowObj.style.cursor = 'pointer';
		rightArrowObj.style.cursor = 'pointer';
		leftArrowObj.onclick = moveThumbnails;
		rightArrowObj.onclick = moveThumbnails;
		largeImage = document.getElementById('largeImage').getElementsByTagName('IMG')[0];
		var innerDiv = document.getElementById('thumbs_inner');
		slideWidth = innerDiv.getElementsByTagName('DIV')[0].offsetWidth;
		thumbDiv = document.getElementById('thumbs_inner');
		thumbDiv.style.left = '0px';

		var subDivs = thumbDiv.getElementsByTagName('DIV');
		thumbTotalWidth = 0;
		var tmpLeft = 0;
		for(var no=0;no<subDivs.length;no++){
			if(subDivs[no].className=='strip_of_thumbnails'){
				thumbTotalWidth = thumbTotalWidth + slideWidth;
				subDivs[no].style.left = tmpLeft + 'px';
				subDivs[no].style.top = '0px';
				tmpLeft = tmpLeft + subDivs[no].offsetWidth;
			}
		}

		viewableWidth = document.getElementById('thumbs').offsetWidth;


		currentActiveImage = thumbDiv.getElementsByTagName('A')[0].getElementsByTagName('IMG')[0];
		currentActiveImage.className='activeImage';
	}

	function moveThumbnails()
	{
		if(thumbSlideInProgress)return;
		thumbSlideInProgress = true;
		if(this.id=='leftArrow'){
			thumbsColIndex--;
			rightArrowObj.style.visibility='visible';
			if(thumbDiv.style.left.replace('px','')/1>=0){
				leftArrowObj.style.visibility='hidden';
				thumbSlideInProgress = false;
				return;
			}

			slideThumbs(slideSteps,0);

		}else{
			thumbsColIndex++;
			leftArrowObj.style.visibility='visible';
			var left = thumbDiv.style.left.replace('px','')/1;
			var showArrow = true;
			if(thumbTotalWidth + left - slideWidth <= viewableWidth)showArrow = false;
			if(columnsOfThumbnails)showArrow = true;

			if(!showArrow)
			{
				rightArrowObj.style.visibility='hidden';
				thumbSlideInProgress = false;
				return;
			}

			slideThumbs((slideSteps*-1),0);
		}

	}

	function slideThumbs(speed,currentPos)
	{
		var leftPos;
		if(thumbsLeftPos){
			leftPos= thumbsLeftPos;
		}else{
			var leftPos = thumbDiv.style.left.replace('px','')/1;
			thumbsLeftPos = leftPos;
		}
		currentPos = currentPos + Math.abs(speed);
		if(currentPos> slideWidth){
			offset = (currentPos - slideWidth);
			if (speed < 0) {
				leftPos += offset;
			}else{
				leftPos -= offset;
			}
			currentPos = slideWidth;
		}

		var tmpLeftPos = leftPos;
		leftPos = leftPos + speed;
		thumbsLeftPos = leftPos;
		thumbDiv.style.left = leftPos + 'px';
		if (currentPos < slideWidth) {
			setTimeout('slideThumbs(' + speed + ',' + currentPos + ')', slideSpeed);
		}
		else {
			if (tmpLeftPos >= 0 || (columnsOfThumbnails && thumbsColIndex == 1)) {
				document.getElementById('leftArrow').style.visibility = 'hidden';
			}
			var left = tmpLeftPos;
			var showArrow = true;
			if (thumbTotalWidth + left - slideWidth <= viewableWidth)
				showArrow = false;
			if (columnsOfThumbnails) {
				if ((thumbsColIndex + 1) < columnsOfThumbnails)
					showArrow = true;
				else
					showArrow = false;
			}
			if (!showArrow) {
				document.getElementById('rightArrow').style.visibility = 'hidden';
			}
			thumbSlideInProgress = false;
		}

	}

	function showPreview(imagePath,inputObj)
	{
		if(currentActiveImage){
			if(currentActiveImage==inputObj.getElementsByTagName('IMG')[0])return;
			currentActiveImage.className='';
		}
		currentActiveImage = inputObj.getElementsByTagName('IMG')[0];
		currentActiveImage.className='activeImage';

		imageToShow = imagePath;
		var tmpImage = new Image();
		tmpImage.src = imagePath;
		currentUnqiueOpacityId = Math.random();
		moveOpacity(opacitySteps*-1,currentUnqiueOpacityId);
	}

	function setOpacity()
	{
		if(document.all)
		{
			largeImage.style.filter = 'alpha(opacity=' + currentOpacity + ')';
		}else{
			largeImage.style.opacity = currentOpacity/100;
		}
	}
	function moveOpacity(speed,uniqueId)
	{

		if(browserIsOpera){
			largeImage.src = imageToShow;
			return;
		}

		currentOpacity = currentOpacity + speed;
		if(currentOpacity<=5 && speed<0){

			var tmpParent = largeImage.parentNode;
			largeImage.parentNode.removeChild(largeImage);
			largeImage = document.createElement('IMG');
			tmpParent.appendChild(largeImage);
			setOpacity();
			largeImage.src = imageToShow;

			speed=opacitySteps;
		}
		if(currentOpacity>=99 && speed>0)currentOpacity=99;
		setOpacity();
		if(currentOpacity>=99 && speed>0)return;
		if(uniqueId==currentUnqiueOpacityId)setTimeout('moveOpacity(' + speed + ',' + uniqueId + ')',opacitySpeed);
	}