Defining an Image to the DGM

In order to define an Image to the Digipiph Game Manager, one will need to provide several attributes shown below. These attributes contain everything the framework will need to recognize your image and to perform the basic collisions.

The difference between an image and a sprite is the image only has one frame. It is fixed. The image object does not have movement properties. However, the image object does still retain collision detection and event keypresses.

• id: Required. The unique id of your image.
• x: The x coordinate of your image.
• y: The y coordinate of your image.
• src: The image path.
• collisionObject: True or False, if set to True, other objects will not be allowed to pass through it.
• collisionType: Pixel or Default, pixel collision occurs when pixels from your image collide with pixels from another image. Default collision occurs when the area of your image collides with the area of another image. For a more detailed explanation, see IndieGamr.
• collisionAlphaThreshold: Default is 0, set to higher value to ignore collisions with semi transparent pixels. For a more detailed explanation, see IndieGamr.
• onCollision: The function to handle when the object is collided with. This function is passed the Image Object and the Collision Object.
• onEventKeypress: The function to handle when the object has an active collision and a set key is pressed. You can have many events for one object, each event must be set to its unique keypress. This function is passed the key and the function to perform. See a list of Keycodes here

var image_data = {
  "id": "event01",
  "x": 100,
  "y": 100,
  "src": 'images/wooden-block.png',
  "collisionObject": true,
  "collisionType": "pixel",
  "collisionAlphaThreshold": 10,
  "onCollision": function(imgObj, collisionObj) {
    console.log(imgObj.id + ' was hit by ' + collisionObj.id);
  }
};
 
//add the "Enter" keypress event for image_data
image_data.onEventKeypress(13, function() { 
  console.log("Enter was pressed on image");
});
 
//add the "Space" keypress event for image_data
image_data.onEventKeypress(32, function() { 
  console.log("Space was pressed on image");
});
 
//set the image to the canvas
var image = dgm.configImg(image_data, gameCanvas);