/***********************************************************************************************
	
	Copyright (c) 2005 - Alf Magne Kalleland post@dhtmlgoodies.com
	
	UPDATE LOG:
	
	March, 10th, 2006 : Added support for a message while large image is loading
	
	Get this and other scripts at www.dhtmlgoodies.com
	
	You can use this script freely as long as this copyright message is kept intact.
	
	***********************************************************************************************/ 
   	
	var displayWaitMessage = true;	// Display a please wait message while images are loading?
  	
	var cImageIndex = 1;
	var ssImages = null;
	var lastImageLoaded = null;
	
	var currentOpacity = 0;
	var fadeoutTime = 20;
	var objfadeout = null;
	var objfadein = null;
	var lastThumb = null;
	var fadeOutEnabled = false;
	
	var activeImage = false;
	var imageGalleryLeftPos = false;
	var imageGalleryWidth = false;
	var imageGalleryObj = false;
	var maxGalleryXPos = false;
	var slideSpeed = 0;
	var imageGalleryCaptions = new Array();

	var subImages = null;

	var slideshowImages = null;
	var temp = null;

	function RunFadeOutIn() {
	    if( fadeOutEnabled ) {
		currentOpacity -= 1;
	        if( document.all ) {
	    	    objfadein.style.filter = 'alpha(opacity='+(100-currentOpacity)+')';
	    	    objfadeout.style.filter = 'alpha(opacity='+currentOpacity+')';
		} else {
		    // Can't use 1 and 0 because of screen flickering in FF
		    objfadein.style.opacity = Math.min(0.99,(1 - (currentOpacity/100)));
		    objfadeout.style.opacity = Math.max(0.01,currentOpacity/100);	
		}
		if( currentOpacity > 0 ) {
		    setTimeout('RunFadeOutIn()',fadeoutTime);
		} else {
		    fadeOutEnabled = false;
		}
	    }
	}

	function nextImage() {
	    if(cImageIndex < ssImages.length) {
		cImageIndex++;	    
	    }
	    if(cImageIndex == ssImages.length) {
		document.getElementById('arrow_right_img').src = '/templates/slideshow/images/arrow_right.gif';
		document.getElementById('arrow_right').style.cursor = 'inherit';
		document.getElementById('arrow_right').onclick = '';
	    }
	    if( ssImages.length > 1 && cImageIndex > 1 ) {
		document.getElementById('arrow_left_img').src = '/templates/slideshow/images/arrow_left_over.gif';
		document.getElementById('arrow_left').style.cursor = 'pointer';
		document.getElementById('arrow_left').onclick = prevImage;
	    }
	    
	    if( lastThumb )
	        lastThumb.style.border = '3px solid #FFF';
	    slideshowImages[cImageIndex-1].style.border = '3px solid gray';
	    lastThumb = slideshowImages[cImageIndex-1];

	    if ( cImageIndex > 3 )
		shiftSlide(-45);
		
	    showPreview(ssImages[cImageIndex-1],cImageIndex);	    
	}

	function prevImage() {
	    if(cImageIndex > 1) {
		cImageIndex--;	    
	    }
	    if(cImageIndex == 1) {
		document.getElementById('arrow_left_img').src = '/templates/slideshow/images/arrow_left.gif';
		document.getElementById('arrow_left').style.cursor = 'inherit';
		document.getElementById('arrow_left').onclick = '';
	    }
	    if( ssImages.length > 1 && cImageIndex < ssImages.length) {
		document.getElementById('arrow_right_img').src = '/templates/slideshow/images/arrow_right_over.gif';
		document.getElementById('arrow_right').style.cursor = 'pointer';
		document.getElementById('arrow_right').onclick = nextImage;
	    }

	    if( lastThumb )
	        lastThumb.style.border = '3px solid #FFF';
	    slideshowImages[cImageIndex-1].style.border = '3px solid gray';
	    lastThumb = slideshowImages[cImageIndex-1];

	    
	    if ( cImageIndex < ssImages.length - 2 )
		shiftSlide(45);
	    
	    showPreview(ssImages[cImageIndex-1],cImageIndex);
	}

	function validateThumbs(index) {
	    cImageIndex = index;
	    if(cImageIndex == 1) {
		document.getElementById('arrow_left_img').src = '/templates/slideshow/images/arrow_left.gif';
		document.getElementById('arrow_left').style.cursor = 'inherit';
		document.getElementById('arrow_left').onclick = '';
	    }
	    if( ssImages.length > 1 && cImageIndex < ssImages.length) {
		document.getElementById('arrow_right_img').src = '/templates/slideshow/images/arrow_right_over.gif';
		document.getElementById('arrow_right').style.cursor = 'pointer';
		document.getElementById('arrow_right').onclick = nextImage;
	    }	    
	    if(cImageIndex == ssImages.length) {
		document.getElementById('arrow_right_img').src = '/templates/slideshow/images/arrow_right.gif';
		document.getElementById('arrow_right').style.cursor = 'inherit';
		document.getElementById('arrow_right').onclick = '';
	    }
	    if( ssImages.length > 1 && cImageIndex > 1 ) {
		document.getElementById('arrow_left_img').src = '/templates/slideshow/images/arrow_left_over.gif';
		document.getElementById('arrow_left').style.cursor = 'pointer';
		document.getElementById('arrow_left').onclick = prevImage;
	    }
	}

	function startSlide(e)
	{
		if(this.id=='arrow_right'){
			slideSpeedMultiply = Math.floor((e.clientX - this.offsetLeft) / 10);
			slideSpeed = -1*slideSpeedMultiply;
			slideSpeed = Math.max(-10,slideSpeed);
		}else{			
			slideSpeedMultiply = 10 - Math.floor((e.clientX - this.offsetLeft) / 10);
			slideSpeed = 1*slideSpeedMultiply;
			slideSpeed = Math.min(10,slideSpeed);
			if(slideSpeed<0)slideSpeed=10;
		}
	}
	
	function releaseSlide()
	{
		var id = this.id;
		this.getElementsByTagName('IMG')[0].src = '/templates/slideshow/images/' + this.id + '.gif';
		slideSpeed=0;
	}
		
	function gallerySlide()
	{
		if(slideSpeed!=0){
			var leftPos = imageGalleryObj.offsetLeft;
			leftPos = leftPos/1 + slideSpeed;
			if(leftPos>maxGalleryXPos){
				leftPos = maxGalleryXPos;
				slideSpeed = 0;
				
			}
			if(leftPos<minGalleryXPos){
				leftPos = minGalleryXPos;
				slideSpeed=0;
			}
			
			imageGalleryObj.style.left = leftPos + 'px';
		}
		setTimeout('gallerySlide()',20);
		
	}
	
	function showImage()
	{
		if (activeImage) {
			/*
			activeImage.style.filter = 'alpha(opacity=50)';	
			activeImage.style.opacity = 0.5;
			*/
			// activeImage.style.border = '1px solid #F00';
		}
		/*
		this.style.filter = 'alpha(opacity=100)';
		this.style.opacity = 1;	
		*/
		activeImage = this;	
	}
	
	function initSlideShow()
	{
		/*
		document.getElementById('arrow_left').onmousemove = startSlide;
		document.getElementById('arrow_left').onmouseout = releaseSlide;
		document.getElementById('arrow_right').onmousemove = startSlide;
		document.getElementById('arrow_right').onmouseout = releaseSlide;
		document.getElementById('arrow_left').onclick = prevImage;
		*/
		document.getElementById('arrow_right').onclick = nextImage;
		
		imageGalleryObj = document.getElementById('theImages');
		imageGalleryLeftPos = imageGalleryObj.offsetLeft;
		imageGalleryWidth = document.getElementById('galleryContainer').offsetWidth - 40;
		maxGalleryXPos = imageGalleryObj.offsetLeft; 
		minGalleryXPos = imageGalleryWidth - document.getElementById('slideEnd').offsetLeft + 20;
		// alert(imageGalleryWidth +"-"+ document.getElementById('slideEnd').offsetLeft);		
		
		slideshowImages = imageGalleryObj.getElementsByTagName('IMG');
		for(var no=0;no<slideshowImages.length;no++){
			slideshowImages[no].onmouseover = showImage;
		}
		
		var divs = imageGalleryObj.getElementsByTagName('DIV');
		for(var no=0;no<divs.length;no++){
			if(divs[no].className=='imageCaption')imageGalleryCaptions[imageGalleryCaptions.length] = divs[no].innerHTML;
		}
		// gallerySlide();

		validateThumbs(cImageIndex);

		slideshowImages[cImageIndex-1].style.border = '3px solid gray';
		lastThumb = slideshowImages[cImageIndex-1];
		
		// document.addEventListener('keypress', cancel, false);
	}
	
	function showPreview(imagePath,imageIndex,eobj) {
	    //if(!fadeOutEnabled) {
		fadeOutEnabled = false;
		validateThumbs(imageIndex);

		if( eobj ) {
		    if( lastThumb )
			lastThumb.style.border = '3px solid #FFF';
		    thumb = eobj.getElementsByTagName('IMG')[0];
		    thumb.style.border = '3px solid gray';
		    lastThumb = thumb;
		}

		subImages = document.getElementById('previewPane').getElementsByTagName('IMG');
		img = subImages[1];
		temp = img;
		
		currentOpacity = 100;

		objfadeout = document.getElementById('fade_out');
		objfadein = document.getElementById('fade_in');
	    
		if( document.all ) {	
		    // IE rules
		    objfadein.style.filter = 'alpha(opacity=1)';
		    objfadeout.style.filter = 'alpha(opacity=100)';
		} else {
		    // Can't use 1 and 0 because of screen flickering in FF
		    objfadein.style.opacity = 0.01;
		    objfadeout.style.opacity = 0.99;
		}

		subImages[0].src = temp.src;	
		// subImages[0].onload = function() {}
	
		if(displayWaitMessage) {
			document.getElementById('waitMessage').style.display='inline';
		}
		document.getElementById('largeImageCaption').style.display='none';
		img.src = imagePath;
		img.onload = function() { 
		    //subImages[0].src = temp.src;	
		    hideWaitMessageAndShowCaption(imageIndex-1); 
		    fadeOutEnabled = true;
		    setTimeout('RunFadeOutIn()',fadeoutTime);
		};
	    //}
	}

	function hideWaitMessageAndShowCaption(imageIndex)
	{
		document.getElementById('waitMessage').style.display='none';
		document.getElementById('largeImageCaption').innerHTML = imageGalleryCaptions[imageIndex];
		document.getElementById('largeImageCaption').style.display='block';
	}
	
	function shiftSlide(offset) {
	    if( ssImages.length > 5 ) {
		var leftPos = imageGalleryObj.offsetLeft;
		leftPos = leftPos/1 + offset;
		if(leftPos > maxGalleryXPos) {
		    leftPos = maxGalleryXPos;
		}
		if(leftPos < minGalleryXPos) {
		    leftPos = minGalleryXPos;
		}
		imageGalleryObj.style.left = leftPos + 'px';
	    }
	}
	/*
	function cancel(evt)
	{
	    evt = ( evt || window.event );
    	    key = ( evt.keyCode || evt.charCode || evt.which || 0 );
	    if ( key == 3 || key == 9 || key == 13 ) {
		evt.preventDefault();
		evt.stopPropagation();
	    }
	}
	*/
	
	window.onload = initSlideShow;