CG Class 22, Thurs 2017-10-26

Chapter 6

1. wireSphere: wire frame of recursively generated sphere
2. shadedCube: rotating cube with modified Phong shading
3. shadedSphere1: shaded sphere using true normals and per vertex shading
4. shadedSphere2: shaded sphere using true normals and per fragment shading
5. shadedSphere3: shaded sphere using vertex normals and per vertex shading
6. shadedSphere4: shaded sphere using vertex normals and per fragment shading
7. shadedSphereEyeSpace and shadedSphereObjectSpace show how lighting computations can be carried out in these spaces

Summary of the new part of shadedCube:

1. var nBuffer = gl.createBuffer();

   Reserve a buffer id.

2. gl.bindBuffer( gl.ARRAY_BUFFER, nBuffer );

   1. Create that buffer as a buffer of data items, one per vertex.
   2. Make it the current buffer for future buffer operations.

3. gl.bufferData( gl.ARRAY_BUFFER, flatten(normalsArray), gl.STATIC_DRAW );

   Write a array of normals, flattened to remove metadata, into the current buffer.

4. var vNormal = gl.getAttribLocation( program, "vNormal" );

   Get the address of the shader (GPU) variable named "vNormal".

5. gl.vertexAttribPointer( vNormal, 3, gl.FLOAT, false, 0, 0 );

   Declare that the current buffer contains 3 floats per vertex.

6. gl.enableVertexAttribArray( vNormal );

   Enable the array for use.

7. (in the shader) attribute vec3 vNormal;

   Declare the variable in the vertex shader that will receive each row of the javascript array as each vertex is processed.

8. The whole process is repeated with the vertex positions.

   Note that the variable with vertex positions is not hardwired here. You pass in whatever data you want, and your shader program uses it as you want.