// List of images to include in gallery
var images = new Array();
images.push( "m4_gallery/image1.png" );
images.push( "m4_gallery/image2.png" );
images.push( "m4_gallery/image3.png" );
images.push( "m4_gallery/image4.png" );
/*
images.push( "m4_gallery/image4.png" );
images.push( "m4_gallery/image3.png" );
images.push( "m4_gallery/image2.png" );
images.push( "m4_gallery/image1.png" );
*/
// Preload images
var temp_image = new Image();
var count;
for( count = 0; count < images.length; count++ ) // IE rejects 'for .. in' loops :(
{
	temp_image.src = images[ count ];
}

// Determine order for Gallery
// Number designates frame the picture will appear in, -1 will fade out all frames
//var order = new Array( 2, 3, 1, 4, -1 );
count = 0;
function nextFrame()
{
	var frame;
	if( count >= order.length )
	{
		count = 0;
	}
	frame = order[ count ];
	count++;
	return frame;
}

// Global Variables used by updateGallery
var current_frame = 0;
var temp_images = images.slice( 0, images.length );

var order = new Array( 1, 2, 3, 4 );

// Each call increments the Gallery's state
function updateGallery()
{
	// If we have run out of picture frames
	if( current_frame == 4 )
	{
		current_frame = 0; // reset current frame
		order.sort( function() { return 0.5 - Math.random() } );
		$( ".picture" ).fadeOut( "slow" ); // Fade all frames out of view
		return;
	}
	
	// If there are no more pictures to use
	if( temp_images.length == 0 )
	{
		temp_images = images.slice( 0, images.length ); // Put more images back onto the stack
		temp_images.sort( function() { return 0.5 - Math.random() } ); // Randomize order
	}
	
	document.getElementById( "picture" + order[ current_frame ] ).src = temp_images.pop(); // Pop image from stack and put it into frame
	
	$( "#picture" + order[ current_frame ] ).fadeIn( "slow" ); // Fade element into view
	
	current_frame++;
}