Use the methods we have defined to write a clear, well structured, program.
117 var gl = getGLContext('drawingSurface'); • • {We have already seen the vertex and shader definitions} • 149 150 // Here we create and compile the vertex shader. This will compile to code for your specific 151 // graphics card. 152 var vertexShader = compileShader(gl, vertexShaderSource, gl.VERTEX_SHADER); 153 154 // And then compile the fragment shader too. 155 var fragmentShader = compileShader(gl, fragmentShaderSource, gl.FRAGMENT_SHADER); 156 157 // As you might expect, we are going to run some code, so we need a program. 158 var program = createProgram(gl, vertexShader, fragmentShader); 159 160 // Make this the currently active program 161 gl.useProgram(program); 162 163 // This is a handle to what will be a buffer 164 var vertexPositionBuffer = createBuffer(vertices); 165 166 // Bind the buffer to a specific shader attribute 167 bindBuffer(vertexPositionBuffer, 'position', 3, gl.FLOAT, 12, 0); 168 169 // Finally run the program. Render, or draw, the data. Here we tell it to draw triangles starting 170 // with element zero of the vertexPositionBuffer, and that there are three vertices. So there is 171 // one triangle. 172 gl.drawArrays(gl.TRIANGLES, 0, 3);
This shows the main elements that will be present in most OpenGL programs.