socket2.js

    var down = false;
    canvas.addEventListener('mousedown', function (e) {
        down = true;
        ctx.beginPath();
        ctx.moveTo(e.clientX, e.clientY);
        socket.send({
            act: "down",
            x: e.clientX,
            y: e.clientY,
            color: ctx.strokeStyle
        });
    }, false);
    window.addEventListener('mousemove', function (e) {
        if (!down) return;
        console.log(e.clientX, e.clientY);
        ctx.lineTo(e.clientX, e.clientY);
        ctx.stroke();
        socket.send({
            act: "move",
            x: e.clientX,
            y: e.clientY,
        });
    }, false);
    window.addEventListener('mouseup', function (e) {
        if (!down) return;
        ctx.lineTo(e.clientX, e.clientY);
        ctx.stroke();
        ctx.closePath();
        down = false;
        socket.send({
            act: "up",
            x: e.clientX,
            y: e.clientY,
        });
    }, false);