var banner = new Array();

banner['frame_width'] = 253;	// Width of each frame in pixels
banner['frame_duration'] = 6;	// Duration of each frame in seconds, minimum 1 second

$(document).ready(function() {

	var imgs = $('div#banner_images img');

	banner['frame_count'] = imgs.length;
	banner['frame_number'] = 0;
	if (banner['frame_duration'] < 1) banner['frame_duration'] = 1;

	$('div#banner_images').css('width',(imgs.length*banner['frame_width'])+'px');

	var banner_buttons = $('<p id="banner_buttons"></p>');
	$('div#banner').append(banner_buttons);

	$.each(imgs,function(key,img) {
		$(img).css('left',(key*banner['frame_width'])+'px');
		$(banner_buttons).append('<span frame="'+key+'" id="banner_button-'+key+'">'+(key+1)+'</span>');
	});

	$(banner_buttons).find('span').click(function() {
		banner_jumpToFrame($(this).attr('frame'));
		clearTimeout(banner['timer']);
	});

	banner_setTimer(true);
});

function banner_setTimer(start) {

	banner['timer'] = setTimeout('banner_setTimer();',banner['frame_duration']*1000);
	if (!start) banner_jumpToFrame(banner['frame_number']+1);
	else $('#banner_button-0').addClass('current_frame');
}

function banner_jumpToFrame(destination_frame) {
	destination_frame = parseInt(destination_frame);
	if (destination_frame >= banner['frame_count']) destination_frame = 0;

	$('div#banner_images').stop(true,true).animate({'left': '-'+(banner['frame_width']*destination_frame)}, 700);

	$('#banner_buttons span').removeClass('current_frame');
	$('#banner_buttons span#banner_button-'+destination_frame).addClass('current_frame');

	banner['frame_number'] = destination_frame;
}