Wein2D.js bindings for creating browser games in Rust using WebAssembly.
Wein2D.js-WASM requires Wein2d.js to be loaded in the same document.
This is a simple Example for a program (rust):
mod wein2d_js;
use wein2d_js::*;
use wasm_bindgen::prelude::*;
// code for statically storing a GameState-struct
static mut STATIC_GAME_STATE: Option<GameState> = None;
fn set_game_state(game_state: GameState) { unsafe { STATIC_GAME_STATE = Some(game_state); } }
fn get_game_state_mut() -> &'static mut GameState { unsafe {
match STATIC_GAME_STATE {
Some(ref mut game_state) => { game_state }
None => { panic!("Static Game State not defined.") }
}
}}
struct GameState {
height: f32,
velocity: f32,
}
// on_start and on_frame functions
#[wasm_bindgen]
pub fn on_start() { // gets called directly after initialization
set_game_state(GameState {
height: 0.0,
velocity: 0.0,
});
}
// cube values (feel free to play with these!)
static CUBE_SIZE: f32 = 25.0; // the width and height of the cube
static CUBE_JUMP_VELOCITY: f32 = 400.0; // the cube's jump velocity (in pixels per second)
static CUBE_GRAVITATION: f32 = 800.0; // gravitation (how much velocity gets removed per second)
static CUBE_BOUNCEBACK_MULTIPLIER: f32 = 0.4; // how much velocity the cube keeps after hitting the ground
#[wasm_bindgen]
pub fn on_frame() { // gets called once per frame
// get game state
let mut game_state: &mut GameState = get_game_state_mut();
// update calls //////////////////////////////////////////////////
// if space bar or left mouse button pressed, set the cubes velocity (let the cube jump up)
if get_key(Key::SPACE) || get_mouse_l() { game_state.velocity = CUBE_JUMP_VELOCITY; }
// move the cube up and down according to it's velocity
game_state.height += game_state.velocity * get_delta_time();
// if the cube is not on the ground remove some of the cube's velocity (gravitation)
if game_state.height > 0.0 { game_state.velocity -= CUBE_GRAVITATION * get_delta_time() }
// if the cube is below or on the ground, set him onto the ground, invert the cube's velocity (movement) and remove some of it's velocity
if game_state.height <= 0.0 {
game_state.velocity = -game_state.velocity * CUBE_BOUNCEBACK_MULTIPLIER;
game_state.height = 0.0;
}
// render calls //////////////////////////////////////////////////
// fill the screen with blue
fill(11, 138, 143, 255);
// draw the cube
draw_rectangle()
.set_position((get_width() - CUBE_SIZE) / 2.0, get_height() - CUBE_SIZE - game_state.height)// draw at the center of the screen and cube's height
.set_size(CUBE_SIZE, CUBE_SIZE) // draw the cube with it's width and height
.set_color(255, 255, 255, 255) // draw in white
.rotate_degrees(game_state.height) // rotate it by its height in degrees (why? because it looks cool)
.draw(); // draw it
}
Include the build in a webpage like this:
<!DOCTYPE html>
<html>
<head>
<style>
* { margin: 0px; overflow: hidden; }
canvas { width: 100vw; height: 100vh; }
</style>
<script src="wein2d.js"></script> <!-- include Wein2D.js (or a minified version) -->
<script src="wein2d-wasm.js"></script> <!-- include Wein2D.js-WASM (or a minified version) -->
<script>
window.onload = function()
{
wein2dWASM_init(
document.getElementById("canvas"), // target element with ID "canvas"
"/pkg/Wein2D_js_wasm.js" // wasm-bindgen generated js file when building using "wasm-pack build --target web"
);
}
</script>
</head>
<body>
<canvas id="canvas"></canvas> <!-- normal canvas element -->
</body>
</html>
Documentation for Wein2D.js-WASM can be found at https://wein2ddocs.netlify.app.