Skip to content

Latest commit

 

History

5 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🚀 Secret Number Game

A classic guessing game developed with HTML, CSS, and JavaScript. The goal is to discover the secret number (between 1 and 10) in as few attempts as possible. The game provides hints and ensures that each number is drawn only once per complete cycle.

✨ Project Highlights

  • No-Repetition Logic: Uses a list (listaDeNumerosSorteados) to ensure that the secret number does not repeat until all numbers within the limit (1 to 10) have been drawn.
  • Attempt Counter: Records the player's performance (correctly shows "attempt" or "attempts").
  • Dynamic Hints: Guides the player by indicating if the secret number is "higher" or "lower" than the guess.
  • Voice Accessibility: Includes the responsiveVoice.js library to read the game messages and interactions in Brazilian Portuguese.
  • Responsive Design: The interface adapts to different screen sizes.

🛠️ Technologies Used

Technology Purpose
HTML5 Semantic structure of the game.
CSS3 Styling, layout, and responsiveness.
JavaScript (ES6+) Core game logic (drawing, checking, counting).
ResponsiveVoice.js Speech synthesis.

🔗 How to Use (Installation and Execution)

This project is fully front-end and does not require a server or external package installation (other than the voice library, which is loaded via CDN).

  1. Download the Files: Make sure the following files are in the same folder:
    • index.html (or your HTML file)
    • app.js (with the JavaScript logic)
    • style.css (with the styling CSS)
    • The folder img/ containing the assets (ia.png, code.png, etc.).
  2. Run: Open the index.html file directly in your preferred browser (Chrome, Edge, Firefox).

🕹️ Game Instructions

  1. Start: The game begins with the secret number drawn and the attempt counter set to 1.
  2. Guess: Enter your guess in the text field and click the "Guess" button.
  3. Result:
    • Correct: The game congratulates the player and displays the total number of attempts. The "New Game" button is enabled.
    • Wrong: The game indicates if the secret number is higher or lower, increments the counter, and clears the guess field.
  4. Restart: Click the "New Game" button to reset the counter, draw a new number, and disable the restart button.

📜 Logic Snippet (Drawing)

The function below ensures that when drawing a new number, it is not already in the list of numbers chosen in the current round:

function gerarNumeroAleatorio() {
    let numeroEscolhido = parseInt(Math.random() * numeroLimite + 1);
    let quantidadeDeElementosNaLista = listaDeNumerosSorteados.length;

    if (quantidadeDeElementosNaLista == numeroLimite) {
        listaDeNumerosSorteados = [];
    }

    if (listaDeNumerosSorteados.includes(numeroEscolhido)) {
        // If the number has already been drawn, try again
        return gerarNumeroAleatorio(); 
    } else {
        // If it's new, add it to the list and return it
        listaDeNumerosSorteados.push(numeroEscolhido);
        return numeroEscolhido;
    }
}

About

Interactive guessing game with dynamic feedback and event handling. A clean implementation of programming logic and DOM manipulation.

Topics

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Used by

Contributors

Languages