spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / programming / javascript / javachess / chap2 To page 1To page 2current page
[previous]

JavaScript Chess Simulator: Chapter 2

Technical Lead
Thomson Reuters (Markets) LLC
US-NY-New York

Justtechjobs.com Post A Job | Post A Resume
Developer News
Microsoft Shows Off Silverlight 4, IE9 Plans
Metasploit Expands Vulnerability Test Framework
HyperCard Reborn?


Moving Backwards

We can now move through each move in sequence, but what happens if we wish to step back one or more moves? All of these moves can be handled by simply reversing the parameters that we provide to the makeMove function, but in the following cases we need to do a little more:

Each of these requires us to put a piece back on the board. The first two can be handled within the existing functions to handle the move types, but the last is a litle more complex as we'll have to find the last piece on that square and then put it on the square. To help us determine the direction of the game, we'll use another boolean variable to indicate whether we're moving forwards or backwards though the game. This can then be used by the functions to make the correct move in conjunction with the boolean indicating whose move it is - bol_white2move.

The changes required for a standard move and to update the move counters are shown in red in this listing; changes for the other functions are shown in this listing comprising the reworked en Passant, Castling and Pawn Promotion functions.

This leaves the undoing of a capture of one piece by another, which can happen as a normal move, as part of Pawn Promotion or en Passant. While the actual move can be handled by the standard move functionality, we need to put the piece that was taken back on the board (although in the latter case we have handled it within the en Passant function as it is a simple change and the piece captured will always be a pawn of the opposite color).

To achieve this, we need to step back through all the previous moves in the game until we find a piece that was on the correct square. Matters are further complicated if the square happens to be one that is used in Castling, as the move is recorded as 0-0 or 0-0-0, so we'll need to unpack those as well. We'll use the result - or returned variable - of this function in the moveHandler function. Since this is the most complex of the 'undo' functions, we'll use the following Pseudo Code, which is a little complex, so take your time when working through it:

Get the correct set of moves - either White's or Blacks
 
Set matchFound to false
 
Starting with the current move go back until matchFound is true
    If either a match is found or no more moves then matchFound = true
Next move
 
If the square we are looking at is a square which a Castled piece may end on then
    Set matchFound to false
    Starting with the current move step back until matchFound is true
        If the move number is equal to where the match has already been found then matchFound=true
        If there has been a Castling move which has landed on that square then matchFound=true
    Next move
End if
 
If we have found a move then
    Get the move
    If it is not a Castling one get the piece that was there
    Else work out which Castling piece it is
Else
    No moves have been made, so get the piece that started on that square
End if
 
Put the piece back on the correct square

This complex function is shown in this listing. However, we need to call this function if we're undoing a capture as a normal move, but also if we have a Pawn promotion that involved a capture; so we need to amend that function as well, as shown in this listing (with changes in red as usual).

Linking the movement functionality to the User Interface

Now that we have the functionality to handle all the moves within our game universe, we need to link that to the user's interface. If you think back to the previous section, we created an information box which had two buttons, one to move forward and one to move backwards. Now, all we need to do is to create the functionality behind these buttons and then link that to the movement functionality managed by the moveHandler function. These functions will also handle the bounds checking to ensure that we have a move to process. The code for this function can be found in this listing.

The only other way of making a move is by clicking on a given Move Number in the Move List; this allows us to jump to any given position in the game. To accomplish this, we need to compare the move against the current move number and then loop in the correct direction until they are equal. Here is the resulting Pseudo Code:

Get the move number and color of the move we are moving to
Work out if the new move number is high that the current move number for the color
If it is higher, then call the moveForward function until we get there
If it is lower, then call the moveBack function until we get there
If it is the next or previous move for either color, then call either moveForward or moveBack once
If it is the current move then inform the user

The code for this functionality is show in this listing.

The other component of the information box that we have not yet created is the current position information. This shows the current move number and move for each player. Since we've created the move number and move areas as standard DHTML div's, we can use the innerHTML functionality to populate them with the correct information. The best time to do this is at the end of the moveHandler function. The function itself will be relatively simple; just updating the current values into the information box as shown in this listing.

You may have spotted in that function a variable called str_comment which is placed in one of the div's in the information box. This is simply a text string that can be populated from any of our functions to display a message about the game to the user, for example, Black Castles Queenside or White Resigns.

Here is a demonstration of these changes which displays the functionality implemented thus far.

By Greg Griffiths


home / programming / javascript / javachess / chap2 To page 1To page 2current page
[previous]

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Rolling Out Your Own HTML Application Version Control · HTML 5: Client-side Storage · Working with Ajax Server Extensions
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Wi-Fi Product Watch, November 2009 · Chip Market Recovering From '08 Collapse · Low-Cost Tools to Kickstart Your New Business

Created: March 27, 2003
Revised: June 10, 2003

URL: http://webreference.com/programming/javascript/javachess/chap2