Game over

Это из 16 уроков руководства разработки игры с помощью Phaser. Исходный код этого урока вы можете найти здесь:  Gamedev-Phaser-Content-Kit/demos/lesson08.html.

Чтобы разнообразить игру, давайте добавим возможность проигрыша — если вы не отобьете мячик и дадите ему упасть на пол, то game over.

Проигрыш

Чтобы добавить возможность проигрыша, давай те отключим определение коллизии с нижней гранью экрана. Добавьте следующую строку кода в функцию create(), сразу после кода инициализации всех атрибутов мячика:

game.physics.arcade.checkCollision.down = false;

Теперь мячик отскакивает только от трёх стен (верхней, левой и правой) и, если не отбить его платформой, проходит сквозь нижнюю стену, выходя за пределы экрана. Осталось только поймать момент выхода мячика за пределы экрана и вывести сообещние о проигрыше. Добавьте эти строки кода сразу после предыдущей:

ball.checkWorldBounds = true;
ball.events.onOutOfBounds.add(function(){
    alert('Game over!');
    location.reload();
}, this);

Мы сделали так, чтобы мячик проверял границы игрового мира (в нашем случае границы <canvas>) и, в случае выхода за их пределы (событие onOutOfBounds), выполнял функцию, которую мы привязали к этому событию. После закрытия всплывающего окна с сообщением 'Game over!', происходит перезагрузка страницы, чтобы можно было сыграть снова.

Сравните свой код

Вы можете проверить код из этого урока и поиграть с ним, чтобы лучше понять, как он работает:

Следующий шаг

Базовый геймплей готов. Но какой арканоид без разбивания кирпичиков