pmelan
pmelan

Reputation: 1

Is there a reason this function doesn't work?

I'm trying to make a wordle clone, and am stuck at this point where I have keyup functions, but when it identifies the enter key, it doesn't change the style of the tiles. Also note that each "row" is an object, and has keys in alphabetic order.

const colorChange = (word, row, letters) => {
  for (let i = 0; i < letters.length - 1; i++) {
    if (row.letters[i] === word[i]) {
      row.letters[i].innerHTML.style.backgroundColor = "#618B55";
    } else if (row.letters[i] === word[0], word[1], word[2], word[3], word[4]) {
      row.letters[i].innerHTML.style.backgroundColor = "#B19F4C";
    }
  }
};

Array.from(inputs).forEach(function(inputs) {
  inputs.addEventListener('keyup', function(event) {
    if (event.keyCode <= 90 && event.keyCode >= 65 && inputs.value.length === 1) {
      inputs.nextElementSibling.focus();
    } else if (event.keyCode === 8) {
      inputs.previousElementSibling.focus();
    } else if (event.keyCode === 13) {
      colorChange(word, row, letters);
    }
  })
})

Upvotes: -1

Views: 44

Answers (1)

Konstantin Savusia
Konstantin Savusia

Reputation: 415

you have wrong else if condition syntax

} else if (row.letters[i] === word[0], word[1], word[2], word[3], word[4]) {
  row.letters[i].innerHTML.style.backgroundColor = "#B19F4C";
}

should be something like that

} else if ( [ word[0], word[1], word[2], word[3], word[4] ].includes(row.letters[i]) ) {
  row.letters[i].innerHTML.style.backgroundColor = "#B19F4C";
}

Upvotes: 2

Related Questions