Lecture 02: OpenGL (Fixed-Function)

COMP 175 | COMPUTER GRAPHICS

Remco Chang 1/6002 – OpenGL

Lecture 02:OpenGL (Fixed-Function)

COMP 175: Computer GraphicsJanuary 26, 2016



Seems possible, but it’s still in the early stages.

Support for OpenGL seems to top out at 3.3 (which is plenty good for the purpose of this class, but latest version is 4.5)

Using MESA is an option, but MESA is a software emulation of a graphics card.

A Note on OpenGL on VMWare



For the Windows users, download Visual Studio from Tufts UIT (which is free).

This is important for Thursday’s lab – you don’t want to spend 45 minutes downloading and installing VS and only end up with 20 minutes to get Lab0 to work.

Common question that I get: why use Windows?

TODO:



What is event-based programming?

Infinite loop until user clicks on “exit”

During that time, the system reacts to events Keyboard, mouse Network traffic Threads

The most relevant for visualization/graphics are: Repaint event Idle event

Note on Event-Based Programming



Conceptual Graphics Framework

Graphics Library can be Direct3D, Java3D, OpenGL, etc. It is a software API that controls the functions of a piece

of hardware – the graphics card. Can we run OpenGL programs remotely? (e.g., use

linux.cs.tufts.edu remotely through SSH and X-tunneling?)

What is OpenGL?

GraphicsSystem/

GPUApplicatio

nModel

(database)

Software Hardware

Applicationprogram

GraphicsLibrary



In Immediate-Mode Fixed-Function mode, OpenGL acts as a state machine.

What is a state machine?

Every variable is a “global variable” For example, the current color

You need to keep track of the states… Or query the graphics card if you forget Which, of course, is slow

Graphics Library



Pseudo code:

SetState (LineStyle, DASHED);

SetState (LineColor, RED);

DrawLine ( PtStart = (x1,y1), PtEnd = (x2,y2) );

SetState (LineColor, BLUE);


SetState (LineStyle, SOLID);


State Variables

What color and shape?





Pseudo code:


SetState (LineColor, RED);





SetState (LineStyle, SOLID);



State Variables






What if…?

function DrawDashedTriangle (pt1,pt2,p3) {SetState( LineStyle, DASHED );DrawLine( PtStart=pt1, PtStart=p2 );DrawLine( PtStart=pt2, PtStart=p3 );DrawLine( PtStart=pt3, PtStart=p1 );

} What color is the triangle?

Pros:?? Cons:??

State Variables – Pros and Cons



What if…?

function DrawDashedTriangle (pt1,pt2,p3) {SetState( LineStyle, DASHED );DrawLine( PtStart=pt1, PtStart=p2 );DrawLine( PtStart=pt2, PtStart=p3 );DrawLine( PtStart=pt3, PtStart=p1 );}

What color is the triangle? Pros: trickle down effect, caller can control the subroutine’s

behavior Cons: the color is undefined! Who set my color?!




What’s right and what’s wrong with this?

function DrawTriangle (pt1,pt2,p3, int origColor, int curColor, int origStyle, int curStyle ) {SetState( LineStyle, curStyle );SetState(LineColor, curColor);DrawLine( PtStart=pt1, PtStart=p2 );DrawLine( PtStart=pt2, PtStart=p3 );DrawLine( PtStart=pt3, PtStart=p1 );SetState( LineStyle, origStyle );SetState(LineColor, origColor);}




Bundles and unsets…

function DrawRedDashedTriangle(pt1,pt2,p3){PushAttributeState();SetState( LineStyle, DASHED );SetState( LineColor, RED );...PopAttributeState();}

This eliminates the state variable problem.

Still A Pain, but Cleaner…



What does this function do?

//using idleFunc as the main render loopvoid idleFunc () {glTranslate3f (1, 0, 0);glBegin(GL_POINTS);glVertex3f (0, 0, 0);glEnd();}

Where is the point showing up? How do I get that value?

Another Example



What if I forget to set some state?DrawLine ( PtStart = (x1,y1), PtEnd = (x2,y2) );

What if I set the wrong state?SetState(LineStyle, 12345);DrawLine( PtStart=pt1, PtStart=p2 );

What if I forget the state a variable is in?

Forgetting the State?



What if I forget to set some state?DrawLine ( PtStart = (x1,y1), PtEnd = (x2,y2) );

OpenGL provides some good default values. For example, for color, it’s set to (1,1,1,1) – non transparent white

How do I know if something worked?SetState(LineStyle, 12345);DrawLine( PtStart=pt1, PtStart=p2 );

You don’t. Since it’s not clear if some configuration of states will send OpenGL spinning, if you suspect an error from OpenGL, call

Glenum glGetError(void)

What if I forget the state a variable is in? You should use this sparingly… But you can use

