ark-qrcode

v0.0.7

Published

2 years ago

A web component to generate QR codes for ARK payments.

Downloads

0High
0Medium
0Low

luciorubeens

ARK QR Code

A web component to generate QR codes for ARK payments.

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">

Authors

Lúcio Rubens [email protected]

License

ARK QRCode is licensed under the MIT License - see the LICENSE file for details.

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme