He estado jugando con html5 canvas y me encontré con un problema.

<code>canvas.onmousedown = function(e){
        dragOffset.x = e.x - mainLayer.trans.x;
        dragOffset.y = e.y - mainLayer.trans.y;
        canvas.onmousemove = mouseMove;
}
canvas.onmouseup = function(e){
    canvas.onmousemove = null;
}

canvas.onmouseclick = mouseClick;

function mouseMove(e){
    mainLayer.trans.x = e.x - dragOffset.x;
    mainLayer.trans.y = e.y - dragOffset.y;
    return false;
}

function mouseClick(e){
    // click action
}
</code>

En este código, hago que mi ratón haga clic y arrastre en la vista del lienzo mediante la traducción mediante el desplazamiento del arrastre. Pero también tengo un evento de click. En este momento, cada vez que arrastro mi mouse y lo suelto, se ejecuta onmouseup AND onclick.

¿Hay alguna técnica para hacerlos únicos?