//////////////////////////////////////////////////////////////////////////////////////////////////////////
// javascript images slideshow created by eZoulou.be
//////////////////////////////////////////////////////////////////////////////////////////////////////////
/*
sample code :

launchSlideshow(
	0, 			// the id if the slideshow dom node <div class="slideshow" id="slideshow_0">...</div>
	3000, 			// length of 1 image in milliseconds
	1500, 			// length of a fading in milliseconds
	'autoStart', 		// start type : autoStop - for no auto start - or autoStat or noPlay or time delay in milliseconds 
	'next', 		// action onclick on main image. default : next display image in slideshow, or url or noclick;
	'thumbnails', 		// thumbnails or not? 
	'thumbnailsOpacity', 	// thumbnails opacity effect yes or not? 
	'tools', 		// tools or not? 
	'keyboardNavigation'	// keyboard navigation (arrow, space) or not? 
	'centered'		// centered (vertical & horizontal)?

and then , f_legendTxtStr, f_nextTxtStr, f_prevTxtStr, f_playTxtStr. for writing accesble elements

);

*/

// conf fixed at start of script for each slideshows (each var down now is an array)
var slideshowNode = new Array(); 			// the global slideshow container node <*>
var imageTimeoutLength = new Array();			// speed of slideshow
var transitionTimeoutLength = new Array();		// speed of fading the images
var startType = new Array();				// start type
var thumbYes = new Array();				// slideshow has a thumbnail? 
var thumbnailsOpacityYes = new Array(); 		// effect on thumbnails (transparency) when matching main image
var toolsYes = new Array();				// slideshow has a tools? 
var keyboardNavigationYes;				// [only for a slisdeshow that is unique on the page obviously! ] ability to navigate by typing keyboard : arrows left/right and space
var centeredYes = new Array();				// slideshow images are verticalyCentered? 

// changes during script
var theImage = new Array();				// the image currently showing
var imageTimeout = new Array(); 			// timeout in between images
var transitionTimeout = new Array(); 			// transition timemout
var isPlaying = new Array(); 				// when toggle play/pause.
var isInTransition = new Array(); 			// set to true when we are during the transition
	
// standard configuration
var thumbOpacity = 30;

