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 mouseLast = {};
var mouseNow = {};

processing.setup = function() {
  // processing.width(800)
  // processing.width(600)
};

processing.draw = function() {
  mouseNow = {
    x: processing.mouseX,
    y: processing.mouseY,
  };
  processing.line(mouseLast.x, mouseLast.y, mouseNow.x, mouseNow.y);
  mouseLast = mouseNow;
};

processing.keyPressed = function() {
  console.log(processing.key.toString());
  switch(processing.key.toString()) {
    case 'r':
      processing.stroke(255, 0, 0);
      break;
    case 'R':
      processing.background(255, 0, 0);
      break;
    case 'g':
      processing.stroke(0, 255, 0);
      break;
    case 'G':
      processing.background(0, 255, 0);
      break;
    case 'b':
      processing.stroke(0, 0, 255);
      break;
    case 'B':
      processing.background(0, 0, 255);
      break;
  }
};

processing.mousePressed = function() {

};

processing.mouseReleased = function() {

};

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