HTML and CSS Reference
In-Depth Information
Listing 11-8. Implementing the computeRowColumn() function
function computeRowColumn(oStart, end) {
oStart.pos = end;
switch (end.substring(0, 1)) {
case "a": oStart.column = 0; break;
case "b": oStart.column = 1; break;
case "c": oStart.column = 2; break;
case "d": oStart.column = 3; break;
case "e": oStart.column = 4; break;
case "f": oStart.column = 5; break;
case "g": oStart.column = 6; break;
case "h": oStart.column = 7; break;
oStart.row = 8 - parseInt(end.substr(1, 1));
The oStart parameter is the object from the piece store that was found at the starting position (“e2” in our
example). The end parameter is the ending position, “e3”, which is copied to the pos property since this will be the
piece's new position.
This code then uses a switch statement to convert the “a” - “h” file notation into a “0” - “7” coordinate. This
is then stored in the column property. The row property is computed by taking the last digit from the position and
subtracting it from 8.
Making a Move
Just like you did in Chapter 10, you'll use a timer to make the next move every 2 seconds. You'll need a timer
variable so you can clear the timer when the animation is done. You'll also need to keep track of the current
move. Add the two variables shown in bold to the script element just before the drawBoard() method is called.
// Get the canvas context
var chessCanvas = document.getElementById("board");
var chessContext = chessCanvas.getContext("2d");
var moveNumber = 1;
var timer;
Moving a piece will require making up to five database calls:
Get the next object from the move store (this defines the start and end positions).
Get the object at the start position.
Get the object at the end position (there will only be one if the move is capturing
a piece).
Remove the object at the end position (this step will only be needed on some moves).
Update the object at the start position (to move it to the end position).
Search WWH ::

Custom Search