Mini-Lab: If-Else Statements
The goal of today's Mini-Lab is to improve your puzzle game with a
counter that keeps track of the number of moves that have been made.
If the player makes too many moves without completing the puzzle, they
Make sure that you have finished the previous Mini-Lab before you get
started on this one.
- Adding a Counter: The first step is to add a new
that the player has left. The variable should be initialized to 20.
This variable should be created outside your existing
function only exist while that function is executing, and can only be
accessed in that function. Variables that are created outside of any
functions in the page.)
- Updating the Counter:
The next step is to modify
swapWithBlank function so that it updates your
counter variable every time it is called, and informs the player when
too many moves have been made:
Test your page to make sure that it works as expected.
- Extras (If You Have Time):
Add code to pop up a warning box when the user only has a few moves
remaining. You will need to use the If-Else construct to accomplish
Add code to clear the entire page if the user tries to continue
playing after they have used all of their moves. This can be
accomplished by replacing the
innerHTML attribute of the
page body with a friendly message: "Sorry! You Have Lost!".
- Add a visual indication of how many moves the player has left.
You could do this by adding code to modify the
attribute of a paragraph element, or the
of a text box.
- Modify your game so that the player can only swap the blank with
an adjacent tile. This requires comparing the row and column of the
tile that was clicked with the row and column of the blank tile.
Swaps should only occur when:
The rows are the same, and the columns differ by at most one.
The columns are the same and the rows differ by at most one.
The following two functions will allow you to obtain the row and column
numbers of any element that is contained in a cell:
- Finishing Up:
Before publishing your page to the web server, add comments to your
- The names of all group members.
- Today's date.