// initialise
function slideshowInit( ) {
// variable init
// convert to true integer
var configSplit = slideshowConfig.split(',');
var slideWidth = parseInt(configSplit[0]);
var slideHeight = parseInt(configSplit[1]);
var slideSpeed = parseInt(configSplit[2]);
var slideTime = parseInt(configSplit[3]);
// convert to true boolean
var autoplay = configSplit[4]; if( autoplay == "true" ) { autoplay = true; } else { autoplay = false; }
var displayCaption = configSplit[5]; if( displayCaption == "true" ) { displayCaption = true; } else { displayCaption = false; }
// text
var captionStyle = configSplit[6];
var navStyle = configSplit[7];
var transitionStyle = configSplit[8];
// if( !transitionStyle ){ transitionStyle = 'SLIDE'; }

var thumbWidth = 60;
var thumbHeight = 40;
var numSlides = 0;
var currentSlide = 1;
var navHTML = '';
var navHTMLPrev = '';
var navHTMLNext = '';
var navHTMLGoStop = '';

	// set slidshow wrapper and slide wrapper height and width.
	$('.slideshowWrap' ).css( 'height', slideHeight ).css( 'width', slideWidth );
	$('.slideWrap').css( 'height', slideHeight ).css( 'width', slideWidth );
	
	// get slidewrap, add ID + navigation buttons, get total slides.
	switch ( navStyle ){
		case 'IMAGE':
			navHTMLPrev = '<a href="#" class="btnImgNavStep" id="btnPrev"><img src="iconPREV.png" /></a>';
			navHTMLNext = '<a href="#" class="btnImgNavStep" id="btnNext"><img src="iconNEXT.png" /></a>';
			navHTMLGoStop = '<a href="#" class="btnImgNavStep" id="btnGoStop"><img src="iconGO.png" /></a>';
			goHTML = '<img src="iconGO.png" />';
			stopHTML = '<img src="iconSTOP.png" />';
			break;
		case 'TEXT':
			navHTMLPrev = '<a href="#" class="btnNavStep" id="btnPrev">PREV</a>';
			navHTMLNext = '<a href="#" class="btnNavStep" id="btnNext">NEXT</a>';
			navHTMLGoStop = '<a href="#" class="btnNavStep" id="btnGoStop">PLAY</a>';
			goHTML = 'PLAY';
			stopHTML = 'STOP';
			break;
		case 'EXTERNAL':
			var navButtonArray = $('.btnExtNav');
			var navHTML = '';
			navHTMLPrev = '<a href="#" class="btnImgNavStep" id="btnPrev"><img src="iconPREV.png" /></a>';
			navHTMLNext = '<a href="#" class="btnImgNavStep" id="btnNext"><img src="iconNEXT.png" /></a>';
			navHTMLGoStop = '<a href="#" class="btnImgNavStep" id="btnGoStop"><img src="iconGO.png" /></a>';
			goHTML = '<img src="iconGO.png" />';
			stopHTML = '<img src="iconSTOP.png" />';
			break;
	}
	
	$('.slideWrap').each( function() {
		numSlides++;
		$(this).attr('id', 'slide-' + numSlides );
		if( displayCaption ) {
			captionHead = $(this).find('img').attr('alt');
			captionBody = $(this).find('img').attr('title');
			switch ( captionStyle ) {
				case 'TITLE': 
					$(this).append( '<div id="slideCaption" class="slideCaption"><p class="slideP">' + captionBody + '</p></div>' );
					break;
				case 'ALT':
					$(this).append( '<div id="slideCaption" class="slideCaption"><h3 class="slideH3">' + captionHead + '</h3></div>' );
					break;
				case 'ALTandTITLE':
					$(this).append( '<div id="slideCaption" class="slideCaption"><h3 class="slideH3">' + captionHead + '</h3><p class="slideP">' + captionBody + '</p></div>' );
					break;
				case 'CONTENT':
					$('.slideBodyContent').css( 'display', 'block' );
					break;
				case 'NONE':
					break;
			}
		}
		
		// build navigation
		switch ( navStyle ) {
			case 'IMAGE':
				// build image nav.
				var imgSource = $(this).find('img').attr('src');
				navHTML = navHTML + '<a href="#" class="imgNav" id="btnImg-' + numSlides + '" rel="' + numSlides + '"><img src="' + imgSource + '" width="' + thumbWidth + '" height="' + thumbHeight + '" /></a>';
				break;
			case 'TEXT':
				// build text nav.
				navHTML = navHTML + '<a href="#" class="btnNav" id="btn-' + numSlides + '" rel="' + numSlides + '">' + numSlides + '</a>';
				break;
			case 'EXTERNAL':
				//$(navButtonArray[numSlides-1]).attr( 'id', 'btnExt-' + numSlides ); //.attr( 'rel', numSlides ).attr( 'href', '#' );
				break;
			}
		
		if( numSlides > 1 ) {  // shift all slides after number 1 out of bounds or display none for fade option.
			switch ( transitionStyle ) {
				case 'SLIDE':
					$(this).css( 'left', slideWidth );
					break;
				case 'FADE':
					$(this).css( 'display', 'none' );
					break;
			}
		}
	} );
	
	// put navigation buttons into div and set current slide.
	$('#slideshowNav').html( navHTMLGoStop + navHTMLPrev + navHTML + navHTMLNext );
	$('#slideshowNav').css( 'width', slideWidth );
	if( navStyle == 'IMAGE' ){
		$('.imgNav').css( 'height', thumbHeight );
		$('.imgNav').css( 'width', thumbWidth );
	}
	
	$('#btn-' + currentSlide).addClass( 'currentSlide' );
	
	// set position of navigation
	var navHeight = document.getElementById('slideshowNav').clientHeight;
	if ( navStyle == 'EXTERNAL' ) { navHeight = '18'; }
	$('#slideshowNav').css( 'top', slideHeight - navHeight );
	
	// if caption display and not 'bodycontent' position caption.
	if( displayCaption && !(captionStyle == 'NONE') ){
		var captionHeight = document.getElementById('slideCaption').clientHeight;
		$('.slideCaption').css( 'top', ( slideHeight - navHeight - captionHeight ) );
	}
	
	// if autoplay is on set timer and doslide/fade forward.
	if( autoplay ) {
		var play = true;
		$('#btnGoStop').html( stopHTML );
		slideIntervalID = window.setInterval( function() {
			currentSlide = doTransition( 'forward', slideWidth, slideSpeed, currentSlide, numSlides, transitionStyle );
		}, slideTime );
	}
	
	// nav button click function. goto slide and stop timer.
	switch ( navStyle ) {
		case 'TEXT':
			$('.btnNav').each( function(){
				$(this).bind( 'click', function() {
					slideID = parseInt($(this).attr( 'rel' ));
					if( !(slideID == currentSlide) ){ currentSlide = doTransition( 'goto', slideWidth, slideSpeed, currentSlide, numSlides, transitionStyle ); }
					if( play ){	$('#btnGoStop').html( goHTML ); clearInterval( slideIntervalID ); play = false;	}
					return false;
				} );
			} );
			break;
		case 'IMAGE':
			$('.imgNav').each( function(){
				$(this).bind( 'click', function() {
					slideID = parseInt($(this).attr( 'rel' ));
					if( !(slideID == currentSlide) ){ currentSlide = doTransition( 'goto', slideWidth, slideSpeed, currentSlide, numSlides, transitionStyle ); }
					if( play ){	$('#btnGoStop').html( goHTML );	clearInterval( slideIntervalID ); play = false;	}
					return false;
				} );
			} );
			break;
		case 'EXTERNAL':
			$('.btnExtNav').each( function(){
				$(this).bind( 'click', function() {
					slideID = parseInt($(this).attr( 'rel' ));
					if( !(slideID == currentSlide) ){ currentSlide = doTransition( 'goto', slideWidth, slideSpeed, currentSlide, numSlides, transitionStyle ); }
					if( play ){	$('#btnGoStop').html( goHTML ); clearInterval( slideIntervalID ); play = false;	}
					return false;
				} );
			} );
			break;
	}
	
	// next button click function and stop slideshow
	$('#btnNext').bind( 'click', function() {
		if( play ){	$('#btnGoStop').html( goHTML );	clearInterval( slideIntervalID ); play = false;	}
		currentSlide = doTransition( 'forward', slideWidth, slideSpeed, currentSlide, numSlides, transitionStyle );
		return false;
	} );
	
	// previous button click function and stop slideshow
	$('#btnPrev').bind( 'click', function() {
		if( play ){	$('#btnGoStop').html( goHTML );	clearInterval( slideIntervalID ); play = false;	}
		currentSlide = doTransition( 'backward', slideWidth, slideSpeed, currentSlide, numSlides, transitionStyle );
		return false;
	} );
	
	// Play Stop click function
	$('#btnGoStop').bind( 'click', function() {
		if( play ){
			$(this).html( goHTML );
			clearInterval( slideIntervalID );
			play = false;
		} else {
			$(this).html( stopHTML );
			currentSlide = doTransition( 'forward', slideWidth, slideSpeed, currentSlide, numSlides, transitionStyle );
			slideIntervalID = window.setInterval( function() {
				currentSlide = doTransition( 'forward', slideWidth, slideSpeed, currentSlide, numSlides, transitionStyle );
			}, slideTime );
			play = true;
		}
		return false;
	} );
	
	// hover - nav menu show.
	$('#slideshowWrap').hover( function() {
		$('#slideshowNav').fadeIn();
		if( displayCaption && !(captionStyle == 'NONE') ) {
			$('.slideCaption').animate( { 'top' : (slideHeight - navHeight - captionHeight) }, {queue: false, duration: slideSpeed} );
		}
	}, function() {
		$('#slideshowNav').fadeOut();
		if( displayCaption && !(captionStyle == 'NONE') ){
			$('.slideCaption').animate( { 'top' : (slideHeight - captionHeight) }, {queue: false, duration: slideSpeed} );
		}
	} );
	
	// left/right half of image slide backward/forward.
	if( displayCaption && !(captionStyle == 'NONE') ) {
		$('#slideshowWrap').click( function(e) {
			if( play ){	$('#btnGoStop').html( goHTML );	clearInterval( slideIntervalID ); play = false;	}
			var mouseX = e.pageX - this.offsetLeft;
			if( mouseX > ( slideWidth / 2 ) ){
				currentSlide = doTransition( 'forward', slideWidth, slideSpeed, currentSlide, numSlides, transitionStyle );
			} else {
				currentSlide = doTransition( 'backward', slideWidth, slideSpeed, currentSlide, numSlides, transitionStyle );
			}
			return false;
		} );
	}

	$('#slideshowNav').click( function() { return false; } );
}

