var loaded = false;
var clickedNavButton = false;

jQuery(document).ready(function() {

	jQuery('#latestNewsFlash').cycle({
		fx:				'fade',
		speed:			'1000',
		timeout:		6000,
		pause:			1,
		next:			'#btnNext',
		prev:			'#btnPrev',
		prevNextClick:	onPrevNextClick,
		before:			onBefore
	});
});


// This callback runs if the user clicked the next or previous arrow buttons.
onPrevNextClick = function(isNext, zeroBasedSlideIndex, slideElement)
{
	jQuery('.gotoImage img').removeClass('activeImage').addClass('inactiveImage');
	jQuery('#gotoImage' + (zeroBasedSlideIndex + 1)).removeClass('inactiveImage').addClass('activeImage');

	// This is for letting the onBefore event know that onPrevNextClick has fired.
	clickedNavButton = true;
}

// This is the transition event that runs every time a slide changes.
onBefore = function(curr, next, opts)
{
	// Since the onNextPrevClick event runs before this event, we need to make sure that the onNextPrevClick event
	// didn't already fire. If it did, this function will override what it did, so this check needs to be here.
	if(!clickedNavButton)
	{
		var index = opts.currSlide;
		var slideCount = opts.slideCount;
		var curId = '#gotoImage' + (index + 1);
		var nextId = (index == (slideCount - 1)) ? '#gotoImage1' : '#gotoImage' + (index + 2);

		if(loaded)
		{
			jQuery('.gotoImage img').removeClass('activeImage').addClass('inactiveImage');
			jQuery(nextId).removeClass('inactiveImage').addClass('activeImage');
		}
		else
		{
			loaded = true;
			jQuery(curId).removeClass('inactiveImage').addClass('activeImage');
		}
	}
	else
	{
		clickedNavButton = false;
	}
}
