var bwidth = 0;
var PieceSize = 45;
var celColor = '#EEEEEE';
var celColorb = '#7186B8';

function WriteBoard(sshowcapt)
{ 
  var strBoard = "";
 
  ImageOffset=0;//document.images.length;
  //ImageOffset=document.getElementById("chess_board").images.length;
	
  strBoard += "<FORM name=BoardForm><table border=0 cellpadding=0 cellspacing=0><tr><td>";
  var ImageStyle="";
  if (Border)
  { if (document.layers) ImageStyle="border="+Border+" ";
    else{ ImageStyle="style='border-width:"+Border+"px; border-style:solid; border-color:"+BorderColor+"' ";  }
  }
   
   strBoard += "<table border=0 cellpadding=0 cellspacing=0><tr><td bgcolor='#333344'";
   
   if(bwidth != 0){
	strBoard = strBoard + "width="+bwidth+" height="+bwidth;
  }
  
  strBoard += " align=center>";
  strBoard += "<TABLE border=0 cellpadding=0 cellspacing=0><TR><TD>";
  
  if (!document.layers)
  		strBoard += "<div id='Board'>";
  
  strBoard += "<TABLE border=0 cellpadding=0 cellspacing=0><TR height='"+  PieceSize +"'>";

  for (var ii=0; ii<64; ii++)
  { if ((9*ii-ii%8)%16==0){
		if(PieceSize > 0)
			if(celColor != '')
				strBoard = strBoard + "<TD bgcolor='"+celColor+"' background='"+ImagePath+"w.gif' width='" + PieceSize + "' height='"+  PieceSize +"'>";
			else
				strBoard = strBoard + "<TD background='"+ImagePath+"w.gif' width='" + PieceSize + "' height='"+  PieceSize +"'>";
		else
			strBoard = strBoard + "<TD background='"+ImagePath+"w.gif'>";
  }else
  		if(PieceSize > 0)
			if(celColorb != '')
				strBoard = strBoard + "<TD bgcolor='"+celColorb+"' background='"+ImagePath+"b.gif' width='" + PieceSize + "' height='"+  PieceSize +"'>";
			else
				strBoard = strBoard + "<TD background='"+ImagePath+"b.gif' width='" + PieceSize + "' height='"+  PieceSize +"'>";
		else
			strBoard = strBoard + "<TD background='"+ImagePath+"b.gif'>";
    
    strBoard = strBoard + "<IMG SRC='"+ImagePath+"t.gif' "+ImageStyle+" id='"+ii+"' onMouseDown='BoardClick("+ii+")'></TD>";
	
	if (ii%8==7)
    { if (ii<63)
		strBoard += "</TR><TR height='"+  PieceSize +"'>";
      else
      { 
	  	strBoard += "</TR></TABLE>";
        if (!document.layers)
			strBoard += "</div><div id='Canvas' style='position:relative;z-index:100'></div>";

		strBoard += "</TD></TR></TABLE>";
      }
    }    
  }
  strBoard = strBoard+ "</td><td><img name='RightLabels' src='"+ImagePath+"8_1.gif' title='' alt=''></td>";
  strBoard += "<td style='vertical-align:middle'>&nbsp;";
  

  strBoard += "</td></tr>";
  
  strBoard = strBoard + "<tr><td><img name='BottomLabels' src='"+ImagePath+"a_h.gif'></td>";
  
  strBoard += "<td colspan=2>&nbsp;</td></tr><tr><td colspan=2 align=center>";


  strBoard += "</td></tr></table>";
  
  strBoard += "</td></tr></table></FORM>";
  return strBoard;
}

function WriteCaptured(){
	var strCaptured = "";
//<img name='Captured' src='"+ImagePath+"1pr.gif' title='labels' alt='labels'>		 onMouseDown='ShowCapturedPieces(! isCapturedPieces)'	style='border:1px solid #000000' title='show/hide captured pieces'
	strCaptured = "<img name='Captured' src='"+ImagePath+"1x1.gif' title='labels' alt='labels'><table cellpadding=0 cellspacing=0 >";
    
	for (ii=0; ii<4; ii++) 
    { strCaptured += "<tr>";
      for (jj=0; jj<8; jj++)  
	  	strCaptured += "<td><img src='"+ImagePathCapt+"1x1.gif'></td>";
     strCaptured += "</tr>";
    }
    strCaptured += "</table>";
  //alert(ImagePathCapt);
  	return strCaptured;
}


function setBWidth(bw){
	bwidth = bw;
}

function setPieceSize(ps){
    PieceSize = ps;
}

