86 lines
2.1 KiB
JavaScript
86 lines
2.1 KiB
JavaScript
"use strict";
|
|
(() => {
|
|
const initShaderProgram = (gl) => {
|
|
const vShaderSrc = `
|
|
attribute vec3 position;
|
|
|
|
uniform mat4 viewMatrix;
|
|
|
|
void main() {
|
|
gl_Position = viewMatrix * vec4(position, 1);
|
|
}
|
|
`;
|
|
|
|
const fShaderSrc = `
|
|
void main() {
|
|
gl_FragColor = vec4(0.5, 0.5, 0, 1);
|
|
}
|
|
`;
|
|
|
|
const compileShader = (src, type) => {
|
|
let shader = gl.createShader(type);
|
|
gl.shaderSource(shader, src);
|
|
gl.compileShader(shader);
|
|
let success = gl.getShaderParameter(shader, gl.COMPILE_STATUS);
|
|
if (!success) {
|
|
throw gl.getShaderInfoLog(vShader);
|
|
}
|
|
return shader;
|
|
}
|
|
|
|
let vShader = compileShader(vShaderSrc, gl.VERTEX_SHADER);
|
|
let fShader = compileShader(fShaderSrc, gl.FRAGMENT_SHADER);
|
|
|
|
let program = gl.createProgram();
|
|
gl.attachShader(program, vShader);
|
|
gl.attachShader(program, fShader);
|
|
gl.linkProgram(program);
|
|
let success = gl.getProgramParameter(program, gl.LINK_STATUS);
|
|
if (!success) {
|
|
throw gl.getProgramInfoLog(program);
|
|
}
|
|
return program;
|
|
};
|
|
|
|
let viewer = document.getElementById("viewer");
|
|
let gl = viewer.getContext("webgl2");
|
|
let program = initShaderProgram(gl);
|
|
let viewMatrixLocation = gl.getUniformLocation(program, "viewMatrix");
|
|
|
|
let rotation = 0;
|
|
let then = 0;
|
|
const render = (now) => {
|
|
const Δtime = (now - then) * 0.001;
|
|
then = now;
|
|
|
|
|
|
gl.useProgram(program);
|
|
|
|
let vertexBuffer = gl.createBuffer();
|
|
let vertices = new Float32Array([
|
|
0, 0, 0,
|
|
1, 0, 0,
|
|
1, 1, 0,
|
|
]);
|
|
gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
|
|
gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
|
|
|
|
// Create the transformation matrix.
|
|
let viewMatrix = mat4.create();
|
|
mat4.rotateX(viewMatrix, viewMatrix, 0.25);
|
|
mat4.rotateY(viewMatrix, viewMatrix, rotation);
|
|
gl.uniformMatrix4fv(viewMatrixLocation, false, viewMatrix);
|
|
|
|
|
|
let positionLocation = gl.getAttribLocation(program, "position");
|
|
gl.enableVertexAttribArray(positionLocation);
|
|
gl.vertexAttribPointer(positionLocation, 3, gl.FLOAT, false, 4*3, 0);
|
|
gl.drawArrays(gl.TRIANGLES, 0, 3);
|
|
|
|
rotation += Δtime;
|
|
|
|
requestAnimationFrame(render);
|
|
};
|
|
|
|
requestAnimationFrame(render);
|
|
})(); |