webru 0.3.0

Frequently used javascript functions for Rust and WebAssembly
Documentation

Webru

Frequently used javascript functions for Rust and WebAssembly

webru is a binding for web-sys

This crate assumes that you will only use this crate inside browser. Not any other javascript runtime such as Node.js

Example


use wasm_bindgen::closure::Closure;
use wasm_bindgen::JsCast;
use web_sys::{Element, HtmlElement};
use weblog::console_log;
use webru::{alert, body, callback, create_element, get_element_by_id, reload, set_timeout};

// javascript `Window.alert()` method
alert("You are in danger!");

// getting the <body> tag/element
let body: HtmlElement = body();

// creating a <h1> tag using javascript `document.createElement()` method
// This function will return the newly created element/tag
let h1: Element = create_element("h1");

// adding some attributes to <h1> tag
h1.set_id("heading-1"); // html `id` property
h1.set_class_name("heading"); // html `class` property`
h1.set_inner_html("Welcome to my website");

// pushing the <h1> tag into the DOM
body.append_child(&h1);

// This closure will be called the <button> will be clicked
let cb: Closure<dyn Fn()> = callback(|| {
    // javascript `console.log()` method
    console_log!("You clicked the button");
});

// creating a <button> element
let button: HtmlElement = create_element("button")
    .dyn_ref::<HtmlElement>()
    .unwrap()
    .clone();

// adding some attributes to <button> tag
button.set_inner_html("Click me"); // innerHTML property
button.set_onclick(Some(cb.as_ref().dyn_ref().unwrap())); // onclick event

cb.forget();

// pushing the <button> tag into the DOM
body.append_child(&button);

// javascript `setTimeout()` method
set_timeout(
    || {
        // javascript `console.log()` method
        console_log!("Time has completed");

        // reload the page
        // javascript `location.reload()` method
        reload();
    },
    10000, // 10 seconds
);

// getting the <h1> element from the DOM
// javascript `document.getElementById()` method
let h1_from_dom: Option<Element> = get_element_by_id("heading-1");

assert_eq!(h1_from_dom.unwrap(), h1);

Warning

This project is not well tested. So make sure to test every functions from this crate you used in your project before going to production.

Contributions

Your valuable PRs and Issues are welcome. Note that all the contribution submitted by you, shall be licensed as MIT or APACHE 2.0 at your choice, without any additional terms or conditions.