var pgn_control_panel = function(){
  this.bottomWidth = 50;
  this.frm = new Array;
  this.graf = new Array;
  this.panelBottom = new Array;
}

pgn_control_panel.prototype.createArrowR = function(obj,pos,size,bTop)
{
	this.graf[0] = elm.element("div",obj,"style='position: absolute; top: "+bTop+"px; left: "+pos+"px; width: 2px; height: "+(size*2)+"px; background-color: black; font-size: 0px;");
  for (n=1; n<size; n++)
  {
	 	this.graf[n] = elm.element("div",obj,"style='position: absolute; top: "+(bTop+n)+"px; left: "+(pos+n*2)+"px; width: 2px; height: "+(size-n)*2+"px; background-color: black; font-size: 0px;");
	}
}

pgn_control_panel.prototype.createArrowL = function(obj,pos,size,bTop)
{
	this.graf[0] = elm.element("div",obj,"style='position: absolute; top: "+bTop+"px; left: "+pos+"px; width: 2px; height: "+(size*2)+"px; background-color: black; font-size: 0px;");
  for (n=1; n<size; n++)
  {
	 	this.graf[n] = elm.element("div",obj,"style='position: absolute; top: "+(bTop+n)+"px; left: "+(pos-n*2)+"px; width: 2px; height: "+(size-n)*2+"px; background-color: black; font-size: 0px;");
	}
}
pgn_control_panel.prototype.createReverseSymbol = function(obj,pos,size,bTop)
{
	elm.element("div",obj,"style='position: absolute; top: "+bTop+"px; left: "+pos+"px; width: 1px; height: "+(size*2)+"px; background-color: black; font-size: 0px;");
	elm.element("div",obj,"style='position: absolute; top: "+(bTop+size*2-4)+"px; left: "+(pos-1)+"px; width: 3px; height: 2px; background-color: black; font-size: 0px;");
	elm.element("div",obj,"style='position: absolute; top: "+(bTop+size*2-6)+"px; left: "+(pos-2)+"px; width: 5px; height: 2px; background-color: black; font-size: 0px;");
	elm.element("div",obj,"style='position: absolute; top: "+bTop+"px; left: "+(pos+size*1.5)+"px; width: 1px; height: "+(size*2)+"px; background-color: black; font-size: 0px;");
	elm.element("div",obj,"style='position: absolute; top: "+(bTop+2)+"px; left: "+(pos+size*1.5-1)+"px; width: 3px; height: 2px; background-color: black; font-size: 0px;");
	elm.element("div",obj,"style='position: absolute; top: "+(bTop+4)+"px; left: "+(pos+size*1.5-2)+"px; width: 5px; height: 2px; background-color: black; font-size: 0px;");
  
}

pgn_control_panel.prototype.bottomGraphic  = function(obj,bottomName)
{
  this.bWidth=parseInt(obj.offsetHeight/3.4);
  this.bTop = parseInt((obj.offsetHeight-2*this.bWidth)/2);
  this.bLeft = parseInt(obj.offsetWidth/2-this.bWidth/2);

  switch(bottomName)
  {
	  case "start":
			this.createArrowL(obj,this.bLeft*1.5,this.bWidth,this.bTop);
			elm.element("div",obj,"style='position: absolute; top: "+this.bTop+"px; left: "+(this.bLeft*1.45-this.bWidth*2)+"px; width: 4px; height: "+(this.bWidth*2)+"px; background-color: black; font-size: 0px;");
		break
		case "left":
			this.createArrowL(obj,this.bLeft*1.2,this.bWidth,this.bTop)
		break
		case "step_left":
			this.createArrowL(obj,this.bLeft*1.2-this.bWidth,this.bWidth,this.bTop)
			this.createArrowL(obj,this.bLeft*1.2+this.bWidth,this.bWidth,this.bTop)
		break
		case "step_right":
			this.createArrowR(obj,this.bLeft-this.bWidth,this.bWidth,this.bTop)
			this.createArrowR(obj,this.bLeft+this.bWidth,this.bWidth,this.bTop)
		break
		case "right":
			this.createArrowR(obj,this.bLeft,this.bWidth,this.bTop)
		break
		case "end":
			this.createArrowR(obj,this.bLeft*.8,this.bWidth,this.bTop)
			elm.element("div",obj,"style='position: absolute; top: "+this.bTop+"px; left: "+(this.bLeft*.8+this.bWidth*2)+"px; width: 4px; height: "+(this.bWidth*2)+"px; background-color: black; font-size: 0px;");
		break
		case "reverse":
			this.createReverseSymbol(obj,this.bLeft*.8,this.bWidth,this.bTop);
		break
	}
  
}

pgn_control_panel.prototype.createPanelCont = function(obj)
{
  newPanel = elm.element("div",obj,"id='panelCenter'","style='position: absolute; top: "+(settings.boardWidth+settings.measure)+"; height: 50px; width: "+(settings.boardWidth+settings.measure)+";'");
	return newPanel
}

