// Preload images
var catPath = "images/new-images/";
var catWidth = 900;
var catHeight = 127;

var catPics = new Array (
    "header-background.jpg",
    "image3.jpg",
    "image4.jpg",
    "image9.jpg",
    "image2.jpg",
    "image5.jpg",
    "image6.jpg",
    "image7.jpg",
    "image8.jpg",
    "image10.jpg");

var myPics = preloadImages (catPath,catPics,catWidth,catHeight);

function preloadImages(path,pics,width,height) {
    var images = new Array;
    for (var picNum=0; picNum<pics.length; picNum++) {
        images[picNum] = new Image(width,height);
        images[picNum].src = (path + pics[picNum]);
    }
     return(images);
}



//Pictures to switch inbetween
var Rollpic1 = "url('images/new-images/header-background.jpg')";
var Rollpic2 = "url('images/new-images/image3.jpg')";
var Rollpic3 = "url('images/new-images/image4.jpg')";
var Rollpic4 = "url('images/new-images/image9.jpg')";
var Rollpic5 = "url('images/new-images/image2.jpg')";
var Rollpic6 = "url('images/new-images/image5.jpg')";
var Rollpic7 = "url('images/new-images/image6.jpg')";
var Rollpic8 = "url('images/new-images/image7.jpg')";
var Rollpic9 = "url('images/new-images/image8.jpg')";
var Rollpic10 = "url('images/new-images/image10.jpg')";
//Start at the what pic:
var PicNumber=1;
//Number of pics:
var NumberOfPictures=10;
//Time between pics switching in secs
var HowLongBetweenPic=4;

//SwitchPic Function
function SwitchPic(counter){
	if(counter < HowLongBetweenPic){
		counter++;
		document.getElementById('myBanner').style.backgroundImage = eval("Rollpic" + PicNumber);
		//function calls itself
		CallSwitchPic=window.setTimeout("SwitchPic("+counter+")",1500);
		}
		else{
			//if its not the last picture goto the next picture
			if(PicNumber < NumberOfPictures){
				PicNumber++;
				SwitchPic(0);
			}
			//its the last picture go to the first one
			else{
				PicNumber=1;
				SwitchPic(0);
				}
		}
}