/*
 * Homepage animation for Northern
 */
var timeouts = [];
var show_slide_one = 1;
var imagedate = '20120202';

$( function() {
	//
	var closed = $( '#offerclosed' );

	// if so, switch off the first slide and remove the elements
	if ( closed.length > 0 ) {
		show_slide_one = 0;

		// remove free-tickets-bg and online-ticketing-final
		$( '#animation-block-container' ).css( { 'left': '-717px' } );

		var img = $( '<img />' );
		img.attr( 'src', 'images/section/homepage/animation/buy-tickets/click-and-save/recoloured/1-without.png' );
		img.css( { 'left' : '2868px' } );

		$( '#animation-block-container' ).append( img );
		$( '#slide-2' ).addClass( 'active' );
	}

	// click on jumpslides
	$( '.jumpslide' ).click( function(e) {
		// do everything we can to stop things moving!
		e.preventDefault();
		clearAllTimeouts();

		$( '#online-ticketing-3-1' ).clearQueue();
		$( '#animation-block-container' ).clearQueue();
		$( '.fareshow' ).hide();
		$( '#benefits' ).hide();
		$( '#benefits' ).clearQueue();

		// set the correct one ticked
		$( '.jumpslide' ).removeClass( 'active' );
		$( this ).addClass( 'active' );

		// reset slide 3 and 1 even if it's not changed
		resetSlideOne();
		$( '#online-ticketing' ).attr( 'src', 'images/section/homepage/animation/buy-tickets/click-and-save/recoloured/1-without.png' );
		$( '#online-ticketing-3-1' ).attr( 'src', 'images/section/homepage/animation/buy-tickets/click-and-save/recoloured/3.topbottom.'+ imagedate +'.png' );

		// reset slide 0 and the lozenge
		resetSlideZero();
		$( '#green-lozenge' ).clearQueue();

		// and move to whichever one we need
		if ( $( this ).attr( 'id' ) == 'slide-1' ) {
			clickFree();

			$( '#animation-block-container' ).animate( { 'left': '0' }, {
				duration: 600,
				complete: function() {
					var tmp_timeout = setTimeout( slideZeroAnimation, 1000 );
					timeouts.push( tmp_timeout );

					return;
				}
			} );
		} else {
			if ( $( this ).attr( 'id' ) == 'slide-2' ) {
				clickTickets();
				resetSlideOne();

				$( '#animation-block-container' ).animate( { 'left': '-717px' }, {
					duration: 600,
					complete: function() {
						var tmp_timeout = setTimeout( slideOneAnimation, 5000 );
						timeouts.push( tmp_timeout );

						return;
					}
				} );
			} else if ( $( this ).attr( 'id' ) == 'slide-3' ) {
				clickTickets();

				$( '#animation-block-container' ).animate( { 'left': '-1434px' }, {
					duration: 600,
					complete: function() {
						var tmp_timeout = setTimeout( slideTwoAnimation, 1000 );
						timeouts.push( tmp_timeout );

						return;
					}
				} );
			} else {
				clickTickets();

				$( '#animation-block-container' ).animate( { 'left': '-2151px' }, {
					duration: 600,
					complete: function() {
						var tmp_timeout = setTimeout( slideThreeAnimation, 1000 );
						timeouts.push( tmp_timeout );

						return;
					}
				} );
			}
		}
	} );

	// start the animation with 5 seconds between slides
	if ( 1 == show_slide_one ) {
		var tmp_timeout = setTimeout( slideZeroAnimation, 1000 );
	} else {
		var tmp_timeout = setTimeout( slideOneAnimation, 1000 );
	}
	timeouts.push( tmp_timeout );

} );

function clickFree() {
	$( '#animation-block' ).unbind( 'click' );
	$( '#animation-block' ).click( function() {
		url = 'http://www.northernrail.org/register/freetickets';

		window.location = url;
		return false;
	} );
}

function clickTickets() {
	$( '#animation-block' ).unbind( 'click' );
	$( '#animation-block' ).click( function() {
		url = 'http://tickets.northernrail.org';

		window.location = url;
		return false;
	} );
}

function slideZeroAnimation() {
	clickFree();

	$( '#green-lozenge' ).css( {
		'position': 'absolute',
		'left': '717px',
		'top': '185px',
		'z-index': '1000'
	} )
	.show()
	.animate( { 'left': '-=501px' }, {
		duration: 600,
		complete: function() {
			$( '#free-tickets-bg' ).attr( 'src', 'images/section/homepage/animation/final-image-1.png' );

			var tmp_timeout = setTimeout( rotateSlideOne, 5000 );
			timeouts.push( tmp_timeout );
		}
	} );
}

function resetSlideZero() {
	$( '#green-lozenge' ).hide();
	$( '#free-tickets-bg' ).attr( 'src', 'images/section/homepage/animation/free-tickets-bg.png' );
}

function slideOneAnimation() {
	clickTickets();
	clearAllTimeouts();

	$( '#benefits' ).show().css( {
		'position': 'absolute',
		'left': '717px',
		'top': '162px',
		'z-index': '1000'
	} )
	.show()
	.animate( { 'left': '-=333px' }, {
		duration: 600,
		complete: function() {
			$( '#online-ticketing' ).attr( 'src', 'images/section/homepage/animation/buy-tickets/click-and-save/recoloured/1-with.png' );
			$( '#benefits' ).hide();

			var tmp_timeout = setTimeout( rotateSlideOne, 5000 );
			timeouts.push( tmp_timeout );
		}
	} );
}

