Об этом проекте
黑8大师 — это однопользовательский PWA-бильярд «Чёрная восьмёрка», рассчитанный на альбомную ориентацию мобильного телефона. Играть можно сразу после открытия веб-страницы, также можно добавить приложение на главный экран телефона и запускать его офлайн после первой загрузки.
В плане геймплея игрок проводит пальцем по столу, чтобы изменить направление кия, регулирует силу удара с помощью полосы силы справа и нажимает «击球» для подтверждения. После первого законного забитого шара игроку назначаются сплошные или полосатые шары; чтобы победить, нужно очистить свою группу шаров, а затем забить чёрную 8. Если биток падает в лузу, не касается целевого шара или сначала касается шара не своей группы, объявляется фол, и соперник получает свободный шар; когда свободный шар получает игрок, он может переместить биток, нажав на допустимую позицию на столе.
С точки зрения функциональности проект использует Matter.js для реализации столкновений шаров, отскоков от бортов, замедления из-за трения и определения шести луз, а также включает упрощённые правила «Чёрной восьмёрки», полное состояние хода и определение победы или поражения. Доступны три уровня компьютерного соперника — простой, обычный и сложный, три набора тем для стола, кия и окружения, а также настраиваемая линия прицеливания, чувствительность силы, звуковые эффекты и вибрация. Интерфейс адаптирован под безопасную зону в альбомной ориентации, поддерживаются офлайн-кэширование и устанавливаемый PWA.
Для локальной разработки требуются Node.js 22+ и pnpm. После выполнения pnpm install и pnpm dev нужно открыть в браузере локальный адрес, показанный в терминале, и повернуть телефон в альбомную ориентацию. Проверка выполняется командами pnpm test и pnpm build; тесты покрывают правила и нарушения, выбор законных целей ИИ, столкновения, трение, отражение от бортов и определение попадания в лузу.
В процессе публикации каждый push в ветку main запускает тесты и production-сборку; после успешного прохождения GitHub Actions публикует dist на GitHub Pages. При первой публикации нужно в настройках репозитория Settings → Pages → Build and deployment выбрать GitHub Actions. Технологический стек: TypeScript, Vite, Phaser 3, Matter.js, Vitest и vite-plugin-pwa.
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.