const TYPES = { Grass: '🍃', Fire: '🔥', Water: '💧', Lightning: '⚡', Fighting: '✊', Psychic: '👁️', Colorless: '⭐', Darkness: '🌑', Metal: '⚙️', Dragon: '🐲', Fairy: '🧚', }; const energyHTML = (type, types = TYPES) => { return `${types[type]}`; }; const attackCostHTML = (cost) => { if (!cost.length) { return ''; } return `
${cost.map((energy) => energyHTML(energy)).join('')}
`; }; const attackDescriptionHTML = (text) => { if (!text) { return ''; } let fontSize; if (text.length > 185) { fontSize = 0.7; } else if (text.length > 120) { fontSize = 0.8; } else { fontSize = 0.9; } return `${text}`; }; const attackDamageHTML = (damage) => { if (!damage) { return ''; } return `${damage}`; }; const attackRowsHTML = (attacks) => { return attacks .map((attack) => { const { cost, damage, name, text } = attack; return `
  • ${attackCostHTML(cost)} ${name} ${attackDescriptionHTML(text)} ${attackDamageHTML(damage)}
  • `; }) .join(''); }; export const cardHTML = (details) => { const { hp, energy_type, species, length, weight, attacks, weakness, resistance, retreat, description, rarity } = details; const poke_name = details.name; // `name` would be reserved JS word return `

    Basic Pokémon

    ${poke_name}

    ${hp} HP ${energyHTML(energy_type)}
    AI generated Pokémon called ${poke_name}
    ${species} Pokémon. Length: ${length.feet}'${length.inches}", Weight: ${weight}
    weakness ${weakness ? energyHTML(weakness) : ''}
    resistance ${resistance ? energyHTML(resistance) : ''} ${resistance ? '-30' : ''}
    retreat cost
    ${energyHTML('Colorless').repeat(retreat)}

    ${description}

    `; };