From 681139064e92caf224e3884e2cbeb7ffff65b980 Mon Sep 17 00:00:00 2001 From: Jean-Marie Mineau Date: Fri, 14 Jan 2022 22:34:58 +0100 Subject: [PATCH] first canvas drawing --- .gitignore | 2 ++ Cargo.toml | 22 ++++++++++++++++++++++ README.md | 11 +++++++++++ index.html | 18 ++++++++++++++++++ src/lib.rs | 38 ++++++++++++++++++++++++++++++++++++++ 5 files changed, 91 insertions(+) create mode 100644 .gitignore create mode 100644 Cargo.toml create mode 100644 README.md create mode 100644 index.html create mode 100644 src/lib.rs diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..96ef6c0 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +/target +Cargo.lock diff --git a/Cargo.toml b/Cargo.toml new file mode 100644 index 0000000..67e52c0 --- /dev/null +++ b/Cargo.toml @@ -0,0 +1,22 @@ +[package] +name = "circle_canvas" +version = "0.1.0" +authors = ["Histausse"] +edition = "2021" + +[lib] +crate-type = ["cdylib"] + +[dependencies] +js-sys = "0.3.55" +wasm-bindgen = "0.2.78" + +[dependencies.web-sys] +version = "0.3.4" +features = [ + 'CanvasRenderingContext2d', + 'Document', + 'Element', + 'HtmlCanvasElement', + 'Window', +] diff --git a/README.md b/README.md new file mode 100644 index 0000000..f53c7dd --- /dev/null +++ b/README.md @@ -0,0 +1,11 @@ +# Build: + +``` +wasm-pack build --target web +``` + +# Run: + +``` +python3 -m http.server +``` diff --git a/index.html b/index.html new file mode 100644 index 0000000..e85dcee --- /dev/null +++ b/index.html @@ -0,0 +1,18 @@ + + + + + + + + + + diff --git a/src/lib.rs b/src/lib.rs new file mode 100644 index 0000000..7252919 --- /dev/null +++ b/src/lib.rs @@ -0,0 +1,38 @@ +use std::f64; +use wasm_bindgen::prelude::*; +use wasm_bindgen::JsCast; + +#[wasm_bindgen(start)] +pub fn start() { + let document = web_sys::window().unwrap().document().unwrap(); + let canvas = document.get_element_by_id("canvas").unwrap(); + let canvas: web_sys::HtmlCanvasElement = canvas + .dyn_into::() + .map_err(|_| ()) + .unwrap(); + + let context = canvas + .get_context("2d") + .unwrap() + .unwrap() + .dyn_into::() + .unwrap(); + + context.begin_path(); + + context + .arc(75.0, 75.0, 50.0, 0.0, f64::consts::PI * 2.0) + .unwrap(); + + context.move_to(110.0, 75.0); + context + .arc(75.0, 75.0, 35.0, 0.0, f64::consts::PI) + .unwrap(); + + context.move_to(65.0, 65.0); + context + .arc(60.0, 65.0, 5.0, 0.0, f64::consts::PI * 2.0) + .unwrap(); + + context.stroke(); +}