From 004e96f49b209f15a75ff7c6c1b4bb472d7f984e Mon Sep 17 00:00:00 2001 From: Erik Onarheim Date: Mon, 5 Aug 2024 08:02:09 -0500 Subject: [PATCH] docs: Add links to materials <-> postprocessors --- site/docs/04-graphics/4.2-material.mdx | 3 +++ site/docs/12-other/12-post-processors/index.mdx | 10 +++++++++- 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/site/docs/04-graphics/4.2-material.mdx b/site/docs/04-graphics/4.2-material.mdx index 85db06f51..c2530b53e 100644 --- a/site/docs/04-graphics/4.2-material.mdx +++ b/site/docs/04-graphics/4.2-material.mdx @@ -15,12 +15,15 @@ declare const game: ex.Engine; Sometimes you need even more control about how your graphics render in your game! For example you might want a custom blend, a reflection effect, or a warping effect. With this api you can provide custom shaders to graphics. +If you want to apply a shader to the whole screen check out [PostProcessors](/docs/postprocessors) + :::warning Materials are only supported in WebGL mode, this is the default mode for Excalibur but if you switch or fallback to 2D Canvas materials will not have an effect. ::: + ## Creating Materials We recommend using the [[ExcaliburGraphicsContext.createMaterial]] method to create materials. diff --git a/site/docs/12-other/12-post-processors/index.mdx b/site/docs/12-other/12-post-processors/index.mdx index 14b3141ea..14dfcac61 100644 --- a/site/docs/12-other/12-post-processors/index.mdx +++ b/site/docs/12-other/12-post-processors/index.mdx @@ -6,6 +6,14 @@ section: Graphics [[PostProcessor|PostProcessors]] are a way to quickly modify every pixel on the screen with WebGL fragment shaders. This can be useful to give your game a certain aesthetic or effect. +:::warning + +PostProcessors are only supported in WebGL mode, this is the default mode for Excalibur but if you switch or fallback to 2D Canvas materials will not have an effect. + +::: + +If you want to do per actor shaders check out [Materials](/docs/materials) + ## Color Blindness Choosing colors that are friendly to players with color blindness is an important consideration when making a game. @@ -66,7 +74,7 @@ Post processors can also be use to produce some interesting custom effects. There is a helper class [[ScreenShader]] to help build shaders for post processing. The only things that come predefined are the: 1. `v_texcoord` representing the current UV from [0, 1] -2. `u_texture` which is the texture representing the screen pixels +2. `u_image` which is the texture representing the screen pixels In this example we can make the entire game gray scale: