Class: RenderPasses

points.RenderPasses()

List of predefined Render Passes for Post Processing.

Constructor

new RenderPasses()

Source:: RenderPasses.js, line 46

Example

import Points, { RenderPass, RenderPasses } from 'points';
const points = new Points('canvas');

let renderPasses = [
    new RenderPass(vert1, frag1, compute1),
    new RenderPass(vert2, frag2, compute2)
];

RenderPasses.grayscale(points);
RenderPasses.chromaticAberration(points, .02);
RenderPasses.color(points, .5, 1, 0, 1, .5);
RenderPasses.pixelate(points, 10, 10);
RenderPasses.lensDistortion(points, .4, .01);
RenderPasses.filmgrain(points);
RenderPasses.bloom(points, .5);
RenderPasses.blur(points, 100, 100, .4, 0, 0.0);
RenderPasses.waves(points, .05, .03);

await points.init(renderPasses);

update();

function update() {
    points.update();
    requestAnimationFrame(update);
}

Methods

asyncstaticadd(points, renderPassId, params) → Promise:.<void:>

Adds a RenderPass from the RenderPasses list

Parameters:

Name	Type	Description
`points`	Points	References a `Points` instance
`renderPassId`	RenderPasses	Select a static property from `RenderPasses`
`params`	Object	An object with the params needed by the `RenderPass`

Source:: RenderPasses.js, line 76

Returns:

Type:: Promise:.<void:>

asyncstaticbloom(points, amount) → Promise:.<void:>

Bloom postprocessing. Increases brightness of already bright areas to create a haze effect.

Parameters:

Name	Type	Description
`points`	Points	a `Points` reference
`amount`	Number	how bright the effect will be

Source:: RenderPasses.js, line 157

Returns:

Type:: Promise:.<void:>

asyncstaticblur(points, resolutionX, resolutionY, directionX, directionY, radians) → Promise:.<void:>

Blur postprocessing. Softens an image by creating multiple samples.

Parameters:

Name	Type	Description
`points`	Points	a `Points` reference
`resolutionX`	Number	Samples in X
`resolutionY`	Number	Samples in Y
`directionX`	Number	direction in X
`directionY`	Number	directon in Y
`radians`	Number	rotation in radians

Source:: RenderPasses.js, line 171

Returns:

Type:: Promise:.<void:>

asyncstaticchromaticAberration(points, distance) → Promise:.<void:>

Chromatic Aberration postprocessing. Color bleeds simulating a lens effect without distortion.

Parameters:

Name	Type	Description
`points`	Points	a `Points` reference
`distance`	Number	from 0..1 how far the channels are visually apart from each other in the screen, but the value can be greater and negative

Source:: RenderPasses.js, line 116

Returns:

Type:: Promise:.<void:>

asyncstaticcolor(points, r, g, b, a, blendAmount) → Promise:.<void:>

Color postprocessing

Parameters:

Name	Type	Description
`points`	Points	a `Points` reference
`r`	Number	red
`g`	Number	green
`b`	Number	blue
`a`	Number	alpha
`blendAmount`	Number	how much you want to blend it from 0..1

Source:: RenderPasses.js, line 97

Returns:

Type:: Promise:.<void:>

asyncstaticfilmgrain(points) → Promise:.<void:>

Film grain postprocessing. White noise added to the output to simulate film irregularities.

Parameters:

Name	Type	Description
`points`	Points	a `Points` reference

Source:: RenderPasses.js, line 147

Returns:

Type:: Promise:.<void:>

asyncstaticgrayscale(points) → Promise:.<void:>

Grayscale postprocessing. Takes the brightness of an image and returns it; that makes the grayscale result.

Parameters:

Name	Type	Description
`points`	Points	a `Points` reference

Source:: RenderPasses.js, line 106

Returns:

Type:: Promise:.<void:>

asyncstaticlensDistortion(points, amount, distance) → Promise:.<void:>

Lens Distortion postprocessing. A fisheye distortion with chromatic aberration.

Parameters:

Name	Type	Description
`points`	Points	a `Points` reference
`amount`	Number	positive or negative value on how distorted the image will be
`distance`	Number	of chromatic aberration: from 0..1 how far the channels are visually apart from each other in the screen, but the value can be greater and negative

Source:: RenderPasses.js, line 138

Returns:

Type:: Promise:.<void:>

asyncstaticpixelate(points, width, height) → Promise:.<void:>

Pixelate postprocessing. It reduces the amount of pixels in the output preserving the scale.

Parameters:

Name	Type	Description
`points`	Points	a `Points` reference
`width`	Number	width of the pixel in pixels
`height`	Number	width of the pixel in pixels

Source:: RenderPasses.js, line 127

Returns:

Type:: Promise:.<void:>

asyncstaticwaves(points, scale, intensity) → Promise:.<void:>

Waves postprocessing. Distorts the image with noise to create a water like effect.

Parameters:

Name	Type	Description
`points`	Points	a `Points` reference
`scale`	Number	how big the wave noise is
`intensity`	Number	a soft or hard effect

Source:: RenderPasses.js, line 182

Returns:

Type:: Promise:.<void:>