examples: add wasm online demo

This commit is contained in:
Noah Hellman 2023-02-05 19:41:11 +01:00
parent 908ba72812
commit 5a882764f7
7 changed files with 182 additions and 0 deletions

103
Cargo.lock generated
View file

@ -41,6 +41,12 @@ version = "1.3.2"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "bef38d45163c2f1dde094a7dfd33ccf595c92905c8f8f4fdc18d06fb1037718a"
[[package]]
name = "bumpalo"
version = "3.12.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "0d261e256854913907f67ed06efbc3338dfe6179796deefc1ff763fc1aee5535"
[[package]]
name = "cc"
version = "1.0.79"
@ -120,12 +126,45 @@ dependencies = [
"jotdown",
]
[[package]]
name = "jotdown_wasm"
version = "0.1.0"
dependencies = [
"jotdown",
"wasm-bindgen",
"web-sys",
]
[[package]]
name = "js-sys"
version = "0.3.61"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "445dde2150c55e483f3d8416706b97ec8e8237c307e5b7b4b8dd15e6af2a0730"
dependencies = [
"wasm-bindgen",
]
[[package]]
name = "libc"
version = "0.2.139"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "201de327520df007757c1f0adce6e827fe8562fbc28bfd9c15571c66ca1f5f79"
[[package]]
name = "log"
version = "0.4.17"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "abb12e687cfb44aa40f41fc3978ef76448f9b6038cad6aef4259d3c095a2382e"
dependencies = [
"cfg-if",
]
[[package]]
name = "once_cell"
version = "1.17.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "6f61fba1741ea2b3d6a1e3178721804bb716a68a6aeba1149b5d52e3d464ea66"
[[package]]
name = "proc-macro2"
version = "1.0.51"
@ -249,6 +288,70 @@ version = "0.11.0+wasi-snapshot-preview1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "9c8d87e72b64a3b4db28d11ce29237c246188f4f51057d65a7eab63b7987e423"
[[package]]
name = "wasm-bindgen"
version = "0.2.84"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "31f8dcbc21f30d9b8f2ea926ecb58f6b91192c17e9d33594b3df58b2007ca53b"
dependencies = [
"cfg-if",
"wasm-bindgen-macro",
]
[[package]]
name = "wasm-bindgen-backend"
version = "0.2.84"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "95ce90fd5bcc06af55a641a86428ee4229e44e07033963a2290a8e241607ccb9"
dependencies = [
"bumpalo",
"log",
"once_cell",
"proc-macro2",
"quote",
"syn",
"wasm-bindgen-shared",
]
[[package]]
name = "wasm-bindgen-macro"
version = "0.2.84"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "4c21f77c0bedc37fd5dc21f897894a5ca01e7bb159884559461862ae90c0b4c5"
dependencies = [
"quote",
"wasm-bindgen-macro-support",
]
[[package]]
name = "wasm-bindgen-macro-support"
version = "0.2.84"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "2aff81306fcac3c7515ad4e177f521b5c9a15f2b08f4e32d823066102f35a5f6"
dependencies = [
"proc-macro2",
"quote",
"syn",
"wasm-bindgen-backend",
"wasm-bindgen-shared",
]
[[package]]
name = "wasm-bindgen-shared"
version = "0.2.84"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "0046fef7e28c3804e5e38bfa31ea2a0f73905319b677e57ebe37e49358989b5d"
[[package]]
name = "web-sys"
version = "0.3.61"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "e33b99f4b23ba3eec1a53ac264e35a755f00e966e0065077d6027c0f575b0b97"
dependencies = [
"js-sys",
"wasm-bindgen",
]
[[package]]
name = "winapi"
version = "0.3.9"

View file

@ -20,6 +20,7 @@ exclude = [
[workspace]
members = [
"examples/jotdown_wasm",
"tests/afl",
]

View file

@ -66,3 +66,4 @@ clean:
(cd tests/bench && make clean)
rm -f benches/*.dj
rm -rf tests/afl/out
(cd examples/jotdown_wasm && make clean)

View file

@ -0,0 +1,19 @@
[package]
name = "jotdown_wasm"
description = "Web demo of Jotdown"
authors = ["Noah Hellman <noah@hllmn.net>"]
license = "MIT"
version = "0.1.0"
edition = "2021"
homepage = "https://hllmn.net/projects/jotdown"
repository = "https://github.com/hellux/jotdown"
[lib]
crate-type = ["cdylib"]
[dependencies]
jotdown = { path = "../../" }
wasm-bindgen = { version = "0.2", default-features = false }
[dependencies.web-sys]
version = "0.3"

View file

@ -0,0 +1,15 @@
WASM=pkg/jotdown_wasm_bg.wasm
SRC=$(shell find src ../../src -name '*.rs')
${WASM}: ${SRC}
wasm-pack build --release --target web
wasm: ${WASM}
run: ${WASM}
python -m http.server
clean:
rm -rf pkg
cargo clean

View file

@ -0,0 +1,33 @@
<select id="fmt"><option value="preview">preview</option><option value="html">html</option></select>
<div id="jotdown" style="display:flex;">
<script type="module">
import init, { jotdown_render } from './pkg/jotdown_wasm.js';
await init();
let output = document.getElementById("output");
let input = document.getElementById("input");
let fmt = document.getElementById("fmt");
function render() {
let html = jotdown_render(input.innerText);
console.log(fmt.value);
if (fmt.value == "html") {
output.classList.add("verbatim")
output.innerText = html;
} else if (fmt.value == "preview") {
output.classList.remove("verbatim")
output.innerHTML = html;
}
}
render()
input.onkeyup = render;
fmt.onchange = render;
// auto focus on input on load
setTimeout(() => { input.focus(); }, 0);
</script>
<pre id="input" contenteditable="true" placeholder="Input djot here" style="width:50%;height:100%;min-height:8em;max-height:20em;resize:none;margin:0">*Hello world!*</pre>
<pre id="output" readonly style="width:50%;height:100%;margin:0;min-height:8em;max-height:20em"></div></pre>
</div>

View file

@ -0,0 +1,10 @@
use wasm_bindgen::prelude::*;
#[must_use]
#[wasm_bindgen]
pub fn jotdown_render(djot: &str) -> String {
let events = jotdown::Parser::new(djot);
let mut html = String::new();
jotdown::html::push(events, &mut html);
html
}