Jump to content

updating a player from server with fixed camera via sockets


aylictal
 Share

Recommended Posts

Hello and greetings. I am making a top down multiplayer game using phaser 3.

To cut it short Here is some serverside code:

const move = (socket, data) => {
	console.log(data);
	let player = findplayerbysocket(socket);
	if (data == 'left'){
		socket.emit('move', {scrollX: player.scrollX--});
	} else if (data == 'right'){
		socket.emit('move', {scrollX: player.scrollX++});
	} else if (data == 'up'){
		socket.emit('move', {scrollY: player.scrollY--});
	} else if (data == 'down'){
		socket.emit('move', {scrollY: player.scrollY++});
	}
}

On client I have this within my extended scene class:

update(time, delta){
        this.controls.update(delta);
        socket.on('move', data=>{
            console.log(data);
            //this.cameras.main.scrollX = data.scrollX;
            //this.cameras.main.scrollY = data.scrollY;
        });
        if (this.cursors.left.isDown){
            this.player.flipX = false;
            if (this.player.facing != 'left'){
                socket.emit('move', 'left');
                this.player.anims.play('moveleft');
                this.player.facing = 'left';
            }
        } else if (this.cursors.right.isDown){
            this.player.flipX = true;
            if (this.player.facing != 'right'){
                socket.emit('move', 'right')
                this.player.anims.play('moveleft');
                this.player.facing = 'right';
            }
        } else if (this.cursors.down.isDown){
            if (this.player.facing != 'down'){
                socket.emit('move', 'down');
                this.player.anims.play('movedown');
                this.player.facing = 'down';
            }
        } else if (this.cursors.up.isDown){
            if (this.player.facing != 'up'){
                socket.emit('move', 'up');
                this.player.anims.play('moveup');
                this.player.facing = 'up';
            }
        } else {
            this.player.anims.stop();
            this.player.anims.currentFrame = 0;
            this.player.facing = 'idle';
        }
    }

Is this set up in the proper manner?  I mean it seems to work but the problem I'm facing is that the socket.on('move') for the client is literally getting fired thousands of times by just pressing an arrow key yet on the server, console.log(data) only gets fired when I press a new key (holding does nothing afterwards). 

If I remove the commented lines out on the client for this.cameras.main.scrollX = data.scrollX, my canvas contents immediately get scrolled off the page and im left seeing a black screen (my default background color of the body).

Is there some way I can limit how often that socket.on gets called?  Maybe a throttler I can wrap the on event with?  Sorry I am not too well versed with phaser and this is my first time using phaser 3.

Many thanks.
 

Link to comment
Share on other sites

yeah .on should not be in the update  and and emit is sending server.  It should be in create function for .on event. Just think of the .on is array that has a list and you kept added to it. Just need to assign in once. But you need to think differently since the socket will listen to event that will trigger on list that has be assign or added.

 

Client:

create(){
    socket.on('move', data=>{
        console.log(data);
        //this.cameras.main.scrollX = data.scrollX;
        //this.cameras.main.scrollY = data.scrollY;
    });
}

update(time, delta){
    if (this.cursors.left.isDown){
        this.player.flipX = false;
        if (this.player.facing != 'left'){
            socket.emit('move', 'left');
            this.player.anims.play('moveleft');
            this.player.facing = 'left';
        }
    } 
}

But you nee to setup a different way if your doing server and client if there conflict that there should be manger list for players.

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

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