Flevopink

                                                             de   acht zeshoeken in de achthoek in fullscreen

van de draaipunten tijdens de animatie.

Met i = 2 wordt van vorm[ i + i] = 4 , dc = 2 en van vorm[i+(i-1)] = 3 , dc  = 5 van vorm zie regel 90

 
  let vorm = []; let ruitjespap;
  let ruitjes = false; let achthoek = true;
  function setup() {
  createCanvas(windowWidth, windowHeight);
  buttonR = createButton('reset');
  buttonR.position(20,40);buttonR.style('width','70px');
  buttonR.mouseClicked(buttonRAction);
  button0 = createButton('dp 0');
  button0.position(20,80);button0.style('width','70px');
  button0.mouseClicked(button0Action);
  button1 = createButton('dp 1');
  button1.position(110,80);button1.style('width','70px');
  button1.mouseClicked(button1Action);
  button2 = createButton('dp 2');
  button2.position(20,120);button2.style('width','70px');
  button2.mouseClicked(button2Action);
  button3 = createButton('dp 3');
  button3.position(110,120);button3.style('width','70px');
  button3.mouseClicked(button3Action);
  button4 = createButton('dp 4');
  button4.position(20,160);button4.style('width','70px');
  button4.mouseClicked(button4Action);
  button5 = createButton('dp 5');
  button5.position(110,160);button5.style('width','70px');
  button5.mouseClicked(button5Action);
  button6 = createButton('dp 6');
  button6.position(20,200);button6.style('width','70px');
  button6.mouseClicked(button6Action);
  button7 = createButton('dp 7');
  button7.position(110,200);button7.style('width','70px');
  button7.mouseClicked(button7Action);
  button8 = createButton('dp 8');
  button8.position(20,240);button8.style('width','70px');
  button8.mouseClicked(button8Action);
  button9 = createButton('dp 9');
  button9.position(110,240);button9.style('width','70px');
  button9.mouseClicked(button9Action);
  button10 = createButton('dp 10');
  button10.position(20,280);button10.style('width','70px');
  button10.mouseClicked(button10Action);
  button11 = createButton('dp 11');
  button11.position(110,280);button11.style('width','70px');
  button11.mouseClicked(button11Action);
 
  buttonA = createButton('achthoek aan/uit');
  buttonA.position(20,320);buttonA.style('width','140px');
  buttonA.mouseClicked(buttonAAction);
 
  buttonRuitjes = createButton('ruitjes aan/uit');
  buttonRuitjes.position(20,360);buttonRuitjes.style('width','140px');
  buttonRuitjes.mouseClicked(buttonRuitjesAction);
 
  buttonD = createButton('downloaden');
  buttonD.position(20,400);buttonD.style('width','140px');
  buttonD.mouseClicked(buttonDAction);
  let x = width/2; let y = height/2; let n = height/10;
  let alfa = 50; let kleur = 0; let sw = n/65; let sc = color(0);
  vorm[0] = new Vhoek_na4(n*2, 0, x, y, 0, color(200, 255, 0, alfa),sw,sc);
  vorm[1] = new Vhoek_n2a4(n,1,x-n/2, y-1.5*n,0,  color(255,255,0, alfa),sw,sc);
  vorm[2] = new Vhoek_n2a4(n,6,x+n/2, y-1.5*n,0,  color(255,0,0,   alfa),sw,sc);
  vorm[3] = new Vhoek_n2a4(n,1,x+1.5*n, y-n/2,90, color(255,255,0, alfa),sw,sc);
  vorm[4] = new Vhoek_n2a4(n,6,x+1.5*n, y+n/2,90, color(255,0,0,   alfa),sw,sc);
  vorm[5] = new Vhoek_n2a4(n,1,x+n/2, y+1.5*n,180,color(26,237,225,alfa),sw,sc);
  vorm[6] = new Vhoek_n2a4(n,6,x-n/2, y+1.5*n,180,color(100,200,50,alfa),sw,sc);
  vorm[7] = new Vhoek_n2a4(n,1,x-1.5*n, y+n/2,-90,color(26,237,225,alfa),sw,sc);
  vorm[8] = new Vhoek_n2a4(n,6,x-1.5*n, y-n/2,-90,color(100,200,0, alfa),sw,sc);
  ruitjespap = new Ruitjes(n,x,y);
}
 
function draw() {
  // background('#E6FBFF');
  clear();
  background('rgba(255,255,255, 0)');
  if (achthoek){vorm[0].display();}
 
  if (ruitjes){ruitjespap.display();
   for (let i = 0; i <9; i++){vorm[i].dpAan();}}
 
   for (let i = 1; i <9; i++) {vorm[i].display();}
 
  if (key == 's' || key == 'S') { }
 else
 {
    vorm[0].dpRotLi(vorm[0]); vorm[1].dpRotRe(vorm[1]);
    vorm[2].dpRotLi(vorm[2]); vorm[3].dpRotRe(vorm[3]);
    vorm[4].dpRotLi(vorm[4]); vorm[5].dpRotRe(vorm[5]);
    vorm[6].dpRotLi(vorm[6]); vorm[7].dpRotRe(vorm[7]);
    vorm[8].dpRotLi(vorm[8]);
  }
}
  function buttonRAction(){setup();}
  function button0Action()
    {for (let i = 1; i < 5;i++){vorm[i+i].d = 1;vorm[i+(i-1)].d = 6;}}
  function button1Action()
   {for (let i = 1; i < 5;i++){vorm[i+i].d = 2;vorm[i+(i-1)].d = 5;}}
  function button2Action()
   {for (let i = 1; i < 5;i++){vorm[i+i].d = 3;vorm[i+(i-1)].d = 4;}}
  function button3Action()
   {for (let i = 1; i < 5;i++){vorm[i+i].d = 0;vorm[i+(i-1)].d = 0;}}
  function button4Action()
   {for (let i = 1; i < 5;i++){vorm[i+i].d = 1;vorm[i+(i-1)].d = 1;}}
  function button5Action()
   {for (let i = 1; i < 5;i++){vorm[i+i].d = 2;vorm[i+(i-1)].d = 2;}}
  function button6Action()
   {for (let i = 1; i < 5;i++){vorm[i+i].d = 3;vorm[i+(i-1)].d = 3;}}
  function button7Action()
   {for (let i = 1; i < 5;i++){vorm[i+i].d = 4;vorm[i+(i-1)].d = 4;}}
  function button8Action()
   {for (let i = 1; i < 5;i++){vorm[i+i].d = 5;vorm[i+(i-1)].d = 5;}}
  function button9Action()
   {for (let i = 1; i < 5;i++){vorm[i+i].d = 6;vorm[i+(i-1)].d = 6;}}
  function button10Action()
   {for (let i = 1; i < 5;i++){vorm[i+i].d = 1;vorm[i+(i-1)].d = 4;}}
  function button11Action()
   {for (let i = 1; i < 5;i++){vorm[i+i].d = 7;vorm[i+(i-1)].d = 2;}}
 
  function buttonAAction()
  {if(achthoek){achthoek = false;} else {achthoek = true;}}
  function buttonRuitjesAction()
  {if (ruitjes){ruitjes = false;} else{ruitjes = true;}}
  function buttonDAction(){save('acht-zeshoeken.png');}