In the testApp.h
file, in the testApp
class declaration, add the shader object declaration as follows:
ofShader shader; //Shader
At the end of the setup()
function declaration, add the following line for loading shaders:
shader.load( "shaderVert.c", "shaderFrag.c" );
Change the empty update()
function with the following code:
float time0 = 0; float phase = 0; float distortAmount = 0; void testApp::update(){ //Compute dt float time = ofGetElapsedTimef(); float dt = ofClamp( time - time0, 0, 0.1 ); time0 = time; float speed = ofMap( mouseY, 0, ofGetHeight(), 0, 5 ); phase += speed * dt; distortAmount = ofMap( mouseX, 0, ofGetWidth(), 0, 1.0 ); }
This function computes time step dt
as a time difference between the current time and time of previous calling of the update()
function (see details in the Implementing a particle in the project section in Chapter 3, Building a Simple Particle System). Next it computes the phase
and distortAmount
parameters depending on the mouse position. Note that the phase value changes steadily over time, so our shape distortion will change with time.
In draw()
, add the following lines before the //Draw the triangles
line:
shader.begin(); //Enable the shader shader.setUniform1f("phase", phase ); shader.setUniform1f("distortAmount", distortAmount );
This code enables the shader and sets its parameters.
Finally, add the line for disabling the shader just before the ofPopMatrix();
line:
shader.end(); //Disable the shader
Run the project and move the mouse. You will see how the sphere-like cloud will deform depending on the mouse position. Namely, the mouse x-position sets the amount of distortion and the mouse y-position sets the speed of wave-like fluctuations:
Now we will consider the example of using a geometry shader.