$(document).ready(function(){

	// Marty's Hero Slideshow
	//Set some variables
	var slideHeight = 300;
	var numberOfSlides = $('.slide').length;

	//Apply some initial CSS
	$('.heroslideshow').css({'height' : '300px'});
	$('.tabs').find('div:eq(0)').addClass('first');
	$('.tabs').find('div:eq(0)').addClass('selected');	

	//actions that apply on mouseover
	$('.tabs div.label').mouseover( function(event) {
	  	var index = $(".tabs div").index(this);

		//the action on the tabs
		$('.tabs div').removeClass('selected');
		$(this).addClass('selected');

		//the action on the slides
		$('.slides').stop().animate(
				{'marginTop' : slideHeight*(-index)}
		);

	});
	

	var oldSlide = 0, currentSlide = 0;
	var time = 8000;

	var slideInterval = setInterval(slideRotate, time); 

	$('.heroslideshow').hover(function() {
		clearInterval(slideInterval);
	}, function() {
		slideInterval = setInterval(slideRotate, time);
	});

	function slideRotate() {
		currentSlide = (oldSlide + 1) % numberOfSlides; 

		//the action on the tabs
		$('.tabs div').removeClass('selected');
		$('.tabs div:eq(' + currentSlide + ')').addClass('selected');
		
		//the action on the slides
		$("div.slides").stop().animate({'marginTop' : slideHeight*(-currentSlide)} );

		oldSlide = currentSlide;
	}



	// Marty's Slider
	// Used on What's On page
	$('.slider .next').addClass('nextactive');
		
	$('.slider .next').click( function(event) {
		event.preventDefault();
	  	$('.slider .wrapper .inside').animate({
	      'marginLeft' : -614
	    });
		$('.slider .next').removeClass('nextactive');
		$('.slider .previous').addClass('previousactive');

		$('.slider .next').removeAttr('title');
		$('.slider .previous').attr('title','Click to slide');

	});
	
	$('.slider .previous').click( function(event) {
		event.preventDefault();

	   $('.slider .wrapper .inside').animate({
	      'marginLeft' : 0
	    });
		$('.slider .previous').removeClass('previousactive');
		$('.slider .next').addClass('nextactive');

		$('.slider .previous').removeAttr('title');
		$('.slider .next').attr('title','Click to slide');

	});



	// Marty's Tab Switcher
	//Set the initial state: first button selected, and all but first slides hidden
	$('#slidecontrols').find('li:eq(0)').addClass('selected');	
	$('#slides').find('> div:eq(0)').nextAll().hide();	

	//actions that apply on click to all buttons
	$('#slidecontrols li').click( function(event) {
		event.preventDefault();
		$('#slidecontrols li').removeClass('selected');
		$('#slides > div').hide();
		$(this).addClass('selected');

  		var index = $("#slidecontrols li").index(this);
		$('#slides > div:eq('+index+')').show();

	});



	// Flickr Slideshow
	$('.flickrslideshow').find('> div:eq(0)').nextAll().css({'opacity':'0','display':'none'});
	
	$('.controls > a').click(function(event) {
		event.preventDefault();
		
		var currentslide = $(this).parents('div:first');
		var currentposition = $('.flickrslideshow div').index(currentslide);		
		var nextposition = ($(this).attr('class')=='next') ? currentposition+1 : currentposition-1;

		$('.flickrslideshow div:eq('+currentposition+')').animate({opacity: 0}, 250, function() {
		    $('.flickrslideshow div:eq('+currentposition+')').css('display','none');		
		    $('.flickrslideshow div:eq('+nextposition+')').css('display','block');		
			$('.flickrslideshow div:eq('+nextposition+')').animate({opacity: 100}, 1500);
		  }
		);
	});



	//GP Slideshow

	$('.gpslideshow .image').wrapAll('<div class="slideinner" />');
	$('.slideinner').css('width', $('.gpslideshow').width() * $('.slideinner .image').length);

	// Build the Counter
	$('.gpslideshow').append('<div class="slidecontrols" />');
	$('.gpslideshow .slidecontrols').append('<ul class="counter"></ul>');
	$('.gpslideshow .slidecontrols .counter').append('<div class="arrow"><a id="prev"><span>&larr;</span></a>&nbsp;</div>');

	$('.gpslideshow .slideinner .image').each(function(index) {
		$('.gpslideshow .slidecontrols .counter').append('<li><span>Slide</span></li>');
	  });

	$('.gpslideshow .slidecontrols .counter').append('<div class="arrow"><a id="next"><span>&rarr;</span></a>&nbsp;</div>');

	// Center the controls, but only if there's enough width
	var slidecontrolsWidth = $('.slidecontrols li').width() * $('.slidecontrols li').length ;
	if ( slidecontrolsWidth < $('.gpslideshow').width() ) {
			$('.gpslideshow .slidecontrols').find('.counter').css('margin-left', ( ( $('.slidecontrols').width() - ( $('.arrow').width() * 2 ) - ( $('.slidecontrols li').width() * $('.slidecontrols li').length ) ) / 2 ) );
		} 





	// The action
	var currentPosition = 0;
	manageControls(currentPosition);

	// Action for .slide clicks
	$('.gpslideshow .slideinner .image')
		.bind('click', function(){
			if ( $('.gpslideshow .slideinner .image').index(this) == $('.gpslideshow .slideinner .image').length - 1 ) { currentPosition = 0; } else { currentPosition = $('.gpslideshow .slideinner .image').index(this) + 1; }
			manageControls(currentPosition);
			$('.gpslideshow .slideinner').animate({ 'marginLeft' : $('.image').width() * (-currentPosition) } );
		});

	// Action for .arrow clicks
	$('.gpslideshow .slidecontrols .counter .arrow a')
		.bind('click', function(){
			currentPosition = ($(this).attr('id')=='next') ? currentPosition+1 : currentPosition-1;
			manageControls(currentPosition);
			$('.gpslideshow .slideinner').animate({ 'marginLeft' : $('.image').width() * (-currentPosition) } );
		});

	// Action for .counter clicks
	$('.gpslideshow .slidecontrols .counter li')
		.bind('click', function(){
			currentPosition = $('.gpslideshow .slidecontrols .counter li').index(this);
			manageControls(currentPosition);
			$('.gpslideshow .slideinner').animate({ 'marginLeft' : $('.gpslideshow .slideinner .image').width() * (-currentPosition) } );
		});

	function manageControls(position){
		if(position==0){ $('#prev').hide() } else{ $('#prev').show() }
		if(position== $('.gpslideshow .slideinner .image').length -1){ $('#next').hide() } else{ $('#next').show() }
		$('.gpslideshow .slidecontrols .counter > li').removeClass('selected');
		$('.gpslideshow .slidecontrols .counter > li:eq('+position+')').addClass('selected');
	}


});

