Skip to content

Latest commit

 

History

History
296 lines (186 loc) · 8.65 KB

README.md

File metadata and controls

296 lines (186 loc) · 8.65 KB
Raw

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

Live Demo

Links

Algorand Developers Portal Publication

Algorand Dev Hours Presentation

Algorand Dev Hours Presentation Video on YouTube

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: