Yesterday I wrote an HTML page which displays a chess board and the initial position of chess pieces. I then wrote some JavaScript to load in a chess position from a FEN[1] string.
Below are some code examples. The web page can be seen here.
[1] Forsyth_Edwards_Notation
Code:
var Board = function() {};
// Define HTML for chess pieces
Board.prototype.WHITE_KING = "♔";
Board.prototype.WHITE_QUEEN = "♕";
Board.prototype.WHITE_ROOK = "♖";
Board.prototype.WHITE_BISHOP= "♗";
Board.prototype.WHITE_KNIGHT= "♘";
Board.prototype.WHITE_PAWN = "♙";
Board.prototype.BLACK_KING = "♚";
Board.prototype.BLACK_QUEEN = "♛";
Board.prototype.BLACK_ROOK = "♜";
Board.prototype.BLACK_BISHOP= "♝";
Board.prototype.BLACK_KNIGHT= "♞";
Board.prototype.BLACK_PAWN = "♟";
Board.prototype.set = function(square, value) {
document.getElementById(square).innerHTML = value ? value : "";
};
Board.prototype.setByIndex = function(x, y, value) {
this.set("abcdefgh".charAt(x) + y.toString(), value);
}
Board.prototype.get = function(square) {
return document.getElementById(square).innerHTML;
};
Code:
var chess = function() {
var fen;
var board = new Board();
return {
resetBoard: function() {
fen = new FEN("rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR w KQkq - 0 1");
return fen.populateBoard(board);
},
clearBoard: function() {
fen = new FEN("8/8/8/8/8/8/8/8 w KQkq - 0 1");
return fen.populateBoard(board);
}
}
}();