/**
 * This function will initialize a slideshow with the content output from
 * the agoSlideshow snippet.
 *
 * @param slideshowID: the id attr of the slideshow div which has the slideshow elems
 */
function agoSlidshowInit(slideshowID) {
	// Create the slideshow controls
	
	// Add a container div
	$("#" + slideshowID).after('<div id="' + slideshowID + '_controls" class="agoSlideshowCtrls"></div>');
	
	// Add the left and right arrows as well as the 'dot' navigation
	$("#" + slideshowID + "_controls").append('<a id="' + slideshowID + '_prev" class="agoSlideshowPrev">&larr;</a>');
	$("#" + slideshowID + "_controls").append('<div id="' + slideshowID + '_nav" class="agoSlideshowNav"></div>');
	$("#" + slideshowID + "_controls").append('<a id="' + slideshowID + '_next" class="agoSlideshowNext">&rarr;</a>');
	
	// Init the cycle plugin, visit http://jquery.malsup.com/cycle/ for documentation
	$("#" + slideshowID).cycle(
		{ 
			fx:      "scrollHorz", 
			speed:   "fast", 
			timeout: 0,
			nowrap:   1, 
			next:    "#" + slideshowID + "_next", 
			prev:    "#" + slideshowID + "_prev",
			pager:   "#" + slideshowID + "_nav",
			after: onAfterSlide 
		}
	);
	
	// Add event handler so that clicks on images advance the slides
	$("#" + slideshowID).click(
		function() {
			$(this).cycle("next");
		}
	);
	
	// Loop through all the dots and modify them so the styles work
	$("#" + slideshowID + "_nav a").each (
		function () {
			$(this).html("<span>" + $(this).text() + "</span>");
			$(this).addClass("agoSlideshowItem");
		}
	);
	
	// Modify the slideshow controls so that they are centred below the images
	$("#" + slideshowID + '_controls').css( { 'width' : 100 + (13 * $('#' + slideshowID + '_nav a').length), 'margin' : '0 auto'} );
}

/**
 * This function is a callback for the slideshow. It will determine if the slideshow is at the beginning or the end and show or hide the arrows.
 *
 * @param currSlideElement: the current slide element
 * @param nextSlideElement: the next slide element
 * @param options: an object with cycle options
 * @param forwardFlag: ??
 */
function onAfterSlide(currSlideElement, nextSlideElement, options, forwardFlag) {
	var index = options.currSlide;
	if (index == 0) {
		$(options.prev).css( { visibility : 'hidden' } );
	} else if (index == options.slideCount - 1) {
		$(options.next).css( { visibility : 'hidden' } );
	} else {
		$(options.prev).css( { visibility : 'visible' } );
		$(options.next).css( { visibility : 'visible' } );
	}
}
