// JavaScript Document

/*
 Class thumbBarTarget
*/
function thumbBarTarget(x, y, w, h,loadingImg)
{
	this.xpos = x;
	this.ypos = y;
	this.width = w;
	this.height = h;
	this.dest_ratio = w/h;
	this.img = new Image();
	this.loadimg = new Image();
	this.loadimg.src  = loadingImg;
	this.destimg = -1;
	this.rotation = 0;
	this.nextimgX = 0;
	this.nextimgY = 0;
	this.nextimgW = 0;
	this.nextimgH = 0;
	
	var myClass = this;
	function imgLoadHandler()
	{
		myClass.ob_img.src = myClass.img.src;
		myClass.ob_img.width = myClass.nextimgW;
		myClass.ob_img.height = myClass.nextimgH;
		myClass.ob_base.style.left = myClass.nextimgX + myClass.xpos + "px";
		myClass.ob_base.style.top = myClass.nextimgY + myClass.ypos + "px";
		myClass.ob_base.style.visibility = "visible";
		myClass.ob_loading.style.visibility = "hidden";
	}

	document.write("<div id=\"thumbbarTarget\" STYLE=\"position:absolute; visibility:hidden; left: "+x+"px; top: "+y+"px; z-index: 0; \"><table color=\"#FFFFFF\" bgcolor=\"#000000\"><tr><td><img id=\"thumbbarTargetImg\" src=\"\" alt=\"\" border=\"0\" ></td></tr></table></div>");
	
	document.write("<div id=\"tbtLoading\" STYLE=\"position:absolute; visibility:hidden; left: "+x+"px; top: "+y+"px; z-index: 200; \"><img id=\"tbtLoadingImg\" src=\"\" alt=\"\" border=\"0\" ></div>");

	this.ob_base = document.getElementById("thumbbarTarget");
	this.ob_img = document.getElementById("thumbbarTargetImg");

	this.ob_loading = document.getElementById("tbtLoading");
	this.ob_loading_img = document.getElementById("tbtLoadingImg");

	this.ob_loading_img.src = this.loadimg.src;

	this.img.onload = imgLoadHandler;
	
}

thumbBarTarget.prototype.resetRotation = function()
{
	this.rotation = 0;
}

thumbBarTarget.prototype.incRotation = function(rotVal)
{
	this.rotation += rotVal;
	while (this.rotation < 0) this.rotation += 360;
	while (this.rotation > 360) this.rotation -= 360;
}

thumbBarTarget.prototype.SetImage = function(img, w, h, destimg)
{
	
	if (this.rotation == 90 || this.rotation == 270)
	{
		var t = w;
		w = h;
		h = t;
	}

	var ratio = w / h;


	this.destimg = destimg;
	
	this.nextimgW = this.width;
	this.nextimgH = this.height;

	if (w > h * this.dest_ratio)
	{
		this.nextimgH = this.width / ratio;
	}
	else
	{
		this.nextimgW = this.height * ratio;
	}

	// The loading image may not be loaded yet (lol)
	// Check it's size first before displaying it
	if (this.loadimg.width > 0 && this.loadimg.height > 0)
	{
		var lx = ((this.width - this.loadimg.width) / 2 + this.xpos);
		var ly = ((this.height - this.loadimg.height) / 2) + this.ypos;
		this.ob_loading.style.left = lx + "px";
		this.ob_loading.style.top = ly + "px";
		this.ob_loading.style.visibility = "visible";
	}
	
	// Replace the rotation with the new rotation
	img_d = img.replace("&rot=0", "&rot=" + this.rotation);

	this.img.src = img_d; // Start loading the new image
	this.nextimgX = (this.width - this.nextimgW) / 2;
	this.nextimgY = (this.height - this.nextimgH) / 2;
}

/*
 Class thumbBar
 */
