JavaScript rock paper scissors

so I made this code by using CSS, HTML and javascript and I keep getting this error and that my scissor function isn’t working and just a bunch of not working I copied the tutorial and I am still lost


// rock paper scissors game

function rpsGame(yourChoice) {

    console.log(yourChoice);

    var humanChoice, botChoice;

    humanChoice = yourChoice.id;

    botChoice = numberToChoice(randToRpsInt());

    console.log('computer choice', botChoice);

    results = decidewinner(humanChoice, botChoice);

    console.log(results);

   

    message = finalmessage(results); // {'message':'you won', 'color': 'green'}

    console.log(message);

    rpsfrontend(yourChoice.id, botChoice, message);

}

function randToRpsInt() {

    return Math.floor(Math.random() * 3);

//Math.random() * 3 would give any number below 3 including decials always remeber capital M so use Math.floor(Math.random() * 3);

}

 

function numberToChoice(number) {

    return ['rock', 'paper', 'scissors'] [number];

}

function decidewinner(yourChoice, computerChoice) {

    var rpsDatabase = {

        'rock': {'scissors': 1, 'rock': 0.5, 'paper': 0 },

        'paper': {'rock': 1, 'paper': 0.5, 'scissors': 0 },

        'scissor': {'paper': 1, 'scissors': 0.5, 'rock':0 }

    };

    var yourScore = rpsDatabase[yourChoice] [computerChoice];

    var computerScore = rpsDatabase[computerChoice] [yourChoice];

    return [yourScore, computerScore];

}
// this part and how the computerScore is undefined here  is an error
function finalmessage([yourScore, computerScore]) {

    if (yourScore === 0) {

        return {'message': 'you lost!', 'colour': 'red'};

    } else if (yourScore === 0.5) {

        return {'message': 'you tied', 'color': 'yellow'};

    } else {

        return{'message': 'you win!', 'color': 'green'};

    }

}

function rpsfrontend(humanimagechoice, botimagechoice, finalmessage) {

    var imagesdatabase = {

        'scissors': document.getElementById('scissors').src,

        'rock': document.getElementById('rock').src,

        'paper': document.getElementById('paper').src

    }

    document.getElementById('rock').remove();

    document.getElementById('paper').remove();

    document.getElementById('scissors').remove();

    var humanDiv = document.createElement('div');

    var botDiv = document.createElement('div');

    var messageDiv = document.createElement('div');

    humanDiv.innerHTML = "<img src='" + imagesdatabase[humanimagechoice] + "' height=150 width=150 style='box-shadow: 0px 10px 50px rgba(37, 50, 233, 1);'>"

    messageDiv.innerHTML = "<h1 style='color: " + finalmessage['color'] + "; font-size: 60px; padding: 30px; '>" + finalmessage['message'] + "</h1>"

    botDiv.innerHTML = "<img src='" + imagesdatabase[botimagechoice] + "' height=150 width=150 style='box-shadow: 0px 10px 50px rgba(0, 0, 0,);'>"

    document.getElementById('flex-box-rps-div').appendChild(humanDiv);

    document.getElementById('flex-box-rps-div').appendChild(botDiv);

    document.getElementById('flex-box-rps-div').appendChild(messageDiv);

}
<div class="container-3">

        <h2>Challenge 3: Rock, Paper, Scissosrs</h2>

        <div class="flex-box-rps" id="flex-box-rps-div">

            <img id="rock" src="https://www.pinclipart.com/picdir/middle/3-35038_rock-clipart-for-free-cartoon-rock-transparent-background.png" height=150 width= 150 alt="" onclick="rpsGame(this)">

            <img id="paper" src="https://media.istockphoto.com/vectors/cartoon-blank-piece-of-paper-vector-id1190524331?k=20&m=1190524331&s=170667a&w=0&h=1lGBZ4V1sywxiqWQ3M-PqjdEkvjVwMnJF9GB_f1iGcQ=" height=150 width= 150 alt="" onclick="rpsGame(this)" >

            <img id="sicissors" src="https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fwww.ldproducts.com%2Fmedia%2Fcatalog%2Fproduct%2Fcache%2F3%2Fimage%2F9df78eab33525d08d6e5fb8d27136e95%2F2%2F0%2F2000_1014265749.jpg&f=1&nofb=1" height=150 width= 150 alt="" onclick="rpsGame(this)">

        </div>

    </div>

this is from JavaScript Tutorial for Beginners - Full Course in 8 Hours [2020] - YouTube

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

1 Like

Typos:

<img id="sicissors" src="https://external-con...
          ^ extra i
'scissor': {'paper': 1, 'scissors': 0.5, 'rock':0 }
        ^ missing s
1 Like