tengo una gran duda, ya temgo mi codigo hecho pero me falta la que al pasar el mouse despues de hacer click dibuje al arrastrar el mouse....

tengo una gran duda, ya temgo mi codigo hecho pero me falta la que al pasar el mouse despues de hacer click dibuje al arrastrar el mouse.

les dejo mi codigo

<
var x;
var y;
var click = 0;
var colorLinea = "red";

document.addEventListener ("mousedown", dibujarMause);
document.addEventListener ("mousemove", moverMouse);
var area = document.getElementById ("dibujo");
var papel = area.getContext ("2d");


dibujarLinea("black", 1,1,1,299, papel);
dibujarLinea("black", 1,299,299,299, papel);
dibujarLinea("black", 299,299,299,1, papel);
dibujarLinea("black", 299,1,1,1, papel);

function dibujarLinea (color, xinicial, yinicial, xfinal, yfinal, lienzo) // anexamos los parametros que cambiaran.
	{
	lienzo.beginPath ();
	lienzo.strokeStyle = color; //no poner entre "" para declarar la variable o parametros anexados al inicio de la funcion
    lienzo.lineWidth = 3;
	lienzo.moveTo(xinicial, yinicial);
	lienzo.lineTo(xfinal, yfinal);
	lienzo.stroke();
    lienzo.closePath ();
    }
    
function dibujarMause (evento){

    
    x = evento.layerX;
    y = evento.layerY;

    if (click == 1){
        dibujarLinea (colorLinea, x ,y, evento.layerX, evento.layerY);
    }
    console.log("tecla de mouse oprimida");
    console.log(evento);
}

function moverMouse (evento){

    x = evento.layerX;
    y = evento.layerY;

    if (click == 1){
        dibujarLinea (colorLinea, x ,y, evento.layerX, evento.layerY);
    }
}>