0

I'm quite new to the concept of module patterns. I managed to implement the core features of my HTML5 game, but I can't figure out a good way to make certain variables available to every function of that game.

Here is a short pseudo example which should make it more clear:

var Game = {};

Game.player = (function() {

    //...

    return {
        update : update,
        draw : draw        
    };
});

Game.main = (function() {

    var player = new Game.player();

    // needed by player
    var gravity = 1.0,
        loop,
        canvas,
        ctx,
        key_inputs;

    //...

    return {
        init : init,
        pause : pause,
        play : play        
    };
});

var game = new Game.main();
game.init();
​
Improve this question
2
  • can you clarify what the question is? Commented Sep 24, 2012 at 17:28
  • @jbabey How does the player get access to the variables of the main object without having to pass every single variable ? The update function of the player for example needs to know the gravity and the pressed keys etc. Commented Sep 24, 2012 at 17:30

2 Answers 2

Reset to default
1

If code scoped to your Player function needs to use some variables declared in your Game function, you have three options:

  • Move them to a higher scope (which would be global in this case, so not recommended)
  • Pass them as parameters to the player (not great since they won't be updated in Player if they change in Game)
  • Create a getter function in Game that returns the current state of the variables to the Player function.

You'll also need to pass the instance of the Game to the Player so it knows which Game to grab it's data from.

Here's an example of #3 (the one I would try):

Game.main = (function() {
    var player = new Game.player(this);

    // needed by player
    var gravity = 1.0,
        loop,
        canvas,
        key_inputs;

    var getSettings = function () {
        return {
            gravity: gravity,
            loop: loop,
            canvas: canvas,
            key_inputs: key_inputs
        };
    };

    return {
        init : init,
        pause : pause,
        play : play,
        getSettings: getSettings        
    };
});
Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

Just a nitpick, but the original code had both player and main as the objects, in the Game pseudo-namespace. So there is no Game object, per se.
I thought about this solution. Though wouldn't it be hardcoded if I pass the reference of the Game object (game) ? Edit: Ah no it's not.
@elias94xx: there's no hard-coding. If you were to create a new main object, then the player object inside of it would point to that new object, not the other game object.
1

You can provide getter and setter methods in Game.main. You should pass an instance of Game.main to the Game.player constructor. Then Game.player can use the getter/setter methods on its instance of Game.main to access those variables.

Make sure that your architecture is sound and that you only share what you need to share.

Improve this answer

4 Comments

I really need to know how to properly pass an instance. Is this the right way ? jsfiddle.net/PJD5X Because this inside the main function won't work.
@elias94xx: why not just do it when you declare player on the first line of your main function? Scope is weird in JavaScript, and that's why the this is not what you are expecting. I modified your jsfiddle with what I imagine will do what you want.
@elias94xx: oops, it turns out you can just modify the fiddles like that. I think what you have is actually good enough, given the model you are using. Here's my own version: jsfiddle.net/crmsN/1
Oh right, I can just pass the get function instead of a whole game reference. Sometimes I think way to complicated.. Thanks! ;)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.