A complete example of Tetris game implemented by JS + Canvas, canvas Tetris

A complete example of Tetris game implemented by JS + Canvas, canvas Tetris

This article describes the Tetris game implemented by JS + Canvas. We will share this with you for your reference. The details are as follows:

Try-on (compatibility with earlier browsers is not considered ):

**************************************** ******************************
Updated on April 9, September 3:
Fixed a hidden BUG.
Added the pause and repeat Functions
The speed decreases as the score increases.
Add log
**************************************** *****************************

Gains from writing this game:

1. The isPointInPath method of canvas does not support the context of fillRect and strokeRect.

2. When the canvas has an padding (padding), the coordinates of the input isPointInPath method must be subtracted from the padding value.

3. json. parse (JSON. stringify (Object) can be used to quickly clone an Object. However, when there are methods in an Object, the cloned Object is still a reference relationship.

Source code:

<! DOCTYPE html> 
Continuous optimization ......