The Interface

Right now you're probably thinking...this is too easy! The piece class is done, the piece defs have been made, the board is done, and all of the pieces can be moved within their individual defintions. Now all we have to do is move the pieces.

The Handler

A Handler is the direct interface between the user and the board. It uses the board to give it contact with the real world. The Handler must do several things. First of all it must contain a graphical user interface with buttons or menus to allow the user to select options such as new game, or take back. When a button is clicked, the handler uses the associated object to perform the appropriate function. In my program, the Handler is a member of the applet class. It inherits the ability to use GUI elements such as buttons and text areas. Also, it has the ability to process mouse clicks, releases, moves, and similar events. Within the mouse methods you can extract the coordinates of the mouse on the board. Most modern programming languages have extended themselve to support programming using mice and GUI's and provide access to information critical in programming. Also, the handler contains the GUI element that will draw the board. This, we must create ourselves and it is by far the most complicated part of the program. Actually, it will handle the mouseclicks in my in my program. Figure out how the language your using manages mouse clicks. I will not to specific here, but I'll just introduce some neat programming techniques. So, let's not worry about creating our own GUI element for drawing the board right now. Let's just draw it!!

Drawing the Board

Drawing the board is actually very easy. The squares can be drawn using images or using a rectangle drawing tool supplied by the programming languages library. In either case, the procedure is the same. For the pieces we use an image array of two dimensions. The first for the type of player, the second for the type of piece, both corresponding to the predefined constants of the board. Looping through the board we command, "if the square is empty, draw an empty square of the appropriate color. Otherwise draw a square with a piece".

for i=0 to 7
for j=0 to 7
if(checkBlack(i,j)
drawWhiteRect(size, size, size*j, size*i)
else
darwBlackRect(size, size, size*j, size*i)
if(board[i][j].getColor() == Board.COLORLESS)
drawImage(image[board[i][j].getColor][board[i][j].getKind()], x, y)

Here x and y are the coordinates that place the piece in the center of the square. These coordinates are easy to determine, but may require an additional function, as in my program. The checkBlack function is used to decide what color the square to be drawn should be. It takes to integers and, if their sum is evenly divisible by two, returns a true value.

Conceptually you should notice that any time this function is called, it will draw the board as it is. Meaning, if a move should be made in the abstract board array, the function will account for it because it uses the array to draw the board. Once a again we have an efficient and simple algorithm to accomplish one of the key chess problems that a novice programmer would wonder about, drawing the baord.

Mouse Clicks and Releases

The board is drawn using the abstract board away providing a bridge between the user and the program. The board can be redrawn to represent changes in the board array visually. But how to make those changes. How does one actually make a move.

The screen is layed out in coordinates like a cartesian coordinate plane with points ranging for (0,0) all the way to (n, n). In drawing the board you use these coordinates. For example, it the size of you're squares were thirties, when you looped to draw them you used coordinates (0,0), (0,30), (30, 0), (30, 30) to connect the first rectangle and coordinates (30, 30), (30, 0), (60, 30), (60, 0) for the second and so forth. To become familiar with coordinates you use them, but generally, if you're familiar with a cartesian coordinate plane, this should be easy to understand.

You have to use the moused coordinates to determine where the user is clicking. Then you have to convert that value into board array values. If the user clicks on a square on the 8th rank and 8th file you must take the coordinates of that click and turn it into a board array value of row 0, col 0. This is actually very simple since we know the size of our squares. Here's the function...

int mouseToArray(int mouseCooridinate){
return mouseCoordinate/size;
}

Trapping Mouse Events

Now that we have a function for conversions we need to trap them by using library functions for mouse clicks and releases. Obtaining the coordinates, we convert them into board array values. Then we can use them in the board to make moves. See if you can do this and make a move on the board. Remember, x is for rows and y is for columns. And also remember that clicking is only half the story; it gives a start square. The destination is obtained when the mouse is released at an ending. The two combined will allow the board to make a move.