var  x1 = -400, x2 = 400, y1 = 400,y2 = -400; //ordered pairs for y = x
var cnt = 1; //counter to reset animation
function setup() {
  createCanvas(400, 400); //create the canvas
  background(240); //gray background
  frameRate(10); //frame rate or speed
}

function draw() {
  translate(width/2,width/2) //translate the canvas by half the width/height
  //draw diagonal black line at start
  if(cnt ==1){
    stroke(0)//black line
    strokeWeight(1);//thin lines
    line1 = line(x1,y1,x2,y2) //draw line
  }
  stroke(255) //white line
  strokeWeight(0.5);//thin lines
  x3 = random(-400,400);//random ordered pairs for second line:
  y3 = random(-400,400);
  x4 = random(-400,400);
  y4 = random(-400,400);
  findSolution() //call the solution function
  //Only plot lines if the solution lies within the canvas:
  if(xSoln>-200 && xSoln <200 && ySoln<200 && ySoln>-200){
      line(x3,y3,x4,y4) //draw line
  }
  //check cnt number to reset it when it hits 200
  if(cnt > 200 ){
    background(240);//reset canvas
    cnt = 1;//reset counter
    stroke(0)
    strokeWeight(1);//thin lines
    line1 = line(x1,y1,x2,y2) //draw line

  }
}
//function to find solution:
function findSolution(){
  m1 = (y2-y1)/(x2-x1); //find slope1
  m2 = (y3-y4)/(x3-x4);//find slope2
  b1 = (y1-m1*x1);//find y-intercept1
  b2 = (y3-m2*x3);//find y-intercept2
  xSoln = (b1-b2)/(m2-m1);//find soln x value using substitution
  ySoln = m1*xSoln+b1;//find soln y value by evaluating line equation with xSoln
  fill(255,random(255),random(255),40); //random color for circle
  if(ySoln <=0){
    d = -1*ySoln+5;//change diameter of circle based on y value
  }
  if(ySoln >0){
    d = ySoln+5;//change diameter of circle based on y value
  }
  if(xSoln>-200 && xSoln <200 && ySoln<200 && ySoln>-200){
    circle(xSoln,ySoln,d);//circle with diameter of d
  }
  cnt=cnt+1;//increments counter for circles plotted
}