function thumbBar(name, x, y, steps, speed, tx, ty, tw, th, bclr, loadimgsrc)
{
	this.name = name;
	this.xpos = x;
	this.ypos = y;
	this.target = new thumbBarTarget(tx, ty, tw, th, loadimgsrc);
	this.bInSlideshow = false;
	this.slideshowNextTimer = 0;
	this.borderclr = bclr;
	
	document.write("<div id=\"thumbbar\" STYLE=\"position:absolute; display:inline; visibility:hidden; left: 100px; top: 10px; z-index: 0; width: 500px; height: 500px;\"><img id=\"thumbbar_img\" src=\"\" alt=\"\" border=\"0\"></div>");

	document.write("<div id=\"tb_prev\" STYLE=\"position:absolute; display:inline; visibility:hidden; left: 100px; top: 10px; z-index: 200; \"><img id=\"tb_prev_img\" src=\"\" alt=\"\" border=\"0\"></div>");

	document.write("<div id=\"tb_next\" STYLE=\"position:absolute; display:inline; visibility:hidden; left: 100px; top: 10px; z-index: 200; \"><img id=\"tb_next_img\" src=\"\" alt=\"\" border=\"0\"></div>");

	document.write("<div id=\"tb_rl\" STYLE=\"position:absolute; display:inline; visibility:hidden; left: 100px; top: 10px; z-index: 200; \"><img id=\"tb_rl_img\" src=\"\" alt=\"\" border=\"0\"></div>");

	document.write("<div id=\"tb_rr\" STYLE=\"position:absolute; display:inline; visibility:hidden; left: 100px; top: 10px; z-index: 200; \"><img id=\"tb_rr_img\" src=\"\" alt=\"\" border=\"0\"></div>");

	document.write("<div id=\"tb_play\" STYLE=\"position:absolute; display:inline; visibility:hidden; left: 100px; top: 10px; z-index: 200; \"><img id=\"tb_play_img\" src=\"\" alt=\"\" border=\"0\"></div>");

	document.write("<div id=\"tb_pause\" STYLE=\"position:absolute; display:inline; visibility:hidden; left: 100px; top: 10px; z-index: 200; \"><img id=\"tb_pause_img\" src=\"\" alt=\"\" border=\"0\"></div>");

	this.ob_base = document.getElementById("thumbbar");
	this.ob_base_img = document.getElementById("thumbbar_img");
	
	this.ob_prev = document.getElementById("tb_prev");
	this.ob_prev_img = document.getElementById("tb_prev_img");
	this.ob_prev_a = document.getElementById("tb_prev_a");

	this.ob_next = document.getElementById("tb_next");
	this.ob_next_img = document.getElementById("tb_next_img");

	this.ob_rr = document.getElementById("tb_rr");
	this.ob_rr_img = document.getElementById("tb_rr_img");

	this.ob_rl = document.getElementById("tb_rl");
	this.ob_rl_img = document.getElementById("tb_rl_img");

	this.ob_play = document.getElementById("tb_play");
	this.ob_play_img = document.getElementById("tb_play_img");

	this.ob_pause = document.getElementById("tb_pause");
	this.ob_pause_img = document.getElementById("tb_pause_img");

	this.ob_div = new Array();
	this.ob_tbl = new Array();
	this.ob_img = new Array();

	this.tx = new Array();
	this.ty = new Array();
	this.tw = new Array();
	this.th = new Array();

	this.zOrder = new Array();

	this.image_names=new Array();
	this.cur_pos = 0;
	this.max_pos = 0;
	this.rotate_step = 0;
	this.num_steps = steps;
	this.speed = speed;
	this.curimg = 0;

	this.tx[0] = 44;
	this.ty[0] = 43;
	this.tw[0] = 42;
	this.th[0] = 28;
	
	this.tx[1] = 23;
	this.ty[1] = 29;
	this.tw[1] = 85;
	this.th[1] = 57;
	
	this.tx[2] = 119;
	this.ty[2] = 12;
	this.tw[2] = 112;
	this.th[2] = 75;
	
	this.tx[3] = 256;
	this.ty[3] = 4;
	this.tw[3] = 129;
	this.th[3] = 86;
	
	this.tx[4] = 410;
	this.ty[4] = 12;
	this.tw[4] = 112;
	this.th[4] = 75;
	
	this.tx[5] = 534;
	this.ty[5] = 29;
	this.tw[5] = 85;
	this.th[5] = 57;
	
	this.tx[6] = 555;
	this.ty[6] = 43;
	this.tw[6] = 42;
	this.th[6] = 28;
	
	this.zOrder[0] = 10;
	this.zOrder[1] = 20;
	this.zOrder[2] = 30;
	this.zOrder[3] = 40;
	this.zOrder[4] = 30;
	this.zOrder[5] = 20;
	this.zOrder[6] = 10;

	var myClass = this;
	function _imgClick0()
	{
		myClass.OnImgClick(0);
	}
	function _imgClick1()
	{
		myClass.OnImgClick(1);
	}
	function _imgClick1()
	{
		myClass.OnImgClick(1);
	}
	function _imgClick2()
	{
		myClass.OnImgClick(2);
	}
	function _imgClick3()
	{
		myClass.OnImgClick(3);
	}
	function _imgClick4()
	{
		myClass.OnImgClick(4);
	}
	function _imgClick5()
	{
		myClass.OnImgClick(5);
	}
	function _imgClick6()
	{
		myClass.OnImgClick(6);
	}

	for (var i = 0; i < 7; i++)
	{
		if (this.borderclr != "false")
		{
			document.write("<div id=\"thumb" + i + "\" STYLE=\"position:absolute; visibility:hidden; left: 100px; top: 10px; z-index: 0; bgcolor: 00FF00\"><table border=\"0\" cellpadding=\"2\" cellspacing=\"0\" bgcolor=\"#"+this.borderclr+"\" id=\"thumb" + i + "_tbl\"><tr><td align=\"center\"><img id=\"thumb" + i + "_img\" src=\"\" alt=\"\" border=\"0\"></td></tr></table></div>");
		} 
		else
		{
			document.write("<div id=\"thumb" + i + "\" STYLE=\"position:absolute; visibility:hidden; left: 100px; top: 10px; z-index: 0; bgcolor: 00FF00\"><table border=\"0\" cellpadding=\"2\" cellspacing=\"0\" id=\"thumb" + i + "_tbl\"><tr><td align=\"center\"><img id=\"thumb" + i + "_img\" src=\"\" alt=\"\" border=\"0\"></td></tr></table></div>");
		}
		
		this.ob_div[i] = document.getElementById("thumb"+i.toString());
		this.ob_tbl[i] = document.getElementById("thumb"+i.toString()+"_tbl");
		this.ob_img[i] = document.getElementById("thumb"+i.toString()+"_img");
		this.ob_div[i].tbpos = i;
		this.ob_div[i].imgpos = -1;
		this.ob_div[i].onclick = eval("_imgClick" + i.toString());

	}

}

