In this post I will show you the Tetris game programmed in pure JavaScript, totally free and open source.
This block game is programmed with JavaScript and uses canvas to paint the game. I also use Bootstrap for the layout of the buttons and the page in general, with a bit of SweetAlert for the alerts.
Although it seems simple to do, it is one of the jobs that has cost me the most and of which I am most proud. It was complex (for me) to understand all the logic for collisions, rotations, row deletion, part movement, limits, etc.
Among the features of the game we find:
- Sounds: background music, sound when the piece cannot be rotated, when a complete row is made and when the tetromino touches the ground
- Colors: each piece has a random color chosen at runtime
- Rotations: pieces can be rotated to accommodate them and accumulate points
- Mobile compatible: because it is web, I have added some buttons to be able to play it on mobile phones and tablets, but it can also be played with the keyboard
- Open source: you can modify the game, the board, the length, speed, pieces, rotations, etc.
- Tetris port: behaves like any normal tetris game
- Game pause: the game can be paused or resumed at any time
Let’s see then the details of this game programmed in JS. Throughout the post I will show you how this game is programmed, I will also leave you a demo and the complete code which is FOSS.
Note: figure, piece and tetromino will be used synonymously in this post.
(more…)
