Latest revision as of 22:39, 30 October 2013

Project 4: Light and Shade

This project is on OpenGL lighting and shading, and includes GLSL shader programs.

This project is due on Friday, November 1st at 1:30pm. It will be discussed in Center Hall 105 on Monday, October 28th at 3:00pm.

Note that GLSL shaders, which are needed for part 2 of the assignment, will be covered in class on Tuesday, October 22nd.

1. Mouse Control (20 Points)

Start by reviving your application from assignment 2: you will need to be able to display the cube, as well as the following three 3D models into your application and display them at reasonable sizes (screen filling). The function keys should switch between the models.

These are the models you need to be able to load, you will have to unzip them to get at the OBJ files. Note that some of them are different files than before, as we now need files with normals. The OBJ reader we gave you in project 2 already parses normals.

• Dragon (same as before)
• Bunny (new)
• Sandal (new)

Note: Prior to Oct 29, there were bunny and head files which did not work with your obj reader. Please replace those with the files above.

You are welcome but not required to support the keyboard commands from assignment 2 to move around the models. However, you will need to add mouse control, which will allow rotating the model about the center of your OpenGL window, as well as scaling the model up and down. The left mouse button should be used for rotation, the right mouse button should zoom in and out when the mouse is moved up or down while it is pressed.

This video shows how the trackball-like rotation should work. We provide sample code for the trackball rotation. You will need to adapt it to the syntax of your matrix and vector classes and get it to work within your application.

If you cannot get the sample trackball code to work, the following description of the algorithm might help you.

The figure below illustrates how to translate mouse movement into a rotation axis and angle. m0 and m1 are consecutive 2D mouse positions. These positions define two locations v and w on a 3D virtual sphere that fills the rendering window. Use their cross product as the rotation axis a = v x w, and the angle between v and w as the rotation angle.

Horizontal mouse movement exactly in the middle of the window should result in a rotation just around the y-axis. Vertical mouse movement exactly in the middle of the window should result in a rotation just around the x-axis. Mouse movements in other areas and directions should result in rotations about an axis a which is not parallel to any single coordinate axis, and is determined by the direction the mouse is moved in.

Once you have calculated the trackball rotation matrix for a mouse drag, you will need to multiply it with the object to world transformation matrix for the model or the light source you are moving.

To access the mouse x and y coordinates, you will need to use GLUT's callback functions glutMouseFunc(), which gets called when you press a mouse button, and glutMotionFunc(), which gets called constantly while you hold the button down and move the mouse. Note that successive trackball rotations must build on previous ones; at no point should the model snap back to a previous or default position.

2. OpenGL Lighting and Shading (40 points)

Write classes to manage light and material properties (Light and Material). As a starting point, refer to the relevant sections in Chapter 5 of the OpenGL Programming Guide, as well as the OpenGL Lighting FAQ.

Associate material properties with each of the four 3D model files: two of them should be shiny, and the other two should be shiny and diffuse - you choose which. Use colors other than white. (10 points)

Create three light sources: one directional light, one point light and one spot light. The spot light should always point towards the center of the OpenGL window. Give them initial positions and colors. Each of them must have a different position and color. The spot light should have a spot width narrow enough so that it only illuminates a small part of the surface of the models. Toggle each of them on and off with one of the number keys: 1, 2, and 3. Rotate those light sources which are on with the 3D model.

Add a freeze mode for the 3D model and toggle it with the 'm' key: when it is enabled, the model will not respond to mouse control commands and instead stay in its last orientation and size. In this mode only the enabled light sources rotate and zoom in and out.

Notes:

• OpenGL multiplies light position and direction with the Modelview matrix when they are set. Therefore, you need to modify the Modelview matrix with your mouse control routines to rotate the light sources, independently for each light source.
• To ascertain that the normals of your 3D models will survive zoom operations correctly, you should use the following OpenGL command: glEnable(GL_NORMALIZE).
• By default, OpenGL uses a simplified model for the calculation of the highlights. For a more realistic model add this command to your code: glLightModelf(GL_LIGHT_MODEL_LOCAL_VIEWER, GL_TRUE).

