Add WASM support for executor

* Adds an executor for WASM runtimes based on wasm_bindgen.
* Add time driver based on JS time handling.
* Add example that can run in browser locally.
* Update to critical-section version that supports 'std' flag
This commit is contained in:
Ulf Lilleengen 2021-09-13 14:35:40 +02:00
parent f1c35b40c7
commit e24528051b
18 changed files with 414 additions and 8 deletions

View file

@ -35,7 +35,7 @@ futures = { version = "0.3.17", default-features = false, features = ["async-awa
rtt-target = { version = "0.3.1", features = ["cortex-m"] }
heapless = { version = "0.7.5", default-features = false }
rand_core = "0.6.3"
critical-section = "0.2.1"
critical-section = "0.2.2"
micromath = "2.0.0"

17
examples/wasm/Cargo.toml Normal file
View file

@ -0,0 +1,17 @@
[package]
authors = ["Ulf Lilleengen <lulf@redhat.com>"]
edition = "2018"
name = "embassy-wasm-example"
version = "0.1.0"
[lib]
crate-type = ["cdylib"]
[dependencies]
embassy = { version = "0.1.0", path = "../../embassy", features = ["log", "wasm"] }
wasm-logger = "0.2.0"
wasm-bindgen = "0.2"
web-sys = { version = "0.3", features = ["Document", "Element", "HtmlElement", "Node", "Window" ] }
log = "0.4.11"
critical-section = "0.2.2"

26
examples/wasm/README.md Normal file
View file

@ -0,0 +1,26 @@
# WASM example
Examples use a CLI tool named `wasm-pack` to build this example:
```
cargo install wasm-pack
```
## Building
To build the example, run:
```
wasm-pack build --target web
```
## Running
To run the example, start a webserver server the local folder:
```
python -m http.server
```
Then, open a browser at https://127.0.0.1:8000 and watch the ticker print entries to the window.

25
examples/wasm/index.html Normal file
View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
</head>
<body>
<!-- Note the usage of `type=module` here as this is an ES6 module -->
<script type="module">
// Use ES module import syntax to import functionality from the module
// that we have compiled.
//
// Note that the `default` import is an initialization function which
// will "boot" the module and make it ready to use. Currently browsers
// don't support natively imported WebAssembly as an ES module, but
// eventually the manual initialization won't be required!
import init from './pkg/embassy_wasm_example.js';
await init();
</script>
<h1>Log</h1>
<div>
<ul id="log">
</ul>
</div>
</body>
</html>

37
examples/wasm/src/lib.rs Normal file
View file

@ -0,0 +1,37 @@
#![feature(type_alias_impl_trait)]
#![allow(incomplete_features)]
use embassy::{
executor::Spawner,
time::{Duration, Timer},
};
#[embassy::task]
async fn ticker() {
let window = web_sys::window().expect("no global `window` exists");
let mut counter = 0;
loop {
let document = window.document().expect("should have a document on window");
let list = document
.get_element_by_id("log")
.expect("should have a log element");
let li = document
.create_element("li")
.expect("error creating list item element");
li.set_text_content(Some(&format!("tick {}", counter)));
list.append_child(&li).expect("error appending list item");
log::info!("tick {}", counter);
counter += 1;
Timer::after(Duration::from_secs(1)).await;
}
}
#[embassy::main]
async fn main(spawner: Spawner) {
wasm_logger::init(wasm_logger::Config::default());
spawner.spawn(ticker()).unwrap();
}