function resetSlideOne() {
	$( '#benefits' ).hide();
	$( '#online-ticketing' ).attr( 'src', 'images/section/homepage/animation/buy-tickets/click-and-save/recoloured/1-without.png' );
}

// actually rotate the slide images
function rotateSlideOne() {
	clickTickets();

	clearAllTimeouts();
	resetSlideZero();

	$( '#animation-block-container' ).animate( { 'left': '-=717' }, {
		duration: 600,
		complete: function() {
			$( '.jumpslide' ).removeClass( 'active' );
			$( '#slide-2' ).addClass( 'active' );

			slideTwoAnimation();
		}
	} );
}

// slide two animation
function slideTwoAnimation() {
	resetSlideOne()
	$( '.jumpslide' ).removeClass( 'active' );
	$( '#slide-3' ).addClass( 'active' );

	$( '#buy_ticket_terms' )
		.hide()
		.css( {
			'position': 'absolute',
			'left': '68px',
			'top': '318px',
			'z-index': '1000'
		} );

	$( '#buy_ticket_lozenge' )
		.hide()
		.css( {
		'position': 'absolute',
		'left': '717px',
		'top': '172px',
		'z-index': '1000'
	} )
	.show()
	.animate( { 'left': '-=478px' }, {
		duration: 600,
		complete: function() {
			$( '#buy_ticket_terms' ).fadeIn(
				'slow',
				function() {
					$( '#online-ticketing-2' ).attr( 'src', 'images/section/homepage/animation/buy-tickets/click-and-save/recoloured/2-with.png' );
					$( '#buy_ticket_terms' ).hide();
					$( '#buy_ticket_lozenge' ).hide();

					var tmp_timeout = setTimeout( rotateSlideThree, 5000 );
					timeouts.push( tmp_timeout );
				} );
		}
	} );
}

function rotateSlideTwo() {
	clearAllTimeouts();

	$( '#animation-block-container' ).animate( { 'left': '-=717' }, {
		duration: 600,
		complete: function() {
			resetSlideOne();
			$( '.jumpslide' ).removeClass( 'active' );
			$( '#slide-3' ).addClass( 'active' );

			var tmp_timeout = setTimeout( rotateSlideThree, 5000 );
			timeouts.push( tmp_timeout );
		}
	} );
}

function rotateSlideThree() {
	clearAllTimeouts();

	$( '#animation-block-container' ).animate( { 'left': '-=717' }, {
		duration: 600,
		complete: function() {
			$( '#online-ticketing-2' ).attr( 'src', 'images/section/homepage/animation/buy-tickets/click-and-save/recoloured/2-title.png' );

			$( '.jumpslide' ).removeClass( 'active' );
			$( '#slide-4' ).addClass( 'active' );

			slideThreeAnimation();
		}
	} );

	var tmp_timeout = setTimeout( rotateSlideThree, 5000 );
	timeouts.push( tmp_timeout );
}

// clear all the timeouts in the stack
function clearAllTimeouts() {
	for ( var i = 0; i < timeouts.length; i++ ) {
		clearTimeout( timeouts[ i ] );
	}
	timeouts = [];
}

function slideThreeAnimation() {
	clearAllTimeouts();

	// swap out the src of online-ticketing-3-1 every few seconds with 3-2, 3-3, 3-4, 3-final then animate, back to 3-1 and reset everything
	$( '#online-ticketing-3-1' )
		.delay( 1000 )
		.queue( function () { $( '#fare-1' ).fadeIn( 'slow' ); $( this ).dequeue(); } ).delay( 1000 )
		.queue( function () { $( '#fare-2' ).fadeIn( 'slow' ); $( this ).dequeue(); } ).delay( 1000 )
		.queue( function () { $( '#fare-3' ).fadeIn( 'slow' ); $( this ).dequeue(); } ).delay( 1000 )
		.queue( function () { $( '#fare-4' ).fadeIn( 'slow' ); $( this ).dequeue(); } ).delay( 1000 )
		.queue( function () {
			$( this ).attr( 'src', 'images/section/homepage/animation/buy-tickets/click-and-save/recoloured/3.complete.'+ imagedate +'.png' );
			$( '.fareshow' ).hide();
			$( this ).dequeue();
		} ).delay( 1000 )
		.delay( 1000 );

	// move everything to the left, and on complete set the 3-1 back to what it was
	$( '#animation-block-container' ).delay( 7000 )
		.animate( { 'left': '-=717' }, {
			duration: 600,
			complete: function() {
				$( '#online-ticketing-3-1' ).attr( 'src', 'images/section/homepage/animation/buy-tickets/click-and-save/recoloured/3.topbottom.'+ imagedate +'.png' );

				// remove class, etc
				$( '.jumpslide' ).removeClass( 'active' );

				// and start things again!
				if ( 1 == show_slide_one ) {
					var tmp_timeout = setTimeout( slideZeroAnimation, 3000 );
					// reset the container back to being at 0
					$( '#animation-block-container' ).css( { 'left': '0px' } );
					$( '#slide-1' ).addClass( 'active' );
				} else {
					var tmp_timeout = setTimeout( slideOneAnimation, 3000 );
					// reset the container back to being at 0
					$( '#animation-block-container' ).css( { 'left': '-717px' } );
					$( '#slide-2' ).addClass( 'active' );
				}
				timeouts.push( tmp_timeout );
			}
		} );
}