var width = window.innerWidth;
var height = $('body').height() - 3;
var halfWidth = width / 2;
var halfHeight = height / 2;

function drawerSketch(processing) {
  // set size
  processing.size(width, height);

  var steps = 255;
var stepSize = width / 255.0;
var r = 0;

processing.setup = function() {
  processing.background(0);
  processing.stroke(255);
};
processing.draw = function() {
  r++;
  var step = r % steps;
  processing.background(0);
  processing.fill(r % steps, 0, 0);
  processing.ellipse(halfWidth, halfHeight, step * stepSize, step * stepSize);
};

}
// attach the sketch function to the canvas
var processingInstance = new Processing(document.getElementById('sketch'), drawerSketch);