Used to apply postprocessing, i.e. draw meshes to a Texture and then draw a FullscreenPlane using that texture as an input.

A ShaderPass could either post process the whole scene or just a bunch of meshes using a specific RenderTarget.

// set our main GPUCurtains instance
const gpuCurtains = new GPUCurtains({
container: '#canvas' // selector of our WebGPU canvas container
})

// set the GPU device
// note this is asynchronous
await gpuCurtains.setDevice()

// create a ShaderPass
const shaderPass = new ShaderPass(gpuCurtain, {
label: 'My shader pass',
shaders: {
fragment: {
code: shaderPassCode, // assume it is a valid WGSL fragment shader
},
},
})

Hierarchy (View Summary)

Constructors

Properties

type: string

The type of the FullscreenPlane.

size: { document: RectBBox }

Object defining the FullscreenPlane size.

Type declaration

uuid: string

The universal unique id of the MeshBaseClass

index: number

Index of this MeshBaseClass, i.e. creation order

renderer: Renderer

The Renderer used

material: RenderMaterial

Geometry used by this MeshBaseClass

outputTarget: RenderTarget

RenderTarget to render this Mesh to instead of the canvas context, if any.

additionalOutputTargets?: RenderTarget[]

Additional output RenderTarget onto which render this Mesh, besides the main outputTarget or screen. Useful for some effects that might need to render the same Mesh twice or more. Beware tho that the Mesh pipeline has to exactly fit the provided RenderTarget render passes descriptors as no checks will be performed here.

renderBundle: RenderBundle

RenderBundle used to render this Mesh, if any.

renderOrder: number

Controls the order in which this MeshBaseClass should be rendered by our Scene

_transparent: boolean

Whether this MeshBaseClass should be treated as transparent. Impacts the render pipeline blend properties

_visible: boolean

Flag indicating whether to draw this MeshBaseClass or not

_ready: boolean

Flag indicating whether this MeshBaseClass is ready to be drawn

userData: Record<string, unknown>

Empty object to store any additional data or custom properties into your Mesh.

_onReadyCallback: () => void

function assigned to the onReady callback

_onBeforeRenderCallback: () => void

function assigned to the onBeforeRender callback

_onRenderCallback: () => void

function assigned to the onRender callback

_onAfterRenderCallback: () => void

function assigned to the onAfterRender callback

_onAfterResizeCallback: () => void

function assigned to the onAfterResize callback

onReady: (callback: () => void) => MeshBaseClass | ProjectedMeshBaseClass

Callback to execute when a Mesh is ready - i.e. its material and geometry are ready.

Type declaration

onBeforeRender: (callback: () => void) => MeshBaseClass | ProjectedMeshBaseClass

Callback to execute before updating the Scene matrix stack. This means it is called early and allows to update transformations values before actually setting the Mesh matrices (if any). This also means it won't be called if the Mesh has not been added to the Scene. The callback won't be called if the Renderer is not ready or the Mesh itself is neither ready nor visible.

Type declaration

onRender: (callback: () => void) => MeshBaseClass | ProjectedMeshBaseClass

Callback to execute right before actually rendering the Mesh. Useful to update uniforms for example. The callback won't be called if the Renderer is not ready or the Mesh itself is neither ready nor visible.

Type declaration

onAfterRender: (callback: () => void) => MeshBaseClass | ProjectedMeshBaseClass

Callback to execute just after a Mesh has been rendered. The callback won't be called if the Renderer is not ready or the Mesh itself is neither ready nor visible.

Type declaration

onAfterResize: (callback: () => void) => MeshBaseClass | ProjectedMeshBaseClass

Callback to execute just after a Mesh has been resized.

Type declaration

inputTarget: RenderTarget

Optional input RenderTarget to assign to the ShaderPass. Used to automatically copy the content of the given RenderTarget texture into the ShaderPass renderTexture.

Options used to create this ShaderPass

Accessors

Methods