3. GLSL Shader Programs (40 Points)

Imagine that each of your light sources has a force field, which attracts or repulses the vertices of your geometry, and shifts their color.

• The directional light should repulse the vertices, and do not cause a color shift.
• The point light should repulse the vertices as well, and shift their color towards red.
• The spot light should attract the vertices, but only if they fall within its spot, and shift their color towards green.

In each case, the attraction or repulsion should happen in the direction of the light (using the light vector), and should attenuate with the square distance from the light source, so that those vertices closer to the light source are affected more than those farther away. Note that the directional light does not have a position - implement the effect so that only polygons facing the light source are affected by it (by comparing the surface normals to the incoming light vector). Implement this effect as a GLSL vertex shader.

The color shift should be done by about 10%, and must be strong enough so that it is obvious. The color shift must be implemented on a per pixel basis, which means that you will need to implement it as a GLSL fragment shader.

You will need to demonstrate the described effect for the 3D objects you used in the prior homework projects: specifically: cube, dragon, bunny and head. Be sure to make your objects big enough that they almost fill the OpenGL window, either by using your code from project 2, or by using fixed scale factors.

For Windows and Linux users, in order to use OpenGL extensions, you should download GLee and add the glee.h and glee.c files to your project files, or tell the linker to link with the GLee library (glee.lib or glee.dll for Windows, or libglee.a/libglee.so for Linux). OSX users will not need GLee, as OpenGL extensions are available by default. Note: The link on the website seems to be down, so you can download glee.h and glee.c from here.

We provide a sample shader class and three sample combinations of vertex and fragment shaders for you to familiarize yourself with GLSL shader programming. For this exercise, extend the diffuse_shading shader to implement the desired effects.

If the respective light is off, the attraction/repulsion and color shifting effects need to stop.

Support a so far unused keyboard key to toggle the functionality of this part of the assignment on/off.

You will get points for the following things:

• A GLSL vertex shader with at least one attraction/repulsion effect (10 points).
• A GLSL fragment shader with at least one color shifting effect (10 points).
• Correct effect of the directional light (5 points).
• Correct effect of the point light (5 points).
• Correct effect of the spot light. The spot needs to be narrow enough to only affect a small part of the surface of the models (5 points).
• Each of the 6 3D models needs to work with the shaders and you will need to be able to switch between the models with the keyboard. The models need to be big enough to roughly fill the OpenGL window. The light sources need to rotate like in exercise 2. (5 points)

Notes

• While most CSE lab computers do, some older computers or simpler graphics cards do not support GLSL. Be aware that this might be a problem with your personal computer.
• Here are a few URLs with tutorials on how to write GLSL shader code.
  • Lighthouse3D GLSL tutorials
  • Clockworkcoders GLSL tutorials
  • GLSL quick reference
  • GLSL reference documentation

4. Extra Credit (10 Points)

Create a simple water reflection effect for your 3D models, similar to that in the picture below:

This effect does not need to be demonstrated concurrently with the shader effect from part 3, but it would be great if you could switch to it with a keyboard key.

You will need to split the OpenGL window in two halves: the upper half shows the 3D model as you normally do, the lower half shows the same model, mirrored along the y axis and with a water-like reflection effect. You can constrain rendering for each of the halves of the screen by calling glViewPort before rendering each of the images, with different y coordinates and half the usual height.

The approach for the effect is to write a vertex shader, which (pseudo-)randomly offsets each vertex in an oscillating way using sin curves, shifting the vertices around the screen plane. Alternatively, you can use a different approach if you prefer, even frame-buffer based approaches which are vertex agnostic are acceptable.

You need to be able to rotate the 3D model as usual, and the water effect must constantly update the screen with slightly different offsets so that it looks like the water's ripples cause the effect.

GLSL does not have a native random function, but you can use the following popular pseudo-random number generator, which generates numbers based on two input values. The same input values yield the same random numbers, so you should seed the function with something like the current time, which you pass into the shader via a uniform variable, which your GLUT program updates with every frame.

float rand(vec2 co)
{
  return fract(sin(dot(co.xy,vec2(12.9898,78.233))) * 43758.5453);
}