Xadrez Digital - Acompanhe seu jogo de xadrez online: 5 etapas

2024 Autor: John Day | [email protected]. Última modificação: 2024-01-30 11:37

Eu jogo muito xadrez desde que era jovem, e como a web tem uma grande quantidade de sites para jogar xadrez contra computadores ou oponentes ao vivo, nunca encontrei um site que rastreia o seu jogo de xadrez que você realmente jogando na vida real. Então, com este projeto, espero perceber isso!

Eu espero:

• Ser capaz de rastrear o movimento das peças de xadrez
• Veja alguns placares sobre jogos anteriores.
• Controle o tempo e jogue rápido como um jogo profissional.

É um projeto muito complexo, pois, se concluído, exigiria 64 sensores de luz e 8 chips para ler. O que já é uma grande tarefa e nem estamos contando nenhum dos outros sensores.

Minha faculdade nos deu uma grande lista de coisas para fazer:

1. Crie um esquema para o nosso projeto
2. Crie um banco de dados para armazenamento e obtenção de dados.
3. Projete um site usando Adobe XD
4. Recrie este site com CSS e HTML
5. Leia os sensores com python
6. Mostre os dados do sensor no site usando o frasco.

Neste instrutível, irei guiá-lo em minha jornada e em todos os problemas e momentos de salvação pelos quais passei nas últimas semanas.

Etapa 1: suprimentos / ferramentas

Suprimentos, materiais e ferramentas são o primeiro passo para um projeto de sucesso!

Ferramentas:

• Ferro de solda
• Lata de solda
• Alicate
• Furadeira
• Fita

Suprimentos:

• Raspberry Pi com cartão micro SD (4 GB devem ser suficientes)
• Rasberry Pi T-cobbler
• Tabuleiro de Xadrez com peças
• Display de 7 segmentos (TM 1637)
• 2 sensores de toque (TTP223B)
• Leitor RFID com cartões (MFRC522)
• MCP3008 (dependendo de quão longe você deseja ir, para cada MCP você pode ler 8 coordenadas de xadrez)
• Resistor dependente de luz tipo 5288 (8 para cada MCP que você possui)
• Cabeçalhos (masculino para masculino e feminino para masculino)

Se precisar de comprar tudo, o preço de custo estimado deve rondar os 125 euros incluindo despesas de envio (apenas suprimentos)!

Há um arquivo Excel anexado com links e preços para tudo o que você precisa!

Etapa 2: Esquemas e planejamento

A próxima etapa neste projeto é criar um esquema. Fiz 2: um na placa de ensaio e um puramente eletrônico. Vamos precisar desse esquema para manter tudo limpo e garantir que não conectemos nada desnecessário!

Usei um programa chamado "Fritzing" para criar esses esquemas se alguém estiver interessado.

Codificação de cores:

• Vermelho = fonte de alimentação
• Verde = conexão
• Azul = chão

Conexões do Raspberry Pi:

• 3V3 => linha VC na placa de ensaio, alimentando tudo
• 5V => VCC de display de 7 segmentos

• GND:

  • Aterrar na placa de ensaio
  • Base da tela de 7 segmentos
• GPIO4 => pino de seleção do relógio do MCP3008
• GPIO10 => pino MOSI do MCP3008
• GPIO9 => pino MISO do MCP3008
• GPIO11 => pino CLK do MCP3008
• GPIO7 => pino SDA do MFRC522
• GPIO19 => Pino DIG do primeiro sensor de toque
• GPIO26 => pino DIG do segundo sensor de toque
• GPIO20 => pino CLK do display de sete segmentos
• GPIO21 = pino DIO do display de sete segmentos

Algumas notas sobre os esquemas:

• Este esquema contém apenas 1 MCP, o que significa que apenas 8 coordenadas poderão ser lidas na íntegra.
• Usarei pinos GPIO como meu Chip Select. Uma vez que apenas 2 pinos de seleção de chip estão disponíveis com potencialmente 8 MCPs.
• O display de 7 segmentos é sugerido por um professor, apenas 4 fios são necessários, pois funciona em seu próprio protocolo.
• Os resistores no pino digital dos sensores de toque não são totalmente necessários, mas são recomendados.

Explicando os componentes:

• MCP com sensores de luz:

  • Um MCP3008 é um ADC de 8 canais e 10 bits:

    • um MCP3008 lerá o valor analógico dos sensores de luz, este valor depende da quantidade de luz que está brilhando atualmente no sensor.
    • No meu código python, receberei esse valor analógico e o converterei em 1 ou 0

Sensores de toque:

Funciona como um botão, eu uso uma classe para isso com um método de retorno de chamada. Mais sobre isso depois

Leitor RFID (MFRC 522):

• Usa um protocolo específico (SPI) com um pacote instalado.
• Não é difícil codificar com um pacote instalado
• Lê a tag e retorna o valor da tag
• Você também pode escrever um valor para uma tag, então, em vez de retornar o valor hexadecimal, ele retorna um nome, por exemplo

7 Segmento (TM1637)

• Também usa um pacote instalado para facilitar a codificação
• Crie uma variável com um valor inteiro, depois divida-a em 4 caracteres e mostre esses caracteres

Etapa 3: Banco de dados SQL

O terceiro passo para este projeto é criar um banco de dados SQL normalizado 3NF!

