Skip to main content Link Menu Expand (external link) Document Search Copy Copied

Starting the Project

  • Open the game2048/ folder in your preferred text editor.
  • Open the game2048/ folder in your preferred terminal.
  • Run git pull skeleton main to get the latest version of the skeleton code for this lab.

Running the Starter Code

To allow you to focus on the game logic, the UI for this game has already been written. Let’s run it!

  • Open two terminals (or split your terminal, if it has that feature)
  • In one terminal, run wasm-pack build --target web to compile your code.
  • In the other terminal, run python3 -m http.server to start the server.
  • Go to http://0.0.0.0:8000/ (or whichever address the server says to go to) in your browser to view the project.

You should see a beautiful-looking game of 2048. However, if you press an arrow key (or WASD), the game will just freeze, and not do anything. What happened?

Open up your browser’s Javascript console (you can get to it by right-clicking, clicking “inspect”, and clicking the “console” tab at the top of the opened window). You should see an error message that says

panicked at 'not implemented', src/game.rs:152:5

If you go to game.rs and look at line 152, you should see the problem. The game logic hasn’t been written yet!

Game Over

The first part of the game you’ll be implementing is the game_over function in game.rs. This function should return true if the game is over, which happens when there are no possible moves left on the board.

There are two ways a move might exist:

  • If there is an empty space on the board (that tile is zero)
  • If there are two adjacent tiles with the same value.

Here are three examples:

   (A)            (B)            (C)
2  0  2  0     2  4  2  4     2  4  2  4 
4  4  2  2     8  2  4  2     8  2  4  2
0  4  0  0     2  4  2  4     2  4  2  8
2  4  4  8     4  2  4  2     4  2  4  8

Example A has empty spaces, so game_over should return false. Example B has no empty spaces, and no adjacent tiles with the same value, so game_over should return true. Example C has no empty spaces, but it has two adjacent 8s, so game_over should return false.

Once you’ve implemented game_over, you can run the tests for it by running cargo test game.

Tilt

The final piece needed to make the game work is the tilt function in game.rs. This function calculates what should happen if the board is tilted in a certain direction. For example, if we start with the following board:

4  0  0  0
0  0  2  0
0  0  2  0
0  0  0  0

and tilted North (up), we would get the following result:

4  0  4  0      2 tile: (2, 1) -> (2, 0)
0  0  0  0      2 tile: (2, 2) -> (2, 0)
0  0  0  0      4 tile: (0, 0) -> (0, 0)
0  0  0  0      add 4 to score

Note that the tilt method returns not just the resulting board, but also the movements of all the tiles. This is so the UI can create sliding animations on every move.

Make sure to read the background before you start writing code; it contains some tips that may help you avoid some major pitfalls.

Once you’ve implemented tilt, you can run the full test suite with cargo test.

Fruits of Your Labor

Once you’ve implemented game_over and tilt, the game should be playable. Repeat the steps in Running the Starter Code, and enjoy the game!