Review Algorithmic Thinking by Building a Dice Game - Step 14

[PieroGentile]

Tell us what’s happening:

Hey fCC Gang, Can anyone suggest where I am going wrong?

Your code so far

<!-- file: index.html -->

/* file: styles.css */

/* file: script.js */
// User Editable Region

const checkForStraights = (arr) => {
// Sorts dice array from lowest to highest
const sortedArr = listOfAllDice.sort((num1, num2) => num1 - num2);
console.log("Sorted from LOWEST to HIGHEST", sortedArr);

// Removes Duplicates & Creates a New Array
const sortedArr2 = [...new Set(sortedArr)].map(Number); 
const joinedSortedArr = sortedArr2.join('');

const HighStraights = ['12345', '23456'];
const LowStraights = ['1234', '2345', '3456'];

// High Straight Detection - (12345, 23456)
if (HighStraights.includes(joinedSortedArr)) {
    console.log("High Straight Detected!");
    updateRadioOption(4, 40); // Update High Straight Radio Option
    updateRadioOption(3, 30); // Update Low Straight Radio Option
    scoreSpans[4].innerHTML = ", score = 40"; // Update innerHTML DOM for HS
    scoreSpans[3].innerHTML = ", score = 30"; // Update innerHTML DOM for LS
} 
// Low Straight Detection - (1234, 2345, 3456)
if (LowStraights.includes(joinedSortedArr)) {
    console.log("Low Straight Detected!")
    updateRadioOption(3, 30); // Update Low Straight Radio Option
    scoreSpans[3].innerHTML = ", score = 30"; // Update innerHTML DOM
} else {
    console.log("No Straight Detected:", sortedArr2);
}
        // Updates last option regardless
        updateRadioOption(5, 0);
        scoreSpans[5].innerHTML = ", score = 0";
};

rollDiceBtn.addEventListener("click", () => {
  if (rolls === 3) {
    alert("You have made three rolls this round. Please select a score.");
  } else {
    rolls++;
    resetRadioOptions();
    rollDice();
    updateStats();
    getHighestDuplicates(diceValuesArr);
    detectFullHouse(diceValuesArr);
    checkForStraights(diceValuesArr);
  }
});

// User Editable Region

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/132.0.0.0 Safari/537.36

Challenge Information:

Review Algorithmic Thinking by Building a Dice Game - Step 14

freeCodeCamp.org

[sanity]

Have you looked at the console? There’s error after clicking Roll the dice:

Uncaught TypeError: listOfAllDice.sort is not a function

[PieroGentile]

Thanks for your reply, I have just declared listOfAllDice again. I removed it before submitting the code to the forum. In the previous exercise I didn’t have listOfAllDice declared and it still worked.

Am I referencing the array correctly? I am using listOfAllDice like I did previously in the Triples & Pairs function or should I reference diceValuesArr ?

listOfAllDice is the DOM element, which get’s it’s data from diceValuesArr so I am sure I am doing it right.

Ignore the math random/floor code btw, I used that previously to make sure the script was working. I removed it when I submitted the code but still didn’t work

Anyway here’s my console log now

2. If a small straight is rolled, your checkForStraights function should enable the fourth radio button, set the value to 30, and update the displayed text to , score = 30.
3. If a large straight is rolled, your checkForStraights function should also enable the fourth radio button, set the value to 30, and update the displayed text to , score = 30.

// tests completed
// console output
Dice Roll [ 5, 3, 6, 4, 2 ]
Sorted from LOWEST to HIGHEST [ 2, 3, 4, 5, 6 ]
Unique Numbers [ 2, 3, 4, 5, 6 ]
High Straight Detected!

Updated code

const checkForStraights = () => {

const listOfAllDice = [];
for (let i = 0; i < 5; i++) {
    const randomNumber = Math.floor(Math.random() * (6 - 1 + 1)) + 1;
    listOfAllDice.push(randomNumber);
}
console.log("Dice Roll", listOfAllDice);

const sortedArr = listOfAllDice.sort((num1, num2) => num1 - num2);
console.log("Sorted from LOWEST to HIGHEST", sortedArr);


const sortedArr2 = [...new Set(sortedArr)].map(Number); //Removes duplicates
console.log("Unique Numbers", sortedArr2);

const joinedSortedArr = sortedArr2.join('');


const HighStraights = ['12345', '23456'];
const LowStraights = ['1234', '2345', '3456'];

// High Straight Detection - (12345, 23456)
if (HighStraights.includes(joinedSortedArr)) {
    console.log("High Straight Detected!");
    updateRadioOption(4, 40); // Update High Straight Radio Option
    updateRadioOption(3, 30); // Update Low Straight Radio Option
    scoreSpans[4].innerHTML = ", score = 40"; // Update innerHTML DOM for HS
    scoreSpans[3].innerHTML = ", score = 30"; // Update innerHTML DOM for LS

if (LowStraights.includes(joinedSortedArr)) {
    console.log("Low Straight Detected!")
    updateRadioOption(3, 30); // Update Low Straight Radio Option
    scoreSpans[3].innerHTML = ", score = 30"; // Update innerHTML DOM
} 
} 
else {
    console.log("No Straight Detected:", sortedArr2);
}
        // Updates last option regardless
        updateRadioOption(5, 0);
        scoreSpans[5].innerHTML = ", score = 0";
};

