diff --git a/index.html b/index.html index 8946160..74f047e 100644 --- a/index.html +++ b/index.html @@ -16,15 +16,17 @@ font-size: xx-large; cursor: pointer; } + #result { + font-family: Arial, Helvetica, sans-serif; + font-size: larger; + } -
- Result: -
+
\ No newline at end of file diff --git a/index.js b/index.js index a9e38b0..1de8e16 100644 --- a/index.js +++ b/index.js @@ -6,11 +6,13 @@ function getComputerChoice() { return choices[Math.floor(Math.random() * 3)]; } -function playRound(playerChoice, computerChoice) { +function playRoundResult(playerChoice, computerChoice) { let playerChoiceCapital = playerChoice.slice(0,1).toUpperCase() + playerChoice.slice(1,playerChoice.length) let computerChoiceCapital = computerChoice.slice(0,1).toUpperCase() + computerChoice.slice(1,computerChoice.length) if (playerChoice == computerChoice) { + points.playerAddPoints(); + points.computerAddPoints(); return `It's a tie! ${playerChoiceCapital} vs ${computerChoiceCapital}.`; } else if ((playerChoice == "rock" && computerChoice == "paper") || (playerChoice == "paper" && computerChoice == "scissors") @@ -36,7 +38,7 @@ const points = (() => { } function reset() { player = 0; - computer = 0 + computer = 0; } return {get player() {return player}, get computer() {return computer}, @@ -46,9 +48,18 @@ const points = (() => { const buttons = document.querySelectorAll("button.choose"); const resultDiv = document.querySelector("div#result"); +function playGameRound(value) { + let result = playRoundResult(value, getComputerChoice()); + resultDiv.textContent = `Result: ${result}`; + let point = []; + + if ((points.player >= 5 && (point = ["Player", points.player, "Computer", points.computer])) + ||(points.computer >= 5 && (point = ["Computer",points.computer, "Player", points.player]))) { + resultDiv.innerText += `\r\n${point[0]} won against ${point[2]} ${point[1]}:${point[3]}`; + points.reset(); + } +} + buttons.forEach(button => { - button.addEventListener("click", () => { - let result = playRound(button.value, getComputerChoice()); - resultDiv.textContent = `Result: ${result}`; - }); + button.addEventListener("click", () => playGameRound(button.value)); }); \ No newline at end of file