60 lines
1.5 KiB
JavaScript
60 lines
1.5 KiB
JavaScript
const canvas = document.getElementsByTagName("canvas")[0];
|
|
const gl = canvas.getContext("webgl");
|
|
|
|
function render() {
|
|
gl.clearColor(0.0, 0.0, 0.0, 1.0);
|
|
gl.clear(gl.COLOR_BUFFER_BIT);
|
|
|
|
requestAnimationFrame(render);
|
|
}
|
|
|
|
function makeShader(type, source) {
|
|
const shader = gl.createShader(type);
|
|
gl.shaderSource(shader, source);
|
|
gl.compileShader(shader);
|
|
|
|
if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
|
|
console.log("shader compile failed:\n" + gl.getShaderInfoLog(shader));
|
|
|
|
gl.deleteShader(shader);
|
|
return null;
|
|
}
|
|
|
|
return shader;
|
|
}
|
|
|
|
function makeShaderProgram(vertexSource, fragmentSource) {
|
|
const vertexShader = makeShader(gl.VERTEX_SHADER, vertexSource);
|
|
const fragmentShader = makeShader(gl.FRAGMENT_SHADER, fragmentSource);
|
|
|
|
const shaderProgram = gl.createProgram();
|
|
gl.attachShader(shaderProgram, vertexShader);
|
|
gl.attachShader(shaderProgram, fragmentShader);
|
|
gl.linkProgram(shaderProgram);
|
|
|
|
if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) {
|
|
console.log("program link failed:\n" + gl.getProgramInfoLog(shaderProgram));
|
|
gl.deleteProgram(shaderProgram);
|
|
|
|
return null;
|
|
}
|
|
|
|
return shaderProgram;
|
|
}
|
|
|
|
async function startWebGl() {
|
|
const vertexShader = await fetch("/vertex.glsl", (r) => r.text());
|
|
const fragmentShader = await fetch("/fragment.glsl", (r) => r.text());
|
|
|
|
const program = makeShaderProgram(vertexShader, fragmentShader);
|
|
|
|
requestAnimationFrame(render);
|
|
}
|
|
|
|
if (gl) {
|
|
await startWebGl();
|
|
} else {
|
|
console.log("no webgl");
|
|
// and use a static background probably.
|
|
}
|