canvafy
Version:
Make configurable canvas easily with Canvafy
280 lines (244 loc) • 8.88 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const { createCanvas, loadImage, registerFont } = require('canvas');
/**
* @typedef {object} Ship
* @see {Ship}
* @example const shipCard = await new canvafy.Ship()
* @type {Class}
*/
module.exports = class Ship {
constructor(options) {
this.font = { name: options?.font?.name ?? "Poppins", path: options?.font?.path };
this.avatar = "https://cdn.discordapp.com/embed/avatars/0.png";
this.avatar2 = "https://cdn.discordapp.com/embed/avatars/0.png";
this.number = Math.floor(Math.random() * 101);
this.background = {
type: "color",
background: "#23272a"
};
this.overlay_opacity = 0;
this.border;
}
/**
* .setAvatars
* @param {string|Buffer|Image} image First Avatar
* @param {string|Buffer|Image} image2 Second Avatar
* @returns {Ship}
* @example setAvatars("https://someone-image.png","https://someone-image.png")
*/
setAvatars(image,image2) {
this.avatar = image;
this.avatar2 = image2;
return this;
}
/**
* .setBackground
* @param {string} type "image" or "color"
* @param {string|Buffer|Image} value "url" or "hexcolor"
* @returns {Ship}
* @example setBackground("image","https://someone-image.png")
* @example setBackground("color","#000")
*/
setBackground(type, value) {
if (type === 'color') {
if (value) {
if (/^#([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/.test(value)) {
this.background.type = "color";
this.background.background = value;
return this;
} else {
throw new Error("Invalid color for the second argument in setForeground method. You must give a hexadecimal color.");
}
} else {
throw new Error("You must give a hexadecimal color as a second argument of setBackground method.");
}
} else if (type === 'image') {
if (value) {
this.background.type = "image";
this.background.background = value;
return this;
} else {
throw new Error("You must give a background URL as a second argument.");
}
} else {
throw new Error("The first argument of setBackground must be 'color' or 'image'.");
}
}
/**
* .setBorder
* @param {string} color "hexcolor"
* @returns {Ship}
* @example setBorder("#fff")
*/
setBorder(color) {
if (color) {
if (/^#([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/.test(color)) {
this.border = color;
return this;
} else {
throw new Error("Invalid color for the argument in the setBorder method. You must give a hexadecimal color.")
}
} else {
throw new Error("You must give a hexadecimal color as the argument of setBorder method.");
}
}
/**
* .setOverlayOpacity
* @param {number} opacity must be between 0 and 1
* @returns {Ship}
* @example setOverlayOpacity(0.7)
*/
setOverlayOpacity(opacity = 0) {
if (opacity) {
if (opacity >= 0 && opacity <= 1) {
this.overlay_opacity = opacity;
return this;
} else {
throw new Error("The value of the opacity of setOverlayOpacity method must be between 0 and 1 (0 and 1 included).");
}
}
}
/**
* .setCustomNumber
* @param {number} num must be between 0 and 100
* @returns {Ship}
* @example setCustomNumber(65)
*/
setCustomNumber(num) {
if(num < 0 || num > 100){
throw new Error("The value of the setCustomNumber method must be between 0 and 100 (0 and 100 included).");
}
this.number = num;
return this;
}
async build() {
if (this.font.path) registerFont(this.font.path, {family:this.font.name});
let sayı = this.number;
const canvas = createCanvas(700, 350);
const ctx = canvas.getContext("2d");
if(this.border){
ctx.beginPath();
ctx.lineWidth = 8;
ctx.strokeStyle = this.border;
ctx.moveTo(55, 15);
ctx.lineTo(canvas.width - 55, 15);
ctx.quadraticCurveTo(canvas.width - 20, 20, canvas.width - 15, 55);
ctx.lineTo(canvas.width - 15, canvas.height - 55);
ctx.quadraticCurveTo(canvas.width - 20, canvas.height - 20, canvas.width - 55, canvas.height - 15);
ctx.lineTo(55, canvas.height - 15);
ctx.quadraticCurveTo(20, canvas.height - 20, 15, canvas.height - 55);
ctx.lineTo(15, 55);
ctx.quadraticCurveTo(20, 20, 55, 15);
ctx.lineTo(56, 15);
ctx.stroke();
ctx.closePath();
}
ctx.beginPath();
ctx.moveTo(65, 25);
ctx.lineTo(canvas.width - 65, 25);
ctx.quadraticCurveTo(canvas.width - 25, 25, canvas.width - 25, 65);
ctx.lineTo(canvas.width - 25, canvas.height - 65);
ctx.quadraticCurveTo(canvas.width - 25, canvas.height - 25, canvas.width - 65, canvas.height - 25);
ctx.lineTo(65, canvas.height - 25);
ctx.quadraticCurveTo(25, canvas.height - 25, 25, canvas.height - 65);
ctx.lineTo(25, 65);
ctx.quadraticCurveTo(25, 25, 65, 25);
ctx.lineTo(66, 25);
ctx.closePath();
ctx.clip();
ctx.globalAlpha = 1;
if (this.background.type === "color") {
ctx.beginPath();
ctx.fillStyle = this.background.background;
ctx.fillRect(10, 10, canvas.width - 20, canvas.height - 20)
} else if (this.background.type === "image") {
try {
ctx.drawImage(await loadImage(this.background.background), 10, 10, canvas.width - 20, canvas.height - 20);
} catch {
throw new Error("The image given in the second parameter of the setBackground method is not valid or you are not connected to the internet.");
}
}
ctx.beginPath();
ctx.globalAlpha = this.overlay_opacity;
ctx.fillStyle = "#000";
ctx.moveTo(75, 45);
ctx.lineTo(canvas.width - 75, 45);
ctx.quadraticCurveTo(canvas.width - 45, 45, canvas.width - 45, 75);
ctx.lineTo(canvas.width - 45, canvas.height - 75);
ctx.quadraticCurveTo(canvas.width - 45, canvas.height - 45, canvas.width - 75, canvas.height - 45);
ctx.lineTo(75, canvas.height - 45);
ctx.quadraticCurveTo(45, canvas.height - 45, 45, canvas.height - 75);
ctx.lineTo(45, 75);
ctx.quadraticCurveTo(45, 45, 75, 45);
ctx.fill();
ctx.closePath();
var x = (700/2) - (150/2);
var y = (350/2) - (150/2);
ctx.globalAlpha = 1;
ctx.beginPath();
ctx.moveTo(x + 75, y + 30);
ctx.bezierCurveTo(x + 30, y, x, y + 30, x, y + 75);
ctx.bezierCurveTo(x, y + 120, x + 75, y + 150, x + 75, y + 150);
ctx.bezierCurveTo(x + 75, y + 150, x + 150, y + 120, x + 150, y + 75);
ctx.bezierCurveTo(x + 150, y + 30, x + 120, y, x + 75, y + 30);
ctx.closePath();
ctx.strokeStyle = "black";
ctx.lineWidth = 2;
ctx.stroke();
let doluluk;
if(sayı >= 100) doluluk = 101
if(sayı >= 90 && sayı < 100) doluluk = 130
if(sayı >= 80 && sayı < 90) doluluk = 160
if(sayı >= 70 && sayı < 80) doluluk = 190
if(sayı >= 60 && sayı < 70) doluluk = 220
if(sayı >= 50 && sayı < 60) doluluk = 250
if(sayı >= 40 && sayı < 50) doluluk = 280
if(sayı >= 30 && sayı < 40) doluluk = 310
if(sayı >= 20 && sayı < 30) doluluk = 340
if(sayı >= 10 && sayı < 20) doluluk = 370
if(sayı >= 5 && sayı < 10) doluluk = 385
if(sayı >= 0 && sayı < 5) doluluk = 399
ctx.globalAlpha = 0.6;
var gradient = ctx.createLinearGradient(0, y, 0, doluluk);
gradient.addColorStop(0, "#ffffff");
gradient.addColorStop(0.5, "#ffffff");
gradient.addColorStop(0.5, "#ff0000");
gradient.addColorStop(0.1, "#ff0000");
ctx.fillStyle = gradient;
ctx.shadowBlur = 9;
ctx.shadowColor = "#ff0000";
ctx.shadowOffsetY = 0;
ctx.shadowOffsetX = 0;
ctx.fill();
ctx.fillStyle = `WHITE`;
ctx.font = `bold 36px Sans`;
ctx.shadowBlur = 9;
ctx.shadowColor = "#0a0a0a";
ctx.shadowOffsetY = 8;
ctx.shadowOffsetX = -6;
ctx.globalAlpha = 1;
ctx.textAlign = "center";
ctx.fillText(`%${sayı}`, 350, 190)
ctx.beginPath();
ctx.lineWidth = 8;
ctx.fill()
ctx.lineWidth = 8;
try {
const messageAuthor = await loadImage(this.avatar)
const targetMention = await loadImage(this.avatar2)
ctx.globalAlpha = 1;
ctx.beginPath();
ctx.fill()
ctx.lineWidth = 8;
ctx.arc(160, 175, 90, 0, 2 * Math.PI);
ctx.arc(540, 175, 90, 0, 2 * Math.PI);
ctx.clip();
ctx.drawImage(messageAuthor, 60, 75, 200, 200)
ctx.drawImage(targetMention, 440, 75, 200, 200)
} catch {
throw new Error("The image given in the argument of the setAvatars method is not valid or you are not connected to the internet.");
}
return canvas.toBuffer('image/png');
}
};