//Hide show image function runs automatically on document ready
//It creates an array of the images within div.imgBox and fades them in and out

///////////////////////////////////////////////SETTINGS
//set random first image to true or false
var randStart = true;
//set the delay for the image fade
var imgDelay = 19800;
///////////////////////////////////////////////SETTINGS

//sets the count to 0
var count = 0;
//create a new array
var theArray = new Array();

//On document ready push all images within the specified class tag to the Array and run imgFade
$(function() {
	theArray = $("#caseStudiesArea > div").toArray();
	if(randStart == true){
		//define the array Length to start from 0 for reference later
		var arrayLength = theArray.length-1;
		//randomise the first image shown
		var randno = Math.round ( Math.random() * arrayLength );
		count = randno;
	}
	$(theArray[count]).fadeIn("600")
	//No requirement for imgFade as image will update on page refresh instead
	//imgFade();
});

//applies the fade in then fade out to the firat Array item then runs redoImgFade - set your delay time in millisecs
function imgFade() {
	$(theArray[count]).fadeIn("600").delay(imgDelay).fadeOut("600", function() {redoImgFade()});
}

//runs incrementCount and then runs imgFade for the next Array item
function redoImgFade() {
	incrementCount();
	imgFade();
}

//increments the count to the next integer
function incrementCount() {
	if(count < theArray.length-1) {
		count++;
	} else {
		count = 0;
	}
}