The globalCompositeOperation is only set in the animate function, so when a user decides not to animate the punchout effect, only the image is rendered, not the text.
The fix itself was easy (finding it was not, since I set animation to false directly after downloading):
add context.globalCompositeOperation = 'source-atop'; to line 125.
Original:
img.onload = function() {
if(that.animate == true) {
window.setTimeout(animate,interval)
} else {
context.drawImage(img,0,down)
}
}
Changed to:
img.onload = function () {
if (that.animate == true) {
window.setTimeout(animate, interval);
} else {
context.globalCompositeOperation = 'source-atop'; //this is line 125 in the original file.
context.drawImage(img, 0, down);
}
}
Thank you for your efforts, I really like the effect.