/************************************************************************************************************
	(C) www.dhtmlgoodies.com, June 2006
	This is a script from www.dhtmlgoodies.com. You will find this and a lot of other scripts at our website.	
	Terms of use:
	You are free to use this script as long as the copyright message is kept intact. However, you may not
	redistribute, sell or repost it without our permission.
	Thank you!
	www.dhtmlgoodies.com
	Alf Magne Kalleland
	************************************************************************************************************/	

	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 = 5;	// Hardcoded number of thumbnail columns, use false if you want the script to figure it out dynamically.

		var colNumber = Math.ceil(21/3); 
		var columnsOfThumbnails = colNumber; 
		// alert(colNumber+' '+'piccount: '+13);
	
	/* 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=='thumbstrip'){
				thumbTotalWidth = thumbTotalWidth + slideWidth;
			
				subDivs[no].style.left = tmpLeft + 'px';
				subDivs[no].style.top = '0px';
				tmpLeft = tmpLeft + subDivs[no].offsetWidth + 2; // this is a weird fix. not sure why it works
			}
		}

		viewableWidth = document.getElementById('thumbs').offsetWidth;
	
		
		
		currentActiveImage = thumbDiv.getElementsByTagName('A')[0].getElementsByTagName('IMG')[0];
		currentActiveImage.className='activethumb';
		
		// =md=
		// set inital caption
		currentActiveImage = thumbDiv.getElementsByTagName('A')[0].getElementsByTagName('IMG')[0];
		var firstCaption = currentActiveImage.getAttribute('alt');
		changeText('galdesc',firstCaption);
		// end =md=
		
	}
	
	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);		
		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='activethumb';
		
		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);		
	}

function changeText( div2show, text ) {
    // Detect Browser
    var IE = (document.all) ? 1 : 0;
    var DOM = 0; 
    if (parseInt(navigator.appVersion) >=5) {DOM=1};

    // Grab the content from the requested "div" and show it in the "container"
    if (DOM) {
        var viewer = document.getElementById(div2show);
        viewer.innerHTML = text;
    }  else if(IE) {
        document.all[div2show].innerHTML = text;
    }
}

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

// addLoadEvent(css_init);
addLoadEvent(initGalleryScript);



var galthumbAction = {
		'div.thumbstrip a' : function(element){
			element.onclick = function(){

			var theBigPicture = this.href; // onclick="showPreview('images/image1_big.jpg',this);return false;"
			var picCaption = this.alt;
			
			var image = this.getElementsByTagName('IMG')[0];
			var picCaption = image.getAttribute('alt');
			
			// alert('bigpic: '+theBigPicture+'\n'+'caption: '+picCaption); return false;
			changeText('galdesc',picCaption);	
			showPreview(theBigPicture,this); return false;		
			}
		}
		
	};
Behaviour.register(galthumbAction);