Выполняя задание из книги JavaScript для детей Ника Моргана столкнулся с проблемой написания варианта игры виселица, в которой необходимо в случае неправильно угаданной буквы нарисовать кусочек повешенного человечка. Я рисую новые части с учетом уменьшения количества попыток, однако не смотря на то, что программа учитывает все изменения в элементе для рисования, происходят они только по окончанию выполнения программы и вывода итога. Вопрос в том, как сделать так, что бы изменения в элементе "canvas" происходили по ходу игры, а не после ее окончания. Все обращения к пользователю происходят по средствам модальных окон.
function randomWord(words) { //рандомный выбор слова из массива
return words[Math.floor(Math.random() * words.length)];
}
function returnAnswerArray(word) { //вставка прочерков относительно длинный слова
var aArray = [];
for (i = 0; i < word.length; i++) {
aArray[i] = "_";
}
return aArray;
}
function promptUser() { //запрос буквы от пользователя
var guess = prompt("Введите предполагаемую букву");
guess = guess.toLowerCase();
return guess;
}
function returnCheck(guessed, guess, check) { //проверка на ввод данной буквы ранее
for (k = 0; k < guessed.length; k++) {
if (guessed[k] == guess) {
alert("Данную букву вы уже вводили");
check = false;
}
}
return (check);
}
function pushGuessed(guessed, check, guess) { //если букву не вводили добавление ее в массив guessed
if (check === true) {
guessed.push(guess);
}
return (guessed);
}
function remainingLettersSubtract(word, check, answerArray, remainingLetters) { //уменьшение количества необходимых для угадывания букв в случае если буква угадана верно
for (j = 0; j < word.length && check === true; j++) {
if (word[j] === guess) {
answerArray[j] = guess;
remainingLetters--;
}
}
return (remainingLetters);
}
function checkAttempt(attempt, word, check, guess) { //проверка необходимости вычитания количества попыток (следующая функция отнимает попытки однако она будет выполнена только в случае если букву ранее не вводили(за это отвечает check) и данной буквы в слове нет(за это отвечает attempt))
for (j = 0; j < word.length && check === true; j++) {
if (word[j] === guess) {
attempt++;
}
}
return(attempt);
}
function subtractAttempt(attempt, attempts, check) { //вычитание попытки
if (attempt === 0 && check === true) {
attempts--;
}
return (attempts);
}
function checkAndSubtractAttempt() { //уменьшение количества попыток если буква не угадана и не вводилась ранее
var attempt = 0;
attempt = checkAttempt(attempt, word, check, guess);
attempts = subtractAttempt(attempt, attempts, check);
return (attempts);
}
function totalGame(answerArray, remainingLetters, word, attempts) { //итог игры
alert(answerArray.join(" "));
if (remainingLetters === 0) {
alert("Поздравляем, угаданное слово " + word);
} else if (attempts === 0) {
alert("Вы проиграли");
} else {
alert("Ну нехотите, как хотите");
}
}
function clear() {
}
var human = function (attempts) { //рисование человечка
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
ctx.lineWidth = 4;
ctx.strokeStyle = "Grey";
ctx.beginPath();
if (attempts < 6) {
ctx.moveTo(50, 200); //основание
ctx.lineTo(150, 200);
ctx.lineTo(100, 180);
ctx.lineTo(50, 200);
ctx.lineTo(100, 200);
}
if (attempts < 5) {
ctx.lineTo(100, 50); //столб
ctx.lineTo(200, 50);
ctx.lineTo(200, 80);
}
if (attempts < 4) {
ctx.moveTo(210, 90); //голова
ctx.arc(200, 90, 10, 0, Math.PI*2, false);
}
if (attempts < 3) {
ctx.moveTo(200, 100); //туловище
ctx.lineTo(200, 140);
}
if (attempts < 2) {
ctx.lineTo(190, 170); //руки
ctx.moveTo(200, 140);
ctx.lineTo(210, 170);
}
if (attempts < 1) { //ноги
ctx.moveTo(200, 115);
ctx.lineTo(190, 135);
ctx.moveTo(200, 115);
ctx.lineTo(210, 135);
}
ctx.stroke();
}
var words = [ //массив слов
"помидор",
"киви"];
var word = randomWord(words); //рандомный выбор слова из массива
var answerArray = returnAnswerArray(word); //вставка прочерков относительно длинный слова
var remainingLetters = word.length;
var guessed = [];
var attempts = 6;
while (remainingLetters > 0 && attempts > 0) {
console.log("remainingLetters " + remainingLetters);
alert(answerArray.join(" ")); //отображение текущего состояния игры
var guess = promptUser(); //запрос буквы от пользователя
if (guess === null) { //действие в случае нажатия отмены
break;
} else if (guess.length !== 1) { //действие в случае ввода нескольких букв
alert("Введите одну букву");
} else { //если ввели одну букву
var check = true;
check = returnCheck(guessed, guess, check); //проверка на ввод данной буквы ранее
console.log(check);
guessed = pushGuessed(guessed, check, guess); //если букву не вводили добавление ее в массив guessed
remainingLetters = remainingLettersSubtract(word, check, answerArray, remainingLetters); //уменьшение количества необходимых для угадывания букв в случае если буква угадана верно
attempts = checkAndSubtractAttempt(); //уменьшение количества попыток если буква не угадана и не вводилась ранее
human(attempts); //отображение частей человечка, относительно количества оставшихся попыток
console.log("guessed " + guessed);
}
console.log("attempts " + attempts);
}
totalGame(answerArray, remainingLetters, word, attempts); //отображение победы или поражения
