var fade_speed = 1000;
var slide_speed = 5000;
var previous_id = 0;
var timer_id = 0;
function slide(current_id) {
	clearTimeout(timer_id);
	current_id = parseInt(current_id);
	var next_id = current_id + 1;
	if ($('.still_frame').length < next_id)
		next_id = 1;
	timer_id = setTimeout(function() {
		slide(next_id);
	}, slide_speed);
	if (current_id != previous_id) {
		$('.' + previous_id).css('opacity', .75);
		$('#still_frame_' + previous_id).fadeOut(fade_speed);
		$('.' + current_id).css('opacity', 1);
		$('#still_frame_' + current_id).fadeIn(fade_speed, function() {
			previous_id = current_id;
		});	
	} 
}			
$(document).ready(function() {
	$('.still_frame').each(function() {
		var id = $(this).attr('class').split(' ')[1];

		if (previous_id == 0) {
			previous_id = id;
			slide(1); 
		}
		else
			$(this).css('opacity', .75);
		$('<img id="still_frame_' + id + '" style="display: none; position: absolute; top: 145px; left: 212px;" src="' + project_path + id + '.jpg" alt="" />').appendTo('body');					
		$(this).bind('click', function() {
			slide($(this).attr('class').split(' ')[1]);
		});
	});
});