javascript - 特定の条件でJavaScript機能を無効にする方法

Question

状況は次のとおりです。キャンバスがあり、マウスダウンで描画します。新しいキャンバスを生成する生成ボタンがあります。もう一度同じ方法で描画できます。しかし、問題は、前のキャンバスをクリックして新しいキャンバスの描画を開始したときです。関数がそこで停止しなければならない新しいキャンバスを描画してはなりません。描画関数は次のとおりです。

canvas.onmousedown = function(e) {
if (!painting) {
    painting = true;
} else {
    painting = false;
}

lastX = e.pageX - this.offsetLeft;
lastY = e.pageY - this.offsetTop;
};

canvas.onmousemove = function(e) {
if (painting) {
    mouseX = e.pageX - this.offsetLeft;
    mouseY = e.pageY - this.offsetTop;

    // find all points between        
    var x1 = mouseX,
        x2 = lastX,
        y1 = mouseY,
        y2 = lastY;


    var steep = (Math.abs(y2 - y1) > Math.abs(x2 - x1));
    if (steep){
        var x = x1;
        x1 = y1;
        y1 = x;

        var y = y2;
        y2 = x2;
        x2 = y;
    }
    if (x1 > x2) {
        var x = x1;
        x1 = x2;
        x2 = x;

        var y = y1;
        y1 = y2;
        y2 = y;
    }

    var dx = x2 - x1,
        dy = Math.abs(y2 - y1),
        error = 0,
        de = dy / dx,
        yStep = -1,
        y = y1;

    if (y1 < y2) {
        yStep = 1;
    }

    for (var x = x1; x < x2; x++) {
        if (steep) {
            ctx.fillRect(y, x, 1, 1);
        } else {
            ctx.fillRect(x, y, 1, 1);
        }

        error += de;
        if (error >= 0.5) {
            y += yStep;
            error -= 1.0;
        }
    }



    lastX = mouseX;
    lastY = mouseY;

}
};

ここに問題の jsfiddle がありますhttp://jsfiddle.net/regeme/eV6kW/3/ どんな助けも素晴らしいでしょう。