Conway's Game of Life
Conway's Game of Life has a few simple rules. Count the number of living squares around a square to determine if it continues to live, dies, stays die or becomes alive. if it's alive and has 2 or 3 living squares around it, it continues to lives overwise die. If it's dead and has 3 living squares around it, it becomes alive overwise it stays dead.
How to use
Click on a square to make a square dead or alive. Click Play to advance time Target Framerate times a second. Click step to advance time once. Click clear to clear the screen.
You may also display graph lines by clicking on the checkbox
You can slow down or speed up time by changing the Target Framerate.
The game logic is made inside the LifeGame template structure. This was a template because there were plans for a hex version. This was cut back because of time constraints. The game defines it's rules in an array of booleans. To get the next value the index value is calculated using this formula, (maxNumOfNeighbours*cellValue)+sumOfNeighbours, this way the next value of a square can be determined by looking up one value and an add operation.
To update all squares to new states, the game takes in the current state and creates a new state. This new state is then copied to where the current state is stored. To create a new state, the game loops through all squares and in each iteration of the loop, the sum of the squares around each square is calculated and the new value is determined by the array of rules described in the last paragraph.
To draw all the squares, a HTML canvas is used. To speed up rendering of the squares, a squares are drawn over the old frame and only drawn when different then old frame. To know when a square is different, the old buffer of squares is copied and compared to during render time.
Editing the square is really simple. When the HTML canvas is clicked on, the x y position of the mouse cursor is divided by the size of the squares. This gives the x y position of the square to change. If that square if alive, it's dead overwise it becomes alive.
To play and pause, setInterval is used and the interval is 1000 / target framerate. This allows the game to play at full speed or slowed down at any speed the user wants. While playing, step and changing the target framerate doesn't work so they are disable while playing.
How it's tested
Logic of the Conway's game is tested during compile time using a blinker. A blinker can be in two states and 1 state changes to the other. By comparing the results from creating a new state at compile time, a compile error is used when results don't lead to known values or states of a blinker.
How to compile
using emscripten sdk
em++ game-of-life-wasm/main.cpp -std=c++14 -o main.wasm -s WASM=1 -s SIDE_MODULE=1 -s ONLY_MY_CODE=1 -s "EXPORTED_FUNCTIONS=['_getMemory', '_updateStates']"
WebAssembly support web browsers and versions
|Web Browser||First supported version||% of all users that are using a supported version of this broswer||% of all users using this broswer|
|Chrome for Android||69||31.99%||27.9%??|