https://github.com/hankei6km/mdast-qrcode

convert "qrcode:" to dataURL in Image URL/alt of mdast
https://github.com/hankei6km/mdast-qrcode

markdown mdast qrcode

Last synced: 3 days ago
JSON representation

convert "qrcode:" to dataURL in Image URL/alt of mdast

• Host: GitHub
• URL: https://github.com/hankei6km/mdast-qrcode
• Owner: hankei6km
• License: mit
• Created: 2021-05-01T10:05:32.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2021-10-24T14:59:55.000Z (almost 3 years ago)
• Last Synced: 2024-09-19T02:27:14.096Z (14 days ago)
• Topics: markdown, mdast, qrcode
• Language: TypeScript
• Homepage:
• Size: 2.13 MB
• Stars: 0
• Watchers: 3
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# mdast-qrcode

convert a URL etc. that contained in Image / Link of [mdast](https://github.com/syntax-tree/mdast) by using [qrcode](https://www.npmjs.com/package/qrcode) package.

## Install

npm:

```

npm install mdast-qrcode

```

## Usage

### `qrcode:` in URL of Image

code:

```typescript

import fromMarkdown from 'mdast-util-from-markdown';

import toMarkdown from 'mdast-util-to-markdown';

import { toImageDataURL } from './qrcode';

(async () => {

  const tree = fromMarkdown('# title1\n\n![alt1](qrcode:test1)\ntext1');

  await toImageDataURL(tree);

  console.log(toMarkdown(tree));

})();

```

yield:

```markdown

# title1

![alt1](data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHQAA ...snip ...=)

text1

```

###  `qrcode:` in alt with filename is `mdast-qrcode.*` 

code:

```typescript

import fromMarkdown from 'mdast-util-from-markdown';

import toMarkdown from 'mdast-util-to-markdown';

import { toImageDataURL } from './qrcode';

(async () => {

  const tree = fromMarkdown(

    '# title3\n\n![alt3:qrcode:test3](/path/to/mdast-qrcode.png)\ntext3'

  );

  await toImageDataURL(tree);

  console.log(toMarkdown(tree));

})();

```

yield:

```markdown

# title3

![alt3](data:image/png;base64,iVBORw0KGgoAAAA ...snip ...=)

text3

```

### The URL of link that surrounds image with filename is `mdast-qrcode.*` 

code:

```typescript

import fromMarkdown from 'mdast-util-from-markdown';

import toMarkdown from 'mdast-util-to-markdown';

import { toImageDataURL } from './qrcode';

(async () => {

  const tree = fromMarkdown(

    '# title5\n\n[![alt5](/path/to/mdast-qrcode.png)](url5)\ntext5'

  );

  await toImageDataURL(tree);

  console.log(toMarkdown(tree));

})();

```

yield:

```markdown

# title5

[![alt5](data:image/png;base64,iVBORw0KGgoAAAAN ...snip ...=)](url5)

text5

```

### Pass options from file name / alt

code:

```typescript

import fromMarkdown from 'mdast-util-from-markdown';

import toMarkdown from 'mdast-util-to-markdown';

import { toImageDataURL } from './qrcode';

(async () => {

  const tree = fromMarkdown(

    '# title7\n\n![alt7:qrcode:test7](/path/to/mdast-qrcode-width-250.png)\n\ntext7'

  );

  await toImageDataURL(tree);

  console.log(toMarkdown(tree));

})();

```

yield:

```markdown

# title7

![alt7](data:image/png;base64,iVBORw0KGgoAAAAN ...snip ...=)

text7

```

qrcode options:

- margin: `-margin-`

- scale: `-scale-`

- width: `-width-`

- colorr.light: `-color_light-` 

- color.dark: `-color_light-` 

mdqr format options:

- type: `-format_type-`

- quality: `-format_quality-` (unit: `%`)

## API

### `toImageDataURL(tree[, options, mdqrOptions])`

convert "qrcode:" to dataURL in Image URL of [mdast](https://github.com/syntax-tree/mdast).

Images only support `root / paragraph / image` or `root / paragraph / link / image`  hierarchy.

If `image` is exist after the QRCode, that` image` will be converted as logo image.

#### options 

Options are passed to [QRCode.toDataURL](https://www.npmjs.com/package/qrcode#todataurltext-options-cberror-url-1).

#### mdqrOptions

Options to mdast-qrcode.

#### `format`

Options to encode QR code to DataURL.

##### `type`

 

type: `png` | `jpeg`

default: `png`

##### `quality`

 

type: `number`

default: `0.92`

#### returns

`Promise`

## CLI

```console

$ cat example/qrcode-deck.md  | md-qr > qrcode-embedded-deck.md

```

In addition to `:qrcode` convertion, Markdown string are also affected by [toMarkdown](https://github.com/syntax-tree/mdast-util-to-markdown#tomarkdowntree-options) serialized.

### JSON config file

```json

{

  "toMarkdown": { "bullet": "-", "rule": "-" }

}

```

`toMarkdown.bullet` / `toMarkdown.rule`  field are pass to [toMarkdown](https://github.com/syntax-tree/mdast-util-to-markdown#tomarkdowntree-options).

## Live Demo

[Live Demo](https://codesandbox.io/s/github/hankei6km/mdast-qrcode-live-demo?file=/slides/slide-deck.md)

1. fork

1. edit `slides/slide-deck.md`

## License

MIT License

Copyright (c) 2021 hankei6km

The word "QR Code" is registered trademark of: DENSO WAVE INCORPORATED