https://github.com/yumikodev/custom-cards
A simple card module with Canvas.
https://github.com/yumikodev/custom-cards
canvas cards javascript nodejs typescript
Last synced: 12 months ago
JSON representation
A simple card module with Canvas.
- Host: GitHub
- URL: https://github.com/yumikodev/custom-cards
- Owner: yumikodev
- License: mit
- Created: 2022-10-09T01:52:13.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2024-04-13T20:41:20.000Z (almost 2 years ago)
- Last Synced: 2024-10-08T11:32:04.580Z (over 1 year ago)
- Topics: canvas, cards, javascript, nodejs, typescript
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/custom-cards
- Size: 2.39 MB
- Stars: 3
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# Custom Cards
Un simple módulo de manipulación de imágenes con Canvas, escrito en TypeScript.
[](https://www.npmjs.com/package/custom-cards)
[](https://www.npmjs.com/package/custom-cards)
## Tabla de contenido
- [Instalación](#instalación)
- [Importar Módulo](#importar-módulo)
- [Uso básico](#uso-básico)
- [Detalles del proyecto](#detalles-del-proyecto)
## Instalación
```
npm install custom-cards
```
## Uso
### Importar módulo
> A partir de la versión 1.6.0 el módulo pasó a ser un ESM, por lo que usarlo con CommonJs puede llegar a dar problemas inesperados.
```js
import * as CustomCards from "custom-cards";
```
### Uso básico
```js
import { readFileSync } from "node:fs";
// Leemos una imágen local
const wpBuf = readFileSync("./wallpaper.jpg");
// Inicializamos el cliente (reemplazamos TOKEN por nuestro token)
const client = new CustomCards.Setup("TOKEN");
// Creamos el modelo de nuestra tarjeta
const card = new CustomCards.WelcomeCard({
variant: "Classic",
avatar: {
// usamos "imageUrlAdapter" para usar imágenes desde una URL
source: await CustomCards.imageUrlAdapter(
"https://yumikodev.vercel.app/avatar.webp"
),
frameColor: "#ff7eae",
frameType: CustomCards.FrameType.Square,
},
background: await CustomCards.imageBufferAdapter(wpBuf),
font: CustomCards.Fonts.Fredoka,
text: [
{
content: "Bienvenid@ usuario",
color: "#fff",
},
{
content: "Descripción aquí.",
color: "#eee",
},
],
});
const data = await client.cards.createWelcomeCard(card);
console.log(data);
/*
{
"mimetype": "image/webp",
"card": Buffer<...>
}
*/
```
#### Ejemplo:
[](https://www.npmjs.com/package/custom-cards)
## Detalles del proyecto:
- Licencia: **[MIT License](LICENSE)**
- Autor: **[Yasu Yumiko](https://discord.com/users/752918867273187378)**
- [Servidor de Discord](https://discord.gg/YqUkagNPaw)
- [Documentación oficial](https://custom-cards-web.vercel.app/)
### Gracias :D