your code
HTML
<script src="http://4.bp.blogspot.com/_Afm6-TcZ7Ho/S67FnPJD0_I/AAAAAAAAC6I/giTT8ePty5E/s1600/bunny.jpg"></script>
<script src="http://bigbackground.com/wp-content/uploads/2013/05/baby-wolf-backgrounds.jpg"></script>
<script type="application/processing">
/* <a rel="nofollow" href="/two/profile/pjs">@pjs</a> preload="http://4.bp.blogspot.com/_Afm6-TcZ7Ho/S67FnPJD0_I/AAAAAAAAC6I/giTT8ePty5E/s1600/bunny.jpg, http://bigbackground.com/wp-content/uploads/2013/05/baby-wolf-backgrounds.jpg";
*/
/*
*
*
*/
PGraphics maskPattern;
PGraphics savedimg;
PImage img1;
PImage img2;
int displayImageX;
int displayImageY;
float scaleFactor;
float centerScaledAdjustedXpos;
float centerScaledAdjustedYpos;
void setup() {
img1 = loadImage("http://4.bp.blogspot.com/_Afm6-TcZ7Ho/S67FnPJD0_I/AAAAAAAAC6I/giTT8ePty5E/s1600/bunny.jpg");
size(800, 800, JAVA2D);
//640,260
maskPattern = createGraphics(img1.width, img1.height);
savedimg = createGraphics(img1.width, img1.height);
img2 = loadImage("http://bigbackground.com/wp-content/uploads/2013/05/baby-wolf-backgrounds.jpg");
scaleFactor=1;
displayImageX = width/2;
displayImageY = height/2;
centerScaledAdjustedXpos=0;
centerScaledAdjustedYpos=0;
}
void draw() {
pushMatrix();
scale(scaleFactor);
background(0);
imageMode(CENTER);
image(img2, displayImageX/scaleFactor, displayImageY/scaleFactor);
if (mousePressed == true) {
maskPaint();
}
img1.mask(maskPattern);
image(img1, displayImageX/scaleFactor, displayImageY/scaleFactor);
popMatrix();
}
void maskPaint() {
centerScaledAdjustedXpos = ((mouseX-displayImageX)/scaleFactor+(maskPattern.width/2));
centerScaledAdjustedYpos = ((mouseY-displayImageY)/scaleFactor+(maskPattern.height/2));
maskPattern.beginDraw();
maskPattern.stroke(255);
maskPattern.fill(255);
maskPattern.ellipse(centerScaledAdjustedXpos, centerScaledAdjustedYpos, 50, 50);
maskPattern.endDraw();
...
JavaScript
var scripts=document.getElementsByTagName("script");
for(var i=0;i<scripts.length;i++) {
if(scripts[i].type=="application/processing"){
var src=scripts[i].src,canvas=scripts[i].nextSibling;
if(src&&src.indexOf("#")){
canvas=document.getElementById(src.substr(src.indexOf("#")+1));
}else{
while(canvas&&canvas.nodeName.toUpperCase()!="CANVAS")
canvas=canvas.nextSibling;
}
if(canvas){
new Processing(canvas,scripts[i].text);
}
}
}