Rock Paper Scissors + finally design of the buttons in main PetPet page + MY OWN DOMAIN https://petpet.mreidam.com

Games/RockPaperScissors/main.js

@@ -10,20 +10,31 @@ window.onload = () => {
     for(let i=0;i<3;i++){
         let choice = document.createElement("img");
         choice.id = choices[i];
-        choice.src = `${choices[i]}.png`;
+        choice.src = `0${choices[i]}.png`;
         choice.setAttribute("draggable", "false");
-        choice.addEventListener("click", selectChoice);
+        choice.addEventListener("click", function() {
+            selectChoice(false, this.id);
+        });
         document.getElementById("choices").append(choice);
     }
 }
 
-function selectChoice(){
-    you = this.id;
-    document.getElementById("your-choice").src = `${you}.png`;
-
-    opponent = choices[Math.floor(Math.random()*3)];
-    document.getElementById("opponent-choice").src = `${opponent}.png`;
+document.addEventListener('keyup', (event) => {
+    if(event.key === '1' || event.key === '+'){
+        you = 'rock';
+        selectChoice(true);
+    }
+    if(event.key === '2' || event.key === 'ě'){
+        you = 'paper';
+        selectChoice(true);
+    }
+    if(event.key === '3' || event.key === 'š'){
+        you = 'scissors';
+        selectChoice(true);
+    }
+});
 
+function outcome(you, opponent){
     if(you===opponent){
         playerScore++;
         opponentScore-=-1;
@@ -51,6 +62,19 @@ function selectChoice(){
             }
         }
     }
+}
+
+function selectChoice(fast, choice = null){
+    if(!fast && choice !== null){
+        you = choice;
+    }
+    document.getElementById("your-choice").src = `${you}.png`;
+
+    opponent = choices[Math.floor(Math.random()*3)];
+    document.getElementById("opponent-choice").src = `${opponent}.png`;
+
+    outcome(you, opponent);
+
     document.getElementById("opponent-score").innerHTML = opponentScore;
     document.getElementById("your-score").innerHTML = playerScore;
 }