baseFilterShader

Get the base shader for filters.

You can then call baseFilterShader().modify() and change the following hook:

Hook Description

Hook	Description
`vec4 getColor`	Output the final color for the current pixel. It takes in two parameters: `FilterInputs inputs`, and `in sampler2D canvasContent`, and must return a color as a `vec4`. `FilterInputs inputs` is a scruct with the following properties: `vec2 texCoord`, the position on the canvas, with coordinates between 0 and 1. Calling `getTexture(canvasContent, texCoord)` returns the original color of the current pixel. `vec2 canvasSize`, the width and height of the sketch. `vec2 texelSize`, the size of one real pixel relative to the size of the whole canvas. This is equivalent to `1 / (canvasSize * pixelDensity)`. `in sampler2D canvasContent` is a texture with the contents of the sketch, pre-filter. Call `getTexture(canvasContent, someCoordinate)` to retrieve the color of the sketch at that coordinate, with coordinate values between 0 and 1.

vec4 getColor

Output the final color for the current pixel. It takes in two parameters: FilterInputs inputs, and in sampler2D canvasContent, and must return a color as a vec4.

FilterInputs inputs is a scruct with the following properties:

vec2 texCoord, the position on the canvas, with coordinates between 0 and 1. Calling getTexture(canvasContent, texCoord) returns the original color of the current pixel.
vec2 canvasSize, the width and height of the sketch.
vec2 texelSize, the size of one real pixel relative to the size of the whole canvas. This is equivalent to 1 / (canvasSize * pixelDensity).

in sampler2D canvasContent is a texture with the contents of the sketch, pre-filter. Call getTexture(canvasContent, someCoordinate) to retrieve the color of the sketch at that coordinate, with coordinate values between 0 and 1.

Most of the time, you will need to write your hooks in GLSL ES version 300. If you are using WebGL 1, write your hooks in GLSL ES 100 instead.

Examples

Syntax


  
      baseFilterShader()

Parameters

Returns

p5.Shader: The filter shader

Notice any errors or typos? Please let us know. Please feel free to edit src/webgl/material.js and open a pull request!

Related References

copyToContext

Copies the shader from one drawing context to another.

inspectHooks

Logs the hooks available in this shader, and their current implementation.

modify

Returns a new shader, based on the original, but with custom snippets of shader code replacing default behaviour.

setUniform

Sets the shader’s uniform (global) variables.