I am trying to print a user's username when they start drawing on the canvas. I have this right now but it will constantly print the user's username over and over again. Is there any way I can make it only print once and then after they stop the user's username will be removed?
Here is the code I have to send the socket that a user is drawing.
function mouseDragged() {
if (username == undefined || username == null) {
alert("Please enter a username before drawing!");
}
else {
fill(255);
noStroke();
ellipse(mouseX, mouseY, 20, 20);
// Send the mouse coordinates
sendmouse(mouseX, mouseY);
socket.emit('typing', username);
}
}
function sendmouse(xpos, ypos) {
//console.log("sendmouse: " + xpos + " " + ypos);
var data = {
x: xpos,
y: ypos
};
// Send that object to the socket
socket.emit('mouse', data);
}
Then this is the code that sends the data from Server.js to the socket
socket.on('typing', (username) => {
//console.log(username + "is typing...");
socket.broadcast.emit('typing', username);
});
Then here is the code where I print the user is typing.
socket.on('typing', function (username) {
//Adds username to list if they type!
console.log("A user is typing!");
$('#typing').append($('<li>').text(username + "is drawing..."));
}, 1000);
So just to remind, I want the user's username to be printed - like it does now. But I only want it to print once, and then after the user has stopped then the user's username would be removed. Thank you very much for taking your time to read it. :)