thumbBar.prototype.BtnUp = function(ob)
{
	var object = document.getElementById(ob);
	if (object)
	{
		object.src = object.upsrc;
	}
}

thumbBar.prototype.setImage = function(ob, xp, yp, up, dn)
{
	var ob_img = ob + "_img";
	var object = document.getElementById(ob_img);
	if (object)
	{
		object.src = up;
		object.upsrc = up;
		object.dnsrc = dn;
		var object_div = document.getElementById(ob);
		if (object_div)
		{
			object_div.style.left = this.xpos + xp + "px";
			object_div.style.top = this.ypos + yp + "px";
		}
	}
	else
	{
		alert("Unable to locate image: " + ob);
	}

}

thumbBar.prototype.OnImgClick = function(img)
{
	var pos = (this.cur_pos -3)	+ this.ob_div[img].tbpos;
	if (pos < 0) pos = this.max_pos + pos;
	if (pos >= this.max_pos) pos -= this.max_pos;
	
	while (this.cur_pos != pos)
	{
		this.step_left(false);
	}
	this.display();
	
	this.target.resetRotation();
	this.target.SetImage(this.image_names[this.cur_pos][0], parseInt(this.image_names[this.cur_pos][2]), parseInt(this.image_names[this.cur_pos][3]), this.cur_pos);
}

thumbBar.prototype.incSlideshow = function()
{
	this.target.resetRotation();
	this.step_left(true);
	this.target.SetImage(this.image_names[this.cur_pos][0], parseInt(this.image_names[this.cur_pos][2]), parseInt(this.image_names[this.cur_pos][3]));
}

thumbBar.prototype.clickBtn = function(ob_img_name)
{
	var ob_img = document.getElementById(ob_img_name);
	if (ob_img)
	{
		ob_img.src = ob_img.dnsrc;
		setTimeout(this.name + ".BtnUp('" + ob_img_name + "')", 150);
	}
		   
	if (ob_img_name == "tb_next_img")
	{
		this.target.resetRotation();
		this.beginRotateLeft();
	}
		
	if (ob_img_name == "tb_prev_img")
	{
		this.target.resetRotation();
		this.beginRotateRight();
	}
	
	if (ob_img_name == "tb_rr_img")
	{
		this.target.incRotation(-90);
		this.target.SetImage(this.image_names[this.cur_pos][0], parseInt(this.image_names[this.cur_pos][2]), parseInt(this.image_names[this.cur_pos][3]), this.cur_pos);
	}

	if (ob_img_name == "tb_rl_img")
	{
		this.target.incRotation(90);
		this.target.SetImage(this.image_names[this.cur_pos][0], parseInt(this.image_names[this.cur_pos][2]), parseInt(this.image_names[this.cur_pos][3]), this.cur_pos);
	}

	if (ob_img_name == "tb_play_img")
	{
		var myClass = this;
		function _beginSlideshow()
		{
			myClass.beginRotateLeft();
		}
		
		// Start Slideshow
		this.bInSlideshow = true;
		setTimeout(_beginSlideshow, 1000);
		this.display();
	}
	if (ob_img_name == "tb_pause_img")
	{
		// Stop Slideshow
		this.bInSlideshow = false;
		if (this.slideshowNextTimer)
			clearTimeout(this.slideshowNextTimer);
		this.slideshowNextTimer = 0;
		this.display();
	}
}

