Mancala HTML5 Game

Mancala is a traditional board game with many variants. For this project, I aimed to recreate the Kalah variant using JavaScript, HTML5 and CSS3. This means that the game can be run in any web browser, and can be hosted for free on the internet so it can be played from any device, anywhere.

The game can be played online at sheabunge.github.io/mancala. The game’s source code is available on GitHub.

How to Play

The mancala board is split into two halves. Your side is the row of six pits facing you. The larger pit to the right is your store, where you place any captured stones. At the end of the game, the player with the highest number of stones in their store is the winner.

To make a turn, click on one of the pits in the row facing you. The number of stones in the pit (represented by the number in the pit) are then taken out and distributed one in each pit in an anticlockwise direction. The opponent’s store is skipped, but all small pits as well as your store are included in the distribution.

If the turn ends with the last stone falling in your store, then you immediately have another turn, and keep doing so until a turn doesn’t end in your store.

Capturing

If your turn ends in an empty pit on your side, and there are some stones in the opponent’s pit opposite, all stones are taken out of both pits and moved to your store, increasing your score.

Winning the game

When a player has no stones in their row, the game ends and the all of the stones still in the other player’s pits are moved to their store. The player with the highest amount of stones in their store is the winner.

Rules Overview

Taken from https://en.wikipedia.org/wiki/Kalah#Rules

1. At the beginning of the game, four seeds are placed in each house.
2. Each player controls the six houses and their seeds on the player’s side of the board. The player’s score is the number of seeds in the store to their right.
3. Players take turns sowing their seeds. On a turn, the player removes all seeds from one of the houses under their control. Moving counter-clockwise, the player drops one seed in each house in turn, including the player’s own store but not their opponent’s.
4. If the last sown seed lands in the player’s store, the player gets an additional move. There is no limit on the number of moves a player can make in their turn.
5. If the last sown seed lands in an empty house owned by the player, and the opposite house contains seeds, both the last seed and the opposite seeds are captured and placed into the player’s store.
6. When one player no longer has any seeds in any of their houses, the game ends. The other player moves all remaining seeds to their store, and the player with the most seeds in their store wins.

It is possible for the game to end in a draw, with 24 seeds each.