
$(document).ready(function() {
					  
	//Put the JPG images (.jpg) in this array and that's it name a div id=photo-display and it will work
	
	//This is to populate
	
	
	//This is to animate
	var galImg = Array("1","2","3","4","5","6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24");
	var path = "http://www.bu.edu/greeklife/images/photobar/";
	
	//populate the 5 divs
	for(i=0;i<=4;i++){
		var img = selectRnd();
		$(".photobar-pics:eq("+i+")").css('background','none').css('background-image', 'url('+path+img+'.jpg)');
		
	}
	setInterval(animate, 20000);
	
	function selectRnd(){
		var galImgs  = [];
		for (var i in galImg)
			galImgs[i] = galImg[i];
			
		for(i=0;i<=4;i++){
			var image = $(".photobar-pics:eq("+i+")").css('background-image');
			image = image.slice(4,image.length-1);
			image = image.replace(path,"");
			image = image.replace(/.jpg/,"");
			image = parseInt(image);
			var tmpArray = [];
			for(var x in galImgs)
				if (galImgs[x] != image)
					tmpArray.push(galImgs[x]);
			galImgs = tmpArray;
			
		}
		var randomImg = (Math.floor(Math.random() * (galImgs.length - 1)));
		return(galImgs[randomImg]);
		}
	
	//animate();
	
	
	//animate the pictures
	function animate(){
		var num = (Math.floor(Math.random() * 4));
		var randomImg = selectRnd();
		var currentSrc = $(".photobar-pics:eq("+num+")").css('background-image');
		currentSrc = currentSrc.slice(4,currentSrc.length-1);
		$(".photobar-pics:eq("+num+")").empty().html("<img id='imageID"+num+"' src='"+currentSrc+"' />");
		$(".photobar-pics:eq("+num+")").css('background-image', 'url('+path+randomImg+'.jpg)');	
		$("#imageID"+num).fadeOut(500);		
	}
	

	
	
});

