var saveImg;
var saveStr="POS BOX";
function scrImg()
{
	var lenT=prodLine.root.prod.length;
	//var div2=document.createElement("div");
	//div2.valign="center";
//div2.align="left";
	var tableT = document.createElement("TABLE");
	var tbodyT = document.createElement("TBODY");
	var trT = document.createElement("TR");
	var tdT = document.createElement("TD");
	tableT.cellSpacing="0";
	tableT.cellPadding="0";
	tableT.style.width=lenT*46;
//	tdT.style.border="1px solid red";
	tdT.innerHTML="sue me";
	displayChild(0); //default
	
	for(var i=0;i<lenT;i++) {
		
		var img = new Image();
		var p = prodLine.root.prod[i];
		img.src = p.img;
		
		img.style.border="1px solid #666666";
		img.style.width="38";
		img.style.height="38";
		img.onmouseover = imgMOver;
		img.onmouseout = imgMOut;
		img.onclick = imgMClick;
		img.saveIt="";
		img.id=i;
		img.title=prodLine.root.prod[i].title;
		var cTd = tdT.cloneNode(false);
		cTd.style.width=46;
		//cTd.valign="top";
		//cTd.align="center";
		//cTd.removeChild(cTd.firstChild);
		cTd.appendChild(img);
		trT.appendChild(cTd);
	}
	//tbodyT.style.height=50;
	tbodyT.appendChild(trT);
	tableT.appendChild(tbodyT);
//	tableT.style.height="50";
//	tableT.appendChild(trT);
	document.getElementById("content").appendChild(tableT);
//	document.getElementById("content").appendChild(div2);
//	div2.appendChild(tableT);
}

function imgMOver() {
	this.style.borderColor="orange";
	document.getElementById("tt").innerHTML=this.title;
}

function imgMOut() {
	if(this.saveIt != "yes") {	
		this.style.borderColor="#666666";
	} 
	document.getElementById("tt").innerHTML=saveStr;
}

function imgMClick() {
	if(saveImg !=null && saveImg != this) {
		saveImg.style.borderColor="#666666";
		saveImg.saveIt="";
	}
	this.saveIt="yes";
	saveImg = this;
	document.getElementById("tt").innerHTML=this.title;
	saveStr=this.title;
	displayChild(this.id);
}

function displayChild(parentIndex) {
	var p = prodLine.root.prod[parentIndex];
	var len1=p.prod.length;
	var table1 = document.createElement("TABLE");
	var tbody1 = document.createElement("TBODY");
	var tr1 = document.createElement("TR");
	var td1 = document.createElement("TD");
	var tr2= document.createElement("TR");
	var td2 = document.createElement("TD");
	table1.cellSpacing="0";
	table1.cellPadding="0";
	table1.style.width=len1*57+13;
//	table1.border=1;
	/*var cT1 = td1.cloneNode(false);
	cT1.style.height="2px";
	var cT2= td1.cloneNode(false);
	cT2.style.width="5px";
	tr1.appendChild(cT2);
	tr1.appendChild(cT1);
	tbody1.appendChild(tr1);*/

	var cTd2 = td2.cloneNode(false);
	cTd2.width="13";
	tr2.appendChild(cTd2);
	for(var i=0;i<len1;i++) {
		var img1 = new Image();
		var child = p.prod[i];
		img1.src = child .img;
		img1.style.border="1px solid black";
		img1.title=p.prod[i].title;
		var st;
//	if(img1.title.length>8)
	//	st="style9";
	//	else st="style8";
		if(img1.title.length>8)
		st="font-size:9px;";
		else st="font-size:10px";
		var txt="<a href=\""+child.url+"\"><img src="+img1.src+" style='border:1px solid #666666;' onmouseover= \"this.style.border='1px solid orange'\" onmouseout=\"this.style.border='1px solid #666666'\" width=\"50\" height=\"50\"></a>";
		//<br><div align=\"center\" style=\""+st+"\">"+p.prod[i].title+"</div>";
		var cTd1 = td2.cloneNode(false);
		cTd1.align="left";
		cTd1.valign="top";
				
		//cTd1.style.width="60px";
	//	cTd1.style.height="70px";
		cTd1.innerHTML=txt;
		tr2.appendChild(cTd1);

	}

var tr3= document.createElement("TR");
	var cTd3 = td2.cloneNode(false);
	cTd3.width="13";
	tr3.appendChild(cTd3);
	for(var i=0;i<len1;i++) {
		
//	if(p.prod[i].title.length>8)
	//	st="style9";
	//	else st="style8";
		if(p.prod[i].title.length>8)
		st="font-size:9px;";
		else st="font-size:10px";
		var txt="<span style=\""+st+"\">"+p.prod[i].title+"</span>";
		var cTd4 = td2.cloneNode(false);
		cTd4.align="center";
		cTd4.valign="bottom";
		cTd4.style.lineHeight="10px";
		cTd4.height=10;
		
		
		//cTd1.style.width="60px";
	//	cTd1.style.height="70px";
		cTd4.innerHTML=txt;
		tr3.appendChild(cTd4);

	}
	tbody1.appendChild(tr2);
	tbody1.appendChild(tr3);
	table1.appendChild(tbody1);
	var divPlace=document.getElementById("pic");
	if (divPlace.hasChildNodes())
	{  divPlace.removeChild(divPlace.firstChild);
	}
//	var removed = divPlace.removeChild(divPlace.firstChild);
	divPlace.appendChild(table1);

}