function WriteButtons()
{ var ii, nn=0, ss=0;
  if (document.getElementById) //adjust button size
  { if (ImagePath)
    { for (ii=0; ii<ImagePath.length; ii++)
      { if (isNaN(ImagePath.charAt(ii))) nn=0;
        else { nn*=10; nn+=parseInt(ImagePath.charAt(ii)); ss=nn; }
      }
    }
    if (ss==0) ss=31;
    ss+=2*Border;
    if (ss>27) ss-=8;
    else ss=19;
  }
  else ss=50;
  document.writeln("<TABLE border=0 cellpadding=0 cellspacing=0 width=100%><tr><TD height=20></TD></tr></table>");
  document.writeln("<TABLE border=0 cellpadding=0 cellspacing=0 width=330px><tr><td align=center>");
  document.writeln("<TABLE border=0 cellpadding=1 cellspacing=0 ><TR>");
  document.writeln("<TD><input type=button class=button-small value='&nbsp;&nbsp;|&lt;&nbsp;&nbsp;' id='btnInit' onClick='Init(\"\")'></TD>");
  document.writeln("<TD width=10></TD>");
  //document.writeln("<TD><input type=button value='&lt;&lt;' width="+eval(ss-4)+" style='width:"+ss+"px' id='btnMB10' onClick='MoveBack(10)'></TD>");
  document.writeln("<TD><input type=button class=button-small value='&nbsp;&nbsp;&lt;&nbsp;&nbsp;' id='btnMB1' onClick='MoveBack(1)'></TD>");
  document.writeln("<TD width=10></TD>");
  document.writeln("<TD><input type=button class=button-small value='&nbsp;&nbsp;&gt;&nbsp;&nbsp;' id='btnMF1' onClick='MoveForward(1)'></TD>");
  document.writeln("<TD width=10></TD>");
  //document.writeln("<TD><input type=button value='&gt;&gt;' width="+eval(ss-4)+" style='width:"+ss+"px' id='btnMF10' onClick='MoveForward(10)'></TD>");
  document.writeln("<TD><input type=button class=button-small value='&nbsp;&nbsp;&gt;|&nbsp;&nbsp;' id='btnMF1000' onClick='MoveForward(1000)'></TD>");
  //document.writeln("<TD><input type=button value='play' width="+eval(2*ss-4)+"px style='width:"+(2*ss)+"px' id='btnPlay' name='AutoPlay' onClick='SwitchAutoPlay()'></TD>");
  /*document.writeln("<TD><select name='Delay' onChange='SetDelay(this.options[selectedIndex].value)' SIZE=1>");
  document.writeln("<option value=1000>fast");
  document.writeln("<option value=2000>med.");
  document.writeln("<option value=3000>slow");
  document.writeln("</select>");*/
  document.writeln("</TD></TR></TABLE>");
  document.writeln("</TD></TR></TABLE>");
  document.writeln("<BR>");
}

function WriteButtons2()
{
  var ii, nn=0, ss=0;
  if (document.getElementById) //adjust button size
  { if (ImagePath)
    { for (ii=0; ii<ImagePath.length; ii++)
      { if (isNaN(ImagePath.charAt(ii))) nn=0;
        else { nn*=10; nn+=parseInt(ImagePath.charAt(ii)); ss=nn; }
      }
    }
    if (ss==0) ss=31;
    ss+=2*Border;
    if (ss>27) ss-=8;
    else ss=19;
  }
  else ss=50;
  document.writeln("<TABLE border=0 cellpadding=0 cellspacing=0 width=100%><tr><TD height=20></TD></tr></table>");
  document.writeln("<TABLE border=0 cellpadding=0 cellspacing=0 width=330px><tr><td align=center>");
  document.writeln("<TABLE border=0 cellpadding=1 cellspacing=0 ><TR>");
  document.writeln("<TD><input type=button class=button-small value='&nbsp;&nbsp;&laquo;&nbsp;&nbsp;' id='btnInit' onClick='SetDragDrop(0); Init(\"\"); SetDragDrop(1);' style='width:40px;'></TD>");
  document.writeln("<TD width=10>&nbsp;</TD>");
  //document.writeln("<TD><input type=button value='&lt;&lt;' width="+eval(ss-4)+" style='width:"+ss+"px' id='btnMB10' onClick='MoveBack(10)'></TD>");
  document.writeln("<TD><input type=button class=button-small value='&nbsp;&nbsp;&lt;&nbsp;&nbsp;&nbsp;&nbsp;' id='btnMB1' onClick='SetDragDrop(0); MoveBack(1); SetDragDrop(1);' style='width:40px;'></TD>");
  document.writeln("<TD width=10>&nbsp;</TD>");
  document.writeln("<TD><input type=button class=button-small value='&nbsp;&nbsp;&gt;&nbsp;&nbsp;' id='btnMF1' onClick='SetDragDrop(0); MoveForward(1); SetDragDrop(1);' style='width:40px;'></TD>");
  document.writeln("<TD width=10>&nbsp;</TD>");
  //document.writeln("<TD><input type=button value='&gt;&gt;' width="+eval(ss-4)+" style='width:"+ss+"px' id='btnMF10' onClick='MoveForward(10)'></TD>");
  document.writeln("<TD><input type=button class=button-small value='&nbsp;&nbsp;&raquo;&nbsp;&nbsp;' id='btnMF1000' onClick='SetDragDrop(0); MoveForward(1000); SetDragDrop(1);' style='width:40px;'></TD>");
  document.writeln("<TD width=30>&nbsp;&nbsp;&nbsp;&nbsp;</TD>");
  document.writeln("<TD><input type='button' class=button-small onclick='javascript:RotateBoard(! isRotated);' value='Flip Board' style='width:80px;' /></TD>");
  document.writeln("<TD width=10>&nbsp;</TD>");
  document.writeln("<TD><input type='button' class=button-small onclick='javascript:Init(\"\");' value='Reset Board' style='width:90px;' /></TD>");

  //document.writeln("<TD><input type=button value='play' width="+eval(2*ss-4)+"px style='width:"+(2*ss)+"px' id='btnPlay' name='AutoPlay' onClick='SwitchAutoPlay()'></TD>");
  /*document.writeln("<TD><select name='Delay' onChange='SetDelay(this.options[selectedIndex].value)' SIZE=1>");
  document.writeln("<option value=1000>fast");
  document.writeln("<option value=2000>med.");
  document.writeln("<option value=3000>slow");
  document.writeln("</select>");*/
  document.writeln("</TD></TR></TABLE>");
  document.writeln("</TD></TR></TABLE>");
  document.writeln("<BR>");
}

