Giter Site home page Giter Site logo

alenvelocity / wa-sticker-formatter Goto Github PK

View Code? Open in Web Editor NEW
90.0 4.0 41.0 12.58 MB

Sticker Creator for WhatsApp

Home Page: https://alensaito1.github.io/wa-sticker-formatter/

License: MIT License

TypeScript 100.00%
sticker whatsapp-stickers webp wa-sticker-formatter image nodejs exif png sharp

wa-sticker-formatter's Introduction

wsf

Wa-Sticker-Formatter

Wa-Sticker-Formatter is a simple tool which allows you to create and format WhatsApp Stickers.

NPM CodeFactor NPM

Installation

> npm i wa-sticker-formatter

Usage

Wa-Sticker-Formatter provides two ways to create stickers. The paramers are the same for both.

  1. First is the Buffer, SVG String, URL, SVG String or File path of static image, GIF or Video. The second is the options. GIFs and Videos will output an animated WebP file.

  2. 2nd Paramter, an object, Sticker Options accepts the following fields

pack - The pack name.
author - The author name.
type - Value from StickeTypes enum (exported). Can be 'crop' or 'full' or undefined (default).
categories - The sticker category. Can be an array of Emojis or undefined (default).
quality - The quality of the output file. Can be an integer from 0 to 100. Defaults to 100. id - The sticker id. If this property is not defined, it will be generated.
background - Background color in hexadecimal format or an RGBA Object. Defaults to undefined (transparent).

Import

Before using the library, you need to import it.

import { Sticker, createSticker, StickerTypes } from 'wa-sticker-formatter' // ES6
// const { Sticker, createSticker, StickerTypes } = require('wa-sticker-formatter') // CommonJS

Using The Sticker constructor (Recommended)

const sticker = new Sticker(image, {
    pack: 'My Pack', // The pack name
    author: 'Me', // The author name
    type: StickerTypes.FULL, // The sticker type
    categories: ['๐Ÿคฉ', '๐ŸŽ‰'], // The sticker category
    id: '12345', // The sticker id
    quality: 50, // The quality of the output file
    background: '#000000' // The sticker background color (only for full stickers)
})

const buffer = await sticker.toBuffer() // convert to buffer
// or save to file
await sticker.toFile('sticker.webp')

// or get Baileys-MD Compatible Object
conn.sendMessage(jid, await sticker.toMessage())

You can also chain methods like this:

const buffer = await new Sticker(image)
    .setPack('My Pack')
    .setAuthor('Me')
    .setType(StickerTypes.FULL)
    .setCategories(['๐Ÿคฉ', '๐ŸŽ‰'])
    .setId('12345')
    .setBackground('#000000')
    .setQuality(50)
    .toBuffer()

The image (first parameter) can be a Buffer, URL, SVG string, or File path.

SVG Example

const sticker = new Sticker(`
    <svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512">
        <path d="M256 0C114.6 0 0 114.6 0 256s114.6 256 256 256 256-114.6 256-256S397.4 0 256 0zm0 464c-119.1 0-216-96.9-216-216S136.9 40 256 40s216 96.9 216 216-96.9 216-216 216z" fill="#ff0000" />
    </svg>
`, { author: 'W3' })

Using the createSticker function

const buffer = await createSticker(buffer, options) // same params as the constructor
// NOTE: `createSticker` returns a Promise of a Buffer

Options

The following options are valid:

interface IStickerConfig {
    /** Sticker Pack title*/
    pack?: string
    /** Sticker Pack Author*/
    author?: string
    /** Sticker Pack ID*/
    id?: string
    /** Sticker Category*/
    categories?: Categories[]
    /** Background */
    background?: Sharp.Color
     /** Sticker Type */
    type?: StickerTypes | string
    /* Output quality */
    quality?: number
}

Sticker Types

Sticker types are exported as an enum.

enum StickerTypes {
    DEFAULT = 'default',
    CROPPED = 'crop',
    FULL = 'full',
    CIRCLE = 'circle,
    ROUNDED = 'rounded'
}

Background

Background can be a hex color string or a sharp color object.

{
    "background": "#FFFFFF"
}

or

{
    "background": {
        "r": 255,
        "g": 255,
        "b": 255,
        "alpha": 1
    }
}

Metadata

Here's some basic information about WhatsApp Sticker Metadata.

In WhatsApp, stickers have their own metadata embedded in the WebP file as They hold info like the author, the title or pack name and the category.

1. Author and Pack Title

metadata

The text on bold is the pack title and the rest is the author. This is actually Exif Metadata embedded in the WebP file.

2 Sticker Category