//moving DIV
	var id;
	var speed=8;
function moveRight() {
		var contentobj=document.getElementById("content");
		var contentheight=contentobj.offsetWidth;
	//	if (parseInt(contentobj.style.left)>=(contentheight*(-1)+200))
	//if (parseInt(contentobj.style.left)>=-190)
	//alert(contentheight);
	if (parseInt(contentobj.style.left)>=(contentheight*(-1)+346))
					contentobj.style.left=parseInt(contentobj.style.left)-speed;
		id = setTimeout("moveRight()",100);
}

function stop() {
		clearTimeout(id);
}

function moveLeft() {
		var contentobj=document.getElementById("content");
		if (parseInt(contentobj.style.left)<=-4)
		contentobj.style.left=parseInt(contentobj.style.left)+speed;
		id = setTimeout("moveLeft()",100);
}


//Log in Functions
var logSwitch=0;
function logIn()
{
	
	if (logSwitch==0)
	{
	expandLog();
	logSwitch=1;
	}
/*	else {
		while (logContent.hasChildNodes()) {
		logContent.removeChild(logContent.firstChild);
}
	logSwitch=0;
	}*/
}

var errSwitch=0;
function errorLog(logV)
{
	
	if(logV==1)
	{
		if (errSwitch==0)
		{
			expandLog();
			errSwitch=1;		
		}
	}

}


