yeet demo and yakui-app crate

.gitignore

@@ -5,4 +5,7 @@
 **/*.snap.new
 
 ## IDE specific files
-/vscode
+/vscode
+
+# Trunk build output
+/dist

README.md

@@ -95,6 +95,8 @@ Example setup code for yakui is available in [`crates/bootstrap`](crates/bootstr
 
 You can run examples with `cargo run --example <example name>`. Check out [`crates/yakui/examples`](crates/yakui/examples) to get a list of available examples.
 
+You can also run examples on the web with [Trunk](https://github.com/trunk-rs/trunk): `trunk serve --example <example name>`.
+
 Many of the examples look like this:
 
 ```rust
@@ -203,13 +205,6 @@ The `yakui-vulkan` crate is a yakui renderer that uses Vulkan via [ash]
 [`yakui-vulkan`]: https://crates.io/crates/yakui-vulkan
 [ash]: https://crates.io/crates/ash
 
-### [`yakui-app`]
-The `yakui-app` crate is a wrapper around `yakui-winit` and `yakui-wgpu` intended to make getting started with yakui easier.
-
-If you are writing your own integration for yakui, this crate is a good learning resource to reference.
-
-[`yakui-app`]: https://crates.io/crates/yakui-app
-
 ## Games Using yakui
 There are a handful of games already using yakui for their UI. Here are a couple:
 

Trunk.json

@@ -0,0 +1,5 @@
+{
+    "build": {
+        "target": "./crates/yakui/index.html"
+    }
+}

crates/bootstrap/Cargo.toml

@@ -11,7 +11,6 @@ profile = ["profiling/profile-with-tracy", "tracy-client"]
 yakui = { path = "../yakui" }
 yakui-wgpu = { path = "../yakui-wgpu" }
 yakui-winit = { path = "../yakui-winit" }
-yakui-sdl3 = { path = "../yakui-sdl3" }
 
 env_logger.workspace = true
 log.workspace = true
@@ -21,11 +20,24 @@ anyhow.workspace = true
 
 wgpu.workspace = true
 
-sdl3 = { workspace = true, features = [
-    "build-from-source",
-    "raw-window-handle",
-] }
 winit = { workspace = true, default-features = true }
 
 profiling.workspace = true
 tracy-client = { workspace = true, optional = true }
+
+[target.'cfg(target_arch = "wasm32")'.dependencies]
+wgpu = { workspace = true, features = ["webgl"] }
+console_log = "1.0.0"
+console_error_panic_hook = "0.1.7"
+wasm-bindgen = "0.2.118"
+wasm-bindgen-futures = "0.4.68"
+web-sys = "0.3.95"
+web-time = "1.1.0"
+
+[target.'cfg(not(target_arch = "wasm32"))'.dependencies]
+yakui-sdl3 = { path = "../yakui-sdl3" }
+
+sdl3 = { workspace = true, features = [
+    "build-from-source",
+    "raw-window-handle",
+] }

crates/bootstrap/src/common.rs

@@ -70,12 +70,20 @@ pub fn load_texture(bytes: &[u8], filter: TextureFilter) -> Texture {
 /// Initialize our logging, adjusting the default log levels of some of our
 /// noisier dependencies.
 pub fn init_logging() {
-    env_logger::builder()
-        .filter_module("wgpu_hal::auxil::dxgi", log::LevelFilter::Off)
-        .filter_module("wgpu_core", log::LevelFilter::Warn)
-        .filter_module("wgpu_hal", log::LevelFilter::Warn)
-        .filter_level(log::LevelFilter::Info)
-        .init();
+    #[cfg(not(target_arch = "wasm32"))]
+    {
+        env_logger::builder()
+            .filter_module("wgpu_hal::auxil::dxgi", log::LevelFilter::Off)
+            .filter_module("wgpu_core", log::LevelFilter::Warn)
+            .filter_module("wgpu_hal", log::LevelFilter::Warn)
+            .filter_level(log::LevelFilter::Info)
+            .init();
+    }
+    #[cfg(target_arch = "wasm32")]
+    {
+        std::panic::set_hook(Box::new(console_error_panic_hook::hook));
+        console_log::init().expect("could not initialize logger");
+    }
 }
 
 /// Enables the user to override the scaling of the demo app by setting an

crates/bootstrap/src/lib.rs

@@ -2,6 +2,7 @@ mod common;
 mod custom_texture;
 mod graphics;
 mod multisampling;
+#[cfg(not(target_arch = "wasm32"))]
 mod with_sdl3;
 mod with_winit;
 
@@ -76,7 +77,11 @@ fn run(body: impl ExampleBody) {
         }
 
         BootstrapBackend::Sdl3 => {
+            #[cfg(not(target_arch = "wasm32"))]
             crate::with_sdl3::run(yak, state, title, body);
+
+            #[cfg(target_arch = "wasm32")]
+            panic!("SDL3 backend is not supported on wasm target!")
         }
     }
 }

crates/bootstrap/src/with_winit.rs

@@ -1,4 +1,7 @@
+#[cfg(not(target_arch = "wasm32"))]
 use std::time::Instant;
+#[cfg(target_arch = "wasm32")]
+use web_time::Instant;
 
 use winit::{
     application::ApplicationHandler,
@@ -56,6 +59,21 @@ impl<T: ExampleBody> ApplicationHandler for App<T> {
         let window = event_loop.create_window(self.attributes.clone()).unwrap();
         window.set_ime_allowed(true);
 
+        #[cfg(target_arch = "wasm32")]
+        {
+            use winit::platform::web::WindowExtWebSys;
+
+            // On wasm, append the canvas to the document body
+            web_sys::window()
+                .and_then(|win| win.document())
+                .and_then(|doc| doc.body())
+                .and_then(|body| {
+                    body.append_child(&web_sys::Element::from(window.canvas().unwrap()))
+                        .ok()
+                })
+                .expect("couldn't append canvas to document body");
+        }
+
         let size = window.inner_size();
         let size = UVec2::new(size.width, size.height);
         let sample_count = get_sample_count();