Pull to refresh

Tetris на javascript (в 30+ строк)

Reading time2 min
Views58K
Решил поддержать тему!
image
Тетрис в 30+ строк js кода.
  • Знает все фигуры тетриса
  • Управление с клавиатуры
  • ВВЕРХ — фигурки крутятся по часовой стрелке
  • ВНИЗ — ускорить падение
  • Скорость падания постепенно увеличивается
  • Очки подсчитываются

ссылка на jsfiddle

Принцип работы.

1. Получаем фигурки
Все фигурки хранятся в переменной fs=«1111:01|01|01|01*011|110:010|011|001*...» в виде строки. Чтобы получить массив фигур — делаем split('*'), далее в каждой фигуре есть от 1-го (для «палки») до 4-х (для L, Г и «пирамидки») состояния (чтобы их можно было переворачивать) — они разделены ":" — соответственно чтобы получить одно состояние — split(':'). Допустим получили «пирамидку» — «010|111», здесь делаем split('|') — и получаем уже конечный двумерный массив для одного состояния одной фигуры. «0»- пустое пространство (не нужно отрисовывать), «1» — нужно рисовать.

2. Всё перемещение фигур делается двумя функциями — «стереть фигуру» и «попытаться построить».
При любых перемещениях вправо-влево или вниз, или даже переворот фигуры — сначала стираем текущую отображаемую фигуру, потом пытаемся построить фигуру на новом месте — если при постройке какой-то из квадратиков вылазит за край «стакана», или попадает на место, где уже есть заполненный квадратик от предыдущих фигур — стираем «активную фигуру», и стоим ее на предыдущем месте.

3. Перемещения делаются с клавиатуры. По таймеру просто вызывается функция, которая обрабатывает нажатия с клавиатуры с кодом кнопки ВНИЗ. При каждом вызове таймаута — время до вызова уменьшается.

4. Если не удалось переместить фигуру вниз — значит она уперлась в предыдущие фигуры или дно. В таком случае проверяем нет ли заполненных строк, и рисуем новую фигуру вверху стакана. Если вверху стакана нарисовать фигуру не удалось — игра закончена!
Tags:
Hubs:
+51
Comments44

Articles

Change theme settings