File: bzchess-pgn-save.html

Recommend this page to a friend!
  Classes of Gábor Martini   bzChess   bzchess-pgn-save.html   Download  
File: bzchess-pgn-save.html
Role: Example script
Content type: text/plain
Description: Example: Edit PGN
Class: bzChess
Manage and display a chess board game
Author: By
Last change:
Date: 11 years ago
Size: 3,440 bytes
 

Contents

Class file image Download
<!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 PGN </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); el.chessgame.onDraw=function(){ comment.innerHTML = this.mv.comment; } el.chessgame.onMove=function(){ getPGN(); } } function getPGN() { pgnsample.value = mybrd.chessgame.getPGN(); } //--> </script> </head> <body onload="bza_init_chesstable(mybrd)"> <h1>Example: Edit PGN - Portable Game Notation</h1> <p style="margin: 0px;">To edit a PGN add roster information and set the board in play mode.</p> <p style="margin: 0px;">Make a move and set the move comment. PGN string will display automatically or by pressing the "get PGN" button.</p> <p style="margin: 0px;">For the move variation set the board back to the junction point and set the board to playable. The next move will stored as a variation.</p> <table width="100%"> <tr> <td style="vertical-align: top;"> <div id="mytbl" class="chtbl"><div id="mybrd" class="chbrd" bzaobj="chesstable"></div></div> <div style="border: 1px solid transparent; width: 500px; margin-top: 10px; text-align:center;"> <input type="button" title="Prev move" value="<<< Prev move" onclick="mybrd.chessgame.prev()" /> <input type="button" value="Next move >>>" title="Next move" onclick="mybrd.chessgame.next()" /><br /> <input type="button" value="Start playing" title="Start playing" onclick="mybrd.chessgame.makePlayable()" /><input type="button" value="Stop playing" title="Stop playing" onclick="mybrd.chessgame.disablePlay()" /><br /> <input type="text" id="newcomment" size=40 /><input type="button" value="Set comment" onclick="mybrd.chessgame.mv.setComment(newcomment.value)" /><br /> <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;" /> </div> </td> <td style="vertical-align: top;"><br /> <p>Move comment:</p> <div id="comment" style="border: 1px solid green; height:40px; width: 500px; margin-bottom: 10px; overflow: auto;"></div> <div style="border: 1px solid green; width: 600px; margin-bottom: 10px;"> <textarea id="pgnsample" rows="20" cols="80" style="font-size: 8pt;"> </textarea><br /><input type="button" value="Load PGN" onclick="mybrd.chessgame.loadPGN(pgnsample.value)" /><input type="button" value="get PGN" onclick="getPGN()" /><br /> </div> </td> </tr> </table> </body> </html>