Add alpha blending

We should have a method for alpha blending. This is required to be able to do contrast calculations properly (see https://github.com/w3c/csswg-drafts/issues/7358 ).

Things to decide:

• Naming: Perhaps overlay() or over()? Or overlayOn() or just on() which is more clear as a Color method, but not so much in the procedural API (See overlayOn(color1, color2) vs color1.overlayOn(color2)). Whatever we come up with should make sense in both APIs, so I’m leaning toward over() which is also the operator name.
• Is there any reason for it to take more than 2 arguments? My understanding is that the operator is associative.

The math seems pretty straightforward. @svgeesus are there any considerations when applying this to other color spaces? What color space do we use for the result? I guess the color space of the color being overlaid?

[facelessuser]

What missteps did you have?

• I forgot to undo the premultiplication after the blending was done. This broke the associative nature. That was just a dumb mistake on my part.
• It also seems that some of the operator algorithms can exceed 0 and 1 for αo (Lighter for instance). I initially didn’t clamp them, and instead applied them, and then the final color would have the alpha clamped. But I realized that to mimic browsers, I needed to clamp αo then apply it.

EDIT: Just to clarify, clamping αo is specifically related to premultiplication as well, and in my case, I was using it to undo premultiplication on each channel without first clamping it to a realistic 0 - 1 range. Basically, all my issues were related to undoing premultiplication.

[facelessuser]

Let’s focus on alpha blending for now please.

As someone that has already gone down this road, if you add support for source-over compositing and normal alpha blending, you have everything you need to do the others, you can just swap out different compositing and blend methods. So the key is just to make sure the compositing step and the blend step is generic. I think that is the main point that is being conveyed.

Though I had some missteps in the beginning 😅, I can pretty much mimic what browsers are doing now.