⚡ Jogo da Memória - Harry Potter

Um clássico e divertido Jogo da Memória construído com JavaScript puro (Vanilla JS), HTML5 e CSS3, com a temática do universo de Harry Potter. O projeto conta com um sistema simples de "login" para identificar o jogador e um cronômetro para desafiar o usuário a terminar no menor tempo possível!

✨ Funcionalidades

• Tela de Login: Input de texto com validação em tempo real (o botão de jogar só é habilitado se o nome tiver mais de 2 caracteres).
• Identificação do Jogador: O nome digitado no login é salvo no navegador e exibido na tela do jogo.
• Geração Dinâmica: As cartas do jogo são geradas e renderizadas na tela inteiramente através do JavaScript, sem precisar repetir código no HTML.
• Embaralhamento Aleatório: A cada nova partida, as cartas mudam de posição, garantindo que o jogo nunca seja igual.
• Cronômetro: Conta os segundos desde o início da partida até que todas as cartas sejam encontradas.
• Sistema de Vitória e Restart: Ao encontrar todos os pares (32 cartas no total), o jogo parabeniza o jogador pelo nome, mostra o tempo final e exibe um botão para reiniciar a partida instantaneamente.

🚀 Tecnologias Utilizadas

• HTML5: Estruturação das páginas de login e do jogo.
• CSS3: Estilização visual, animações das cartas virando (efeito 3D/flip) e responsividade.
• JavaScript: Toda a inteligência do jogo, temporizador e manipulação de estado.

📂 Estrutura básica

A lógica principal do aplicativo está concentrada no JavaScript, dividida em dois arquivos principais (login e jogo), que lidam com:

• Eventos e Validações: Captura de digitação em tempo real (oninput) para validar o formulário de entrada e interações de clique nas cartas.
• Manipulação do DOM: Criação dinâmica das divs das cartas usando document.createElement, adição/remoção de classes CSS para revelar as imagens e atualização do cronômetro na tela.
• Lógica de Jogo: Uso de Arrays para armazenar os personagens, duplicação dos itens (para formar os pares) e ordenação aleatória utilizando Math.random() - 0.5.
• Timers: Uso de setInterval para o cronômetro e setTimeout para o atraso de tempo ao virar cartas erradas.
• Armazenamento: Uso do localStorage para guardar e recuperar o nome do jogador durante a transição da tela de login para a tela do jogo.

🛠️ Como executar o projeto

1. Faça o clone deste repositório.
2. Navegue até a pasta do projeto.
3. Abra o arquivo index.html (que contém a tela de login) no seu navegador.
4. Digite seu nome, clique em jogar e divirta-se!