forked from worldmaking/node-gles3
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathexample-rotatingQuad.js
143 lines (110 loc) · 3.57 KB
/
example-rotatingQuad.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
const assert = require("assert")
const { vec2, vec3, vec4, quat, mat2, mat2d, mat3, mat4} = require("gl-matrix")
const gl = require('./gles3.js')
const glfw = require('./glfw3.js')
const glutils = require('./glutils.js');
const Window = require('./window.js');
let win = new Window()
let shape_program = glutils.makeProgram(gl,
`#version 330
uniform mat4 u_modelmatrix;
uniform mat4 u_viewmatrix;
uniform mat4 u_projmatrix;
in vec3 a_position;
in vec3 a_normal;
in vec2 a_texCoord;
out vec4 v_color;
void main() {
// Multiply the position by the matrix.
vec3 vertex = a_position.xyz;
gl_Position = u_projmatrix * u_viewmatrix * u_modelmatrix * vec4(vertex, 1);
v_color = vec4(a_normal*0.25+0.25, 1.);
v_color += vec4(a_texCoord*0.5, 0., 1.);
// if using gl.POINTS:
gl_PointSize = 10.;
}
`,
`#version 330
precision mediump float;
in vec4 v_color;
out vec4 outColor;
void main() {
outColor = v_color;
}
`);
let shape_geom = glutils.makeQuad({
min: [0,-1,-1],
max: [1, 2, 2],
div: [1, 3, 3]
})
let shape_vao = glutils.createVao(gl, shape_geom, shape_program.id);
// let t = glfw.getTime();
// let fps = 60;
// // function animate() {
// // if(glfw.windowShouldClose(window) || glfw.getKey(window, glfw.KEY_ESCAPE)) {
// // shutdown();
// // } else {
// // setImmediate(animate)
// // }
// // let t1 = glfw.getTime();
// // let dt = t1-t;
// // fps += 0.1*((1/dt)-fps);
// // t = t1;
// // glfw.setWindowTitle(window, `fps ${fps}`);
// // // Get window size (may be different than the requested size)
// // let dim = glfw.getFramebufferSize(window);
// // // Compute the matrix
// // let viewmatrix = mat4.create();
// // let projmatrix = mat4.create();
// // let modelmatrix = mat4.create();
// // mat4.lookAt(viewmatrix, [0, 0, 3], [0, 0, 0], [0, 1, 0]);
// // mat4.perspective(projmatrix, Math.PI/2, dim[0]/dim[1], 0.01, 30);
// // //mat4.identity(modelmatrix);
// // let axis = vec3.fromValues(Math.sin(t), 1., 0.);
// // vec3.normalize(axis, axis);
// // mat4.rotate(modelmatrix, modelmatrix, t, axis)
// // gl.viewport(0, 0, dim[0], dim[1]);
// // gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
// // gl.enable(gl.DEPTH_TEST)
// // shape_program.begin();
// // shape_program.uniform("u_modelmatrix", modelmatrix);
// // shape_program.uniform("u_viewmatrix", viewmatrix);
// // shape_program.uniform("u_projmatrix", projmatrix);
// // //shape_.bind().drawPoints().unbind();
// // shape_.bind().draw().unbind();
// // shape_program.end();
// // // Swap buffers
// // glfw.swapBuffers(window);
// // glfw.pollEvents();
// // }
// // function shutdown() {
// // // Close OpenGL window and terminate GLFW
// // glfw.destroyWindow(window);
// // glfw.terminate();
// // process.exit(0);
// // }
// // animate();
win.draw = function() {
let { t, dim } = this;
let f = 0
gl.clearColor(f, 1-f, 0, 1);
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
// Compute the matrix
let viewmatrix = mat4.create();
let projmatrix = mat4.create();
let modelmatrix = mat4.create();
mat4.lookAt(viewmatrix, [0, 0, 3], [0, 0, 0], [0, 1, 0]);
mat4.perspective(projmatrix, Math.PI/2, dim[0]/dim[1], 0.01, 30);
//mat4.identity(modelmatrix);
let axis = vec3.fromValues(Math.sin(t), 1., 0.);
vec3.normalize(axis, axis);
mat4.rotate(modelmatrix, modelmatrix, t, axis)
shape_program.begin();
shape_program.uniform("u_modelmatrix", modelmatrix);
shape_program.uniform("u_viewmatrix", viewmatrix);
shape_program.uniform("u_projmatrix", projmatrix);
//shape_vao.bind().drawPoints().unbind();
shape_vao.bind().draw().unbind();
shape_program.end();
}
Window.animate()