Impact

This forum is read only and just serves as an archive. If you have any questions, please post them on github.com/phoboslab/impact

6 years ago by TheKyngxar

Has anyone followed the HTML5 Game Development with ImpactJS, book?
I'm working through the rpg tutorial but have been stuck for a couple days trying to figure out why my character isn't moving. Here's my player js file. Everything loads up when testing the game but key input does nothing.

ig.module('game.entities.player')
.requires(
    'impact.entity')

.defines(function(){
    EntityPlayer = ig.Entity.extend({
        size: {x:32,y:48},
        health: 200,
        animSheet: new 
        ig.AnimationSheet('media/player.png', 32, 48 ),
 
     
        init: function(x,y,settings) {
        this.parent(x,y,settings);
        this.addAnim( 'idle',1,[0]);
        this.addAnim('down',0.1,[0,1,2,3,2,1,0]);
        this.addAnim('left',0.1,[4,5,6,7,6,5,4]);
        this.addAnim('right',0.1,[8,9,10,11,10,9,8]);
        this.addAnim('up',0.1,[12,13,14,15,14,13,12]);                 },
              collides: ig.Entity.COLLIDES.ACTIVE,
            type: ig.Entity.TYPE.A,
             checkagainst: ig.Entity.TYPE.B,
        
        update: function(){
            this.parent();
            //Player Movement
            if(ig.input.state('up')){
                this.vel.y = -100;
                this.currentAnim = this.anims.up;
            }
            else if(ig.input.pressed('down')){
                this.vel.y = -100;
                this.currentAnim = this.anims.down;
            }
            else if(ig.input.pressed('left')){
                this.vel.x = -100;
                this.currentAnim = this.anims.left;
            }
            else if(ig.input.pressed('right')){
                this.vel.x = -100;
                this.currentAnim = this.anims.right;
            }
            else{
                this.vel.y = 0;
                this.vel.x = 0;
                this.currentAnim = this.anims.idle;
            }
           
        }
    })
});

6 years ago by lTyl

Did you remember to bind your control keys in your main.js in the init?
ig.input.bind( ig.KEY.UP_ARROW, 'up');
ig.input.bind( ig.KEY.DOWN_ARROW, 'down');
ig.input.bind( ig.KEY.LEFT_ARROW, 'left');
ig.input.bind( ig.KEY.RIGHT_ARROW, 'right');

Another thing: this.vel.x = -100;. You're using this for all of your if branches, if you have a collision tile above your player entity, you won't be going anywhere

6 years ago by TheKyngxar

Yep my main file is as below and, the player entity is in the middle of screen about seven tiles away on all sides from collision tiles. I'm puzzled as I followed the book exactly.

ig.module( 
	'game.main' 
)
.requires(
	'impact.game',
	'impact.font',
    'game.entities.player',
    'game.levels.level1',
    'impact.debug.debug',
    'game.entities.enemy'
    
)
.defines(function(){

MyGame = ig.Game.extend({
	
	// Load a font
	font: new ig.Font( 'media/04b03.font.png' ),
	
	
	init: function() {
        //Char movement
        ig.input.bind( ig.KEY.UP_ARROW, 'up' );
        ig.input.bind( ig.KEY.DOWN_ARROW, 'down' );
        ig.input.bind( ig.KEY.LEFT_ARROW, 'left' );
        ig.input.bind( ig.KEY.RIGHT_ARROW, 'right' );
        
		this.loadLevel(LevelLevel1);

        
	},
	
	update: function() {
		// Update all entities and backgroundMaps
		var gameviewport= ig.game.screen;
        var gamecanvas= ig.system;
        var player = this.getEntitiesByType( EntityPlayer ) [0];
        gameviewport.x = player.pos.x - gamecanvas.width /2;
        gameviewport.y = player.pos.y - gamecanvas.height / 2;
		
		// Additional update code here
	},
	
	draw: function() {
		// Draw all entities and backgroundMaps
		this.parent();
		
		
		// Add your own drawing code here
		
	}
});


// Start the Game with 60fps, a resolution of 320x240, scaled
// up by a factor of 2
ig.main( '#canvas', MyGame, 60, 320, 240, 2 );

});

6 years ago by jerev

Is it safe to assume by..
// Additional update code here

..you mean you have this.parent() in there?
If not, then, that'll be your problem.


And in your entity code, you might want to place the this.parent() under the velocity definitions, sure, you won't notice it, but responsive wise, it only makes sense.

6 years ago by TheKyngxar

Thanks a lot jerev, that fixed my problem. I moved the parent line like you suggested, but just out of curiosity, why is it more responsive to have it following the velocity definitions. The book I'm following hasn't elaborated on that so I just slapped it right where the tutorial instructed.

6 years ago by Joncom

Quote from TheKyngxar
Thanks a lot jerev, that fixed my problem. I moved the parent line like you suggested, but just out of curiosity, why is it more responsive to have it following the velocity definitions. The book I'm following hasn't elaborated on that so I just slapped it right where the tutorial instructed.
Because this.parent() is where the work is done with the velocity values. If you do it the other way, then the values are update a frame later than they should be.

6 years ago by TheKyngxar

Oh that makes sense, thanks for letting me know Joncom.
Page 1 of 1
« first « previous next › last »