diff --git a/starter_code/index.html b/starter_code/index.html index a2f6656..dabc4fc 100755 --- a/starter_code/index.html +++ b/starter_code/index.html @@ -6,10 +6,11 @@ - + - + + @@ -17,6 +18,7 @@
ROCK
PAPER
+
SCISSOR
diff --git a/starter_code/script.js b/starter_code/script.js index 839d178..700329d 100755 --- a/starter_code/script.js +++ b/starter_code/script.js @@ -3,18 +3,48 @@ var aiPoint = 0; // This function returns the selection of the computer function getAISelection() { - //TODO: randomly choose between 'rock', 'paper', or 'scissors' + var random = Math.random(); + if(random < 1/3){ + return 'rock'; + } + + if (random < 2/3){ + return 'scissor'; + } + + return 'paper'; + } // This function picks the winner function pickWinner(userValue, aiValue) { //TODO: pick the correct winner: user or ai //TODO: Add one point for the winner + if(userValue === aiValue){ + return 'draw'; + } + + if(userValue === 'rock' && aiValue === 'paper' || + userValue === 'paper' && aiValue === 'scissor' || + userValue === 'scissor' && aiValue === 'rock'){ + aiPoint++; + return 'AI WINS!!!' + } + + if(userValue === 'paper' && aiValue === 'rock' || + userValue === 'rock' && aiValue === 'scissor' || + userValue === 'scissor' && aiValue === 'paper'){ + userPoint++; + return 'user'; + } + + } // This function sets the scoreboard with the correct points function setScore() { - + $('#userPoint').text(userPoint); + $('#aiPoint').text(aiPoint); } // This function captures the click and picks the winner @@ -23,7 +53,9 @@ function evaluate(evt) { var aiValue = getAISelection(); var winner = pickWinner(userValue, aiValue); - + + setScore(); + if ( 'user' === winner ) { $('#message').delay(50).text('You have won!, Click a box to play again'); } else if ( winner === 'draw' ) { @@ -35,5 +67,6 @@ function evaluate(evt) { // This function runs on page load $(document).ready(function(){ - + setScore(); + $('.token').on('click', evaluate); }); diff --git a/starter_code/style.css b/starter_code/style.css index 608066b..e47ab68 100755 --- a/starter_code/style.css +++ b/starter_code/style.css @@ -14,7 +14,30 @@ text-align: center; padding: 50px 0px 50px 0px; font-size: x-large; + } + +#rock{ + background-image: url("Rock.png"); + background-size: 60px; + background-repeat: no-repeat; + background-position: center; +} + +#paper{ + background-image: url("Paper.png"); + background-size: 60px; + background-repeat: no-repeat; + background-position: center; +} + +#scissor{ + background-image: url("Scissor.png"); + background-size: 45px; + background-repeat: no-repeat; + background-position: center; +} + #message { text-align: center; } \ No newline at end of file