//////////////////////////////////////////////////////////////////////////////////////////////////////////
// initialize the slideshow itself
//////////////////////////////////////////////////////////////////////////////////////////////////////////
function launchSlideshow(f_slideshowId, f_imageTimeoutLength, f_transitionTimeoutLength, f_startType, f_onclickLink, f_thumbYes, f_thumbnailsOpacityYes, f_toolsYes, f_keyboardNavigationYes, f_centered, f_legendTxtStr, f_nextTxtStr, f_prevTxtStr, f_playTxtStr, f_bottomTxtStr, f_topTxtStr) {

	var slideshowId = f_slideshowId;
	slideshowNode[slideshowId] = document.getElementById('slideshow_'+slideshowId);
	imageTimeoutLength[slideshowId] = f_imageTimeoutLength;
	transitionTimeoutLength[slideshowId] = f_transitionTimeoutLength;
	startType[slideshowId] = f_startType;
	thumbYes[slideshowId] = f_thumbYes;
	thumbnailsOpacityYes[slideshowId] = f_thumbnailsOpacityYes;
	toolsYes[slideshowId] = f_toolsYes;
	keyboardNavigationYes = f_keyboardNavigationYes;
	centeredYes[slideshowId] = f_centered;

	// initialize the image ref
	theImage[slideshowId] = 0;

  // keyboard navigation
  if (keyboardNavigationYes=='keyboardNavigation') document.onkeypress = checkArrows;
	// then we initialize each image one by one
	var imagesNodes = document.getElementsByClassName('scene', slideshowNode[slideshowId])[0].getElementsByTagName('fieldset');
	for(var i=0; i<imagesNodes.length; i++) {
		// styles
		imagesNodes[i].style.display='none';
		imagesNodes[i].getElementsByTagName('legend')[0].style.display='none';
		imagesNodes[i].style.position='absolute';
		
		// onclick on main image
		if (f_onclickLink!='noClick') {
  		imagesNodes[i].getElementsByTagName('img')[0].style.cursor='pointer';
		  // then we add some event functions
  		if (f_onclickLink.indexOf('http://')==0) {
  			imagesNodes[i].getElementsByTagName('img')[0].onclick = function () {
  				window.location=f_onclickLink;
  			}
  		}
      if (f_onclickLink=='next') {
  			imagesNodes[i].getElementsByTagName('img')[0].onclick = function () {
  				nextImage(slideshowId);
  				return false;
  			}
  	   }
	   }
	 }

	/// thumbnail activation if required
	if (thumbYes[slideshowId]=='thumbnails') { 
		var zethumbs = document.getElementsByClassName('thumbnails', slideshowNode[slideshowId])[0].getElementsByTagName('a');
		// sets the events for thumbnail
		if (thumbnailsOpacityYes[slideshowId]=='thumbnailsOpacity') {
			for(var i=0; i<zethumbs.length; i++) {
				zethumbs[i].id = "thumb"+i;
				setOpacity(zethumbs[i].childNodes[0], thumbOpacity);
				zethumbs[i].onmouseover = function () {
					setOpacity(this.childNodes[0], 100);
				}
				zethumbs[i].onmouseout = function () {
					var currImgId = theImage[slideshowId];
					if (this.id!="thumb"+currImgId) {
						setOpacity(this.childNodes[0], thumbOpacity);
					}
				}
			}
		}
		for(var i=0; i<zethumbs.length; i++) {
			zethumbs[i].onclick = function () {
				showImage(slideshowId, parseInt((this.id).substring(5, this.id.length)));
				return false;
			}
		}	
	}

	// tools initialization if requested
	if (toolsYes[slideshowId]=='tools') {
		// creates the navigation
		var navNode = document.createElement('fieldset');
		navNode.className = 'images_navigation';
		var legendNode = document.createElement('legend');
		var legendTxt = document.createTextNode(f_legendTxtStr);
		legendNode.appendChild(legendTxt);
		navNode.appendChild(legendNode);
	
		var prevNode = document.createElement('a');
		prevNode.className = 'previous';
		prevNode.setAttribute('href','javascript:prevImage('+slideshowId+')');
		prevNode.setAttribute('title',f_prevTxtStr);
		var altNode = document.createElement('span');
		altNode.className = 'alternate';
		var altTxt = document.createTextNode(f_prevTxtStr);
		altNode.appendChild(altTxt);
		prevNode.appendChild(altNode);
		navNode.appendChild(prevNode);
	
		if (startType[slideshowId]!='noPlay') {
			var altNode = document.createElement('span');
			altNode.className = 'alternate';
			var altTxt = document.createTextNode(' | ');
			altNode.appendChild(altTxt);
			navNode.appendChild(altNode);
		
			var playNode = document.createElement('a');
			playNode.className = 'play';
			playNode.setAttribute('href','javascript:togglePlay('+slideshowId+')');
			playNode.setAttribute('title',f_playTxtStr);
			var altNode = document.createElement('span');
			altNode.className = 'alternate';
			var altTxt = document.createTextNode(f_playTxtStr);
			altNode.appendChild(altTxt);
			playNode.appendChild(altNode);
			navNode.appendChild(playNode);
		}
	
		var altNode = document.createElement('span');
		altNode.className = 'alternate';
		var altTxt = document.createTextNode(' | ');
		altNode.appendChild(altTxt);
		navNode.appendChild(altNode);
	
		var nextNode = document.createElement('a');
		nextNode.className = 'next';
		nextNode.setAttribute('href','javascript:nextImage('+slideshowId+')');
		nextNode.setAttribute('title',f_nextTxtStr);
		var altNode = document.createElement('span');
		altNode.className = 'alternate';
		var altTxt = document.createTextNode(f_nextTxtStr);
		altNode.appendChild(altTxt);
		nextNode.appendChild(altNode);
		navNode.appendChild(nextNode);
	
		document.getElementsByClassName('tools', slideshowNode[slideshowId])[0].appendChild(navNode);
	
		// creates the legend container
		var legendNode = document.createElement('div');
		legendNode.className = 'legend';
		document.getElementsByClassName('tools', slideshowNode[slideshowId])[0].appendChild(legendNode);
	}


	// start slideshow mode if requested
	var delay = 0;
	if (startType[slideshowId]=="autoStop") {
		isPlaying[slideshowId] = false;
		if (toolsYes[slideshowId]=='tools') document.getElementsByClassName('play', slideshowNode[slideshowId])[0].className = 'pause';
	} else { 
		if (startType[slideshowId]=="noPlay") { 
			isPlaying[slideshowId] = false;
		} else {
			if (startType[slideshowId]!="autoStart") delay = startType[slideshowId];
			isPlaying[slideshowId] = true;
		}
	}
	showImage(slideshowId, 'init', delay);
}

