How to pass a texture to second uniform sampler2D in custom pipeline/shader?

[Gordon G]

I have a frag shader that requires two sampler2Ds to render, one mainTexture, second one is a map texutre, I probably need a third texture to do the job but I could even get second one pass to shader.

I know there are two approaches, with custom pipeline or custom shader. I search around and but got limited resources on this topic. From there I couldn't get second texture working.

Does anyone know how to do it? If you had time could you add some pseudo code for an example?

Much appreciated.

[Gordon G]

answering my own question, huge thanks for the help to rexrainbow from phaser3 discord

pipeline code

class CausticPipeline extends Phaser.Renderer.WebGL.Pipelines.PostFXPipeline {
   constructor(game) {
      super({
         game: game,
         fragShader: CausticFrag,
         renderTarget: true,
      });
   }

   onBoot() {
      this.targetTexture = this.game.textures.get('caustic').source[0].glTexture;
      this.set1i('uMainSampler2', 1);
   }

   onDraw(renderTarget){
      this.bindTexture(this.targetTexture, 1);
      this.bindAndDraw(renderTarget);
   }
}

main code

let t = this.add.image(600, 600, "tent@4x", "tent/learning-tent0");
this.renderer.pipelines.addPostPipeline('causticPipeline', CausticPipeline);
t.setPostPipeline('causticPipeline');

 

in my shader code I used 'uniform sampler2d uMainSampler2' for my second texture, then use tex2D to sample the texture.

 

Edited August 28, 2021 by Gordon G