Animation on Canvas?

Question

css

Hello! Need help with canvas animation.
There is the following animation codepen.io/juniorCh/pen/doEREw
Please tell me how to make it so that when drawing from a picture, when the picture has already, for example, changed the backround by 90% (drawn), it changes it completely (drawn completely)? The second question is how to start another animation after that?
I would be very grateful for any help)

Answer 1

Damn, I read it about 7 times and didn't understand what you mean.
Do you want the picture itself to change after the sketch area > 90% or to change the sketch background itself?

Answer 2

https://developer.mozilla.org/en/docs/Web/API/ImageData
On releasing the mouse, iterate over all the pixels on the canvas and count the number of red pixels.
UPD
codepen.io/andreruffert/pen/pvqly