canvacord example is outdated

[twlite]

👋 canvacord has reached v6 which comes with breaking changes, also moving away from canvas for image generation for flexibility and it means that existing examples dont really work anymore.

Here is an example on how use builtin xp card builder in v6. While I am not familiar with discord.js, this example is based on the previous example mentioned in this repository.

const { RankCardBuilder, Font } = require('canvacord');

// place it outside of the command function
Font.loadDefault(); // or load your own font!

const target = message.mentions.users.first() || message.author; // Grab the target.

const user = await Levels.fetch(target.id, message.guild.id, true); // Selects the target from the database.

const rank = new RankCardBuilder() // Build the Rank Card
    .setAvatar(target.displayAvatarURL({format: 'png', size: 512}))
    .setCurrentXP(user.cleanXp) // Current User Xp for the current level
    .setRequiredXP(user.cleanNextLevelXp) //The required Xp for the next level
    .setRank(user.position) // Position of the user on the leaderboard
    .setLevel(user.level) // Current Level of the user
    .setUsername(target.username)
    .setDisplayName(target.displayName);

rank.build({ format: 'png' })
.then(data => {
    // consume the image
});

For flexibility, canvacord now has setProgressCalculator to determine the width of the progress bar.

.setProgressCalculator(() => {
  return Math.floor(Math.random() * 100); // return random width (0-100)
})

[Myst82015]

👋 Thanks for the heads-up.

Just looked at the docs of canvacord, they definitely changed it. I'll update our docs of discord-xp when I have some spare time.