egui/example_wasm/src/lib.rs

#![deny(warnings)]
#![warn(clippy::all)]

use egui::{label, widgets::Separator, Align, TextStyle, *};

use wasm_bindgen::prelude::*;

// ----------------------------------------------------------------------------

/// This is the entry-point for all the web-assembly.
#[wasm_bindgen]
pub fn start(canvas_id: &str) -> Result<(), JsValue> {
    let app = Box::new(MyApp::default());
    let runner = egui_web::AppRunner::new(canvas_id, app)?;
    egui_web::run(runner)?;
    Ok(())
}

// ----------------------------------------------------------------------------

#[derive(Default)]
pub struct MyApp {
    example_app: egui::examples::ExampleApp,
}

impl egui_web::App for MyApp {
    fn ui(&mut self, ui: &mut egui::Ui, info: &egui_web::BackendInfo) {
        self.example_app.ui(ui, &info.web_location_hash);

        let mut ui = ui.centered_column(ui.available().width().min(480.0));
        ui.set_layout(Layout::vertical(Align::Min));
        ui.add(label!("Egui!").text_style(TextStyle::Heading));
        ui.label("Egui is an immediate mode GUI written in Rust, compiled to WebAssembly, rendered with WebGL.");
        ui.label(
            "Everything you see is rendered as textured triangles. There is no DOM. There are no HTML elements."
        );
        ui.label("This is not JavaScript. This is Rust, running at 60 FPS. This is the web page, reinvented with game tech.");
        ui.label("This is also work in progress, and not ready for production... yet :)");
        ui.horizontal(|ui| {
            ui.label("Project home page:");
            ui.hyperlink("https://github.com/emilk/emigui/");
        });
        ui.add(Separator::new());

        ui.label("WebGl painter info:");
        ui.indent("webgl region id", |ui| {
            ui.label(&info.painter_debug_info);
        });

        ui.add(
            label!(
                "CPU usage: {:.2} ms (excludes painting)",
                1e3 * info.cpu_time
            )
            .text_style(TextStyle::Monospace),
        );
        ui.add(label!("FPS: {:.1}", info.fps).text_style(TextStyle::Monospace));
    }
}