CSCI 440 - Homework Three

Now that you have an interesting object on the screen, add the ability for user control. The user should be able to spin the object around all three axes. You decide whether to use buttons, the keyboard, some combination, etc. Unlike the examples shown in class, do not have the object spin continuously. For example, if you use buttons and the user hits the "Z clockwise" button once, then the object should spin around the Z axis a small amount then stop. (For a challenge, make stop-motion v. continuous motion another option.)

Send your code to dannellys@winthrop.edu by the start of class on Oct 3. Use the subject line "CSCI 440 - HW03. I will go to your web page and run your program. To make grading easier for me, please put your code as the body of the email message, not as an attachment.

Here are some useful bits of code:

1 - We want surfaces far way to be hidden behind closer surfaces. So, to turn that feature on, add this code at the bottom of init() right before you call render():
        gl.enable ( gl.DEPTH_TEST );

2 - To create a transformation matrix inside render():

	var myMatrix = mat4();                      // create a new matrix, equal to identity matrix

	var rotMatA = rotate (degreesX, [1,0,0]);   // create rotation matrix, X degree around X axis

	var scaleMatB = scalem (0.5, 0.5, 0.5);     // scale to half size 

	myMatrix = mult (myMatrix, rotMatA);        // multiply matrices  
	

3 - Change the vertex shader program to use a transformation matrix.
   <script id="vertex-shader" type="x-shader/x-vertex">
   attribute vec4 vPosition;
   uniform mat4 modelMatrix;
   void main()
      {
         gl_Position = modelMatrix * vPosition;
      }
   </script>

4 - Create a global variable that links to the GPU's model matrix. Inside your JavaScript, but above any of the functions:
        var modelMatrixLoc;

5 - Assign the value to that global variable, inside the init() function, right before you call render():
        modelMatrixLoc = gl.getUniformLocation ( program, "modelMatrix" );

6 - Inside render() before you call draw arrays, send the new transformation matrix to the GPU:
        gl.uniformMatrix4fv (modelMatrixLoc, false, flatten(myMatrix) );