1. CD2012 Principles of Interactive Graphics Lecture 01 Introduction Abir Hussain (Rome: 6.33,Tel. 01512312458, email a.hussain@livjm.ac.uk) Web: www.cms.livjm.ac.uk/cmsahus1

2. © JMU, 2003CD2012-012 Introduction Teaching by lectures and laboratories. –the materials are practical –Core for BSc Multimedia Systems and Computer Games Technology –Elective for other programmes - SE2, CS2 60% Coursework (2), 40% Exam Recommended book: Open GL programming Guide, third edition, by Mason Woo, Addison Wesley.

3. © JMU, 2003CD2012-013 Introduction

4. © JMU, 2003CD2012-014 Today’s Lecture and Lab Aims and objectives of the module Outline what you should already know Outline the resources we will be using in the module Introducing OpenGL – Compile our first program – Modify the program to do something interesting

5. What are the aims of the module?

6. © JMU, 2003CD2012-016 Aims To explain the principles underlying interactive computer graphics –via practical examples and explanations of basic algorithms To develop programming skills in Computer Graphics –using the OpenGL graphics library Introduce input and display technologies for Computer Graphics

7. © JMU, 2003CD2012-017 Objectives? Learning Outcomes - once we have finished you should be able to 1 Identify the hardware and software needed for Computer Graphics applications 2 Solve problems in 2D graphics and interaction 3 Develop applications using 2D graphics and 2D input devices 4 Explain the principles behind 2D and 3D graphics The Coursework will test 2, 3 and 4 and the exam will test 1, 2 and 4

8. © JMU, 2003CD2012-018 Module You are expected to know C as taught in CD1003 and CD1004. –You will need this knowledge for most of your other Level 2 modules. –You are recommended to revise C programming. For suggested revision topics go through the followings: 1. Functions and parameter passing 2. Returning values from functions 3. Arrays and structure data types 4. Compiling and debugging

9. © JMU, 2003CD2012-019 Resources OpenGL and Visual C++ can be used in 6th and 7th Floor Labs. We will use the GLUT library with OpenGL so we are independent of MS Windows. –Examples should run on Linux with OpenGL. –For more information on how to run OpenGL on Linux and for OpenGL online tutorials see www.opengl.org. In this course, we are starting at a higher-level than most traditional Computer Graphics courses.

10. © JMU, 2003CD2012-0110 Resources Most of the information on OpenGL will come from handouts but you are expected to do your own reading. Information on algorithms will come from handouts and from “Foley and van Dam, Computer Graphics: Principles and Practice (available in cheaper student edition)”

11. © JMU, 2003CD2012-0111 Anatomy of an Interactive Graphics Program Every interactive graphics program has the same basic outlines, which are: –Initialise the application data and graphics environment –Create the contents of the display –Paint the contents of the display on a window –Set-up functions to handle input events –Start an infinite loop to handle input events

12. © JMU, 2003CD2012-0112 Anatomy of an Interactive Graphics Program This is event-driven programming. –This means that the program responds to various events such as the press of a key in the keyboard or the resizing of the window on the screen. –The programmer is organising the program as a set of callback functions which are executed when an events are occurred. In OpenGL there is Utility Toolkit, which provides tools to help with managing events. As an example: glutDisplayFunc(myDisplay); //register the //redraw function registers the function myDisplay() as the function to be executed for drawing on the display.

13. © JMU, 2003CD2012-0113 Drawing basic graphics primitives a simple OpenGL program that let us draw three dots on a window. OpenGL provides tools for drawing points, lines, polylines and polygons using a list of vertices. –This occurs between two functions which are the glBegin() and glEnd()

14. © JMU, 2003CD2012-0114 Drawing basic graphics primitives Example: void myDisplay(void) { glClear(GL_COLOR_BUFFER_BIT); glBegin(GL_LINE_LOOP); glVertex2i(100,50); glVertex2i(100, 130); glVertex2i(150, 130); glVertex2i(300,300); glEnd(); glFlush(); }

15. © JMU, 2003CD2012-0115 Drawing basic graphics primitives To establish the coordinates systems, a function myInit() is a good place for establishing all the required coordinate systems. void myInit(void) { glClearColor(0.0,1.0,1.0, 1.0); //set white background //colour glColor3f(0.0f, 0.0f, 0.0f); //set the drawing //colour glPointSize(4.0); //set the size of the //points glMatrixMode(GL_PROJECTION); glLoadIdentity(); gluOrtho2D(0.0, 640.0, 0.0, 480.0);//set the size of the //window }

16. © JMU, 2003CD2012-0116 Drawing basic graphics primitives Before a program can be started some header file should be included such as: #include the windows header file since this is a window’s program. #include the application programming interface #include the OpenGL utility library # include the OpenGL utility toolkit which is a windowing tools for handling window system operations.

17. © JMU, 2003CD2012-0117 Drawing basic graphics primitives In the main function, the first five functions use the OpenGL utility toolkit to open a window for drawing. –The remaining functions in main() register the callback function and then start the main event loop processing. void main (int argc, char** argv) { glutInit(&argc, argv); glutInitDisplayMode(GLUT_SINGLE| GLUT_RGB); glutInitWindowSize(640, 480); glutInitWindowPosition(100,150); glutCreateWindow("my first attempt"); glutDisplayFunc(myDisplay); myInit(); glutMainLoop(); }

18. © JMU, 2003CD2012-0118 Summary Module Overview –Syllabus –assessment outline What is an OpenGL? –purpose and functions Drawing basic graphics primitives