HTML and CSS Reference
In-Depth Information
Listing 9-3.
Rendering a Cube
function drawScene() {
// Clear the buffers.
gl.clearColor(0.0, 0.0, 0.0, 1.0);
gl.clearDepth(1.0);
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
// Set the depth test
gl.enable(gl.DEPTH_TEST);
gl.depthFunc(gl.LEQUAL);
// Create the perspective matrix
perspectiveMatrix = makePerspective(45, 640.0/480.0, 0.1, 100.0);
// Create the model view matrix
loadIdentity();
mvTranslate([-0.0, 0.0, -6.0]);
mvPushMatrix();
mvRotate(cubeRotation, [1, 0, 1]);
// Set the program and its uniforms
gl.useProgram(shaderProgram);
var pUniform = gl.getUniformLocation(shaderProgram, "uPMatrix");
gl.uniformMatrix4fv(pUniform, false, new Float32Array(perspectiveMatrix.flatten()));
var mvUniform = gl.getUniformLocation(shaderProgram, "uMVMatrix");
gl.uniformMatrix4fv(mvUniform, false, new Float32Array(mvMatrix.flatten()));
gl.uniform1i(gl.getUniformLocation(shaderProgram, "uSampler"), 0);
// Specify the texture.
gl.activeTexture(gl.TEXTURE0);
gl.bindTexture(gl.TEXTURE_2D, cubeTexture);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_NEAREST);
// Set the position for the vertices
gl.bindBuffer(gl.ARRAY_BUFFER, cubeVerticesBuffer);
gl.enableVertexAttribArray(gl.getAttribLocation(shaderProgram, "aVertexPosition"));
gl.vertexAttribPointer(vertexPositionAttribute, 3, gl.FLOAT, false, 0, 0);
// Set the texture coordinates attribute for the vertices
gl.bindBuffer(gl.ARRAY_BUFFER, cubeVerticesTextureCoordBuffer);
gl.enableVertexAttribArray(gl.getAttribLocation(shaderProgram, "aTextureCoord"));
gl.vertexAttribPointer(textureCoordAttribute, 2, gl.FLOAT, false, 0, 0);
