//menu functions

//ihoapm@gmail.com

function getObj(id)

{

	return document.getElementById(id);

}



function offsetLeft(o)

{

	var i = 0;

	while(o!=null && o.offsetParent!=null) 

	{

		i += o.offsetLeft;

		o = o.offsetParent;

	}

	return i + (o ? o.offsetLeft : 0);

}



function offsetTop(o)

{

	var i = 0;

	while (o!=null && o.offsetParent!=null) 

	{

		i += o.offsetTop;

		o = o.offsetParent;

	}

	return i + (o ? o.offsetLeft : 0);

}



function setFocus(controlName)

{	

	var ctrl = document.all(controlName);

	if(!ctrl && !(ctrl = document.getElementById(controlName)))

		return;

	if(ctrl.length)

		ctrl = ctrl[0];

	if(ctrl.type=="text")

	{

		ctrl.focus();

		ctrl.value = ctrl.value + "";

		ctrl.select();

	}

	else

	{

		ctrl.focus();

	}

}



function _preloadImages() 

{

	/*var d=document; 

	if(d.images)

	{ 

		if(!d.MM_p) 

			d.MM_p=new Array();

		var i, j=d.MM_p.length, a =_preloadImages.arguments; 

		for(i=0; i<a.length; i++)

			if(a[i].indexOf("#")!=0)

			{

				d.MM_p[j] = new Image; 

				d.MM_p[j++].src = a[i];

			}

	}*/

	if(arguments.length)

	{

		var s = "";

		for(i=0; i<arguments.length; ++i)

		{

			s += "<img src='images/" + arguments[i] + "' style='width:1px;'/>";

		}

		odiv = document.createElement("div");

		odiv.style.visibility = "hidden"; odiv.style.height = "1px";

		odiv.innerHTML = s;		

		document.body.appendChild(odiv);

	}	

}	



function swapBkg(obj, fhover)

{

	src = "images/" + (fhover ? "#F5F5F5" : "#FFFAFA");

	obj.style.background =  (fhover ? "#F5F5F5" : "#FFFAFA"); //"url(" + src + ")";

}

//////////////////////////////////////////////////////////////////////////////////////////////////////////

//////////////////////////////////////////////////////////////////////////////////////////////////////////

var prevId = "";

var nHideTimer = 0;

var oPrevPopup = null;

var oMenuCon = null;

var hideDy = 1;

function hideMenu(id)

{

	var obj = getObj(prevId);

	if(obj)

	{

		obj.style.display = "none";

	}

	if(oPrevPopup)

	{

		oPrevPopup.childNodes[0].style.color = "#0095D9";

	}

	prevId = "";

}



function startShow(otd, menu_id, flag)

{

	if(!flag)

	{

		nHideTimer = setTimeout("hideMenu()", 200);

		return;

	}

	

	if(nHideTimer)

	{

		clearTimeout(nHideTimer);

		nHideTimer = 0;

	}

	if(prevId != menu_id)

	{

		hideMenu();

		prevId = menu_id;

	}

		

	var menu = getObj(menu_id);

	if(!menu)

		return;

	if(otd && otd.offsetParent)

	{			

		otd = otd.offsetParent;

		x = offsetLeft(otd);

		y = offsetTop(otd);

		menu.style.display = "block";

		right = offsetLeft(oMenuCon) + oMenuCon.offsetWidth;

		if(right < menu.offsetWidth + x)

			x = offsetLeft(oMenuCon) + oMenuCon.offsetWidth - menu.offsetWidth;

		menu.style.left = x + "px";

		menu.style.top = (y + otd.offsetHeight - 2) + "px";

		otd.childNodes[0].style.color = "#003369";

		oPrevPopup = otd;

	}		

}



function buildMenu(container, type, selectedMenu)

