​

function setup() {

  createCanvas(640, 480);

  textSize(18);

}

​

function draw() {

  if (!serialActive) {

     //setting up the serial port information

    background(255);

    text("Press Space Bar to select Serial Port", 20, 30);

  } else {

    background(255);

    text("Connected", 20, 30);

    //reading the distance sent from arduino onto width of computer

    let mappedDistance = map(distance, 0, 50, 0, width); 

    //preventing ball from extending beyond the screen

    mappedDistance = constrain(mappedDistance, 0, width); 

    ellipse(mappedDistance, height / 2, 25, 25);

    //actually drawing the circle

  }

}

​

function keyPressed() {

  if (key == " ") {

    setUpSerial(); 

  }

}

​

function readSerial(data) {

  //reading the distance value given by arduino

  if (data != null) {

    distance = int(data); 

  }

}