neplextech/canvacord

Easily generate images using react-like components in nodejs. Canvacord is suitable for creating dynamic images such as social media posts, greetings cards, memes, etc. It is also possible to create your own templates and builders to generate images. You are only limited by your imagination.

Canvacord

Easily generate images using html and css in nodejs. Canvacord is suitable for creating dynamic images such as social media posts, greetings cards, memes, etc. It is also possible to create your own templates and builders to generate images. You are only limited by your imagination.

Features

• 🪟 Open source, no privacy issues, 100% transparent - Canvacord is completely open source and free to use. This makes everything transparent and you can even contribute to the project. Best of all, you dont have to worry about privacy issues 😊.
• 💪 Easy to use - Canvacord provides a simple api to generate images on-the-fly.
• 🎨 Customizable - You can create your own templates and builders to generate images. Canvacord allows you to define how your image should look using html and css. No more hassle learning complicated canvas api.
• 🔮 GIF generation - Canvacord allows you to generate custom GIFs using the builder api.
• 🚀 Fast - Canvacord is powered by highly optimized, battle tested libraries, which makes it fast and reliable.
• 🔒 Typescript support - Canvacord is written in typescript and provides type definitions out of the box.
• 📸 Wide formats support - Canvacord supports many image formats such as png, jpeg, webp, gif, svg, etc.
• 📄 Wide range of templates - Canvacord provides many built-in templates to generate images such as triggered gif, beautiful image, facepalm image, etc. to quickly generate that meme you saw on reddit 🤡. No need to touch complicated canvas api, just a simple schema object is enough.

Installation

$ npm install canvacord

Canvacord stays away from node-gyp based dependencies, so you don't have to worry about weird errors while installing the library. Although canvacord utilizes @napi-rs/canvas under the hood, it is recommended to use the builder api for image generation. Only utilize the canvas api if you need to perform image manipulation.

Documentation

https://canvacord.js.org

Discord support server

https://neplextech.com/discord

Support the project

You can support the project by donating on patreon or buymeacoffee. This will help us to keep the project alive and maintain it regularly. You can also contribute to the project by submitting a pull request or reporting a bug.

GPL-3.0 License - Neplex Technologies

Mail to [email protected] for any questions or suggestions.

canvacord's Issues

Support: Rendering hangul characters

This should show 파랑이#1204.

rank.build doesn't do anything

I'm using the sample code, just to test this lib, but when I try building, it doesn't do anything, the codes running, but it doesn't send anything, any ideas?

Code:

