​

function setup() {

  createCanvas(400, 400);

  myRect = new Rectangle(width / 2, height / 2, 64, 64);

}

​

function draw() {

  background(220);

  myRect.draw();

}

​

function Rectangle(cx, cy, width, height) {

  this.points = [

    createVector(cx - width / 2, cy - height / 2),

    createVector(cx + width / 2, cy - height / 2),

    createVector(cx + width / 2, cy + height / 2),

    createVector(cx - width / 2, cy + height / 2)

  ];

}

Rectangle.prototype.roll = function(dir) {

  //the goal here is to work out the pivot point

  //based on the direction and the current

  //contact points

}

Rectangle.prototype.draw = function() {

  noFill();

  stroke(0);

  beginShape();

  for(var i = 0; i < this.points.length; i++) {

    var p = this.points[i];

    vertex(p.x, p.y);

  }

  endShape(CLOSE);

}