Skip to content
louis cabrera edited this page Jan 5, 2014 · 5 revisions

Le module render vous permet d'ajouter une image et des méthodes d'animation à votre objet. Il faut que votre objet possède une position en x et en y, ainsi qu'une width et une height. Le render suivra aussi la rotation de votre objet si celle-ci est en radian counterclockwise.

Pour le faire fonctionner, cela ce passe en 3 étapes :

1. Le lier dans le define de votre jeu

    define([
    'event_bus',
    'modules/render']
     function(eventBus){ 
         // VotreCode
     });

2. Initialisation

1. Du render

    eventBus.emit('init render',params);

params.object est la l'instance à laquelle vous voulez ajouter les methodes de render

params.sprite est une structure comprenant le sprite par deffaut ainsi que l'image qui servira de spriteSheet. params.sprite doit avoir cette structure :

   {
       x : position x du sprite dans la source
       ,y : position y du sprite dans la source
       ,width : largeur du sprite dans la source
       ,height : hauteur du sprite dans la source
       ,img : image source
   };

params.rotating (optionnel) si le render doit suivre la rotation de l'objet, l'objet devra aussi avoir attribut rotation en radian counterclockwise

params.patternReapet(optionnel) "repeat", "repeat-x" ou "repeat-y" si l'objet doit avoir un render en pattern undefined sinon Attention les pattern ne peuvent être animés et leur spriteSheet doit être composée d'un seul sprite

2. De l'animation

eventBus.emit('add animation',object, animation);

Si l'objet n'a pas l'attribut d'animation, le lui ajoute.

object L'objet auquel ajouter l'animation

animation L'animation à ajouter elle doit avoir cette structure :

    {
    name : nom de l'animation,
    sprites : [{x : 0, y : 0, width : 48, height : 48}
              ,{x : 48, y : 0, width : 48, height : 48}
              ,{x : 96, y : 0, width : 48, height : 48}
              ,{x : 144, y : 0, width : 48, height : 48}]
   };

Il peut y avoir autant de sprite que l'on veut dans l'animation

3. Les Evenement

('init render', params) : permet d'initialiser le render, pramatres : object, sprite, rotating(optionnel), patternRepeat(optionnel).

('add animation', object, animation) : add an animation to the object.

('play animation', object, animationName) : plays au specific animation of the object.

('pause animation', object) : pauses the current animation of the object.

('reset animation', object) : resets the current aniamtion of the object.

('render object', object, context) : renders the object in the given context.

('animate object', object) : animates the object.