CSE 328 & 528 (Spring 2021) Recitation 01 --OpenGL Tutorial

Xi Han Department of Computer Science, Stony Brook University [email protected]  Your TA & Assignment Info  Introduction to OpenGL Contents  OpenGL Environment Setup: CMake + GLFW + GLAD on ubuntu  OpenGL Examples & Explanation  Some Tips

2  Your TA:  Xi Han  Please reach me by email [email protected]  Online Office Hours:  Tu Th 20:00 – 22:00 via zoom:  https://stonybrook.zoom.us/j/93231831459?pwd=cEZ1YVY4VjIvRUF Your TA vNE14WTVmdnVYQT09  Meeting ID: 932 3183 1459  Passcode: 670454  If you are coming, please email your TA in advance!

3  Please compress your assignment in a .zip file _pa1.zip and submit via Blackboard.  Please include:  A README file explaining what your files do, what functionalities you have implemented and what you have not, how to compile/run your program (including dependencies), and with any other information you would like to include. Assignments  Your source code  A Linux64 executable  Please do NOT include:  Temporary files, IDE-specific configuration files, etc.  All assignments should be done using C/C++ and OpenGL. The build system of your program can be makefile or CMake.

4  Structure of your submission: _pa ├── CMakeLists.txt ├── README.md ├── bin │ └── pa Assignments ├── include │ ├── bar.h │ └── foo.h └── src ├── bar.cpp ├── foo.cpp └── main.cpp

5  Open Graphics Library (OpenGL) is mainly considered a 3D rendering API that we can use to manipulate graphics and images. Introduction to  However, OpenGL by itself is NOT an API, but merely a standard OpenGL specification developed and maintained by www.khronos.org.  In terms of OOP, OpenGL is merely an interface (Java) or an abstract class (C++)

6  An actual OpenGL library depends on hardware and is very platform-specific. The people implementing actual OpenGL libraries are usually graphics card manufacturers. Each graphics Introduction to card that you buy supports specific versions of OpenGL. OpenGL  NVIDIA distribute OpenGL libraries via its GPU drivers  Apple system: OpenGL library is maintained by Apple themselves  Virtual machines: provided by VM vendors, e.g., VMWare

7  OpenGL standard is specified in C functions. All bindings in other languages are wrappers.  https://www.khronos.org/registry/OpenGL-Refpages/es3/  OpenGL standard is completely platform-independent, which Introduction to means, any platform-specific functionality (i.e., creating a window) OpenGL is NOT offered by OpenGL.  These functionalities are offered by many third-party libraries!  If you meet some OpenGL-related libraries and you don’t know what it is, please refer to https://www.khronos.org/opengl/wiki/Related_toolkits_and_APIs

8  OpenGL works as a state machine. Some functions will modify a global context, and other functions work as guided by the context.

 E.g., glClearColor() will set a global context called Introduction to GL_COLOR_CLEAR_VALUE, and glClear()will paint the OpenGL whole viewport with the color specified by GL_COLOR_CLEAR_VALUE.  Due to different OpenGL contexts, same call signatures of OpenGL functions may have totally different results!

9  Starting from OpenGL 3.3 (the version that this tutorial picks), OpenGL switches from immediate mode to core-profile mode.  The immediate mode abstracted a lot from the actual operations OpenGL performed (e.g., render loops, double buffers, coordinate transformation, etc. ) OpenGL 3.3  The new core-profile mode is more complicated, yet more efficient and providing users higher dimension of freedom.  Whenever users try to use one of OpenGL’s deprecated functions in immediate mode, OpenGL raises an error and stops drawing.

 I.e., you will NOT see something like glBegin(), glEnd(), as these are all deprecated immediate-mode functions.

10  So why OpenGL 3.3 when 4.6 is already out?  All future versions of OpenGL are fully compatible with OpenGL OpenGL 3.3 3.3. They are simply adding newer features.  Thus, OpenGL 3.3 is truly worth learning!

