Hi there everyone, is there any example (project, live or source) how to pass and receive animation data to and from Socket.io?
Rotations / movements are working fine finally,
var Network = pc.createScript('network');
// static variables
Network.id = null;
Network.socket = null;
// initialize code called once per entity
Network.prototype.initialize = function() {
this.player = this.app.root.findByName('Player');
this.other = this.app.root.findByName('Other');
var socket = io.connect('https://soft-mixed-joke.glitch.me'); // Glitch hosted server
Network.socket = socket;
socket.emit ('initialize');
var self = this;
socket.on ('playerData', function (data) {
self.initializePlayers (data);
});
socket.on ('playerJoined', function (data) {
self.addPlayer(data);
});
socket.on ('playerMoved', function (data) {
self.movePlayer(data);
});
socket.on ('killPlayer', function (data) {
self.removePlayer(data);
});
};
Network.prototype.initializePlayers = function (data) {
this.players = data.players;
Network.id = data.id;
for(var id in this.players){
if(id != Network.id){
this.players[id].entity = this.createPlayerEntity(this.players[id]);
}
}
this.initialized = true;
console.log('initialized');
};
Network.prototype.addPlayer = function (data) {
this.players[data.id] = data;
this.players[data.id].entity = this.createPlayerEntity(data);
};
Network.prototype.movePlayer = function (data) {
if (this.initialized && !this.players[data.id].deleted) {
this.players[data.id].entity.rigidbody.teleport(data.x, data.y, data.z, data.rx, data.ry, data.rz);
}
};
Network.prototype.removePlayer = function (data) {
if (this.players[data].entity) {
this.players[data].entity.destroy ();
this.players[data].deleted = true;
}
};
Network.prototype.createPlayerEntity = function (data) {
var newPlayer = this.other.clone();
newPlayer.enabled = true;
this.other.getParent().addChild(newPlayer);
if (data)
newPlayer.rigidbody.teleport(data.x, data.y, data.z);
return newPlayer;
};
// update code called every frame
Network.prototype.update = function(dt) {
this.updatePosition();
};
Network.prototype.updatePosition = function () {
if (this.initialized) {
var pos = this.player.getPosition();
var rot = this.player.getEulerAngles();
Network.socket.emit('positionUpdate', {id: Network.id, x: pos.x, y: pos.y, z: pos.z, rx: rot.x, ry: rot.y - 180, rz: rot.z});
}
};
And the other part
var PlayerMovement = pc.createScript('playerMovement');
PlayerMovement.attributes.add('speed', { type: 'number', default: 0.09 });
PlayerMovement.prototype.initialize = function () {
var app = this.app;
var camera = app.root.findByName('Camera');
this.cameraScript = camera.script.cameraMovement;
};
// Temp variable to avoid garbarge colleciton
PlayerMovement.worldDirection = new pc.Vec3();
PlayerMovement.tempDirection = new pc.Vec3();
PlayerMovement.prototype.update = function (dt) {
var app = this.app;
var worldDirection = PlayerMovement.worldDirection;
worldDirection.set(0, 0, 0);
var tempDirection = PlayerMovement.tempDirection;
var forward = this.entity.forward;
var right = this.entity.right;
var x = 0;
var z = 0;
if (app.keyboard.isPressed(pc.KEY_A)) {
x -= 1;
}
if (app.keyboard.isPressed(pc.KEY_D)) {
x += 1;
}
if (app.keyboard.isPressed(pc.KEY_W)) {
z += 1;
}
if (app.keyboard.isPressed(pc.KEY_S)) {
z -= 1;
}
if (x !== 0 || z !== 0) {
worldDirection.add(tempDirection.copy(forward).mulScalar(z));
worldDirection.add(tempDirection.copy(right).mulScalar(x));
worldDirection.normalize();
var pos = new pc.Vec3(worldDirection.x * dt, 0, worldDirection.z * dt);
pos.normalize().scale(this.speed);
pos.add(this.entity.getPosition());
var targetY = this.cameraScript.eulers.x + 180;
var rot = new pc.Vec3(0, targetY, 0);
this.entity.rigidbody.teleport(pos, rot);
}
this.entity.anim.setFloat('xDirection', x);
this.entity.anim.setFloat('zDirection', z);
};
I don’t want you guys to finish it, want to learn, love to learn from examples. can’t find those unfortunately, thanks!
