From 807ce0487ba0a3f6ededfd3c724f7965b4f28ef5 Mon Sep 17 00:00:00 2001 From: NetMan <13informatyka14@gmail.com> Date: Tue, 9 Jan 2024 18:53:33 +0100 Subject: [PATCH] Added basic DOM functionality Instead of prompt() and console now using DOM elements --- index.html | 16 ++++++++-------- index.js | 51 ++++++++++----------------------------------------- 2 files changed, 18 insertions(+), 49 deletions(-) diff --git a/index.html b/index.html index 9edcc8d..8946160 100644 --- a/index.html +++ b/index.html @@ -5,11 +5,8 @@ Rock Paper Scissors - + + + +
+ Result: +
\ No newline at end of file diff --git a/index.js b/index.js index ac194c4..eaa4a6e 100644 --- a/index.js +++ b/index.js @@ -1,3 +1,5 @@ +'use strict'; + const choices = ["rock", "paper", "scissors"]; function getComputerChoice() { @@ -43,45 +45,12 @@ const points = (() => { playerAddPoints, computerAddPoints, reset}; })() -function game(clickEvent) { - clickEvent.setAttribute('onclick', ' '); - points.reset(); +const buttons = document.querySelectorAll("button.choose"); +const resultDiv = document.querySelector("div#result"); - for (let i = 0; i < 5; i++) { - let correctOption = false - let playerChoice; - - while (correctOption == false) { - playerChoice = prompt("What do you choose, 'rock', 'paper' or 'scissors'?"); - if (playerChoice) { - choices.forEach(element => { - if (playerChoice.toLowerCase().trim() == element) { - correctOption = true - return; - } - }) - } else if (confirm(`Do you wanna quit the game?`)) { - clickEvent.setAttribute('onclick', 'game(this)'); - throw new Error("Exited the game on user's request"); - } - } - - let round = playRound(playerChoice, getComputerChoice()); - let pointsString = `Points: ${points.player}:${points.computer}\n`; - alert(pointsString + round); - } - - let confirmString; - if (points.player > points.computer) { - confirmString = `You won ${points.player}:${points.computer}` - } else if (points.player == points.computer) { - confirmString = `That was a ${points.player}:${points.computer} tie` - } else if (points.player < points.computer) { - confirmString = `You lost ${points.player}:${points.computer}` - } - if (confirm(`${confirmString}, do you wanna restart the game?`)) { - game(); - } -} - -// game(); \ No newline at end of file +buttons.forEach(button => { + button.addEventListener("click", () => { + let result = playRound(button.value, getComputerChoice()); + resultDiv.textContent = `Result: ${result}`; + }); +}); \ No newline at end of file