Olá boa noite.

Este é o meu primeiro post aqui no tabnews gostaria de especificar a versão inicial do meu dominó com bot, um módulo PHP Laravel com React.

Visão Geral da Operação

Temos um módulo onde em uma página implementamos uma partida de dominó contra um bot, construída em React com integração ao backend via requisições HTTP. Ela gerencia tanto a lógica do jogo quanto a experiência visual do usuário, incluindo animações, timer e estados de jogo.

Regras do Jogo

O dominó utiliza 28 peças é jogado por 2 personas(player e o bot). O objetivo é descartar todas as peças da mão, conectando números iguais nas extremidades da mesa, um de cada vez em sentido horario. O jogo distribui 7 peças para cada, e o restante é reservado para o monte, um local onde um jogador compra uma peça quando não tem jogadas diponiveis em sua mão.

Início: As peças são embaralhadas com os pontos para baixo. Cada jogador recebe 7 peças. O player sempre começa.

O Jogo: Os jogadores devem colocar uma peça que corresponda a um dos números nas extremidades livres da mesa.

Compras: Se um jogador não tiver a peça correspondente, deve "comprar" do monte ("dorme") até encontrar uma que sirva. Se o monte acabar e ele não puder jogar, passa a vez.

Bater: A partida termina quando um jogador coloca todas as suas peças na mesa.

Trancar (Fechamento): Se ninguém puder mais jogar e o monte acabar, o jogo "tranca". Vence quem tiver a menor soma de pontos nas peças da mão.

Estrutura do Jogo

O layout é baseada em três elementos principais:

Player (usuário) → peças visíveis na parte inferior

Bot (oponente) → peças ocultas na parte superior

Mesa (board) → área central onde as peças são jogadas

Os dados do jogo são carregados dinamicamente a partir do backend e atualizados em tempo real.

Lógica do Jogo

Identificação das pontas da mesa

A cada jogada, o sistema identifica os extremos da mesa:

left → primeira peça
right → última peça

Esses valores determinam quais peças podem ser jogadas.

Validação de jogadas

Existe uma função que verifica se uma peça pode ser jogada:

Se a mesa está vazia; qualquer peça é válida, caso contrário; a peça deve combinar com uma das pontas.

Inteligência do Bot

O bot segue uma lógica simples:

Procura uma peça jogável
Se encontrar = faz uma jogada

Se não:
Compra do monte.
Tenta novamente
Se o monte acabar = passa a vez.

Isso cria um comportamento básico, porém funcional, simulando um jogador real.

Jogadas do Player

O jogador pode:

Clicar em uma peça válida para jogar.

Comprar peça, quando não há jogadas possíveis.

Ter o turno passado automaticamente se:
não houver jogadas
e não houver peças no monte

Sistema de Tempo

Cada turno possui um limite de 30 segundos:

O tempo é reiniciado a cada turno
Se o tempo acabar:
o turno é automaticamente passado e
uma mensagem é exibida

Se o jogador:

não tiver jogadas possíveis
e o monte estiver vazio

Então:

o turno é automaticamente passado.

A página utiliza um sistema de polling (a cada 1 segundo) para:

atualizar o estado do jogo
verificar vitória/derrota
sincronizar jogadas

Renderização da Mesa

A função getPieceStyle é responsável por posicionar as peças:

Ela organiza o tabuleiro em formato de "cobra":

Linha 1 → horizontal
Coluna direita → descendo
Linha 2 → voltando
Coluna esquerda → subindo
Linha 3 → topo

Cada peça recebe:

posição X/Y
rotação (0°, 90°, 180°, 270°)

Isso cria o efeito visual clássico do dominó.

Interface Visual

Elementos principais:
Mesa com borda estilizada
Peças animadas ao jogar
Monte de peças empilhado
Timer no canto superior
Mensagens centralizadas
Modal de início e fim de jogo
Finalização da Partida

O jogo termina quando:

um jogador fica sem peças

Ou quando o backend define o vencedor.

Resultado exibido:

🏆 Você venceu
💀 Você perdeu

Com opção de reiniciar a partida.

Experiência do Usuário

A página inclui:

animação de jogada
delay no bot (simula pensamento)
bloqueio de interação durante ações
feedback visual claro
sistema automático de regras
Conclusão

Essa página representa um sistema completo de dominó com:

lógica de jogo funcional
sincronização com backend
interface interativa
controle de estado avançado
experiência fluida

Ela combina bem lógica + UI + tempo real, criando uma base sólida para evoluções futuras como:

IA mais avançada
multiplayer real
ranking / histórico