anchor.diff:  
   var seats, rows;
   var canvas;
  +const SEAT_SIZE = 20;
  +const SEAT_GAP = 5;
   
   function renderSeatmap(canvas){
     //Render base canvas
  
positive.code:   }, false);
  }
  
  function handleMouseClick(canvas, evt){
    var mousepos = getMousePos(canvas, evt);
    console.log("mouse clicked at: " + mousepos.x + ":" ,mousepos.y);
    data = JSON.stringify({
        seatmap: {
          name: "TEST3",
          rows_attributes: [
            {name: "asdfghi", x_coord: "123", y_coord: "123", seats_attributes: [
              {number: 0, state: "available"},
              {number: 3, state: "available"}
            ]}
          ]
        }
      });
    updateMap(data);
  }
  
  function getSeatFromCoord(inX, inY){
  
  }
  
  function getMousePos(canvas, evt) {
  
negative.code:   for(i = 0; i < rows.length; i++){
      for(j = 0; j < rows[i].seats.length; j++){
        ctx.beginPath();
        coords = getViewCoord(i, j);
        ctx.rect(coords.x, coords.y, SEAT_SIZE, SEAT_SIZE);
        if(rows[i].seats[j].state == "available"){
          ctx.fillStyle = 'green';
        }else{
  