Handle premultiplied alpha in filter(OPAQUE)

src/image/pixels.js

@@ -298,7 +298,6 @@ p5.prototype._copyHelper = (
   dw,
   dh
 ) => {
-  srcImage.loadPixels();
   const s = srcImage.canvas.width / srcImage.width;
   // adjust coord system for 3D when renderer
   // ie top-left = -width/2, -height/2

src/webgl/shaders/filters/opaque.frag

@@ -8,5 +8,5 @@ uniform sampler2D tex0;
 
 void main() {
   vec4 color = texture2D(tex0, vTexCoord);
-  gl_FragColor = vec4(color.rgb, 1.0);
+  gl_FragColor = vec4(color.rgb / color.a, 1.0);
 }

src/webgl/shaders/filters/posterize.frag

@@ -23,7 +23,7 @@ vec3 quantize(vec3 color, float n) {
 void main() {
   vec4 color = texture2D(tex0, vTexCoord);
 
-  vec3 restrictedColor = quantize(color.rgb, filterParameter);
+  vec3 restrictedColor = quantize(color.rgb / color.a, filterParameter);
 
-  gl_FragColor = vec4(restrictedColor.rgb, color.a);
+  gl_FragColor = vec4(restrictedColor.rgb * color.a, color.a);
 }

src/webgl/shaders/filters/threshold.frag

@@ -15,9 +15,9 @@ float luma(vec3 color) {
 
 void main() {
   vec4 color = texture2D(tex0, vTexCoord);
-  float gray = luma(color.rgb);
+  float gray = luma(color.rgb / color.a);
   // floor() used to match src/image/filters.js
   float threshold = floor(filterParameter * 255.0) / 255.0;
   float blackOrWhite = step(threshold, gray);
-  gl_FragColor = vec4(vec3(blackOrWhite), color.a);
+  gl_FragColor = vec4(vec3(blackOrWhite) * color.a, color.a);
 }