title: new object() undefined?
body: <p>In my attempts to learn JavaScript, I came up with this canvas drawing idea. Basically, I am storing coordinates in an array and the script will draw buttons on the canvas automatically. Each button requires 8 coordinates, <code>x1</code>,<code>y1</code>,<code>x2</code>,<code>y2</code>,etc... (I might even make those buttons work as links later ;p). The problem I am having is, this doesn't run at all and chrome inspector console says "<code>object is undefined</code>" at this line: "<code>button = new object();</code>"</p>
  
  <p>Any help is appreciated. 
  Leo</p>
  
  <pre><code>function loadMenu() {
      //Initialize Canvas
      var canvas = document.getElementById("menu_canvas");
      var context = canvas.getContext("2d");
  
      //Button Data
      var buttonData = [59, 0, 19, 40, 128, 40, 168, 0];
      //Create Buttons
      var i = 1;
      while (i &lt; buttonData.length) {
          button = new object();
          for (var j = i; j != i + 8; j++) {
              if (j % 2 == 0) {
                  button.X[j] = buttonData[j - 1];
              } else {
                  button.Y[j] = buttonData[j - 1];
              }
          }
          drawButton(button);
          i = i + 8;
      }
      //Begin drawing buttons
      function drawButton(button) {
          context.beginPath();
          context.moveTo(button.X1, buttonX2);
          for (k = 2; k != 4; k++) {
              context.lineTo(buttonX[k], buttonY[k]);
          }
          context.closePath();
          context.fillStyle = "red";
          context.fill();
      }
  }
  </code></pre>