/*

  There are two tasks for you to complete.

  They are listed below. 

  1) Create a factory function that will 

     take in the id of the element that 

     your new gameObject is based on.

     You should create the following properties

     for your object:

​

       id     (from element id)

       x      (from element "left" property)

       y      (from element "top" property)

       width  (from element "width" property)

       height (from element "height" property)

       speedX (set to 0)

       speedY (set to 0)

  2) Variables have already been created

     for storing your objects. Use the 

     factory function to create the objects

     and assign them to the variables

​

*/

​

// 1) create your factory function here

function Factory(elementId){

  var gameItem = {};

  gameItem.id = elementId;

  gameItem.x = parseFloat($(elementId).css("left"));

  gameItem.y = parseFloat($(elementId).css("top"));

  gameItem.width = $(elementId).width();

  gameItem.height = $(elementId).height();

  gameItem.speedX = 0;

  gameItem.speedY = 0;

  return gameItem;

}

​

​

​

// 2) create your objects here

​

var obj1 = Factory("#example1");

var obj2 = Factory("#example2");

​

/*

  Below here is testing code. If you did

  everything properly up above, then

  both objects should have their

  information displayed within them

*/

​

function displayData(obj){

  $(obj.id).append($("<p>").text(" x: " + obj.x));

  $(obj.id).append($("<p>").text(" y: " + obj.y));

  $(obj.id).append($("<p>").text(" width: " + obj.width));

  $(obj.id).append($("<p>").text(" height: " + obj.height));

  $(obj.id).append($("<p>").text(" speedX: " + obj.speedX));

  $(obj.id).append($("<p>").text(" speedY: " + obj.speedY));

}

​

displayData(obj1);

displayData(obj2);

​