Multiple random walkers moving up or down version 2

mySketch
xxxxxxxxxx
 
circleArray1 = []
circleArray2 = []
const step = 3
let direction1 = 'downright'
let direction2 = 'upleft'
directions = ['downright', 'upleft']
​
function setup() {
  createCanvas(600, 600);
  background('grey');
  frameRate(20)
  colours1 = [
    "#f9cdad",
    "#c8c8a9",
    "#83af9b"
  ]
  colours2 = [
    "#fe4365",
    "#fc9d9a",
  ]
​
​
​
  //  for (let i = 0; i < 1000; i++) {
  //    let c = {
  //      x: random(0, 600),
  //      y: random(0, 600),
  //      colour: random(colours),
  //      // direction: random(directions)
  //    }
  //    circleArray.push(c)
  //  }
  // }
​
  for (let i = 0; i < 100; i++) {
    let c1 = {
      x: 0,
      y: random(0, 600),
      colour: random(colours1)
    }
    circleArray1.push(c1)
  }
​
  for (let i = 0; i < 1000; i++) {
    let c2 = {
      x: 600,
      y: random(0, 600),
      colour: random(colours2)
    }
    circleArray2.push(c2)
  }
​
}
​
function draw() {
  drawMultipleWalkersc1()
  drawMultipleWalkersc2()
  moveMultipleWalkerRight()
  moveMultipleWalkerLeft()
​
  //if frame count is a multiple of 30
  //  change direction
​
  if ((frameCount % 10) === 0) {
    changeDirectionLeft()
    changeDirectionRight()
  }
​
​
​
}
​
function drawMultipleWalkersc1() {
  for (let c of circleArray1) {
​
    circle(c.x, c.y, 10);
    fill(c.colour);
    // noStroke();
  }
}
​
function drawMultipleWalkersc2() {
  for (let c of circleArray2) {
​
    circle(c.x, c.y, 10);
    fill(c.colour);
    // noStroke();
  }
}
​
function mousePressed() {
  changeDirectionRight()
}
​
function changeDirectionRight() {
  if (direction1 === 'downright') {
    direction1 = 'upright'
  } else {
    direction1 = 'downright'
  }
}
​
function changeDirectionLeft() {
  if (direction2 === 'downleft') {
    direction2 = 'upleft'
  } else {
    direction2 = 'downleft'
  }
}
​
function moveMultipleWalkerRight() {
  for (let c of circleArray1) {
    if (direction1 === 'downright') {
      c.x += step
      c.y += step
    } else {
      c.x += step
      c.y += -step
    }
  }
}
​
function moveMultipleWalkerLeft() {
  for (let c of circleArray2) {
    if (direction2 === 'downleft') {
      c.x += -step
      c.y += step
    } else {
      c.x += -step
      c.y += -step
    }
  }
}
​
​
// function moveMultipleWalker() {
//  for (let c of circleArray) {
//    if (c.x > 600 || c.y < 0) {
//      c.x = random(0, 600)
//      c.y = random(0, 600)
//    } else {
//      c.x += step
//      c.y += -step
//    }
​
//    // c.x += random(-step, step)
//    // c.y += random(-step, step)
//  }
​
// }
​
// make direction that goes right or down
​
​
// frame count 
​
// for the first five frames go up
​
// for the next five go down
​
// or 
// variable that represents the direction, right or down, boolean
​
// move all the circles according to the direction 