var delay = 5000;
var images = new Array();

var rotators = new Array(
	'images/home1.jpg','images/home2.jpg','images/home3.jpg','images/home4.jpg','images/product1.jpg',
	'images/product2.jpg',
	'images/product3.jpg',
'images/product4.jpg','images/product5.jpg','images/home5.jpg','images/home6.jpg','images/home7.jpg','images/home8.jpg','images/home9.jpg','images/home10.jpg','images/project1.jpg','images/project2.jpg','images/project3.jpg','images/project4.jpg','images/project5.jpg','images/project6.jpg','images/project7.jpg','images/project8.jpg','images/blog1.jpg','images/blog2.jpg','images/blog3.jpg','images/blog4.jpg','images/blog5.jpg','images/about1.jpg','images/about2.jpg','images/about3.jpg','images/about4.jpg','images/about5.jpg','images/about6.jpg','images/about7.jpg','images/about9.jpg','images/about10.jpg'	
);

Array.prototype.shuffle = function( b ) {
 var i = this.length, j, t;
 while( i ) {
  j = Math.floor( ( i-- ) * Math.random() );
  t = b && typeof this[i].shuffle!=='undefined' ? this[i].shuffle() : this[i];
  this[i] = this[j];
  this[j] = t;
 }
 return this;
};

first_image = rotators.shift();
rotators.shuffle();
rotators.unshift(first_image);

Event.observe(window, 'load', function(){
		for (var i in rotators) {
			images[i] = new Image();
			images[i].src = rotators[i];
		}
		setTimeout('changeImage();', delay);
});
function changeImage() {
	// first we set the background image of the .headerphoto div to the new image 0
	$('headerphotodiv').style.backgroundImage='url(' + rotators[0] + ')';
	// now fade out the image
	$('headerimg').fade();
	// change the image source
	$('headerimg').src = rotators[0];
	// and show it
	$('headerimg').show();
	// and change the background image to the next one to preload it
	$('headerphotodiv').style.backgroundImage='url(' + rotators[1] + ')';
	img = rotators.shift();
	rotators[rotators.length] = img;
	setTimeout('changeImage();', delay);
}