demarcate.js technical demo page

Table of contents

Note:
A div with class toc is automatically converted to a TOC Markdown tag

Supported Elements

Heading 3

Heading 4

Heading 5
Heading 6

Some more text

A blockquote with some further strong and em'd text to test our capabilities.

Some text with embedded link and more text, and even some images: placeholder image

  1. You can also do ordered lists!
  2. Just use the two toolbar buttons
  3. To select between ordered list or unordered list

Partially Supported Elements

Footnotes1

Footnote support is based on the footnotes generated by the Python footnote extension. Footnotes are converted to Markdown but there is no specific editing sytnax for adding them. To add footnotes, simply create a footnote reference in your text - e.g. [^1] and then at the bottom of your document define this in another paragraph block. [^1]: a footnote.

These will not be rendered as footnotes by demarcate.js, instead the Markdown will be preserved and your server should handle this rendering. Note that as long as footnotes have the correct tags (e.g. footnote references are in a sup tag with a <div class="footnote"> wrapping your ordered list of footnotes, then Markdown footnotes can be generated from HTML.

Note, currently footnotes text can't be edited as it strips away the footnote references.

Tables

Tables cells can be edited, however new rows cannot be added Only tables with a top row header and colspan and rowspan of 1 are supported.

Item 1 - various lengthsItem 2
Item A1But not currently colspans
Item B1Item B2
Item C1(or rowspans)

Source Code

Markdown is returned but editing not currently possible 

// select all "div" elements <div>
$("div")

// select all "div" elements with class "myclass" e.g <div class="myclass">
$("div.myclass")

// select any element with id "myid" (e.g. <h1 id="myid">
$("#myid")

// select only the "div" element with the id "myid" - i.e.
// will ignore <h1 id="myid">
$("div#myid")

  1. Footnotes are currently managed by adding footnote Markdown inside paragraph blocks ^

Usage Notes