raising Balloons with clouds

mySketch
clouds
xxxxxxxxxx
 
const colourPalette = [
  "#EFEECCC6",
  "#FE8B05C9",
  "#FE05579E",
  "#400403BF",
  "#0AABBAAF",
  "#E4DED0D3",
  "#ABCCBDC6", 
  "#7DBEB8C1",
  "#181619B5",
  "#E32F21B7"
]
​
const balloonsArray = [];
​
​
function setup() {
  noStroke()
  createCanvas(windowWidth, windowHeight);
  makeClouds(width,height)
  
}
​
function draw() {
  background("#ebf7f8");
  drawClouds(cloudsArray)
  drawBalloons(balloonsArray);
  moveBalloons(balloonsArray);
}
​
​
function makeBalloons(posX, posY) {
  let oneBalloon = {
    x: posX,
    y: posY,
    size: random(50, 100),
    diameter: random(1, 1.3),
    probability: round(random(0, 1), 1),
    speed: random(1, 3),
    colour: random(colourPalette)
  }
  return balloonsArray.push(oneBalloon);
}
​
function drawBalloons(arr) {
  for (const eachBalloon of balloonsArray) {
    let acrossDi = eachBalloon.size;
    let straightDi = eachBalloon.size * eachBalloon.diameter;
    // balloon string
    stroke(eachBalloon.colour)
    noFill();
    strokeWeight(1.5)
    bezier(eachBalloon.x, eachBalloon.y + straightDi / 2 + 10, eachBalloon.x + acrossDi * 0.8, eachBalloon.y + straightDi, eachBalloon.x - acrossDi, eachBalloon.y + straightDi, eachBalloon.x, eachBalloon.y + straightDi + 100);
    //balloon body
    fill(eachBalloon.colour)
    noStroke()
    ellipse(eachBalloon.x, eachBalloon.y, acrossDi, straightDi);
    triangle(eachBalloon.x, eachBalloon.y + straightDi / 2 - 5, eachBalloon.x - 10, eachBalloon.y + straightDi / 2 + 10, eachBalloon.x + 10, eachBalloon.y + straightDi / 2 + 10)
    //balloon shadow
    let p1 = {
      x: eachBalloon.x,
      y: eachBalloon.y
    };
    let p2 = {
      x: eachBalloon.x+acrossDi/2-15,
      y: eachBalloon.y-straightDi/4
    };
    let p3 = {
      x: eachBalloon.x+acrossDi/2-15,
      y: eachBalloon.y+straightDi/4
    };
    let p4 = {
      x: eachBalloon.x,
      y: eachBalloon.y
    };
    stroke("rgba(255,255,255,0.8)")
    strokeWeight(5)
    curve(p1.x, p1.y, p2.x, p2.y, p3.x, p3.y, p4.x, p4.y);
  }
}
​
function moveBalloons(arr) {
​
  for (const eachBalloon of balloonsArray) {
    if (eachBalloon.y > 15) {
      eachBalloon.y -= eachBalloon.speed;
      eachBalloon.x = eachBalloon.x + random(-0.8, +0.8);
    } else if (eachBalloon.probability <= 0.3) {
      eachBalloon.y = -500
    } else {
      sleep(2000).then(function() {
    eachBalloon.y = -500
  })
    }
  }
}
​
function mousePressed() {
  noStroke()
  makeBalloons(mouseX, mouseY);
}
​
function sleep(millisecondsDuration)
{
  return new Promise((resolve) => {
    setTimeout(resolve, millisecondsDuration);
  })
}
​
​
​
​