Forums » Help » 1 item added, init called 3 times?

I created an entity and added it to weltmeister. In the init method I added a console stmt. When my game starts, I see the init log 3 times in a row. Why would this be? In weltmeister I see it only a single time.

I was having a similar problem in the past. Never quite figured out the exact reasoning other than order of operations. I just moved a few lines of code around, in relation to the console msg, and it stopped.

Hope thats somewhat of a help - if I knew the exact reason, I'd share but I was just as confused about it too, >.<

Corey, what's your init code for that entity? Also, can you show the contents of the (main.js?) function inside which you call loadLevel?

that weirded me out for a second cuz my name's Cory, lol - didn't realize that his username was corey, xP

@alexandre

My Init code for this entity:

init: function(x, y, settings){
                this.parent(x, y, settings);
                this.startPos = {x: x, y: y};
                this.addAnim('idle', 1, [0]);
                console.log("INIT");
            },

I'll see that init happen 3 times. Even when I've only added a single instance of that entity to the level via weltmeister.

Here's my main.js

ig.module( 
	'game.main' 
)
.requires(
	'impact.game',
	'impact.font',
    'game.levels.level1',
    'game.entities.snowball',
    'plugins.box2d.game',
    'impact.debug.debug',
    'game.entities.enemy',
    'game.entities.zombie',
    'game.entities.zombieelf',
    'game.entities.slingshot',
    'game.entities.analogstick',
    'game.entities.enemyspawner'
)
.defines(function(){

MyGame = ig.Box2DGame.extend({
    gravity: 200, // All entities are affected by this
	// Load a font
	font: new ig.Font( 'media/04b03.font.png' ),
    clearColor: '#1b2026',
	currentLevel: null, //Holds the name of the current level
	
	init: function() {
		// Initialize your game here; bind keys etc.
        ig.input.bind( ig.KEY.LEFT_ARROW, 'screenLeft' );
        ig.input.bind( ig.KEY.RIGHT_ARROW, 'screenRight' );
        ig.input.bind( ig.KEY.DOWN_ARROW, 'screenDown' );
        ig.input.bind( ig.KEY.UP_ARROW, 'screenUp' );
        ig.input.bind( ig.KEY.MOUSE1, 'leftclick' );
        ig.input.bind( ig.KEY.MOUSE2, "rightclick");

        if( ig.ua.mobile ) {
            //alert("MOBILE");
            ig.input.bindTouchArea( 0, 0, 600, 300, 'leftclick' );
        }
        this.loadLevel( LevelLevel1 );
	},
	
	update: function() {
		// Update all entities and backgroundMaps
		this.parent();
		
		// Add your own, additional update code here
        if( ig.input.state('screenLeft') ) {
            this.screen.x = this.screen.x - 5;
        }
        if( ig.input.state('screenRight')){
            this.screen.x = this.screen.x + 5;
        }
        if( ig.input.state('screenUp')){
            this.screen.y = this.screen.y - 5;
        }
        if( ig.input.state('screenDown')){
            this.screen.y = this.screen.y + 5;
        }

        if(ig.input.state("leftclick")){
        }
        if(ig.input.state("rightclick")){
        }
	},
	
	draw: function() {
		// Draw all entities and backgroundMaps
		this.parent();
		
		
		// Add your own drawing code here
		var x = ig.system.width/2,
			y = ig.system.height/2;
		
		this.font.draw( 'It Works!', x, y, ig.Font.ALIGN.CENTER );
	},

    changeLevel: function(levelName) {

        // Store the name of the level.
        this.currentLevel = levelName;

        // Change map.
        ig.game.loadLevelDeferred( ig.global[levelName] );

        var enemySpawnOrder = Levels[levelName];

    }


});

/* NOT REALLY USED EXCEPT PLACEHOLDER */
StartScreen = ig.Game.extend({

    init: function(){

    },
    update: function(){
        this.parent();
    },
    draw: function(){
        this.parent();
    }
});


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

});

And in some JS within the HTML page I fire off a level by calling:

ig.system.setGame(MyGame);
ig.game.changeLevel( levelID );

It's when this logic just above gets called that I see the init 3 times.

