How do I make the tint decrease after mouseX reaches a certain point ?

GreenTea

so I did this drawing of an eclipse and I added a tint that increases with mouseX but I would like it to decrease after mouseX reaches width/2. I tried my best with loops and stuff but I can't seam to figure out how I can make it to decrease. Any help is appreciated :)

 Sun ziSun;
Moon ziMoon;
PGraphics pg;
void setup(){
  size(200,200);
  ziSun = new Sun(width/2, height/2, 100);
  ziMoon = new Moon(90,20,100);
  pg = createGraphics(200,200);
}

void draw(){
  background(135,206,235);
  cloud();
  ziSun.hiu(color(184,134,11),1);
  ziSun.hiu(color(244,175,44),2);
  ziSun.hiu(color(255,215,0),1.5);
  ziSun.display();
  ziMoon.display();

  pg.beginDraw();
  pg.background(0,255);
  pg.endDraw();
  image(pg,0,0);

                  //HERE IS THE TINT PROBLEM
                  // lol just this line
  tint(0,mouseX);
}







void cloud(){
  float leftX = 45;
  float rightX = 200;
  fill(255);
    ellipse(rightX, 50, 126, 97);
    ellipse(rightX+50, 50, 70, 60);
    ellipse(rightX-50, 50, 70, 60);
    ellipse(leftX, 150, 126, 97);
    ellipse(leftX+62, 150, 70, 60);
    ellipse(leftX-62, 150, 70, 60);
}

class Moon{
  float size;
  float posx;
  float posy;

  Moon(float saz, float xpos, float ypos){
    size=saz;
    posx = xpos;
    posy = ypos;
  }

  void display(){
    fill(0);
    ellipse(mouseX,posy,size,size);
  }

}

class Sun{
  float posx;
  float posy;
  float size;
  color c;
  float thickness;
  Sun(float xpos, float ypos, float saz){
    posx = xpos;
    posy = ypos;
    size = saz;
  }

  void display(){
    noStroke();
    fill(244,175,44);
    ellipseMode(CENTER);
    ellipse(posx,posy,size,size);
  }

  void hiu(color cola, float strokewzn){
    c = cola;
    thickness = strokewzn;
    float[] lights = new float[10];
    for (int i=0; i<lights.length; i++){
    stroke(cola);
    strokeWeight(strokewzn);
    line(posx,posy,random(width),random(height));
    }
  }
}

Dinoswarleafs

  if (mouseX < width / 2)
   mouseDistance = mouseX;
  else mouseDistance = abs(width - mouseX);
  tint(0, mouseDistance);

If the mouse is past half way of the screen, get the distance from the length of the window to where the mouse is. If it's less than halfway just get it's current value. This way the value of 100 pixels out from the left side of the screen and 100 from the right side of the screen will be the same value, and it will be the most in the middle. Take this value as the tint instead.

There may be a more clever method but this one seems to work fine :P

Edit :

Another way could just be

  mouseDistance = abs(width/2 - mouseX);
  mouseDistance = width - mouseDistance;
  tint(0, mouseDistance);

It takes the distance from the middle and subtracts it from the width, so the closer you are to the middle the larger the value. Then this is how much you tint it. Either way works, I like the first one more for some reason o.O

GreenTea

@Dinoswarleafs Thank you so much !