const rank = new Canvacord.Rank()
                    .setAvatar(img)
                    .setCurrentXP(xp)
                    .setRequiredXP(reqXp)
                    .setStatus("dnd")
                    .setProgressBar("#FFFFFF")
                    .setUsername(message.author.username)
                    .setDiscriminator("0007");

                rank.build()
                    .then(data => {
                        const attachment = new Discord.MessageAttachment(data, "RankCard.png");
                        message.channel.send(attachment);
                    });
                    ```
                (everything is defined)

[BUG] SPOTIFY IMAGE

Describe the bug
: Server responded with 404

To Reproduce
Steps to reproduce the behavior:

Expected behavior

Screenshots

Please complete the following information:

• Node Version: [16]
• Library Version: [5.2.3]

Additional context

shit not working

so i tried using canvacord and it did not work
i got banned from the discord server by the shit owner i don't fucking care if you see this snowflake
for "stfu" when i just tried to get my problem solved
10/10 support would never ask again
not my fault your library is not working
anyways fix your library dumbass

Termux

internal/modules/cjs/loader.js:1122
return process.dlopen(module, path.toNamespacedPath(filename));
^

Error: dlopen failed: library "/storage/emulated/0/selfsanz/node_modules/canvas/build/Release/canvas.node" needed or dlopened by "/data/data/com.termux/files/usr/bin/node" is not accessible for the namespace "(default)"
at Object.Module._extensions..node (internal/modules/cjs/loader.js:1122:18)
at Module.load (internal/modules/cjs/loader.js:928:32)
at Function.Module._load (internal/modules/cjs/loader.js:769:14)
at Module.require (internal/modules/cjs/loader.js:952:19)
at require (internal/modules/cjs/helpers.js:88:18)
at Object. (/storage/emulated/0/selfsanz/node_modules/canvas/lib/bindings.js:3:18)
at Module._compile (internal/modules/cjs/loader.js:1063:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
at Module.load (internal/modules/cjs/loader.js:928:32)

MomentJS Dependency Issue

I just installed Canvacord v5.0.8 and for a few minutes the rank system was working fine. But after I started to get this issue from one of the MomentJS files:

Unhandled promise rejection: TypeError: Function has non-object prototype 'undefined' in instanceof check
    at AsyncFunction.[Symbol.hasInstance] (<anonymous>)
    at isFunction (C:\Users\ascen\OneDrive\Documents\VoTech\node_modules\moment\moment.js:344:55)
    at addRegexToken (C:\Users\ascen\OneDrive\Documents\VoTech\node_modules\moment\moment.js:790:26)
    at C:\Users\ascen\OneDrive\Documents\VoTech\node_modules\moment\moment.js:925:5
    at C:\Users\ascen\OneDrive\Documents\VoTech\node_modules\moment\moment.js:8:85
    at Object.<anonymous> (C:\Users\ascen\OneDrive\Documents\VoTech\node_modules\moment\moment.js:11:2)
    at Module._compile (internal/modules/cjs/loader.js:1085:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10)
    at Module.load (internal/modules/cjs/loader.js:950:32)
    at Function.Module._load (internal/modules/cjs/loader.js:791:14)

I don't use MomentJS anywhere in my files. Apparently MomentJS is also required in Canvacord. I tried uninstalling Canvacord completely a few times, and reinstalling it, but I kept getting the same issue. I also tried rebuilding, but I still got the issue.

Apparently this issue occurs in this piece of code:

    function isFunction(input) {
        return (
            (typeof Function !== 'undefined' && input instanceof Function) ||
            Object.prototype.toString.call(input) === '[object Function]'
        );
    }

The whole file in which throws the error: https://pastebin.com/ub76swT1

How to set custom background?

Hello, i wanted to know how to make my own background, already tried everything, and .setBackground, and

.background.type("image")
.background.image(data)

And... nothing worked

Canvacord latest, help pls, thanks in advance!

Could not parse font file

I don't know why, I want to run errors always, how do I fix that?

/root/node_modules/canvas/index.js:48
  return Canvas._registerFont(fs.realpathSync(src), fontFace)
                ^

Error: Could not parse font file
    at Object.registerFont (/root/node_modules/canvas/index.js:48:17)
    at Timeout._onTimeout (/root/node_modules/canvacord/src/Rank.js:175:24)

Make a new Impostor function

I had a new idea about this function which will generate an image and replace the "[REDACTED] was the Imposter" with the name, the user specifies just like other commands of trigger and fire.
An Example Image can be found below -

XP color

Is it possible to modify the XP color?

Like this

It keeps giving me errors

It doesnt work. Like it gave me errors everytime

any one know what i'm doing wrong?
Code
`
module.exports = {
name: 'image',
description: "Test Canvacord",
aliases: ['img'],
async execute(bot, message, args) {

    const canvacord = require('canvacord');

    const rank = new canvacord.Rank()
        .setAvatar(message.author.displayAvatarURL())
        .setCurrentXP(100)
        .setRequiredXP(1000)
        .setStatus('dnd')
        .setProgressBar("#FFFFFF", "COLOR")
        .setUsername(message.author.username)
        .setDiscriminator(message.author.discriminator);

    rank.build()
        .then(data => {
            const attachment = new Discord.MessageAttachment(data, "RankCard.png");
            message.channel.send(attachment);
        });

}

}
`
Error

How to remove server msg and box

Hi im using the welcomer feature of canvacord whose base requires discord canvas (issue #53 )

I would like to know how can i get rid of the server welcome box and the text inside it

Im referring to this

ik that it requires editing node_modules, but what to edit there? 0.0

[BUG] Canvas.Welcomer is not constructor

var wellcome = new Canvas.Welcomer()
               ^

TypeError: Canvas.Welcomer is not a constructor
    at Object.<anonymous> (/data/data/com.termux/files/home/botntol2/cord.js:3:10)

my code:

var Canvas = require('canvacord')

var wellcome = new Canvas.Welcomer()

wellcome.build()
  .then(buffer => {
        Canvas.write(buffer, 'result.png')
        console.log('success')
   })

[Feature Request] Web compatibility

Web support

Lots of bugs?

Takes forever to load

AND

TEXT IS BAD
https://cdn.discordapp.com/attachments/706709621783527494/740340812239470622/file.png

const canva = new Canvacord(); returns an error

Hello,

Since I updated my bot to canvacord 3.0.4, there's this error popping up in my console:
TypeError: cc.Canvacord is not a constructor
Note that cc is defined by require("canvacord").
I've followed what the doc says but yeah it still appears.

Is there a fix in version 3.0.4 or is it just me doing the wrong thing? Thanks for your help.

Code:7736) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'Rank' of undefined

When i do !rank then i get code:7736) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'Rank' of undefined

ode:7736) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'Rank' of undefined
at Object.module.exports.run (C:\Users\Ryan-Gta\Desktop\Discord_Bot_YT\commands\level.js:16:44)
at Client. (C:\Users\Ryan-Gta\Desktop\Discord_Bot_YT\index.js:255:28)
at Client.emit (events.js:315:20)
at MessageCreateAction.handle (C:\Users\Ryan-Gta\Desktop\Discord_Bot_YT\node_modules\discord.js\src\client\actions\MessageCreate.js:31:14)
at Object.module.exports [as MESSAGE_CREATE] (C:\Users\Ryan-Gta\Desktop\Discord_Bot_YT\node_modules\discord.js\src\client\websocket\handlers\MESSAGE_CREATE.js:4:32)
at WebSocketManager.handlePacket (C:\Users\Ryan-Gta\Desktop\Discord_Bot_YT\node_modules\discord.js\src\client\websocket\WebSocketManager.js:386:31)
at WebSocketShard.onPacket (C:\Users\Ryan-Gta\Desktop\Discord_Bot_YT\node_modules\discord.js\src\client\websocket\WebSocketShard.js:436:22)
at WebSocketShard.onMessage (C:\Users\Ryan-Gta\Desktop\Discord_Bot_YT\node_modules\discord.js\src\client\websocket\WebSocketShard.js:293:10)
at WebSocket.onMessage (C:\Users\Ryan-Gta\Desktop\Discord_Bot_YT\node_modules\ws\lib\event-target.js:120:16)
at WebSocket.emit (events.js:315:20)
(Use node --trace-warnings ... to show where the warning was created)
(node:7736) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag --unhandled-rejections=strict (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:7736) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

No typescript typings.

Hello, have an issue with this package. I like the idea behind the package but when I tried using this in typescript, I got no typing support. Can we get more support for this?

[BUG] canvacord.Spotify() not working

Describe the bug
Error 404 when generate the card.

To Reproduce
Steps to reproduce the behavior:

1. Generate a card
2. Error 404

Expected behavior
The card will be generated.

Screenshots

• Node Version: [v16.0.0]
• Library Version: [^5.2.0]

is it possible to change the color of that number?

is it possible to change the color of that number?

Error while installing

After installing canvacord i get error from sharp module and when i uninstall canvacord .. it works fine..

Error:
Something went wrong installing the "sharp" module

The specified procedure could not be found.
\?\C:\Users\eddie\Desktop\DTS-BOT\node_modules\sharp\build\Release\sharp.node

• Remove the "node_modules/sharp" directory then run
  "npm install --ignore-scripts=false --verbose" and look for errors
• Consult the installation documentation at https://sharp.pixelplumbing.com/install
• Search for this error at https://github.com/lovell/sharp/issues

Second image was not provided! in .slap

Hi snowflake,

I have an error in your pkg's slap function
the code:

const Discord = require('discord.js');
const { MessageEmbed } = require("discord.js");
const { Default_Prefix, Color, Support, Donate } = require("../../config.js");
const canvacord = require("canvacord")

module.exports = {
  name: "test",
  aliases: [],
  category: "Fun",
  description: "Fake phub comment.",
  usage: "test @user",
  run: async (client, message, args, db) => {
const user = message.mentions.users.first()
const yt = await canvacord.Canvas.slap({"image1":message.author.displayAvatarURL({format: "png"}),"image2":message.author.displayAvatarURL({format: "png"})})

    let attachment = new Discord.MessageAttachment(yt, "test.png")
    message.channel.send(attachment)
  }
};

When i type test

I get this error

(node:1654) UnhandledPromiseRejectionWarning: Error: Second image was not provided!
    at Function.slap (/home/runner/ZealousNoteworthyDecagon/node_modules/canvacord/src/Canvacord.js:433:28)
    at Object.run (/home/runner/ZealousNoteworthyDecagon/commands/Fun/test.js:14:35)
    at Client.<anonymous> (/home/runner/ZealousNoteworthyDecagon/index.js:78:15)
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
(node:1654) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 2)
(node:1654) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

[BUG] Fails to install on Windows 10

Describe the bug

To Reproduce
Steps to reproduce the behavior:

npm install canvacord

Expected behavior
I expected the library to install successfully

Terminal Logs

PS C:\Users\MYUSER\Projects\test\canvatest> npm install canvacord

> [email protected] install C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas
> node-pre-gyp install --fallback-to-build

node-pre-gyp ERR! install response status 404 Not Found on https://github.com/Automattic/node-canvas/releases/download/v2.8.0/canvas-v2.8.0-node-v83-win32-unknown-ia32.tar.gz
node-pre-gyp WARN Pre-built binaries not installable for [email protected] and [email protected] (node-v83 ABI, unknown) (falling back to source compile with node-gyp)
node-pre-gyp WARN Hit error response status 404 Not Found on https://github.com/Automattic/node-canvas/releases/download/v2.8.0/canvas-v2.8.0-node-v83-win32-unknown-ia32.tar.gz
Warning: Missing input files:
C:\GTK\bin\libpangoft2-1.0-0.dll
C:\GTK\bin\zlib1.dll
C:\GTK\bin\libintl-8.dll
C:\GTK\bin\libgmodule-2.0-0.dll
C:\GTK\bin\libglib-2.0-0.dll
C:\GTK\bin\libexpat-1.dll
C:\GTK\bin\libpng14-14.dll
C:\GTK\bin\libcairo-2.dll
C:\GTK\bin\libfontconfig-1.dll
C:\GTK\bin\libgobject-2.0-0.dll
C:\GTK\bin\libgthread-2.0-0.dll
C:\GTK\bin\libpangocairo-1.0-0.dll
C:\GTK\bin\libfreetype-6.dll
C:\GTK\bin\libpango-1.0-0.dll
C:\GTK\bin\libpangowin32-1.0-0.dll
Building the projects in this solution one at a time. To enable parallel build, please add the "/m" switch.
  Backend.cc
  ImageBackend.cc
  PdfBackend.cc
  SvgBackend.cc
  BMPParser.cc
  Backends.cc
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\backend\backend.h(3): fatal error C1083: Cannot open include file: 'cairo.h': No such file o
r directory (compiling source file ..\src\backend\Backend.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\backend\backend.h(3): fatal error C1083: Cannot open include file: 'cairo.h': No such file o
r directory (compiling source file ..\src\backend\PdfBackend.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\backend\backend.h(3): fatal error C1083: Cannot open include file: 'cairo.h': No such file o
r directory (compiling source file ..\src\backend\SvgBackend.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\backend\backend.h(3): fatal error C1083: Cannot open include file: 'cairo.h': No such file o
r directory (compiling source file ..\src\backend\ImageBackend.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\backend\backend.h(3): fatal error C1083: Cannot open include file: 'cairo.h': No such file o
r directory (compiling source file ..\src\Backends.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
  Canvas.cc
  CanvasGradient.cc
  CanvasPattern.cc
  CanvasRenderingContext2d.cc
  closure.cc
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\bmp\bmpparser.cc(186): warning C4018: '>': signed/unsigned mismatch [C:\Users\MYUSER\Projects\
test\canvatest\node_modules\canvas\build\canvas.vcxproj]
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\bmp\bmpparser.cc(201): warning C4018: '>': signed/unsigned mismatch [C:\Users\MYUSER\Projects\
test\canvatest\node_modules\canvas\build\canvas.vcxproj]
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\backend\backend.h(3): fatal error C1083: Cannot open include file: 'cairo.h': No such file o
r directory (compiling source file ..\src\Canvas.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\backend\backend.h(3): fatal error C1083: Cannot open include file: 'cairo.h': No such file o
r directory (compiling source file ..\src\closure.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\canvasrenderingcontext2d.h(5): fatal error C1083: Cannot open include file: 'cairo.h': No su
ch file or directory (compiling source file ..\src\CanvasRenderingContext2d.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vc
xproj]
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\canvaspattern.h(5): fatal error C1083: Cannot open include file: 'cairo.h': No such file or 
directory (compiling source file ..\src\CanvasPattern.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
  color.cc
  Image.cc
  ImageData.cc
  init.cc
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\image.h(5): fatal error C1083: Cannot open include file: 'cairo.h': No such file or director
y (compiling source file ..\src\Image.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
  register_font.cc
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\register_font.h(3): fatal error C1083: Cannot open include file: 'pango/pango.h': No such fi
le or directory (compiling source file ..\src\register_font.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
  win_delay_load_hook.cc
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\init.cc(4): fatal error C1083: Cannot open include file: 'pango/pango.h': No such file or di
rectory [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\canvasgradient.h(7): fatal error C1083: Cannot open include file: 'cairo.h': No such file or
 directory (compiling source file ..\src\CanvasGradient.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
c:\users\MYUSER\projects\test\canvatest\node_modules\canvas\src\util.h(31): error C2039: 'toupper': is not a member of 'std' (compiling source file ..\src\I
mageData.cc) [C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\canvas.vcxproj]
  c:\program files (x86)\microsoft visual studio\2017\buildtools\vc\tools\msvc\14.16.27023\include\queue(451): note: see declaration of 'std' (compiling s
  ource file ..\src\ImageData.cc)
gyp ERR! build error
gyp ERR! stack Error: `C:\Program Files (x86)\Microsoft Visual Studio\2017\BuildTools\MSBuild\15.0\Bin\MSBuild.exe` failed with exit code: 1
gyp ERR! stack     at ChildProcess.onExit (C:\Program Files (x86)\nodejs\node_modules\npm\node_modules\node-gyp\lib\build.js:194:23)
gyp ERR! stack     at ChildProcess.emit (events.js:315:20)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:277:12)
gyp ERR! System Windows_NT 10.0.17763
gyp ERR! command "C:\\Program Files (x86)\\nodejs\\node.exe" "C:\\Program Files (x86)\\nodejs\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "build" "--fallback-to-build" "--module=C:\\Users\\MYUSER\\Projects\\test\\canvatest\\node_modules\\canvas\\build\\Release\\canvas.node" "--module_name=canvas" "--module_path=C:\\Users\\MYUSER\\Projects\\test\\canvatest\\node_modules\\canvas\\build\\Release" "--napi_version=7" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v83"
gyp ERR! cwd C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas
gyp ERR! node -v v14.15.5
gyp ERR! node-gyp -v v5.1.0
gyp ERR! not ok
node-pre-gyp ERR! build error
node-pre-gyp ERR! stack Error: Failed to execute 'C:\Program Files (x86)\nodejs\node.exe C:\Program Files (x86)\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js build --fallback-to-build --module=C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\Release\canvas.node --module_name=canvas --module_path=C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\Release --napi_version=7 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83' (1)
node-pre-gyp ERR! stack     at ChildProcess.<anonymous> (C:\Users\MYUSER\Projects\test\canvatest\node_modules\@mapbox\node-pre-gyp\lib\util\compile.js:89:23)node-pre-gyp ERR! stack     at ChildProcess.emit (events.js:315:20)
node-pre-gyp ERR! stack     at maybeClose (internal/child_process.js:1048:16)
node-pre-gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:288:5)
node-pre-gyp ERR! System Windows_NT 10.0.17763
node-pre-gyp ERR! command "C:\\Program Files (x86)\\nodejs\\node.exe" "C:\\Users\\MYUSER\\Projects\\test\\canvatest\\node_modules\\@mapbox\\node-pre-gyp\\bin\\node-pre-gyp" "install" "--fallback-to-build"
node-pre-gyp ERR! cwd C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas
node-pre-gyp ERR! node -v v14.15.5
node-pre-gyp ERR! node-pre-gyp -v v1.0.5
node-pre-gyp ERR! not ok
Failed to execute 'C:\Program Files (x86)\nodejs\node.exe C:\Program Files (x86)\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js build --fallback-to-build --module=C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\Release\canvas.node --module_name=canvas --module_path=C:\Users\MYUSER\Projects\test\canvatest\node_modules\canvas\build\Release --napi_version=7 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83' (1)
npm WARN [email protected] No description
npm WARN [email protected] No repository field.

Please complete the following information:

• Node Version: v14.15.5
• Library Version: 5.2.1
• OS: Windows 10 Enterprise

Bot doesn´t send Image, no Error

I created a XP system and want to send the Rank canva into the chat, but i get no error and also no message in the chat...
My code is this:

let rank = new canvacord.Rank()
      .setAvatar(img)
      .setCurrentXP(xpget[ID], "#422711")
      .setRequiredXP(xptolvl, "#422711")
      .setProgressBar("#422711", "COLOR")
      .setLevelColor("#422711")
      .setRankColor("#422711")
      .setUsername(username, "#422711")
      .setBackground("IMAGE","https://i.imgur.com/yip3DIY.png");
    rank.build()
      .then(buffer => {
        message.channel.send(buffer);
        let attachment = new Discord.MessageAttachment(buffer, "Stammtisch_XP.png");
        message.channel.send(attachment);
      });

Is there a order of the .set Methods necessary? Or what is the Problem? I tried to send a simple message in the .then Method, but it wouldn´t be send too.

Question: Welcome card

Hello, can I ask please?
I love makin' the rank card, but I want to ask, if I can make a welcome card, with canvacord.
If yes, can you give me example please? Im using heroku, so the normal canvas is not way for me.

Help: Custom Fonts

I want to edit fonts, thats all. I found a method
Rank#registerFonts but I don’t know how to use that and if that is what makes custom fonts possible.

Add typescript typings

I have trouble on using canvacord on typescript

How about adding typings for typescript users?

??

[Feature Request] Use a bundling service

Is your feature request related to a problem? Please describe.
The library bundle is very large. Bundling makes the total payload significantly smaller, and you can include a source map if you wish.

Describe the solution you'd like
I strongly recommend microbundle, but it depends on what you're looking for in a bundler.

Describe alternatives you've considered
Webpack & rollup are both good alternatives.

why cannot find module??

D:\yoyoyyyoy\error-pensi1>npm i canvacord

 [email protected] install D:\yoyoyyyoy\error-pensi1\node_modules\canvas
node-pre-gyp install --fallback-to-build

node-pre-gyp WARN Using request for node-pre-gyp https download
node-pre-gyp WARN Tried to download(404): https://github.com/node-gfx/node-canvas-prebuilt/releases/download/v2.6.1/canvas-v2.6.1-node-v72-win32-unknown-ia32.tar.gz
node-pre-gyp WARN Pre-built binaries not found for [email protected] and [email protected] (node-v72 ABI, unknown) (falling back to source compile with node-gyp)
gyp ERR! find Python
gyp ERR! find Python Python is not set from command line or npm configuration
gyp ERR! find Python Python is not set from environment variable PYTHON
gyp ERR! find Python checking if "python" can be used
gyp ERR! find Python - "python" is not in PATH or produced an error
gyp ERR! find Python checking if "python2" can be used
gyp ERR! find Python - "python2" is not in PATH or produced an error
gyp ERR! find Python checking if "python3" can be used
gyp ERR! find Python - "python3" is not in PATH or produced an error
gyp ERR! find Python checking if the py launcher can be used to find Python 2
gyp ERR! find Python - "py.exe" is not in PATH or produced an error
gyp ERR! find Python checking if Python is C:\Python27\python.exe
gyp ERR! find Python - "C:\Python27\python.exe" could not be run
gyp ERR! find Python checking if Python is C:\Python37\python.exe
gyp ERR! find Python - "C:\Python37\python.exe" could not be run
gyp ERR! find Python
gyp ERR! find Python **********************************************************
gyp ERR! find Python You need to install the latest version of Python.
gyp ERR! find Python Node-gyp should be able to find and use Python. If not,
gyp ERR! find Python you can try one of the following options:
gyp ERR! find Python - Use the switch --python="C:\Path\To\python.exe"
gyp ERR! find Python   (accepted by both node-gyp and npm)
gyp ERR! find Python - Set the environment variable PYTHON
gyp ERR! find Python - Set the npm configuration variable python:
gyp ERR! find Python   npm config set python "C:\Path\To\python.exe"
gyp ERR! find Python For more information consult the documentation at:
gyp ERR! find Python https://github.com/nodejs/node-gyp#installation
gyp ERR! find Python **********************************************************
gyp ERR! find Python
gyp ERR! configure error
gyp ERR! stack Error: Could not find any Python installation to use
gyp ERR! stack     at PythonFinder.fail (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:307:47)
gyp ERR! stack     at PythonFinder.runChecks (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:136:21)
gyp ERR! stack     at PythonFinder.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:225:16)
gyp ERR! stack     at PythonFinder.execFileCallback (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:271:16)
gyp ERR! stack     at exithandler (child_process.js:315:5)
gyp ERR! stack     at ChildProcess.errorhandler (child_process.js:327:5)
gyp ERR! stack     at ChildProcess.emit (events.js:314:20)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:273:12)
gyp ERR! stack     at onErrorNT (internal/child_process.js:469:16)
gyp ERR! stack     at processTicksAndRejections (internal/process/task_queues.js:84:21)
gyp ERR! System Windows_NT 6.1.7600
gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "configure" "--fallback-to-build" "--module=D:\\yoyoyyyoy\\error-pensi1\\node_modules\\canvas\\build\\Release\\canvas.node" "--module_name=canvas" "--module_path=D:\\yoyoyyyoy\\error-pensi1\\node_modules\\canvas\\build\\Release" "--napi_version=7" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v72"
gyp ERR! cwd D:\yoyoyyyoy\error-pensi1\node_modules\canvas
gyp ERR! node -v v12.19.0
gyp ERR! node-gyp -v v5.1.0
gyp ERR! not ok
node-pre-gyp ERR! build error
node-pre-gyp ERR! stack Error: Failed to execute 'C:\Program Files\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --module=D:\yoyoyyyoy\error-pensi1\node_modules\canvas\build\Release\canvas.node --module_name=canvas --module_path=D:\yoyoyyyoy\error-pensi1\node_modules\canvas\build\Release --napi_version=7
--node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v72' (1)
node-pre-gyp ERR! stack     at ChildProcess.<anonymous> (D:\yoyoyyyoy\error-pensi1\node_modules\node-pre-gyp\lib\util\compile.js:83:29)
node-pre-gyp ERR! stack     at ChildProcess.emit (events.js:314:20)
node-pre-gyp ERR! stack     at maybeClose (internal/child_process.js:1021:16)
node-pre-gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:286:5)
node-pre-gyp ERR! System Windows_NT 6.1.7600
node-pre-gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "D:\\yoyoyyyoy\\error-pensi1\\node_modules\\node-pre-gyp\\bin\\node-pre-gyp" "install" "--fallback-to-build"
node-pre-gyp ERR! cwd D:\yoyoyyyoy\error-pensi1\node_modules\canvas
node-pre-gyp ERR! node -v v12.19.0
node-pre-gyp ERR! node-pre-gyp -v v0.11.0
node-pre-gyp ERR! not ok
Failed to execute 'C:\Program Files\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --module=D:\yoyoyyyoy\error-pensi1\node_modules\canvas\build\Release\canvas.node --module_name=canvas --module_path=D:\yoyoyyyoy\error-pensi1\node_modules\canvas\build\Release --napi_version=7 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v72' (1)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: `node-pre-gyp install --fallback-to-build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional
logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\TOSHIBA\AppData\Roaming\npm-cache\_logs\2020-12-23T00_54_57_741Z-debug.log

