scrimba
Create an RPG game - Rob Sutcliffe
Generate Dice Values
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Generate Dice Values
by
AboutCommentsNotes
Generate Dice Values
by
Expand for more info
index.js
run
preview
console
const hero = {
elementId: "hero",
name: "Wizard",
emoji: "🧙",
health: 60,
diceCount: 3
};

const monster = {
elementId: "monster",
name: "Spider",
emoji: "🕷",
health: 10,
diceCount: 1
};

// some maths methods for refrence to help with this challange
// Math.random() - will generate a random number between 0.00... and 1.00...
// Math.floor() - will round a number down to the nearest whole number

function getDiceRollArray(diceCount) {

// Write a functon that generates an array of random numbers between 1-6
// the lenght of the array should be the number specified in diceCount
return [1,2,3];
}

function getDice(diceCount) {

const diceRollArray = getDiceRollArray(diceCount);

let diceString = '';
for(let num of diceRollArray) {
diceString += `<div class="dice">${num}</div>`;
}
return diceString;
}

function renderCharacter(character) {

const { elementId, name, emoji, health, diceCount } = character;
let diceString = getDice(diceCount);

document.getElementById(elementId).innerHTML = `
<div class="character">
<div class="name">${name}</div>
<div class="emoji">️${emoji}</div>
<div class="health">health: <b>${health}</b></div>
<div class="dice-container">
${diceString}
</div>
</div>`;
}


document.getElementById("attack-button").onclick = function() {
renderCharacter(hero);
renderCharacter(monster);
}

renderCharacter(hero);
renderCharacter(monster);
Console
/index.html
-4:19