//////////////////////////////////////////////////////////////////////////////////////////////////////////
// player functions
//////////////////////////////////////////////////////////////////////////////////////////////////////////
function showImage(slideshowId, toShowImageId, delay) {
	var imagesNodes = document.getElementsByClassName('scene', slideshowNode[slideshowId])[0].getElementsByTagName('fieldset');
	var slideshowH = document.getElementsByClassName('scene', slideshowNode[slideshowId])[0].offsetHeight;
	var currImgId = theImage[slideshowId];

  if (delay==null) delay=0;

  if (toShowImageId=='init') {
    toShowImageId = 0;
  } else {
    // hideCurrentImage
  	Effect.Fade(imagesNodes[currImgId],{duration:transitionTimeoutLength[slideshowId]/1000, limit:1});
  	// re-initialize thumbnail image
  	if (thumbYes[slideshowId]=='thumbnails' && thumbnailsOpacityYes[slideshowId]=='thumbnailsOpacity') { 
  		var zethumbs = document.getElementsByClassName('thumbnails', slideshowNode[slideshowId])[0].getElementsByTagName('a');
  		setOpacity(zethumbs[currImgId].childNodes[0], thumbOpacity);
  	}
  }
	// set current image
	theImage[slideshowId] = toShowImageId;
	currImgId = toShowImageId;
  // init
	isInTransition[slideshowId] = true;
	// show image
	Effect.Appear(imagesNodes[currImgId],{duration:transitionTimeoutLength[slideshowId]/1000, limit:1});
	transitionTimeout[slideshowId] = window.setTimeout("clearTransition("+slideshowId+")",transitionTimeoutLength[slideshowId]);
	// place image
	var imgH = imagesNodes[currImgId].getElementsByTagName('img')[0].height;
	if (centeredYes[slideshowId]=='centered') {
	  imagesNodes[currImgId].style.textAlign = 'center';
  	if (imgH>0 && slideshowH/2-imgH/2>0) {
      imagesNodes[currImgId].style.top=slideshowH/2-imgH/2 + 'px';
    }
    else imagesNodes[currImgId].style.top = 0;
  }
	// highlight current thumbnail image
	if (thumbYes[slideshowId]=='thumbnails' && thumbnailsOpacityYes[slideshowId]=='thumbnailsOpacity') { 
		var zethumbs = document.getElementsByClassName('thumbnails', slideshowNode[slideshowId])[0].getElementsByTagName('a');
		setOpacity(zethumbs[currImgId].childNodes[0], 100);
	}
	// display current legend
	if (toolsYes[slideshowId]=='tools') setLegend(slideshowId, currImgId);
	// set timeout for next image
	if (isPlaying[slideshowId]) imageTimeout[slideshowId] = window.setTimeout("nextImage("+slideshowId+")",imageTimeoutLength[slideshowId]+transitionTimeoutLength[slideshowId]+delay);

}
function nextImage(slideshowId) {
	var imagesNodes = document.getElementsByClassName('scene', slideshowNode[slideshowId])[0].getElementsByTagName('fieldset');
	var imagesNbr = imagesNodes.length-1;
	var currImgId = theImage[slideshowId];

  // clear current timeouts
 	clearTransition(slideshowId);
	clearImage(slideshowId, currImgId);
	// set new image
  if (currImgId>=imagesNbr) {
		showImage(slideshowId, 0);
	} else {
		showImage(slideshowId, currImgId+1);
	}
}
function prevImage(slideshowId) {
	var imagesNodes = document.getElementsByClassName('scene', slideshowNode[slideshowId])[0].getElementsByTagName('fieldset');
	var imagesNbr = imagesNodes.length-1;
	var currImgId = theImage[slideshowId];

  // clear current timeouts
	clearTransition(slideshowId);
	clearImage(slideshowId, currImgId);
	// set new image
	if (currImgId<=0) {
		showImage(slideshowId, imagesNbr);
	} else {
		showImage(slideshowId, currImgId-1);
	}
}
function togglePlay(slideshowId) {
	var currImgId = theImage[slideshowId];
	clearImage(slideshowId, currImgId);
	if (isPlaying[slideshowId]) {
		isPlaying[slideshowId] = false;
		if (toolsYes[slideshowId]=='tools' && startType[slideshowId]!='noPlay') document.getElementsByClassName('play', slideshowNode[slideshowId])[0].className = 'pause';
	} else {
		isPlaying[slideshowId] = true;
		imageTimeout[slideshowId] = window.setTimeout("nextImage("+slideshowId+")",transitionTimeoutLength[slideshowId]/4);
		if (toolsYes[slideshowId]=='tools' && startType[slideshowId]!='noPlay') document.getElementsByClassName('pause', slideshowNode[slideshowId])[0].className = 'play';
	}
}
function clearImage(slideshowId, toClearImageId) {
	var imagesNodes = document.getElementsByClassName('scene', slideshowNode[slideshowId])[0].getElementsByTagName('fieldset');
	if (isPlaying[slideshowId]) window.clearTimeout(imageTimeout[slideshowId]);
}
function clearTransition(slideshowId) {
	isInTransition[slideshowId] = false;
	if (isInTransition[slideshowId]) window.clearTimeout(transitionTimeout[slideshowId]);
}
function setLegend(slideshowId, imgNbr) {
	var imagesNodes = document.getElementsByClassName('scene', slideshowNode[slideshowId])[0].getElementsByTagName('fieldset');

	var legendTxtStr = "";
	var imageNode = imagesNodes[imgNbr].getElementsByTagName('img')[0];
	for( var x = 0; x < imageNode.attributes.length; x++ ) {
		if( imageNode.attributes[x].nodeName.toLowerCase() == 'title' ) legendTxtStr = imageNode.attributes[x].nodeValue;
	}
	var legendTxt = document.createTextNode(legendTxtStr);
	var legendNode = document.getElementsByClassName('legend', slideshowNode[slideshowId])[0];
	if (legendNode && legendNode.hasChildNodes()) legendNode.removeChild(legendNode.lastChild);
	legendNode.appendChild(legendTxt);
}
function setOpacity(obj, opacity) {
  opacity = (opacity == 100)?99.999:opacity;
  // IE/Win
  obj.style.filter = "alpha(opacity:"+opacity+")";
  // Safari<1.2, Konqueror
  obj.style.KHTMLOpacity = opacity/100;
  // Older Mozilla and Firefox
  obj.style.MozOpacity = opacity/100;
  // Safari 1.2, newer Firefox and Mozilla, CSS3
  obj.style.opacity = opacity/100;
}
function checkArrows (evt) {
	var zeSlideshowId = 0;
	var keyCode = null;
	var keyCode = 
	document.layers ? evt.which :
	document.all ? window.event.keyCode :
	document.getElementById ? evt.keyCode : 0;
	if (keyCode == 39) nextImage(zeSlideshowId);
	else if (keyCode == 37) prevImage(zeSlideshowId);
	else if (startType[zeSlideshowId]!='noPlay' && (keyCode == 0 ||  keyCode == 32)) togglePlay(zeSlideshowId);
}