Mercurial

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Markdown to HTML Converter</title>
    {{/parts/base_head.html}}
    <link rel="stylesheet" href="markdown_to_html/index.css" />
</head>
<body>
    {{/parts/header.html}}
    <div class="header">
        <h1>Markdown to HTML Converter</h1>
    </div>

    <div class="container">
        <div class="panel">
            <div class="label">Markdown Input</div>
            <textarea id="input" placeholder="Type your markdown here..."># Welcome to Markdown Converter

## Features

This converter supports:

- **Bold text** and *italic text*
- [Links](https://example.com)
- `inline code`
- ~~strikethrough~~

### Lists

1. Ordered lists
2. Like this one
3. With numbers

- Unordered lists
- Use dashes
- Or asterisks

### Code Blocks

```
function example() {
    return "Hello World";
}
```

### Blockquotes

> This is a blockquote
> It can span multiple lines

---

### Images

![Alt text](https://via.placeholder.com/150)

**Try editing this text!**</textarea>
        </div>

        <div class="panel">
            <div class="title">
              <div class="label">HTML Output</div>
              <button id="copy"> Copy </button>
            </div>
            <div id="output"></div>
        </div>
    </div>
    {{/parts/footer.html}}
    <script src="/markdown_to_html_bin.js"></script>
    <script>
        // Wait for WASM module to be ready
        Module.onRuntimeInitialized = () => {
          // Get raw pointer so we can free it after use
          const markdownToHtmlPtr = Module.cwrap('markdown_to_html', 'number', ['string']);
          const markdownFree = Module.cwrap('markdown_free', null, ['number']);

          function convert() {
            output.innerHTML = '';
            const markdown = input.value;

            // Get pointer, convert to string, then free the C memory
            const ptr = markdownToHtmlPtr(markdown);
            const html = Module.UTF8ToString(ptr);
            markdownFree(ptr);

            output.innerHTML = html;
          }

          input.addEventListener('input', convert);
          convert();

          copy.addEventListener('click', () => {
            const htmlBlob = new Blob([output.innerHTML], { type: 'text/html'});
            const textBlob = new Blob([output.innerText], { type: 'text/plain'});
            const data = [new ClipboardItem({
              'text/html': htmlBlob,
              'text/plain': textBlob
            })];
            navigator.clipboard.write(data).then(() => {
              copy.textContent = "Copied!";
              setTimeout(() => {
                copy.textContent = "Copy";
                copy.classList.remove('success');
              }, 1000);
            }).catch(err => {
              console.error('Failed to copy: ', err);
            });
          });
        };
    </script>
</body>
</html>
author	MrJuneJune <me@mrjunejune.com>
date	Fri, 23 Jan 2026 22:38:59 -0800
parents	8c74204fd362
children	4c725fde6999