11  Pick your language.  In this tutorial, we pick C/C++.  There are other bindings including C#, Java, Python and Lua. Please remember all other language bindings are ultimately based on the C/C++ bindings.  Create a window with OpenGL Context.  OpenGL draw on a window as guided by OpenGL Context.  As mentioned before, creating a window is very platform-specific Using and is done by window toolkit. OpenGL  In this tutorial, we select GLFW.  Load API functions.  Is also very platform-specific. For details, please refer to https://stackoverflow.com/questions/34662134/why-is-opengl- designed-in-a-way-that-the-actual-functions-have-to-be-loaded- manu for details.  Done by OpenGL Loading Library.  In this tutorial, we select GLAD.

12 Window Toolkits

https://www.khronos.org/opengl/wiki/Related_toolkits_and_APIs #Context.2FWindow_Toolkits

13 OpenGL Loading Libraries

https://www.khronos.org/opengl/wiki/OpenGL_Loading_Library

14  These sites will solve most of your questions regarding OpenGL:  https://www.khronos.org/opengl/wiki/Getting_Started#Writing_an_ OpenGL_Application -- Official OpenGL wiki that explains how OpenGL: OpenGL works Some Hints  https://www.khronos.org/registry/OpenGL-Refpages/es3/ -- Official OpenGL Reference Page  https://learnopengl.com -- A great OpenGL tutorial website

15  In this tutorial: Setup on 64bit ubuntu 20.04 VM (VMWare) OpenGL  Build system: CMake  OpenGL context library: GLFW Environment  OpenGL loading library: GLAD Setup  Utilities: GLM (OpenGL matrices), OpenCV (images)  IDE: CLion

16  Your TA personally prefer to do this course on ubuntu VM  Easier to setup on ubuntu than on Windows/macOS  Does not pollute your own local OS  In terms of performance, a VM is enough for programming assignments (while, may not be enough for projects, if you select to do projects. ) OpenGL  VMWare (SBU has educational version!): Environment  https://stonybrook.onthehub.com/WebStore/ProductSearchOfferin gList.aspx?srch=VMWare Setup  Windows users: download & install VMWare Workstation 16.x Pro  Mac users: download & install VMWare Fusion 10.x Pro  64bit ubuntu 20.04.1 image:  https://ubuntu.com/download/desktop/thank- you?version=20.04.1&architecture=amd64

17  Enable OpenGL 4.1 on VMWare guest OS:  sudo add-apt-repository ppa:kisak/kisak-mesa  sudo apt update OpenGL  sudo apt-get dist-upgrade  sudo reboot Environment  CLion (An excellent C/C++ IDE that is free to students!): Setup  https://www.jetbrains.com/clion/download/#section=linux  All other libraries can be installed & managed by apt:  sudo apt install cmake libopencv-dev libglm-dev libglew-dev libglfw3-dev mesa-utils libx11-dev libxi-dev libxrandr-dev

18  How to check your OpenGL vendor and versions?  Command glxinfo (provided by package mesa-utils)  sudo glxinfo | grep “OpenGL”

OpenGL Environment Setup VMWare VM PC with NVIDIA Geforce RTX 2080 Ti  GLAD:  Obtain from webservice https://glad.dav1d.de/  Select options according to glxinfo  Check option “Generate a loader”  Download 2 headers and a C source file, add to project

19  Example 1: Hello window (OpenGL context & loading)  Example 2: Hello rectangle (Shaders & Buffer objects)  Example 3: Textures OpenGL  Example 4: Transformations Examples  Example 5: Coordinate Systems  Example 6: Camera

 Source code of examples will be posted later.

20 How OpenGL render a filled rectangle? (More coding details in Example 2)

OpenGL Graphics Pipeline

OpenGL requires users to manually define at least one vertex shader and one fragment shader using OpenGL Shading Language (GLSL) 21 How OpenGL render a filled rectangle? (More coding details in Example 2)

Important OpenGL Buffer Objects

Vertex Array Object (VAO): Main entry Vertex Buffer Object (VBO): Buffer storing vertex data Element Buffer Object (EBO): Manage which vertices form which shape 22 Coordinate Systems

Done automatically by glViewport()

23  Start early  Consider the structure of your code before you start Some Tips  Code and test bit by bit  Write good comments  Try Googling things you don’t know

24 Thank you!

25