This is an array of Emojis. Learn More

Extracting Metadata

To extract the metadata from the WebP file, you can use the extractMetadata() function.

import { extractMetadata, Sticker } from 'wa-sticker-formatter'
import { readFileSync } from 'fs'

const sticker = readFileSync('sticker.webp')
let metadata = await extractMetadata(sticker) // { emojis: [], 'sticker-pack-id': '', 'sticker-pack-name': '', 'sticker-author-name': '' }

// or use the static method from the Sticker class
metadata = await Sticker.extractMetadata(sticker)

Thanks for using Wa-Sticker-Formatter!

wa-sticker-formatter's People

Contributors

alenvelocity avatar code-factor avatar helvio88 avatar mukhlisakbr avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

wa-sticker-formatter's Issues

Remove the libwebp binaries

TODO

  • Remove the libwebp binaries
  • Add a postInstall script which downloads the binaries based on the system

Add sticker.ly Api wrapper

Adding stickerly we can have more flexibility

  • We can get stickers by it ID or packname

And

  • We can have wsf upload stickers to Stickerly!

Can't import wa-sticker-formatter

when i try to import the wa-sticker-formatter library and try to run the script it gives an error

zsh: illegal hardware instruction (core dumped)  node ello.js

im using arch-linux btw

error when run on vps ubuntu 20.04 ARMv8 x64

hello. I tried to run the example code below:

const { Sticker } = require('wa-sticker-formatter')

const image = 'https://c.tenor.com/WZBvSgw5JMgAAAAC/watson-amelia-amelia-watson.gif'


const stickerMetadata = {
    type: 'full',
    pack: 'watson',
    author: 'amelia',
    categories: [
        '๐ŸŒน'
    ]
}
const sticker = new Sticker(image, stickerMetadata).build()

and I returned this error that I didn't understand:

node:child_process:397
      ex = new Error('Command failed: ' + cmd + '\n' + stderr);
           ^

Error: Command failed: "/app/node_modules/wa-sticker-formatter/bin/libwebp_linux/bin/gif2webp" /tmp/0.5qhsrtj739g.gif -o /tmp/0.5qhsrtj739g.webp
/bin/sh: 1: /app/node_modules/wa-sticker-formatter/bin/libwebp_linux/bin/gif2webp: Exec format error

    at ChildProcess.exithandler (node:child_process:397:12)
    at ChildProcess.emit (node:events:394:28)
    at maybeClose (node:internal/child_process:1064:16)
    at Socket.<anonymous> (node:internal/child_process:450:11)
    at Socket.emit (node:events:394:28)
    at Pipe.<anonymous> (node:net:672:12) {
  killed: false,
  code: 2,
  signal: null,
  cmd: '"/app/node_modules/wa-sticker-formatter/bin/libwebp_linux/bin/gif2webp" /tmp/0.5qhsrtj739g.gif -o /tmp/0.5qhsrtj739g.webp',
  stdout: '',
  stderr: '/bin/sh: 1: /app/node_modules/wa-sticker-formatter/bin/libwebp_linux/bin/gif2webp: Exec format error\n'
}

is this some incompatibility with ARM systems?

Error in Sticker formatter of xre

A simple problem has surfaced since last few days, as my xre...which is being hosted on cloud through free heroku Isn't being able to convert animated gif stickers properly, i mean it's creating a sticker but that's not the gif but a still image into sticker, also the processing is slow (taking around 50-60seconds).
I know this might be because of Cloud platform being weak to handle all this nodes but...I wish it could be fixed.
Thank you!

Cannot read properties of undefined (reading 'toString')

i try to extractMetadata a sticker without packname and author , but it says error like this

TypeError: Cannot read properties of undefined (reading 'toString')
    at C:\Users\Administrator\nganu\node_modules\wa-sticker-formatter\dist\extractMetadata.js:22:27
    at Generator.next (<anonymous>)
    at fulfilled (C:\Users\Administrator\nganu\node_modules\wa-sticker-formatter\dist\extractMetadata.js:5:58)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

can we handle this with empty result, like

{
    'emojis': [],
    'sticker-pack-id': '',
    'sticker-pack-name': '',
    'sticker-pack-publisher': '',
}

sorry for my bad english ๐Ÿ˜„

