I'm trying to make a program that would let you draw and send it to other people over internet. I decided to use Socket.io. So, I learned how to use Socket.io and I coded the server.js file.
var io = require("socket.io").listen(8080);
var map = "no";
var angle = 0;
var posx = 0;
var posy = 0;
var color = "";
// All functions that can be called from client
// This happens when user connects
io.sockets.on("connection", function (socket) {
// Telling to the client that connection is established
socket.emit('message', "welcome");
// Clears the canvas for everybody
socket.on("clear", function () {
angle = 0;
posx = 0;
posy = 0;
color = "";
});
// Refresh canvas when somebody draws
socket.on("update", function () {
socket.broadcast.emit(angle, posx, posy, color);
console.log("Sent!");
});
// Handles map choosing
socket.on("chosen", function (data) {
map = data;
});
// Sends map name to client if map is chosen
socket.on("map", function () {
if (map == "no"){
socket.emit('message', "no");
}
else{
socket.emit('message', map);
}
});
// Gets pen's angle from client
socket.on("angle", function (data) {
angle = data;
console.log("Angle from client!");
});
// Gets pen's position on x
socket.on("posx", function (data) {
posx = data;
console.log("PosX from client!");
});
// Gets pen's position on y
socket.on("posy", function (data) {
posy = data;
console.log("PosY from client!");
});
// Gets pen's color
socket.on("color", function (data) {
color = data;
console.log("Color from client!");
});
});
Everything was fine, until the client side event making. The server gets the data and sends it, but I don't really know how to process that data client side. It should cut every piece of data at "," and color at ";". Tried tokenat and sockets slicing, but nope, not working.
And also, Socket eventing seems to destroy this drawing method. I've been struggling with this problem for days and I'm desperate. Any help is highly appreciated!