// slide/fade forward, backward or goto. shift current button class.	
function doTransition( fwdOrBack, slideWidth, slideSpeed, current, numSlides, transitionStyle ) {
	
switch ( transitionStyle ){

case 'SLIDE':	
	if( fwdOrBack == 'forward' ) {
		slideID = current + 1; if ( slideID > numSlides ) { slideID = 1; }
		$('#slide-' + current).animate( {'left' : -slideWidth }, {queue: false, duration: slideSpeed} );
		$('#slide-' + slideID).css( 'left', slideWidth ).animate( {'left' : '0px'}, {queue: false, duration: slideSpeed} );
	} else if( fwdOrBack == 'backward' ) {
		slideID = current - 1; if ( slideID < 1 ) { slideID = numSlides; }
		$('#slide-' + current).animate( {'left' : slideWidth }, {queue: false, duration: slideSpeed} );
		$('#slide-' + slideID).css( 'left', -slideWidth ).animate( {'left' : '0px'}, {queue: false, duration: slideSpeed} );
	} else if( fwdOrBack == 'goto' ) {
		if( slideID > current ) {
			$('#slide-' + current).animate( {'left' : -slideWidth }, {queue: false, duration: slideSpeed} );
			$('#slide-' + slideID).css( 'left', slideWidth ).animate( {'left' : '0px'}, {queue: false, duration: slideSpeed} );
		} else {
			$('#slide-' + current).animate( {'left' : slideWidth }, {queue: false, duration: slideSpeed} );
			$('#slide-' + slideID).css( 'left', -slideWidth ).animate( {'left' : '0px'}, {queue: false, duration: slideSpeed} );
		}
	}
	break;
	
case 'FADE':
	if( fwdOrBack == 'forward' ) {
		slideID = current + 1; if ( slideID > numSlides ) { slideID = 1; }	
	} else if( fwdOrBack == 'backward' ) {
		slideID = current - 1; if ( slideID < 1 ) { slideID = numSlides; }	
	}
	if( slideID != current ) {
		$('#slide-' + current).fadeOut( {queue: false, duration: slideSpeed} );
		$('#slide-' + slideID).fadeIn( {queue: false, duration: slideSpeed} );
	}
	break;

}

	$('#btn-' + current).removeClass( 'currentSlide' );	$('#btn-' + slideID).addClass( 'currentSlide' );
	return slideID;
}