Coder Social home page Coder Social logo

emg110 / algorand-qrcode Goto Github PK

View Code? Open in Web Editor NEW
21.0 2.0 9.0 2.63 MB

Algorand QR Code generator is a JavaScript module that outputs an standard QR code (exportable to SVG file and text) from a JSON object. It works in terminal, NodeJS and modern browsers. Complies to Algorand ABNF Grammar.

Home Page: https://developer.algorand.org/solutions/algorand-qr-code-generator-javascript/

License: MIT License

JavaScript 100.00%
algorand payment qr qrcode generator nodejs web browser cli algorand-uri qr-generator qr-codes algorand-qrcode javascript wallet

algorand-qrcode's Introduction

Algorand QR Code Generator V3.2.0

NPM JavaScript Style Guide npm

New version 3 is a complete re-write of the Algorand QRCode generation tool. Simpler and more effective!

Breaking changes: The way to import and some of options have changed , please consult this readme.

algorand://AMESZ5UX7ZJL5M6GYEHXM63OMFCPOJ23UXCQ6CVTI2HVX6WUELYIY262WI?label=emg110@gmail.com

Demo

Links

News

Version 3.2.0 is now here!

Now completely supports any modern web framework

Modern JS Module in both Node and Browser

Technical notes

Table of contents

Highlights

  • Supports NodeJS and Browser.
  • Supports RFC 3986 and Algorand URI ABNF Grammar.
  • CLI utility.
  • Save QR code as valid SVG image or text

Algorand URI ABNF Grammar

    algorandurn     = "algorand://" algorandaddress [ "?" algorandparams ]
    algorandaddress = *base32
    algorandparams  = algorandparam [ "&" algorandparams ]
    algorandparam   = [ amountparam / labelparam / noteparam / assetparam  ]
    amountparam     = "amount=" *digit
    labelparam      = "label=" *qchar
    assetparam      = "asset=" *digit
    note            = "note=" *qchar

Installation and use

npm install --save algorand-qrcode

and then

import algoqrcode from "algorand-qrcode/lib/bundle.min.js"

or, install it globally to use qrcode cli command to generate Algorand URI qrcode images in your terminal.

npm install -g algorand-qrcode

and then

algoqrcode [options]

Usage

Browser and Frameworks (react...) use

import algoqrcode from "algorand-qrcode/lib/bundle.min.js";
const MyQrCodeComponent = (props)=>{
  let qrcode = algoqrcode({wallet:props.wallet, label:props.label})
  let scg = qrcode.svg()
  return svg
}
 
      

CLI

Usage: algoqrcode [options]

Algorand options:
  -m, --amount Amount (in Micro Algos) of Algorand transaction          [number]
  -w, --wallet Destination Wallet address (Algorand account address)      [string]
  -l, --label Label of Algorand transaction                             [string]
  -a, --asset Algorand asset id (in case of Algorand ASA transfer)      [string]
  -n, --note note                                                       [string]

QR Code options:
              
  -e, --ecl     Error correction level           [choices: "L", "M", "Q", "H"]



Renderer options:
  -o, --output        Output type           [choices: "file", "svg", "terminal"]
  -w, --wallet        Destination wallet                                [number]
  -p, --padding       Padding around QRcode                             [number]
  -b, --background    Light color                                       [string]
  -c, --color         Dark color                                        [string]
  -s, --size          QRcode image width and height (px)                [number]
  -f, --file          Output file                                       [string]


Options:

  -h, --help    Show help                                              [boolean]
  --version     Show version number                                    [boolean]

Examples:
    - Send 1 Algo transaction:
    algoqrcode -w "AMESZ5UX7ZJL5M6GYEHXM63OMFCPOJ23UXCQ6CVTI2HVX6WUELYIY262WI" -m 1000000 -s 128 -n "This is an Algo payment transaction QR Code"

    - Save Algorand contact label as svg image:
    algoqrcode -w "AMESZ5UX7ZJL5M6GYEHXM63OMFCPOJ23UXCQ6CVTI2HVX6WUELYIY262WI" -l "[email protected]" -o file -f sample.svg 

NodeJS

Import the module algorand-qrcode for your NodeJS module

        import algoqrcode from 'algorand-qrcode'
        let qrcode = algoqrcode({
            wallet: "AMESZ5UX7ZJL5M6GYEHXM63OMFCPOJ23UXCQ6CVTI2HVX6WUELYIY262WI",
            label: "Test Label",
            output: "svg",
            size:256
        })
        let svg = qrcode.svg()
        console.log(svg)

Error correction level

Error correction capability allows to successfully scan a QR Code even if the symbol is dirty or damaged. Four levels are available to choose according to the operating environment.

Higher levels offer a better error resistance but reduce the symbol's capacity.
If the chances that the QR Code symbol may be corrupted are low (for example if it is showed through a monitor) is possible to safely use a low error level such as Low or Medium.

Possible levels are shown below:

Level Error resistance
L (Low) ~7%
M (Medium) ~15%
Q (Quartile) ~25%
H (High) ~30%

The percentage indicates the maximum amount of damaged surface after which the symbol becomes unreadable.

Error level can be set through options.ecl property.
If not specified, the default value is M.

QR Code options

errorCorrectionLevel

Type: String
Default: M

Error correction level.
Possible values are low, medium, quartile, high or L, M, Q, H.

Algorand URI params

wallet

Type: String

Wallet address for Algorand transaction.

amount

Type: Number

Amount of Algorand transaction in MicroAlgos or Standard Asset Unit.

label

Type: String

Label of Algorand transaction.

asset

Type: String

Asset Id of Algorand transaction if used. If not specified , Algo will be used as fungible token.

note

Type: String

note field content of Algorand transaction.

Renderers options

ecl

Type: String
Default: M

Define the error correction level.

padding

Type: Number
Default: 5

Define how much wide the quiet zone should be.

size

Type: Number
Default: 128

Width and height.

color

Type: String
Default: #000000ff

Color of dark module. Value must be in hex format (RGBA).
Note: dark color should always be darker than color.light.

background

Type: String
Default: #ffffffff

Color of light module. Value must be in hex format (RGBA).

License

MIT

Credits

Special appreciations to Sheghzo.

The idea for this lib was inspired by: Algorand developers portal Article Payment Prompts with Algorand Mobile Wallet ,from Jason Paulos.

Mentioned Trademarks

"QR Code" curtsey of :

"Algorand" curtsey of:

algorand-qrcode's People

Contributors

emg110 avatar sheghzo avatar

Stargazers

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

Watchers

 avatar  avatar

algorand-qrcode's Issues

Unexpected token 'export' error

Hello.
I tried to run "algorand-qrcode"(v2.1.1) module by the following command.
node qrcode -d "AMESZ5UX7ZJL5M6GYEHXM63OMFCPOJ23UXCQ6CVTI2HVX6WUELYIY262WI" -a 25 -s 45 -n "This is an Algorand USDT Tether payment transaction QR Code" -p

However, faced this error.
image

The version of Node I am using is v18.12.1.

How to fix this?

Thank you.

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.