Postprocessing: Disabling the effect produces a black screen

[edap]

Hi, I'm using the GlitchPass and i want to activate/deactivate the effect only when an event is triggered. I'm using .enabled=false to deactivate the effect, but this turns the whole screen black.

[vanruesc]

Hi!

The screen remains black because no pass renders to it. Make sure that your RenderPass has its renderToScreen flag set to true when the GlitchPass is disabled. You also need to set it back to false when you reactivate the GlitchPass. Otherwise your screen output will be frozen.

An implementation of pass activation/deactivation can be found in the Blur demo (source).

[edap]

If no pass is rendered to it, the normal renderer should do its work, am I correct?
Im' using your library in a class called Effector, and I pass to it an instance of the WebGLRenderer and an instance of THREE.Scene. I've disabled the effect and I've set the renderToScreen value to false but the screen is still black.

import { EffectComposer, GlitchPass, RenderPass,BloomPass} from "postprocessing";

export default class Effector{
    constructor(scene, camera, renderer){
        this.composer = new EffectComposer(renderer);
        this.composer.addPass(new RenderPass(scene, camera));

        this.glitchPass = new GlitchPass();
        this.glitchPass.enabled = false;
        this.glitchPass.renderToScreen = false;
        this.composer.addPass( this.glitchPass );
    }

    render(delta){
        this.composer.render(delta);
    }
}

As far as I see in the example that you've linked, https://github.com/vanruesc/postprocessing/blob/master/demo/blur.js#L296-L302 , to activate and deactivate an effect is mandatory to have a "Combine Pass"

        pass = new ShaderPass(new CombineMaterial(), "texture1");
        pass.material.uniforms.texture2.value = this.savePass.renderTarget.texture;
        pass.material.uniforms.opacity1.value = 1.0;
        pass.material.uniforms.opacity2.value = 0.0;
        pass.renderToScreen = true;
        this.combinePass = pass;
        composer.addPass(pass);

that act as a kind of mixer, am I correct?

[vanruesc]

a "Combine Pass" that act as a kind of mixer, am I correct?

Yes, the purpose of the CombinePass in the Blur demo is to blend the blurred output with the output of the RenderPass. But it's by no means mandatory and should only be seen as an extension to the BlurPass in this particular demo. Both the BlurPass and the CombinePass are enabled and disabled conjointly and act as one.

The EffectComposer is a tool for chaining passes. It's responsible for calling the render methods of all registered passes but it does not behave like a switch-case fall through mechanism and will _not_ try to render something to screen by itself.

Every pass you add to the composer has an undisputable renderToScreen flag which defaults to false. You'll have to decide which of your passes should render to screen. If you explicitly deactivate a pass that was previously rendering to screen, you'll need to let another pass take over that role.

In your example, you could do something like this:

import { EffectComposer, GlitchPass, RenderPass } from "postprocessing";

export default class Effector{

    constructor(scene, camera, renderer){

        this.renderPass = new RenderPass(scene, camera);

        this.glitchPass = new GlitchPass();
        // You only need to decide once if this pass renders to screen.
        this.glitchPass.renderToScreen = true;

        this.composer = new EffectComposer(renderer);
        this.composer.addPass(this.renderPass);
        this.composer.addPass(this.glitchPass);

    }

    setGlitchEnabled(enabled) {

        this.glitchPass.enabled = enabled;

        /* If the glitch pass doesn't do its job anymore, the render pass (or some
        other pass) must take action! If the glitch pass was reactivated, the render
        pass must render to the internal frame buffer again. */
        this.renderPass.renderToScreen = !enabled;

    }

    render(delta){

        this.composer.render(delta);

    }

}

[edap]

Thank you for your clear explanation.

[vanruesc]

Glad I could help! :)

[vin-ni]

Is there no other way to fade the blurPass? I'd like to animate from 0 to 1.

Right now I'm thinking about a combination of resolution and opacity.

[vanruesc]

Is there no other way to fade the blurPass? I'd like to animate from 0 to 1.

The BlurPass is currently not very flexible in that regard because its kernel presets are optimized to produce results that closely match specific Gaussian blur kernels.

I'm planning on adding a scale factor to the BlurPass in the next release to allow animation from 0 to 1.

Please note that I regularly mass-unsubscribe from old issues so you may not get an answer if you post a comment on an old issue. It's better to just open a new issue!

[vin-ni]

thanks for the quick answer. No worries, this library is already amazing. I did it the "savepass" way.