<commit_before><!DOCTYPE HTML>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="description" content="An interactive sandbox for learning and
    experimenting with Rimu markup plus documentation.">
  <title>Rimu Playground</title>
  <style type="text/css">
    /*<![CDATA[*/
    body {
      margin: 1em;
      font-family: Helvetica, Arial, sans-serif;
    }
    h1, h2, h3, h4, h5, h6, th {
      color: #527bbd;
    }
    h1 {
      margin-bottom: 0.2em;
    }
    table#view {
      table-layout: fixed;
      border-collapse:collapse;
      width: 100%;
      text-align:left;
    }
    #view td, #view th {
      border: 2px solid #ddd;
      width: 33%;
      padding: 0.5em;
    }
    #view td {
      height: 200px;
      vertical-align:top;
    }
    #rimu {
      height: 100%;
      min-height: 800px; /* Non-WebKit browsers don't auto-resize textarea. */
      width: 100%;
      background-color: #ffe;
      border: 1px solid #ddd;
    }
    #html {
      white-space: pre-wrap;
      margin: 0;
    }
    #preview em, #preview strong {
      color: #295bad;
    }
    #preview code, pre {
      color: #474747;
      white-space: pre-wrap;
    }
    #preview pre {
      margin-left: 1em;
      /*background-color: #f8f8f8;*/
    }
    #navbar {
      margin-left: 0.5em;
      font-weight: bold;
    }
    #navbar a {
      color: #527bbd;
      text-decoration: none;
    }
    #navbar .divider {
      color: silver;
    }
    /*]]>*/
  </style>
</head>
<body>
  <h1>Rimu Playground and Reference</h1>
  <p>
    <select id="topic"
            onchange="renderTopic(this.value)"
            onclick="renderTopic(this.value)">
      <option value="topic-anchors-and-links">Anchors and links</option>
      <option value="topic-api">API</option>
      <option value="topic-block-attributes">Block Attributes</option>
      <option value="topic-character-entities">Character entities</option>
      <option value="topic-comments">Comments</option>
      <option value="topic-delimited-blocks">Delimited blocks</option>
      <option value="topic-headers">Headers</option>
      <option value="topic-html-markup">HTML Markup</option>
      <option value="topic-images">Images</option>
      <option value="topic-lists">Lists</option>
      <option value="topic-macros">Macros</option>
      <option value="topic-other">Other</option>
      <option value="topic-paragraphs">Paragraphs</option>
      <option selected value="topic-playground">Playground</option>
      <option value="topic-quotes">Quotes</option>
      <option value="topic-replacements">Replacements</option>
      <option value="topic-tools">Tools</option>
      <option value="topic-urls-and-email">URLs and email addresses</option>
    </select>
    <button onclick="stash();">Stash</button>
    <button onclick="unstash();">Unstash</button>
    <span id="navbar">
      <a href="http://rimumarkup.org/">Home</a> <span class="divider">|</span>
      <a href="http://rimumarkup.org/tips.html">Tips</a> <span class="divider">|</span>
      <a href="http://github.com/srackham/rimu">Github</a> <span class="divider">|</span>
      <a href="https://npmjs.org/package/rimu">npm</a>
    </span>
  </p>

  <table id="view">
    <thead>
      <tr>
        <th>Rimu</th>
        <th>Preview</th>
        <th>HTML</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>
          <textarea id="rimu" onkeyup="convert();">Enter markup here.</textarea>
        </td>
        <td id="preview">
        </td>
        <td>
          <pre id="html"></pre>
        </td>
      </tr>
    </tbody>
  </table>

<div id="topic-anchors-and-links">
<!--
Anchors are jump targets for links within the document.

Syntax:

  Role            Rimu            HTML
  _________________________________________________________
  Inline anchor   <<#id>>         <span id="id"></span>
  Block anchor    <<#id>>         <div id="id"></div>
  Link            <#id|caption>   <a href="#id">caption</a>
  Link            <#id>           <a href="#id">#id</a>
  _________________________________________________________

- Block and inline anchor elements share the same syntax.
- Links are inline elements.

Examples:

- -
Refer to the <#x1|next paragraph> or the <#x2|second list item
below>.

<<#x1>>
Nisl curabitur donec. Vel porttitor et. Et amet vitae. Quam
porttitor integer. Bibendum neque quis quisque ac commodo. Non et
cumque. Sit et a consequat.

- Viverra pede turpis.
- <<#x2>>Esse et dui nonummy modi.
- -

See also the _URLs and email addresses_ topic.

-->
</div>

<div id="topic-api">
<!--
Rimu has just one API:

  render(source [, options])

Where `source` is a string containing Rimu markup and `options` is an
optional object argument with zero or more of the following
properties:

`safeMode`:: This option has a number value that controls how Rimu
renders embedded HTML:

  0 => Render the raw HTML (default behavior).
  1 => Delete the HTML.
  2 => Replace the HTML with the 'htmlReplacement' option string.
  3 => Render HTML as text.

`htmlReplacement`:: A string that replaces embedded HTML when
`safeMode` is set to `2`. Defaults to `<mark>replaced HTML</mark>`.

