Camera

In this exercise we will play with the camera in real time.

Serve the web server and navigate to http://localhost:8000/exercises/camera/.

You will edit lib.rs as usual.

Here is the basic code you will need:

extern crate console_error_panic_hook;

use js_sys::Uint8ClampedArray;
use wasm_bindgen::prelude::*;

#[wasm_bindgen]
extern "C" {
    fn alert(s: &str);

    #[wasm_bindgen(js_namespace = console)]
    pub fn log(s: &str);
}

#[wasm_bindgen]
pub fn setup() {
    console_error_panic_hook::set_once();
}

#[wasm_bindgen]
pub fn edit_bitmap(image_data: &Uint8ClampedArray, width: u32, height: u32) {
}

We want to edit the function edit_bitmap. image_data is a reference to the Uint8ClampedArray being rendered on your screen. Uint8ClampedArray is a flat array of unsigned int of 8 bits. It represents srgb image, which means that each pixel is represented as a vector of 4 elements [red, green, blue, illumination]. The image can be thought of as a matrix of dimension (width, height, 4), it is row-major.

We will reuse our different implementations. So do not erase them when going from one exercise to the next.

First off let's implement some methods that modify the video live:

Paint the top half the image to black.
Paint the left half of the image to white.
Create an X-ray effect. This is done by mapping colors to their opposite, for instance 0<->255, 100<->155. Beware of illumination.
Bonus question: Now feel free to implement other transformations such as greyscale or adding random noise.
Let's now add functionalities to our page. In the setup function create a dropdown (<select>) that will change which transformation to apply to the image.
Bonus question: Track moving objects. This can be done by figuring out only the pixels that didn't change between multiple frames. For instance, you could compute the standard deviation of the pixel and black out below a threshold. While this can be achieved without touching Javascript, I recommend editing it.

2.2 KiB Raw Blame History

Camera

2.2 KiB

Raw Blame History