const vertex_shader_2d = ` attribute vec4 a_position; void main() { gl_Position = a_position; }` const fragment_shader_2d = ` precision mediump float; void main() { gl_FragColor = vec4(1,0,0.5,1); }` function createShader(gl, type, source) { var shader = gl.createShader(type); gl.shaderSource(shader, source); gl.compileShader(shader); var success = gl.getShaderParameter(shader, gl.COMPILE_STATUS); if (success) { return shader; } console.log(gl.getShaderInfoLog(shader)); gl.deleteShader(shader); } function createProgram(gl, vertexShader, fragmentShader) { var program = gl.createProgram(); gl.attachShader(program, vertexShader); gl.attachShader(program, fragmentShader); gl.linkProgram(program); var success = gl.getProgramParameter(program, gl.LINK_STATUS); if (success) { return program; } console.log(gl.getProgramInfoLog(program)); gl.deleteProgram(program); } self.addEventListener('load', (event) => { var canvas = document.querySelector('#c'); var gl = canvas.getContext("webgl"); if (!gl) { alert("Canvas did not yield WebGL context!"); } else { self.gl = gl; var vertexShader = createShader(gl, gl.VERTEX_SHADER, vertex_shader_2d); var fragmentShader = createShader(gl, gl.FRAGMENT_SHADER, fragment_shader_2d); } })