{

	var items = LPMENUS;

	var strMenu = "";

	for(i=0; i<items.length; ++i)

	{

		module = items[i][1];

		menu_id = "navbar_popup_" + i;

		if(typeof(module)!="string")

			module = "#";

		if(selectedMenu!=module)			

			strMenu += "<td align='center' class='lheader'><a class='popup' href='?m=" + module + "' onmouseover=\"startShow(this,'" + menu_id + "',true);\" onmouseout=\"startShow(this,'" + menu_id + "',false)\">" + items[i][0] + "</a></td>";

		else

			strMenu += "<td align='center' class='selheader'><a class='popup' href='?m=" + module + "' onmouseover=\"startShow(this,'" + menu_id + "',true);\" onmouseout=\"startShow(this,'" + menu_id + "',false)\">" + items[i][0] + "</a></td>";

		

		if(items[i].length > 2)

		{

			var omenu = document.createElement("div");

			omenu.id = menu_id;

			omenu.style.position = "absolute";

			omenu.style.display = "none";

			omenu.style.background = "url(images/silveribg.jpg)";

			omenu.style.paddingTop = "3px";

			omenu.style.paddingBottom = "3px";

			omenu.style.borderBottom = "1px solid #EEEEEE";

			

			stmp = "<table cellspacing='0' cellpadding='0'><tr>";

			for(j=2; j<items[i].length; ++j)

			{

				subItems = items[i][j];

				if(typeof(subItems)=="object")

				{

					itemText = items[i][j][0];

					subModule = items[i][j][1];

					sEvents = " onmouseover=\"startShow(null,'" + menu_id + "',true)\" onmouseout=\"startShow(null,'" + menu_id + "',false)\" ";

					stmp += "<td><a class='menuItem' href='?m=" + module + "&s=" + subModule + "' " + sEvents + ">" + itemText + "</a></td>";

					if(j<items[i].length-1)

						stmp += "<td " + sEvents + " width='1' bgcolor='#CCDDDD'></td>";

				}

			}

			omenu.innerHTML = stmp + "</tr></table>";

			document.body.appendChild(omenu);

		}//if

		

		//menu container

		oMenuCon = getObj(container);		

		if(i<items.length-1)

			strMenu += "<td width='1' style='background:url(images/separator.gif) no-repeat;'></td>";

	}//for

	getObj(container).innerHTML = "<table width='100%' cellpadding='0' cellspacing='0'><tr>" + strMenu + "</tr></table>";

}//end buildMenu





////////////////////////////////////////////////////////////////////////////////////////

////////////////////////////////////////////////////////////////////////////////////////

function jsRoller(id, left)

{

	//props

	this.containerId = "js_roll_" + id;

	this.roller = document.getElementById(id);

	this.container = null;

	this.started = false;

	this.rollId = 0;

	this.dy = 1;

	this.delta = 0;

	this.itemsCount = 0;

	

	//self pointer

	jsRoller.prototype._pthis = this;

	

	//public methods

	//add item: image, title, id

	this.addItem = function(image, url, title, cx, border){

		/*var oitem = document.createElement("<div>");

		var obj = new Image; obj.src= image; cx = obj.width;

		oitem.align="center";

		oitem.innerHTML = "<a title=\"" + title + "\" href='" + url + "'><img alt='MOTOIMPORT.COM.VN' src='" + image + "' width='" + cx + "' style='border:" + border + "px solid #003369;'></a>";

		this.container.appendChild(oitem);		



		//resize the roller

		if(!this.itemsCount){

			this.roller.style.width = parseInt(this.roller.childNodes[0].offsetWidth) + "px";					

		}

		this.roller.style.height = parseInt(this.roller.childNodes[0].offsetHeight) + "px";

		++this.itemsCount;*/

		

		sHTML = "<a title=\"" + title + "\" href='" + url + "'><img alt='MOTOIMPORT.COM.VN' src='" + image + "' style='border:" + border + "px solid #003369;'></a>"

		this.addHTML(sHTML);

	}

	

	this.addHTML = function(sHTML){

		var oitem = document.createElement("<div>");

		oitem.align="center";

		oitem.innerHTML = sHTML;

		oitem.style.backgroundColor = "#FAFAFA";

		this.container.appendChild(oitem);		

		

		//resize the roller

		if(!this.itemsCount){

			this.roller.style.width = parseInt(this.roller.childNodes[0].offsetWidth) + "px";					

		}

		this.roller.style.height = parseInt(this.roller.childNodes[0].offsetHeight) + "px";

		++this.itemsCount;

	}

		

	this.setTop = function(y){

		this.roller.style.top = y;

	}//setTop

	

	//stop timeout

	this.startRoller = function(){

		if(this.rollId){

			clearTimeout(this.rollId);

			this.rollId = 0;

			this.started = false;

		}

		this.rollId = setTimeout("jsRoller.prototype._runRolling()", 300);

	}//stop			

	

	this.show = function(flag)

	{

		this.roller.style.display = flag?"block":"none";

	}

	

	//rolling

	jsRoller.prototype._runRolling = function(){

		var ptr = jsRoller.prototype._pthis;

		var roll = ptr.roller;

		var height = parseInt(roll.childNodes[0].offsetHeight);

		var top = parseInt(roll.style.top);

		var scrollTop = document.body.scrollTop + document.body.clientHeight - height - 2;

		var endY =  scrollTop; //use "scrollTop + (document.body.clientHeight)/2 - height/2;" if roller's alignment is middle

		

		if(!ptr.started)

		{

			if(top < scrollTop - height)

				top = scrollTop - height - 16;

			else if(top > scrollTop)// + document.body.clientHeight)

			{

				//top = scrollTop + document.body.clientHeight;// + 10; ( plus 10 for middle align)

				roll.style.top = scrollTop + "px";

				clearTimeout(ptr.rollId);

				this.started = false;

				return;				

			}

			ptr.started = true;

			ptr.delta = Math.abs(top - endY);

			ptr.dy = top>endY ? -1 : 1;

		}

		

		var dy = 10; //valign: middle->dy= 20; top->dy=10

		ptr.dy = -parseInt(((top - endY)*10)/ptr.delta);

		if(ptr.dy==0)

			ptr.dy = (top>endY ? -1:1);

		var done = false;

		if(top==endY)

			done = true;

		else

		{

			if(ptr.dy<0)

				done = (top+ptr.dy)<endY;

			else if(ptr.y>0)

				done = (top+ptr.dy)>endY;

		}

		

		if(done)

		{

			clearTimeout(ptr.rollId);

			this.started = false;

			return;

		}				

		

		var dis = Math.abs(top - endY);			

		var timeout = parseInt(1000 / dis);//parseInt(ptr.delta/Math.abs(top - endY));			

		roll.style.top = top + ptr.dy;			

		ptr.rollId = setTimeout("jsRoller.prototype._runRolling()", timeout>=100 ? 100 : timeout);				

	}//end rolling

	

	////////////////////////////////////////////////////////

	//initialize

	this._initialize = function(){

		this.roller.innerHTML = "<table align='center' cellspacing='0' cellpadding='0'>"

								+ "<tr><td width='6' height='6'><img src='images/brd-topleft.gif' width='6' height='6'></td><td height='6' style='background:url(images/brd-top.gif) repeat-x center;'></td><td width='6' height='6'><img src='images/brd-topright.gif' width='6' height='6'></td></tr>"

								+ "<tr><td width='6' style='background:url(images/brd-left.gif) repeat-y;'></td><td id='" + this.containerId + "' align='center'></td><td width='6' style='background:url(images/brd-right.gif) repeat-y;'></td></tr>"

								+ "<tr><td width='6' height='6'><img src='images/brd-botleft.gif' width='6' height='6'></td><td height='6' style='background:url(images/brd-bot.gif) repeat-x center;'></td><td width='6' height='6'><img src='images/brd-botright.gif' width='6' height='6'></td></tr></table>"; //make sure that content is empty :-)

		this.container = document.getElementById(this.containerId);

		this.setTop(1);

		this.roller.style.display = "block";

		this.startRoller();

		

	}

	//call init

	this.roller.style.left = left;

	this._initialize();

}//end jsRoller////////////////////////////////////////////////////////





