fix(curriculum): dice game steps fix (freeCodeCamp#55666)

Co-authored-by: Huyen Nguyen <[email protected]>

Author: gagan-bhullar-tech

curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/review-algorithmic-thinking-by-building-a-dice-game/657a0ea50da0c8d9d6d7950a.md

@@ -9,13 +9,13 @@ dashedName: step-1
 
 In this project, you will learn algorithmic thinking by building a dice game. There are a total of 6 rounds and for each round, the player can roll the dice up to 3 times and collect a score. 
 
-The HTML and CSS have been provided for you. Feel free to explore them. When you are ready, you will need to set up your HTML variables. Get all of your `.die` elements and assign them to a `listOfAllDice` variable. Get your score inputs (the `input` elements in your `#score-options`) and score spans, and assign them to `scoreInputs` and `scoreSpans`. Assign the `#current-round` element to `currentRound` and the `#current-round-rolls` element to `currentRoundRolls`, then do the same for your `#total-score` and `#score-history` elements. Assign your `#roll-dice-btn`, `#keep-score-btn`, `#rules-btn`, and `.rules-container` to variables with properly formatted names.
+The HTML and CSS have been provided for you. Feel free to explore them. When you are ready, you will need to set up your HTML variables. Get all of your `.die` elements and assign them to a `listOfAllDice` variable. Get your score inputs (the `input` elements in your `#score-options`) and score spans, and assign them to `scoreInputs` and `scoreSpans`. Assign the `#current-round` element to `roundElement` and the `#current-round-rolls` element to `rollsElement`, then do the same for your `#total-score` and `#score-history` elements. Assign your `#roll-dice-btn`, `#keep-score-btn`, `#rules-btn`, and `.rules-container` to variables with properly formatted names.
 
 When the user clicks on the `Show rules` button, they should be able to toggle between showing and hiding the game rules. Create a variable `isModalShowing` to track the state of the game rules.
 
 Each time the user rolls the dice, you will need to keep track of all of the dice values. Create a variable `diceValuesArr` to track this.
 
-Throughout the game, you will need to keep track of the current score, total score, number of rolls and which round the player is on. Declare `rolls`, `score`, `total`, and `round` variables for this purpose.
+Throughout the game, you will need to keep track of the current score, total score, number of rolls and which round the player is on. Declare `rolls`, `score`, and `round` variables for this purpose.
 
 Think about what the starting value of each of these variables should be. All of these variables should be able to be reassigned.
 
@@ -39,22 +39,22 @@ You should assign your `#score-options span` elements to `scoreSpans`.
 assert.deepEqual(scoreSpans, document.querySelectorAll("#score-options span"));
 ```
 
-You should assign your `#current-round` element to `currentRound`.
+You should assign your `#current-round` element to `roundElement`.
 
 ```js
-assert.deepInclude([document.getElementById("current-round"), document.querySelector("#current-round")], currentRound);
+assert.deepInclude([document.getElementById("current-round"), document.querySelector("#current-round")], roundElement);
 ```
 
-You should assign your `#current-round-rolls` element to `currentRoundRolls`.
+You should assign your `#current-round-rolls` element to `rollsElement`.
 
 ```js
-assert.deepInclude([document.getElementById("current-round-rolls"), document.querySelector("#current-round-rolls")], currentRoundRolls);
+assert.deepInclude([document.getElementById("current-round-rolls"), document.querySelector("#current-round-rolls")], rollsElement);
 ```
 
-You should assign your `#total-score` element to `totalScoreText`.
+You should assign your `#total-score` element to `totalScoreElement`.
 
 ```js
-assert.deepInclude([document.getElementById("total-score"), document.querySelector("#total-score")], totalScore);
+assert.deepInclude([document.getElementById("total-score"), document.querySelector("#total-score")], totalScoreElement);
 ```
 
 You should assign your `#score-history` element to `scoreHistory`.
@@ -112,12 +112,6 @@ Your `score` variable should have the value `0`.
 assert.strictEqual(score, 0);
 ```
 
-Your `total` variable should have the value `0`.
-
-```js
-assert.strictEqual(total, 0);
-```
-
 Your `round` variable should have the value `1`.
 
 ```js
@@ -131,7 +125,6 @@ assert.match(code, /let isModalShowing/);
 assert.match(code, /let diceValuesArr/);
 assert.match(code, /let rolls/);
 assert.match(code, /let score/);
-assert.match(code, /let total/);
 assert.match(code, /let round/);
 ```
 

curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/review-algorithmic-thinking-by-building-a-dice-game/657a19e477dc04e36a86dffc.md

@@ -299,9 +299,9 @@ input[type="radio"]:disabled + label {
 const listOfAllDice = document.querySelectorAll(".die");
 const scoreInputs = document.querySelectorAll("#score-options input");
 const scoreSpans = document.querySelectorAll("#score-options span");
-const currentRound = document.getElementById("current-round");
-const currentRoundRolls = document.getElementById("current-round-rolls");
-const totalScore = document.getElementById("total-score");
+const roundElement = document.getElementById("current-round");
+const rollsElement = document.getElementById("current-round-rolls");
+const totalScoreElement = document.getElementById("total-score");
 const scoreHistory = document.getElementById("score-history");
 const rollDiceBtn = document.getElementById("roll-dice-btn");
 const keepScoreBtn = document.getElementById("keep-score-btn");
@@ -311,7 +311,6 @@ const rulesBtn = document.getElementById("rules-btn");
 let diceValuesArr = [];
 let isModalShowing = false;
 let score = 0;
-let total = 0;
 let round = 1; 
 let rolls = 0; 
 

curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/review-algorithmic-thinking-by-building-a-dice-game/657c91ad5028770fc68d6116.md

@@ -290,9 +290,9 @@ input[type="radio"]:disabled + label {
 const listOfAllDice = document.querySelectorAll(".die");
 const scoreInputs = document.querySelectorAll("#score-options input");
 const scoreSpans = document.querySelectorAll("#score-options span");
-const currentRound = document.getElementById("current-round");
-const currentRoundRolls = document.getElementById("current-round-rolls");
-const totalScore = document.getElementById("total-score");
+const roundElement = document.getElementById("current-round");
+const rollsElement = document.getElementById("current-round-rolls");
+const totalScoreElement = document.getElementById("total-score");
 const scoreHistory = document.getElementById("score-history");
 const rollDiceBtn = document.getElementById("roll-dice-btn");
 const keepScoreBtn = document.getElementById("keep-score-btn");
@@ -302,7 +302,6 @@ const rulesBtn = document.getElementById("rules-btn");
 let diceValuesArr = [];
 let isModalShowing = false;
 let score = 0;
-let total = 0;
 let round = 1; 
 let rolls = 0; 
   --fcc-editable-region--

curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/review-algorithmic-thinking-by-building-a-dice-game/657ca813b0908a230e3eb488.md

@@ -277,9 +277,9 @@ input[type="radio"]:disabled + label {
 const listOfAllDice = document.querySelectorAll(".die");
 const scoreInputs = document.querySelectorAll("#score-options input");
 const scoreSpans = document.querySelectorAll("#score-options span");
-const currentRound = document.getElementById("current-round");
-const currentRoundRolls = document.getElementById("current-round-rolls");
-const totalScore = document.getElementById("total-score");
+const roundElement = document.getElementById("current-round");
+const rollsElement = document.getElementById("current-round-rolls");
+const totalScoreElement = document.getElementById("total-score");
 const scoreHistory = document.getElementById("score-history");
 const rollDiceBtn = document.getElementById("roll-dice-btn");
 const keepScoreBtn = document.getElementById("keep-score-btn");
@@ -289,7 +289,6 @@ const rulesBtn = document.getElementById("rules-btn");
 let diceValuesArr = [];
 let isModalShowing = false;
 let score = 0;
-let total = 0;
 let round = 1; 
 let rolls = 0; 
 

curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/review-algorithmic-thinking-by-building-a-dice-game/657caa69db80ef25862b1b17.md

@@ -17,28 +17,28 @@ You should have a function called `updateStats`.
 assert.isFunction(updateStats);
 ```
 
-Your `updateStats` function should update the `currentRoundRolls` element with the correct value.
+Your `updateStats` function should update the `rollsElement` element with the correct value.
 
 ```js
 rolls = 2;
 updateStats();
-assert.strictEqual(currentRoundRolls.innerText, "2");
+assert.strictEqual(rollsElement.innerText, "2");
 ```
 
-Your `updateStats` function should update the `currentRound` element with the correct value.
+Your `updateStats` function should update the `roundElement` element with the correct value.
 
 ```js
 round = 5;
 updateStats();
-assert.strictEqual(currentRound.innerText, "5");
+assert.strictEqual(roundElement.innerText, "5");
 ```
 
 Rolling the dice should update the `rolls` correctly.
 
 ```js
 rolls = 0;
 rollDiceBtn.click();
-assert.strictEqual(currentRoundRolls.innerText, "1");
+assert.strictEqual(rollsElement.innerText, "1");
 ```
 
 # --seed--
@@ -283,9 +283,9 @@ input[type="radio"]:disabled + label {
 const listOfAllDice = document.querySelectorAll(".die");
 const scoreInputs = document.querySelectorAll("#score-options input");
 const scoreSpans = document.querySelectorAll("#score-options span");
-const currentRound = document.getElementById("current-round");
-const currentRoundRolls = document.getElementById("current-round-rolls");
-const totalScore = document.getElementById("total-score");
+const roundElement = document.getElementById("current-round");
+const rollsElement = document.getElementById("current-round-rolls");
+const totalScoreElement = document.getElementById("total-score");
 const scoreHistory = document.getElementById("score-history");
 const rollDiceBtn = document.getElementById("roll-dice-btn");
 const keepScoreBtn = document.getElementById("keep-score-btn");
@@ -295,7 +295,6 @@ const rulesBtn = document.getElementById("rules-btn");
 let diceValuesArr = [];
 let isModalShowing = false;
 let score = 0;
-let total = 0;
 let round = 1; 
 let rolls = 0; 
 

curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/review-algorithmic-thinking-by-building-a-dice-game/657caf204c0d672a35411c31.md

@@ -280,9 +280,9 @@ input[type="radio"]:disabled + label {
 const listOfAllDice = document.querySelectorAll(".die");
 const scoreInputs = document.querySelectorAll("#score-options input");
 const scoreSpans = document.querySelectorAll("#score-options span");
-const currentRound = document.getElementById("current-round");
-const currentRoundRolls = document.getElementById("current-round-rolls");
-const totalScore = document.getElementById("total-score");
+const roundElement = document.getElementById("current-round");
+const rollsElement = document.getElementById("current-round-rolls");
+const totalScoreElement = document.getElementById("total-score");
 const scoreHistory = document.getElementById("score-history");
 const rollDiceBtn = document.getElementById("roll-dice-btn");
 const keepScoreBtn = document.getElementById("keep-score-btn");
@@ -292,7 +292,6 @@ const rulesBtn = document.getElementById("rules-btn");
 let diceValuesArr = [];
 let isModalShowing = false;
 let score = 0;
-let total = 0;
 let round = 1; 
 let rolls = 0; 
 
@@ -310,8 +309,8 @@ const rollDice = () => {
 };
 
 const updateStats = () => {
-  currentRoundRolls.textContent = rolls;
-  currentRound.textContent = round;
+  rollsElement.textContent = rolls;
+  roundElement.textContent = round;
 };
 
 --fcc-editable-region--

curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/review-algorithmic-thinking-by-building-a-dice-game/657cf677438e705eab9fd1f9.md

@@ -320,9 +320,9 @@ input[type="radio"]:disabled + label {
 const listOfAllDice = document.querySelectorAll(".die");
 const scoreInputs = document.querySelectorAll("#score-options input");
 const scoreSpans = document.querySelectorAll("#score-options span");
-const currentRound = document.getElementById("current-round");
-const currentRoundRolls = document.getElementById("current-round-rolls");
-const totalScore = document.getElementById("total-score");
+const roundElement = document.getElementById("current-round");
+const rollsElement = document.getElementById("current-round-rolls");
+const totalScoreElement = document.getElementById("total-score");
 const scoreHistory = document.getElementById("score-history");
 const rollDiceBtn = document.getElementById("roll-dice-btn");
 const keepScoreBtn = document.getElementById("keep-score-btn");
@@ -332,7 +332,6 @@ const rulesBtn = document.getElementById("rules-btn");
 let diceValuesArr = [];
 let isModalShowing = false;
 let score = 0;
-let total = 0;
 let round = 1;
 let rolls = 0;
 
@@ -350,8 +349,8 @@ const rollDice = () => {
 };
 
 const updateStats = () => {
-  currentRoundRolls.textContent = rolls;
-  currentRound.textContent = round;
+  rollsElement.textContent = rolls;
+  roundElement.textContent = round;
 };
 
 const updateRadioOption = (index, score) => {

curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/review-algorithmic-thinking-by-building-a-dice-game/657d1d52d574588677347c7f.md

@@ -291,9 +291,9 @@ input[type="radio"]:disabled + label {
 const listOfAllDice = document.querySelectorAll(".die");
 const scoreInputs = document.querySelectorAll("#score-options input");
 const scoreSpans = document.querySelectorAll("#score-options span");
-const currentRound = document.getElementById("current-round");
-const currentRoundRolls = document.getElementById("current-round-rolls");
-const totalScore = document.getElementById("total-score");
+const roundElement = document.getElementById("current-round");
+const rollsElement = document.getElementById("current-round-rolls");
+const totalScoreElement = document.getElementById("total-score");
 const scoreHistory = document.getElementById("score-history");
 const rollDiceBtn = document.getElementById("roll-dice-btn");
 const keepScoreBtn = document.getElementById("keep-score-btn");
@@ -303,7 +303,6 @@ const rulesBtn = document.getElementById("rules-btn");
 let diceValuesArr = [];
 let isModalShowing = false;
 let score = 0;
-let total = 0;
 let round = 1; 
 let rolls = 0; 
 
@@ -321,8 +320,8 @@ const rollDice = () => {
 };
 
 const updateStats = () => {
-  currentRoundRolls.textContent = rolls;
-  currentRound.textContent = round;
+  rollsElement.textContent = rolls;
+  roundElement.textContent = round;
 };
 
 const updateRadioOption = (index, score) => {

curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/review-algorithmic-thinking-by-building-a-dice-game/657d3ab710745d17697c633a.md

@@ -7,9 +7,11 @@ dashedName: step-9
 
 # --description--
 
-When you roll the dice and make a selection, you are not able to keep the score you selected and move onto the next round. Create an `updateScore` function to add this functionality. Your function will need a parameter for the score option the user selected and the type of score they achieved.
+When you roll the dice and make a selection, you are not able to keep the score you selected and move onto the next round.
 
-The function will need to add the value the user selected to the total score, update the total score text on the page, and add a new list item to the score history with the format `${achieved} : ${selectedValue}`.
+Create an `updateScore` function to add this functionality. Your function will need two parameters for the user selected score option. The first parameter will be passed the `value` of the radio button, remember this is a string, and the second parameter will be passed the `id` value of the radio button, which is the type of score they achieved.
+
+The function will need to add the user selected value to the score, update the total score text on the page, and add a new `li` element to the score history `ul` element, using the format `${achieved} : ${selectedValue}` for the `li` element content.
 
 # --hints--
 
@@ -19,6 +21,14 @@ You should have a `updateScore` function.
 assert.isFunction(updateScore);
 ```
 
+Your `updateScore` function should convert string value to integer and add the value to the total score.
+
+```js
+score = 0;
+updateScore("10", "hi");
+assert.strictEqual(score, 10);
+```
+
 Your `updateScore` function should add the value of the first parameter to the total score.
 
 ```js
@@ -27,12 +37,12 @@ updateScore(10, "hi");
 assert.strictEqual(score, 10);
 ```
 
-Your `updateScore` function should update the text of the `totalScore` element.
+Your `updateScore` function should update the text of the `totalScoreElement` element.
 
 ```js
 score = 0;
 updateScore(10, "hi");
-assert.strictEqual(totalScore.innerText, "10");
+assert.strictEqual(totalScoreElement.innerText, "10");
 ```
 
 Your `updateScore` function should add a new list item to the `scoreHistory` element.
@@ -293,9 +303,9 @@ input[type="radio"]:disabled + label {
 const listOfAllDice = document.querySelectorAll(".die");
 const scoreInputs = document.querySelectorAll("#score-options input");
 const scoreSpans = document.querySelectorAll("#score-options span");
-const currentRound = document.getElementById("current-round");
-const currentRoundRolls = document.getElementById("current-round-rolls");
-const totalScore = document.getElementById("total-score");
+const roundElement = document.getElementById("current-round");
+const rollsElement = document.getElementById("current-round-rolls");
+const totalScoreElement = document.getElementById("total-score");
 const scoreHistory = document.getElementById("score-history");
 const rollDiceBtn = document.getElementById("roll-dice-btn");
 const keepScoreBtn = document.getElementById("keep-score-btn");
@@ -305,7 +315,6 @@ const rulesBtn = document.getElementById("rules-btn");
 let diceValuesArr = [];
 let isModalShowing = false;
 let score = 0;
-let total = 0;
 let round = 1; 
 let rolls = 0; 
 
@@ -323,8 +332,8 @@ const rollDice = () => {
 };
 
 const updateStats = () => {
-  currentRoundRolls.textContent = rolls;
-  currentRound.textContent = round;
+  rollsElement.textContent = rolls;
+  roundElement.textContent = round;
 };
 
 const updateRadioOption = (index, score) => {