So I worked on this code last night, and i have it kind of working, so that if you click on the small red boxes and drag them they change accordingly. However, the process isn't as smooth as I'd like it to be.

Could someone see a way to fix it? To make the drag smoother?

float x=100;
float y=100;
float w = 30;
float h = 30;

void setup() {
 size(230, 230);
 frameRate(30);

 refresh();
}

void draw() {
 fill(255);

 if (mousePressed) {
   //test to see if you touched to top middle mini rect
   if (mouseX >= x+w/2-3 && mouseY >= y-3 && mouseX <= x+w/2+3 && mouseY <= y+3) {
     println("You have touched the top mini rect!");

     h = h+(y-mouseY);
     y = mouseY;
   }
   
   //test to see if you touched the bottom left corner mini rect
   if (mouseX >= x-3 && mouseY >= y+h-3 && mouseX <= x+3 && mouseY <= y+h+3) {
     println ("You have touched the bottom left corner mini rect!");
     
     w = w+(x-mouseX);
     h = h+(mouseY-(h+y));
     x = mouseX;
   }
   
   refresh();
 }
}


void refresh() {
 fill(100);
 rect(0,0,230, 230);

 fill(255);
 rect(x, y, w, h);

 fill(255,0,0);
 rect(x+w/2-3, y-3, 6, 6);
 rect(x-3, y+h-3, 6, 6);

 fill(0);
 rect(x-3,y-3, 6, 6);
 rect(x-3, y+h/2-3, 6, 6);
 rect(x+w-3,y-3, 6, 6);
 rect(x+w/2-3, y+h-3, 6, 6);
 rect(x+w-3, y+h-3, 6, 6);
 rect(x+w-3, y+h/2-3, 6, 6);
}