//////////////////////////////////////////////////////////////////////////

//tab control

prevTabItem = null;

function tabItem_Clicked()

{

	tabItem_OnSelChanged(arguments[0]);

	itemClicked(arguments[1]);

}



function itemClicked(nbr)

{	

	/*

	nbr = parseInt(nbr);

	if(prev_tab==nbr)

		return;

	if(roll_timer)

		return;

	

	cx = -Math.round((nbr - prev_tab)*w);

	curr_pos = parseInt(otab.style.left);

	new_pos = curr_pos + cx;

	prev_tab = nbr;		

	roll_timer = setInterval("_roll_tab(" + curr_pos + "," + new_pos + ")", 10);

	*/

}



function tabItem_SetSel(tabid)

{	

	tabItem_OnSelChanged(tabid);

}

function tabItem_GetCurrentItem()

{

	var header = document.getElementById("tabHeader");	

	if(header)

	{

		return header.cells[0].childNodes[0].childNodes[0].rows[0].id;

	}

	return "products";

}



function tabItem_OnSelChanged(newitemid)

{

	if(!prevTabItem)

	{			

		prevTabItem = tabItem_GetCurrentItem();

	}

	

	tabItem_SetBkg(prevTabItem, false);

	tabItem_SetBkg(newitemid, true);

	prevTabItem = newitemid;		

}



function tabItem_SetBkg(tabid, hilite)

{

	var theItems = document.getElementById(tabid).cells;

	if(theItems)

	{

		if(document.all)

		{

			theItems[0].background = "images/xptab/" + (hilite ? "tab_sel_bg.gif" : "tab_bg.gif");

			theItems[1].background = "images/xptab/" + (hilite ? "tab_sel_end.gif" : "tab_end.gif");

		}

		else

		{

			theItems[0].style.background = "url(images/xptab/" + (hilite ? "tab_sel_bg.gif" : "tab_bg.gif") + ")";

			theItems[1].style.background = "url(images/xptab/" + (hilite ? "tab_sel_end.gif" : "tab_end.gif") + ")";

		}

		

		var itemText = theItems[0].childNodes[0].innerHTML;

		if(hilite)

		{					

			theItems[0].innerHTML = "<a class='tabHeaderSelText' style='cursor:default;'>" + itemText + "</a>";

		}

		else

		{	

			nbr = tabid.substr(tabid.indexOf("_")+1);

			theItems[0].innerHTML = "<a href='' onclick=\"tabItem_Clicked('" + tabid + "'," + nbr + ");return false;\" class='tabHeaderText'>" + itemText + "</a>";

		}

	}

}