thumbBar.prototype.initBtns = function()
{
	var myClass = this;
	function _clickPrev()
	{
		myClass.clickBtn("tb_prev_img");
	}
	function _clickNext()
	{
		myClass.clickBtn("tb_next_img");
	}
	function _clickRR()
	{
		myClass.clickBtn("tb_rr_img");
	}
	function _clickRL()
	{
		myClass.clickBtn("tb_rl_img");
	}
	function _clickRL()
	{
		myClass.clickBtn("tb_rl_img");
	}
	function _clickPlay()
	{
		myClass.clickBtn("tb_play_img");
	}
	function _clickPause()
	{
		myClass.clickBtn("tb_pause_img");
	}
	
	this.ob_prev.onclick = _clickPrev;
	this.ob_next.onclick = _clickNext;
	this.ob_rr.onclick = _clickRR;
	this.ob_rl.onclick = _clickRL;
	this.ob_play.onclick = _clickPlay;
	this.ob_pause.onclick = _clickPause;

	if (this.bInSlideshow)
	{
		this.ob_prev.style.visibility = "hidden";
		this.ob_next.style.visibility = "hidden";
		this.ob_rl.style.visibility = "hidden";
		this.ob_rr.style.visibility = "hidden";
		this.ob_play.style.visibility = "hidden";
		this.ob_pause.style.visibility = "visible";
	}
	else
	{
		this.ob_prev.style.visibility = "visible";
		this.ob_next.style.visibility = "visible";
		this.ob_rl.style.visibility = "visible";
		this.ob_rr.style.visibility = "visible";
		this.ob_play.style.visibility = "visible";
		this.ob_pause.style.visibility = "hidden";
	}
}

thumbBar.prototype.display = function()
{
	this.ob_base.style.left=this.xpos+'px';
	this.ob_base.style.top=this.ypos+'px';
	this.ob_base.style.visibility="visible";

	this.initBtns();
	
	for (var i = 0; i < 7; i++)
	{
		var pos = (this.cur_pos - 3) + i;
		if (pos < 0) pos = this.max_pos + pos;
		if (pos >= this.max_pos) pos -= this.max_pos;

		var orgw = parseInt(this.image_names[pos][2]);
		var orgh = parseInt(this.image_names[pos][3]);
		var ratio = orgw/orgh;
		var w = this.tw[i];
		var h = this.th[i];
		
		if (orgw/1.5 < orgh)
		{
			// Tall image
			w = h * ratio;
		}
		else
		{
			h = w / ratio;
		}
		this.ob_div[i].style.visibility="hidden";

		this.ob_tbl[i].bgcolor="#FF0000";
		this.ob_img[i].src = this.image_names[pos][1];
		this.ob_div[i].style.left = this.tx[i] + this.xpos + 'px';
		this.ob_div[i].style.top = this.ty[i] + this.ypos + 'px';
		this.ob_div[i].style.zIndex = this.zOrder[i];
		this.ob_tbl[i].width = this.tw[i];

		this.ob_img[i].width=w;
		this.ob_img[i].height=h;

		this.ob_div[i].imgpos = pos;

		if (i == 0 || i == 6)
			this.ob_div[i].style.visibility="hidden";
		else		
			this.ob_div[i].style.visibility="visible";
	}
}