[ILM]

@PieroGentile

const listOfAllDice = [];
for (let i = 0; i < 5; i++) {
    const randomNumber = Math.floor(Math.random() * (6 - 1 + 1)) + 1;
    listOfAllDice.push(randomNumber);
}

why are you generating random numbers inside checkForStraights? you should check the dice generated by the part of code that generates dice

[PieroGentile]

This was to help me debug when I was writing the code, I removed it and referenced listOfAllDice but it didn’t work.

[ILM]

how are you referencing listOfAllDice? do you know what listOfAllDice is?

[PieroGentile]

Of course, listOfAllDice references each dice element in the HTML with the class die. I guess I should use diceValuesArr instead? I’m just confused because I referenced listOfAllDice in the previous code exercise and it worked.

[ILM]

in the previous step you are changing what is displayed on the page as dice numbers

now you don’t need to do that

[PieroGentile]

Gotcha, so I don’t need to reference any array - All I need to do is implement the High Straight/Low Straight logic correct?

[ILM]

you need to check some numbers to see if you have a Straight, so

@PieroGentile

I don’t need to reference any array

is not correct

but listOfAllDice contains html elements, not the numbers

[PieroGentile]

I understand, Shall I reference diceValuesArr instead?

[ILM]

well, do you think that would work?

[PieroGentile]

I think so, if I am not mistaken that’s where listOfAllDice get’s it data from so I think so!

[ILM]

Then you need to try it!

[PieroGentile]

Will do! Thanks for the help ILM.

[PieroGentile]

great, seems like I only have 1 error now!

2. If a small straight is rolled, your checkForStraights function should enable the fourth radio button, set the value to 30, and update the displayed text to , score = 30.

Here’s my low straight code

if (LowStraights.includes(joinedSortedArr)) {
    console.log("Low Straight Detected!")
    updateRadioOption(3, 30); // Update Low Straight Radio Option
    scoreSpans[3].innerHTML = ", score = 30"; // Update innerHTML DOM
} 

I have removed the scoreSpans code and still doesn’t submit

[ILM]

@PieroGentile

I have removed the scoreSpans code

show the code with that removed then please

[PieroGentile]

const checkForStraights = (diceValuesArr) => {

const sortedArr = diceValuesArr.sort((num1, num2) => num1 - num2);
console.log("Sorted from LOWEST to HIGHEST", sortedArr);


const sortedArr2 = [...new Set(sortedArr)].map(Number); //Removes duplicates
console.log("Unique Numbers", sortedArr2);

const joinedSortedArr = sortedArr2.join('');


const HighStraights = ['12345', '23456'];
const LowStraights = ['1234', '2345', '3456'];

// High Straight Detection - (12345, 23456)
if (HighStraights.includes(joinedSortedArr)) {
    console.log("High Straight Detected!");
    updateRadioOption(4, 40); // Update High Straight Radio Option
    updateRadioOption(3, 30); // Update Low Straight Radio Option


if (LowStraights.includes(joinedSortedArr)) {
    console.log("Low Straight Detected!")
    updateRadioOption(3, 30); // Update Low Straight Radio Option

} 
} 
else {
    console.log("No Straight Detected:", sortedArr2);
}
        // Updates last option regardless
        updateRadioOption(5, 0);
       
};

[ILM]

your code gives a syntax error, you may want to look into that

[PieroGentile]

Try this

const checkForStraights = () => {
    // sorted array
    const sortedArr = listOfAllDice.sort((num1, num2) => num1 - num2);
    // creates new array, remove duplicates, converts all elements to numbers
    const sortedArr2 = [...new Set(sortedArr)].map(Number);
    // join elements into a string
    sortedArr.join('');
    // specific string patterns which match HS & LS
    const HighStraights = ['12345', '23456'];
    const LowStraights = ['1234', '2345', '3456'];

    if (HighStraights.includes(sortedArr2)) {
        updateRadioOption(4, 40);
        updateRadioOption(3, 30);
    }
    if (LowStraights.includes(sortedArr2)) {
        updateRadioOption(3, 30);
    }
    else {
        console.log("No Straights Detected");

    }
    updateRadioOption(5, 0)
};