ZŠ Úvoz

<!DOCTYPE html> <html> <head>

<meta charset="UTF-8">
<title>Hra anglických slovíček</title>
<style>
  .highlight {
    font-size: 24px;
    font-weight: bold;
    color: red;
  }

  .score {
    color: red;
  }
</style>

</head> <body>

<h1>Hra anglických slovíček</h1>
<div id="game"></div>

<script>
  // Databáze slovíček
  var words = [
    { english: "hello", czech: "ahoj" },
    { english: "goodbye", czech: "nashledanou" },
    { english: "cat", czech: "kočka" },
    // Další slovíčka...
  ];

  // Vybere 5 náhodných slovíček
  var randomWords = getRandomWords(5, words);

  // Vytvoří hru
  createGame(randomWords);

  // Funkce pro vygenerování náhodných slovíček
  function getRandomWords(count, wordsArray) {
    var randomWords = [];
    var copyArray = wordsArray.slice(); // Vytvoří kopii pole slovíček

    for (var i = 0; i < count; i++) {
      var randomIndex = Math.floor(Math.random() * copyArray.length);
      randomWords.push(copyArray[randomIndex]);
      copyArray.splice(randomIndex, 1); // Odstraní vybrané slovíčko z kopie pole
    }

    return randomWords;
  }

  // Funkce pro vytvoření hry
  function createGame(wordsArray) {
    var gameDiv = document.getElementById("game");
    var score = 0;
    var maxScore = wordsArray.length;

    gameDiv.innerHTML = ""; // Vyčistí obsah herního divu

    // Vytvoří progress bar
    var progressBar = document.createElement("progress");
    progressBar.max = maxScore;
    progressBar.value = score;
    gameDiv.appendChild(progressBar);

    // Vytvoří pole pro vstup překladu
    var inputField = document.createElement("input");
    inputField.type = "text";
    gameDiv.appendChild(inputField);

    // Vytvoří zobrazení skóre
    var scoreDisplay = document.createElement("div");
    scoreDisplay.className = "score";
    scoreDisplay.textContent = "Skóre: " + score + "/" + maxScore;
    gameDiv.appendChild(scoreDisplay);

    // Vytvoří funkci pro zpracování vstupu od hráče
    inputField.addEventListener("input", function() {
      var currentWord = wordsArray[score];
      var input = inputField.value.trim().toLowerCase();

      if (input === currentWord.czech.toLowerCase()) {
        score++;
        progressBar.value = score;
        scoreDisplay.textContent = "Skóre: " + score + "/" + maxScore;
        inputField.value = "";

        if (score === maxScore) {
          gameDiv.innerHTML = "<h2>Blahopřejeme! Dosáhli jste maximálního skóre!</h2>";
          // Můžete přidat logiku pro nabídku dal

Menu

Nástroje pro tento web

Uživatelské nástroje

Nástroje pro stránku