Snake Game With Rust, JavaScript, and WebAssembly | Part 6

This is part of the course “Snake Game With Rust, JavaScript, and WebAssembly”.

GitHub Repository and Deployed Game

In this part, we will allow the user to control the snake direction and stop the game. Changes that we will introduce in this part reflected in this commit.

Movement

To communicate to Rust what direction the player wants to move the snake, we will use the enum.

src/lib.rs

Also, we need two more Vector methods.

src/lib.rs

Now we can update methods with an optional argument for movement.

src/lib.rs

Let’s add a block between the last two lines.

src/lib.rs

First, we match movement to the corresponding vector. In our game the start of coordinates in the left top corner. Therefore vector pointed to the top has a negative Y-component.

When the new direction isn’t equal or isn’t opposed to the old one we round old and new components, to check if the snakehead crossed the center of the cell because only in this case we can update the direction.

Then we push an edge at the center of the crossed cell to shake tail. Finally, we calculate a new position for the head and update the direction.

Let’s compile Rust and go to the JavaScript side to implement the controller.

Controller

The controller updates the value of the movement field and executes the callback on the stop button press.

www/src/controller.js

Let’s create an instance of Controller in GameManager constructor.

When the game is resumed, we change lastUpdate so that it seems there was no stopping.

Finally, we want to pass the movement to the process method and update the tick method, so that it won’t call Rust and render when the game stopped.

Now we can go to the page, move the snake around the field, and stop the game by pressing the space button.

In the next part, we will make that every time the snake eats the food, its tail grows longer.

Reach the next level of focus and productivity with increaser.org.

Increaser

--

--

--

Indie hacker behind increaser.org. More at radzion.com

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

How to integrate Hubspot with Dasha AI using Zapier to automatically qualify leads over the phone

Playing with Playwright — Java API

A Look Under The Proverbial Hood Of A JavaScript Engine

Did you “Node”?

How to start an enterprise project with React and Redux

Testing nodeJS+ DynamoDB

Tutorial: JavaScript Variables

1. Analytical Geometry for developers (with JS examples)

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Radzion Chachura

Radzion Chachura

Indie hacker behind increaser.org. More at radzion.com

More from Medium

3D Boids in Rust

Learn Rust from simple guess game.

Calling C functions from Windows DLL in Deno — Part 2 Buffers

Splitting a List of Positive Integers into Minimal Sub-Sums: Rust + JavaScript