Sprite

Page Element Sprite

type [String] - value is always "Sprite" for a Sprite Element
x [Number/String] - x coordinate of the top-left hand corner of the sprite. This can be either a number (e.g. 10) which will be considered a percentage, a string with percentage (e.g. 10%), or a string with pixels (e.g. 75px)
y [Number/String] - y coordinate of the top-left hand corner of the sprite. This can be either a number (e.g. 10) which will be considered a percentage, a string with percentage (e.g. 10%), or a string with pixels (e.g. 75px)
url [String] - the path and filename of the image
numFrames [Number] - the number of frames to be played. If this property is not set or set to 1 the sprite will simply be an image instead of an animation.
frameDelay [Number] - the delay between frames
loop [Boolean] - if true, the animation will loop to the first frame after the last frame is displayed
playOnPress [Boolean] - if true, the animation will play on touch
toggleOnPress [Boolean] - if true, the animation will stop if the animation is playing or play if the animation is stopped on touch
autoReset [Boolean] - if false, the animation will stay on the last frame after the animation is complete
autoStart [Boolean] - if true, the animation will start when the page is shown
easing [String] - if value is "easeIn" the animation will start slow or if the value is "easeOut" the animation will end slow

###Example JSON Config Definition

Image Example { type: "Sprite", x: 40, y: 13, url: "images/char-jump.png" }
Animation Example { type: "Sprite", x: 48, y: 66, numFrames: 14, frameDelay: 4, loop: true, url: "images/ball-bounce.png" }

###Examples

- Example Sprite (Apple Drop Sprite)