1

我将 PhaserIO 与 Meteor 结合使用来创建多人 html5 游戏,但在我正在制作的网络原型中遇到了我似乎无法弄清楚的问题。首先,相关代码(也可作为gist获得):

if(Meteor.isClient) {

    var game,
        mainState,
        mainStateInitialized,
        characterData;

    Template.game.game = function() {

        characterData = Character.find().fetch();

        if(!mainStateInitialized)
        {
            game = new Phaser.Game(500, 600, Phaser.AUTO, 'gameScreen');
            createMainState()
        }     
    }
}

function createMainState()
{
    mainState = {
        sprites: null,
        playerLastFrame: characterData.length,
        playerCurrentFrame: null,
        charData: characterData,

        preload: function() {
            this.sprites = game.add.group();
            game.stage.disableVisibilityChange = true;
            game.load.image('hello', 'resources/hello.png');
        },

        create: function() {
            $.each(characterData, function(index) {
                var sprite = mainState.sprites.create(this.x, this.y, 'hello');
                sprite.angle = this.angle;
            });
        },

        update: function() {
            this.charData = characterData;
            this.playersCurrentFrame = this.charData.length;

            if(this.playersLastFrame > this.playersCurrentFrame) {
                //todo: remove player that left
            }
            else if(this.playersLastFrame < this.playersCurrentFrame) {
                for(var i = playersLastFrame; i < playersCurrentFrame; i++) {
                    var thisData = this.charData[i],
                        sprite = null;
                    sprite = mainState.sprites.create(thisData.x, thisData.y, 'hello');
                    sprite.angle = thisData.angle;
                }
            }
            for(var j = 0; j < mainState.sprites.length; j++) {
                mainState.sprites.getAt(j).angle = this.charData[j].angle;
            }
            playersLastFrame = this.charData.length;
        }
    }

    game.state.add('main', mainState);
    game.state.start('main');
    mainStateInitialized = true;
}

这个原型的想法是为数据库中的每个帐户在画布上显示一个精灵。我正在测试的主要功能是:

  1. 无缝地动态添加精灵/玩家数据(因为所有适当的多人在线游戏都应该具备这种能力。这最终将为适当的加入/离开系统铺平道路)

  2. 并搞乱创建有效的数据包。

现在,当玩家创建新帐户时,我遇到了动态创建新精灵的问题。大约 75% 的时间,当玩家创建新帐户时,什么都没有发生。Meteor 正确下推了我可以查询的字符数据,并mainState.sprites正确显示了精灵数据。但是,画布上没有渲染任何内容。

另外 25% 的时间,它运行良好。此外,如果我有代码断点,据我所知,它的工作时间为 100%。

所以,这里显然发生了一些间歇性的事情,但我无法弄清楚问题是什么。在更新循环期间添加精灵时,我是否遗漏了什么?有没有更好的方法来解决这个问题?

我在 Nitrous.io 上有我的代码,所以如果它有助于解决问题,我可以运行一个 localhost 实例供您使用。

4

1 回答 1

1

问题是我没有设置 playerLastFrame = playerCurrentFrame。

考虑到这是一个基本的循环/比较结构,我现在觉得很傻。last = 循环结束时的电流。

叹息:(。

于 2014-07-25T20:08:21.487 回答