[QUESTION] .startTimestamp/.endTimestamp

Question
How the start or end Timestamp work? or Which data is actually the parameter for this two function? (Don't refer me to DOC)

Progress Bar Bugged

The progress bar for the rank card seems bugged, rather than showing the progress to the next level using the whole bar, it shows progress to the next level only using the last 10% of the bar. So if you had 18000XP and that was level 19, and level 20 was 20000XP, you would expect the bar to be very small since you are only 1% of the way there, but the bar appears as if you are 90% of the way there

canvacord.rank() not a function

Hello,

I'm trying to use the .rank() image generator like this

const cc = require("canvacord")
const cv = new cc.Canvas();
const output = await dl.Fetch(p.id) // dl = require("discord-leveling");
const neededxp = 10 * (output.level^2) + 100 * output.level + 100
  
// p.username, p.discriminator, output.level, neededxp, output.xp, p.avatarURL({format: "jpg", size: 1024})
let trigger = await cv.rank({
  username: p.username,
  discrim: p.discriminator,
  level: output.level,
  neededXP: neededxp,
  currentXP: output.xp,
  avatarURL: p.avatarURL({format: "jpg", size: 1024})
});

But it is giving this error: cv.rank is not a function. I'm also using canvacord 2.0.2.

How can I fix this? Thanks for your help.

Welcomer | Hide the text boxes

Hello, is there a choice to hide the borders/boxed where the text is?
I mean message-box in .setColor
and more: discriminator-box, username-box and also border

🎆 | GIF/WEBP Support

GIF/WEBP image format support

Deno support

Please add the roadmap to the deno.land repository!

How to host this on glitch ??

Jail method issue

If you provide 2 images when using the "jail" method, it turns the image gray.

Example:

await require("canvacord").Canvas.jail(message.author.avatarURL({format: "png"}), message.author.avatarURL({format: "png"}))

Returns this image:

But my profile picture is https://cdn.discordapp.com/avatars/248878605147308033/a_02291e8f0e0cddf905f580e6a2d22982.webp

The jail method only checks if the second parameter is a truthy/falsy value, and dosen't check if it's a boolean.

TypeError: canvacord.rank is not a function

I have this error, I have no idea how to fix it. There was another error similar to this, but gave no way on how to fix it. Snippet of code:
const discrim = message.author.tag.slice().split('#') const user = discrim[0] const dis = #${discrim[1]} let image = await canvacord.rank({ username: user, discrim: dis, level: score.level, rank: userRank, neededXP: Math.floor(((score.level * (score.level - 1)) / 15) * 100) + 100, currentXP: score.exp, avatarURL : message.author.displayAvatarURL({ format: 'png'}), color: 'white' })

can you test all canvas some are not working

can you test all canvas some are not working and can you add a little more canvas

Twitter image

A twitter image could be interesting
Example:

We could specify a custom username and avatar (to fetch the twitter profile then pass the avatar URL to canvacord)

Can't install

Hello,
Im discord.js beginner and I fell in love with your module.

But, when I wanted to install it. It told me "WARN Using request for node-pre-gyp https download"
Actually, I tried to install node-pre-gyp but when I deployed my code to my hosting Heroku, it said me that "Build Failed".

Do you know something about this problem please? I just want to have cool rank card, but I seem to be more of an idiot who missed something. I am sorry

canvacord.welcomer() is not a function

I'm not sure whether you wanted it to be a welcome method or welcomer method, but this line in the code says it's a welcome method while readme says it's welcomer.

File - scr/Canvas.js
Line number - 531
Code:

async welcome({ username, discrim, avatarURL }) {

Can make "rank" at "rank" become optional?

I'm MongoDB user, and I don't know how to make leaderboard/top system at MongoDB

Error

why dont load the font? I install my pc basic font (Manrope)

How to save image in my media folder?

i use canvacord not to discord but for my whatsapp bot

Offset position

how do i fix this ?

C:\Users\DuyAnh\Documents\bot>npm i canvacord
npm WARN read-shrinkwrap This version of npm is compatible with lockfileVersion@1, but package-lock.json was generated for lockfileVersion@2. I'll try to do my best with it!
npm WARN deprecated [email protected]: Please upgrade to @mapbox/node-pre-gyp: the non-scoped node-pre-gyp package is deprecated and only the @mapbox scoped package will recieve updates in the future

[email protected] install C:\Users\DuyAnh\Documents\bot\node_modules\canvas
node-pre-gyp install --fallback-to-build

node-pre-gyp WARN Using needle for node-pre-gyp https download
node-pre-gyp WARN Tried to download(404): https://github.com/Automattic/node-canvas/releases/download/v2.7.0/canvas-v2.7.0-node-v83-win32-unknown-ia32.tar.gz
node-pre-gyp WARN Pre-built binaries not found for [email protected] and [email protected] (node-v83 ABI, unknown) (falling back to source compile with node-gyp)
gyp ERR! find Python
gyp ERR! find Python Python is not set from command line or npm configuration
gyp ERR! find Python Python is not set from environment variable PYTHON
gyp ERR! find Python checking if "python" can be used
gyp ERR! find Python - "python" is not in PATH or produced an error
gyp ERR! find Python checking if "python2" can be used
gyp ERR! find Python - "python2" is not in PATH or produced an error
gyp ERR! find Python checking if "python3" can be used
gyp ERR! find Python - "python3" is not in PATH or produced an error
gyp ERR! find Python checking if the py launcher can be used to find Python 2
gyp ERR! find Python - "py.exe" is not in PATH or produced an error
gyp ERR! find Python checking if Python is C:\Python27\python.exe
gyp ERR! find Python - "C:\Python27\python.exe" could not be run
gyp ERR! find Python checking if Python is C:\Python37\python.exe
gyp ERR! find Python - "C:\Python37\python.exe" could not be run
gyp ERR! find Python
gyp ERR! find Python **********************************************************
gyp ERR! find Python You need to install the latest version of Python.
gyp ERR! find Python Node-gyp should be able to find and use Python. If not,
gyp ERR! find Python you can try one of the following options:
gyp ERR! find Python - Use the switch --python="C:\Path\To\python.exe"
gyp ERR! find Python (accepted by both node-gyp and npm)
gyp ERR! find Python - Set the environment variable PYTHON
gyp ERR! find Python - Set the npm configuration variable python:
gyp ERR! find Python npm config set python "C:\Path\To\python.exe"
gyp ERR! find Python For more information consult the documentation at:
gyp ERR! find Python https://github.com/nodejs/node-gyp#installation
gyp ERR! find Python **********************************************************
gyp ERR! find Python
gyp ERR! configure error
gyp ERR! stack Error: Could not find any Python installation to use
gyp ERR! stack at PythonFinder.fail (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:307:47)
gyp ERR! stack at PythonFinder.runChecks (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:136:21)
gyp ERR! stack at PythonFinder. (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:225:16)
gyp ERR! stack at PythonFinder.execFileCallback (C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\lib\find-python.js:271:16)
gyp ERR! stack at exithandler (child_process.js:315:5)
gyp ERR! stack at ChildProcess.errorhandler (child_process.js:327:5)
gyp ERR! stack at ChildProcess.emit (events.js:315:20)
gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12)
gyp ERR! stack at onErrorNT (internal/child_process.js:465:16)
gyp ERR! stack at processTicksAndRejections (internal/process/task_queues.js:80:21)
gyp ERR! System Windows_NT 6.3.9600
gyp ERR! command "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js" "configure" "--fallback-to-build" "--module=C:\Users\DuyAnh\Documents\bot\node_modules\canvas\build\Release\canvas.node" "--module_name=canvas" "--module_path=C:\Users\DuyAnh\Documents\bot\node_modules\canvas\build\Release" "--napi_version=7" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v83"
gyp ERR! cwd C:\Users\DuyAnh\Documents\bot\node_modules\canvas
gyp ERR! node -v v14.16.1
gyp ERR! node-gyp -v v5.1.0
gyp ERR! not ok
node-pre-gyp ERR! build error
node-pre-gyp ERR! stack Error: Failed to execute 'C:\Program Files\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --module=C:\Users\DuyAnh\Documents\bot\node_modules\canvas\build\Release\canvas.node --module_name=canvas --module_path=C:\Users\DuyAnh\Documents\bot\node_modules\canvas\build\Release --napi_version=7 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83' (1)
node-pre-gyp ERR! stack at ChildProcess. (C:\Users\DuyAnh\Documents\bot\node_modules\canvas\node_modules\node-pre-gyp\lib\util\compile.js:83:29)
node-pre-gyp ERR! stack at ChildProcess.emit (events.js:315:20)
node-pre-gyp ERR! stack at maybeClose (internal/child_process.js:1048:16)
node-pre-gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:288:5)
node-pre-gyp ERR! System Windows_NT 6.3.9600
node-pre-gyp ERR! command "C:\Program Files\nodejs\node.exe" "C:\Users\DuyAnh\Documents\bot\node_modules\canvas\node_modules\node-pre-gyp\bin\node-pre-gyp" "install" "--fallback-to-build"
node-pre-gyp ERR! cwd C:\Users\DuyAnh\Documents\bot\node_modules\canvas
node-pre-gyp ERR! node -v v14.16.1
node-pre-gyp ERR! node-pre-gyp -v v0.15.0
node-pre-gyp ERR! not ok
Failed to execute 'C:\Program Files\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --module=C:\Users\DuyAnh\Documents\bot\node_modules\canvas\build\Release\canvas.node --module_name=canvas --module_path=C:\Users\DuyAnh\Documents\bot\node_modules\canvas\build\Release --napi_version=7 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83' (1)
npm WARN [email protected] No description
npm WARN [email protected] No repository field.

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: node-pre-gyp install --fallback-to-build
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\DuyAnh\AppData\Roaming\npm-cache_logs\2021-04-17T10_48_29_416Z-debug.log

😔

XD?

Heroku Hosting

How can I host a Bot w/ Canvacord on Heroku? I tried the Cairo Buildpack but thats not work on Heroku-16 stacks and Cedar-14 Stacks are in end of life.