thumbBar.prototype.rotateRight = function(step, num_steps)
{
	this.ob_base.style.left = this.xpos + 'px';
	this.ob_base.style.top = this.ypos + 'px';
	this.ob_base.style.visibility = "visible";
	
	for (var i = 0; i < 7; i++)
	{
		var pos = (this.cur_pos - 3) + i;
		if (pos < 0) pos = this.max_pos + pos;
		if (pos >= this.max_pos) pos -= this.max_pos;
		
		var sx = this.tx[i];
		var sy = this.ty[i];
		var dx = sx;
		var dy = sy;

		if (i != 6)
		{
			dx = this.tx[i+1];
			dy = this.ty[i+1];
		}
		var cx = sx + (((dx-sx)/num_steps) * step);
		var cy = sy + (((dy-sy)/num_steps) * step);

		var orgw = parseInt(this.image_names[pos][2]);
		var orgh = parseInt(this.image_names[pos][3]);
		var ratio = orgw/orgh;
		var sw = this.tw[i];
		var sh = this.th[i];
		var dw = sw;
		var dh = sh;
		
		if (i != 6)
		{
			dw = this.tw[i+1];
			dh = this.th[i+1];
		}
		if (orgw/1.5 < orgh)
		{
			// Tall image
			sw = sh * ratio;
			dw = dh * ratio;
		}
		else
		{
			sh = sw / ratio;
			dh = dw / ratio;
		}
		var cw = sw + (((dw-sw)/num_steps) * step);
		var ch = sh + (((dh-sh)/num_steps) * step);

		var stw = this.tw[i];
		var dtw = stw;
		if (i != 6)
		{
			dtw = this.tw[i+1];
		}
		tbw = stw + (((dtw-stw)/num_steps) * step);

		this.ob_div[i].style.left = cx + this.xpos + 'px';
		this.ob_div[i].style.top = cy + this.ypos + 'px';
		this.ob_div[i].style.zIndex = this.zOrder[i];
		if (i == 6)
			this.ob_div[i].style.visibility = "hidden";
		else		
			this.ob_div[i].style.visibility = "visible";
		
		this.ob_tbl[i].width = tbw;

		this.ob_img[i].src = this.image_names[pos][1];
		this.ob_img[i].width = cw;
		this.ob_img[i].height = ch;

	}
	
	var myClass = this;
	function rotateRightTimer2()
	{
		myClass.rotateRight(myClass.rotate_step++, myClass.num_steps);
	}

	function stepRightTimer2()
	{
		myClass.step_right(true);
	}

	if (this.rotate_step < this.num_steps)
	{
		setTimeout(rotateRightTimer2, this.speed);
	}
	else
	{
		setTimeout(stepRightTimer2, this.speed);
	}
	
}

thumbBar.prototype.rotateLeft = function(step, num_steps)
{
	this.ob_base.style.left = this.xpos + 'px';
	this.ob_base.style.top = this.ypos + 'px';
	this.ob_base.style.visibility = "visible";
	
	for (var i = 0; i < 7; i++)
	{
		var pos = (this.cur_pos - 3) + i;
		if (pos < 0) pos = this.max_pos + pos;
		if (pos >= this.max_pos) pos -= this.max_pos;
		
		var sx = this.tx[i];
		var sy = this.ty[i];
		var dx = sx;
		var dy = sy;

		if (i != 0)
		{
			dx = this.tx[i-1];
			dy = this.ty[i-1];
		}
		var cx = sx + (((dx-sx)/num_steps) * step);
		var cy = sy + (((dy-sy)/num_steps) * step);

		var orgw = parseInt(this.image_names[pos][2]);
		var orgh = parseInt(this.image_names[pos][3]);
		var ratio = orgw/orgh;
		var sw = this.tw[i];
		var sh = this.th[i];
		var dw = sw;
		var dh = sh;
		
		if (i != 0)
		{
			dw = this.tw[i-1];
			dh = this.th[i-1];
		}
		if (orgw/1.5 < orgh)
		{
			// Tall image
			sw = sh * ratio;
			dw = dh * ratio;
		}
		else
		{
			sh = sw / ratio;
			dh = dw / ratio;
		}
		var cw = sw + (((dw-sw)/num_steps) * step);
		var ch = sh + (((dh-sh)/num_steps) * step);

		var stw = this.tw[i];
		var dtw = stw;
		if (i != 0)
		{
			dtw = this.tw[i-1];
		}
		tbw = stw + (((dtw-stw)/num_steps) * step);

		this.ob_div[i].style.left = cx + this.xpos + 'px';
		this.ob_div[i].style.top = cy + this.ypos + 'px';
		this.ob_div[i].style.zIndex = this.zOrder[i];
		if (i == 0)
			this.ob_div[i].style.visibility = "hidden";
		else		
			this.ob_div[i].style.visibility = "visible";
		
		this.ob_tbl[i].width = tbw;

		this.ob_img[i].src = this.image_names[pos][1];
		this.ob_img[i].width = cw;
		this.ob_img[i].height = ch;

	}
	
	var myClass = this;
	function rotateLeftTimer2()
	{
		myClass.rotateLeft(myClass.rotate_step++, myClass.num_steps);
	}

	function stepLeftTimer2()
	{
		myClass.step_left(true);
		
		function _slideshowNext()
		{
			myClass.beginRotateLeft();
		}
		if (myClass.bInSlideshow)
		{
			myClass.target.SetImage(myClass.image_names[myClass.cur_pos][0], parseInt(myClass.image_names[myClass.cur_pos][2]), parseInt(myClass.image_names[myClass.cur_pos][3]));
			myClass.slideshowNextTimer = setTimeout(_slideshowNext, 5000);
		}
	}

	if (this.rotate_step < this.num_steps)
	{
		setTimeout(rotateLeftTimer2, this.speed);
	}
	else
	{
		setTimeout(stepLeftTimer2, this.speed);
	}
	
}

