Jump to content

adding sprite from the result of a server emit


ahmedcoe
 Share

Recommended Posts

Hello everyone

So i am making a game where the server sends which sprites to create on the client's view. So i can't load those sprites util the server sends an object with which sprites to show. The code is as follows:

in the server 

this.emit("newSprites", newPlayer);

in client

socket.on("newSprites", addSprites);

function addSprites (data){
sp = data

this.add.sprite(58, 84, sp.name)

}

This will result in an error

Uncaught TypeError: Cannot read property 'sprite' of undefined

I know that this is in reference to 'this'. because "this" is the function not create part of Phaser. In Phaser 2 that line would start with game.add.sprite. But i don't know what to call it in Phaser 3. Any help would be appreciated. 

 

thanks

Link to comment
Share on other sites

Thanks for the reply, tried your suggestion but it didn't work still have the same error. I even tried to put the correct sprite name

socket.on("newSprites", addSprites);

var _this = this

function addSprites (data){
    sp = data
    _this.add.sprite(58, 84, '001')
}

 

Link to comment
Share on other sites

3 minutes ago, ahmedcoe said:

Thanks for the reply, tried your suggestion but it didn't work still have the same error. I even tried to put the correct sprite name


socket.on("newSprites", addSprites);

var _this = this

function addSprites (data){
    sp = data
    _this.add.sprite(58, 84, '001')
}

 

 

Could you show more of your code? where is that addSprites function?

What about this?

socket.on("newSprites", addSprites);

// usage: addSprites(this, somedata)
function addSprites (_this, data){
    sp = data
    _this.add.sprite(58, 84, sp.name)
}

 

Link to comment
Share on other sites

thats about it. every thing else is just the setup. The function is triggered correctly when the server event is sent. I also can console.log(sp.name) but tring to create an image or a sprite inside this function will give this error.

this is all the code

var socket; 
socket = io.connect();

var config = {
    type: Phaser.AUTO,
    width: 705,
    height: 400,
    scene: {
        preload: preload,
        create: create,
        update: update
    }
};

var game = new Phaser.Game(config);


function preload (){
  this.load.image('001', '/client/assets/img/001.png');
}

function create ()
{

	console.log("client started");
    this.add.image(0 , 0 , 'background').setOrigin(0, 0);
    socket.on('connect', onsocketConnected);
    var id = 2;
    socket.emit("askForSprites", id);
    socket.on("newSprites", addSprites);
	}

function addSprites (data){
sp = data

this.add.sprite(58, 84, sp.name)

}

function update ()
{
}

// this function is fired when we connect
function onsocketConnected () {
	console.log("connected to server");

}

 

Link to comment
Share on other sites

So Juan sent me a message and solved it for me. thanks to him. this was the fix

function create (){

	console.log("client started");
    this.add.image(0 , 0 , 'background').setOrigin(0, 0);
    socket.on('connect', onsocketConnected);
    var id = 2;
    socket.emit("askForSprites", id);
    var _this = this;
    socket.on("newSprites", function (data) {
        addSprites(_this, data);
    });
}

function addSprites (_this, data){
    var sp = data;
    _this.add.sprite(58, 84, sp.name)

}

 

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...