void glGetBooleanv(Glenum paraname, Glboolean* params)

void glGetFixedv(Glenum paraname, Glfixed* params)

void glGetFloatv(Glenum paraname, Glfloat* params)

void glGetIntegerv(Glenum paraname, Glint* params)

Forgetting the State?



What do you think is the best way to deal with the state machine and maintain state variables? How to access local variables (that correspond to state

variables)? Efficiency considerations?

How do you think the programming with a state machine affects multi-threaded applications?

Programming Strategies?



How many parameters do you have to pass to render an object?

void render () { obj1->drawSelf(myMouse, myScreenSize, myTimer, ...); obj2->drawSelf(myMouse, myScreenSize, myTimer, ...); obj3->drawSelf(myMouse, myScreenSize, myTimer, ...);}

How do you enforce that there is only one instance of myMouse, myScreenSize, myTimer in code?

For Example



1. Use global variables

2. Use mutual references. For example:

Possible Answers?

void setChild (CWidget* child) { myChild = child; child->setParent(this);}

MyMouse* getMouse() { return myMouse;}

void setParent (PWidget* parent) { myParent = parent;}

void doStuff () { MyMouse mouse = myParent->getMouse(); doStuffWithMouse (mouse);}



Problems: Need to guarantee a single instance of the states Don’t want to pass a billion parameters during the

execution of every child object Don’t want the child to have to call

parent->parent->parent->parent->getProperties();

One possible answer is to use Singletons

Possible Answers?



//h file

class Singleton {

public:

static Singleton* Instance();

~Singleton();

int getValue();

private:

Singleton();

int m_value;

static Singleton* sm_instance;

};

Singleton Example//c++ file

Singleton* Singleton::sm_instance = NULL;

Singleton::Singleton() {

}

Singleton::~Singleton() {

}

Singleton* Singleton::Instance() {

if (Singleton::sm_instance == NULL) {

Singleton::sm_instance = new Singleton();

}

return Singleton::sm_instance;

}

int Singleton::getValue() {

return m_value;

}

//main.cpp file

int main (int argc, char** argv) {

//blah blah blah

Singleton* singletonObj = Singleton::Instance();

delete singletonObj;

return 0;

}



What do you think is the best way to deal with the state machine and maintain state variables? How to access local variables (that correspond to state

variables)? Efficiency considerations?

How do you think the programming with a state machine affects multi-threaded applications?

Programming Strategies?



Thread A Thread B

void drawRedDashedTriangle() { pushAttributes();

setColor (RED); setStyle (DASHED); drawLine (pt1+d, pt2+d); drawLine (pt2+d, pt3+d); drawLine (pt3+d, pt1+d); d++; popAttributes(); }

void drawBlueSolidTriangle() { pushAttributes();

setColor (BLUE); setStyle (SOLID); drawLine (pt4-p, pt5-p); drawLine (pt5-p, pt6-p); drawLine (pt6-p, pt4-p); p--; popAttributes(); }

Multi-Threading and OpenGL



Thread A Thread B

void drawRedDashedTriangle() { mutex.lock(); pushAttributes();

setColor (RED); setStyle (DASHED); drawLine (pt1+d, pt2+d); drawLine (pt2+d, pt3+d); drawLine (pt3+d, pt1+d); d++; popAttributes(); mutex.unlock();}

void drawBlueSolidTriangle() { mutex.lock(); pushAttributes();

setColor (BLUE); setStyle (SOLID); drawLine (pt4-p, pt5-p); drawLine (pt5-p, pt6-p); drawLine (pt6-p, pt4-p); p--; popAttributes(); mutex.unlock();}

Multi-Threading and OpenGL



Questions?



Typical OpenGL Application



Here we use GLUT, which is a basic GL window implementation that is on all platforms.

Pros: cross-platform, command line, easy to use Cons: no GUI support (no buttons, menus, etc.)

Example



int main( int argc, char** argv ) {

glutInit( &argc, argv ); // Boilerplate initialization

glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);

glutInitWindowPosition( 50, 50 ); //upper left

glutInitWindowSize( 640, 480 ); // width, height, in pixels

glutCreateWindow( "OpenGL Example" ); // window title

glViewport(

/* lower left corner of the viewport */ 0, 0,

/* width, height of the viewport */ 640, 480 ); //lower left

Example OpenGL Application

What’s going on here?





glutInitDisplayMode(GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH);


#define GLUT_RGB 0 #define GLUT_RGBA GLUT_RGB #define GLUT_INDEX 1 #define GLUT_SINGLE 0 #define GLUT_DOUBLE 2 #define GLUT_ACCUM 4 #define GLUT_ALPHA 8 #define GLUT_DEPTH 16 #define GLUT_STENCIL 32 #if {GLUT_API_VERSION >= 2} #define GLUT_MULTISAMPLE 128 #define GLUT_STEREO 256 #endif #if {GLUT_API_VERSION >= 3} #define GLUT_LUMINANCE 512 #endif

