<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> bzChess example - Edit puzzle </title>
<meta name="author" content="Gábor Martini" />
<meta name="keywords" content="chess fen pgn puzzle" />
<meta name="description" content="Javascript chess object to display positions" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<SCRIPT type="text/javascript" LANGUAGE=javascript src="bzchess.js"></script>
<LINK rel="stylesheet" type="text/css" media="screen" href="chess.css" />
<script type="text/javascript">
<!--
function bza_init_chesstable(el) {
el.chessgame = new bzChess(el);
mybrd.chessgame.onMove = function(fc,tc){
puzzle.value = mybrd.chessgame.getPuzzle();
}
}
function startEdit() {
mybrd.chessgame.startSetUpBoard();
castling.value=mybrd.chessgame.mv.castling;
entpassant.value=mybrd.chessgame.mv.ept;
halfmove.value= mybrd.chessgame.mv.hmc;
fullmove.value= mybrd.chessgame.mv.fmn;
}
function stopEdit() {
mybrd.chessgame.mv.castling=castling.value;
mybrd.chessgame.mv.ept=entpassant.value;
mybrd.chessgame.mv.hmc=halfmove.value;
mybrd.chessgame.mv.fmn=fullmove.value;
mybrd.chessgame.endSetupBoard();
fen_text.value=mybrd.chessgame.mv.getFEN();
}
function setFEN(FEN) {
mybrd.chessgame.loadPosition(FEN)
castling.value=mybrd.chessgame.mv.castling;
entpassant.value=mybrd.chessgame.mv.ept;
halfmove.value= mybrd.chessgame.mv.hmc;
fullmove.value= mybrd.chessgame.mv.fmn;
}
//-->
</script>
</head>
<body onload="bza_init_chesstable(mybrd)">
<h1>Example: edit puzzle</h1>
<table width="100%">
<tr>
<td style="vertical-align: top;">
<div id="mytbl" class="chtbl"><div id="mybrd" class="chbrd"></div></div>
<input type="button" value="Make editable" title="Edit position" onclick="startEdit()" /><input type="button" value="Stop editing" title="Stop edit position" onclick="stopEdit()" /><br /><input type="button" value="Start playing" title="Start playing" onclick="mybrd.chessgame.makePlayable()" /><br />
<table>
<tr>
<td>
<div style="width: 120px; display: inline-block;">Castling:</div><input type="text" id="castling" /><br />
<div style="width: 120px; display: inline-block;">Ent passant target:</div><input type="text" id="entpassant" value="-"/><br />
<div style="width: 120px; display: inline-block;">Half move clock:</div><input type="text" id="halfmove" value="0"/><br />
<div style="width: 120px; display: inline-block;">Full move number:</div><input type="text" id="fullmove" value=""/><br />
</td>
<td>
<select id="roster_key">
<option value="Event" selected="selected">Event</option>
<option value="Site">Site</option>
<option value="Date">Date</option>
<option value="Round">Round</option>
<option value="White">White</option>
<option value="Black">Black</option>
<option value="Result">Result</option>
</select><br />
<input type="text" id="roster_value" /><br />
<input type="button" value="save roaster parameter" onclick="mybrd.chessgame.roster[roster_key.value]=roster_value.value;" />
</td>
</tr>
</table>
</td>
<td style="vertical-align: top;"><br />
<div>Making a puzzle:
<ul>
<li>Set the board in edit mode and place the pieces for the start position or load a FEN.</li>
<li>Edit castling, ent passant, half move clock and full move number parameter if need</li>
<li>Stop editing board to save the parameters.</li>
<li>Add roaster information to the game</li>
<li>Set the board to playable, and set the necessary puzzle steps.</li>
</ul>
The puzzle string will display automatically.
</div>
<div style="border: 1px solid green; width: 600px; margin-bottom: 10px;">
FEN string:
<input type="text" id="fen_text" name="fen_text" size=80/><br />
<input type="button" onClick="setFEN(fen_text.value)" value="Set FEN"/><br /><br />
<textarea id="puzzle" rows="25" cols="60"></textarea>
</div>
</td>
</tr>
</table>
</body>
</html>
|
Download
