Hello everybody! Hope you can help me out :)

I've made this little program were if you press the mouse all these balls execute from a while loop. If I click on the 0, 0 coordinates of the canvas I get all the balls going to the center of the screen which is fine but I want this to happen when you click in the center of the screen instead on the 0, 0 coordinates of the canvas.

As a second "improvement" I would like to make the 0, 0 coordinates follow the mouse position on the canvas. I guess this must be done with the translate function but I'm not able to do it.

I'm slowly learning how to code so apologize if my code looks terrible... hehe

Thank you!

1. void setup() {
2.   size(screen.width, screen.height);
3.   ellipseMode(CENTER);
4.   colorMode(HSB);
5.   background(174, 25, 0);
6.   smooth();
7. }
8. 
   
9. void draw() {
10.   // Background Fade Out Effect
11.   frameRate(8);
12.   fill(174, 25, 0, 30);
13.   noStroke();
14.   rect(0, 0, width, height);
15. 
    
16.   // Pelotitas Function Calling
17.   if(mousePressed) {
18.     pelotitas(mouseX/2, mouseY/2);
19.   }
20. }
21. 
    
22. void pelotitas(int x, int y) {
23.   // Variables declaration
24.   float i = random(50);
25.   float u = random(50);
26.   int j = 15;
27. 
    
28.   // Translation to make circle in the middle of the screen, not in 0,0
29.   translate(width/2, height/2);
30. 
    
31.   // While Loop
32.   while(i < width & u < height) {
33.     noStroke();
34.     fill(174, random(0, 99), random(0, 99));
35.     rotate(random(5, 30));
36.     ellipse(random(x, i), random(y, i), random(j), j);
37.     i++;
38.     u++;
39.   }
40. }