CIT 597 Assignment 2: TurnBlue
Fall 2009, David Matuszek

"TurnBlue" is a puzzle game, based on a much older computer game whose name I have forgotten. I have chosen this game because the programming logic is simple, and should not itself be any challenge; thus, almost all of the difficulties you encounter (and they may be considerable) will be in learning to use a new programming language.

## Purposes of this assignment:

• Get you started using JavaScript
• Get you started understanding the HTML/XHTML DOM
• Get you started using forms

## General idea of the assignment:

"TurnBlue" is a puzzle game, based on a much older computer game whose name I have forgotten.

The player is presented with an 8x8 grid of squares, some of which are red, and the others blue. By clicking on various squares, the player tries to make all the squares blue. The player starts on level 1; when the player succeeds, the game proceeds to the next level.

At the first (dead simple) level, the board is almost entirely blue, and the player has to click just one (correct) square in order to win; at the second level, two squares; and so on, up to a maximum of 32 squares. So that there is a definite end to the game, if the player clicks five times more than is required by a level, the game is over.

The logic is simple. When the user clicks a square, up to five squares change color (red to blue, or blue to red): the square clicked on, the squares directly above and below the clicked square, and the squares directly to the left and right of the clicked square. If the clicked square is on a border or in a corner, fewer than five squares will change color.

### How to create the puzzle

To create a puzzle at level N, begin with a board that is entirely red blue (solved). Then simulate N clicks on the board in randomly chosen squares, taking care not to choose the same square twice (clicking a square a second time "undoes" the first click and makes the game easier--we don't want that.) This is all just computation--don't show this happening to the player. The player should see only the puzzle that has been constructed in this way.

### Programming requirements

• Use JavaScript (ECMAScript), XHTML, and CSS
• Embed the game in a web page.
• Provide a brief description of the game.
• Display the board as an 8x8 array of colored squares.
• Handle clicks on the colored squares.
• Provide a continuous display of the current level number, and the number of clicks so far on this level.
• When the board becomes all blue, put up a congratulatory Alert dialog before proceeding to the next level.
• Provide a Play New Game button which can be clicked at any time to start a new game.
• When the player loses, provide a suitable pop-up message, and disable further clicks on the squares.
• [Optional] Provide a congratulatory message when the player wins level 32. (Optional because we aren't likely to test this feature!)
• Use good programming practices.
• Break your program up into well-chosen and well-named methods or functions.
• Use appropriate comments.
• Avoid magic numbers, unnecessary global variables, etc.
• Put your name in a visible location on the web page.

## Details:

Use XHTML 1.1 with CSS.

## Due date:

Midnight Sunday, October 4. Send a URL to our TA, Chandni (but not to me this time).