Skip to content

A web component to generate QR codes for ARK payments.

License

Notifications You must be signed in to change notification settings

ArkEcosystemArchive/qrcode

Repository files navigation

ARK QR Code

A web component to generate QR codes for ARK payments.

Latest Version Node Engine Build Status Codecov License: MIT

Lead Maintainer: Lúcio Rubens

Install

Script tag

  • Put this script tag <script src='https://unpkg.com/ark-qrcode@latest/dist/arkqrcode.js'></script> in the head of your index.html

Node Modules

  • Run npm install ark-qrcode --save
  • Put this script tag <script src='node_modules/ark-qrcode/dist/arkqrcode.js'></script> in the head of your index.html

In a stencil-starter app

  • Run npm install ark-qrcode --save
  • Add { name: 'ark-qrcode' } to your collections.

Usage

Insert the element in your code and enter your custom properties:

<ark-qrcode address="DE6os4N86ef9bba6kVGurqxmhpBHKctoxY" amount="20.3"></ark-qrcode>

Examples

<body>
<ark-qrcode address="DE6os4N86ef9bba6kVGurqxmhpBHKctoxY" amount="10.5" vendor-field="Hello%20Ark!" size="200" show-logo="true">
<script>
  document.querySelector('ark-qrcode').getURI();
  // => ark:DE6os4N86ef9bba6kVGurqxmhpBHKctoxY?amount=10.5&vendorField=Hello%20Ark!
</script>
</body>

Generate this QR code:

Properties

This package complies with the specifications described in AIP-13.

Attribute Description Type Required
address Ark recipient address encoded in Base58. String Yes
amount Amount in ARK (Ѧ) or DARK (DѦ). Number No
label Recipient label string. String No
size Size of the QR code (pixels) Number No
show-logo Display the ARK logo in QR code Boolean No
vendor-field Vendor field string (encoded URI). String No

Methods

You can interact with the component data using the methods below:

getURI()

Format the properties entered to the ARK URI scheme.

document.querySelector('ark-qrcode').getURI();
// => ark:DE6os4N86ef9bba6kVGurqxmhpBHKctoxY?amount=20.3

getDataURL([mime])

Generates a base64 encoded data URI for the QR code.

document.querySelector('ark-qrcode').getDataURL();
// => data:image/png;base64,iVBORw0KGgoAAAANSUhE...n6ofvMC4I9AAAAAElFTkSuQmCC

validateURI(uri)

Validate an URI string.

const uri = 'ark:DE6os4N86ef9bba6kVGurqxmhpBHKctoxY?amount=10.5';
document.querySelector('ark-qrcode').validateURI(uri);
// => ["ark:DE6os4N86ef9bba6kVGurqxmhpBHKctoxY?amount=10.5", "DE6os4N86ef9bba6kVGurqxmhpBHKctoxY", "?amount=10.5"]

deserializeURI(uri)

Deserialize the URI scheme to a JSON object.

const uri = 'ark:DE6os4N86ef9bba6kVGurqxmhpBHKctoxY?amount=10.5&vendorField=Hello%20Ark!';
document.querySelector('ark-qrcode').deserializeURI(uri);
// => { address: 'DE6os4N86ef9bba6kVGurqxmhpBHKctoxY', amount: 10.5, label: null, vendorField: 'Hello Ark!' }

fromObject(obj)

Instantiate a URI from an Object.

const obj = { address: DE6os4N86ef9bba6kVGurqxmhpBHKctoxY, amount: 10.5 };
const element = document.querySelector('ark-qrcode').fromObject(obj);
// => <ark-qrcode address="DE6os4N86ef9bba6kVGurqxmhpBHKctoxY" amount="10.5">

Security

If you discover a security vulnerability within this package, please send an e-mail to [email protected]. All security vulnerabilities will be promptly addressed.

Credits

This project exists thanks to all the people who contribute.

License

MIT © ARK Ecosystem

About

A web component to generate QR codes for ARK payments.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published