const wyrazy = ['encyklopedia'];

const tabObrazki = [
  'wisielec.png',
  'wisielec0.png',
  'wisielec1.png',
  'wisielec2.png',
  'wisielec3.png',
  'wisielec4.png',
  'wisielec5.png',
  'wisielec6.png',
  'wisielec7.png',
  'wisielec8.png',
  'wisielec9.png',
  'wisielec10.png'];

const wyraz = wyrazy[Math.floor(Math.random() * wyrazy.length)];

const odpowiedzi = [];
let czyTrafiony = false;
let szanse = 10;
let pozostaleLitery = wyraz.length;

for (let i = 0; i < wyraz.length; i++) {
  odpowiedzi[i] = '_';
}

document.getElementById('gra').textContent = odpowiedzi.join(' ');
document.getElementById('wisielec').src = tabObrazki[0];

document.getElementById('ok').addEventListener('click', function () {

  czyTrafiony = false;
  document.getElementById('komunikat').textContent = '';

  const strzal = document.getElementById('litera').value.toLowerCase();
  document.getElementById('litera').value = '';

  if (strzal.length === 0) {
    document.getElementById('komunikat').textContent =
      'Proszę podać jedną literkę';

  } else {

    for (let j = 0; j < wyraz.length; j++) {

      if (wyraz[j] === strzal && odpowiedzi[j] === '_') {
        czyTrafiony = true;
        odpowiedzi[j] = strzal;
        pozostaleLitery--;

        document.getElementById('gra').textContent =
          odpowiedzi.join(' ');
      }
    }

    if (!czyTrafiony) {
      szanse--;
      document.getElementById('wisielec').src =
        tabObrazki[10 - szanse];
    }

    if (pozostaleLitery === 0) {
      document.getElementById('komunikat').textContent =
        'Brawo! Wygrałeś!';
    }

    if (szanse === 0) {
      document.getElementById('komunikat').textContent =
        'Przegrałeś! Hasło to: ' + wyraz;
    }
  }
});

document.getElementById('reset').addEventListener('click', function () {
  location.reload();
});