What is a Bit Mask?



Let’s say I have a bit string to store the current state of my variables: 1001

Making the state: int myState = (var1 | var4)

Checking the state: If I want to ask if variable 1 is on: if (myState & var1 > 0)

Lastly, on image-based bit masking…

Quick Word on Bit Masking…

*Note: the black pixels represent “transparent pixels”

Remco Chang





glutInitDisplayMode( GLUT_RGB | GLUT_DOUBLE | GLUT_DEPTH );

glutInitWindowPosition( 50, 50 ); //upper left

glutInitWindowSize( 640, 480 ); // width, height, in pixels

glutCreateWindow( "OpenGL Example" ); // window title

glViewport(

/* lower left corner of the viewport */ 0, 0,

/* width, height of the viewport */ 640, 480 ); //lower left


Careful!!





int main( int argc, char** argv ) {glutInit( &argc, argv ); // Boilerplate initializationglutInitDisplayMode( GLUT_RGB | GLUT_DEPTH );

glutInitWindowPosition( 50, 50 ); //upper leftglutInitWindowSize( 640, 480 ); // width, height, in pixelsglutCreateWindow( "OpenGL Example" ); // window title

glViewport(/* lower left corner of the viewport */ 0, 0,/* width, height of the viewport */ 640, 480 ); //lower left

glShadeModel( GL_SMOOTH );

glPolygonMode( GL_FRONT, GL_FILL );

setupLighting();

setupCamera(640, 480);

registerCallBacks();

glutMainLoop();

}


Asks OpenGL to render with smooth (Gouraud) shading. Other option is GL_FLAT








setupLighting();



glutMainLoop();

}


Asks OpenGL to render fill the polygons but only in the front-facing sideOptions are GL_BACK, GL_FRONT_AND_BACK, and GL_POINT, GL_LINE, GL_FILL








setupLighting();



glutMainLoop();

}

Example OpenGL Applicationvoid setupLighting() { glEnable (GL_LIGHTING); glEnable (GL_LIGHT0); GLfloat whiteColor[] = {0.25f, 0.25f, 0.25f, 1.0f}; glLightfv (GL_LIGHT0, GL_AMBIENT, whiteColor);

//directional (diffuse) light GLfloat whiteFull[] = {1.0f, 1.0f, 1.0f, 1.0f}; GLfloat lightPos[] = {-1.0f, 1.0f, 1.0f, 0.0f}; glLightfv(GL_LIGHT0, GL_DIFFUSE, whiteFull); glLightfv(GL_LIGHT0, GL_POSITION, lightPos);

GLfloat grey[] = {0.1f, 0.1f, 0.1f, 1.0f}; glMaterialfv(GL_FRONT, GL_DIFFUSE, grey); //reflect 10% diffuse glMaterialfv(GL_FRONT, GL_AMBIENT, whiteFull);}//reflect full ambient








setupLighting();



glutMainLoop();

}

Example OpenGL Applicationvoid setupCamera(int w, int h) { glMatrixMode (GL_PROJECTION); glLoadIdentity(); //left, right, bottom, top gluOrtho(-1, 1, -1, 1);

//same as: (adds near, far) //glOrtho(-1,1,-1,1,-1,1);

//or perspective transform //gluPerspective( // 45, //y-axis field of view // ((float)w/(float)h), // ratio of FOV(x) to FOV(y) // 0.02, //distance to near clip plane // 1000 //distance to far clip plane // );

glMatrixMode (GL_MODELVIEW); glLoadIdentity();}








setupLighting();



glutMainLoop();

}


void registerCallbacks() { glutReshapeFunc (myReshape); glutKeyboardFunc (myKeyboard); glutMouseFunc (myMouseClick); glutMotionFunc (myMouseMove); glutDisplayFunc (myDisplay); glutIdleFunc (myIdle);}



void myReshape(GLint width, GLint height) { //called when the window is resized

glViewport(0, 0, width, height); setupCamera(width, height);}

void myKeyboard (unsigned car key, int x, int y) { //called on keyboard event switch (key) {

case ‘a’: someGlobalVariable = 1;

: : }}





void myMouseClick(int button, int state, int x, int y) { //called when a mouse click occurs if (button == GLUT_LEFT_BUTTON) { if (state == GLUT_DOWN) {

globalVariableMouseDown = true; } else {

globalVariableMouseDown = false; } }}

