Phong shader with fbo and attempting multipass blur

Hello forum,

I have managed to build a simple a application with ofFbo and ofShader. You can check the following post:

Phong & ofFbo

I am trying to extend it with the blur shader as described inside the shader tutorial and then i am getting a blank screen.
Please check the following snippet:

//--------------------------------------------------------------
void ofApp::update()
{
   float f  = ofGetElapsedTimef() * 60;

   //render starts on the attached texture of the fbo
   fbo.begin();

   ofEnableDepthTest();      

   //clear the background
   //before the main rendering

   //I WAS HAVING THE TRASPARENCY PROBLEM
   //BECAUSE THE ALPHA VALUE WAS SET TO 50
   //NOW IT IS 255 AND I GOT RID OF ALL THE
   //ARTIFACTS, TACK SJÄLV!!!
   ofBackground(50,50,50,255);
   
   //re-position the teapot model
   /*
   model.setPosition(texture_width/2,
		     texture_height/2,
		     0);
   */
   model.setPosition(ofGetWidth()/2,
		     ofGetHeight()/2,
		     0);

   
   //animate the model
   model.setRotation(0,f,1,0,0);
   model.setRotation(1,f,0,1,0);
   model.setRotation(2,f,0,0,1);
            
   //the teapot goes through the shader
   perFragmentShader.begin();
   
   perFragmentShader.setUniform3f("specular_albedo",1.0f,1.0f,1.0f);
   perFragmentShader.setUniform1f("specular_power",30.0f);   
   perFragmentShader.setUniform3f("diffuse_albedo",
				  diffuse_color.r,
				  diffuse_color.g,
				  diffuse_color.b);
   
   //draw the teapot to the frame buffer
   model.drawFaces();
   
   perFragmentShader.end();
   
   fbo.end();


   float blurX = ofMap(mouseX,0,ofGetWidth(),0,10,true);
   float blurY = ofMap(mouseY,0,ofGetHeight(),0,10,true);
   float blur = (blurX + blurY) * 0.5f;
   
   fboBlurXPass.begin();

   blurPassX.begin();
   blurPassX.setUniform1f("blurAmnt",blur);

   fbo.draw(0,0);
   
   blurPassX.end();
   
   fboBlurXPass.end();


   fboBlurYPass.begin();

   blurPassY.begin();
   blurPassY.setUniform1f("blurAmnt",blur);

   fboBlurXPass.draw(0,0);

   blurPassY.end();   
   
   fboBlurYPass.end();      
}

//--------------------------------------------------------------
void ofApp::draw()
{
   
   ofBackground(ofFloatColor(0.5,0.5,0.5,1.0));

   ofFill();
   
   camera.begin();

   //bind the fbo texture we have rendered to
   ((enableDepth) ? fboBlurYPass.getDepthTexture().bind() : fboBlurYPass.getTextureReference().bind());
   //((enableDepth) ? fbo.getDepthTexture().bind() : fbo.getTextureReference().bind());

   box.draw();

   ((enableDepth) ? fboBlurYPass.getDepthTexture().unbind() : fboBlurYPass.getTextureReference().unbind());
   //((enableDepth) ? fbo.getDepthTexture().unbind() : fbo.getTextureReference().unbind());
      
   camera.end();

}

Any hint folks ?

Thanks

Hi folks,

I believe that i did not explain well enough in my last post. Initially, i render a rotating teapot into a ofFbo texture through a phong shader. This part worked fine. Then i wanted to extend it by incorporating a blur pass to the output of the first ofFbo color texture and then i get blank texture wrapped around each face of the box.

Any hint on what might have went wrong ?

Thanks

Hi folks,

I manage to get something better. I used to get blank. Now i see the still teapot model that i am rendering to texture through a phong shader and two passes to blur shaders. But the blur effect is totally absent. I must be doing something theoritically wrong. Let’s try it once again. I have 3 ofFbo objects.

  1. Inside the setup() i allocate the resources fro the fbos along with some other initialization as follows:

    void ofApp::setup()
    {
    //disable depth initially
    enableDepth = false;

    ofSetVerticalSync(true);
            
    ofEnableAntiAliasing();
     
    //load the model
    model.loadModel("teapot.obj",true);
    model.enableNormals();
    model.enableTextures();
    
    //define the diffuse color that will be
    //interacted by the user
    diffuse_color =  ofFloatColor(0.5,0.2,0.7,1.0);
    
          
    //load the programmable shaders
    if(ofIsGLProgrammableRenderer())
    {
       perFragmentShader.load("shaders/shader-gauraud-fragment");
    
       blurPassX.load("shaders/shader-blurX");
       blurPassY.load("shaders/shader-blurY");      
    }
    else
    {
       std::cout << "Programmable Shading is not supported. " << std::endl;
       exit();
    }
    
    //texture width and height is set
    //as the window width and height
    texture_width = ofGetWidth();
    texture_height = ofGetHeight();
    
    
    //declare a fbo setting object
    //to store the fbo setting value
    ofFbo::Settings s;
    
    //define the fbo settings parameter
    s.width = texture_width;
    s.height = texture_height;
    //i demand more accuracy
    s.internalformat = GL_RGBA32F;
    s.useDepth = true;
    
    //NOW I GET TO SEE SOMETHING AFTER I SET THE
    //FLAG TO FALSE - DO NOT KNOW WHY !!
    s.depthStencilAsTexture = false;
    
    //allocate buffer for the fbo
    fbo.allocate(s);
    fboBlurXPass.allocate(s);
    fboBlurYPass.allocate(s);
    
    if(!fbo.isAllocated() ||
       !fboBlurXPass.isAllocated() ||
       !fboBlurYPass.isAllocated() )
    {
       std::cerr << "Fbo allocation was not successful." << std::endl;
       OF_EXIT_APP(0);
    }
    
    fbo.begin();
    ofClear(255,255,255,0);
    fbo.end();
    
    fboBlurXPass.begin();
    ofClear(255,255,255,0);   
    fboBlurXPass.end();
    
    fboBlurYPass.begin();
    ofClear(255,255,255,0);   
    fboBlurYPass.end();
    
    
    //the set function will be called internally
    //so we do not need to call the set the function
    box.resizeToTexture(fboBlurYPass.getTextureReference());
    
    //the box primitive will be rendered with vbo
    box.setUseVbo(true);
    
    box.mapTexCoordsFromTexture( fboBlurYPass.getTextureReference() );
    
    gui = new ofxUISuperCanvas("Blinn-Phong Parameters");
    
    gui->addSpacer();
    gui->addSlider("Red",0,1,&(diffuse_color.r));
    gui->addSlider("Green",0,1,&(diffuse_color.g));
    gui->addSlider("Blue",0,1,&(diffuse_color.b));
    
    gui->autoSizeToFitWidgets();
    ofAddListener(gui->newGUIEvent,this,&ofApp::guiEvent);	          
    

    }

Then the whole fbo rendering happens inside the update() function - not sure though if it is a good choice.

  1. The animated teapot is rendered to the first fbo through the phong shader. I get to see the output to each of the faces of the box if the fbo texture is bound.

  2. Then i render the contents of the first fbo to the second fbo through the blur shader (x-direction). i bind the texture of the second fbo i do not see the animated teapot model, but a still model.

I have more passes to go . But i am stuck here.

Any thoughts ?

Thanks