collinhover / impactplusplus

Impact++ is a collection of additions to ImpactJS with full featured physics, dynamic lighting, UI, abilities, and more.
http://collinhover.github.com/impactplusplus
MIT License
276 stars 59 forks source link

Weapon on Player animation #136

Closed tobiaslins closed 10 years ago

tobiaslins commented 10 years ago

Hello!

First of all, sorry for all the questions here.

I am currently developing an MMO with impactjs & impact++

I have a Player entity, and an own entity for a weapon

ig.module(
    'game.entities.meleeWeapon'
)
.requires(
    'plusplus.core.entity'
)
.defines(function () {
    ig.EntityMeleeWeapon = ig.global.EntityMeleeWeapon = ig.EntityExtended.extend({
        size: {
            x: 32,
            y: 32
        },
        offset: {
            x: -10,
            y: 20
        },
        animSheet: new ig.AnimationSheet('media/weapons/weapons.png', 32, 32),
        animSettings: {
            idle: {
                sequence: [53],
                frameTime: 1
            }

        },
        collides: ig.Entity.COLLIDES.NONE,

        initProperties: function () {
            // Call the parent constructor first so all of the entities are drawn and positioned
            this.parent();

            // Store the associated trader entity
         // var trader = ig.game.getEntityByName(this.trader);
           // this.trader = trader || null;
        },
        activate: function(){
            this.angle=90;
        }
    });
});

Now when i "activate" the weapon, i want an animation, where the angle just changes for 90° but not instant, as an animation.

but i dont want to create an animation sprite. with different frames

is this possible without?

is there a better solution for my weapon?

thanks in advance

Pattentrick commented 10 years ago

Hello @tlins,

yes, you can do some basic animation with the angle property. You have to increment the angle property step by step in your update function. Quick example:

javascript degOfAngle: 0, hasActiveWeapon: false,

activate: function(){

this.hasActiveWeapon = true;

},

update: function(){

this.parent();

if( this.degOfAngle < 90 && this.hasActiveWeapon ){

    this.angle = ++this.degOfAngle;

}   

}



Keep in mind that an animation with a custom animationSheet may look much better. That really depends on the art you are using.
collinhover commented 10 years ago

I'd also recommend custom animation in the sprite sheet for the best visual experience, but yes you can set the angle and it should rotate the sprite as expected. @Pattentrick has the right idea, though I'd do it via the updateChanges method and not the update method. Note the tip here: http://collinhover.github.io/impactplusplus/ig.EntityExtended.html#updateChanges