Skip to content
This repository has been archived by the owner on Apr 15, 2024. It is now read-only.

Commit

Permalink
Documentation, CI
Browse files Browse the repository at this point in the history
  • Loading branch information
HamAndRock committed Jan 28, 2021
1 parent 11b6c56 commit 777b4f4
Show file tree
Hide file tree
Showing 4 changed files with 81 additions and 13 deletions.
26 changes: 26 additions & 0 deletions .github/workflows/npm-publish.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
name: npm-publish

on:
release:
types: [published]

jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
with:
node-version: '12.x'
registry-url: 'https://registry.npmjs.org'

- name: 'Install dependencies'
run: npm ci

- name: 'Build typescript'
run: npm run build

- name: 'Publish library to NPM'
run: npm publish --access public
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_AUTH_TOKEN }}
50 changes: 48 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,50 @@
# QR Image
Simple library allowing you to generate an image in middle of an QR code.
Simple library allowing you to generate an image in middle of an QR code or without it.

This library contains only 1 method and that is `generateQRWithImage`
This library contains only 1 method and that is `generateQRWithImage` and uses libraries
[qrcode](https://www.npmjs.com/package/qrcode) and [canvas](https://www.npmjs.com/package/canvas) to generate the
resulting image.

## Quick Example

```js

const imageBuffer;

// for option values please visit https://www.npmjs.com/package/qrcode#qr-code-options library
const options = {
errorCorrectionLevel: 'Q',
color: {
dark: '#0CC8A8'
}
};


// This will create QR with 'https://trisbee.com' encoded in it and with centered image also color will be #0CC8A8
const resultWithImage = generateQRWithImage('https://trisbee.com', 500, 100, imageBuffer, options)
// This will create just QR code with 'https://trisbee.com' encoded in it in color #0CC8A8
const resultWithoutImage = generateQRWithImage('https://trisbee.com', 500, 100, null, options)
// This will create classic B&W QR code with 'https://trisbee.com' encoded in it
const resultWithoutImageAndOptions = generateQRWithImage('https://trisbee.com', 500, 100, null, null)

// The buffer of outputed QR code
const imageBuffer = resultWithImage.buffer;

// The precentage of how much the inserted image area of QR code image covers
// if 'errorCorrectionLevel' is not specified theoretical maxium of how much the image can cover is 30%
// but we recommend to keep it under 20 and make sure the image doesn't touch the big rectangles in the corners
// of QR
const imageQRCoverage = resultWithImage.coverage



```

### Typings
```ts
generateQRWithImage(qrCodeContent: string, width: number, margin: number, imageBuffer?: Buffer, options?: QRCodeToBufferOptions)
```

### Options

For options please visit documentation of [qrcode](https://www.npmjs.com/package/qrcode#qr-code-options) library
4 changes: 1 addition & 3 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@trisbee/qr-image-nodejs",
"version": "1.0.0",
"version": "1.0.2",
"types": "dist/index.d.ts",
"description": "Allows you to generate image in middle of QR code",
"main": "dist/index.js",
Expand All @@ -9,8 +9,6 @@
"url": "git+https://github.com/trisbee/qr-image-nodejs.git"
},
"scripts": {
"run": "ts-node -r tsconfig-paths/register src/index.ts",
"dev": "nodemon -r tsconfig-paths/register -e ts,html -w ./src -x ts-node src/index.ts",
"build": "tsc"
},
"dependencies": {
Expand Down
14 changes: 6 additions & 8 deletions src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,13 @@ import {QRCodeToBufferOptions} from "qrcode";

const {createCanvas, loadImage} = require('canvas')

interface QRResponse {
buffer: Buffer,
coverage: number
}




export const generateQRWithImage = async (qrCodeContent: string, width: number, margin: number, imageBuffer?: Buffer | null, options?: QRCodeToBufferOptions) : Promise<{
buffer: Buffer,
qrImageCoverage: number
}> => {
export const generateQRWithImage = async (qrCodeContent: string, width: number, margin: number, imageBuffer?: Buffer | null, options?: QRCodeToBufferOptions): Promise<QRResponse> => {

const fullHeight = width + margin;

Expand Down Expand Up @@ -45,14 +44,13 @@ export const generateQRWithImage = async (qrCodeContent: string, width: number,
}



const qrVolume = width * width;
const result = (imageVolume / qrVolume) * 100;


return {
buffer: canvas.toBuffer(),
qrImageCoverage: result,
coverage: result,
}


Expand Down

0 comments on commit 777b4f4

Please sign in to comment.