mirror of
https://github.com/fluencelabs/wasm-bindgen
synced 2025-06-20 00:11:23 +00:00
Reorganize and rewrite examples
This commit is a large-ish scale reorganization of our examples. The main goal here is to have a dedicated section of the guide for example, and all examples will be listed there. Each example's `README` is now just boilerplate pointing at the guide along with a blurb about how to run it. Some examples like `math` and `smorgasboard` have been deleted as they didn't really serve much purpose, and others like `closures` have been rewritten with `web-sys` instead of hand-bound bindings. Overall it's hoped that this puts us in a good and consistent state for our examples, with all of them being described in the guide, excerpts are in the guide, and they're all relatively idiomatically using `web-sys`.
This commit is contained in:
@ -1,29 +0,0 @@
|
||||
# 2D Canvas
|
||||
|
||||
Drawing a smiley face with the 2D canvas API. This is a port of part of [this
|
||||
MDN
|
||||
tutorial](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes#Moving_the_pen)
|
||||
to `web-sys`.
|
||||
|
||||
[See the full source at
|
||||
`wasm-bindgen/examples/canvas`.](https://github.com/rustwasm/wasm-bindgen/tree/master/examples/canvas)
|
||||
|
||||

|
||||
|
||||
## `Cargo.toml`
|
||||
|
||||
The `Cargo.toml` enables features necessary to query the DOM and work with 2D
|
||||
canvas.
|
||||
|
||||
```toml
|
||||
{{#include ../../../../examples/canvas/Cargo.toml}}
|
||||
```
|
||||
|
||||
## `src/lib.rs`
|
||||
|
||||
Gets the `<canvas>` element, creates a 2D rendering context, and draws the
|
||||
smiley face.
|
||||
|
||||
```rust
|
||||
{{#include ../../../../examples/canvas/src/lib.rs}}
|
||||
```
|
Binary file not shown.
Before Width: | Height: | Size: 3.7 KiB |
@ -1,23 +0,0 @@
|
||||
# The `fetch` API
|
||||
|
||||
This example uses the `fetch` API to make an HTTP request to the GitHub API and
|
||||
then parses the resulting JSON.
|
||||
|
||||
[See the full source at
|
||||
`wasm-bindgen/examples/fetch`.](https://github.com/rustwasm/wasm-bindgen/tree/master/examples/fetch)
|
||||
|
||||
## `Cargo.toml`
|
||||
|
||||
The `Cargo.toml` enables a number of features related to the `fetch` API and
|
||||
types used: `Headers`, `Request`, etc. It also enables `wasm-bindgen`'s `serde`
|
||||
support.
|
||||
|
||||
```toml
|
||||
{{#include ../../../../examples/fetch/Cargo.toml}}
|
||||
```
|
||||
|
||||
## `src/lib.rs`
|
||||
|
||||
```rust
|
||||
{{#include ../../../../examples/fetch/src/lib.rs}}
|
||||
```
|
@ -1,3 +0,0 @@
|
||||
# Examples of using `web-sys`
|
||||
|
||||
This subsection contains examples of using the `web-sys` crate.
|
@ -1,24 +0,0 @@
|
||||
# Paint
|
||||
|
||||
A simple painting program.
|
||||
|
||||
[See the full source at
|
||||
`wasm-bindgen/examples/paint`.](https://github.com/rustwasm/wasm-bindgen/tree/master/examples/paint)
|
||||
|
||||
## `Cargo.toml`
|
||||
|
||||
The `Cargo.toml` enables features necessary to work with the DOM, events and
|
||||
2D canvas.
|
||||
|
||||
```toml
|
||||
{{#include ../../../../examples/paint/Cargo.toml}}
|
||||
```
|
||||
|
||||
## `src/lib.rs`
|
||||
|
||||
Creates the `<canvas>` element, applies a CSS style to it, adds it to the document,
|
||||
get a 2D rendering context and adds listeners for mouse events.
|
||||
|
||||
```rust
|
||||
{{#include ../../../../examples/paint/src/lib.rs}}
|
||||
```
|
@ -1,36 +0,0 @@
|
||||
# WebAudio
|
||||
|
||||
This example creates an [FM
|
||||
oscillator](https://en.wikipedia.org/wiki/Frequency_modulation_synthesis) using
|
||||
the [WebAudio
|
||||
API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API) and
|
||||
`web-sys`.
|
||||
|
||||
[See the full source at
|
||||
`wasm-bindgen/examples/webaudio`.](https://github.com/rustwasm/wasm-bindgen/tree/master/examples/webaudio)
|
||||
|
||||
## `Cargo.toml`
|
||||
|
||||
The `Cargo.toml` enables the types needed to use the relevant bits of the
|
||||
WebAudio API.
|
||||
|
||||
```toml
|
||||
{{#include ../../../../examples/webaudio/Cargo.toml}}
|
||||
```
|
||||
|
||||
## `src/lib.rs`
|
||||
|
||||
The Rust code implements the FM oscillator.
|
||||
|
||||
```rust
|
||||
{{#include ../../../../examples/webaudio/src/lib.rs}}
|
||||
```
|
||||
|
||||
## `index.js`
|
||||
|
||||
A small bit of JavaScript glues the rust module to input widgets and translates
|
||||
events into calls into wasm code.
|
||||
|
||||
```js
|
||||
{{#include ../../../../examples/webaudio/index.js}}
|
||||
```
|
@ -1,25 +0,0 @@
|
||||
# 2D Canvas
|
||||
|
||||
This example draws a triangle to the screen using the WebGL API.
|
||||
|
||||
[See the full source at
|
||||
`wasm-bindgen/examples/webgl`.](https://github.com/rustwasm/wasm-bindgen/tree/master/examples/webgl)
|
||||
|
||||
## `Cargo.toml`
|
||||
|
||||
The `Cargo.toml` enables features necessary to obtain and use a WebGL
|
||||
rendering context.
|
||||
|
||||
```toml
|
||||
{{#include ../../../../examples/webgl/Cargo.toml}}
|
||||
```
|
||||
|
||||
## `src/lib.rs`
|
||||
|
||||
This source file handles all of the necessary logic to obtain a rendering
|
||||
context, compile shaders, fill a buffer with vertex coordinates, and draw a
|
||||
triangle to the screen.
|
||||
|
||||
```rust
|
||||
{{#include ../../../../examples/webgl/src/lib.rs}}
|
||||
```
|
Reference in New Issue
Block a user