Kaku (write) is my own markup language. It's inspired by Markdown with a few modification for quotes, links, images and lists handling. It was created to fit my needs. This repositoty contains a parser for Kaku.
The parser exists in two branches:
- the
master
branch is the classic parser as explained below - the
responsive-lazy-images
is a modified version with more advanced image management, but severely opiniated so it can work with Ronbun
If you are new to Kaku, use the master branch!
Kaku 書く is a free to use by individuals and organizations that do not operate by capitalist principles. For more information see the license file.
Kaku uses some syntax from Markdown for basic text transformation. However it uses an array like declaration with special characters for things like quotes, links and images.
Example : # Title
Will return:
<h1>Title</h1>
Example : ## Title
Will return:
<h2>Title</h2>
Same for titles 3 to 6...
Example : *bold*
Will return:
<strong>bold</strong>
Example : _emphasis_
Will return:
<em>emphasis</em>
Example : code
Will return:
<code>code</code>
Example:
```
This is some code
```
Will return:
This is some code
Example : strike
Will return:
<del>strike</del>
Quotes can take up to 4 arguments:
- The quote itself
- The author
- The source of the quote
- The url of the quote
Example: (quote: I am the quoted text! author: Author of quote source: Source of quote link: url_of_quote
Will return:
<figure>
<blockquote cite="url_of_quote">
And even, quotes!
</blockquote>
<figcaption>—Author, <a href="url_of_quote"> Source of quote</a></figcaption>
</figure>
Links can take up to 3 arguments:
- The link url
- The text of the link
- The text for the accessibility label (optionnal)
- The text for the title (optionnal)
Example: (link: https://github.com/Thomasorus/Kaku text: Check the this link to the repo! label: Link to Kaku's repo title: Hover title)
Will return:
<a href="https://github.com/Thomasorus/Kaku" aria-label="Link to Kaku's repo" title="Hover title">Check the this link to the repo!</a>
Images can take up to 3 arguments:
- The image name or url
- The image alt text for accessibility
- The image caption (optionnal, will create a figure and figcaption)
Image with alt text : (image: img_url, alt: the alternate text)
Will return;
<img src="img_url" alt="the alternate text">
Image with caption : (image: img_url, alt: the alternate text figcaption: the text under the image)
Will return:
<figure>
<img src="img_url" alt="the alternate text">
<figcaption>the text under the image</figcaption>
</figure>
- AAA
- BBB
- CCC
Will return:
<ul>
<li>AAA</li>
<li>BBB</li>
<li>CCC</li>
</ul>
+ Number 1
+ Number 1
+ Number 1
Will return:
<ol>
<li>Number 1</li>
<li>Number 2</li>
<li>Number 3</li>
</ol>
? Term 1 : definition 1
? Term 2 : definition 2
Will return:
<dl>
<dt>Term 1</dt>
<dd>definition 1</dd>
<dt>Term 2</dt>
<dd>definition 2</dd>
</dl>
Videos can take up to 2 arguments:
- The video name or url (mp3 only for audio)
- If a video you can add a
g
parameter to use the video as a gif
Classic video: (video: videoUrl)
Will return:
<video controls="" preload="metadata" src="videoUrl" type="video/mp4"></video>
Video as gif: (video: videoUrl autoplay)
Will return:
<video autoplay="true" playsinline="true" loop="true" mute="true" preload="metadata" src="videoUrl" type="video/mp4"></video>
Audio: (audio: audioUrl)
Will return;
<audio controls="" preload="metadata" src="audioUrl" type="audio/mpeg"></audio>
Note: all audio and video elements come with the preload="metadata"
attribute to help slower connections.
----
Will return:
<hr>
This projects comes with unit tests. To run them:
- Install with
yarn
- Configure tests in
test.js
- Run tests with
npx ava