Add shaders for filter() constants, and use them by default in P2D

src/webgl/p5.RendererGL.js

@@ -89,6 +89,8 @@ const filterShaderFrags = {
     readFileSync(join(__dirname, '/shaders/filters/dilate.frag'), 'utf-8'),
   [constants.BLUR]:
     readFileSync(join(__dirname, '/shaders/filters/blur.frag'), 'utf-8'),
+  [constants.POSTERIZE]:
+    readFileSync(join(__dirname, '/shaders/filters/posterize.frag'), 'utf-8')
 };
 const filterShaderVert = readFileSync(join(__dirname, '/shaders/filters/default.vert'), 'utf-8');
 

src/webgl/shaders/filters/posterize.frag

 }, 
 posterize(canvas, level) { 
   const pixels = Filters._toPixels(canvas); 
   if (level < 2 || level > 255) { 
     throw new Error( 
       'Level must be greater than 2 and less than 255 for posterize' 
     ); 
   } 
   const levels1 = level - 1; 
   for (let i = 0; i < pixels.length; i += 4) { 
     const rlevel = pixels[i]; 
     const glevel = pixels[i + 1]; 
     const blevel = pixels[i + 2]; 
     pixels[i] = ((rlevel * level) >> 8) * 255 / levels1; 
     pixels[i + 1] = ((glevel * level) >> 8) * 255 / levels1; 
     pixels[i + 2] = ((blevel * level) >> 8) * 255 / levels1; 
   } 
 }, 
@@ -0,0 +1,34 @@
+// Limit color space for a stylized cartoon / poster effect
+
+precision highp float;
+
+varying vec2 vTexCoord;
+
+uniform sampler2D tex0;
+uniform float filterParameter;
+
+vec3 round(vec3 vals) {
+  // eg. round(5.5) -> 6.0
+  return floor(vals + 0.5);
+}
+
+vec3 quantize(vec3 color, float n) {
+  // restrict values to N options/bins
+  // and round each channel to nearest option
+  //
+  // eg. when N = 5, options = 0.0, 0.25, 0.50, 0.75, 1.0
+  // then posterize (0.1, 0.7, 0.9) -> (0.0, 0.75, 1.0)
+
+  color = color * n;
+  color = round(color);
+  color = color / (n - 1.0);
+  return color;
+}
+
+void main() {
+  vec4 color = texture2D(tex0, vTexCoord);
+
+  vec3 restrictedColor = quantize(color.rgb, filterParameter);
+
+  gl_FragColor = vec4(restrictedColor.rgb, color.a);
+}