feat(game): Добавлена логика перехода на новый уровень

src/const/levels.js

@@ -0,0 +1,33 @@
+/**
+ * Список уровней игры в форме массива
+ * 0 - пустое пространство
+ * 1 - обычный блок
+ * 2 - блок с несколькими жизнями
+ * 3 - неразрушимый блок
+ */
+export const LEVELS = [
+  [
+    [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
+    [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
+    [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
+    [0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0],
+    [0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 0, 0, 0],
+  ],
+  [
+    [2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2],
+    [1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2],
+    [2, 2, 2, 2, 2, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 1, 1, 1, 1, 1],
+    [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
+    [0, 2, 1, 2, 0, 0, 1, 2, 1, 0, 0, 2, 1, 2, 1, 0, 1, 2, 1, 0],
+    [0, 0, 2, 0, 0, 0, 0, 1, 0, 0, 0, 0, 2, 0, 0, 0, 0, 1, 0, 0],
+  ],
+  [
+    [1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2],
+    [2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1, 2, 1],
+    [1, 2, 1, 2, 1, 2, 1, 2, 3, 3, 3, 3, 1, 2, 1, 2, 1, 2, 1, 2],
+    [2, 1, 2, 1, 2, 1, 2, 3, 3, 3, 3, 3, 3, 1, 2, 1, 2, 1, 2, 1],
+    [1, 2, 0, 2, 1, 2, 1, 0, 3, 3, 3, 3, 0, 2, 1, 2, 1, 0, 1, 2],
+    [2, 0, 0, 0, 2, 1, 0, 0, 0, 1, 2, 0, 0, 0, 2, 1, 0, 0, 0, 1],
+  ],
+];

src/entities/brick/layBricks/layBricks.js

@@ -1,37 +1,35 @@
 import { Brick } from '../brick';
 
 /**
- * Ложит кирпичи по заданым размерам
- * @param {number} columnAmount количество кирпичей по оси X, неотрицателное, целое число
- * @param {number} rowAmount количество кирпичей по оси Y, неотрицателное, целое число
+ * Создает массив кирпичей проинициализированных значениями в зависимости от расположения на карте уровня
+ * @param {number[][]} levelMap карта уровня в формате массива
  * @param {number} brickWidth ширина кирпича, неотрицателное число
  * @param {number} brickHeight длина кирпича, неотрицателное число
- * @returns {Brick[][]} массив с массивами кирпичей
+ * @returns {Brick[]} массив кирпичей
  */
-export function layBricks(columnAmount, rowAmount, brickWidth, brickHeight) {
+export function layBricks(levelMap, brickWidth, brickHeight) {
   try {
-    const someArgsArentNumbers = [columnAmount, rowAmount, brickWidth, brickHeight].some(
-      (arg) => typeof arg !== 'number',
-    );
-    if (someArgsArentNumbers) {
-      throw new Error('Параметры кладки кирпичей должны являться числами');
+    if (!(Array.isArray(levelMap) && levelMap.every(Array.isArray))) {
+      throw new Error('Значение карты уровня должно являться вложенным масивом чисел глубины 2');
     }
 
-    const someArgsLessThanZero = [columnAmount, rowAmount, brickWidth, brickHeight].some((arg) => arg < 0);
-    if (someArgsLessThanZero) {
-      throw new Error('Параметры кладки кирпичей должны являться положительными целыми числами');
+    if (!(typeof brickWidth === 'number' && typeof brickHeight === 'number')) {
+      throw new Error('Значения ширины и высоты кирпича должны являться числами');
     }
 
-    const rowsOrColumnsAreFloat = [columnAmount, rowAmount].some((amount) => amount % 1 !== 0);
-    if (rowsOrColumnsAreFloat) {
-      throw new Error('Размеры рядов и колонок должны являться целыми числами');
+    if (brickWidth < 0 || brickHeight < 0) {
+      throw new Error('Значения ширины и высоты кирпича должны являться положительными целыми числами');
     }
 
-    const bricks = Array.from({ length: rowAmount }).map((_, rowIndex) =>
-      Array.from({ length: columnAmount }).map(
-        (_, columnIndex) => new Brick(columnIndex * brickWidth, rowIndex * brickHeight, brickWidth, brickHeight),
-      ),
-    );
+    const bricks = [];
+
+    for (let i = 0; i < levelMap.length; i++) {
+      for (let j = 0; j < levelMap[i].length; j++) {
+        if (levelMap[i][j] !== 0) {
+          bricks.push(new Brick(j * brickWidth, i * brickHeight, brickWidth, brickHeight));
+        }
+      }
+    }
 
     return bricks;
   } catch (err) {

src/entities/brick/layBricks/layBricks.test.js

@@ -5,54 +5,63 @@ describe('layBricks', () => {
   it('Возвращает корректное значение в случае неверного типа параметра', () => {
     const wrongType = 'wrong';
 
-    expect(layBricks(wrongType, 1, 1, 1)).toBeNull();
-    expect(layBricks(1, wrongType, 1, 1)).toBeNull();
-    expect(layBricks(1, 1, wrongType, 1)).toBeNull();
-    expect(layBricks(1, 1, 1, wrongType)).toBeNull();
+    expect(layBricks(wrongType, 1, 1)).toBeNull();
+    expect(layBricks(1, wrongType, 1)).toBeNull();
+    expect(layBricks(1, 1, wrongType)).toBeNull();
   });
 
   it('Возвращает корректное значение в случае неверных размеров кирпича', () => {
     const wrongWidth = -1;
     const wrongHeight = -1;
 
-    expect(layBricks(1, 1, wrongWidth, 1)).toBeNull();
-    expect(layBricks(1, 1, 1, wrongHeight)).toBeNull();
+    expect(layBricks(1, wrongWidth, 1)).toBeNull();
+    expect(layBricks(1, 1, wrongHeight)).toBeNull();
   });
 
-  it('Возвращает корректное значение в случае неверных значений рядов и колонок', () => {
-    const negativeRow = -1;
-    const negativeColumn = -1;
-    const decimalRow = 1.5;
-    const decimalColumn = 1.5;
+  it('Возвращает корректное значение в случае некоректной карты уровня', () => {
+    const levelMap = ['brick', 'brick'];
 
-    expect(layBricks(negativeRow, 1, 1, 1)).toBeNull();
-    expect(layBricks(1, negativeColumn, 1, 1)).toBeNull();
-    expect(layBricks(decimalRow, 1, 1, 1)).toBeNull();
-    expect(layBricks(1, decimalColumn, 1, 1)).toBeNull();
+    expect(layBricks(levelMap, 1, 1)).toBeNull();
   });
 
   it('Возвращает массив корректных размеров', () => {
-    const columnAmount = 10;
-    const rowAmount = 5;
+    const levelMap = [
+      [1, 1, 1, 1, 1],
+      [1, 1, 1, 1, 1],
+      [1, 1, 1, 1, 1],
+    ];
 
-    const bricks = layBricks(columnAmount, rowAmount, 1, 1);
-    expect(bricks.length).toEqual(rowAmount);
-    for (const row of bricks) {
-      expect(row.length).toEqual(columnAmount);
-    }
+    const bricks = layBricks(levelMap, 1, 1);
+    expect(bricks.length).toBe(levelMap.flat().length);
+
+    const emptyLevelMap = [
+      [0, 0, 0, 0, 0],
+      [0, 0, 0, 0, 0],
+      [0, 0, 0, 0, 0],
+    ];
+    const emptyBricksArray = layBricks(emptyLevelMap, 1, 1);
+    expect(emptyBricksArray.length).toBe(0);
   });
 
   it('Задает корректные координаты кирпичам', () => {
-    const bricks = layBricks(3, 3, 1, 1);
-    const columnAmount = 10;
-    const rowAmount = 5;
+    const levelMap = [
+      [1, 1],
+      [1, 1],
+    ];
+    const brickWidth = 1;
+    const brickHeight = 1;
 
-    const brickss = layBricks(columnAmount, rowAmount, 1, 1);
+    const bricks = layBricks(levelMap, brickWidth, brickHeight);
+    let index = 0;
 
-    for (let i = 0; i < rowAmount; i++) {
-      for (let j = 0; j < columnAmount; j++) {
-        expect(brickss[i][j].x).toEqual(j);
-        expect(brickss[i][j]?.y).toEqual(i);
+    for (let i = 0; i < levelMap.length; i++) {
+      for (let j = 0; j < levelMap[i].length; j++) {
+        if (levelMap[i][j] === 0) {
+          continue;
+        }
+        expect(bricks[index].x).toBe(j * brickWidth);
+        expect(bricks[index].y).toBe(i * brickHeight);
+        index++;
       }
     }
   });

src/game.js

@@ -20,12 +20,14 @@ import { toRadians } from './lib/toRadians/toRadians';
  */
 export class Game {
   /**
-   * @param {number} columnAmount количество кирпичей по оси X, неотрицателное, целое число
-   * @param {number} rowAmount количество кирпичей по оси Y, неотрицателное, целое число
+   * @param {number[][][]} levels список уровней, каждый элемент которого - карта расположения блоков
    */
-  constructor(columnAmount, rowAmount) {
+  constructor(levels) {
     this.livesAmount = 3;
     this.status = 'in_process';
+    this.levels = levels;
+    this.currentLevel = 0;
+    this.maxLevel = levels.length - 1;
 
     this.ball = new Ball(
       CONTAINER_WIDTH / 2 - BALL_RADIUS / 2,
@@ -35,8 +37,7 @@ export class Game {
       -1 * BALL_SPEED * Math.sin(toRadians(BALL_INITIAL_ANGLE)),
     );
     this.paddle = new Paddle(0, CONTAINER_HEIGHT - PADDLE_HEIGHT, PADDLE_WIDTH, PADDLE_HEIGHT);
-
-    this.bricks = layBricks(columnAmount, rowAmount, BRICK_WIDTH, BRICK_HEIGHT);
+    this.bricks = layBricks(this.levels[this.currentLevel], BRICK_WIDTH, BRICK_HEIGHT);
   }
 
   /**
@@ -47,6 +48,7 @@ export class Game {
     if (this.status !== 'in_process') {
       return;
     }
+
     tick(this, CONTAINER_WIDTH, CONTAINER_HEIGHT, deltaTime);
 
     if (this.ball.isOut) {
@@ -57,12 +59,28 @@ export class Game {
       } else {
         this.ball.reset();
       }
+
+      return;
     }
 
-    const isAnyBrickAlive = this.bricks.some((row) => row.some((brick) => brick.alive));
+    const isAnyBrickAlive = this.bricks.some((brick) => brick.alive);
 
     if (!isAnyBrickAlive) {
+      this.currentLevel += 1;
+
+      if (this.currentLevel <= this.maxLevel) {
+        this._proceedToNextLevel();
+      } else {
         this.status = 'completed';
       }
     }
+  }
+
+  /**
+   * Запускает переход на новый уровень, возвращает мяч в дефоотное положение и отрисовывает кирпичи по карте уровня.
+   */
+  _proceedToNextLevel() {
+    this.ball.reset();
+    this.bricks = layBricks(this.levels[this.currentLevel], BRICK_WIDTH, BRICK_HEIGHT);
+  }
 }

src/lib/tick/tick.js

@@ -66,8 +66,7 @@ export function tick(game, containerWidth, containerHeight, deltaTime) {
     }
 
     // Базоввое взаимодействие мяча и кирпича
-    for (const row of bricks) {
-      for (const brick of row) {
+    for (const brick of bricks) {
       if (!brick.alive) {
         continue;
       }
@@ -98,7 +97,6 @@ export function tick(game, containerWidth, containerHeight, deltaTime) {
         }
       }
     }
-    }
 
     // Взаимодействие мяча и ракетки - обновление горизонтальной и вертикальной скорости в зависимости от сектора попадания
     processReflection(

src/lib/tick/tick.test.js

@@ -11,7 +11,8 @@ describe('tick', () => {
   });
 
   it('Возвращает корректное значние и не изменяет свойства game при неверых размерах контейнера', () => {
-    const game = new Game(1, 1);
+    const levels = [[[1]]];
+    const game = new Game(levels);
     const ballX = game.ball.x;
     const ballY = game.ball.y;
     expect(tick(game, -1, -1, 1)).toBeNull();
@@ -20,7 +21,8 @@ describe('tick', () => {
   });
 
   it('Возвращает корректное значние и не изменяет свойства game при неверном значении времени', () => {
-    const game = new Game(1, 1);
+    const levels = [[[1]]];
+    const game = new Game(levels);
     const ballX = game.ball.x;
     const ballY = game.ball.y;
     expect(tick(game, 1, 1, -1)).toBeNull();
@@ -29,7 +31,8 @@ describe('tick', () => {
   });
 
   it('Меняет направление мяча при столкновении со стеной', () => {
-    const game = new Game(1, 1);
+    const levels = [[[1]]];
+    const game = new Game(levels);
     game.ball.x = 0;
     game.ball.horizontalSpeed = -10;
     tick(game, CONTAINER_WIDTH, CONTAINER_HEIGHT, 1);
@@ -38,7 +41,8 @@ describe('tick', () => {
   });
 
   it('Меняет направление мяча при столкновении с потолком', () => {
-    const game = new Game(0, 0);
+    const levels = [[[1]]];
+    const game = new Game(1);
     game.ball.y = 0;
     game.ball.verticalSpeed = -10;
     tick(game, CONTAINER_WIDTH, CONTAINER_HEIGHT, 1);
@@ -47,8 +51,9 @@ describe('tick', () => {
   });
 
   it('Убивает кирпич при столкновении и отражает мяч', () => {
-    const game = new Game(1, 1);
-    const brick = game.bricks[0][0];
+    const levels = [[[1]]];
+    const game = new Game(levels);
+    const brick = game.bricks[0];
 
     game.ball.x = brick.x + game.ball.radius + 1;
     game.ball.y = brick.y + brick.height + game.ball.radius + 1;
@@ -62,8 +67,9 @@ describe('tick', () => {
   });
 
   it('Убивает только один кирпич за тик', () => {
-    const game = new Game(2, 1);
-    const [firstBrick, secondBrick] = game.bricks[0];
+    const levels = [[[1, 1]]];
+    const game = new Game(levels);
+    const [firstBrick, secondBrick] = game.bricks;
 
     game.ball.x = firstBrick.x + game.ball.radius + 1;
     game.ball.y = firstBrick.y + firstBrick.height + game.ball.radius + 1;
@@ -72,7 +78,7 @@ describe('tick', () => {
 
     tick(game, CONTAINER_WIDTH, CONTAINER_HEIGHT, 0.1);
 
-    const killedCount = game.bricks[0].filter((b) => !b.alive).length;
+    const killedCount = game.bricks.filter((b) => !b.alive).length;
     expect(killedCount).toBe(1);
   });
 });

src/main.js

@@ -13,6 +13,7 @@ import {
   PADDLE_HEIGHT,
   PADDLE_WIDTH,
 } from './config';
+import { LEVELS } from './const/levels';
 import { Game } from './game';
 import { calculateCollision } from './lib/calculateCollision/calculateCollision';
 import { calculateDirection } from './lib/calculateDirection/calculateDirection';
@@ -39,7 +40,7 @@ import { createGameView, syncronizeViewsWithGame } from './view';
 
   app.stage.addChild(container);
 
-  const game = new Game(BRICK_COLUMN_AMOUNT, BRICK_ROW_AMOUNT);
+  const game = new Game(LEVELS);
   const views = createGameView(game, container);
 
   container.on('pointermove', (event) => {

src/view.js

@@ -41,13 +41,11 @@ export function createGameView(game, container) {
     const paddle = createPaddleView(game.paddle);
     container.addChild(paddle);
 
-    const bricks = game.bricks.map((row) =>
-      row.map((brick) => {
+    const bricks = game.bricks.map((brick) => {
       const brickView = createBrickView(brick);
       container.addChild(brickView);
       return brickView;
-      }),
-    );
+    });
 
     return {
       ball,
@@ -78,14 +76,12 @@ export function syncronizeViewsWithGame(views, game) {
     views.paddle.y = game.paddle.y;
 
     for (let i = 0; i < game.bricks.length; i++) {
-      for (let j = 0; j < game.bricks[i].length; j++) {
-        const brick = game.bricks[i][j];
-        const brickView = views.bricks[i][j];
+      const brick = game.bricks[i];
+      const brickView = views.bricks[i];
       brickView.x = brick.x;
       brickView.y = brick.y;
       brickView.visible = brick.alive;
     }
-    }
   } catch (err) {
     console.error(err);
   }