var selected_thumb;
var thumbs = new Array();
var max_thumbs = 6;
var current_pos = 0;

function bb_change_images(thumb_id, img_src)
{
	bb_remove_image();
	window.setTimeout('bb_appear_image(\'' + img_src + '\')', 1000);
	bb_select_thumb(thumb_id);
}

function bb_remove_image()
{
	$('big_img').fade();
}

function bb_appear_image(img_src)
{
	var new_img = '<img src="' + img_src + '" id="big_img" style="display: none;"/>';
	$('big_img_wrapper').innerHTML = new_img;
	$('big_img').appear({duration: 1.0});
}

function bb_init_images()
{
	thumbs = $('img_preview').getElementsByTagName('img');
	
	for(i = 0; i < thumbs.length; i++)
	{
		thumbs[i].fade({duration:0, from: 1, to:0.4});
	}
	
	for(i = max_thumbs; i < thumbs.length; i++)
	{
		thumbs[i].setStyle({display: 'none'});
	}
	
	if(thumbs.length > max_thumbs)
	{
		$('next_nav').innerHTML = '<img src="i/next.gif"  onclick="bb_scroll_right()"/>';
	}
	
	bb_select_thumb(thumbs[0]);
}

function bb_select_thumb(thumb_id)
{
	thumb_id.fade({duration:0, from: 0.4, to:1});
	if(selected_thumb)
	{
		selected_thumb.fade({duration:0, from: 1, to:0.4});
	}
	selected_thumb = thumb_id;
}

function bb_scroll_right()
{
	var start_pos = current_pos + max_thumbs;
	if(thumbs.length <= (start_pos + max_thumbs))
	{
		end_pos = thumbs.length;
		$('next_nav').innerHTML = '<img src="i/next_off.gif"/>';
	}
	else
	{
		end_pos = start_pos + max_thumbs;
	}
	
	bb_display_thumbs(start_pos, end_pos);
	$('prev_nav').innerHTML = '<img src="i/previous.gif"  onclick="bb_scroll_left()"/>';
	current_pos = start_pos;
}

function bb_scroll_left()
{
	var start_pos = current_pos - max_thumbs;
	if(start_pos <= 0)
	{
		start_pos = 0;
		$('prev_nav').innerHTML = '<img src="i/previous_off.gif"/>';
	}
	end_pos = start_pos + max_thumbs;
	
	bb_display_thumbs(start_pos, end_pos);
	$('next_nav').innerHTML = '<img src="i/next.gif"  onclick="bb_scroll_right()"/>';
	current_pos = start_pos;
}

function bb_display_thumbs(start_pos, end_pos)
{
	for(i = 0; i < thumbs.length; i++)
	{
		thumbs[i].setStyle({display: 'none'});
	}
	
	for(i = start_pos; i < end_pos; i++)
	{
		thumbs[i].setStyle({display: 'block'});
	}
}
window.onload = bb_init_images;