function WriteButtons3()
{ var ii, nn=0, ss=0;
  if (document.getElementById) //adjust button size
  { if (ImagePath)
    { for (ii=0; ii<ImagePath.length; ii++)
      { if (isNaN(ImagePath.charAt(ii))) nn=0;
        else { nn*=10; nn+=parseInt(ImagePath.charAt(ii)); ss=nn; }
      }
    }
    if (ss==0) ss=31;
    ss+=2*Border;
    if (ss>27) ss-=8;
    else ss=19;
  }
  else ss=50;

  document.writeln("<BR>");
  document.writeln("<input type=button class=button-small value='&nbsp;&nbsp;|&lt;&nbsp;&nbsp;' id='btnInit' onClick='SetDragDrop(0); Init(\"\");SetDragDrop(1);'>");

   document.writeln("<input type=button class=button-small value='&nbsp;&nbsp;&lt;&nbsp;&nbsp;' id='btnMB1' onClick='SetDragDrop(0); MoveBack(1); SetDragDrop(1);'>");

  document.writeln("<input type=button class=button-small value='&nbsp;&nbsp;&gt;&nbsp;&nbsp;' id='btnMF1' onClick='SetDragDrop(0); MoveForward(1); SetDragDrop(1);'>");
  document.writeln("<input type=button class=button-small value='&nbsp;&nbsp;&gt;|&nbsp;&nbsp;' id='btnMF1000' onClick='SetDragDrop(0); MoveForward(1000); SetDragDrop(1);'>");

  document.writeln("<BR><BR>");
}

function WritePosition()
{ var ii, nn=0, ss=0;
  if (document.getElementById) //adjust button size
  { if (ImagePath)
    { for (ii=0; ii<ImagePath.length; ii++)
      { if (isNaN(ImagePath.charAt(ii))) nn=0;
        else { nn*=10; nn+=parseInt(ImagePath.charAt(ii)); ss=nn; }
      }
    }
    if (ss==0) ss=31;
    ss+=2*Border;
    if (ss>27) ss-=8;
    else ss=19;
  }
  else ss=25;
  document.writeln("<TABLE border=0 cellpadding=1 cellspacing=0><TR>");
  document.writeln("<TD style='vertical-align:middle'>Position after:</TD>");
  document.writeln("<TH><input type=text name='Position' value='' width="+eval(4*ss-4)+" style='width:"+eval(4*ss)+"px' id='inpPos' size=14></TH>");
  document.writeln("<TD><input type=button value='print' width="+eval(2*ss-4)+" style='width:"+eval(2*ss)+"px' onClick='PrintPosition()'></TD>");
  document.writeln("</TR></TABLE>");
}
function KeyDown(e)
{ var kk=0;
  if (e) kk=e.which;
  else if (window.event) kk=event.keyCode;  
  if ((kk==37)||(kk==52)||(kk==65460)) MoveBack(1);
  if ((kk==39)||(kk==54)||(kk==65462)) MoveForward(1);
}

function drawBoard(board_id){
	strBoard = WriteBoard(1);
	//alert (strBoard)
	document.getElementById(board_id).innerHTML=strBoard;
	//document.write(strBoard);
	}
	
function drawCaptured(capt_id){
	strCapt = WriteCaptured();

	document.getElementById(capt_id).innerHTML=strCapt;
	}