These 2 steps might do it:

1. first, don't call setGame and changeLevel from within your html file. Rather, just include main.js (the ig.main call at the bottom of main.js will take care of launching your game).

2. then, modify main.init to call changeLevel rather than loadLevel:

// in main.js

init: function()
{
	// Initialize your game here; bind keys etc.
	ig.input.bind( ig.KEY.LEFT_ARROW, 'screenLeft' );
	ig.input.bind( ig.KEY.RIGHT_ARROW, 'screenRight' );
	ig.input.bind( ig.KEY.DOWN_ARROW, 'screenDown' );
	ig.input.bind( ig.KEY.UP_ARROW, 'screenUp' );
	ig.input.bind( ig.KEY.MOUSE1, 'leftclick' );
	ig.input.bind( ig.KEY.MOUSE2, "rightclick");

	if( ig.ua.mobile )
	{
		//alert("MOBILE");
		ig.input.bindTouchArea( 0, 0, 600, 300, 'leftclick' );
	}
	
	// UPDATED
	this.changeLevel('LevelLevel1');
},

Side note, for Dominic: I often need to know what level was most recently loaded, if any. Would be nice if game kept a levelName prop for us to access when needed.

@alexandre - Thanks for the advice. I am calling changeLevel externally of the main.js file because I have a set of menus that sit in front of the game. So the user can pick which level they want to play. Right now the game starts up w/ a level in the background, and then I just call "changeLevel" when they click on a specific level. I was having the game do:

ig.main( '#canvas', StartScreen, 60, 600, 300, 2 ); 

.. so that the game wasn't playing in the background but I think I ran into a bug doing that. I think there was an issue with the ig.game object not existing. So I still need to figure that part of it out. I'm a web-developer full time so the more I can do outside of the canvas element and just use strait HTML, the faster I can develop the game. Has this ever caused you problems in the past? What's the best way to interact with the game outside of the framework? I've been trying to access the game through global vars.

Also, I have seen people override the "changeLevel" method to do something like..

// Store the name of the level.
        this.currentLevel = levelName;

...to accomplish what you asked Dominic for. That seemed like a pretty decent workaround.

Has this ever caused you problems in the past? What's the best way to interact with the game outside of the framework? I've been trying to access the game through global vars.

Not sure, as I've never tried. Some of the other impact games may have already done this. Have you checked YOSS and the others?

this.currentLevel = levelName;

Sure, but my problem with this is that it requires advance knowledge of the need. A solution becomes less flexible when state must be used to replace missing functionality. Not a big deal, though: I usually add a void entity to my levels, naming it "info", and storing whatever level information I may need in it.

@alexandre I was looking into your method of using the void entity and I wasn't able to piece together how you edit it on a per level basis. Can you show me an example of one of these entities with a little description of what you're doing exactly?

Thanks,
Corey

@Alexandre Also, if I change my main > init to use this.changeLevel( LevelLevel1 ); I see errors in the console:
Uncaught TypeError: Cannot call method 'Step' of undefined - game.js:120

But if I go in and change the line in changeLevel from

ig.game.loadLevelDeferred( ig.global[levelName] );

to:

this.loadLevel( LevelLevel1 );

That seems to work.. So I guess I need to research the difference between the two and how they are used. I noticed loadLevel method doesn't wrap the level name in quotes, that must mean its a global variable? So does the engine create a global var for every level you create?

Both loadLevel and loadLevelDeferred expect data rather than a name. The data in question is a global object the props of which you can check out by loading/reading your level files (lib/game/levels/*.js). No name field in there, hence the problem.

I place a void entity inside each level, from within WM, embedding among other things keys/values name:info and level:<level object name>.

void.js

ig.module(
	'game.entities.void'
)
.requires(
	'impact.entity'
)
.defines(function(){

EntityVoid = ig.Entity.extend({
	_wmDrawBox: true,
	_wmBoxColor: 'rgba(255, 255, 255, 0.4)',
	size: {x:24, y:24},
	gravityFactor: 0,
});
});

main.js

getLevelName: function()
{
  var info = this.getEntityByName('info');
  return info ? info.level : null;
},