Vamos precisar disso para:

• Inserindo dados
• Obtendo dados e exibindo-os em nosso site
• Ser capaz de ver exatamente quantas voltas se passaram no atual jogo de xadrez!

Tabelas explicadas:

• Jogos

  • Este rastreia quem ganhou um determinado jogo e quando o jogo foi jogado
  • A chave primária aqui é um GameID
  • A data tem um valor padrão da data atual
  • O vencedor e a pontuação serão adicionados mais tarde, depois que o jogo terminar!

• Jogadores (Soletradores em holandês)

  • Eles são inseridos manualmente, mas também podem ser inseridos usando o sistema de cartão RFID.
  • Escreva um nome no seu cartão, leia o cartão e insira o nome nesta tabela
  • Ele também rastreia o registro de vitórias / derrotas de cada jogador, para ser exibido no site

• Historiek (história)

  • Esta é a história da virada
  • quando uma peça de xadrez for movida, ela será atualizada aqui
  • Possui 3 chaves estrangeiras, jogador, jogo e peça de xadrez
  • a ReadDate (InleesDatum) é a data em que o sensor foi lido
  • ReadTime é igual a ReadDate, mas com um carimbo de data / hora
  • LocationID (LocatieID) é o nome da coordenada onde está posicionado. por exemplo "a3"

• Peças de xadrez (Schaakstukken em holandês)

  • Cada peça de xadrez tem um ID, time, nome e status
  • A equipe é 1 ou 2, preta ou branca;
  • O nome de cada peça seria, ou seja, "Peão 1"
  • O status significa que a peça está viva ou morta!

Etapa 4: Hardware

Agora que colocamos todas as peças corretas no lugar, podemos começar a criar algo!

Vamos dividir esta parte em subetapas, pois será mais fácil de explicar:

• Passo 1: Você deseja fazer um furo em cada coordenada do seu tabuleiro de xadrez, conforme mostrado na primeira imagem, também faça um furo onde deseja colocar os sensores de toque, leitor RFID e display de 7 segmentos.

  Não se esqueça de fazer alguns furos na lateral da placa, estes são para os fios dos diferentes componentes na parte superior da placa. Muita perfuração, eu sei

• Etapa 2: tente conectar um ou dois sensores ao Raspberry Pi, verifique se eles funcionam. Você deseja conectá-los ao leitor analógico MCP conforme explicado anteriormente na Etapa 2 (os esquemas).

• Etapa 3: Isso pode ser complicado e muito estressante, uma vez que os cabeçalhos dos jumpers não estão muito presos no lugar, você pode querer prendê-los todos na placa, individualmente ou vários de uma vez. Você tem que garantir que eles fiquem presos no tabuleiro, caso contrário você não será capaz de ler os sensores com sucesso

  GORJETA! Se for mais fácil para você, um pouco de cola pode realmente ajudar a manter os sensores mais no lugar enquanto os grava. Descobri isso da maneira mais difícil

Etapa 5: Software

Depois de fazer o hardware que você pode testar, vamos tentar escrever algum código para ele! Se você quiser dar uma olhada no meu código, vá para o meu github.

Back-endPrimeiro, vamos precisar de alguns pacotes para serem instalados, fui em frente e fiz uma lista para você:

• frasco

  É nele que seu código python estará rodando

• Flask-socketIO

  Para se comunicar entre front-end e back-end

• entorpecido

  Útil para leitura de sensores de luz, funciona com matrizes

• netifaces

  Para imprimir seu próprio endereço IP no display de 7 segmentos

• Flask-CORS

  Compartilhamento de recurso de origem cruzada, permite que os pacotes sejam compartilhados entre domínios diferentes

Além disso, escrevi algumas aulas e você está livre para usá-las.

A parte dianteira

O código do site também está disponível na minha página do github!

Para o front-end, estarei usando Chessboard.js. Isso insere um tabuleiro de xadrez fácil de usar com peças fáceis de mover!

Tudo no tabuleiro é personalizável, então divirta-se! Depois de baixar a última versão, você terá que arrastar os arquivos para o seu projeto e vinculá-los à página onde deseja mostrar um tabuleiro de xadrez!

Depois disso, vamos tentar criar uma placa, não parece muito difícil:

Primeiro, em seu html:

Em segundo lugar, em seu arquivo javascript:

tabuleiro1 = Tabuleiro de xadrez ('tabuleiro1', 'iniciar');

e aí está, você deve conseguir ver um tabuleiro de xadrez agora! Sinta-se à vontade para personalizar a placa nos arquivos CSS!

Agora, queremos ver alguns movimentos no tabuleiro de xadrez, não muito difíceis. Mas precisamos personalizá-lo para que o comando de movimentação seja enviado pelo back-end. Não vou entrar em muitos detalhes, mas queremos fazer algo assim:

new_lijst = [Data.data [0], Data.data [1]; comando = new_lijst [0].concat ('-', new_lijst [1]); board1.move (comando);

Recebemos uma lista de nosso programa de back-end e colocamos um travessão entre as duas coordenadas e, em seguida, usamos o comando board.move para executar o movimento!

Esta é a minha explicação sobre o que precisamos do plugin chessboard.js, vá para o meu github para dar uma olhada no código você mesmo