Иногда хочется отодвинуть в сторону разработку сайтов и заняться чем-то, что более связано с программированием, например разработкой игр. У меня появляется ощущение, что заниматься разработкой игр намного интереснее, чем разработкой сайтов :)
Суть игры заключается в том, найти дверь, открыть ее и войти в нее - для этого нужно всех взорвать и не взорваться самому.
В игре доступно 6 уровней разной сложности.
Красные ползующие штуки - это драконы - они хотят съесть вас :)
В игре есть различные бонусы: увеличение кол-ва бомб, силы взрыва и кол-ва жизней - их нужно собирать. Они появятся на месте взорванной земли.
Взрыв двери приведет к появлению дополнительных драконов.
Начиная с 3-го уровня в игре появится бот. Бот будет вредить вам: взрывать вас и дверь. А также он тоже может собирать бонусы :)
Бот находится в эксперементальном состоянии. Но вроде уже интересно с ним играть. Во время разработки бота - код сильно пострадал:) Код нужно сильно рефакторить, тк изначально многие вещи для бота не закладывались, а перелопачивать всю игру некогда.
Для поддержки мобильных пользоватей есть джойстик. У меня было не так много устройств для тестрования, поэтому возможны баги.
Конечно же, намного удобнее играть на компе.
Если вы проиграли - вы можете начать именно текущий уровень заново, а не всю игру. На мобльниках игра начнется заново сама. На компе - нужно кликнуть на "Начать с начала" или нажать клавишу Escape.
- рефокторинг
- таблица достижений
- несколько ботов
- сетевая игра + боты
Хочется многое оптимизировать, но лучше учту это в своей следующей игре :)
Если вам попался баг или есть пожелания - создавайте issue.
Игровое поле - это матрица. При инициализации игры - каждой ячейке привязывается DOM node. У каждой ячейки есть информация об окружающих ее ячейках.
Для рендеринга игрового поля и вывода информации из игры используется vue.js. Игра ничего не знает про внешний мир, кроме ячеек.
Таймер - это надстройка на уровне vue, игра ничего не знает про него.
Каждый уровень игры описывается отдельно - за это отвечает vue. Уровней можно наплодить сколько угодно и разной сложности в два счета.
Игра ничего не знает про остальные уровни. То есть уровни разруливает vue.
Описание уровня содержит:
- размер поля
- кол-во драконов
- начальное кол-во бомб
- начальную силу взрыва
- количество каждого из бонусов (бомбы, мощность, доп. жизни)
- наличие бота
Для создания игры vue передает текущий уровень в экземпляр игры.
Так как vue рендерит в такт - ждем следующий такт, когда появятся ячейки для игры и инициализируем игру.
В игре последовательно происходит расстановка всех объектов, с учетом переданных параметорв, то есть описания текущего уровня:
- расстановка стен
- расстановка драконов
- расстановка земли
- расстановка бонусов
- установка героя и бота
- установка двери
Вокруг героя есть безопасная зона в "радиусе" 3 ячеек (подматрица 3х3), куда не ставяться драконы.
Дверь устанавливается примерно в нижней части поля.
Драконы гуляют рандомно, специально ничего не делают.
Бот начинает гулять рандомно и изучает окружающий мир. Если он нашел что взорвать - завершает рандомное брожение и идет взрывать объект. Бот ищет для взрыва: землю, дверь, героя и бонусы. Драконов бот не взрывает и не лезет к ним. И драконы не едят бота.
Бот знает, какие ячейки будут взорваны и ищет себе укрытие. Постоянно сканирует окружение, не находится ли он в радиусе поражения. Если бот в опасности - он бросает, что делал и бежит спасаться.
На каждом взрыве ячейки проверяется не пора ли открыть дверь, если больше нет драконов и ботов.
Когда наступает конец игры - vue узнает об этом через хук. В хук передается статус: выиграл или проиграл.
Информация об игре выводится vue с помощью вычисляемых зачений, и напрямую реактивно подтягиваются из игры, без всяких хуков.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent