Browse Source

Added animation

master
Thomas Johnson 1 year ago
parent
commit
8a3362112f
  1. 2
      .gitignore
  2. 3
      index.html
  3. 52
      index.js
  4. 41
      src/lib.rs

2
.gitignore

@ -1,2 +1,4 @@
/target
Cargo.lock
wt.wasm
wtrelease.wasm

3
index.html

@ -1,8 +1,9 @@
<meta charset='UTF-8'>
<html>
<head>
<script defer src="index.js"></script>
</head>
<body id="body">
<canvas id="canvas" height=1000 width=1500></canvas>
<canvas id="canvas" height=500 width=500></canvas>
</body>
</html>

52
index.js

@ -7,14 +7,41 @@ function get_string(memory, pointer, size)
return (new TextDecoder()).decode(array);
}
function paint(memory, pointer, width, height)
{
array = new Uint8ClampedArray(memory.buffer, pointer, 4 * width * height);
data = new ImageData(array, width, height);
ctx.putImageData(data, 0, 0);
var data;
function init_buffer(memory, pointer, width, height)
{
var array = new Uint8ClampedArray(memory.buffer, pointer, 4 * width * height);
data = new ImageData(array, width, height);
}
function paint()
{
ctx.putImageData(data, 0, 0);
}
}
{
var cb, rqn;
function anim(callback)
{
cb = callback;
rqn = window.requestAnimationFrame(anim_loop);
}
function stop_anim()
{
window.cancelAnimationFrame(rqn);
}
function anim_loop(ts)
{
rqn = window.requestAnimationFrame(anim_loop);
cb(ts);
}
}
fetch("wt.wasm").then(response => response.arrayBuffer()).then(bytes =>
fetch("wtrelease.wasm").then(response => response.arrayBuffer()).then(bytes =>
{
var memory;
WebAssembly.instantiate(bytes, { env:
@ -23,15 +50,22 @@ fetch("wt.wasm").then(response => response.arrayBuffer()).then(bytes =>
{
console.log(get_string(memory, str, len));
},
extern_init_buffer: function(pointer, width, height)
{
init_buffer(memory, pointer, width, height);
},
extern_paint: function(pointer, width, height)
{
paint(memory, pointer, width, height);
}
paint();
},
} }).then(mod =>
{
memory = mod.instance.exports.memory;
mod.instance.exports.entrypoint();
mod.instance.exports.paint_red(canvas.width, canvas.height);
//mod.instance.exports.entrypoint();
anim(function(ts)
{
mod.instance.exports.paint_red(canvas.width, canvas.height, ts);
});
}
)
});

41
src/lib.rs

@ -11,7 +11,9 @@ extern "C"
#[no_mangle]
fn console_log(_: *const u8, _: usize);
#[no_mangle]
fn extern_paint(ptr: *const u8, w: usize, h: usize);
fn extern_init_buffer(ptr: *const u8, w: usize, h: usize);
#[no_mangle]
fn extern_paint();
}
fn log(string: &str)
@ -23,9 +25,14 @@ fn log(string: &str)
}
}
fn paint(buffer: &[u8], w: usize, h: usize)
fn init_buffer(buffer: &[u8], w: usize, h: usize)
{
unsafe { extern_init_buffer(buffer.as_ptr(), w, h); }
}
fn paint()
{
unsafe { extern_paint(buffer.as_ptr(), w, h); }
unsafe { extern_paint(); }
}
#[no_mangle]
@ -35,18 +42,32 @@ pub extern "C" fn entrypoint()
}
#[no_mangle]
pub extern "C" fn paint_red(w: usize, h: usize)
pub extern "C" fn paint_red(w: usize, h: usize, ts: f64)
{
fn smooth_convert(v: f64, step: f64) -> u8
{
if 256.0 - v < step
{
return ((256.0 - v) / step * 255.0) as u8;
} else
{
return (v * 255.0 / (256.0 - step)) as u8;
}
}
let t = (ts / 50.0).rem_euclid(256.0);
let mut buffer = vec![0; 4 * w * h];
let mut c: (u8, u8, u8) = (0, 0, 0);
init_buffer(&buffer, w, h);
let mut c: (f64, f64, f64) = (t, t, t);
let step = (1.0, 254.0, 2.0);
for ii in 0 .. w * h
{
buffer[4 * ii] = c.0;
buffer[4 * ii + 1] = c.1;
buffer[4 * ii + 2] = c.2;
buffer[4 * ii] = smooth_convert(c.0, step.0);
buffer[4 * ii + 1] = smooth_convert(c.1, step.1);
buffer[4 * ii + 2] = smooth_convert(c.2, step.2);
buffer[4 * ii + 3] = 255;
c = (c.0.wrapping_add(1), c.1.wrapping_add(254), c.2.wrapping_add(2));
c = (c.0 + step.0, c.1 + step.1, c.2 + step.2);
c = (c.0.rem_euclid(256.0), c.1.rem_euclid(256.0), c.2.rem_euclid(256.0));
}
paint(&buffer, w, h);
paint();
}
Loading…
Cancel
Save