let pegSpeed = -1;

​

let scale =8;

​

let strL = 28*scale;

​

let bestDist

​

let Area = 0;

​

function setup() {

  createCanvas(400, 400);

}

​

function draw() {

  background(51);

  fill(255);

  noStroke();

  text(`Distance Between Pegs: ${nf(pegLn/scale, 2, 1)} cm`, 10, 20)

  text(`Length of String: ${round(strL/scale)} cm`, 10, 40)

  text(`Ellipse Area: ${round(Area/(scale*scale))} cm²`, 10, 60)

  stroke(255);

  line(width-40, 40, width-40+scale, 40);

  line(width-60, 60, width-60+scale*5, 60);

  let {mj, mn} = getMajorMinor(strL);

  drawEllipse(mj, mn)

  drawPegs();

  pegLn  += pegSpeed;

  Area = getArea(mj, mn)

  if(pegLn<0) {

    pegSpeed = +1;

  }

  if(pegLn>strL) {

    pegSpeed = -1;

  }

}

​

function drawEllipse(major, minor) {

  push();

  translate(width / 2, height / 2);

  ellipse(0, 0, major * 2, minor * 2)

  // line(0, 0, major, 0)

  // line(0, 0, 0, minor)

  pop();

}

​

function drawPegs() {

  push();

  fill(0);

  translate(width / 2, height / 2);

  ellipse(-pegLn / 2, 0, 10);

  ellipse(pegLn / 2, 0, 10);

  // line(-pegLn/2, 0, pegLn/2, 0)

  pop();

}

​

function getArea(major, minor) {

  return PI * major * minor

}

​

function getMajorMinor(stringLength) {

  // Major

  // ===*-----------*

  let mj = stringLength / 2

  // console.log(mj)

​

  // Minor

  //     /|\

  //   /  |  \

  // /    |    \

  // *---------*

  let mn = sqrt((stringLength / 2) ** 2 - (pegLn / 2) ** 2)

  return {

    mj,

    mn

  }

}