Making a Rock Paper Scissor Lizard Spock Game using HTML & Javascript. Need Help with my code! HTML Code: Placeholder for instructions... Play Game How

Making a Rock Paper Scissor Lizard Spock Game using HTML & Javascript. Need Help with my code!

HTML Code:

Placeholder for instructions...

---

How many rounds:

---

Round Number: 1
Make your choice:

JavaScript code:

// Object to store the ongoing "dynamic" game information. var gameData = { roundsToPlay: 0, roundsRemaining: 0, humanWins: 0, computerWins: 0 };

// An object (almost exactly just like to one above that stores "arrays" of things // (instead of just simple numbers) that can be beaten by another "piece". For // example: ROCK beats SCISSORS and LIZARD, etc. // // TODO: Add the remaining comparisons. var winMatrix = { ROCK: ["SCISSORS", "LIZARD"], PAPER: ["ROCK", "SPOCK"], SCISSORS: ["PAPER", "LIZARD"], LIZARD: ["SPOCK", "PAPER"], SPOCK:["SCISSORS", "ROCK"], };

// Convenience function to get elements from the page function getElem(id) { var elem = document.getElementById(id);

// A little code just to aid in debugging. if (elem) { return elem; } else { alert("Element " + id + " does not exist.");

// This is just for some better debugging. console.log( `Element "${id}" does not exist. Any Errors after this are probably related!!!` );

// And this will just us some extra information if something does go wrong. throw new Error("STOPPING"); } }

// Function to initialize the game elements function initGame() { hideAll(); showInstructions(); }

// Hides all interface elements. function hideAll() { getElem("INSTRUCTIONS").hidden = true; getElem("PLAYFIELD").hidden = true; getElem("RESULTS").hidden= true; getElem("GAME_SETUP").hidden = true; }

// Show the instructions "screen" (div area) function showInstructions() { getElem("INSTRUCTIONS").hidden = false; }

// Show the rounds to play / "set-up screen" (div area) function showSetup() { getElem("INSTRUCTIONS").hidden = true; getElem("GAME_SETUP").hidden = false; }

// Show the main Playfield function showPlayfield() { getElem("GO_BUTTON").disabled = true; // So the user can't click it again. var roundsToPlayField = getElem("ROUNDS_TO_PLAY");

roundsToPlayField.disabled = true; gameData.roundsToPlay = roundsToPlayField.value; gameData.roundsRemaining = roundsToPlayField.value;

getElem("INSTRUCTIONS").hidden = true; getElem("PLAYFIELD").hidden = false; }

// Respond to the user's choice (the user button click) // This function also calls the function to get the computers ch function userChoice(whichButton) { // Decrement the number of rounds remaining. gameData.roundsRemaining--;

// Determine the current round number. var currentRoundNumber = gameData.roundsToPlay - gameData.roundsRemaining + 1;

// Display current round number getElem("CURRENT_ROUND").innerHTML = currentRoundNumber;

// Determine the user's choice var userChoiceText = whichButton.innerHTML.toUpperCase();

// Get the computer's choice var compChoiceText = getComputerChoice().toUpperCase();

// TODO (Finish): Compare the computer's choice to the users choice // TODO (Finish): Determine the winner of the round var winner = getRoundWinner(userChoiceText, compChoiceText); if (1 === 1){ getWinner(humanChoice, computerChoice);} document.getElementById("Player").innerHTML= 'Player: '+ gameData.pWin ; document.getElementById("Computer").innerHTML= ' CPU: '+ gameData.cWin; document.getElementById("Tie").innerHTML= ' Tie: ' + gameData.tie; document.getElementById("pChoice").innerHTML= 'You chose ' + buttonObj.id; document.getElementById("CPUChoice").innerHTML= 'Computer chose '+ computerChoice;

// "DEBUGGING" output: if (gameData.roundsRemaining < 1){ getElem("PLAYFIELD").hidden = true; getElem("RESULTS").hidden = false; }

// TODO: Display the winner of the round // Things to do (BUT necessarily ALL in this function)!!!! // TODO: Update the "game stats" (in code and on the display) // TODO: Check to see if the game over. (Are there no rounds remaining?) //If the game is over display the final results and "hide" the "play area. }

// Gets the computer's choice function getComputerChoice() { // Instead of repeating them here var choices = ["ROCK", "PAPER", "SCISSORS", "SPOCK", "LIZARD"]; var choice = Math.floor(Math.random() * choices.length); return choices[choice]; }

// Since there are three possibilities (either play can win, or it could be a tie)...: function getRoundWinner(userChoice, computerChoice) { // if it's a draw, simply return "TIE" if (userChoice === computerChoice){ gameData.tie++; return "TIE"; };

// Otherwise "query" the win matrix to see if the use,r's choice beats the compter's choice. var didHumanWin = winMatrix[userChoice].includes(computerChoice); var winnerString = didHumanWin ? "HUMAN" : "COMPUTER"; if(didHumanWin == true){ document.getElementById("Winners").innerHTML= "You won" ; gameData.humanWins++; } else { document.getElementById("Winners").innerHTML= "Oops! Better luck next time"; gameData.computerWins++;}; return winnerString; }