2. PShader maskShader;
3. PImage srcImage;
4. PGraphics maskImage;
5. PGraphics displayImg;
6. PImage bgImage;
7. 
   
8. 
   
9. void setup() {
10.   size(640, 760, P2D);
11.   srcImage = loadImage("leaves.jpg");
12.   bgImage = loadImage("moonwalk.jpg");
13.   maskImage = createGraphics(srcImage.width,srcImage.height, P2D);
14.   maskImage.noSmooth();
15.   maskShader = loadShader("mask.glsl");
16.   maskShader.set("mask", maskImage);
17.   
18.   
19.   background(255);
20. }
21. 
    
22. void draw() { 
23.   
24.  
25.   imageMode(CENTER);
26.   image(bgImage,width/2,height/2);
27.   
28.     
29.   maskImage.beginDraw();
30.   
31.   maskImage.background(0);
32.   
33.   if (mousePressed == true) {
34.        
35.     maskImage.noStroke();
36.     maskImage.fill(255, 0, 0);
37.     maskImage.ellipse(mouseX, mouseY, 50, 50);
38.       
39.   }
40.   
41.   
42.   maskImage.endDraw();
43. 
    
44.   shader(maskShader);  
45.   image(srcImage, width/2, height/2);
46.   //scaleImage(srcImage);
47.   
48.   
49.   
50.   
51.   
52. }
53. 
    
54. 
    
55. void scaleImage(PImage imageToScale){
56.   
57.   imageMode(CENTER);  
58. 
    
59.     int originalWidth=imageToScale.width;
60.     int originalHeight=imageToScale.height;
61.     int scaledWidth=originalWidth*(height/originalHeight);
62.     int scaledHeight=originalHeight*(width/originalWidth); 
63. 
    
64.     if (imageToScale.width > imageToScale.height) {
65.       //if the image is wider than it is tall: make it as wide as the screen, and increase the height by the same factor
66. 
    
67.       imageToScale.width=width;//the width of the stage
68.       imageToScale.height=scaledHeight;
69.       
70.     }
71.     else {
72.       //same approach for tall images
73.    
74.       imageToScale.height=height;//the height of the stage
75.       imageToScale.width=scaledWidth;
76.       
77.     }
78. }

I was thinking of different ways to get around this. I tried implementing a PGraphics that would do all the drawing, then move and manipulate the PGraphics positioning. However, it seems like I can't do that with the masking shader. beginDraw and endDraw have to go one after another, and can't be "nested" within each other (if I'm interpreting the errors I received correctly).

I'm just not really sure of what the best strategy is for accomplishing this. Automatically scale to screen, be able to position the "drawing stage" wherever I want, and have the X and Y coordinates translate from mouse position to position on the image. Not sure how to properly "encapsulate" everything in a way that I can understand.

Any help or advice would be greatly appreciated.