$(document).ready(function(){
						   
// attach to only the a tags in the carousel 
$('div#carousel a, div#carousel p.button').click(function(e) {
	// ga.js sets up the pageTracker var, but its possible that this code could execute before that script call resolves - if so, i can't do anything
	/*if (pageTracker) {
		// tracking the clicks different from the controls
		if ($(this).hasClass('button')) {
			// just using the id of the p as the action
			pageTracker._trackEvent('Carousel', $(this).attr('id'));
		} else {
			// find out which slide was clicked to test if placement has an effect on popularity
			var whichSlide = $(this).closest('div.slide').attr('id');
			whichSlide = whichSlide.charAt(5);
			// i want to report which part of the slide was clicked, but the action is click
			if ($(this).parent().hasClass('thumbnail')) {
				var trackedLabel = 'thumbnail';
			} else if ($(this).parent().attr('tagName') == 'H2') {
				var trackedLabel = 'headline';
			} else if ($(this).parent().attr('tagName') == 'P') {
				var trackedLabel = 'body';
			};
			trackedLabel = trackedLabel + whichSlide;
			pageTracker._trackEvent('Carousel', 'click', trackedLabel);
		};
	};*/
	//handles the jumpTo controls for going directly to a slide
	if ($(this).hasClass('jumpTo')) {
		//look at the id of the jumpTo button and strip out the slide number
		var btnNum = Number($(this).attr('id').substr(10,1));
		//this is not triggered, if they click on the one that is currently showing
		if (isTrans == false) {
			//turn playing off
			clearInterval(playInt);
			isPlaying = false;
			if (curSlideNum != btnNum) {
				//tells the loadSlide which one is to load now
				newSlideNum = btnNum;
				loadSlide(newSlideNum);
				//reset the slide numbers
				curSlideNum = newSlideNum;
				curSlide = $('div#carousel div.slide').eq(curSlideNum -1);
			}
		}
	};
	//handles the next control - does not run if slide is transitioning
	if ($(this).attr('id') == 'next') {
		if (isTrans == false) {
			//turn playing off
			isPlaying = false;
			clearInterval(playInt);
			//advance one slide
			nextSlide();
		};
	};
	//handles the previous control - does not run if slide is transitioning
	if ($(this).attr('id') == 'previous') {
		if (isTrans == false) {
			//turn playing off
			isPlaying = false;
			clearInterval(playInt);
			//goes back one slide
			prevSlide();
		};
	};
});

// interval and other code here
if ($('div#carousel')) {
	$('div#controls').css('display','block');
	startSlides();
}
//set up global variables
var isTrans = false;
var curSlide;
var curSlideNum;
var newSlideNum;
var playInt;
var isPlaying;

//where everything begins
function startSlides() {
	$('div#carousel div.slide').hide();
	curSlide = $('div#carousel div.slide:first');
	curSlideNum = 1;
	curSlide.show().addClass('topSlide');
	$('div#carousel p.jumpTo:first').addClass('current');
	if ($('div#carousel div.slide').length > 1) {
		isPlaying = true;
		playInt = setInterval(nextSlide, 5000);
	}
}

//counts up 1, used by the setInterval as well as the next button
function nextSlide () {
	if (curSlide.next().length > 0){
		newSlideNum = curSlideNum + 1;
	} else {
		newSlideNum = 1;
	}
	loadSlide(newSlideNum);
	curSlideNum = newSlideNum;
	curSlide = $('div#carousel div.slide').eq(curSlideNum -1);
}

//counts down 1, used by the previous button
function prevSlide () {
	if (curSlide.prev().length > 0){
		newSlideNum = curSlideNum - 1;
	} else {
		newSlideNum = $('div#carousel div.slide').length;
	}
	loadSlide(newSlideNum);
	curSlideNum = newSlideNum;
	curSlide = $('div#carousel div.slide').eq(curSlideNum -1);
}

//this takes care of all transitions no matter what triggered it
function loadSlide(newSlideNum) {
	if (isTrans == false) {
		//start the transition, to block other user action inputs
		isTrans = true;
		var oldSlide = $('div#carousel div.topSlide');
		var newSlide = $('div#carousel div.slide').eq(newSlideNum -1); //.eq is zero based so slide #3 has an index of 2
		//change the jumpTo controls to indicate which is the current slide
		$('div#carousel p.jumpTo').removeClass('current');
		$('div#carousel p.jumpTo').eq(newSlideNum -1).addClass('current');
		//first we hide all slides but the one showing
		$('div#carousel div.slide:not(.topSlide)').hide().removeClass('btmSlide');
		//then we move the current slide down one and the new slide to the top, but still hidden
		oldSlide.addClass('btmSlide').removeClass('topSlide');
		//then we fade in the new slide on top of the old one
		//this means that two of the slides are always showing except during this function
		newSlide.addClass('topSlide').fadeIn(500, function() {
			//this is the callback function when the animation is finished to let everything know the transition is complete
			isTrans = false;
		});
	}
}

	
}); //end of ready function