sharp ERROR

]: /root/QueenSewWhatsappBot/node_modules/sharp/lib/sharp.js:30
2021-11-19T09:44:22.947378+00:00 app[worker.1]: throw new Error(help.join('\n'));
2021-11-19T09:44:22.947379+00:00 app[worker.1]: ^
2021-11-19T09:44:22.947379+00:00 app[worker.1]:
2021-11-19T09:44:22.947380+00:00 app[worker.1]: Error:
2021-11-19T09:44:22.947380+00:00 app[worker.1]: Something went wrong installing the "sharp" module
2021-11-19T09:44:22.947380+00:00 app[worker.1]:
2021-11-19T09:44:22.947382+00:00 app[worker.1]: Error relocating /root/QueenSewWhatsappBot/node_modules/sharp/build/Release/../.././vendor/8.11.3/linuxmusl-x64/lib/libvips-cpp.so.42: _ZNSt7__cxx1119basic_ostringstreamIcSt11char_traitsIcESaIcEEC1Ev: symbol not found
2021-11-19T09:44:22.947382+00:00 app[worker.1]:

video to sticker giving error

not able to convert video to a sticker @AlenSaito1

handleExit(new Error('ffmpeg exited with code ' + code));
^
Error: ffmpeg exited with code 1
at ChildProcess. (D:\Giga\Java Script\I-BOT\node_modules\fluent-ffmpeg\lib\processor.js:182:22)
at ChildProcess.emit (events.js:315:20)
at ChildProcess.EventEmitter.emit (domain.js:486:12)
at Process.ChildProcess._handle.onexit (internal/child_process.js:277:12)
error Command failed with exit code 1.

any way to just set the exif data?

I'm using version 3.6 to just define the pack and author of the sticker. I have my own function that converts to webp with a nice performance. is there any way to only use this functionality in the most current version of the lib?

I need the most current function because it runs on ARM machines

WebpMux error on termux - Syntax error: ")" unexpected

I'm running this piece of code in my script that creates a WebP to send to someone as a sticker.

const webpWithMetadata = await WSF.setMetadata('O melhor robo', 'Jarvis', ran) //returns the webp buffer with metadata

But when I run this code I get this error:

errowebpmux

PS: I'm using termux on my android phone...

Possible Bug

Here in this Function
https://github.com/AlenSaito1/wa-sticker-formatter/blob/b4eb0685dd3548d08845197cb9e1c7118ed79c88/src/lib/convert.ts#L8

Following Code Uses Recursion. I don't exactly understand, what it's doing but this might be the source of infinite ffmpeg loop

const convert = async (data: Buffer, mime: string, type: 'crop' | 'full' | 'default' = 'default'): Promise<Buffer> => {
    const isVideo = mime.startsWith('video')
    const image = isVideo ? await videoToGif(data) : data
    if ((isVideo || mime.includes('gif')) && type === 'crop') {
        const filename = `${tmpdir()}/${Math.random().toString(36)}.webp`
        await writeFile(filename, image)
        return convert(await crop(filename), 'image/webp', 'default')
    }

Animated as option!

If you use this with webp file to put metadata and send the animated sticker works great, but if you check the sticker message it is false to isAnimated.

animated: boolean

Something went wrong when installing the "sharp" module

Something went wrong installing the "sharp" module

Error relocating /root/myroot/node_modules/sharp/build/Release/../.././vendor/8.11.3/linuxmusl-x64/lib/libvips-cpp.so.42: _ZNSt7__cxx1119basic_ostringstreamIcSt11char_traitsIcESaIcEEC1Ev: symbol not found

Possible solutions:

  • Install with the --verbose flag and look for errors: "npm install --ignore-scripts=false --verbose sharp"
  • Install for the current runtime: "npm install --platform=linux --arch=x64 sharp"
  • Consult the installation documentation: https://sharp.pixelplumbing.com/install

sticker from video or gif is generated with a strange effect

the sticker looks like the example below:

ezgif com-gif-maker

any way to fix or avoid this weird effect?

my code:

const sticker = new Sticker(buffer, {
    pack: 'thierry', // The pack name
    author: 'bot thierry', // The author name
    type: StickerTypes.FULL, // The sticker type
    categories: ['๐Ÿคฉ', '๐ŸŽ‰'], // The sticker category
    id: '1234', // The sticker id
    quality: 50, // The quality of the output file
})
await sticker.toFile('./static/sticker.webp')

Crop problem in still Images

I checked cropping static Image with new WSF.Sticker(buffer,{crop: true}); the Image was stretched and same when used with animated:true for gifs sticker returned with perfectly centerCropped Image.

crop:true is stretching/squeezing static Images and centerCropping gifs I need to centerCrop static images too any workaround to achieve this ?

Error: cannot find ffmpeg

When I'm going to make a sticker in mp4 format this error appears in the console

Error: Cannot find ffmpeg

Even though I already installed ffmpeg with

npm i fluent-ffmpeg

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.