$(document).ready(function() {

var imageNumber = 2;
var currentZindex = -1;
var currentContainer = 2;
var animating = false;


var bannerTitle = ["POWER", "METALS & MINING", "OIL & GAS", "NUCLEAR"];
var bannerSubtitle = ["East Windsor Cogeneration", "Slag Granulation Plant", "Shell Scotford Project", "Master Services Agreement"];
var bannerInnerLink = ["http://www.industrial.aecon.com/projects/?tid=2&pid=41#fragment-2", "http://www.industrial.aecon.com/projects/?tid=4&pid=60#fragment-4", "http://www.industrial.aecon.com/projects/?tid=3&pid=86#fragment-3", "http://www.industrial.aecon.com/projects/?tid=1&pid=57#fragment-1"];

/* Rotating background function */
var changeBackground = function(targetImage) {
	
	animating = true;
	
	// Make sure the new container is always on the background
	currentZindex--;

	// Hide the header text
	$("#headertxt").css({"display" : "none"});

	// Set the new header text
	$("#bannertitle").html(bannerTitle[targetImage-1]);
	$("#bannersubtitle").html(bannerSubtitle[targetImage-1]);
	$("#bannerinnerlink").attr("href", bannerInnerLink[targetImage-1]);

	// Set the background image of the next container	
	$("#headerimg" + currentContainer).css({
		"background-image" : "url(../admin/images/homebg" + targetImage + ".jpg)",
		"display" : "block",
		"z-index" : currentZindex
	});
	
	imageNumber = targetImage;
	
	/* Change the navigation image */
	$("#bgnav").attr("src", "../admin/images/bgnav" + imageNumber + ".png");
	
	/* Set the next image to show */
	switch(imageNumber){
		case 1:
			imageNumber = 2;
			break;
		case 2:
			imageNumber = 3;
			break;
		case 3:
			imageNumber = 4;
			break;
		case 4:
			imageNumber = 1;
			break;
	}

	/* Set the next container to use */
	if(currentContainer == 1){
		currentContainer = 2;
	}
	else if(currentContainer == 2){
		currentContainer = 1;
	}
	
	/* Fadeout the current container */
	$("#headerimg" + currentContainer).fadeOut(1000, 
		function(){
			$("#headertxt").css({"display" : "block"});
			animating = false;
		}
	);
};

// Stops the animation
var stopAnimation = function() {		
	// Clear the interval
	clearInterval(interval);
};

// Go to Image one
$("#bannerlinkone").click(function() {
		// Check if no animation is running. If it is, prevent the action
		if(animating) {
			return;
		}
	stopAnimation();
	changeBackground(1);
	interval = setInterval(function() {
		changeBackground(imageNumber);
	}, 5000);
});

// Go to Image two
$("#bannerlinktwo").click(function() {
		// Check if no animation is running. If it is, prevent the action
		if(animating) {
			return;
		}
	stopAnimation();
	changeBackground(2);
	interval = setInterval(function() {
		changeBackground(imageNumber);
	}, 5000);
});

// Go to Image three
$("#bannerlinkthree").click(function() {
		// Check if no animation is running. If it is, prevent the action
		if(animating) {
			return;
		}
	stopAnimation();
	changeBackground(3);
	interval = setInterval(function() {
		changeBackground(imageNumber);
	}, 5000);
});

// Go to Image four
$("#bannerlinkfour").click(function() {
		// Check if no animation is running. If it is, prevent the action
		if(animating) {
			return;
		}
	stopAnimation();
	changeBackground(4);
	interval = setInterval(function() {
		changeBackground(imageNumber);
	}, 5000);
});


var setBackgroundID = function(imageID, divID){
	$("#headerimg" + divID).css({
		"background-image" : "url(../admin/images/homebg" + imageID + ".jpg)",
		"display" : "block",
		"z-index" : currentZindex
	});
};

// Set the starting background image
setBackgroundID(1, 1);

// Set the starting header text
$("#bannertitle").html(bannerTitle[0]);
$("#bannersubtitle").html(bannerSubtitle[0]);
$("#bannerinnerlink").attr("href", bannerInnerLink[0]);

// Start playing the animation
interval = setInterval(function() {
	changeBackground(imageNumber);
}, 5000);

});