let vorm = []; let n; let x; let xpos=true; let dph=true;
let vijfhoek=true;
function setup() {
  buttonR1 = createButton('reset');
  buttonR1.position(20,30);buttonR1.style('width','50px');
  buttonR1.mouseClicked(buttonR1Action);
  buttonN = createButton('n + -');
  buttonN.position(20,60);buttonN.style('width','50px');
  buttonN.mouseClicked(buttonNAction);
  buttonDPH = createButton('dp h');
  buttonDPH.position(20,90);buttonDPH.style('width','50px');
  buttonDPH.mouseClicked(buttonDPHAction);
  buttonA = createButton('vijfhoek aan/uit');
  buttonA.position(20,120);buttonA.style('width','120px');
  buttonA.mouseClicked(buttonAAction);
  buttonD = createButton('downloaden');
  buttonD.position(20,150);buttonD.style('width','120px');
  buttonD.mouseClicked(buttonDAction);
 
  createCanvas(windowWidth, windowHeight);
  x = width/2;let y = height/2; n = height/5;
  const rl = sqrt(50+10*sqrt(5))*n/10; //rl is de lange straal
  const nphi= ((1+sqrt(5))/2)*n; //nphi is de lijn van hoek naar hoek
  const phi= ((1+sqrt(5))/2); //phi wordt gebruikt in k en bl
  const bl = rl/(2*phi); //bl is de loodlijn van het middelpunt naar de lijn van hoek naar hoek
  let alfa = 100;   let sw = n/100;  let sc = color(0);
  vorm[0] = new Vhoek_n5(n, 0, x, y, 0, color(255,255,0,  alfa),sw*2,color(255,0,0));
  vorm[1] = new Vhoek_n5(n, 1, x, y, 0, color(250,141,245,alfa),sw,sc);
  vorm[2] = new Vhoek_n5(n, 2, x, y, 0, color(111,255,174,alfa),sw,sc);
  vorm[3] = new Vhoek_n5(n, 3, x, y, 0, color(0, 255, 0,  alfa),sw,sc);
  vorm[4] = new Vhoek_n5(n, 4, x, y, 0, color(27,234,240, alfa),sw,sc);
  vorm[5] = new Vhoek_n5(n, 5, x, y, 0, color(186,250,141,alfa),sw,sc);
  vorm[6] = new Vhoek_n5(n, 6, x, y, 0, color(200, 100, 120,alfa),sw,sc);
  vorm[7] = new Vhoek_n5(n, 4, x-nphi/2, y-bl,0,color(255,207,111,alfa),sw,sc);
  vorm[8] = new Vhoek_n5(n, 2, x+nphi/2, y-bl,0,color(255,207,111,alfa),sw,sc);
}
 
function draw() {
  clear()
  background('rgba(255,255,255, 0)');
  if (vijfhoek) {vorm[0].display();}
  for (let i = 1; i < 9; i++){vorm[i].display()}
 
  if (key == 's' || key == 'S') { }
  else {
  vorm[7].dpRotLi(vorm[7]); vorm[8].dpRotRe(vorm[8]);
  vorm[1].dpRotLi(vorm[1]); vorm[5].dpRotRe(vorm[5]);
  }
}
function buttonR1Action(){setup();}
function buttonNAction(){if(xpos){vorm[2].x=x+n;vorm[4].x=x-n; xpos= false;}
else {vorm[2].x=x;vorm[4].x=x; xpos = true;}}
function buttonDPHAction(){if(dph){vorm[6].d=3;vorm[6].hoek=180;dph=false;}
else{vorm[6].d=6;vorm[6].hoek=0;dph=true;}}
function buttonAAction(){if(vijfhoek){vijfhoek=false;} else {vijfhoek=true;}}
function buttonDAction(){save('negen_vijfhoeken.png');}