1

プレイヤーが 1 つのクライアントでピースを移動すると、すべてのクライアントが更新されるように、ボード ゲーム アプリにシグナルを使用しようとしています。私が直面している問題は、アプリのシグナル部分を抽象化する明確な方法がないため、その消費者は接続の開始などについて心配する必要がありません。生成されたプロキシを歌うことをスキップして、代わりに呼び出すことにしました物事を直接。唯一残っているハードルは、クライアントがサーバーからリクエストを受信したときに、イベント コールバックの this コンテキストがハブのものであり、コールバックの所有者のものではないということです。コンテキストで渡す方法があるかどうか知りたいです。

コード：

Signalr サービス (接続と最終的にイベントを管理する基本クラスのようなもの):

define('service.signalr', ['jquery'], function ($) {
var connection = $.hubConnection();

var start = function () {
    connection.start();
};

return {connection: connection, start: start}
});

特定の機能を備えたサービス - この場合、ピースの移動を処理します。

define('service.game', ['jquery', 'service.signalr'], function ($, signalr) {

var gameHubProxy = signalr.connection.createHubProxy('gameHub');

var addHandler = function (name, callback) {
    gameHubProxy.on(name, callback);
}

var moveFigure = function (figureId, targetSpaceId) {
    var deferred = $.Deferred();
    gameHubProxy.invoke('moveFigure', figureId, targetSpaceId).done(function () { deferred.resolve(); });
    return deferred.promise();
};

return { moveFigure: moveFigure, addHandler: addHandler }
});

サービスでサーバー メソッドを呼び出す (イベント トリガーはクライアントがアクションを実行するためのものであるため、2 回処理されることはありません)。

define('model.space', ['backbone', 'service.game'], function (Backbone, gameService) {
var Space = Backbone.Model.extend({
    defaults: { id: 0, figure: null },
    moveFigure: function (figureId) {
        var self = this;
        var spaceId = self.get('id');
        gameService.moveFigure(figureId, spaceId).done(function () {
            self.trigger('figureMoved', figureId, spaceId, false);
        });
    }
});

return Space;
});

そして、サーバーの応答をリッスンしようとしています:

define('view.board', ['jquery', 'underscore', 'backbone', 'helpers', 'bootstrapData', 'service.game', 'aggregate.space'], function ($, _, Backbone, helpers, bootstrapData, gameService, Space) {
var Board = Backbone.View.extend({
    initialize: function () {
        this.spaces = new Space.Collection(bootstrapData.spaces);

        this.listenTo(this.spaces, 'figureMoved', this.updateFigurePosition);
        gameService.addHandler('figureMoved', this.updateFigurePosition);
    },
    updateFigurePosition: function (figureId, spaceId, drawFigure) {
        var figure = null;
        var oldSpace = this.spaces.find(function (space) {
            figure = space.get('figure');
            return figure && figure.id == figureId;
        });

        //code continues, but has already failed on this.spaces
    },
});

return Board;
});
4

1 に答える 1