var upper_imgs = new Array();
var middle_imgs = new Array();
var lower_imgs = new Array();
var upper_imgs_gray = new Array();
var lower_imgs_gray = new Array();
var texts = new Array();

var upper_index = 0;
var lower_index = 0;

function preloadImages() {
	for (var h = 0; h < 5; h++)
	{
		var args = preloadImages.arguments[h];
		var len = args.length;
		var i, j = 0;
		for (i = 0; i < len;) {
			var row = new Array();
			for (j = 0; j < len; j++) {
				row[j] = new Image;
				row[j].src = args[i++];
			}
		}
		if (h == 0)
		{
			upper_imgs = row;
		}
		else if (h == 1)
		{
			upper_imgs_gray = row;
		}
		else if (h == 2)
		{
			lower_imgs = row;
		}
		else if (h == 3)
		{
			lower_imgs_gray = row;
		}
		else
		{
			middle_imgs = row;
		}
	}
}

function preloadTexts() {
	texts = txts;
}

function load()
{ 
	preloadImages(upper_strip, upper_strip_gray, lower_strip, lower_strip_gray, middle_strip);
	preloadTexts();
}

function swap(img, ooo) // out-or-over
{
	var id = img.id;
	var over = (ooo == "over");
	var upper_length = upper_imgs.length;
	var lower_length = lower_imgs.length;
	if (id == "upper_first")
	{
		if (over)
		{
			img.src = upper_imgs[upper_index].src;
		}
		else
		{
			img.src = upper_imgs_gray[upper_index].src;
		}		
	}
	else if (id == "upper_second")
	{
		if (over)
		{
			img.src = upper_imgs[(upper_index + 1) % upper_length].src;
		}
		else
		{
			img.src = upper_imgs_gray[(upper_index + 1) % upper_length].src;
		}	
	}	
	else if (id == "upper_third")
	{
		if (over)
		{	
			img.src = upper_imgs[(upper_index + 2) % upper_length].src;
		}
		else
		{
			img.src = upper_imgs_gray[(upper_index + 2) % upper_length].src;
		}
	}	
	else if (id == "lower_first")
	{
		if (over)
		{
			img.src = lower_imgs[lower_index].src;
		}
		else
		{
			img.src = lower_imgs_gray[lower_index].src;
		}
	}	
	else if (id == "lower_second")
	{
		if (over)
		{
			img.src = lower_imgs[(lower_index + 1) % lower_length].src;
		}
		else
		{
			img.src = lower_imgs_gray[(lower_index + 1) % lower_length].src;
		}	
	}	
	else if (id == "lower_third")
	{
		if (over)
		{
			img.src = lower_imgs[(lower_index + 2) % lower_length].src;
		}
		else
		{
			img.src = lower_imgs_gray[(lower_index + 2) % lower_length].src;
		}	
	}	
}

function move_upper_strip(lor) // left-or-right
{
	var new_upper_index = (upper_index + lor) % (upper_imgs.length); 
	if (new_upper_index < 0)
	{
		new_upper_index += upper_imgs.length;
	}
	document.getElementById("upper_first").src = upper_imgs_gray[new_upper_index].src;
	document.getElementById("upper_second").src = upper_imgs_gray[(new_upper_index + 1) % (upper_imgs.length)].src;
	document.getElementById("upper_third").src = upper_imgs_gray[(new_upper_index + 2) % (upper_imgs.length)].src;
	upper_index = new_upper_index;
}

function move_lower_strip(lor) // left-or-right
{
	var new_lower_index = (lower_index + lor) % (lower_imgs.length); 
	if (new_lower_index < 0)
	{
		new_lower_index += lower_imgs.length;
	}
	document.getElementById("lower_first").src = lower_imgs_gray[new_lower_index].src;
	document.getElementById("lower_second").src = lower_imgs_gray[(new_lower_index + 1) % (lower_imgs.length)].src;
	document.getElementById("lower_third").src = lower_imgs_gray[(new_lower_index + 2) % (lower_imgs.length)].src;
	lower_index = new_lower_index;
}

function show_middle_strip(img)
{	
	var middle_index;
	var upper_offset = upper_imgs.length;
	var lower_offset = lower_imgs.length;
	var id = img.id;
	if (id == "upper_first")
	{
		middle_index = upper_index;
	}
	else if (id == "upper_second")
	{
		middle_index = (upper_index + 1) % upper_offset;
	}	
	else if (id == "upper_third")
	{
		middle_index = (upper_index + 2) % upper_offset;
	}	
	else if (id == "lower_first")
	{
		middle_index = lower_index + upper_offset;
	}	
	else if (id == "lower_second")
	{
		middle_index = ((lower_index + 1) % lower_offset) + upper_offset;
	}	
	else if (id == "lower_third")
	{
		middle_index = ((lower_index + 2) % lower_offset) + upper_offset;
	}
	document.getElementById("middle_strip").src	= middle_imgs[middle_index].src;
	document.getElementById("maintext").innerHTML = texts[middle_index];
}
