Software Projects
JavaScript Chess
Overview
Considering the countless millions of chess fans around the world, and the abundance of chess material available online, it is surprising that not many easy to use implementations exist to directly display chess games in web pages. Most of the widgets I have come across require the installation of special plugins, and generally seem to make it more difficult than it should be to show chess games in a visually attractive way!
I think that among the absolute basic requirements for a successful chess widget is the ability to transfer games easily from a desktop chess database system, such as ChessBase, to the web without the need for an intermediate processing step. For this, the PGN specification from Steven Edwards is ideal, since it is both human readable and implemented as a standard import/export format by virtually all of today's popular chess database systems. For the display of only positions, the related FEN specification serves a similar purpose. Naturally, our chess widget not only needs to be able to parse this chess data efficiently, but also correctly implement all of the official rules of chess. Any display of chess moves should be in standard SAN notation.
Less critical technically, but rather very important for the people who use our widget, is the visual presentation of the chess board itself. Serious players will expect a rendering of chess pieces that resembles the appearance of a standard tournament set based on the Staunton design. There exist several slight variations in the 2D rendering of such a piece set, but all of the popular chess database systems follow a more or less consistent standard here as well.
The best chess database systems offer sophisticated interfaces with smooth transitions of pieces sliding to new positions on the board, and move lists that can be easily traversed with button controls, or else by clicking on the moves themselves.
Overall, by the time all of the above requirements and features are implemented, our simple chess widget has become quite a complex piece of software! See the example game position below...
Sample Game Of The Week
In Round 5 of the World Team Championships 2010, the United States beat the substantially higher ranked Israelis 2.5-1.5, in part on account of the sensational game shown here. On move 23, Nakamura launches a devastating and ultimately decisive sacrificial attack, leaving his own queen en prise for several moves!
Developer Notes
Displaying a chess game only requires pasting a copy of the game in PGN format into the XHTML code of the page. All of the functionality of the widget is handled by a single JavaScript source file, which in turn relies on the jQuery framework to do the heavy lifting involved in DOM manipulation and visual transitions.
Roadmap
In a future release I plan to include functionality for parsing and displaying PGN files with multiple games, which in turn would then allow for the display of event crosstables and other statistical information that can be mined from PGN data. More to come...
