Все статьи | Блог студента

Игра на JS. Обновление

Статья написана студентом Хекслета. Мнение автора может не совпадать с позицией редакции
Игра на JS. Обновление главное изображение

Всем привет!

Ранее я обозначил ряд элементов, которые хотел привнести в игру. К сожалению, некоторые вещи добавить не удалось, но обо всём по порядку.

Что удалось

battle log. Это оказалось достаточно просто, и единственным, что вызвало затруднения, оказалась полоса прокрутки. Стилизовать scroll с помощью CSS — не сложно. Проблема в том, что работать такая стилизация будет не во всех браузерах, и этот момент я пока не решил, ибо посчитал несущественным. А вот тот факт, что при каждой новой записи полоса прокрутки убегала вверх, меня знатно напрягал. Чтобы это исправить я познакомился с MutationObserver, который может отслеживать изменения в DOM.

Способности героев. Получилось реализовать способность героя разрушать вражескую броню при каждой атаке.

Модульность. Разбил код на модули, чтобы было удобнее работать.

Новый персонаж. К сожалению, не получилось выбрать внешний вид обещанного героя. На просторах интернета я нашёл лишь одно изображение, да и то пришлось переделывать вручную, ибо спрайты там были расположены не горизонтально, а вертикально.

Линтер. Теперь мы с линтером лучшие друзья.

Что не удалось

battle log. Да, пункты здесь будут повторяться. Почему не удалось, если всё работает? Потому что при моей реализации с этим логом очень неудобно работать. Я не создавал отдельную сущность под него в JS и понял свою ошибку слишком поздно.

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

Что дальше?

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

Поиграть в игру.

Посмотреть код.

Рекомендуемые программы

С нуля до разработчика. Возвращаем деньги, если не удалось найти работу.

Иконка программы Фронтенд-разработчик
Профессия
Разработка фронтенд-компонентов веб-приложений
18 мая 10 месяцев
Иконка программы Python-разработчик
Профессия
Разработка веб-приложений на Django
18 мая 10 месяцев
Иконка программы PHP-разработчик
Профессия
Разработка веб-приложений на Laravel
18 мая 10 месяцев
Иконка программы Node.js-разработчик
Профессия
Разработка бэкенд-компонентов веб-приложений
18 мая 10 месяцев
Иконка программы Fullstack-разработчик
Профессия
Новый
Разработка фронтенд и бэкенд компонентов веб-приложений
18 мая 16 месяцев
Иконка программы Верстальщик
Профессия
Вёрстка с использованием последних стандартов CSS
в любое время 5 месяцев
Иконка программы Java-разработчик
Профессия
Разработка приложений на языке Java
18 мая 10 месяцев
Иконка программы Разработчик на Ruby on Rails
Профессия
Создает веб-приложения со скоростью света
18 мая 5 месяцев