/*
	Pretty cool slider for August Home Publishing sites - by Tony! Leo
		Prerequisites: 
			1. jQuery core
			2. jquery.color.js plugin
			3. homeSlider.css
					
		Markup layout:
			<div id="slideContainer">
				<div class="slide show" title="mag">
					slide content
				</div>
				<div class="slide" title="gift">
					slide content
				</div>
				<ul id="slideNav">
					<li title="mag"><a href="slide1 fallback"></a></li>
					<li title="gift"><a href="slide2 fallback"></a></li>
				</ul>
			</div>
		
		Usage Notes:
			Inside slideContainer div, create divs with class .slide and titles.
			Then create unordered list with list items having titles that match appropriate slide.
			Link href in tab will be the fallback if JavaScript is disabled and first slide content will be shown.
*/

// options
var slideTime = 3000; // time to stay on each slide
var tabAnimationTime = 300; // how long it takes to animate the tab
var autoStartSlides = 'yes'; // should slideshow autostart on load?


// animate a tab to active state
$.fn.activeOpen = function() {
	if ($.browser.mozilla) {
		$(this).animate({
			'MozBorderRadius': '7px 7px 0px 0px'
		}, 100);
	}
	$(this).animate({
		'backgroundColor': 'white',
		'fontSize': '17px',
		'paddingTop': '8px',
		'paddingBottom': '5px',
		'borderRadius': '7px',
		'webkitBorderTopLeftRadius': '7px',
		'webkitBorderTopRightRadius': '7px',
		'webkitBorderBottomRightRadius': '0px',
		'webkitBorderBottomLeftRadius': '0px',
		'border': '1px solid',
		'marginBottom': '4px',
		'bottom': '5px' 
	}, tabAnimationTime);
	if ($.browser.msie) {
		$(this).animate({
			'borderTopWidth': '4px',
			'bottom': '4px'
		}, 100);
	}
};
// closes tab back to default styles
$.fn.activeClose = function() {
	$(this).css({
		'backgroundColor': '',
		'fontSize': '',
		'padding': '',
		'borderRadius': '',
		'-moz-border-radius': '',
		'-webkit-border-radius': '',
		'border': '',
		'marginBottom': '',
		'bottom': ''
	});
};

nextSlide = function() {
	$('#slideNav li').removeClass('prev');
	if ($('#slideNav li.active').hasClass('lastSlide')) {
		$('#slideNav li').removeClass('active');
		$('#slideNav li:first').addClass('active');
		$('#slideNav li:first').activeOpen();
		$('#slideNav li:not(active)').activeClose();
		$('.slide').fadeOut();
		$('.slide:first').fadeIn();
	} else {
		activeName = $('#slideNav li.active').next().attr('title');
		$('#slideNav li.active').next().addClass('active');
		$('#slideNav li.active:first').removeClass('active');
		$('#slideNav li.active').activeOpen();
		$('#slideNav li:not(active)').activeClose();
		$('.slide').fadeOut();
		$('.slide[title='+activeName+']').fadeIn();
		if (!($('#slideNav li.active').hasClass('.firstSlide'))) {
			$('#slideNav li[title='+activeName+']').prev().addClass('prev');
		}
	}
};
prevSlide = function() {
	$('#slideNav li').removeClass('prev');
	if ($('#slideNav li.active').hasClass('firstSlide')) {
		$('#slideNav li').removeClass('active');
		$('#slideNav li:last').addClass('active');
		$('#slideNav li:last').activeOpen();
		$('#slideNav li:not(active)').activeClose();
		$('#slideNav li.active').prev().addClass('prev');
		$('.slide').fadeOut();
		$('.slide:last').fadeIn();
	} else {
		activeName = $('#slideNav li.active').prev().attr('title');
		$('#slideNav li.active').prev().addClass('active');
		$('#slideNav li.active:last').removeClass('active');
		$('#slideNav li.active').activeOpen();
		$('#slideNav li:not(active)').activeClose();
		$('.slide').fadeOut();
		$('.slide[title='+activeName+']').fadeIn();
		if (!($('#slideNav li.active').hasClass('firstSlide'))) {
			$('#slideNav li[title='+activeName+']').prev().addClass('prev');
		}
	}
};

var theInt = null;
stopSlides = function() {
	clearInterval('theInt');
	if ($('.playButton').text() == 'Pause') {
		$('.playButton').click(); }
};
startSlides = function() {
	clearInterval('theInt');
	theInt = setInterval(function() {
		nextSlide();
	}, slideTime);
};
// defaults for when the page loads
var prevNextStuff = '<ul id="prevnext">\n<li><a href="" class="previous">&lt;</a></li>\n<li><a href="" class="playButton">Play</a></li>\n<li><a href="" class="next">&gt;</a></li>\n</ul>';

startSlideshow = function() {	
	$('#slideContainer').append(prevNextStuff);
	$('.slide:first').addClass('firstSlide');
	$('.slide:last').addClass('lastSlide');
	$('#slideNav li:first').addClass('firstSlide active');
	$('#slideNav li:last').addClass('lastSlide');
	var activeName = $('.slide:first').attr('title');
	$('#slideNav li[title='+activeName+']').activeOpen();
	if (autoStartSlides == 'yes') {
		startSlides();
		$('.playButton').text('Pause');
	}
};
$(document).ready(function() {
	startSlideshow();

	
	
	//tab clicking functionality
	$('#slideNav li').click(function() {
		if ($(this).hasClass('active')) { return false }; // don't do anything if it's already active
		$('.slide').fadeOut();
		$('#slideNav li').removeClass('active prev');
		activeName = $(this).attr('title');
		$('.slide[title='+activeName+']').fadeIn();
		$(this).addClass('active');
		$(this).activeOpen();
		$('#slideNav li:not(active)').activeClose();
		if (!$(this).hasClass('.firstSlide')) {
			$('#slideNav li[title='+activeName+']').prev().addClass('prev');
		} 
		stopSlides();
		return false;
	});

	//clicking next
	$('.next').click(function() {
		if ($('#slideNav li').is(':animated')) {
			// don't do anything if there's currently an animation running
		} else {
			nextSlide();
			stopSlides();
		}
		return false;
	});
	
	//clicking previous
	$('.previous').click(function() {
		if ($('#slideNav li').is(':animated')) {
			// don't do anything if there's currently an animation running
		} else {
			prevSlide();
			stopSlides();
		}
		return false;
	});
	
	//clicking play
	if (autoStartSlides == 'yes') {
	$('.playButton').toggle(
		function() {
			$(this).text('Play');
			clearInterval(theInt);
			return false;
		},
		function() {
			$(this).text('Pause');
			nextSlide();
			startSlides();
			return false;
		}
	);
	} else {
	$('.playButton').toggle(
		function() {
			$(this).text('Pause');
			nextSlide();
			startSlides();
			return false;
		},
		function() {
			$(this).text('Play');
			clearInterval(theInt);
			return false;
		}
	);
	}
});