Max 5 points, announce winner

This commit is contained in:
NetMan 2024-01-09 19:13:16 +01:00
parent b83b1ed631
commit 8f9d6d689f
2 changed files with 22 additions and 9 deletions

View File

@ -16,15 +16,17 @@
font-size: xx-large;
cursor: pointer;
}
#result {
font-family: Arial, Helvetica, sans-serif;
font-size: larger;
}
</style>
</head>
<body>
<button class="choose" value="rock">Rock</button>
<button class="choose" value="paper">Paper</button>
<button class="choose" value="scissors">Scissors</button>
<div id="result">
Result:
</div>
<div id="result"></div>
<script src="index.js"></script>
</body>
</html>

View File

@ -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));
});