createCanvas(windowWidth, windowHeight-20);

  noStroke();

  a = 0;

  v = 0;

  frameRate(120);

  checkbox = createCheckbox("Black/white", true);

  checkbox.changed(myCheckedEvent);

  cycleColors = false;

  colorMode(HSB, 360);

}

​

function draw() {

  c = (frameCount/4)%360;

  if(cycleColors) {

        c1 = color(c, 300, 360);

    c2 = color((c+180)%360, 300, 360);

  } else {

    c1 = 360;

    c2 = 0;

  }

  background(40);

  translate(width/2, height/2);

  rotate(a)

  translate(-width/2, -height/2);

  fill(c1);

  arc(width/2, height/2, height, height, 0, PI);

  fill(c2);

  arc(width/2, height/2, height, height, PI, 0);

  fill(c1);

  ellipse(width/2-height/4, height/2, height/2);

  fill(c2);

  ellipse(width/2+height/4, height/2, height/2);

  fill(c2);

  ellipse(width/2-height/4, height/2, height/4);

  fill(c1);

  ellipse(width/2+height/4, height/2, height/4);

  a+=v;

  v+=random(-0.005, 0.005);

  if(v>0.5) {

    v = 0.5;

  }

  if(v<-0.5) {

    v = -0.5;

  }

}

​

function myCheckedEvent() {

  cycleColors = !cycleColors;

}