Initial WASM implementation (#29)

Co-authored-by: Moon D. <moon@softmoon.world>

Author: tychedelia

Cargo.lock

@@ -37,3 +37,13 @@ glfw = { version = "0.60.0", features = ["wayland"] }
 [[example]]
 name = "rectangle"
 path = "examples/rectangle.rs"
+
+[[example]]
+name = "background_image"
+path = "examples/background_image.rs"
+
+[profile.wasm-release]
+inherits = "release"
+opt-level = "z"
+lto = "fat"
+codegen-units = 1

Cargo.toml

@@ -8,6 +8,43 @@ libprocessing is an experimental native library with the goal of supporting the
 
 You'll need to install the Rust toolchain to work on this project. Most users will want to install Rust via [`rustup`](https://rustup.rs/), which helps manage Rust toolchain versions.
 
+### Build commands
+
+This project uses [just](https://github.com/casey/just) as a command runner. Run `just` to see available commands.
+
+## Building for web
+
+The `processing_wasm` crate provides WebAssembly bindings that expose a JavaScript API mirroring the C FFI.
+
+### Requirements
+
+Install [wasm-pack](https://rustwasm.github.io/wasm-pack/):
+
+```bash
+cargo install wasm-pack
+```
+
+You'll also need the wasm32 target:
+
+```bash
+rustup target add wasm32-unknown-unknown
+```
+
+### Build
+
+```bash
+just wasm-build
+```
+
+This outputs the package to `target/wasm/`.
+
+### Run the example
+
+```bash
+just wasm-serve
+```
+
+
 ## Contributing
 
 We want your help building this library! You can see a list of outstanding tasks in our [issues](https://github.com/processing/libprocessing). However, while we're still in the early phases, consider checking in with us first in the `#devs-chat` channel on [Discord](https://discord.gg/h99u95nU7q) to coordinate our efforts.

README.md

@@ -21,4 +21,10 @@ objc2 = { version = "0.6", default-features = false }
 objc2-app-kit = { version = "0.3", features = ["NSWindow", "NSView"] }
 
 [target.'cfg(target_os = "windows")'.dependencies]
-windows = { version = "0.58", features = ["Win32_Foundation", "Win32_System_LibraryLoader"] }
+windows = { version = "0.58", features = ["Win32_Foundation", "Win32_System_LibraryLoader"] }
+
+[target.'cfg(target_arch = "wasm32")'.dependencies]
+wasm-bindgen = "0.2"
+wasm-bindgen-futures = "0.4"
+js-sys = "0.3"
+web-sys = { version = "0.3", features = ["Window", "Document", "HtmlCanvasElement"] }

crates/processing_render/Cargo.toml

@@ -107,6 +107,57 @@ pub fn create(
         .expect("Failed to run new PImage system")
 }
 
+pub fn load_start(world: &mut World, path: PathBuf) -> Handle<Image> {
+    world.get_asset_server().load(path)
+}
+
+pub fn is_loaded(world: &World, handle: &Handle<Image>) -> bool {
+    matches!(
+        world.get_asset_server().load_state(handle),
+        LoadState::Loaded
+    )
+}
+
+#[cfg(target_arch = "wasm32")]
+pub fn from_handle(world: &mut World, handle: Handle<Image>) -> Result<Entity> {
+    fn from_handle_inner(In(handle): In<Handle<Image>>, world: &mut World) -> Result<Entity> {
+        let images = world.resource::<Assets<Image>>();
+        let image = images.get(&handle).ok_or(ProcessingError::ImageNotFound)?;
+
+        let size = image.texture_descriptor.size;
+        let texture_format = image.texture_descriptor.format;
+        let pixel_size = match texture_format {
+            TextureFormat::Rgba8Unorm | TextureFormat::Rgba8UnormSrgb => 4usize,
+            TextureFormat::Rgba16Float => 8,
+            TextureFormat::Rgba32Float => 16,
+            _ => panic!("Unsupported texture format for readback"),
+        };
+        let readback_buffer_size = size.width * size.height * pixel_size as u32;
+
+        let render_device = world.resource::<RenderDevice>();
+        let readback_buffer = render_device.create_buffer(&BufferDescriptor {
+            label: Some("PImage Readback Buffer"),
+            size: readback_buffer_size as u64,
+            usage: BufferUsages::COPY_DST | BufferUsages::MAP_READ,
+            mapped_at_creation: false,
+        });
+
+        Ok(world
+            .spawn(PImage {
+                handle: handle.clone(),
+                readback_buffer,
+                pixel_size,
+                texture_format,
+                size,
+            })
+            .id())
+    }
+
+    world
+        .run_system_cached_with(from_handle_inner, handle)
+        .expect("Failed to run from_handle system")
+}
+
 pub fn load(world: &mut World, path: PathBuf) -> Result<Entity> {
     fn load_inner(In(path): In<PathBuf>, world: &mut World) -> Result<Entity> {
         let handle = world.get_asset_server().load(path);