thumbBar.prototype.beginRotateRight = function()
{
	this.rotate_step = 0;
	
	var myClass = this;
	function rotateRightTimer()
	{
		myClass.rotateRight(myClass.rotate_step++, myClass.num_steps);
	}
	setTimeout(rotateRightTimer, this.speed);
}

thumbBar.prototype.beginRotateLeft = function()
{
	this.rotate_step = 0;
	
	var myClass = this;
	function rotateLeftTimer()
	{
		myClass.rotateLeft(myClass.rotate_step++, myClass.num_steps);
	}
	setTimeout(rotateLeftTimer, this.speed);
}

thumbBar.prototype.step_right = function(bDisplay)
{
	var pos = (this.cur_pos - 3);

	if (this.cur_pos > 0) this.cur_pos--;
	else this.cur_pos = this.max_pos-1;

	if (pos < 0) pos = this.max_pos + pos;
	if (pos > this.max_pos) pos = 0;

	var tmpob_div = this.ob_div[6];
	var tmpob_tbl = this.ob_tbl[6];
	var tmpob_img = this.ob_img[6];
	for (var i = 6; i > 0; i--)
	{
		this.ob_div[i] = this.ob_div[i-1];
		this.ob_tbl[i] = this.ob_tbl[i-1]
		this.ob_img[i] = this.ob_img[i-1];
	}
	this.ob_div[0] = tmpob_div;
	this.ob_tbl[0] = tmpob_tbl;
	this.ob_img[0] = tmpob_img;
	
	for (var ii = 0; ii < 2; ii++)
	{
		var tmptbpos = this.ob_div[0].tbpos;
		for (var j = 0; j < 6; j++)
		{
			this.ob_div[j].tbpos = this.ob_div[j+1].tbpos;
		}
		this.ob_div[6].tbpos = tmptbpos;
	}
	
	if (bDisplay) this.display();
}

thumbBar.prototype.step_left = function(bDisplay)
{
	var pos = (this.cur_pos - 3) - 1;

	if (this.cur_pos < this.max_pos-1) this.cur_pos++;
	else this.cur_pos = 0;

	if (pos < 0) pos = this.max_pos + pos;
	if (pos > this.max_pos) pos = 0;
	
	var tmpob_div = this.ob_div[0];
	var tmpob_tbl = this.ob_tbl[0];
	var tmpob_img = this.ob_img[0];
	for (var i = 0; i < 6; i++)
	{
		this.ob_div[i] = this.ob_div[i+1];
		this.ob_tbl[i] = this.ob_tbl[i+1]
		this.ob_img[i] = this.ob_img[i+1];
	}
	this.ob_div[6] = tmpob_div;
	this.ob_tbl[6] = tmpob_tbl;
	this.ob_img[6] = tmpob_img;

	for (var ii = 0; ii < 2; ii++)
	{
		var tmptbpos = this.ob_div[6].tbpos;
		for (var j = 6; j > 0; j--)
		{
			this.ob_div[j].tbpos = this.ob_div[j-1].tbpos;
		}
		this.ob_div[0].tbpos = tmptbpos;
	}
	
	if (bDisplay) this.display();
}


thumbBar.prototype.add = function(pic, thumb, w, h)
{
	this.image_names[this.max_pos] = new Array();
	this.image_names[this.max_pos][0] = pic;
	this.image_names[this.max_pos][1] = thumb;
	this.image_names[this.max_pos][2] = w;
	this.image_names[this.max_pos][3] = h;
	
	if (this.max_pos == 0)
		this.target.SetImage(pic, parseInt(w), parseInt(h), 0)

	this.max_pos++;
}