Anim state graph changes with multiplayer

Hi, not sure who might need this- but based on the forum topics and trying to work on it myself- finally figured out how to send parameters for anim state graphs changes over multiplayer using the realtime-multiplayer example. Hope this helps someone, and any crit on how to make it better and more elegant welcome.

Project is here.

https://playcanvas.com/project/888700/overview/multiplayer-with-avatars-part02

and server code here for anyone who needs it.

var server = require('http').createServer();
var options = {
  cors: true
}

var io = require('socket.io')(server, options);
var players = {};

function Player (id) {
    this.id = id;
    this.x = 0;
    this.y = 0;
    this.z = 0;
    this.rot = 0;
    //we retrieve the value we sent across from playcanvas here//
    this.value = 0;
    this.entity = null;
}

io.sockets.on('connection', function(socket) {
    socket.on ('initialize', function () {
        var id = socket.id;
        var newPlayer = new Player (id);
        // Creates a new player object with a unique ID number.

        players[id] = newPlayer;
        // Adds the newly created player to the array.

        socket.emit ('playerData', {id: id, players: players});
        // Sends the connecting client his unique ID, and data about the other players already connected.

        socket.broadcast.emit ('playerJoined', newPlayer);
        // Sends everyone except the connecting player data about the new player.
      
        socket.on ('initialize', function () {
            var id = socket.id;
            var newPlayer = new Player (id);
            players[id] = newPlayer;

            socket.emit ('playerData', {id: id, players: players});
            socket.broadcast.emit ('playerJoined', newPlayer);
        });

        socket.on ('positionUpdate', function (data) {
                if(!players[data.id]) return;
                players[data.id].x = data.x;
                players[data.id].y = data.y;
                players[data.id].z = data.z;
                players[data.id].rx = data.rx;
                players[data.id].ry = data.ry;
                players[data.id].rz= data.rz;
                //we format the outgoing data from glitch back to playcanvas here//
                players[data.id].value = data.value;
                //we log the information so we know its going out//
                console.log(data.value);
                
            socket.broadcast.emit ('playerMoved', data);
        });
      

        socket.on('disconnect',function(){
            if(!players[socket.id]) return;
            delete players[socket.id];
            // Update clients with the new player killed 
            socket.broadcast.emit('killPlayer',socket.id);
        });
    });
});

console.log ('Server started');

server.listen(3000);
4 Likes