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);
const hero = {
elementId: "hero",
name: "Wizard",
emoji: "🧙",
health: 60,
diceCount: 3
};
const monster = {
elementId: "monster",
name: "Spider",
emoji: "🕷",