JSPM

doc-html

0.1.0
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 1
  • Score
    100M100P100Q26667F

For writing an HTML page that can switch between multiple human languages (or multiple programming languages). Also can prettify white spaces in <pre>. Purely browser-side.

Package Exports

  • doc-html

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (doc-html) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

doc-html

Two features:

  • prettify <pre>
  • switch between multiple human languages, or multiple programming languages

If you are writing a manual/documentation of your project but find Markdown is too simple and HTML is too complicated/ugly, you have come to the right place!

Put this before all other script elements:

<script src="doc-html.js" type="text/javascript"></script>

It's fully browser-side. Don't use it for any server-side purposes.

<pre> indentation

It will detect indentation in <pre> elements and display them correctly.

<body>
    <pre><code>
        var a = function() {
            alert("something");
        };
    </code></pre>
</body>

After applying doc-html, the first 8 white spaces in each line will be removed.

Multiple languages

If you want your page to be able to seamlessly switch between English and Chinese, and between JavaScript and CoffeeScript, then you can write:

var naturalLangs = ["en", "zh"];
var programLangs = ["js", "coffee"];

then in a button callback:

setLang("zh", naturalLangs);

in another button callback:

setLang("coffee", programLangs);

All elements with these 4 class names will be toggled.

Real page example

It's used by my "wishlist" tutorial:

Click to see (this HTML page is fully hand-written).