Example:<commit_msg>Documentation updates.<commit_after><!DOCTYPE HTML>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="description" content="An interactive sandbox for learning and
    experimenting with Rimu markup plus documentation.">
  <title>Rimu Playground</title>
  <style type="text/css">
    /*<![CDATA[*/
    body {
      margin: 1em;
      font-family: Helvetica, Arial, sans-serif;
    }
    h1, h2, h3, h4, h5, h6, th {
      color: #527bbd;
    }
    h1 {
      margin-bottom: 0.2em;
    }
    table#view {
      table-layout: fixed;
      border-collapse:collapse;
      width: 100%;
      text-align:left;
    }
    #view td, #view th {
      border: 2px solid #ddd;
      width: 33%;
      padding: 0.5em;
    }
    #view td {
      height: 200px;
      vertical-align:top;
    }
    #rimu {
      height: 100%;
      min-height: 800px; /* Non-WebKit browsers don't auto-resize textarea. */
      width: 100%;
      background-color: #ffe;
      border: 1px solid #ddd;
    }
    #html {
      white-space: pre-wrap;
      margin: 0;
    }
    #preview em, #preview strong {
      color: #295bad;
    }
    #preview code, pre {
      color: #474747;
      white-space: pre-wrap;
    }
    #preview pre {
      margin-left: 1em;
      /*background-color: #f8f8f8;*/
    }
    #navbar {
      margin-left: 0.5em;
      font-weight: bold;
    }
    #navbar a {
      color: #527bbd;
      text-decoration: none;
    }
    #navbar .divider {
      color: silver;
    }
    /*]]>*/
  </style>
</head>
<body>
  <h1>Rimu Playground and Reference</h1>
  <p>
    <select id="topic"
            onchange="renderTopic(this.value)"
            onclick="renderTopic(this.value)">
      <option value="topic-anchors-and-links">Anchors and links</option>
      <option value="topic-api">API</option>
      <option value="topic-block-attributes">Block Attributes</option>
      <option value="topic-character-entities">Character entities</option>
      <option value="topic-comments">Comments</option>
      <option value="topic-delimited-blocks">Delimited blocks</option>
      <option value="topic-headers">Headers</option>
      <option value="topic-html-markup">HTML Markup</option>
      <option value="topic-images">Images</option>
      <option value="topic-lists">Lists</option>
      <option value="topic-macros">Macros</option>
      <option value="topic-other">Other</option>
      <option value="topic-paragraphs">Paragraphs</option>
      <option selected value="topic-playground">Playground</option>
      <option value="topic-quotes">Quotes</option>
      <option value="topic-replacements">Replacements</option>
      <option value="topic-tools">Tools</option>
      <option value="topic-urls-and-email">URLs and email addresses</option>
    </select>
    <button onclick="stash();">Stash</button>
    <button onclick="unstash();">Unstash</button>
    <span id="navbar">
      <a href="http://rimumarkup.org/">Home</a> <span class="divider">|</span>
      <a href="http://rimumarkup.org/tips.html">Tips</a> <span class="divider">|</span>
      <a href="http://github.com/srackham/rimu">Github</a> <span class="divider">|</span>
      <a href="https://npmjs.org/package/rimu">npm</a>
    </span>
  </p>

  <table id="view">
    <thead>
      <tr>
        <th>Rimu</th>
        <th>Preview</th>
        <th>HTML</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>
          <textarea id="rimu" onkeyup="convert();">Enter markup here.</textarea>
        </td>
        <td id="preview">
        </td>
        <td>
          <pre id="html"></pre>
        </td>
      </tr>
    </tbody>
  </table>

<div id="topic-anchors-and-links">
<!--
Anchors are jump targets for links within the document.

Syntax:

  Role            Rimu            HTML
  _________________________________________________________
  Inline anchor   <<#id>>         <span id="id"></span>
  Block anchor    <<#id>>         <div id="id"></div>
  Link            <#id|caption>   <a href="#id">caption</a>
  Link            <#id>           <a href="#id">#id</a>
  _________________________________________________________

- Block and inline anchor elements share the same syntax.
- Links are inline elements.
- In most situations a _Block Attribute ID_ is preferable to a Block
  Anchor.

Examples:

""
<<#x1>>
Refer to the <#x1|this paragraph> or the <#x2|next paragraph> or
the <#x3|second list item below>.

.#x2
Bibendum neque quis quisque ac commodo. Non et cumque. Sit et a
consequat.

- Viverra pede turpis.
- <<#x3>>Esse et dui nonummy modi.
""

See also the _URLs and email addresses_ topic.

-->
</div>

<div id="topic-api">
<!--
Rimu has just one API:

  render(source [, options])

Where `source` is a string containing Rimu markup and `options` is an
optional object argument with zero or more of the following
properties:

`safeMode`:: This option has a number value that controls how Rimu
renders embedded HTML:

  0 => Render the raw HTML (default behavior).
  1 => Delete the HTML.
  2 => Replace the HTML with the 'htmlReplacement' option string.
  3 => Render HTML as text.

`htmlReplacement`:: A string that replaces embedded HTML when
`safeMode` is set to `2`. Defaults to `<mark>replaced HTML</mark>`.

Example:
{'fraction_non_alphanumeric': 0.15193157793580628, 'fraction_numerical': 0.012684989429175475, 'mean_word_length': 2.702241195304162, 'pattern_counts': {'":': 0, '<': 258, '<?xml version=': 0, '>': 264, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1743320', 'n_tokens_mistral': 3548, 'n_tokens_neox': 3404, 'n_words': 856}