Sheep a sheep pure front-end implementation version[fish a fish]custom levels + patterns + unlimited props

Game Features:

1. Support to choose difficulty (4 kinds)
2. Support custom difficulty
3. Support for custom animal patterns (such as 🐔🏀)
4. Unlimited use of skills (props)
5. No need to watch ads
6. Can pass

Briefly speaking about the implementation principle, there are four main points:

1. Global parameters of the game: Students who do games know that there are many parameters involved in the game, such as the number of slots, the number of layers, and so on. We need to extract these parameters into a unified global variable for use by other variables. So as to modify one place, the game automatically adapts. Pages can also be provided to allow users to customize these parameters to improve the playability of the game.
2. Grid: In order to make the distribution of blocks relatively regular and to facilitate the calculation of coordinates, I divided the entire game canvas into a 24 x 24 virtual grid, similar to a chessboard. A block occupies a 3 x 3 grid.
3. Randomly generated blocks: including the pattern and coordinates of randomly generated blocks. First, I calculated the total number of blocks according to the global parameters, then shuffled the array storing all animal patterns with the shuffle function, and then filled the squares with the patterns in the array in turn. The principle of generating coordinates is to randomly select points within the coordinate range, and the coordinate range can decrease as the level increases, that is, the generated pattern becomes more and more crowded, achieving the effect of increasing difficulty layer by layer.
4. Block coverage relationship: How to click on the block on the upper layer before clicking on the block on the lower layer? First, assign a hierarchy attribute to each block. Then there are two ways of thinking. The first is to generate layer by layer first, and then the highest-level block in each grid determines in turn whether the surrounding grid has a block level greater than it; the second is to randomly generate blocks to overlap each other. the block binding hierarchy (ie who covered me? who did I cover?). Here I choose the second method, which feels more efficient.