View difference between Paste ID: SMuv41n1 and ZFdJzSsR

 //an array storing players' point
 let points = [];
 
 //points that a player scores after each dice roll
 let roundPoints;
 
 //variable controlling players if equal to 0 plays player1 if equal to 1 plays player2
 //as in programming we number from 0, player1 will have a value of 0 player2 a value of 1 this will make it easier to retrieve points from the array
 let currentPlayer;
 
 //boolean variable controlling gameplay if true we can play if false gameplay will be impossible
 let canPlay;
 
 // add an array that will store the addresses to the bone
 const images = [
   "https://cdn.glitch.com/8fbc579f-3346-47a0-abbc-945a83abb962%2Fkosc-1.png?v=1610038358032",
   "https://cdn.glitch.com/8fbc579f-3346-47a0-abbc-945a83abb962%2Fkosc-2.png?v=1610038358080",
   "https://cdn.glitch.com/8fbc579f-3346-47a0-abbc-945a83abb962%2Fkosc-3.png?v=1610038358032",
   "https://cdn.glitch.com/8fbc579f-3346-47a0-abbc-945a83abb962%2Fkosc-4.png?v=1610038358142",
   "https://cdn.glitch.com/8fbc579f-3346-47a0-abbc-945a83abb962%2Fkosc-5.png?v=1610038358032",
   "https://cdn.glitch.com/8fbc579f-3346-47a0-abbc-945a83abb962%2Fkosc-6.png?v=1610038358193",
 ];
 
 //function responsible for preparing a new game
 newGame();
 
 function newGame() {
   //enable game
   canPlay = true;
 
   //the game always starts with player 1
   currentPlayer = 0;
   //hide the bone at the beginning of the game
   document.querySelector(".die").style.display = "none";
 
   //zero all scores
   points = [0, 0];
   roundPoints = 0;
 
   //we update the user interface with points
   document.getElementById("result-0").textContent = "0";
   document.getElementById("result-1").textContent = "0";
   document.getElementById("current-points-0").textContent = "0";
   document.getElementById("current-points-1").textContent = "0";
 
   //change the names to Player1 and Player2 because during gameplay we will modify these elements by setting the victory text
   document.getElementById("name-0").textContent = "Player1";
   document.getElementById("name-1").textContent = "Player 2";
   //remove the win class responsible for replacing the Player1/2 text with win
   document.querySelector(".player-0-panel").classList.remove("victory");
   document.querySelector(".player-1-panel").classList.remove("victory");
 
   // we remove the active class responsible for indicating the current player
   document.querySelector(".player-0-panel").classList.remove("active");
   document.querySelector(".player-1-panel").classList.remove("active");
 
   // we add the active class to Player1 because he is always the one who starts the game
   document.querySelector(".player-0-panel").classList.add("active");
 }
 
 //we are adding an event detector to our page, this particular one will detect a click on the Throw Dice button
 // wecreate an anonymous function - one without a name, which we will use only in this particular context and will not be able to use it outside of the
 document.querySelector(".btn-throw").addEventListener("click", function () {
   if (canPlay) {
     //throw the dice, draw the value 1-6
     const eyeNumber = Math.floor(Math.random() * 6) + 1;
 
     //we create the variable bonePicture storing a reference to the bone element on the page and display the cube
 
     const diePicture = document.querySelector(".die");
     //select the appropriate graphic
     diePicture.src = images[eyeNumber - 1];
 
     //display the bone
     diePicture.style.display = "block";
 
     //update the result of the round if the dice didn't have a single eye rolled
 
     if (eyeNumber != 1) {
       //we add the score
       roundPoints += eyeNumber;
       document.querySelector("#current-points-" + currentPlayer).textContent =
         roundPoints;
     } else {
       //Please ask participants to write down the function call and we will write its definitions in the next lesson
     }
   }
 });
 
 //mechanism to switch player
 
 function nextPlayer() {
   //conditional operator- condition is checked if true is returned then part after is executed ? if false then part after :
   currentPlayer == 0 ? (currentPlayer = 1) : (currentPlayer = 0);
 
   //we reset the round points
   roundPoints = 0;
 
   //we are zeroing the points in the user interface
 
   document.getElementById("current-points-0").textContent = "0";
   document.getElementById("current-points-1").textContent = "0";
 
   //switch the class so that it points to the current player toggle works so that if there is already a class indicated it removes it and if there is no class it is added to the given element
   document.querySelector(".player-0-panel").classList.toggle("active");
   document.querySelector(".player-1-panel").classList.toggle("active");
 }
 
 //program what to execute when the hold button is clicked
 document.querySelector(".btn-hold").addEventListener("click", function () {
   if (canPlay) {
     //add points for a specific player
     points[currentPlayer] += roundPoints;
 
     //we update the UI
     document.querySelector("#result-" + currentPlayer).textContent =
       points[currentPlayer];
 
     //we check if the player has won
     if (points[currentPlayer] >= 100) {
       //we block gameplay
       canPlay = false;
       //we set the text Victory for the winner!
       document.querySelector("#name-" + currentPlayer).textContent = "Victory!";
       //hide the die
       document.querySelector(".die").style.display = "none";
 
       //add a win class to the current player that will modify the win text
       document
         .querySelector(".player-" + currentPlayer + "-panel")
         .classList.add("win");
     } else {
       //if the player has not scored the required points to win then the player is switched over
       nextPlayer();
     }
   }
 });
 
 //clicking the new-game button activates the initialSettings function
 document.querySelector(".btn-new-game").addEventListener("click", newGame);