pgn_control_panel.prototype.createBorder = function(obj,oWidth,oHeight,oTop,oLeft,oBorderWidth,oBorderType,oBorderColor)
{
  newFrame = elm.element("div",obj,"style='position: absolute; width: "+parseInt(oWidth)+"px; height:"+parseInt(oHeight)+"px; top: "+parseInt(oTop)+"px; left: "+parseInt(oLeft)+"px; border: "+parseInt(oBorderWidth)+"px "+oBorderType+" "+oBorderColor+";'");
  return newFrame;
}

pgn_control_panel.prototype.createBottom = function(obj,callName,oTop,oLeft)
{
  this.frm[0] = this.createBorder(obj,this.bottomWidth*.9,this.bottomWidth/3,oTop,oLeft,1,"solid",settings.panelBottomsColors[0]);
  for (n=1; n<settings.panelBottomsColors.length; n++){
  	this.frm[n] = this.createBorder(this.frm[n-1],this.bottomWidth*.9-n*2,parseInt(this.bottomWidth/3-n*2),0,0,1,"solid",settings.panelBottomsColors[n]);
	}
	this.frm[0].style.fontSize = 0;
	this.frm[0].style.backgroundColor = settings.panelBottomsColors[n-1];
//	elm.element("img",this.frm[0],"id='"+callName+"'","src='"+(settings.imageMap+settings.controlMap+callName+".gif")+"'","style='width: 100%; height:100%'");
	return this.frm;
}


pgn_control_panel.prototype.callBottomFunction = function(obj,callName)
{
 	elm.addEvent(obj[0],"mouseover",OMOver,obj[0]);
 	elm.addEvent(obj[0],"mouseout",OMOut,obj[0]);
	elm.addEvent(obj[0],"mousedown",OMDown,obj[0]);
	elm.addEvent(obj[0],"mouseup",OMUp,obj[0]);
  switch(callName)
  {
	  case "start":
	  	elm.addEvent(obj[0],"click",start_move,"test");
		break
		case "left":
	  	elm.addEvent(obj[0],"click",prev_move);
		break
		case "step_left":
	  	elm.addEvent(obj[0],"click",step_left);
		break
		case "step_right":
	  	elm.addEvent(obj[0],"click",step_right);
		break
		case "right":
	  	elm.addEvent(obj[0],"click",next_move);
		break
		case "end":
	  	elm.addEvent(obj[0],"click",end_move);
		break
		case "reverse":
	  	elm.addEvent(obj[0],"click",reversePos);
		break
	}
//	  elm.addEvent(this.panelBottom[ncp][0],"click",alert,ncp,"d","e")
  
}

pgn_control_panel.prototype.createPanel = function(obj)
{
	this.paneCont = this.createPanelCont(obj);
	this.bottomWidth = parseInt(settings.boardWidth/settings.panelBottoms.length);
	for (ncp=0; ncp<settings.panelBottoms.length; ncp++)
	{
	  this.panelBottom[ncp] = this.createBottom(this.paneCont,settings.panelBottoms[ncp],10,this.bottomWidth*ncp+this.bottomWidth*.06)
	  this.bottomGraphic(this.panelBottom[ncp][0],settings.panelBottoms[ncp]);
	  this.panelBottom[ncp][0].id = "ncp_"+ncp;
		this.callBottomFunction(this.panelBottom[ncp],settings.panelBottoms[ncp]);
	}
}
pgn_control_panel.prototype.gamesContMenu = function(startNumber,allGames)
{
  this.gamesContMenuObj = document.getElementById("gamesContMenu");
	elm.deleteAllElement(this.gamesContMenuObj);
  this.span = elm.element("span",this.gamesContMenuObj);
	this.a=elm.element("a",this.span,"target='blank'","style='float: right;'");
	this.a.href = "download_pgn.php?pgnToDownloadSql="+pgnToDownloadSql+"&all=Y";
  elm.textNode("Download PGN",this.a);

	this.txt = "<span>Partier "+(startNumber+1)+"-";
	if (allGames>(startNumber+ settings.maxUploadGames)) {
	  this.txt+=(startNumber+settings.maxUploadGames);
	  settings.newStart = startNumber+settings.maxUploadGames;
	}
	else {
	  this.txt+= allGames;
	  settings.newStart = allGames;
	}
	if (allGames>(startNumber+settings.maxUploadGames)) this.txt+=" af "+allGames;
	if (startNumber>0) this.txt+=" <a href='JavaScript: nextFromGamesContMenu("+(startNumber-settings.maxUploadGames)+");'>Tilbage</a> ";
	if (startNumber>0 && allGames>(startNumber+settings.maxUploadGames)) this.txt+="-";
	if (allGames>(startNumber+settings.maxUploadGames)) this.txt+=" <a href='JavaScript: nextFromGamesContMenu("+(startNumber+settings.maxUploadGames)+");'>Næste</a>";
	this.txt+= "</span>"
	if (allGames==0) {
	  elm.deleteAllElement(this.gamesContMenuObj);
	  this.txt = "Der findes ingen partier med denne søgning!";
		menu.mousedown("menuBoxCont3","menuBox3",this.id);
	}
  elm.textNode(this.txt,this.gamesContMenuObj);
  
}