Question

This is a function of a json object. canvas param is a canvas with image loaded and canvasCtx is a context of the canvas. The problem is that when i move the slider, the canvas is edited only once and if i move it again nothing happens. But if i add the strings that i marked, everything works fine. Why?

EditBrightness : function(canvas, canvasCtx)
{
    var image = new Image(); // image that is used as default image for current operation       

    image.onload = function() {         

        var sliderLayout =  "<div header='Brightness'>" + 
                                "<span></span><br />" +
                                "<div></div>" +
                            "</div>";       

        var dialog = $(sliderLayout).dialog();

        $('div', dialog).slider({
            max : 150,
            min : -150,
            change : function (event, ui) {

                var canvas = $("#edit_canvas")[0];       // <-- Those are
                var canvasCtx = canvas.getContext('2d'); // <-- the strings

                $('span', dialog).html(ui.value);

                canvasCtx.drawImage(image, 0, 0);

                Pixastic.process(canvas, "brightness", {
                    brightness : ui.value
                });
            }
        });
    };

    image.src = canvas.toDataURL();
}

Answer 1

Probably because you change canvas, canvasCtx variables which you pass to this method somewhere outside the code which you show us.