glen/dyna3
1
0
Fork 0
Code Issues 11 Pull Requests 1 Actions Projects Releases 2 Wiki Activity

Add rotation control

Browse Source 
In the process, find and correct an error in the --+ vertex, which was
miswritten as ---.
This commit is contained in:
Aaron Fenyes 2024-08-22 00:04:58 -07:00
parent 80b210e667
commit 1fbeb23194
1 changed files with 32 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
app-proto/inversive-display/src/main.rs
View File

@ -8,7 +8,7 @@
//
extern crate js_sys;
/* use std::f64::consts::PI as PI; */
use std::f64::consts::PI as PI;
use sycamore::{prelude::*, rt::{JsCast, JsValue}};
use web_sys::{console, WebGl2RenderingContext, WebGlShader};
@ -71,6 +71,7 @@ fn main() {
console_error_panic_hook::set_once();
sycamore::render(|| {
let turn = create_signal(0.0);
let tip = create_signal(0.0);
let display = create_node_ref();
@ -98,9 +99,11 @@ fn main() {
out vec4 vertexColor;
uniform mat4 world_to_clip;
uniform mat3 rotation;
void main() {
gl_Position = world_to_clip * vec4(position, 1.);
vec3 world_pos = rotation * position - vec3(0., 0., 6.);
gl_Position = world_to_clip * vec4(world_pos, 1.);
vertexColor = vec4(color, 1.);
}
"##,
@ -141,6 +144,7 @@ fn main() {
let position_index = ctx.get_attrib_location(&program, "position") as u32;
let color_index = ctx.get_attrib_location(&program, "color") as u32;
let world_to_clip_loc = ctx.get_uniform_location(&program, "world_to_clip");
let rotation_loc = ctx.get_uniform_location(&program, "rotation");
// create a vertex array and bind it to the graphics context
let vertex_array = ctx.create_vertex_array().unwrap();
@ -167,17 +171,17 @@ fn main() {
let tip_shift = 4.0/3.0 * tip.get() as f32;
let positions: [f32; 3*VERTEX_CNT] = [
// triangle 1
1.0 - tip_shift, 1.0 - tip_shift, -5.0 - tip_shift,
1.0, -1.0, -7.0,
-1.0, 1.0, -7.0,
1.0 - tip_shift, 1.0 - tip_shift, 1.0 - tip_shift,
1.0, -1.0, -1.0,
-1.0, 1.0, -1.0,
// triangle 2
1.0 - tip_shift, 1.0 - tip_shift, -5.0 - tip_shift,
-1.0, 1.0, -7.0,
-1.0, -1.0, -7.0,
1.0 - tip_shift, 1.0 - tip_shift, 1.0 - tip_shift,
-1.0, 1.0, -1.0,
-1.0, -1.0, 1.0,
// triangle 3
1.0 - tip_shift, 1.0 - tip_shift, -5.0 - tip_shift,
-1.0, -1.0, -7.0,
1.0, -1.0, -7.0
1.0 - tip_shift, 1.0 - tip_shift, 1.0 - tip_shift,
-1.0, -1.0, 1.0,
1.0, -1.0, -1.0
];
bind_vertex_attrib(&ctx, position_index, 3, &positions);
@ -198,6 +202,17 @@ fn main() {
];
bind_vertex_attrib(&ctx, color_index, 3, &colors);
// set the rotation
let angle_val = (2.0*PI*turn.get()) as f32;
let angle_cos = angle_val.cos();
let angle_sin = angle_val.sin();
let rotation: [f32; 9] = [
angle_cos, 0.0, angle_sin,
0.0, 1.0, 0.0,
-angle_sin, 0.0, angle_cos,
];
ctx.uniform_matrix3fv_with_f32_array(rotation_loc.as_ref(), false, &rotation);
// clear the screen and draw the scene
ctx.clear_color(0.0, 0.0, 0.0, 1.0);
ctx.clear(WebGl2RenderingContext::COLOR_BUFFER_BIT);
@ -208,6 +223,12 @@ fn main() {
view! {
div(id="app") {
canvas(ref=display, width="600", height="600")
input(
type="range",
max=1.0,
step=0.01,
bind:valueAsNumber=turn
)
input(
type="range",
max=1.0,