void myMouseMove (int x, int y) { //called when a mouse move occurs if (globalVariableMouseDown==true) { //dragging occurs }}





void display(void) { //called when the window needs to paint itself glClear (GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

drawMyStuff(); glutSwapBuffers();

numberOfFrames++;}

void myIdle (void) { //called ALL THE TIME!!

DWORD time_now = GetTickCount(); float diff = (float)(time_now-last_check_time)/1000.0; if (diff > 1.0) { float frameRate = numberOfFrames / (float)diff; numberOfFrames = 0; last_check_time = time_now; } glutPostRedisplay();}










setupLighting();



glutMainLoop();

}


No turning back at this point, we enter the infinite loop!



Typical OpenGL Application



Questions?



void drawMyStuff(void) { glBegin (...);

//glColor3f(1.0f, 1.0f, 1.0f); //glNormal3f(0.0f, 0.0f, 1.0f); glVertex3f(1.0f, 1.0f, 1.0f); glVertex3f(1.0f, 2.0f, 1.0f); : :

glEnd();}

Drawing Primitives



GL_POINTSGL_LINESGL_LINE_STRIPGL_LINE_LOOPGL_TRIANGLESGL_TRIANGLE_STRIPGL_TRIANGLE_FANGL_QUADSGL_QUAD_STRIPGL_POLYGON

OpenGL Primitives




OpenGL Primitives




OpenGL Primitives




OpenGL Primitives



void glFrontFace (GLenum mode) mode can be either GL_CW or GL_CCW

GL_CCW is the default

Ordering of Vertices




OpenGL Primitives




OpenGL Primitives




OpenGL Primitives




OpenGL Primitives




OpenGL Primitives

1. Must be convex2. Cannot intersect



glColor3f (1.0, 0.0f, 0.0f);glBegin(GL_TRIANGLES); glVertex3f(-1.0f, -0.5f, -4.0f); // A glVertex3f( 1.0f, -0.5f, -4.0f); // B glVertex3f( 0.0f, 0.5f, -4.0f); // C glEnd();

Color Blending



glBegin(GL_TRIANGLES); glColor3f(1.0f, 0.0f, 0.0f); glVertex3f(-1.0f, -0.5f, -4.0f); // A glColor3f(0.0f, 1.0f, 0.0f); glVertex3f( 1.0f, -0.5f, -4.0f); // B glColor3f(0.0f, 0.0f, 1.0f); glVertex3f( 0.0f, 0.5f, -4.0f); // C glEnd();

Color Blending



glShadeModel( GL_FLAT );glBegin(GL_TRIANGLES); glColor3f(1.0f, 0.0f, 0.0f); glVertex3f(-1.0f, -0.5f, -4.0f); // A glColor3f(0.0f, 1.0f, 0.0f); glVertex3f( 1.0f, -0.5f, -4.0f); // B glColor3f(0.0f, 0.0f, 1.0f); glVertex3f( 0.0f, 0.5f, -4.0f); // C glEnd();

GL Shade Model



The direction where the face of the triangle points towards

Unit vector Or call ( glEnable(GL_NORMALIZE); )

GL Normal



These two have the same number of quads… What is the difference?

GL Normal



GL Normal



glNormal3f(nx, ny, nz);glBegin(GL_QUADS); glVertex3f(x1, y1, z1); glVertex3f(x2, y2, z2); glVertex3f(x3, y3, z3); glVertex3f(x4, y4, z4);glEnd();

GL Normal



glBegin(GL_QUADS); glNormal3f(nx1, ny1, nz1); glVertex3f(x1, y1, z1);

glNormal3f(nx2, ny2, nz2); glVertex3f(x2, y2, z2);

glNormal3f(nx3, ny3, nz3); glVertex3f(x3, y3, z3);

glNormal3f(nx4, ny4, nz4); glVertex3f(x4, y4, z4);glEnd();

GL Normal



Data transport from CPU to GPU Consider the example before… At 60fps, there’s a lot redundancy

How to make it more efficient?

Note on Display List



Data transport from CPU to GPU Consider the example before…

How to make it more efficient? Push things onto the GPU memory…

Display List Vertex Buffer Objects (VBO) etc.

Cost of readability (e.g., http://www.opengl.org/wiki/VBO_-_just_examples)

Note on Display List



Questions?



For the Windows users, download Visual Studio from Tufts UIT (which is free)

Two ways to do this: If you have a CS unix account, go to:

www.eecs.tufts.edu, click on “userguide”, then login. Click on “Access to Microsoft Software Downloads (msdnaa)” under “Software”

If you don’t have a CS account, go to: www.dreamspark.com, click on “students” (on top) Register (if necessary)

Don’t Forget!!!!

http://www.eecs.tufts.edu/

http://www.dreamspark.com/

Lecture 02: OpenGL (Fixed-Function)

Documents

p3 drawline ptstart

reddrawline ptstart

blue drawline ptstart

dashed drawline ptstart

p2 drawline ptstart

soliddrawline ptstart

computer graphicsremco

y2 setstate linestyle