The location of each square on a chess board is identified by a letter and number for the square column and row. For example, the e2 square is placed in the fifth column and second row of the board. One way of logging a chess game is to record the opening and closing positions of pieces as they are moved. The log entry Pc2- c4 means to move the pawn on square c2 to square c4

The moves shown in Figure 8-39 are stored in a JSON file. The chess board is created with a web table in which each tag has been assigned an id matching its square. Form buttons have been provided to move forward and backward through the game with the movement of the pieces on the board matching the game log

The code for this app contains several errors that keep it from running correctly. You have been asked to use your knowledge of object-oriented programming to debug the program.

Do the following:

1. Use your code editor to open the project08-05_txt.html, project08-05_txt.js, and objects_txt.js files from the js08 c project05 folder. Enter your name and the date in the comment section of each file and save them as project08-05.html, project08-05.js, and objects.js, respectively.

2. Go to the project08-05.html file in your code editor and link the page to the project08-05.js and objects.js files, deferring the scripts until after the page loads. Study the code in the HTML file to become familiar with the structure and content of the file. Close the document, saving your changes.

3. Go to the sample_txt.json file in your code editor and save it as sample.json. The JSON file contains information on a sample game, but there are several mistakes in the syntax of the JSON data in naming the properties and separating the properties from each other. Locate and fix the errors and save your changes.

4. Return to the objects.js file in your code editor. This file is used to define custom objects for use with chess game apps. At the top of the file is a constructor function that defines the piece object containing information about chess pieces. A mistake has been made in defining the color, rank, square, and image properties.

5. The chessSet() constructor is used to define the collection of chess pieces within a game. There is a mistake in instantiating the chessPiece object. Fix the error and save your changes to the file.

6. Return to the project08-05.js file in your code editor. This file is used to define the interface for the chess game app. At the top of the file in the onchange event handler for the getLogButton object, the data from the JSON file is converted to the game object. A mistake has been made in the code to create the game object. Fix the error.

7. The code also creates the mySet object that is an instance of the chessSet object class. There is a mistake in instantiating that object. Locate and fix the error. Save your changes to the file.

8. Load project08-05.html in your web browser. Click the Choose File button and load the sample.json file from the js08 c project05 folder into the web page.

a. Verify that the app loads the chess log and displays the list of moves.

b. Verify that you can move forward and backward through the game by clicking the Next Move and Previous Move buttons.

9. If the app still does not work, use the debugging tools in your browser to help you locate and fix the errors.

json:

OBJECTS js:

PROJECT08-05 js:

Spassky Applauds Fisher Fisher (White) vs. Spassky (Black). World Championship Match (1972) Game 6. Queen's Gambit Declined: Tartakower Defense. Exchange Variation i 4 i i i Figure 8-39 Completed Project 8-5