function expandLog()
{
	var logColor="#E8E8E8";
	var textColor="#000000";
	var logContent= document.getElementById("login");
	var tableLog = document.createElement("TABLE");
	tableLog.style.width=150;
	tableLog.cellSpacing=0;
	var tbodyLog= document.createElement("TBODY");
	var trLog= document.createElement("TR");
	var tdLog= document.createElement("TD");
	
	var logRowFirst= trLog.cloneNode(false);
	var logCellF1= tdLog.cloneNode(false);
	logCellF1.style.backgroundColor=logColor;
	logCellF1.style.border="0px solid #666666";
	logCellF1.style.borderLeftWidth="1px";
	logCellF1.style.borderRightWidth="1px";
	logCellF1.style.height=6;
	logCellF1.colSpan=3;
	logCellF1.innerHTML="<image src=\"images/img/empty_log.gif\">";
	logRowFirst.appendChild(logCellF1);



	var logRow1= trLog.cloneNode(false);
	var logCell11= tdLog.cloneNode(false);
	logCell11.style.backgroundColor=logColor;
	logCell11.style.border="0px solid #666666";
	logCell11.style.borderLeftWidth="1px";
	logCell11.style.width=5;
	logCell11.innerHTML="<image src=\"images/img/empty_log.gif\">";
	var logCell12= tdLog.cloneNode(false);
	logCell12.style.backgroundColor=logColor;
	logCell12.style.width=75;
	logCell12.style.height=20;
	logCell12.innerHTML="<input type=\"text\" name=\"username\" style=\"border:1 solid #666666;height:16;width:73\" >";
	var logCell13= tdLog.cloneNode(false);
	logCell13.style.backgroundColor=logColor;
	logCell13.align="left";
	logCell13.innerHTML="<span style=\"font-size:11px;  font-family:Arial, Helvetica, sans-serif ;white-space:nowrap;\">userid </span>";
	logCell13.style.border="0px solid #666666";
	logCell13.style.borderRightWidth="1px";
/*	var logCell14= tdLog.cloneNode(false);
	logCell14.style.backgroundColor=logColor;*/
	logRow1.appendChild(logCell11);
	logRow1.appendChild(logCell12);
	logRow1.appendChild(logCell13);
//	logRow1.appendChild(logCell14);

	var logRow2= trLog.cloneNode(false);
	var logCell21= tdLog.cloneNode(false);
	logCell21.style.backgroundColor=logColor;
	logCell21.style.border="0px solid #666666";
	logCell21.style.borderLeftWidth="1px";
	logCell21.style.width=5;
	logCell21.innerHTML="<image src=\"images/img/empty_log.gif\">";
	var logCell22= tdLog.cloneNode(false);
	logCell22.style.backgroundColor=logColor;
	logCell22.style.height=20;
	logCell22.innerHTML="<input type=\"password\" name=\"password\" style=\"border:1 solid #666666; height:16;width:73\" >";
	var logCell23= tdLog.cloneNode(false);
	logCell23.style.backgroundColor=logColor;
	logCell23.innerHTML="<span style=\"font-size:11px;  font-family:Arial, Helvetica, sans-serif; white-space:nowrap;\">password </span>";
	logCell23.style.border="0px solid #666666";
	logCell23.style.borderRightWidth="1px";
/*	var logCell24= tdLog.cloneNode(false);
	logCell24.style.backgroundColor=logColor;*/
 	logRow2.appendChild(logCell21);
	logRow2.appendChild(logCell22);
	logRow2.appendChild(logCell23);
	//logRow2.appendChild(logCell24);


	var logRowSubmit= trLog.cloneNode(false);
	var logCellS1= tdLog.cloneNode(false);
	logCellS1.style.backgroundColor=logColor;
	logCellS1.style.border="0px solid #666666";
	logCellS1.style.borderLeftWidth="1px";
	logCellS1.style.width=5;
	logCellS1.innerHTML="<image src=\"images/img/empty_log.gif\"> ";
	var logCellS2= tdLog.cloneNode(false);
	logCellS2.style.backgroundColor=logColor;
	logCellS2.innerHTML="<input type=\"image\" src=\"images/login.gif\" name=\"image\" width=\"73\" height=\"10\"> ";
	logCellS2.style.border="0px solid #666666";
	logCellS2.style.borderRightWidth="1px";
	logCellS2.colSpan=2;
	logCellS2.align="left";
	logCellS2.style.height=20;
	logRowSubmit.appendChild(logCellS1);
	logRowSubmit.appendChild(logCellS2);

	var logRowSLog= trLog.cloneNode(false);
	var logCellSLog1= tdLog.cloneNode(false);
	logCellSLog1.colSpan=3;
	logCellSLog1.style.backgroundColor=logColor;
	logCellSLog1.style.border="0px solid #666666";
	logCellSLog1.style.borderLeftWidth="1px";
	logCellSLog1.style.borderRightWidth="1px";
	logCellSLog1.style.height=10;
	logCellSLog1.innerHTML="<image src=\"images/img/empty_log.gif\">";
	logRowSLog.appendChild(logCellSLog1);

	var logRowSmall= trLog.cloneNode(false);
	var logCellR1= tdLog.cloneNode(false);
	logCellR1.style.backgroundColor="#666666";
	logCellR1.style.border="0px solid #666666";
	logCellR1.style.borderLeftWidth="1px";
	logCellR1.style.borderRightWidth="1px";
	logCellR1.style.height=1;
	logCellR1.colSpan=3;
	logRowSmall.appendChild(logCellR1);
	

    var logRow3= trLog.cloneNode(false);
	var logCell31= tdLog.cloneNode(false);
	logCell31.style.backgroundColor=logColor;
	logCell31.style.border="0px solid #666666";
	logCell31.style.borderLeftWidth="1px";
	logCell31.style.width=5;
	logCell31.innerHTML="<image src=\"images/img/empty_log.gif\"> ";
	var logCell32= tdLog.cloneNode(false);
	logCell32.style.backgroundColor=logColor;
	logCell32.style.height=15;
	logCell32.innerHTML="<a href=\"logResult.php\" style=\"text-decoration: none;color: #000000;display:inline;\" ><span style=\"font-size:11px;  font-family:Arial, Helvetica, sans-serif; white-space:nowrap;\">Need to register?</span></a>";
	logCell32.colSpan=2;
	logCell32.align="left";
	logCell32.vAlign="bottom";
	logCell32.style.border="0px solid #666666";
	logCell32.style.borderRightWidth="1px";
	logRow3.appendChild(logCell31);
	logRow3.appendChild(logCell32);
	

	var logRow4= trLog.cloneNode(false);
	var logCell41= tdLog.cloneNode(false);
	logCell41.style.backgroundColor=logColor;
	logCell41.style.border="0px solid #666666";
	logCell41.style.borderLeftWidth="1px";
	logCell41.style.width=5;
	logCell41.innerHTML="<image src=\"images/img/empty_log.gif\">";
	var logCell42= tdLog.cloneNode(false);
	logCell42.style.backgroundColor=logColor;
	logCell42.style.height=15;
	logCell42.innerHTML="<input type=\"image\" src=\"images/register.gif\" name=\"image\" width=\"73\" height=\"10\"> ";
	logCell42.style.border="0px solid #666666";
	logCell42.style.borderRightWidth="1px";
	logCell42.colSpan=2;
	logCell42.style.height=10;
	logCell42.align="left";
	logCell42.vAlign="top";
	logRow4.appendChild(logCell41);
	logRow4.appendChild(logCell42);

	var logRow5= trLog.cloneNode(false);
	var logCell51= tdLog.cloneNode(false);
	logCell51.style.backgroundColor=logColor;
	logCell51.style.border="0px solid #666666";
	logCell51.style.borderLeftWidth="1px";
	logCell51.style.width=5;
	logCell51.innerHTML="<image src=\"images/img/empty_log.gif\"> ";
	var logCell52= tdLog.cloneNode(false);
	logCell52.style.backgroundColor=logColor;
	logCell52.style.height=11;
	logCell52.innerHTML="<a href=\"logResult.php\" style=\"text-decoration: none;color:#000000;diplay:inline;\" ><span style=\"font-size:11px;  font-family:Arial, Helvetica, sans-serif; white-space:nowrap;\">Forget your password?</span></a>";
	logCell52.colSpan=2;
	logCell52.align="left";
	logCell52.style.border="0px solid #666666";
	logCell52.style.borderRightWidth="1px";
	logRow5.appendChild(logCell51);
	logRow5.appendChild(logCell52);

	var logRow6= trLog.cloneNode(false);
	var logCell61= tdLog.cloneNode(false);
	logCell61.style.backgroundColor=logColor;
	logCell61.style.border="0px solid #666666";
	logCell61.style.borderLeftWidth="1px";

	logCell61.style.width=5;
	logCell61.innerHTML="<image src=\"images/img/empty_log.gif\"> ";
	var logCell62= tdLog.cloneNode(false);
	logCell62.style.backgroundColor=logColor;
	logCell62.style.height=20;
	logCell62.innerHTML="<input type=\"image\" src=\"images/password.gif\" name=\"image\" width=\"73\" height=\"10\"> ";
	logCell62.style.border="0px solid #666666";
	logCell62.style.borderRightWidth="1px";
	logCell62.colSpan=2;
	logCell62.align="left";
	logRow6.appendChild(logCell61);
	logRow6.appendChild(logCell62);

	var logRowSLast= trLog.cloneNode(false);
	var logCellSLast1= tdLog.cloneNode(false);
	logCellSLast1.colSpan=3;
	logCellSLast1.style.backgroundColor=logColor;
	logCellSLast1.style.border="0px solid #666666";
	logCellSLast1.style.borderLeftWidth="1px";
	logCellSLast1.style.borderRightWidth="1px";
	logCellSLast1.style.borderBottomWidth="1px";
	logCellSLast1.style.height=8;
	logCellSLast1.innerHTML="<image src=\"images/img/empty_log.gif\">";
	logRowSLast.appendChild(logCellSLast1);

	
	var logRowLast= trLog.cloneNode(false);
	var logCellLast1= tdLog.cloneNode(false);
	logCellLast1.colSpan=3;
	logCellLast1.style.height=8;
	logRowLast.appendChild(logCellLast1);

	tbodyLog.appendChild(logRowFirst);
	tbodyLog.appendChild(logRow1);
	tbodyLog.appendChild(logRow2);
	tbodyLog.appendChild(logRowSubmit);
	tbodyLog.appendChild(logRowSLog);
	tbodyLog.appendChild(logRowSmall);
	tbodyLog.appendChild(logRow3);
	tbodyLog.appendChild(logRow4);
	tbodyLog.appendChild(logRow5);
	tbodyLog.appendChild(logRow6);

	tbodyLog.appendChild(logRowSLast);
	tbodyLog.appendChild(logRowLast);

	tableLog.appendChild(tbodyLog);
	document.getElementById("login").appendChild(tableLog);


}


function imgChange(v,imgSrc) {
if(v==1)
document.images.h1.src = "images/"+imgSrc;
else if(v==0)
document.images.h2.src = "images/"+imgSrc;
else
document.images.log.src = "images/"+imgSrc;
}