/* change this to increase/decrease time between top slides on front page */
var switchImageTime = 5000;

/* do not change unless you know what you're doing */
var imageListID = '#topImagesList';
var intervalId = false; // needed to make this Global

// define information going into the slideshow at the top of the front page.  Must be in the same order as the <li> tags that hold the images that will be switched through..

$(document).ready(function(){

	intervalId = setInterval( function() {
			changeImage(true);
		}, switchImageTime );

	// initialize top slideshow
	$("#topImagesList li").each(function(index, element){
		$(element).attr("sid", index);
		$(element).css('display', 'none');
	});
	$('#topImagesList li').first().addClass('showImage').css('display', 'block');
	
	initSlideshowButtons('#changeRight', true);
	initSlideshowButtons('#changeLeft', false);

	// initialize bottom program lists
	$("#programscontainer ul").each(function(index, element){
		$(element).attr("sid", index);
	});

	initProgramLists('#programtoggleright', true, 'left');
	initProgramLists('#programtoggleleft', false, 'right');	
});	


var slideshowMoving = false;
function initSlideshowButtons(iId, iForward) {
			
			
		$(iId).click( function() {
			
			if (slideshowMoving == false) {
				
				slideshowMoving = true;
			
				clearInterval(intervalId);
				changeImage(iForward, true);
				slideshowMoving = false;
			}
		});
		
	}

function changeImage(iForward) {
	
	var liveImage = $('.showImage');
			
	if (iForward)
		var nextImage = liveImage.next();
	else
		var nextImage = liveImage.prev();
				
	if (!nextImage.attr('sid')) {
		if (iForward)
			nextImage = $(imageListID+' li').first();
		else
			nextImage = $(imageListID+' li').last();
	}	
			
	liveImage.fadeOut(1000, function() {
				
		// change Link
		$('#controlsright .learnmore').html(' <a href="'+slideshowContent.html[nextImage.attr('sid')].link+'"><img src="images/btn_learnmore.gif" /></a> ');	
		
		// change HTML
		$('#controlsleft').html(slideshowContent.html[nextImage.attr('sid')].title+slideshowContent.html[nextImage.attr('sid')].content);
		
		liveImage.removeClass('showImage');
		nextImage.addClass('showImage');
		nextImage.fadeIn(1000);
	});
}


var movingSlider = false;

function initProgramLists(iButtonId, iForward, iDir ) {
		
		$(iButtonId).click( function() {
			
			if (movingSlider == false) {
				
				movingSlider = true;
				var activeList = $('#programscontainer .show');
				
				if (iForward)
						var nextList = activeList.next();
					else
						var nextList = activeList.prev();
						
					if (!nextList.attr('sid')) {
						if (iForward)
							nextList = $('#programscontainer ul').first();
						else
							nextList = $('#programscontainer ul').last();
			
					}
				
				if (iDir == 'left') {
					activeList.hide("slide", { direction: "left" }, 1000);
					nextList.show("slide", {direction: "right" }, 1000, function() {
						movingSlider = false;
					});
				} else {
					activeList.hide("slide", { direction: "right" }, 1000);
					nextList.show("slide", {direction: "left" }, 1000, function() {
						movingSlider = false;
					});
				}
				
				activeList.removeClass('show');
				nextList.addClass('show');
			}
			
		});
	}
